| | |
| | | <template> |
| | | <el-dialog title="审核检测方法确认单" :visible="dialogVisible" width="80%" :close-on-click-modal="false" @close="handleClose" |
| | | <el-dialog title="审核检测方法确认单" :visible="dialogVisible" top="5vh" width="90%" @open='open' :close-on-click-modal="false" @close="handleClose" |
| | | v-loading="loading"> |
| | | <div class="approval-dialog"> |
| | | <div class="approval-content"> |
| | |
| | | <span>签字确认</span> |
| | | <el-button type="primary" class="el-icon-plus" @click="openSignature">签名</el-button> |
| | | </div> |
| | | <img v-if="imgSrc" :src="imgSrc" alt="签名" class="signature-preview" /> |
| | | <img v-if="imgSrc" :src="getFullUrl(imgSrc)" alt="签名" class="signature-preview" /> |
| | | </div> |
| | | |
| | | <div slot="footer" class="dialog-footer"> |
| | |
| | | <el-button type="primary" @click="handleConfirm" :disabled="!imgSrc" v-if="type === 'review'">确 认</el-button> |
| | | </div> |
| | | |
| | | <SignatureCanvas :visible="signatureDialogVisible" @confirm="handleSignatureConfirm" /> |
| | | <SignatureCanvas :visible="signatureDialogVisible" @close="signatureDialogVisible=false" @confirm="handleSignatureConfirm" /> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | |
| | | import SignatureCanvas from "@/components/SignatureCanvas.vue"; |
| | | import ApprovalProcess from "@/components/approvalProcess"; |
| | | import { getDetail, sign } from '../service'; |
| | | import {getFullUrl} from '@/utils/utils.js' |
| | | import {queryDetail} from '@/components/service.js' |
| | | |
| | | export default { |
| | | name: "ReviewDialog", |
| | |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | methods: {getFullUrl, |
| | | open(){ |
| | | queryDetail().then(res=>{ |
| | | if(res){ |
| | | this.imgSrc=res.signPicture |
| | | } |
| | | }) |
| | | }, |
| | | async getDetailData() { |
| | | try { |
| | | this.loading = true; |
| | | const res = await getDetail({ id: this.id }); |
| | | console.log('res', res) |
| | | if (res) { |
| | | this.formData = res |
| | | this.formData = { |
| | | ...res, |
| | | confirmSign: getFullUrl(res.confirmSign) |
| | | } |
| | | // 组装流程数据 |
| | | let processData = []; |
| | | // 提交节点 |
| | |
| | | mode: "list", |
| | | fields: [ |
| | | { label: "提交人:", value: res.createBy || "" }, |
| | | { label: ' ', value: res.confirmSign || "", type: 'img' }, |
| | | { label: ' ', value: getFullUrl(res.confirmSign) || "", type: 'img' }, |
| | | { label: "提交时间:", value: res.createTime || "" }, |
| | | ], |
| | | }); |
| | |
| | | mode: "list", |
| | | fields: [ |
| | | { label: "审核人:", value: res.auditPersonName || "" }, |
| | | { label: ' ', value: res.auditSign || "", type: 'img' }, |
| | | { label: ' ', value: getFullUrl(res.auditSign) || "", type: 'img' }, |
| | | { label: "审核时间:", value: res.auditTime || "" }, |
| | | ], |
| | | }); |
| | |
| | | this.$message.error(res.msg || '获取详情失败'); |
| | | } |
| | | } catch (error) { |
| | | console.error('获取详情失败:', error); |
| | | this.$message.error('获取详情失败'); |
| | | // console.error('获取详情失败:', error); |
| | | // this.$message.error('获取详情失败'); |
| | | } finally { |
| | | this.loading = false; |
| | | } |
| | | }, |
| | | handleClose() { |
| | | this.dialogVisible = false; |
| | | this.signatureDialogVisible=false |
| | | this.$emit("close", false); |
| | | this.imgSrc = ""; |
| | | this.formData = { |
| | |
| | | }, |
| | | handleSignatureConfirm(imageData) { |
| | | this.signatureDialogVisible = false; |
| | | this.imgSrc = 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'; |
| | | this.imgSrc = ""; // 先清空 |
| | | this.$nextTick(() => { |
| | | this.imgSrc = imageData; |
| | | }); |
| | | }, |
| | | handleConfirm() { |
| | | if (!this.imgSrc) { |
| | |
| | | this.$message.error(res.msg || '签字失败'); |
| | | } |
| | | }).catch(() => { |
| | | this.$message.error('签字失败'); |
| | | // this.$message.error('签字失败'); |
| | | }); |
| | | }, |
| | | }, |
| | |
| | | } |
| | | |
| | | .approval-flow { |
| | | width: 405px; |
| | | width: 305px; |
| | | background: #ffffff; |
| | | box-shadow: 0px 4px 12px 4px rgba(0, 0, 0, 0.08); |
| | | border-radius: 10px; |
| | | padding: 40px 20px; |
| | | padding: 20px 0px; |
| | | margin: 20px; |
| | | margin-left: 0; |
| | | |
| | |
| | | } |
| | | |
| | | .approval-dialog-approve { |
| | | margin-top: 26px; |
| | | margin-top: 18px; |
| | | padding: 0 20px; |
| | | |
| | | .add-group { |