From d10439fb9e19df8a15d1456c0dbb243bc2240ded Mon Sep 17 00:00:00 2001 From: gaoluyang <2820782392@qq.com> Date: 星期五, 08 八月 2025 14:56:06 +0800 Subject: [PATCH] 1.协同审批-提交时添加签名 --- src/views/collaborativeApproval/approvalProcess/components/approvalDia.vue | 83 +++++++++++++++++++++++++++++++++++++---- 1 files changed, 75 insertions(+), 8 deletions(-) diff --git a/src/views/collaborativeApproval/approvalProcess/components/approvalDia.vue b/src/views/collaborativeApproval/approvalProcess/components/approvalDia.vue index 584a6c2..9b92361 100644 --- a/src/views/collaborativeApproval/approvalProcess/components/approvalDia.vue +++ b/src/views/collaborativeApproval/approvalProcess/components/approvalDia.vue @@ -102,6 +102,10 @@ <div v-if="!activity.isShen" class="node-reason"> <span>瀹℃壒鎰忚锛�</span>{{ activity.approveNodeReason }} </div> + <div v-if="!activity.isShen" class="node-reason"> + <span>绛惧悕锛�</span> + <img :src="activity.urlTem" class="signImg" alt="" v-if="activity.urlTem"/> + </div> <div v-else-if="activity.isShen"> <el-form-item :prop="'activities.' + index + '.approveNodeReason'" @@ -116,7 +120,7 @@ </el-form> <template #footer v-if="operationType === 'approval'"> <div class="dialog-footer"> - <el-button type="primary" @click="openSignatureDialog(2)">涓嶉�氳繃</el-button> + <el-button type="primary" @click="submitForm(2)">涓嶉�氳繃</el-button> <el-button type="primary" @click="openSignatureDialog(1)">閫氳繃</el-button> <el-button @click="closeDia">鍙栨秷</el-button> </div> @@ -152,6 +156,7 @@ import useUserStore from "@/store/modules/user.js"; import {userListNoPageByTenantId} from "@/api/system/user.js"; import { WarningFilled, Edit, Check, MoreFilled } from '@element-plus/icons-vue' +import { getToken } from "@/utils/auth"; const emit = defineEmits(['close']) const { proxy } = getCurrentInstance() @@ -180,6 +185,14 @@ const esign = ref(null); const lineWidth = ref(0); const lineColor = ref("#000000"); + +// 涓婁紶閰嶇疆 +const upload = reactive({ + // 涓婁紶鐨勫湴鍧� + url: import.meta.env.VITE_APP_BASE_API + "/file/upload", + // 璁剧疆涓婁紶鐨勮姹傚ご閮� + headers: { Authorization: "Bearer " + getToken() }, +}); // 鑺傜偣鏍囬 const getNodeTitle = (index, len) => { @@ -215,6 +228,11 @@ activities.value = res.data // 澧炲姞isApproval瀛楁 activities.value.forEach(item => { + if (item.url.includes('word')) { + item.urlTem = item.url.replaceAll('word', 'img') + } else { + item.urlTem = item.url + } if (item.approveNodeStatus === 2) { item.isApproval = '宸查┏鍥�'; } else if (item.approveNodeStatus === 1) { @@ -243,23 +261,67 @@ const confirmSignature = () => { esign.value.generate().then((res) => { console.log(res); - signatureImg.value = res; - signatureDialogVisible.value = false; - clearSignature() - submitForm(submitStatus); + // 灏哹ase64杞崲涓轰簩杩涘埗 + const base64Data = res.split(',')[1]; // 绉婚櫎data:image/png;base64,鍓嶇紑 + const binaryString = atob(base64Data); + const bytes = new Uint8Array(binaryString.length); + for (let i = 0; i < binaryString.length; i++) { + bytes[i] = binaryString.charCodeAt(i); + } + signatureImg.value = bytes; + + // 鍒涘缓鏂囦欢瀵硅薄鐢ㄤ簬涓婁紶 + const blob = new Blob([bytes], { type: 'image/png' }); + const file = new File([blob], 'signature.png', { type: 'image/png' }); + + // 鍒涘缓FormData + const formData = new FormData(); + formData.append('file', file); + + // 涓婁紶绛惧悕鍥剧墖 + fetch(upload.url, { + method: 'POST', + headers: upload.headers, + body: formData + }) + .then(response => response.json()) + .then(data => { + if (data.code === 200) { + console.log('data---', data) + let tempFileIds = []; + tempFileIds.push(data.data.tempId); + signatureDialogVisible.value = false; + clearSignature(); + // 鍙湁閫氳繃鏃舵墠浼犻�掔鍚嶆枃浠禝D + if (submitStatus === 1) { + submitForm(submitStatus, tempFileIds); + } else { + submitForm(submitStatus); + } + } else { + proxy.$modal.msgError("绛惧悕鍥剧墖涓婁紶澶辫触锛�" + data.msg); + } + }) + .catch(error => { + console.error('涓婁紶澶辫触:', error); + proxy.$modal.msgError("绛惧悕鍥剧墖涓婁紶澶辫触"); + }); }).catch((err) => { console.log(err); proxy.$modal.msgWarning("璇峰厛绛惧悕锛�"); }) }; // 鎻愪氦瀹℃壒 -const submitForm = (status) => { +const submitForm = (status, tempFileIds) => { const filteredActivities = activities.value.filter(activity => activity.isShen); filteredActivities[0].approveNodeStatus = status; - filteredActivities[0].signatureImg = signatureImg.value; // 鏂板绛惧悕鍥剧墖瀛楁 + // 鍙湁閫氳繃鏃舵墠闇�瑕佺鍚� + if (status === 1 && tempFileIds) { + filteredActivities[0].tempFileIds = tempFileIds; + } // 鍒ゆ柇鏄惁涓烘渶鍚庝竴姝� const isLast = activities.value.findIndex(a => a.isShen) === activities.value.length-1; - updateApproveNode({ ...filteredActivities[0], isLast, signatureImg: signatureImg.value }).then(() => { + updateApproveNode({ ...filteredActivities[0], isLast }).then(() => { proxy.$modal.msgSuccess("鎻愪氦鎴愬姛"); closeDia(); }); @@ -301,4 +363,9 @@ height: 30px; border-radius: 50px; } +.signImg { + cursor: pointer; + width: 200px; + height: 60px; +} </style> \ No newline at end of file -- Gitblit v1.9.3