<template>
  <div>
    <div class="title_box rx-bc mt6">
      <div class="name">报工信息({{ list.length || 0 }})个 </div>
      <div class="rx-bc"> </div>
    </div>

    <el-table
      ref="oneJobQualityBom"
      class="table_content"
      :max-height="600"
      :data="list"
      tooltip-effect="dark"
      style="width: 100%"
      stripe
      border
    >
      <el-table-column label="序号" type="index" width="55">
        <template slot-scope="{ row, $index }">
          {{ $index + 1 }}
        </template>
      </el-table-column>

      <el-table-column label="名称" prop="name" minWidth="110">
        <template slot-scope="{ row, $index }">
          {{ row.name }}
        </template>
      </el-table-column>

      <el-table-column label="货位" prop="code" minWidth="110">
        <template slot-scope="{ row, $index }"> </template>
      </el-table-column>

      <el-table-column label="产品编码" prop="name" minWidth="110">
        <template slot-scope="{ row, $index }">
          {{ row.code }}
        </template>
      </el-table-column>

      <el-table-column label="数量" prop="name" minWidth="110">
        <template slot-scope="{ row, $index }">
          {{ row.feedQuantity }}
        </template>
      </el-table-column>

      <el-table-column label="是否合格" width="110" prop="isQualified">
        <template slot-scope="{ row, $index }">
          <el-select
            size="mini"
            class="content_num"
            v-model="row.extInfo.isQualified"
            filterable
            placeholder="请选择"
            disabled
          >
            <el-option
              v-for="item in isQualifiedList"
              :label="item.name"
              :value="item.code"
              :key="item.code"
            >
            </el-option>
          </el-select>
        </template>
      </el-table-column>

      <el-table-column
        label="操作"
        fixed="right"
        width="60px"
        v-if="!isDetails"
      >
        <template slot-scope="{ $index, row }">
          <el-link type="danger" @click="getDelete(row, $index)">质检</el-link>
        </template>
      </el-table-column>
    </el-table>

    <!-- 质检 -->
    <el-dialog
      title="质检数"
      :visible.sync="dialogVisible"
      width="300"
      :before-close="handleClose"
    >
      <el-form ref="form" :model="form" label-width="90px">
        <el-form-item label="产品编码">
          <el-input
            v-model="form.code"
            disabled
            style="width: 230px"
          ></el-input>
        </el-form-item>
        <el-form-item label="质检名称">
          <el-input
            v-model="form.qualityParam"
            disabled
            style="width: 230px"
          ></el-input>
        </el-form-item>
        <el-form-item label="质检结果参数">
          <el-input
            v-model="form.qualityParam"
            size="mini"
            disabled
            style="width: 230px"
          ></el-input>
        </el-form-item>
        <el-form-item label="质检结果">
          <el-select
            size="mini"
            class="content_num"
            v-model="form.isQualified"
            filterable
            placeholder="请选择"
            :disabled="isDetails"
            style="width: 230px"
            @change="changeIsQualified"
          >
            <!--  -->
            <el-option
              v-for="item in isQualifiedList"
              :label="item.name"
              :value="item.code"
              :key="item.code"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="不合格原因" v-if="form.isQualified == 2">
          <el-input
            v-model="form.notReason"
            size="mini"
            style="width: 230px"
            @input="inputValue"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="asyncgetQualityParam"
          >确 定</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import { getTaskInstanceList } from '@/api/produce/job';

  export default {
    name: 'semiProductJobBom',

    props: {
      item: {
        type: Object,
        default: () => {}
      },
      equipmentList: {
        type: Array,
        default: () => []
      },

      isDetails: {
        type: Boolean,
        default: false
      }
    },

    data() {
      return {
        // qualityList: [
        //   {
        //     name: '合格',
        //     value: 1
        //   },
        //   {
        //     name: '不合格',
        //     value: 2
        //   }
        // ]
        dialogVisible: false,
        list: [],
        stepsList: [],
        form: {
          isQualified: '',
          notReason: '',
          notType: null,
          qualityParam: []
        },
        index: null,

        isQualifiedList: [
          {
            code: 1,
            name: '合格'
          },
          {
            code: 2,
            name: '不合格'
          }
        ],

        notTypeList: [
          {
            code: 1,
            name: '返工'
          },
          {
            code: 2,
            name: '返修'
          },
          {
            code: 3,
            name: '报废'
          },
          {
            code: 4,
            name: '降级使用'
          },
          {
            code: 5,
            name: '让步接收'
          },
          {
            code: 6,
            name: '留样'
          },
          {
            code: 7,
            name: '消耗'
          },
          {
            code: 8,
            name: '回用'
          },
          {
            code: 9,
            name: '转试销'
          }
        ]
      };
    },

    created() {
      // this.getTaskFn();
    },

    methods: {
      open(res) {
        console.log(res, '5555555555');
        this.list = res;
        this.index = null;
        console.log(this.list, '66666666');
      },

      handleClose() {
        this.dialogVisible = false;
      },

      inputValue() {
        this.list[this.index].extInfo.notReason = this.form.notReason;
      },

      changeIsQualified(e) {
        console.log(this.list, this.index, '5555556666');

        // this.list[this.index].extInfo = this.form;

        this.list[this.index].extInfo.isQualified = e;
      },
      // getTaskFn() {
      //   getTaskInstanceList(this.item.workOrderId).then((res) => {
      //     this.stepsList = res;
      //   });
      // },
      asyncgetQualityParam() {
        this.dialogVisible = false;
        // this.List[this.index].extInfo = this.form;
      },

      // 质检
      getDelete(row, index) {
        console.log(index, '555555555');

        this.form = row;
        this.dialogVisible = true;
        this.index = index;
      }
    }
  };
</script>

<style lang="scss" scoped>
  .materialBor {
    border: 1px solid #157a2c;
  }

  .content_num {
    --input-background-color: #f0f8f2;
  }
</style>
