gaoluyang
2025-08-08 d6863f0b1490a527e5b02b99e859035b86ea088d
src/views/collaborativeApproval/approvalProcess/components/approvalDia.vue
@@ -116,17 +116,34 @@
      </el-form>
      <template #footer v-if="operationType === 'approval'">
        <div class="dialog-footer">
          <el-button type="primary" @click="submitForm(2)">不通过</el-button>
          <el-button type="primary" @click="submitForm(1)">通过</el-button>
          <el-button type="primary" @click="openSignatureDialog(2)">不通过</el-button>
          <el-button type="primary" @click="openSignatureDialog(1)">通过</el-button>
          <el-button @click="closeDia">取消</el-button>
        </div>
      </template>
    </el-dialog>
    <!-- 电子签名弹窗(vue3-signature-pad) -->
    <el-dialog v-model="signatureDialogVisible" title="电子签名" width="600px" append-to-body>
         <vueEsign
            ref="esign"
            class="mySign"
            :width="800"
            :height="300"
            :isCrop="isCrop"
            :lineWidth="lineWidth"
            :lineColor="lineColor"
         />
      <div style="margin-top:10px;">
        <el-button @click="clearSignature">清除</el-button>
        <el-button type="primary" @click="confirmSignature">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script setup>
import {getCurrentInstance, reactive, ref, toRefs} from "vue";
import { getCurrentInstance, reactive, ref, toRefs } from "vue";
import vueEsign from "vue-esign";
import {
   approveProcessDetails,
   getDept,
@@ -156,6 +173,14 @@
   },
});
const { form } = toRefs(data);
const signatureDialogVisible = ref(false);
const signatureImg = ref('');
let submitStatus = null; // 临时存储通过/不通过状态
const isCrop = ref("");
const esign = ref(null);
const lineWidth = ref(0);
const lineColor = ref("#000000");
// 节点标题
const getNodeTitle = (index, len) => {
  if (index === len - 1) return '结束';
@@ -205,17 +230,40 @@
      productOptions.value = res.data;
   });
};
// 打开签名弹窗
const openSignatureDialog = (status) => {
  submitStatus = status;
  signatureDialogVisible.value = true;
};
// 清除签名
const clearSignature = () => {
   esign.value.reset();
};
// 确认签名
const confirmSignature = () => {
   esign.value.generate().then((res) => {
      console.log(res);
      signatureImg.value = res;
      signatureDialogVisible.value = false;
      clearSignature()
      submitForm(submitStatus);
   }).catch((err) => {
      console.log(err);
      proxy.$modal.msgWarning("请先签名!");
   })
};
// 提交审批
const submitForm = (status) => {
  const filteredActivities = activities.value.filter(activity => activity.isShen);
  filteredActivities[0].approveNodeStatus = status
  filteredActivities[0].approveNodeStatus = status;
  filteredActivities[0].signatureImg = signatureImg.value; // 新增签名图片字段
  // 判断是否为最后一步
  const isLast = activities.value.findIndex(a => a.isShen) === activities.value.length-1;
  updateApproveNode({ ...filteredActivities[0], isLast }).then(() => {
  updateApproveNode({ ...filteredActivities[0], isLast, signatureImg: signatureImg.value }).then(() => {
    proxy.$modal.msgSuccess("提交成功");
    closeDia();
  })
}
  });
};
// 关闭弹框
const closeDia = () => {
  proxy.resetForm("formRef");