Commit 3bc97465 by liangjianmin

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

parent ea9cecac
Showing with 61 additions and 15 deletions
...@@ -310,10 +310,11 @@ ...@@ -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 { ...@@ -462,20 +463,54 @@ export default {
}, },
// 提交签署合同 // 提交签署合同
submitSignContract() { submitSignContract() {
this.$http('POST', "/api/purContract/signContract", { contract_id: this.contract_id }).then(res => { var confirmMessage = '';
if (res.code === 0) {
this.$message({ if (this.signContractData.isExistsOldContract == 1) {
message: '签署合同成功', // 存在已签署+有效+电子签的合同,提示2句话
type: 'success', confirmMessage = `
onClose: () => { <div style="text-align: left; padding: 10px;font-size: 14px;">
this.signDialogVisible = false; <div style="color: #FF961C;margin-bottom: 6px;">请注意:</div>
this.getData(); <div style="line-height: 1.5; color: #666;">
} 1、确认签署后,原合同(合同编号:${this.signContractData.pdfInfo && this.signContractData.pdfInfo.orderInfo && this.signContractData.pdfInfo.orderInfo.purchaseNum || ''})将自动变为失效状态,以新签署的合同为准;<br>
}); 2、确认签署后,系统将自动生成【姓名+手机号+签署日期】组成的电子签署加盖合同用章效效。
} else { </div>
this.$message.error(res.msg || '操作失败'); </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 { ...@@ -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
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment