放行单

src/views/bpm/handleTask/components/mesWorkOrderChecklist/detailDialog.vue

@@ -1,444 +1,236 @@
 <template>
   <div style="margin-top: 10px; padding: 0 20px">
     <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
-      <header-title title="基本信息"></header-title>
+      <header-title title="基本信息" />
 
       <el-row :gutter="10">
         <el-col :span="8">
           <el-form-item label="放行单编码">
-            <el-input
-              v-model="form.code"
-              placeholder="系统自动生成"
-              disabled
-            ></el-input>
+            <el-input v-model="form.code" disabled placeholder="系统自动生成" />
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="放行单名称" prop="name">
-            <el-input
-              v-model="form.name"
-              placeholder="请输入"
-              disabled
-            ></el-input>
+            <el-input v-model="form.name" disabled placeholder="请输入" />
           </el-form-item>
         </el-col>
       </el-row>
 
-      <header-title title="物品清单"> </header-title>
-
+      <header-title title="物品清单" />
       <ele-pro-table
         ref="table"
         row-key="userId"
         :columns="ordersColumns"
         :datasource="form.orders"
-      >
-        <!-- <template v-slot:action="{ row }">
-          <el-link icon="el-icon-edit" type="primary" :underline="false"
-            >详情</el-link
-          >
-        </template> -->
-      </ele-pro-table>
-
-      <header-title title="生产放行规则"> </header-title>
+      />
 
+      <header-title title="生产放行规则" />
       <ele-pro-table
-        ref="scTable"
         row-key="id"
         :columns="detailsColumns"
         :datasource="scDetails"
       >
-        <template v-slot:isPass="{ row }">
-          <el-radio-group v-model="row.isPass">
+        <template #isPass="{ row }">
+          <el-radio-group v-model="row.isPass" :disabled="isScDisabled">
             <el-radio :label="1">是</el-radio>
             <el-radio :label="0">否</el-radio>
           </el-radio-group>
         </template>
-        <template v-slot:remark="{ row }">
+
+        <template #remark="{ row }">
           <el-input
-            type="textarea"
             v-model="row.remark"
-            placeholder="请输入备注"
+            type="textarea"
             :rows="1"
-          ></el-input>
+            :disabled="isScDisabled"
+            placeholder="请输入备注"
+          />
         </template>
       </ele-pro-table>
 
-      <!-- <table
-        class="detail-table"
-        key="first-table"
-        style="width: 500px; margin: 15px 0"
-      >
-        <tr>
-          <td>结论</td>
-          <td>
-            <el-radio-group v-model="form.workConclution">
-              <el-radio :label="0">不符合规定</el-radio>
-              <el-radio :label="1">符合规定</el-radio>
-            </el-radio-group>
-          </td>
-        </tr>
-        <tr>
-          <td>验收人</td>
-          <td>
-            <div class="mask-box">
-              <el-input
-                v-model="form.workCheckUserName"
-                placeholder="请输选择验收人"
-                readonly
-              ></el-input>
-            </div>
-          </td>
-        </tr>
-        <tr>
-          <td>验收时间</td>
-          <td>
-            <el-date-picker
-              v-model="form.workCheckTime"
-              type="datetime"
-              placeholder="选择日期时间"
-              style="width: 100%"
-              value-format="yyyy-MM-dd HH:mm:ss"
-            ></el-date-picker>
-          </td>
-        </tr>
-      </table> -->
-
-      <header-title title="质检放行规则"></header-title>
-
+      <header-title title="质检放行规则" />
       <ele-pro-table
-        ref="zjTable"
         row-key="id"
         :columns="detailsColumns"
         :datasource="zjDetails"
       >
-        <template v-slot:isPass="{ row }">
-          <el-radio-group v-model="row.isPass">
+        <template #isPass="{ row }">
+          <el-radio-group v-model="row.isPass" :disabled="isZjDisabled">
             <el-radio :label="1">是</el-radio>
             <el-radio :label="0">否</el-radio>
           </el-radio-group>
         </template>
-        <template v-slot:remark="{ row }">
+
+        <template #remark="{ row }">
           <el-input
-            type="textarea"
             v-model="row.remark"
-            placeholder="请输入备注"
+            type="textarea"
             :rows="1"
-          ></el-input>
+            :disabled="isZjDisabled"
+            placeholder="请输入备注"
+          />
         </template>
       </ele-pro-table>
-
-      <!-- <table
-        class="detail-table"
-        key="tow"
-        style="width: 500px; margin: 15px 0"
-      >
-        <tr>
-          <td>结论</td>
-          <td>
-            <el-radio-group v-model="form.qualityConclution">
-              <el-radio :label="0">不符合规定</el-radio>
-              <el-radio :label="1">符合规定</el-radio>
-            </el-radio-group>
-          </td>
-        </tr>
-        <tr>
-          <td>验收人</td>
-          <td>
-            <div class="mask-box" @click="openSelectUser(1)">
-              <el-input
-                v-model="form.qualityCheckUserName"
-                placeholder="请输选择验收人"
-                readonly
-              ></el-input>
-            </div>
-          </td>
-        </tr>
-        <tr>
-          <td>验收时间</td>
-          <td>
-            <el-date-picker
-              v-model="form.qualityCheckTime"
-              type="datetime"
-              placeholder="选择日期时间"
-              style="width: 100%"
-              value-format="yyyy-MM-dd HH:mm:ss"
-            ></el-date-picker>
-          </td>
-        </tr>
-      </table> -->
     </el-form>
   </div>
 </template>
 
 <script>
   import dictMixins from '@/mixins/dictMixins';
-  import { checklisttemplateGetById } from '@/api/checklisttemplate/index';
   import { checklistrecordGetById } from '@/api/checklistrecord/index';
 
+  /** 常量 */
+  const CHECK_TYPE = {
+    SC: 1, // 生产
+    ZJ: 2 // 质检
+  };
+
   export default {
     mixins: [dictMixins],
-    components: {},
+
     props: {
-      // 业务id
-      businessId: {
-        default: ''
-      }
-    },
-    mounted() {
-      console.log('this.businessId', this.businessId);
-      this.getCheckDetails(this.businessId);
+      businessId: { default: '' },
+      tasks: { type: Array, default: () => [] }
     },
+
     data() {
       const formBaseData = {
         id: null,
         approvalStatus: null,
         checklistType: 0,
         code: '',
-        createUserName: '',
-        details: [],
         name: '',
         orders: [],
-        processInstanceId: '',
-        qualityCheckTime: '',
-        qualityCheckUserId: null,
-        qualityCheckUserName: '',
-        qualityConclution: null,
-        templateId: 0,
-        templateName: '',
-        workCheckTime: '',
-        workCheckUserId: null,
-        workCheckUserName: '',
-        workConclution: null
+        details: [],
+        workConclution: null,
+        qualityConclution: null
       };
 
       return {
-        visible: false,
-        title: '放行申请单',
+        loading: false,
+        nodeType: '',
         formBaseData,
         form: JSON.parse(JSON.stringify(formBaseData)),
-        rules: {
-          name: [
-            { required: true, message: '请输入放行单名称', trigger: 'blur' },
-            { required: true, message: '请输入放行单名称', trigger: 'change' }
-          ]
-        },
-        // 类型 add / edit / detail
-        type: '',
-        // 生产工单查询条件
-        workOrderWhere: {
-          statusList: ['6']
-        },
-        loading: false,
-        butLoading: false,
-        tabOptions: [
-          { key: 'main', name: '放行单详情' },
-          { key: 'bpm', name: '流程详情' }
-        ],
-        // 当前选项
-        activeComp: 'main',
-        showSelectUser: false,
-        // 0 生产验收人 1 质检验收人
-        selectUserType: 0
+        rules: {}
       };
     },
+
+    mounted() {
+      const currentTask = this.tasks.find((v) => v.result === 1);
+      this.nodeType = currentTask?.definitionKey || '';
+      this.getCheckDetails(this.businessId);
+    },
+
     watch: {
       'form.details': {
+        deep: true,
         handler(details) {
-          console.log('details', details);
-          // 区分生产放行规则 质检放行规则
-          // 根据 审核结果修改 结论
-          const scDetails = details.filter((item) => item.checkType == 1);
-          const zjDetails = details.filter((item) => item.checkType == 2);
-
-          // 当workConclution全为1 则为1 否则为0
-          if (scDetails.length > 0) {
-            const allPass = scDetails
-              .map((item) => item.isPass)
-              .every((val) => val === 1);
-            this.form.workConclution = allPass ? 1 : 0;
-          } else {
-            this.form.workConclution = null;
-          }
-
-          if (zjDetails.length > 0) {
-            const allPass = zjDetails
-              .map((item) => item.isPass)
-              .every((val) => val == 1);
-            this.form.qualityConclution = allPass ? 1 : 0;
-          } else {
-            this.form.qualityConclution = null;
-          }
-        },
-        deep: true
+          this.updateConclution(details);
+        }
       }
     },
+
     computed: {
+      /** 表格 columns 不再重复创建 */
       ordersColumns() {
         return [
-          {
-            width: 55,
-            type: 'index',
-            columnKey: 'index',
-            label: '序号',
-            align: 'center'
-          },
-          {
-            prop: 'batchNo',
-            label: '批次号',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'productCode',
-            label: '产品编码',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'productName',
-            label: '产品名称',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'workOrderCode',
-            label: '生产工单号',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'formingNum',
-            label: '数量',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'specification',
-            label: '规格',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'productModel',
-            label: '型号',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          }
-          // ,
-          // {
-          //   label: '操作',
-          //   columnKey: 'action',
-          //   slot: 'action',
-          //   minWidth: 120
-          // }
+          { type: 'index', width: 55, label: '序号', align: 'center' },
+          { prop: 'batchNo', label: '批次号', align: 'center' },
+          { prop: 'productCode', label: '产品编码', align: 'center' },
+          { prop: 'productName', label: '产品名称', align: 'center' },
+          { prop: 'workOrderCode', label: '生产工单号', align: 'center' },
+          { prop: 'formingNum', label: '数量', align: 'center' },
+          { prop: 'specification', label: '规格', align: 'center' },
+          { prop: 'productModel', label: '型号', align: 'center' }
+        ];
+      },
+
+      detailsColumns() {
+        return [
+          { type: 'index', width: 55, label: '序号', align: 'center' },
+          { prop: 'mainIndicatorName', label: '指标名称', align: 'center' },
+          { prop: 'isPass', label: '审核结果', slot: 'isPass' },
+          { prop: 'remark', label: '备注', slot: 'remark' }
         ];
       },
-      // 生产放行规则
+
       scDetails() {
-        return this.form.details.filter((item) => item.checkType == 1);
+        return this.form.details.filter((v) => v.checkType === CHECK_TYPE.SC);
       },
-      // 质检放行规则
+
       zjDetails() {
-        return this.form.details.filter((item) => item.checkType == 2);
+        return this.form.details.filter((v) => v.checkType === CHECK_TYPE.ZJ);
       },
-      detailsColumns() {
-        return [
-          {
-            width: 55,
-            type: 'index',
-            columnKey: 'index',
-            label: '序号',
-            align: 'center'
-          },
-          {
-            prop: 'mainIndicatorName',
-            label: '指标名称',
-            align: 'center',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'isPass',
-            label: '审核结果',
-            align: 'center',
-            slot: 'isPass',
-            minWidth: 110,
-            showOverflowTooltip: true
-          },
-          {
-            prop: 'remark',
-            label: '备注',
-            align: 'center',
-            slot: 'remark',
-            minWidth: 110,
-            showOverflowTooltip: true
-          }
-        ];
+
+      isScDisabled() {
+        return ['qualityApproval', 'leaderApproval'].includes(this.nodeType);
+      },
+
+      isZjDisabled() {
+        return ['workOrderApproval', 'leaderApproval'].includes(this.nodeType);
       }
     },
+
     methods: {
-      // 获取放行单详情
+      /** 获取详情 */
       async getCheckDetails(id) {
         this.loading = true;
         try {
           const data = await checklistrecordGetById(id);
           this.$util.assignObject(this.form, data);
-          console.log('this.form', this.form);
-          this.loading = false;
-        } catch (error) {
+          this.form.details.forEach((d) => (d._originIsPass = d.isPass));
+        } finally {
           this.loading = false;
         }
       },
 
-      getValidate() {
-        return Promise.all([
-          new Promise((resolve, reject) => {
-            this.$refs.form.validate((valid) => {
-              if (!valid) {
-                reject(false);
-              } else {
-                resolve(true);
-              }
-            });
-          }),
-          new Promise((resolve, reject) => {
-            this.$refs.inventoryTable.validateForm((valid) => {
-              if (!valid) {
-                reject(false);
-              } else {
-                resolve(true);
-              }
-            });
-          })
-        ]);
+      /** 统一结论计算 */
+      updateConclution(details) {
+        const calc = (type) => {
+          const list = details.filter((v) => v.checkType === type);
+          if (!list.length) return null;
+          return list.every((v) => v.isPass === 1) ? 1 : 0;
+        };
+
+        this.form.workConclution = calc(CHECK_TYPE.SC);
+        this.form.qualityConclution = calc(CHECK_TYPE.ZJ);
       },
 
+      /** 提交校验 */
       async getTableValue() {
-        try {
-          const invalidItem = this.form.details.find(
-            (item) => item.isPass !== 0 && item.isPass !== 1
-          );
+        const typeMap = {
+          workOrderApproval: CHECK_TYPE.SC,
+          qualityApproval: CHECK_TYPE.ZJ
+        };
 
-          if (invalidItem) {
+        const needCheckType = typeMap[this.nodeType];
+        if (needCheckType) {
+          const invalid = this.form.details.find(
+            (v) => v.checkType === needCheckType && ![0, 1].includes(v.isPass)
+          );
+          if (invalid) {
             this.$message.warning('请先完成所有放行规则的审核结果选择');
             return false;
           }
+        }
 
-          const commitData = {
-            formData: this.form
-          };
-          return commitData;
-        } catch (error) {
-          console.log(error);
+        const changeList = this.form.details
+          .filter((v) => v.isPass !== v._originIsPass)
+          .map((v) => ({
+            id: v.id,
+            isPass: v.isPass,
+            remark: v.remark
+          }));
+
+        if (changeList.some((v) => !v.remark?.trim())) {
+          this.$message.warning('请填写备注');
           return false;
         }
+
+        return {
+          formData: this.form,
+          changeList
+        };
       }
     }
   };

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

@@ -106,13 +106,16 @@
       },
 
       async handleAudit(status) {
+        let { formData, changeList } = await this.getTableValue();
+
+        if (!changeList) return;
+
         let variables = {
           pass: !!status,
-          approvalResultMsg: this.form.reason
+          approvalResultMsg: this.form.reason,
+          details: changeList
         };
 
-        let { formData } = await this.getTableValue();
-
         let API = !!status ? approveTaskWithVariables : rejectTask;
         API({
           id: this.taskId,

src/views/bpm/handleTask/index.vue

@@ -1,6 +1,5 @@
 <template>
   <ele-modal
-  
     :before-close="handleClose"
     :visible.sync="dialogVisible"
     :close-on-click-modal="false"
@@ -9,7 +8,6 @@
     title="处理"
     :maxable="true"
   >
-
     <div class="app-container">
       <!-- 申请信息 -->
       <el-card class="box-card" v-loading="processInstanceLoading">
@@ -26,6 +24,7 @@
             :businessId="listData?.businessId"
             :businessCode="listData?.businessCode"
             :id="listData?.id"
+            :tasks="tasks"
             :processDefinitionId="processInstance.processDefinition.id"
             :taskDefinitionKey="listData?.taskDefinitionKey"
             @activeCompChange="activeCompChange"
@@ -61,10 +60,7 @@
               @submit="submit"
               @handleClose="handleClose"
               ref="subForm"
-
-            ></async-sub-form-component> 
-
-
+            ></async-sub-form-component>
           </div>
           <!-- <div> </div> -->
           <!-- <el-col :span="16" :offset="6">
@@ -127,7 +123,6 @@
           </el-col> -->
         </el-card>
 
-        
         <!-- 审批记录 -->
         <el-card
           class="box-card"
@@ -340,12 +335,10 @@
   // 流程实例的详情页，可用于审批
   export default {
     name: 'ProcessInstanceDetail',
-    components: {
-      
-    },
+    components: {},
     data() {
       return {
-        fullscreen:false,
+        fullscreen: false,
         // 遮罩层
         processInstanceLoading: true,
         dialogVisible: false,
@@ -355,9 +348,9 @@
           pcHandleRouter: '',
           pcViewRouter: '',
           businessId: '', // 业务id
-          businessCode:'',//业务编码
+          businessCode: '', //业务编码
           taskDefinitionKey: '',
-          
+
           taskId: '' //任务编码
         },
 
@@ -473,14 +466,12 @@
           // const bizpath = formCustomCreatePath.pcView;
           // const subpath = formCustomCreatePath.pcHandle;
 
-
-
           Vue.component('async-biz-form-component', (resolve) => {
-            console.log(this.listData.pcViewRouter,'111111');
+            console.log(this.listData.pcViewRouter, '111111');
             require([`@/views${this.listData.pcViewRouter}`], resolve);
           });
           Vue.component('async-sub-form-component', (resolve) => {
-            console.log(this.listData.pcHandleRouter,'22222');
+            console.log(this.listData.pcHandleRouter, '22222');
 
             require([`@/views${this.listData.pcHandleRouter}`], resolve);
           });