kd-aiot-frontend-mes/src/views/batchRecord/components/list.vue

<template>
  <el-card shadow="never">
    <seekPage :seekList="seekList" :maxLength="4" @search="reload"></seekPage>
    <ele-pro-table
      ref="table"
      row-key="id"
      :columns="columns"
      :datasource="datasource"
      cacheKey="batchRecordBefore"
      :cache-key="cacheKeyUrl"
      autoAmendPage
      :pageSize="20"
      height="600px"
    >
      <!-- 操作列 -->
      <!-- 表头工具栏 -->
      <template v-slot:toolbar>
        <el-button
          v-if="
            $hasPermission('mes:producetaskrulerecord:tempsu') ||
            $hasPermission('mes:producetaskrulerecord:tempsus') ||
            $hasPermission('mes:producetaskrecordrulesrecord:saveorupdate') ||
            $hasPermission('mes:producetaskrecordrulesrecord:sus')
          "
          size="small"
          type="primary"
          icon="el-icon-plus"
          class="ele-btn-icon"
          @click="openEdit('add', null)"
        >
          新建
        </el-button>
      </template>

      <template v-slot:code="{ row }">
        <el-link
          type="primary"
          :underline="false"
          @click="openEdit('detail', row)"
        >
          {{ row.code }}
        </el-link>
      </template>

      <template v-slot:action="{ row }">
        <div>
          <el-link
            v-if="
              row.executeStatus == 0 ||
              (row.executeStatus == 1 && row.itemType == 2)
            "
            type="primary"
            :underline="false"
            @click="openEdit('edit', row)"
          >
            编辑
          </el-link>

          <!-- <el-popconfirm
            v-if="
              row.executeStatus == 0 ||
              (row.executeStatus == 1 && row.itemType == 2) ||
              (row.executeStatus == 1 && row.itemType == 3)
            "
            title="确定要报工此记录吗？"
            class="ele-action"
            @confirm="execute(row)"
          >
            <template v-slot:reference>
              <el-link type="primary" :underline="false"> 报工 </el-link>
            </template>
          </el-popconfirm> -->

          <el-link
            type="primary"
            :underline="false"
            @click="openEdit('edit', row)"
            v-if="
              row.executeStatus == 0 ||
              (row.executeStatus == 1 && row.itemType == 2) ||
              (row.executeStatus == 1 && row.itemType == 3)
            "
          >
            报工
          </el-link>

          <el-link
            v-if="
              row.executeStatus == 2 &&
              $hasPermission('mes:producetaskrecordrulesrecord:res')
            "
            type="primary"
            :underline="false"
            @click="openEdit('edit', row)"
          >
            重新报工
          </el-link>

          <el-link
            v-if="row.approvalStatus === 0"
            type="primary"
            :underline="false"
            @click="openApproval(row)"
          >
            提交
          </el-link>

          <el-popconfirm
            v-if="
              row.executeStatus == 0 &&
              $hasPermission('mes:producetaskrecordrulesrecord:logicdelete')
            "
            title="确定要删除此用户吗？"
            class="ele-action"
            @confirm="deleteById(row)"
          >
            <template v-slot:reference>
              <el-link type="danger" :underline="false"> 删除 </el-link>
            </template>
          </el-popconfirm>
        </div>
      </template>
    </ele-pro-table>
    <!-- 编辑添加组件 -->
    <editModal
      ref="detailsRef"
      :reportWorkType="reportWorkType"
      @reload="reload"
    ></editModal>
    <!-- 记录规则 执行 -->
    <releaseRulesDialog
      ref="releaseRulesDialogRef"
      @reload="reload"
      :isTempRecord="1"
    />
    <programRulesDialog
      ref="programRulesDialogRef"
      @reload="reload"
      :isTempRecord="1"
    />

    <taskDialog ref="taskDialogRef" @reload="reload" :isTempRecord="1" />

    <process-submit-dialog
      :processSubmitDialogFlag.sync="processSubmitDialogFlag"
      v-if="processSubmitDialogFlag"
      ref="processSubmitDialogRef"
      @reload="reload"
      :isNotNeedProcess="false"
    ></process-submit-dialog>
  </el-card>
</template>

<script>
  import dictMixins from '@/mixins/dictMixins';
  import tableColumnsMixin from '@/mixins/tableColumnsMixin';
  import {
    producetaskrulerecordPage,
    logicDeleteById,
    saveRuleRecord
  } from '@/api/producetaskrulerecord/index';
  import editModal from './editModal.vue';
  import { parameterGetByCode } from '@/api/system/dictionary-data';
  import releaseRulesDialog from '@/views/produce/components/prenatalExamination/releaseRulesDialog.vue';
  import programRulesDialog from '@/views/produce/components/prenatalExamination/programRulesDialog.vue';
  import taskDialog from '@/views/produce/components/prenatalExamination/taskDialog.vue';
  import processSubmitDialog from '@/components/processSubmitDialog/processSubmitDialog.vue';
  import {
    queryListByWorkOrderId,
    saveOrUpdateAndSubmit
  } from '@/api/producetaskrecordrulesrecord/index.js';

  export default {
    components: {
      editModal,
      releaseRulesDialog,
      programRulesDialog,
      processSubmitDialog,
      taskDialog
    },
    name: 'batchRecordTable',
    mixins: [dictMixins, tableColumnsMixin],
    props: {
      // 1-产前准备，2-过程控制，3-产后检查
      reportWorkType: {
        type: Number,
        default: 1
      }
    },
    data() {
      return {
        // 表格字段
        columns: [
          {
            width: 50,
            type: 'index',
            columnKey: 'index',
            label: '序号',
            align: 'center'
          },
          {
            label: '记录编码',
            prop: 'code',
            minWidth: 150,
            slot: 'code'
          },
          {
            label: '产品编码',
            prop: 'productCode',
            minWidth: 180
          },
          {
            label: '产品名称',
            prop: 'productName',
            minWidth: 180
          },
          {
            label: '批次号',
            prop: 'batchNo',
            minWidth: 150
          },
          {
            label: '生产工单号',
            prop: 'workOrderCode',
            minWidth: 180
          },
          {
            label: '类型',
            prop: 'itemType',
            formatter: (row) => {
              return this.getDictValue('事项类型', row.itemType + '');
            }
          },
          {
            label: '配置执行方式',
            prop: 'executeMethod',
            minWidth: 150,
            formatter: (row) => {
              return this.getDictValue('执行方式', row.executeMethod + '');
            }
          },
          {
            label: '事项名称',
            prop: 'ruleName',
            minWidth: 180,
            formatter: (row) => {
              return row.ruleName || row.itemTaskName;
            }
          },
          {
            label: '记录执行方式',
            prop: 'recordRulesExecuteMethodName',
            minWidth: 180
          },
          {
            label: '状态',
            minWidth: 80,
            prop: 'executeStatus',
            formatter: (row) => {
              switch (row.executeStatus) {
                case 0:
                  return '未报工';
                case 1:
                  return '执行中';
                default:
                  return '已报工';
              }
            }
          },
          {
            label: '审核状态',
            prop: 'approvalStatus',
            minWidth: 90,
            formatter: (row) => {
              switch (row.approvalStatus) {
                case 0:
                  return '未提交';
                case 1:
                  return '审核中';
                case 2:
                  return '审核通过';
                case 3:
                  return '审核不通过';
                case 4:
                  return '终止审核中';
                case 5:
                  return '终止审核通过';
                case 7:
                  return '流程废止';
                default:
                  return '';
              }
            }
          },
          {
            label: '结果',
            prop: 'checkFailed',
            minWidth: 100,
            formatter: (row) => {
              return row.checkFailed == 1 ? '不合格' : '合格';
            }
          },
          {
            label: '创建人',
            prop: 'createUserName',
            minWidth: 150
          },
          {
            label: '创建时间',
            prop: 'createTime',
            minWidth: 150
          },
          {
            label: '操作',
            columnKey: 'action',
            slot: 'action',
            showOverflowTooltip: true,
            minWidth: 150,
            align: 'center',
            fixed: 'right'
          }
        ],
        // 是否展示处理按钮
        showBut: false,
        showReleaseRulesDialog: false,
        processSubmitDialogFlag: false,
        butLoading: false
      };
    },
    computed: {
      seekList() {
        return [
          {
            label: '记录编码:',
            value: 'code',
            type: 'input',
            placeholder: '请输入'
          },
          {
            label: '生产工单号:',
            value: 'workOrderCode',
            type: 'input',
            placeholder: '请输入'
          },
          {
            label: '类型:',
            value: 'itemType',
            type: 'select',
            placeholder: '请选择',
            planList: this.getDictListByName('事项类型')
          },
          {
            label: '产品名称:',
            value: 'productName',
            type: 'input',
            placeholder: '请输入'
          },
          {
            label: '状态:',
            value: 'executeStatus',
            type: 'select',
            placeholder: '请选择',
            planList: [
              {
                label: '未报工',
                value: 0
              },
              {
                label: '执行中',
                value: 1
              },
              {
                label: '已报工',
                value: 2
              }
            ]
          }
        ];
      },
      cacheKeyUrl() {
        return `mes-batchRecordTableRules-reportWorkType-${this.reportWorkType}`;
      }
    },
    created() {
      this.requestDict('事项类型');
      this.requestDict('报工类型');
      this.requestDict('执行方式');
      this.parameterGetByCode();
    },
    methods: {
      // 刷新表格
      reload(where = {}) {
        this.$nextTick(() => {
          this.$refs.table.reload({
            page: 1,
            where,
            reportWorkType: this.reportWorkType,
            recordOrder: [1, 2, 3].includes(this.reportWorkType) ? 1 : ''
          });
        });
      },
      /* 表格数据源 */
      datasource({ page, limit, where, order }) {
        return producetaskrulerecordPage({
          ...where,
          ...order,
          pageNum: page,
          size: limit,
          reportWorkType: this.reportWorkType,
          recordOrder: [1, 2, 3].includes(this.reportWorkType) ? 1 : ''
        });
      },
      // 打开编辑新增
      openEdit(type, row) {
        this.$refs.detailsRef.open(type, row);
      },
      // 删除临时记录
      async deleteById(item) {
        await logicDeleteById(item.id);
        this.$message.warning('删除成功！');
        this.reload();
      },
      // 查询是否显示处理按钮
      async parameterGetByCode() {
        const data = await parameterGetByCode({
          code: 'form_submission_requires_approval',
          moduleCode: 'mes_'
        });
        this.showBut = data?.tenantId == '1';
        console.log('是否显示处理按钮（审批）', this.showBut);
      },
      // 提交审批
      openApproval(row) {
        console.log('row', row);
        this.processSubmitDialogFlag = true;

        // 类型
        let businessType = '';
        if (this.reportWorkType == 1) {
          businessType = '产前准备';
        } else if (this.reportWorkType == 2) {
          businessType = '过程控制';
        } else if (this.reportWorkType == 3) {
          businessType = '产后检查';
        } else {
          businessType = '生产统计';
        }

        this.$nextTick(() => {
          let params = {
            businessId: row.id,
            businessKey: 'mes_produce_task_record_rule_check',
            formCreateUserId: row.createUserId,
            variables: {
              businessCode: row.code,
              businessName: '批记录',
              businessType: businessType
            }
          };
          this.$refs.processSubmitDialogRef.init(params);
        });
      },
      // 执行
      async execute(row) {
        console.log('row', row);

        const currentItem = { ...row, recordId: row.id };

        if (row.itemType == 1) {
          // 设备保养计划相关逻辑
          this.$refs.programRulesDialogRef.init(currentItem, currentItem, {
            name: row.produceTaskName
          });
          return;
        }
        if (row.itemType == 2) {
          return this.releaseRulesSaveOrSubmit(row);
        }

        // 任务确认
        this.saveRuleRecord(row);
      },
      // 任务确认报工
      async saveRuleRecord(row) {
        this.butLoading = true;
        await saveRuleRecord(row);
        this.$message.success('报工成功！');
        this.butLoading = false;
        this.reload();
      },
      // 记录规则报工
      async releaseRulesSaveOrSubmit(row) {
        this.butLoading = true;
        if (row.produceTaskId) {
          const pickDetails = await queryListByWorkOrderId({
            workOrderId: row.workOrderId,
            recordId: row.id,
            produceTaskId: row.produceTaskId,
            ruleId: row.ruleId
          });
          row.pickDetails = pickDetails;
        }
        await saveOrUpdateAndSubmit(row);
        this.$message.success('报工成功！');
        this.butLoading = false;
        this.reload();
      },
      approvalStatusText(row) {
        switch (row.approvalStatus) {
          case 0:
            return '未提交';
          case 1:
            return '审核中';
          case 2:
            return '审核通过';
          case 3:
            return '审核不通过';
          case 4:
            return '终止审核中';
          case 5:
            return '终止审核通过';
          case 7:
            return '流程废止';
          default:
            return '';
        }
      }
    }
  };
</script>

<style lang="scss" scoped></style>