<template>
  <view class="content">
    <u-popup mode="center" width="95%" v-model="isshow">
      <uni-table class="badtable" ref="table" border emptyText="">
        <uni-tr v-for="(item, index) in tagslist" :key="index">
          <uni-td>{{ item.label }}</uni-td>
          <uni-td width="50">
            <u-input @blur="changeInput($event, index)" v-model="item.numberall" />
          </uni-td>
          <uni-td>
            <jPicker moren="请选择缺陷分类" sureColor="#ff0000" @bindpicker="selectProductlocCode7($event, item, index)" showKey="label" valKey="value" :val="item.defect" :options="item.defectList" />
            <!-- <u-icon size="28" name="close" @click="cleardefect(item.defect,index)"></u-icon> -->
          </uni-td>
        </uni-tr>
      </uni-table>
      <view style="margin-top: 10px; display: flex; justify-content: space-around">
        <div>
          <u-button style="width: 100px; height: 35px" size="mini" type="error" @click="cancel">取消</u-button>
        </div>
        <div>
          <u-button style="width: 100px; height: 35px" @click="confirm" size="mini" type="primary">确定</u-button>
        </div>
      </view>
    </u-popup>
  </view>
</template>
<script>
import jPicker from '@/components/J-Picker/jPicker.vue';
import model from './model';
//import UniTd from '../uni-table/components/uni-td/uni-td.vue';
export default {
  name: 'badtable',
  components: {
    jPicker,
  },
  data() {
    return {
      model: model,
      isshow: false,
      show: false,
      tagslist: [],
      tagslistcopy: [],
      itemindex: '',
      range: [
        { value: 0, label: '篮球' },
        { value: 1, label: '足球' },
        { value: 2, label: '游泳' },
      ],
    };
  },
  props: ['options', 'moren', 'showKey', 'valKey', 'val', 'position', 'disabled', 'bgColor', 'sureColor', 'focus', 'defectList'],
  methods: {
    async open(item, index) {
      console.log(item, index);
      this.itemindex = index;

      this.tagslist = JSON.parse(JSON.stringify(item.babtype));
      this.tagslist.forEach((item) => {
        item.defectList = [];

        //console.log("item.defectList0```````:", item);
      });
      for (let tag of this.tagslist) {
        await this.model.getdefectList(tag.defectCode);
        tag.defectList = this.model.alldefectList;
      }

      console.log('this.tagslist是什么样的:', this.tagslist);
      this.tagslistcopy = JSON.parse(JSON.stringify(this.tagslist));
      this.isshow = true;
    },
    selectProductlocCode7(e, item, index) {
      this.tagslist[index].defect = e.pickerName.value;
      //item.defect = e.pickerName.value;
      console.log('e:', item);
      console.log('this.tagslist[index]:', this.tagslist[index]);
    },
    changeInput(event, index) {
      if (event === '0') {
        delete this.tagslist[index].defect;
        this.tagslist = JSON.parse(JSON.stringify(this.tagslist));
        console.log(event, index, 'sddww11', this.tagslist, this.tagslist[index].defect, event === '0');
      }
    },

    cancel() {
      this.tagslist = this.tagslistcopy;
      this.tagslist.forEach((item) => {
        if (item.numberall == '') {
          item.numberall = 0;
        }
      });
      this.$emit('bindtypelist', this.tagslist, this.itemindex);
      this.isshow = false;
    },
    confirm() {
      this.tagslist.forEach((item) => {
        if (item.numberall == '') {
          item.numberall = 0;
        }
        console.log('item:', item.defect);
        // if(item.defect == undefined){
        //   item.defect = '';
        // }
        if (item.numberall != 0 && item.defect == undefined) {
          item.defect = '';
        }
        // else if(item.numberall==0 && item.defect == undefined){
        //   item.defect = '';
        // }
      });
      console.log('this.tagslist------:', this.tagslist);
      this.$emit('bindtypelist', this.tagslist, this.itemindex);
      this.isshow = false;
    },
    cleardefect(params, index) {
      this.tagslist[index].defect = undefined;
    },
  },
  computed: {},
};
</script>

<style>
.content {
  overflow: auto;
  padding: 20rpx;
  margin: 30rpx;
}
.badtable {
  padding: 20rpx;
}
</style>
