<template>
  <el-dialog
    title="首件两检报工"
    :visible.sync="dialogVisible"
    width="60%"
    :before-close="handleClose"
  >
    <div>
      <el-button type="primary" @click="reportBtn"> 报工 </el-button>
      <div class="step-list" v-loading="loading">
        <ele-pro-table
          ref="table"
          row-key="id"
          :columns="columns"
          :datasource="list"
          cache-key="mes-ruleRecordsList-2511172018"
          autoAmendPage
          :need-page="false"
          @refresh="getData"
        >
          <template v-slot:selfCheck="{ row }">
            <el-button>自检请托</el-button>
            <el-button>报工</el-button>
          </template>

          <template v-slot:specialInspection="{ row }">
            <el-button>报工</el-button>
          </template>
        </ele-pro-table>
      </div>
    </div>

    <self-inspection-reporting
      ref="selfReportingRef"
    ></self-inspection-reporting>
    <self-inspection-request ref="selfRequestRef"></self-inspection-request>
    <specialized-inspection-reporting
      ref="specializedRef"
    ></specialized-inspection-reporting>
  </el-dialog>
</template>

<script>
  import {
    getLastRuleRecords,
    getProduceTaskInstanceId
  } from '@/api/producetaskrulerecord/index.js';
  import { pageFirstArticleDualInspectionRecord } from '@/api/firstarticledualinspectionrecord/index.js';

  import dictMixins from '@/mixins/dictMixins';
  import tableColumnsMixin from '@/mixins/tableColumnsMixin';
  import selfInspectionReporting from './components/selfInspectionReporting.vue';
  import selfInspectionRequest from './components/selfInspectionRequest.vue';
  import specializedInspectionReporting from './components/specializedInspectionReporting.vue';

  export default {
    mixins: [dictMixins, tableColumnsMixin],
    components: {
      selfInspectionReporting,
      selfInspectionRequest,
      specializedInspectionReporting
    },
    data() {
      return {
        dialogVisible: false,
        loading: false,
        produceTaskInfo: null,
        workOrder: null,
        butLoad: false,
        list: []
      };
    },
    computed: {
      columns() {
        return [
          {
            width: 50,
            type: 'index',
            columnKey: 'index',
            label: '序号',
            align: 'center'
          },
          {
            prop: 'produceTaskName',
            label: '名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150,
            formatter: (row) => {
              return row.ruleName || row.itemTaskName || row.planConfigName;
            }
          },
          {
            prop: 'produceTaskName',
            label: '工位名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150,
            formatter: (row) => {
              return row.ruleName || row.itemTaskName || row.planConfigName;
            }
          },

          {
            prop: 'produceTaskName',
            label: '设备名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150,
            formatter: (row) => {
              return row.ruleName || row.itemTaskName || row.planConfigName;
            }
          },

          {
            prop: 'finishTime',
            label: '报工人',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150
          },

          {
            prop: 'finishTime',
            label: '报工时间',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150
          },

          {
            prop: 'finishTime',
            label: '状态',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 150
          },

          {
            label: '自检报工',
            align: 'center',
            width: 130,
            fixed: 'right',
            slot: 'selfCheck'
          },
          {
            label: '专检报工',
            align: 'center',
            width: 130,
            fixed: 'right',
            slot: 'specialInspection'
          }
        ];
      }
    },
    methods: {
      open(workOrder, produceTaskInfo) {
        this.workOrder = workOrder;
        this.produceTaskInfo = produceTaskInfo;
        console.log('this.workOrder', this.workOrder);
        console.log('this.produceTaskInfo', this.produceTaskInfo);
        this.dialogVisible = true;
      },
      executeStatusTest(status) {
        switch (status) {
          case 0:
            return '未报工';
          case 1:
            return '执行中';
          default:
            return '已报工';
        }
      },
      // 获取数据
      async getData() {
        this.loading = true;
        const data = await pageFirstArticleDualInspectionRecord({});
        this.list = data.list || [];
        this.loading = false;
      },
      handleClose() {
        this.dialogVisible = false;
        this.$emit('close');
      },
      async handleUpdate() {
        try {
          this.butLoad = true;
          await this.getData();
          // 更新逻辑
          this.$message.success('已更新');
          this.butLoad = false;
        } catch (error) {
          this.butLoad = false;
        }
      },

      reportBtn() {
        // this.$refs.selfRequestRef.open();
        this.$refs.selfReportingRef.open();
      }
    }
  };
</script>

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