<template>
  <el-container>
    <lt-left-menu-notab :pModules="modules"></lt-left-menu-notab>
  </el-container>
</template>

<script>
import Vue from "vue";

import graphEdit from "./graph/parent-details-edit.vue"; //可编辑图标
import labelDesign from "./label-designer/index.vue"; //标签设计器

export default {
  name: "example",
  components: {
    graphEdit,
    labelDesign,
  },
  props: {
    loginTime: {
      type: String,
    },
    powers: {
      type: Array,
    },
  },
  computed: {
    getUserName: function() {
      return LtConfig.userName;
    },
    localVer: function() {
      return LtConfig.ver;
    },
  },
  data() {
    return {
      modules: [
        {
          name: "图形控件使用示例",
          key: "BaseData",
          childrens: [
            {
              name: "绘图",
              component: graphEdit,
              key: "graphEdit",
              power: 150,
            }, //
            {
              name: "标签设计器",
              component: labelDesign,
              key: "labelDesign",
              power: 150,
            },
          ],
        },
      ],
      Dnymodules: [],
      mainComponent: null,
    };
  },
  watch: {
    powers: function(value) {
      if (value.length != 0) {
        this.getDynamic(value);
      }
    },
  },

  created() {},
  methods: {
    quit() {
      //退出按钮
      this.$confirm("确定要退出仓库管理系统么?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$router.push("/loginmain"); //返回到主页面
        })
        .catch(() => {});
    },
    handleHelp() {
      //帮助按钮
      var test =
        window.location.protocol +
        "//" +
        window.location.hostname +
        ":" +
        location.port;
      console.log("用户输入的URL值是：" + test);
      var sherf = "";
      console.log("获取到的URL是：" + LtConfig.baseURL);
      if (
        LtConfig.baseURL == undefined ||
        LtConfig.baseURL == null ||
        LtConfig.baseURL == ""
      ) {
        sherf =
          window.location.protocol +
          "//" +
          window.location.hostname +
          ":" +
          location.port +
          "/../" +
          "Manual/help/index.html";
        console.log("URL没有配置：" + sherf);
      } else {
        if (LtConfig.baseURL.indexOf("http") == -1) {
          //如果不是以http开头，则补上
          sherf =
            "http://" +
            LtConfig.baseURL +
            ":" +
            LtConfig.port +
            "/../" +
            "Manual/help/index.html";
        } else {
          sherf =
            LtConfig.baseURL +
            ":" +
            LtConfig.port +
            "/../" +
            "Manual/help/index.html";
        }
        console.log("URL配置：" + sherf);
      }
      window.open(sherf);
    },
    handleMenuSelect(item) {
      if (!item.component) return;
      this.mainComponent = null; //清空原来的内容
      this.$nextTick(() => {
        this.mainComponent = item.component;
      });
    },
    getDynamic: function(powers) {
      var powers = powers;
      var tempModules = [];
      var showModules = [];
      //   if (powers.length == 0) {
      //     //如果权限返回为空，则直接返回
      //     return;
      //   }
      $.extend(true, tempModules, this.modules);
      for (var i = 0; i < tempModules.length; i++) {
        var bRet = cheIfHasChild(tempModules, i);
        if (bRet) {
          //如果删除了某一项，则循环次数减1
          i--;
        }
      }

      checkIfNULL(tempModules);
      for (var x = 0; x < tempModules.length; x++) {
        if (
          tempModules[x].childrens != undefined &&
          tempModules[x].childrens == false
        ) {
        } else {
          this.Dnymodules.push(tempModules[x]);
        }
      }

      function checkIfNULL(data) {
        //检验数组里面的值是不是为空
        for (var i = 0; i < data.length; i++) {
          var temp = data[i];
          if (temp == undefined) return;
          if (temp.childrens != undefined) {
            if (temp.childrens.length == 0) {
              data.splice(i--, 1); //如果删除了一个元素，则循环变量减1
            } else {
              var test = temp.childrens;
              if (temp.childrens != undefined) {
                if (temp.childrens.length > 0) {
                  checkIfNULL(data[i].childrens);
                }
              }
            }
          }
        }
      }

      function cheIfHasChild(data, i) {
        var temp = data[i];
        if (temp == undefined) return;
        if (temp.childrens != undefined) {
          var nLength = temp.childrens.length;
          for (var j = 0; j <= temp.childrens.length; j++) {
            if (nLength > temp.childrens.length) {
              j--;
              nLength = temp.childrens.length;
            } else {
            }
            cheIfHasChild(temp.childrens, j);
          }
        } else {
          var bRet = cheIfHasPower(data[i].power);
          if (cheIfHasPower(data[i].power)) {
            //如果拥有权限，则不做任何处理
          } else {
            //如果没有权限，则从数组中删除对应项

            data.splice(i, 1);
            return true;
          }
        }
        return false;
      }

      function cheIfHasPower(power) {
        var test = powers;
        if (power == undefined) return true; //如果没有配置权限，则认为该权限是都拥有的
        for (var j = 0; j < powers.length; j++) {
          if (powers[j] == power) {
            return true;
          }
        }
        return false;
      }
    },
  },
  beforeMount() {},
  mounted() {
    //this.getDynamic(this.powers);
  },
};
</script>
<style scoped>
.el-aside {
  min-width: 200px;
  max-width: 320px;
}
.el-container {
  height: 100%;
}
.component,
.el-main {
  margin: 0;
  padding: 0;
}
</style>
<style>
/* 此处全局修改样式，elementUI里面，当窗口打开太多的时候，页面顶端显示的箭头是歪的 */
.el-tabs__nav-next,
.el-tabs__nav-prev {
  line-height: 30px;
}
/* 此处全局修改样式，elementUI里面，默认的container main的padding是20px，界面显示不够友好 */
.el-main {
  padding: 0px;
}
.el-header {
  padding: 0px;
}
.el-button.expandButton.el-button--text {
  /* 修改treeTable的按钮显示行，在局部修改样式的时候，发现如果页面刚打开的时候，树形表格里面没有展开列，后面再打开展开列的时候，样式还是原本样式，没有修正过来 */
  color: gray !important;
  height: 25px;
}
</style>
