<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="code" 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.name }}
        </template>
      </el-table-column>

      <el-table-column label="型号" prop="modelType">
        <template slot-scope="{ row, $index }">
          {{ row.modelType }}
        </template>
      </el-table-column>

      
      <el-table-column label="外观" width="120" prop="appearance">
        <template slot-scope="{ row, $index }">
          <el-select
            size="mini"
            class="content_num"
            filterable
            v-model="row.extInfo.appearance"
            placeholder="请选择"
            :disabled="isDetails"
          >
            <el-option
              v-for="item in qualityList"
              :label="item.name"
              :value="item.value"
              :key="item.value"
            >
            </el-option>
          </el-select>
        </template>
      </el-table-column>

      <el-table-column label="尺寸" width="120" prop="dimension">
        <template slot-scope="{ row, $index }">
          <el-select
            size="mini"
            class="content_num"
            filterable
            v-model="row.extInfo.dimension"
            placeholder="请选择"
            :disabled="isDetails"
          >
            <el-option
              v-for="item in qualityList"
              :label="item.name"
              :value="item.value"
              :key="item.value"
            >
            </el-option>
          </el-select>
        </template>
      </el-table-column>

      <el-table-column label="规格" prop="specification">
        <template slot-scope="{ row, $index }">
          {{ row.specification }}
        </template>
      </el-table-column>

      <el-table-column label="牌号" type="brandNum">
        <template slot-scope="{ row, $index }">
          {{ row.brandNum }}
        </template>
      </el-table-column>

      <el-table-column label="包装库存" prop="brandNum">
        <template slot-scope="{ row, $index }">
          {{ row.packingCountBase }}/ {{ row.minUnit }}
        </template>
      </el-table-column>

      <el-table-column label="重量" prop="weightUnit">
        <template slot-scope="{ row, $index }">
          <div v-if="row.extInfo.newWeight">
            {{ row.extInfo.newWeight || 0 }} {{ row.extInfo.weightUnit }}</div
          >
          <div v-else>
            {{ row.extInfo.weight || 0 }}
            {{ row.extInfo.weightUnit }}</div
          >
        </template>
      </el-table-column>

      <el-table-column label="刻码" prop="engrave">
        <template slot-scope="{ row, $index }">
          {{ row.extInfo.engrave }}
        </template>
      </el-table-column>

      <el-table-column label="物料代号" prop="materielCode">
        <template slot-scope="{ row, $index }">
          {{ row.extInfo.materielCode }}
        </template>
      </el-table-column>

      <el-table-column width="140" label="设备" prop="deviceId">
        <template slot-scope="{ row, $index }">
          {{ row.deviceName }}
        </template>
      </el-table-column>

      <el-table-column label="炉次号" width="120" prop="heatNumber">
        <template slot-scope="{ row, $index }">
          <el-input
            size="mini"
            class="content_num"
            v-model="row.extInfo.heatNumber"
            placeholder="请输入炉次号"
          />
        </template>
      </el-table-column>


      <el-table-column label="位置" width="110" prop="feedQuantity">
        <template slot-scope="{ row, $index }">
          {{ row.extInfo.position }}
        </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($index)">删除</el-link>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  export default {
    name: 'semiProductJobBom',

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

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

    data() {
      return {
        qualityList: [
          {
            name: '合格',
            value: 1
          },
          {
            name: '不合格',
            value: 2
          }
        ]
      };
    },

    methods: {
      getDelete(index) {
        this.list.splice(index, 1);
      }
    }
  };
</script>

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

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