feat: 添加合同签署确认弹窗，动态提示用户签署信息，提升用户体验

src/views/OrderTrack/goodsDetail.vue

@@ -310,10 +310,11 @@
 import Vue from 'vue';
 import Vue from 'vue';
 import Tool from '../../tool'
 import Tool from '../../tool'
 import Menu from "@/components/menu.vue";
 import Menu from "@/components/menu.vue";
-import { Col, Message, Pagination, Row, Table, TableColumn, Select, Option, Link, Upload, Tooltip, Dialog } from 'element-ui';
+import { Col, Message, MessageBox, Pagination, Row, Table, TableColumn, Select, Option, Link, Upload, Tooltip, Dialog } from 'element-ui';
 import { NODE_ENVS } from "../../ajax";
 import { NODE_ENVS } from "../../ajax";
 
 
 Vue.prototype.$message = Message;
 Vue.prototype.$message = Message;
+Vue.prototype.$confirm = MessageBox.confirm;
 Vue.use(Pagination);
 Vue.use(Pagination);
 Vue.use(TableColumn).use(Table).use(Row).use(Col).use(Select).use(Option).use(Link).use(Upload).use(Tooltip).use(Dialog);
 Vue.use(TableColumn).use(Table).use(Row).use(Col).use(Select).use(Option).use(Link).use(Upload).use(Tooltip).use(Dialog);
 export default {
 export default {
@@ -462,20 +463,54 @@ export default {
     },
     },
     // 提交签署合同
     // 提交签署合同
     submitSignContract() {
     submitSignContract() {
-      this.$http('POST', "/api/purContract/signContract", { contract_id: this.contract_id }).then(res => {
-        if (res.code === 0) {
-          this.$message({
-            message: '签署合同成功',
-            type: 'success',
-            onClose: () => {
-              this.signDialogVisible = false;
-              this.getData();
-            }
-          });
-        } else {
-          this.$message.error(res.msg || '操作失败');
-        }
-      })
+      var confirmMessage = '';
+      
+      if (this.signContractData.isExistsOldContract == 1) {
+        // 存在已签署+有效+电子签的合同，提示2句话
+        confirmMessage = `
+          <div style="text-align: left; padding: 10px;font-size: 14px;">
+            <div style="color: #FF961C;margin-bottom: 6px;">请注意：</div>
+            <div style="line-height: 1.5; color: #666;">
+              1、确认签署后，原合同（合同编号：${this.signContractData.pdfInfo && this.signContractData.pdfInfo.orderInfo && this.signContractData.pdfInfo.orderInfo.purchaseNum || ''}）将自动变为失效状态，以新签署的合同为准；<br>
+              2、确认签署后，系统将自动生成【姓名+手机号+签署日期】组成的电子签署加盖合同用章效效。
+            </div>
+          </div>
+        `;
+      } else {
+        // 不存在已签署+有效+电子签的合同，提示1句话
+        confirmMessage = `
+          <div style="text-align: left; padding: 10px;font-size: 14px;">
+            <div style="color: #FF961C;margin-bottom: 6px;">请注意：</div>
+            <div style="line-height: 1.5; color: #666;">
+              确认签署后，系统将自动生成【姓名+手机号+签署日期】组成的电子签署加盖合同用章效效。
+            </div>
+          </div>
+        `;
+      }
+      
+      this.$confirm(confirmMessage, '确认签署', {
+        confirmButtonText: '确定签署',
+        cancelButtonText: '取消',
+        dangerouslyUseHTMLString: true,
+        customClass: 'sign-confirm-dialog'
+      }).then(() => {
+        this.$http('POST', "/api/purContract/signContract", { contract_id: this.contract_id }).then(res => {
+          if (res.code === 0) {
+            this.$message({
+              message: '签署合同成功',
+              type: 'success',
+              onClose: () => {
+                this.signDialogVisible = false;
+                this.getData();
+              }
+            });
+          } else {
+            this.$message.error(res.msg || '操作失败');
+          }
+        })
+      }).catch(() => {
+        // 用户取消签署
+      });
     },
     },
     // 监听合同内容滚动事件，滚动到底部时启用签署按钮
     // 监听合同内容滚动事件，滚动到底部时启用签署按钮
     handleScroll(event) {
     handleScroll(event) {
@@ -508,4 +543,14 @@ export default {
   background-color: #a0cfff !important;
   background-color: #a0cfff !important;
   border-color: #a0cfff !important;
   border-color: #a0cfff !important;
 }
 }
+</style>
+
+<style>
+.sign-confirm-dialog {
+  width: 574px !important;
+}
+
+.sign-confirm-dialog .el-message-box {
+  width: 574px !important;
+}
 </style>
 </style>
\ No newline at end of file