feat(bpm): 新增质检报告模板组件及API接口，支持模板预览和审批操作

src/api/bpm/components/qmsreporttemplate/index.js

@@ -0,0 +1,61 @@
+import request from '@/utils/request';
+
+// 资质列表查询
+export async function getProfessionCertificationPageList(params) {
+  const res = await request.get(`/main/professionCertification/page`, {
+    params
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// /main/qmsreporttemplate/page 报表模板分页查询 get
+export async function getQmsReportTemplatePageList(params) {
+  const res = await request.get(`/main/qmsreporttemplate/page`, {
+    params
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// /main/qmsreporttemplate/delet 报表模板删除 post
+export async function deleteQmsReportTemplate(data) {
+  const res = await request.delete(`/main/qmsreporttemplate/delete`, {
+    data
+  });
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// /main/qmsreporttemplate/getById/{id}
+export async function getQmsReportTemplateById(id) {
+  const res = await request.get(`/main/qmsreporttemplate/getById/${id}`);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// /main/qmsreporttemplate/save 报表模板保存 post
+export async function saveQmsReportTemplate(data) {
+  const res = await request.post(`/main/qmsreporttemplate/save`, data);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}
+
+// /main/qmsreporttemplate/update 报表模板更新 put
+export async function updateQmsReportTemplate(data) {
+  const res = await request.put(`/main/qmsreporttemplate/update`, data);
+  if (res.data.code == 0) {
+    return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/views/bpm/handleTask/components/inspectionReportTemplate/edit.vue

@@ -0,0 +1,136 @@
+<template>
+  <div>
+    <el-form ref="formRef" :model="addForm" :rules="rules" label-width="100px">
+      <el-form-item label="模板名称" prop="name">
+        <el-input
+          v-model.trim="addForm.name"
+          placeholder="请输入模板名称"
+          disabled
+        />
+      </el-form-item>
+      <el-form-item label="模板编码" prop="code">
+        <el-input
+          v-model.trim="addForm.code"
+          placeholder="请输入模板编码"
+          disabled
+        />
+      </el-form-item>
+      <el-form-item label="模板" prop="template">
+        <el-button
+          type="primary"
+          size="mini"
+          icon="el-icon-plus"
+          @click="preview('add')"
+          >预览</el-button
+        >
+      </el-form-item>
+      <el-form-item label="是否默认" prop="isDefault">
+        <el-switch
+          v-model="addForm.isDefault"
+          :active-value="1"
+          :inactive-value="0"
+          disabled
+        />
+      </el-form-item>
+
+      <el-form-item label="备注" prop="remark">
+        <el-input
+          v-model.trim="addForm.remark"
+          type="textarea"
+          :rows="3"
+          placeholder="请输入备注"
+          maxlength="200"
+          disabled
+          show-word-limit
+        />
+      </el-form-item>
+    </el-form>
+    <preview ref="previewRef" @reload="reload"></preview>
+  </div>
+</template>
+
+<script>
+  import dictMixins from '@/mixins/dictMixins';
+  import preview from './preview.vue';
+  import { getQmsReportTemplateById } from '@/api/bpm/components/qmsreporttemplate/index';
+
+  export default {
+    mixins: [dictMixins],
+    components: { preview },
+    data() {
+      const formBaseData = {
+        code: '',
+        id: null,
+        isEnabled: 0,
+        name: '',
+        remark: '',
+        type: 0,
+        isDefault: 0, // 是否启用(1:默认；0：否)
+        valueJson: {}, // 模板内容
+        template: ''
+      };
+
+      return {
+        visible: false,
+        type: 'add',
+        title: '表单弹窗',
+        formBaseData,
+        addForm: JSON.parse(JSON.stringify(formBaseData)),
+        loading: false,
+        saving: false,
+        template: '',
+        rules: {
+          name: [
+            { required: true, message: '请输入模板名称', trigger: 'blur' }
+          ],
+          code: [
+            { required: true, message: '请输入模板编码', trigger: 'blur' },
+            {
+              min: 1,
+              max: 50,
+              message: '长度在 1 到 50 个字符',
+              trigger: 'blur'
+            }
+          ],
+          remark: [
+            { max: 200, message: '备注最多 200 个字符', trigger: 'blur' }
+          ]
+        }
+      };
+    },
+    props: {
+      businessId: {
+        type: String,
+        default: ''
+      }
+    },
+    mounted() {
+      this.getDetail();
+    },
+    methods: {
+      // 获取详情
+      async getDetail() {
+        this.loading = true;
+        const data = await getQmsReportTemplateById(this.businessId);
+        this.addForm = Object.assign({}, this.formBaseData, data || {});
+        this.addForm.template = this.addForm.valueJson.template;
+      },
+
+      preview(row) {
+        this.$refs.previewRef.open(this.addForm.template);
+      }
+    }
+  };
+</script>
+
+<style scoped lang="scss">
+  :deep(.el-form) {
+    .el-form-item:last-child {
+      margin-bottom: 22px !important;
+    }
+  }
+  :deep(.el-row) {
+    display: flex;
+    flex-wrap: wrap;
+  }
+</style>

src/views/bpm/handleTask/components/inspectionReportTemplate/preview.vue

@@ -0,0 +1,48 @@
+<template>
+  <ele-modal
+    title="预览模板"
+    :visible.sync="visible"
+    :close-on-click-modal="false"
+    resizable
+    maxable
+    append-to-body
+  >
+    <div>
+      <div v-html="template"></div>
+    </div>
+
+    <template v-slot:footer>
+      <el-button @click="visible = false">返回</el-button>
+    </template>
+  </ele-modal>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+        visible: false,
+        template: ''
+      };
+    },
+    methods: {
+      // 打开弹窗
+      open(template) {
+        this.visible = true;
+        this.template = template;
+      }
+    }
+  };
+</script>
+
+<style scoped lang="scss">
+  :deep(.el-form) {
+    .el-form-item:last-child {
+      margin-bottom: 22px !important;
+    }
+  }
+  :deep(.el-row) {
+    display: flex;
+    flex-wrap: wrap;
+  }
+</style>

src/views/bpm/handleTask/components/inspectionReportTemplate/submit.vue

@@ -0,0 +1,146 @@
+<template>
+  <el-col :span="16" :offset="6">
+    <el-form label-width="100px" ref="formRef" :model="form">
+      <el-form-item
+        label="审批建议"
+        style="margin-bottom: 20px"
+        :rules="{
+          required: true,
+          message: '请选择',
+          trigger: 'change'
+        }"
+      >
+        <el-input
+          type="textarea"
+          v-model="form.reason"
+          placeholder="请输入审批建议"
+        />
+      </el-form-item>
+    </el-form>
+    <div style="margin-left: 10%; margin-bottom: 20px; font-size: 14px">
+      <el-button
+        icon="el-icon-edit-outline"
+        type="success"
+        size="mini"
+        @click="handleAudit(1)"
+        >通过
+      </el-button>
+
+      <el-button
+        icon="el-icon-circle-close"
+        type="danger"
+        size="mini"
+        @click="rejectTask(0)"
+        >驳回
+      </el-button>
+    </div>
+  </el-col>
+</template>
+
+<script>
+  import {
+    approveTaskWithVariables,
+    rejectTask,
+    cancelTask
+  } from '@/api/bpm/task';
+
+  // 流程实例的详情页，可用于审批
+  export default {
+    name: '',
+
+    props: {
+      businessId: {
+        default: ''
+      },
+      taskId: {
+        default: ''
+      },
+      id: {
+        default: ''
+      },
+      taskDefinitionKey: {
+        default: ''
+      }
+    },
+    data() {
+      return {
+        form: {
+          reason: ''
+        }
+      };
+    },
+    created() {},
+    methods: {
+      /** 处理转办审批人 */
+      handleUpdateAssignee() {
+        this.$emit('handleUpdateAssignee');
+      },
+      /** 退回 */
+      handleBackList() {
+        this.$emit('handleBackList');
+      },
+
+      async handleAudit(status) {
+        let API = !!status ? approveTaskWithVariables : rejectTask;
+        API({
+          id: this.taskId,
+          reason: this.form.reason,
+          variables: {
+            pass: !!status
+          }
+        }).then((res) => {
+          if (res.data.code != '-1') {
+            this.$emit('handleAudit', {
+              status,
+              title: status === 0 ? '驳回' : ''
+            });
+          }
+        });
+      },
+      rejectTask(status) {
+        rejectTask({
+          id: this.taskId,
+          reason: this.form.reason,
+          variables: {
+            pass: !!status
+          }
+        }).then((res) => {
+          if (res.data.code != '-1') {
+            this.$emit('handleAudit', {
+              status,
+              title: '驳回'
+            });
+          }
+        });
+      },
+
+      //更多
+      handleCommand(command) {
+        if (command === 'cancel') {
+          this.$confirm('是否确认作废？', {
+            type: 'warning',
+            cancelButtonText: '取消',
+            confirmButtonText: '确定'
+          })
+            .then(() => {
+              cancelTask({
+                id: this.id,
+                taskId: this.taskId,
+                reason: this.form.reason,
+                businessId: this.businessId
+              })
+                .then(() => {
+                  this.$emit('handleClose');
+                })
+                .catch(() => {
+                  this.$message.error('流程作废失败');
+                });
+            })
+            .catch(() => {});
+        }
+      }
+    }
+  };
+</script>
+
+<style lang="scss"></style>