<template>
  <div class="fwgl_container">
    <side-nav-bar
      v-if="showNavbar"
      title="问答中心管理"
      :title-icon="require('@/assets/imgs/tool_ic_wenda.png')"
      :nav-list="navList"
      :title-path="navList[0] && navList[0].path"
    ></side-nav-bar>
    <div class="main_container">
      <router-view :key="'type_' + $route.params.type"></router-view>
    </div>
  </div>
</template>

<script>
import sideNavBar from "@/components/side-nav-bar";

export default {
  components: {
    sideNavBar,
  },
  data: () => ({
    userNav: [
      {
        name: "提问列表",
        path: `/qa/questions`,
      },
      {
        name: "回答列表",
        path: `/qa/answers`,
      },
    ],
    navList: [],
    showNavbar: false,
  }),
  watch: {
    "$route.fullPath"(path) {
      this.initNavList();
    },
  },
  methods: {
    initNavList() {
      this.navList = this.userNav;
    },
  },
  mounted() {
    this.$api.user.getNowUser().then(({ data }) => {
      if (data.success == 1) {
        this.$store.commit("userInfofun", data.data);

        const userLevel = this.$store.getters.level;

        if (userLevel == 0) {
          this.$message({
            message: `您没有问答中心管理模块的权限.`,
            type: "warning",
          });
          this.$router.push(`/index`);
        } else {
          this.showNavbar = true;
          this.initNavList();
        }
      }
    });
  },
};
</script>

<style scoped>
.fwgl_container {
  height: calc(100vh - 58px);
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
}
.side_nav_bar {
  width: 180px;
  flex-shrink: 0;
}
.main_container {
  width: calc(100% - 180px);
  flex-grow: 1;
  flex-shrink: 1;
  background-color: #f6f7fb;
  overflow: auto;
}
</style>
