kd-aiot-frontend-qms/src/views/inspectionProjectRequest/index.vue

<template>
  <div class="ele-body">
    <el-card shadow="never">
      <!-- 搜索表单 -->
      <search @search="reload" />
      <!-- 数据表格 -->
      <ele-pro-table
        ref="table"
        :columns="columns"
        :datasource="datasource"
        :selection.sync="selection"
        row-key="code"
        :page-size="20"
        @columns-change="handleColumnChange"
        :cache-key="cacheKeyUrl"
      >
        <!-- 表头工具栏 -->
        <template v-slot:qualityType="{ row }">
          {{ getDictValue('质检计划类型', row.qualityType) }}
        </template>
        <template v-slot:qualityMode="{ row }">
          {{ getDictValue('取样类型', row.qualityMode) }}
        </template>

        <template v-slot:code="{ row }">
          <el-link
            type="primary"
            :underline="false"
            @click="report(row, 'detail')"
            >{{ row.code }}</el-link
          >
        </template>
        <template v-slot:approvalStatus="{ row }">
          <el-link
            v-if="row.processInstanceId"
            type="primary"
            :underline="false"
            @click="bpmDetailOpen(row, 'detail')"
            >{{ reviewStatus[row.approvalStatus] }}
          </el-link>
          <span v-else> {{ reviewStatus[row.approvalStatus] }}</span>
        </template>

        <!-- 操作列 -->
        <template v-slot:action="{ row }">
          <el-link
            type="primary"
            :underline="false"
            icon="el-icon-edit"
            @click="openEdit(row)"
            v-if="
              [0, 3].includes(row.approvalStatus) &&
              pageName == 'inspectionProjectRequest'
            "
          >
            编辑
          </el-link>
          <el-link
            type="primary"
            :underline="false"
            v-if="
              [0, 3].includes(row.approvalStatus) &&
              pageName == 'inspectionProjectRequest'
            "
            @click="approvalSubmit(row)"
            >提交</el-link
          >
          <!-- <el-link
            type="primary"
            :underline="false"
            v-if="
              [2].includes(row.approvalStatus) &&
              pageName == 'inspectionProjectEntrusted' &&
              row.status == 0
            "
            @click="sampleCollection(row)"
            >收样</el-link
          > -->
          <el-link
            type="primary"
            :underline="false"
            v-if="
              [2].includes(row.approvalStatus) &&
              pageName == 'inspectionProjectEntrusted' &&
              row.status == 1
            "
            @click="report(row, 'edit')"
            >报工</el-link
          >
          <el-link
            type="primary"
            :underline="false"
            v-if="
              [2].includes(row.approvalStatus) &&
              pageName == 'inspectionProjectEntrusted' &&
              row.status == 1
            "
            @click="openTransfer(row)"
            >转派</el-link
          >
          <!-- <el-link
            v-if="row.qualityWorkOrderId"
            type="primary"
            :underline="false"
            @click="craftFiles(row.qualityWorkOrderId)"
            >工艺文件</el-link
          > -->
          <el-link
            type="danger"
            :underline="false"
            icon="el-icon-edit"
            @click="remove(row)"
            v-if="
              [0, 3].includes(row.approvalStatus) &&
              pageName == 'inspectionProjectRequest'
            "
          >
            删除
          </el-link>
        </template>
      </ele-pro-table>
    </el-card>
    <!-- 编辑弹窗 -->
    <inspectionProjectTaskSend
      ref="inspectionProjectTaskSendRef"
      @reload="reload"
    />
    <!-- 编辑弹窗 -->
    <inspectionProjectReport
      ref="inspectionProjectReportRef"
      @reload="reload"
    />
    <processSubmitDialog
      :processSubmitDialogFlag.sync="processSubmitDialogFlag"
      v-if="processSubmitDialogFlag"
      ref="processSubmitDialogRef"
      @reload="reload"
    ></processSubmitDialog>
    <Transfer
      v-if="transferVisible"
      :transferVisible.sync="transferVisible"
      @success="transferConfirm"
      :id="transferId"
    ></Transfer>
    <ele-modal
      :visible.sync="bpmDetailShow"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      append-to-body
      width="70%"
      :maxable="true"
    >
      <bpmDetail
        v-if="bpmDetailShow && processInstanceId"
        :id="processInstanceId"
      ></bpmDetail>
      <template v-slot:footer>
        <el-button @click="bpmDetailShow = false">关闭</el-button>
      </template>
    </ele-modal>
  </div>
</template>

<script>
  import search from './components/search.vue';
  import Transfer from './components/transfer.vue';

  import tabMixins from '@/mixins/tableColumnsMixin';
  import inspectionProjectTaskSend from '@/views/inspectionProjectTask/components/inspectionProjectTaskSend.vue';
  import inspectionProjectReport from '@/views/inspectionWork/components/inspectionProjectReport.vue';

  import {
    getList,
    sampleCollection,
    getById,
    verificationQualityInspector,
    removeItem
  } from '@/api/inspectionProjectRequest';
  import { craftFiles } from '@/api/inspectionWork';
  import dictMixins from '@/mixins/dictMixins';
  import { reviewStatus } from '@/enum/dict';
  import processSubmitDialog from '@/components/processSubmitDialog/processSubmitDialog.vue';
  import bpmDetail from '@/views/bpm/processInstance/detail.vue';
  import { recordingMethodList } from '@/utils/util.js';

  export default {
    components: {
      search,
      inspectionProjectTaskSend,
      processSubmitDialog,
      inspectionProjectReport,
      Transfer,
      bpmDetail
    },
    props: {
      cacheKeyUrl: {
        type: String,
        default: 'qsm-c2e9664a-inspectionProjectRequest'
      },
      pageName: {
        type: String,
        default: 'inspectionProjectRequest'
      }
    },
    mixins: [dictMixins, tabMixins],
    data() {
      return {
        processSubmitDialogFlag: false,
        transferVisible: false,
        reviewStatus,
        transferId: '',
        processInstanceId: '',
        bpmDetailShow: false,
        // 表格列配置
        columns: []
      };
    },
    created() {
      this.requestDict('质检计划类型');
      this.requestDict('取样类型');
      this.getColumns();
    },
    methods: {
      bpmDetailOpen(row) {
        this.bpmDetailShow = true;
        this.processInstanceId = row.processInstanceId;
      },
      getColumns() {
        this.columns = [
          {
            columnKey: 'index',
            label: '序号',
            type: 'index',
            width: 55,
            align: 'center',
            showOverflowTooltip: true,
            fixed: 'left'
          },
          {
            prop: 'code',
            slot: 'code',
            label: '请托单号',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 130
          },
          {
            prop: 'name',
            label: '任务名称',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },

          {
            prop: 'receiveDeptName',
            label: '接收部门',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },

          {
            prop: 'receiveUserName',
            minWidth: 110,
            label: '接收人员',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'executeDeptName',
            label: '执行部门',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },

          {
            prop: 'executeUserName',
            minWidth: 110,
            label: '执行人员',
            align: 'center',
            showOverflowTooltip: true
          },

          {
            prop: 'requiredCompletionTime',
            minWidth: 110,
            label: '完成日期',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'urgent',
            minWidth: 110,
            label: '紧急程度',
            align: 'center',
            formatter: (row) => {
              return row.urgent == 1
                ? '普通'
                : row.urgent == 2
                ? '紧急'
                : '重要';
            },
            showOverflowTooltip: true
          },
          {
            prop: 'qualityWorkOrderCode',
            minWidth: 110,
            label: '质检工单编码',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'qualityWorkOrderName',
            minWidth: 110,
            label: '质检工单名称',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'sourceCode',
            minWidth: 110,
            label: '来源单号',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'qualityType',
            slot: 'qualityType',
            minWidth: 110,
            label: '类型',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            slot: 'qualityMode',
            prop: 'qualityMode',
            minWidth: 110,
            label: '质检方式',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'productCode',
            minWidth: 110,
            label: '编码',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'productName',
            minWidth: 110,
            label: '名称',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'batchNo',
            minWidth: 110,
            label: '批次号',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'specification',
            minWidth: 110,
            label: '规格',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'brandNo',
            minWidth: 110,
            label: '牌号',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'produceTaskName',
            minWidth: 110,
            label: '工序名称',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'recordingMethod',
            label: '记录方法',
            align: 'center',
            formatter: (row) => {
              return (
                recordingMethodList.find(
                  (item) => item.value == row.recordingMethod
                )?.label || ''
              );
            },
            width: 130,
            showOverflowTooltip: true
          },
          {
            prop: 'status',
            minWidth: 110,
            label: '状态',
            align: 'center',
            formatter: (row) => {
              return row.status == 1
                ? '未报工'
                : row.status == 2
                ? '已报工'
                : '';
            },
            showOverflowTooltip: true
          },
          {
            prop: 'approvalStatus',
            slot: 'approvalStatus',
            label: '审核状态',
            align: 'center',
            minWidth: 110,
            showOverflowTooltip: true
          },
          {
            prop: 'createUserName',
            minWidth: 110,
            label: '创建人',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'createTime',
            minWidth: 110,
            label: '创建时间',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'approvalUserName',
            minWidth: 110,
            label: '审核人',
            align: 'center',
            // isNone: this.pageName != 'inspectionProjectEntrusted',
            showOverflowTooltip: true
          },
          {
            prop: 'approvalTime',
            minWidth: 110,
            label: '审核时间',
            align: 'center',
            // isNone: this.pageName != 'inspectionProjectEntrusted',
            showOverflowTooltip: true
          },
          {
            prop: 'sampleReceiverName',
            minWidth: 110,
            label: '收样人',
            align: 'center',
            // isNone: this.pageName != 'inspectionProjectEntrusted',
            showOverflowTooltip: true
          },
          {
            prop: 'sampleReceiverTime',
            minWidth: 110,
            label: '收样时间',
            // isNone: this.pageName != 'inspectionProjectEntrusted',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            columnKey: 'action',
            label: '操作',
            width: 220,
            align: 'center',
            resizable: false,
            slot: 'action',
            fixed: 'right',
            showOverflowTooltip: true
          }
        ].filter((item) => !item.isNone);
      },
      approvalSubmit(res) {
        this.processSubmitDialogFlag = true;
        this.$nextTick(() => {
          let params = {
            businessId: res.id,
            businessKey: 'quality_inspection_item_entrustment',
            formCreateUserId: res.createUserId,
            variables: {
              businessCode: res.code,
              businessName: res.name,
              businessType: '请托'
            }
          };
          this.$refs.processSubmitDialogRef.init(params);
        });
      },
      /*回显类型 */

      /* 表格数据源 */
      datasource({ page, where, limit }) {
        return getList({
          ...where,
          pageNum: page,
          size: limit
        });
      },
      /* 刷新表格 */
      reload(where) {
        this.$refs.table.reload({ page: 1, where: where });
      },

      /* 打开编辑弹窗 */
      openEdit(row) {
        this.$refs.inspectionProjectTaskSendRef.open(
          row,
          '2',
          'inspectionProjectRequest'
        );
      },
      /* 报工 */
      async report(row, type) {
        if (type != 'detail') {
          const code = await verificationQualityInspector(row.id);
          if (code == '-1') {
            return;
          }
        }

        const res = await getById(row.id);
        this.$refs.inspectionProjectReportRef.open(
          {
            workData: { ...res, measureUnit: res.sampleMeasureUnit },
            list: res.templateList
          },
          type,
          'inspectionProjectRequest'
        );
      },
      // async craftFiles(id) {
      //   if (id) {
      //     const data = await craftFiles(id);
      //     if (data.length) {
      //       this.$nextTick(() => {
      //         this.$refs.fileListRef.open(
      //           data.map((item) => item.id),
      //           'view'
      //         );
      //       });
      //     }
      //   }
      // },
      async sampleCollection(row) {
        const code = await verificationQualityInspector(row.id);
        if (code == '-1') {
          return;
        }

        sampleCollection({ id: row.id }).then((res) => {
          this.$message.success('收样成功');
          this.reload();
        });
      },
      async openTransfer(row) {
        const code = await verificationQualityInspector(row.id);
        if (code == '-1') {
          return;
        }
        this.transferVisible = true;
        this.transferId = row.id;
      },
      transferConfirm() {
        this.transferVisible = false;
        this.$message.success('转派成功');
        this.reload();
      },
      /* 删除 */
      remove(row) {
        const loading = this.$loading({ lock: true });

        removeItem([row.id])
          .then((msg) => {
            loading.close();
            this.$message.success('删除' + msg);
            this.reload();
          })
          .catch((e) => {
            loading.close();
          });
      }
    }
  };
</script>