kd-aiot-frontend-mes/src/views/produceOrder/components/recordRules/recordRules.vue

<template>
  <div>
    <ele-pro-table
      :columns="columns"
      :datasource="datasource"
      cacheKey="mes-recordRules-25113-031018"
      ref="tableRef"
    >
      <template v-slot:toolbar>
        <el-select
          v-model="reportWorkType"
          placeholder="请选择"
          @change="reload"
        >
          <el-option
            v-for="item in reportWorkTypeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </template>
      <template v-slot:action="{ row }">
        <el-link
          type="primary"
          :underline="false"
          icon="el-icon-view"
          @click="openDetils(row)"
        >
          详情
        </el-link>
      </template>
    </ele-pro-table>

    <programRulesDialog
      ref="programRulesDialogRef"
      :dialogTitle="dialogTitle"
      @reload="reload"
    />

    <releaseRulesDialog ref="releaseRulesDialogRef" @reload="reload" />

    <taskDialog ref="taskDialogRef" @reload="reload" />
  </div>
</template>

<script>
  import tableColumnsMixin from '@/mixins/tableColumnsMixin';
  import dictMixins from '@/mixins/dictMixins';
  import {
    producetaskrulerecordPage,
    getProduceTaskInstanceId
  } from '@/api/producetaskrulerecord/index.js';
  import taskDialog from '@/views/produce/components/prenatalExamination/taskDialog.vue';
  import releaseRulesDialog from '@/views/produce/components/prenatalExamination/releaseRulesDialog.vue';
  import programRulesDialog from '@/views/produce/components/prenatalExamination/programRulesDialog.vue';

  export default {
    name: 'recordRules',
    components: {
      programRulesDialog,
      releaseRulesDialog,
      taskDialog
    },
    props: {
      produceTaskId: {
        type: String,
        required: true
      },
      // 工单信息
      workOrderInfo: {
        type: Object,
        required: true
      }
    },
    mixins: [tableColumnsMixin, dictMixins],
    data() {
      return {
        columns: [
          {
            columnKey: 'index',
            type: 'index',
            width: 45,
            align: 'center'
          },
          {
            prop: 'produceTaskName',
            label: '工序名称',
            align: 'center'
          },
          {
            prop: 'itemType',
            label: '类型',
            align: 'center',
            formatter: (row) => {
              return this.getDictValue('记录规则事项类型', row.itemType);
            }
          },
          {
            prop: 'executeMethod',
            label: '配置执行方式',
            align: 'center',
            formatter: (row) => {
              return this.getDictValue('记录规则执行方式', row.executeMethod);
            }
          },
          {
            prop: 'ruleName',
            label: '名称',
            align: 'center',
            formatter: (row) => {
              return row.ruleName || row.itemTaskName;
            }
          },
          {
            prop: 'executeStatus',
            label: '执行状态',
            align: 'center',
            formatter: (row) => {
              switch (row.executeStatus) {
                case 0:
                  return '未报工';
                case 1:
                  return '执行中';
                default:
                  return '已报工';
              }
            }
          },
          {
            columnKey: 'action',
            label: '操作',
            width: 150,
            align: 'center',
            resizable: false,
            slot: 'action',
            showOverflowTooltip: true,
            fixed: 'right'
          }
        ],
        reportWorkType: 1,
        reportWorkTypeOptions: [
          { label: '产前准备', value: 1 },
          { label: '过程控制', value: 2 },
          { label: '产后检查', value: 3 }
        ],
        dialogTitle: ''
      };
    },
    watch: {
      produceTaskId(newVal) {
        this.reload();
      }
    },
    methods: {
      datasource({ page, limit, where }) {
        return this.getList(page, limit);
      },
      async getList(pageNum, pageSize) {
        const [data, produceTaskInstanceInfo] = await await Promise.all([
          producetaskrulerecordPage({
            workOrderCode: this.workOrderInfo.code,
            produceTaskId: this.produceTaskId,
            reportWorkType: this.reportWorkType,
            isTempRecord: 0,
            pageNum,
            pageSize
          }),
          getProduceTaskInstanceId(this.workOrderInfo.id, this.produceTaskId)
        ]);

        data.list = data.list.map((i) => {
          // 工序名称
          i.produceTaskName = produceTaskInstanceInfo.name;
          i.produceTaskInstanceId = produceTaskInstanceInfo.id;
          return i;
        });

        console.log('list', data.list);
        return data.list;
      },
      reload() {
        this.$refs.tableRef.reload();
      },
      openDetils(item) {
        console.log('this.workOrderInfo', this.workOrderInfo);
        console.log('item', item);

        if (item.itemType == 1) {
          // 设备保养计划相关逻辑
          this.dialogTitle = '设备保养计划';
          this.$refs.programRulesDialogRef.init(item, this.workOrderInfo);
        } else if (item.itemType == 2) {
          this.$refs.releaseRulesDialogRef.openView(item, this.workOrderInfo);
        } else {
          // 任务确认
          this.$refs.taskDialogRef.openView(item, this.workOrderInfo);
        }
      }
    }
  };
</script>

<style></style>