<template>
  <!-- 添加类别弹窗 -->
  <el-dialog
    title="添加分类"
    :visible.sync="showAddSelect"
    :show-close="false"
    width="40%"
    :close-on-click-modal="false"
  >
    <!-- 列表 -->
    <div class="table">
      <el-table
        v-loading="listLoading"
        :data="dataList"
        element-loading-text="Loading"
        border
        fit
        highlight-current-row
        stripe
        @selection-change="selectionChangeFn"
      >
        <el-table-column type="selection" width="55" align="center"> </el-table-column>
        <el-table-column
          align="center"
          label="编码"
          prop="number"
          min-width="160"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          align="center"
          label="类别名称"
          prop="name"
          min-width="160"
          show-overflow-tooltip
        ></el-table-column>
      </el-table>
    </div>

    <div slot="footer" class="dialog-footer">
      <el-button @click="cancelFn">取 消</el-button>
      <el-button type="primary" @click="btnOK">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { getProductCategoryKingDeeCategoryList, getProductCategoryAddSub } from '@/api/basic_data/material'
export default {
  props: {
    showAddSelect: {
      type: Boolean,
      required: true
    },
    dataCategory: {
      type: Object,
      default: {}
    },
    data: {
      type: Array,
      default: []
    }
  },
  data() {
    return {
      dataList: null, // 列表数据
      listLoading: false, // 列表加载loading
      arr: []
    }
  },
  created() {
    // this.getDataList();
  },
  methods: {
    //获取选择的数据
    selectionChangeFn(v) {
      console.log(v)
      this.arr = v.map(item => {
        return { kingDeeCategoryId: item.id }
      })
    },
    //获取列表数据
    async getDataList() {
      const res = await getProductCategoryKingDeeCategoryList()
      this.dataList = res.data
    },
    //取消
    cancelFn() {
      this.$emit('update:showAddSelect', false)
    },
    //确定
    async btnOK() {
      console.log(this.data)
      let res = this.data.map(v => {
        return { kingDeeCategoryId: v.kingDeeCategoryId }
      })

      let data = {
        productCategoryId: this.dataCategory.productCategoryId,
        productCategoryName: this.dataCategory.productCategoryName,
        productCategoryNumber: this.dataCategory.productCategoryNumber,
        items: [...this.arr, ...res]
      }
      await getProductCategoryAddSub(data)
      this.$message.success('新增成功')
      this.$emit('updateList', this.dataCategory.productCategoryId)
      this.$emit('update:showAddSelect', false)
    }
  }
}
</script>

<style></style>
