<template>
  <div class="org_tree_select">
    <a-tree-select
      v-model="orgId"
      show-search
      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
      :placeholder="$t('请选择所属机构')"
      :allowClear="isClear"
      tree-default-expand-all
      :treeDataSimpleMode="true"
      treeNodeFilterProp="label"
      :treeData="orgList"
      @change="changeOrg"
    >
    </a-tree-select>
  </div>
</template>
<script>
  const $appService = require('w-vue-basis/src/api/appService');

  export default {
    props: {
      value: {
        type: String,
        default: undefined,
      },
      isDefault: {
        type: Boolean,
        default: false,
      },
      isClear: {
        type: Boolean,
        default: true,
      },
    },
    watch: {
      value() {
        this.orgId = this.value;
      },
    },
    data() {
      return {
        orgId: this.value,
        orgList: [],
        curData: {},
      };
    },
    created() {
      this.getOrgList();
    },
    methods: {
      getOrgList() {
        $appService
          .getSysOrgTree({
            pageNum: 1,
            pageSize: 1000000,
          })
          .then((req) => {
            this.orgList = req.data.map((item) => {
              return {
                label: item.orgName,
                value: item.orgId,
                id: item.orgId,
                pId: item.parentOrg,
                orgCode: item.orgCode,
              };
            });
            if (this.isDefault && this.orgList.length > 0) {
              this.orgId = this.orgList[0].value;
              this.curData = this.orgList[0];
              this.$emit('input', this.orgId);
            }
          });
      },
      changeOrg() {
        this.curData = this.orgList.find((v) => {
          return v.value == this.orgId;
        });
        this.$emit('input', this.orgId);
        // this.$emit("update");
        this.$emit('change', this.curData);
      },
    },
  };
</script>
