<template>
  <ht-org-selector
    v-model="value"
    :validate="validate"
    :name="name"
    :placeholder="placeholder"
    :permission="permission"
    :single="single"
    :config="config"
    :data="data"
    :table-columns="tableColumns"
    :pagination="pagination"
    :demensions="demensions"
    :default-demension="defaultDemension"
    :orgs="orgs"
    :load-org-tree="loadOrgTree"
    @load="handleLoad"
    @valueChange="valueChange"
    @changeDemension="changeDemension"
    @loadDemensions="loadDemensions"
    @loadOrgs="loadOrgs"
    select-label="name"
    quick-search-props="name,code"
  />
</template>
<script>
import selector from "@/api/selector.js";
import req from "@/api/sysType.js";

export default {
  name: "my-role-selector",
  props: {
    validate: [String, Object],
    value: String,
    name: String,
    placeholder: String,
    permission: String,
    single: Boolean,
    config: Object
  },
  data() {
    return {
      data: [],
      demensions: [],
      defaultDemension: "",
      orgs: [],
      tableColumns: [
        { prop: "name", label: "名称", width: "120" },
        { prop: "code", label: "编码", width: "120" },
        { prop: "pathName", label: "路径", width: "260" }
      ],
      pagination: {
        page: 1,
        pageSize: 50,
        total: 0
      },
      orgLength: 0
    };
  },
  mounted() {},
  methods: {
    loadDemensions() {
      setTimeout(() => {
        this.demensions = [
          { id: 1, demName: "行政维度1" },
          { id: 2, demName: "分公司维度" }
        ];
        this.defaultDemension = 1;
      }, 2000);
    },
    handleLoad(param, cb) {
      this.$message("输入关键字查询组织");
      selector
        .getOrgs(param)
        .then(response => {
          this.data = response.rows;
          this.pagination.page = response.page;
          this.pagination.pageSize = response.pageSize;
          this.pagination.total = response.total;
          cb();
        })
        .catch(err => {
          cb();
        });
    },
    valueChange(value) {
      this.$emit("input", value);
    },
    loadOrgTree(node, resolve) {
      // 组织节点点击事件 异步加载组织
      this.$message("组织节点点击事件 请异步加载组织");
      let _this = this;

      req.getSysTypeData({}).then(function(data) {
        // _this.orgs = data;
        var resultData = [{ id: node.id, name: "组织" + node.id }];
        if (_this.orgLength > 2) {
          resultData = [];
        }
        _this.orgLength++;
        resolve(resultData);
      });
    },
    changeDemension(currentDimension) {
      // 维度改变 重新获取组织
      this.$message("维度改变 请重新获取组织");
    },
    loadOrgs(org) {
      // 根据组织获取用户
      this.$message("加载组织");
    }
  }
};
</script>
