<template>
    <div class="dashboard-container">
        <component :is="currentRole" />
    </div>
</template>

<script>
import { mapGetters } from "vuex";
import { singleLogin, titleSuper, closeTitle } from "@/api/user";
import localStronge from "@/api/localData";
import adminDashboard from "./admin";
import editorDashboard from "./editor";
import Layout from "@/layout";
import { constantRoutes } from "@/router";
import { loading, loadingClose } from "@/utils/common";
export default {
  name: "Dashboard",
  components: {
    adminDashboard,
    editorDashboard,
  },
  data() {
    return {
      currentRole: "adminDashboard",
    };
  },
  computed: {
    ...mapGetters(["roles"]),
    routes: {
      get() {
        return this.$store.state.user.routes;
      },
      set(val) {
        this.$store.state.user.routes = val;
      },
    },
    num: {
      get() {
        return this.$store.state.websocket.num;
      },
      set(val) {
        this.$store.state.websocket.num = val;
      },
    },
    roleName: {
      get() {
        return this.$store.state.user.roleName;
      },
      set(val) {
        this.$store.state.user.roleName = val;
      },
    },
    name: {
      get() {
        return this.$store.state.user.name;
      },
      set(val) {
        this.$store.state.user.name = val;
      },
    },
  },
  methods: {
    getRouters(username) {
      loading();
      singleLogin({
        username,
      })
        .then((res) => {
          if (res.success) {
            let menu = res.body.userRole.roles[0].menus;
            this.sumbitFuncTypeCode(menu);
            localStronge.setMenus(menu);
            sessionStorage.setItem("username", res.body.userRole.user.username);
            sessionStorage.setItem("userid", res.body.userRole.user.id);
            sessionStorage.setItem("roleid", res.body.userRole.roles[0].id);
            sessionStorage.setItem(
              "passWorld",
              res.body.userRole.user.password
            );
            sessionStorage.setItem(
              "roles",
              res.body.userRole.roles[0].roleName
            );
            sessionStorage.setItem(
              "userCHname",
              res.body.userRole.user.userChnName
            );
            //localStronge.setToken(res.body.token);
            this.$router.push({
              path: "/",
            });
            window.location.reload();
            this.name = res.body.userRole.user.username;
            this.roleName = res.body.userRole.roles[0].roleName;
            // this.password = res.body.userRole.user.password
            this.getTitleSuper();
          }
        })
        .finally((res) => {
          loadingClose();
        });
    },
    sumbitFuncTypeCode(data) {
      let dashboard = [
        {
          path: "/",
          component: Layout,
          redirect: "/dashboard",
          children: [
            {
              path: "/dashboard",
              name: "Dashboard",
              component: () => import("@/views/dashboard/index"),
              meta: {
                title: "首页",
                icon: "dashboard",
                affix: true,
              },
            },
          ],
        },
      ];
      let TypeList = {};
      let idList = {};
      let list = [];
      let OtherRouter = [];
      constantRoutes.forEach((item) => {
        if (
          item.path === "/login" ||
          item.path === "/404" ||
          item.path === "*"
        ) {
          OtherRouter.push(item);
        }
      });
      data.forEach((ele) => {
        let obj = {};
        obj.children = [];
        // if (ele.childs && !ele.childs.length) {
        if (!ele.childs || !ele.childs.length) {
          idList[ele.url] = ele.id;
          let menus = {};
          menus.path = ele.url;
          menus.meta = {
            title: ele.name,
            noCache: true,
            icon: ele.icon,
          };
          obj.children.push(menus);
          if (ele.url && ele.funcTypeCode) {
            TypeList[ele.url] = ele.funcTypeCode;
          }
        } else {
          obj.path = ele.url;
          obj.component = Layout;
          obj.alwaysShow = true;
          obj.meta = {
            title: ele.name,
            icon: ele.icon,
            noCache: true,
          };
          ele.childs.forEach((element) => {
            idList[element.url] = element.id;
            let menu = {};
            menu.path = element.url;
            menu.children = [];
            menu.meta = {
              title: element.name,
              noCache: true,
              icon: element.icon,
            };
            if (element.childs != null && element.childs.length) {
              element.childs.forEach((aea) => {
                idList[aea.url] = aea.id;
                if (aea.childs === null) {
                  let me = {};
                  me.path = aea.url;
                  me.meta = {
                    title: aea.name,
                    noCache: true,
                    icon: aea.icon,
                  };
                  menu.children.push(me);
                  if (aea.url && aea.funcTypeCode) {
                    TypeList[aea.url] = aea.funcTypeCode;
                  }
                }
              });
            } else {
              if (element.url && element.funcTypeCode) {
                TypeList[element.url] = element.funcTypeCode;
              }
            }
            obj.children.push(menu);
            // idList[element.url] = element.id
          });
        }
        list.push(obj);
      });
      this.routes = [...dashboard, ...list, ...OtherRouter];
      sessionStorage.setItem("routes", JSON.stringify(this.routes));
      sessionStorage.setItem("funcTypeCodeList", JSON.stringify(TypeList));
      sessionStorage.setItem("routerIdList", JSON.stringify(idList));
      // message("success", "登录成功", 3000);
      this.$router.push({
        path: "/dashboard",
      });
    },
    getWebSocketNum() {
      let data = {
        userId: sessionStorage.getItem("userid"),
      };
    },
    closeNotify() {
      closeTitle().then((res) => {
        this.$notify.closeAll();
        this.$router.push("/supervise-management/supervise-guide");
      });
    },
    getTitleSuper() {
      titleSuper().then((res) => {
        if (res.body.total) {
          const h = this.$createElement;
          this.$notify({
            title: "您有监督指导意见待查看!",
            type: "success",
            // message: "您有监督指导意见带查收!",
            duration: 0,
            // position: 'bottom-right',
            offset: 20,
            dangerouslyUseHTMLString: true,
            message: h("p", null, [
              "",
              h("a", [
                h(
                  "el-button",
                  {
                    style: {
                      float: "right",
                    },
                    attrs: {
                      size: "mini",
                      type: "primary",
                    },
                    on: {
                      click: this.closeNotify, // 路由加载之后，调用关闭消息弹窗的方法
                    },
                  },
                  "我已阅读 前往查看"
                ),
              ]),
            ]),
          });
        }
      });
    },
  },
  destroyed() {
    this.$notify.closeAll();
  },
  mounted() {
    this.getWebSocketNum();
  },
  created() {
    this.currentRole = "editorDashboard";
    let username = this.$route.query.userName;
    if (username) {
      this.getRouters(username);
    } else {
      this.$router.push({
        path: "/login",
      });
    }
  },
};
</script>

<style lang="scss" scoped>
.dashboard-container {
  margin: -10px -16px !important;
  height: calc(100vh - 40px) !important;
}
</style>
