order-ui-pc/src/components/globalComponents/all-organize/main.vue

<template>
  <el-cascader
    style="width: 100%"
    :disabled="disabled"
    :placeholder="placeholder"
    v-model="value"
    :options="options"
    :size="size || 'medium'"
    @change="selectChange"
    :props="{
      expandTrigger: 'hover',
      children: 'child',
      multiple: multiple,
      checkStrictly: checkStrictly,
    }"
  ></el-cascader>
</template>

<script>
import asyncRequest from "@/apis/components/all-organize";
import resToken from "@/mixins/resToken";
export default {
  name: "AllOrganize",
  mixins: [resToken],
  props: [
    "size",
    "value",
    "placeholder",
    "isDetail",
    "disabled",
    "names",
    "multiple",
    "checkStrictly",
  ],
  /**
   * 属性集合
   * @param {String}        size             : 组件大小            非必填
   * @param {Array}         value            : 选中值              必填
   * @param {String}        placeholder      : 提示信息            非必填
   * @param {Boolean}       isDetail          : 是否是详情逻辑       必填
   * @param {Boolean}       disabled         : 是否禁用            必填
   * @param {Boolean}       multiple         : 是否多选            必填
   * @param {Boolean}       checkStrictly    : 是否选择任意一项     必填
   *
   */
  /**
   * 事件集合
   * @searchChange             : 选中值变化调用   抛出选中数据
   */
  data() {
    return {
      options: [],
      code: [],
      selectLoading: false,
      searchName: "",
    };
  },
  watch: {
    isDetail: function (val, old) {
      if (this.isDetail !== val) {
        this.options = [];
        this.selectLoading = false;
        this.getList();
      }
    },
  },
  created() {
    this.options = [];
    this.selectLoading = false;
    this.getList();
  },
  methods: {
    async selectChange(e) {
      this.$emit("searchChange", e);
    },
    async getList() {
      this.options = [];
      const res = await asyncRequest.list({});
      if (res && res.code === 0 && res.data) {
        this.options = res.data;
        this.recursion(this.options);
      } else {
        this.options = [];
      }
    },
    recursion(list) {
      list.map((v) => {
        if (v && Array.isArray(v.child)) {
          v.value = v.id + "";
          v.label = v.name;
          if (v.child.length === 0) {
            delete v["child"];
          } else {
            this.recursion(v.child);
          }
        }
        return v;
      });
    },
  },
};
</script>

<style>
</style>