<template>
  <div id="orgdiv">
    <SplitPanel>
      <OrgEditor
        slot="left"
        ref="orgtree"
        :initData="initData"
        :metainfo="metainfo"
        @controlctl="controlctl"
        @drawaction="drawaction"
      ></OrgEditor>
      <UserInfo ref="userinfo" slot="right"></UserInfo>
    </SplitPanel>
  </div>
</template>
  <script>
import { getApp, saveAuths, findAuthsByRoles } from "@/api/meta";
import OrgEditor from "@/view/components/tables/forms/jsoneditor.vue";
import SplitPanel from "@/view/components/split-pane2/split-pane2.vue";
import UserInfo from "./userinfo_page.vue";
import config from "@/config";
export default {
  name: "treeinfo_page",
  props: {},
  components: {
    OrgEditor,
    SplitPanel,
    UserInfo
  },
  data() {
    return {
      metainfo: {
        name: "节点编辑",
        main: [
          {
            title: "授权信息",
            key: "baseinfo",
            cols: 2,
            ctls: [
              {
                type: "switch",
                label: "是否岗位",
                prop: "isPosition",
                opentext: "是",
                closetext: "否",
                trurcolor: "",
                falsecolor: "",
                placeHolder: "",
                style: ""
              },
              {
                type: "switch",
                label: "是否负责人",
                prop: "isMain",
                opentext: "是",
                closetext: "否",
                trurcolor: "",
                falsecolor: "",
                placeHolder: "",
                style: "",
                isHide: true
              },
              {
                type: "input",
                label: "监控",
                prop: "orgtag",
                placeHolder: "输入监控的部门编码（非岗位），逗号分隔",
                style: "",
                rules: [],
                isHide: true
              },
              {
                type: "model-select",
                refModel: "auth.role",
                isMulti: true,
                label: "角色",
                prop: "roles",
                labelField: "name",
                valueField: "id",
                style: { "margin-left": "10px", width: "165px" },
                isHide: true
              }
            ]
          }
        ],
        lists: null
      }
    };
  },
  mounted() {
    this.$nextTick(() => {
      this.setHeight();
    });

    $(window).resize(() => {
      this.$nextTick(() => {
        this.setHeight();
      });
    });
  },
  methods: {
    setHeight() {
      let $orgdiv = $("#orgdiv");
      let el = $orgdiv.get()[0];
      let h = window.innerHeight - el.offsetTop;
      $orgdiv.css("height", h + "px");
      this.$refs.userinfo.setHeight(h-120)
    },
    drawaction(v, fm) {
      if (fm.formModel.isPosition) {
        fm.setCtlVisable("isMain", true);
        fm.setCtlVisable("orgtag", true);
        fm.setCtlVisable("roles", true);
      } else {
        fm.setCtlVisable("isMain", false);
        fm.setCtlVisable("orgtag", false);
        fm.setCtlVisable("roles", false);
      }
    },
    controlctl(v, prop, fm) {
      if (prop == "isPosition") {
        if (v) {
          fm.setCtlVisable("isMain", true);
          fm.setCtlVisable("orgtag", true);
          fm.setCtlVisable("roles", true);
        } else {
          fm.setCtlVisable("isMain", false);
          fm.setCtlVisable("orgtag", false);
          fm.setCtlVisable("roles", false);
        }
      }
    },
    initData(cbk) {
      cbk([
        {
          title: "目录",
          expand: true,
          roles: []
        }
      ]);
    }
  }
};
</script>
  <style>
</style>
