<template>
  <div>
    <div class="orgTreeSlideMenu">
      <FormBlock :title="$t('module.chooseOrg.departmentInfo')">
        <el-tree :data="baseData" :props="defaultProps"  show-checkbox :load="loadNode" :empty-text="$t('module.chooseOrg.addDepartmentInfo')" highlight-current check-strictly lazy node-key="orgId" ref="orgTree"  :render-content="renderContent" :expand-on-click-node="false">
        </el-tree>
      </FormBlock>
    </div>
  </div>
</template>
<style lang="less">
.orgTreeSlideMenu {
  float: left;
  width:30%;
  height: 100%;
}

.orgTreeSlideMenuContent {
  float: right;
  width: 68%;
  height: 100%;
}
</style>
<script>
export default {
  components: {

  },
  props: {
    companyId: {
      type: String,
      default() {
        return '';
      }
    },
    companyName: {
      type: String,
      default() {
        return '';
      }
    }
  },
  data() {
    const validateCompanyCode = (rule, value, callback) => {
      if (value === "") {
        callback(new Error(this.$t('module.chooseOrg.enterCode')));
      } else if (value.length > 50) {
        callback(new Error(this.$t('module.chooseOrg.codeMaxFifty')));
      } else if (!new RegExp("^[a-zA-z0-9]+$").test(value)) {
        callback(new Error(this.$t('module.chooseOrg.codeContain')));
      }
      callback();
    };
    const validateCompanyName = (rule, value, callback) => {
      if (value === "") {
        callback(new Error(this.$t('module.chooseOrg.enterName')));
      } else if (value != value.trim()) {
        callback(new Error(this.$t('module.chooseOrg.nameNoblank')));
      } else if (value.length > 50) {
        callback(new Error(this.$t('module.chooseOrg.nameMaxFifty')));
      }
      callback();
    };
    const validateCompanyDesc = (rule, value, callback) => {
      if (value != null && value != value.trim() && value.trim() === "") {
        callback(new Error(this.$t('module.chooseOrg.enterLegalDesc')));
      }
      if (value != null && value.length > 200) {
        callback(new Error(this.$t('module.chooseOrg.descMaxTH')));
      }
      callback();
    };
    return {
      orgSelectWin: false,
      showDetail: false,
      btnTitle: this.$t('common.save'),
      form: {
        companyId: '',
        orgCode: '',
        orgName: '',
        orgDesc: '',
        parentOrgName: '',
        orgId: '',
        parentId: '',
      },

      rules: {
        orgCode: [
          { validator: validateOrgCode, trigger: 'blur' },
        ],
        orgName: [
          { validator: validateOrgName, trigger: 'blur' }
        ],
        orgDesc: [
          { validator: validateOrgDesc, trigger: 'blur' }
        ]
      },
      baseData: [{
        orgName: this.companyName,
        orgId: '0',
        children: [],
        parentId: -1
      }],
      defaultProps: {
        children: 'children',
        label: 'orgName'
      },
      node: {},
      nodeElement: {}
    }
  },
  computed: {

  },
  created: function() {

    this.$emit('SetPageActions', [
      {
        text: this.$t('common.create'),
        theme: 'warning',
        icon: 'plus-round',
        handle: this.addOrg
      },
      {
        text: this.$t('common.delete'),
        theme: 'info',
        icon: 'trash-a',
        handle: this.deleteOrg
      }
    ])
  },
  beforeMount: function() {

  },
  mounted: function() {

  },
  beforeDestroy: function() {

  },
  destroyed: function() {

  },
  methods: {
    ok() {

      let nodes = this.$refs.orgSelectTree.getCheckedNodes();
      if (nodes.length > 1) {

        return;
      }
      if (nodes.length == 1) {
        this.form.parentId = nodes[0].orgId
        this.form.parentOrgName = nodes[0].orgName;
      }


    },
    loadNode(node, resolve) {
      let checked = node.checked;
      node.checked = false; //每次加载，均取消当前功能的复选框选中状态
      this.node = node;
      // 
      if (node.level == 0) {
        resolve(this.baseData);
        return;
      }
      let parentId = 0;
      if (node.level != 0) {

        parentId = node.data.orgId
      }

      $store.dispatch('OrgMgQueryOrgListByCompanyId', {
        "companyId": this.companyId,
        "parentId": parentId,
        "sortDTO": {
          "fieldName": "",
          "orderBy": ""
        }
      }).then((res) => {
        if (res.statusCode != 0) {
          this.$Message.warning({
            content: res.msg,
            duration: 3
          });
          return;
        }
        //this.baseData = res.dataResult;
        resolve(res.dataResult);
      })


      //node.checked = checked;
    }
  },
  watch: {

  },
  directives: {

  }
}
</script>
