supply-front/src/views/basic_data/material/components/classify_list-small.vue

<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>