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

<template>
  <div class="ele-body">
    <el-card shadow="never">
      <!-- <patrolSearch @search="search"></patrolSearch> -->
      <seek-page
        :seekList="seekList"
        @search="search"
        :maxLength="4"
        style="margin-bottom: 15px"
      ></seek-page>
      <ele-pro-table
        ref="table"
        row-key="id"
        :columns="columns"
        :datasource="datasource"
        :cache-key="cacheKeyUrl"
        autoAmendPage
      >
        <template v-slot:toolbar> </template>
        <template v-slot:code="{ row }">
          <el-link
            type="primary"
            :underline="false"
            @click="openWorkOrderReport('detail', row)"
          >
            {{ row.code }}
          </el-link>
        </template>
        <template v-slot:action="{ row }">
          <el-link
            v-if="row.executeStatus == 1"
            type="primary"
            :underline="false"
            @click="openWorkOrderReport('add', row)"
          >
            报工
          </el-link>

          <el-link
            v-if="row.executeStatus == 1"
            type="primary"
            :underline="false"
            @click="openRedeployOther(row)"
          >
            转派
          </el-link>
        </template>
      </ele-pro-table>
    </el-card>

    <redeployOther ref="redeployOtherRef" @refresh="reload"></redeployOther>

    <workOrderReport
      ref="programRulesDialogRef"
      @refresh="reload"
    ></workOrderReport>
  </div>
</template>

<script>
  import dictMixins from '@/mixins/dictMixins';
  import tableColumnsMixin from '@/mixins/tableColumnsMixin';
  import { producetaskrulerecordQueryRecordWorkOrderPage } from '@/api/recordRules/index';
  import programRulesDialog from './programRulesDialog.vue';
  import patrolSearch from './patrol-search.vue';
  import redeployOther from './redeployOther.vue';
  import workOrderReport from './workOrderReport.vue';

  export default {
    mixins: [dictMixins, tableColumnsMixin],
    components: {
      programRulesDialog,
      patrolSearch,
      redeployOther,
      workOrderReport
    },
    data() {
      return {
        columns: [
          {
            columnKey: 'index',
            label: '序号',
            type: 'index',
            width: 55,
            align: 'center',
            showOverflowTooltip: true,
            fixed: 'left'
          },
          {
            prop: 'code',
            label: '工单单号',
            align: 'center',
            minWidth: 150,
            slot: 'code'
          },
          {
            prop: 'planCode',
            label: '计划单号',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150
          },
          {
            prop: 'ruleName',
            label: '记录规则名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: '',
            label: '记录部门',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              if (row.planExecuteType == 0) {
                return Array.from(new Set((row.executeUsers || []).map(i => i.groupName).filter(v => v))).join(',');
              }
              return '';
            }
          },
          {
            prop: '',
            label: '负责人',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              if (row.planExecuteType == 0) {
                return row.executeUsers.map((i) => i.userName).join(',');
              }
              return '';
            }
          },
          {
            prop: 'executeUser',
            label: '班组',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              if (row.planExecuteType == 1) {
                return row.executeUsers.map((i) => i.teamName).join(',');
              }
              return '';
            }
          },
          {
            prop: 'workshopAreaName',
            label: '车间名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              return row.itemTypeName;
            }
          },
          {
            prop: 'createTime',
            label: '工单生成时间',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'checkStartTime',
            label: '检查开始时间',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'checkFinishTime',
            label: '检查结束时间',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'duration',
            label: '工时',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              // 	工时，单位：毫秒，转换为小时显示
              if (row.duration) {
                return (row.duration / 3600000).toFixed(2);
              }
              return '';
            }
          },
          {
            prop: 'executeStatus',
            label: '状态',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              const statusMap = {
                0: '未报工',
                1: '执行中',
                2: '已执行'
              };
              return statusMap[row.executeStatus] || '';
            }
          },
          {
            columnKey: 'action',
            label: '操作',
            width: 220,
            align: 'center',
            resizable: false,
            fixed: 'right',
            slot: 'action',
            showOverflowTooltip: true
          }
        ],
        cacheKeyUrl: 'mes-2511241029-batchrecord-workorder-workorder'
      };
    },
    computed: {
      seekList() {
        return [
          {
            label: '工单单号',
            value: 'code',
            type: 'input',
            placeholder: '请输入'
          },
          {
            label: '计划单号',
            value: 'planCode',
            type: 'input',
            placeholder: '请输入'
          },
          {
            label: '记录规则名称',
            value: 'ruleName',
            type: 'input',
            placeholder: '请输入',
            labelWidth: 110
          },
          {
            label: '状态',
            value: 'executeStatus',
            type: 'select',
            placeholder: '请输入',
            planList: [
              { value: 0, label: '未报工' },
              { value: 1, label: '执行中' },
              { value: 2, label: '已执行' }
            ]
          }
          // {
          //   label: '生成时间',
          //   value: 'time',
          //   type: 'date',
          //   dateType: 'daterange'
          // }
        ];
      }
    },
    created() {},
    methods: {
      // 刷新表格
      reload(where = {}) {
        this.$refs.table.reload({
          where
        });
      },
      /* 表格数据源 */
      datasource({ page, limit, where, order }) {
        // 参数
        const body = {
          ...where,
          ...order,
          pageNum: page,
          size: limit
        };
        return producetaskrulerecordQueryRecordWorkOrderPage(body);
      },
      search(where) {
        console.log('where', where);
        if (where.time) {
          where.createTimeStart = where.time[0];
          where.createTimeEnd = where.time[1];
          where.time = null;
        }
        this.reload(where);
      },
      openRedeployOther(row) {
        this.$refs.redeployOtherRef.open(row, 'transfer');
      },
      // 报工
      openWorkOrderReport(type, row) {
        this.$refs.programRulesDialogRef.open(type, row);
      }
    }
  };
</script>

<style></style>