import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui'
import './assets/style/element-variables.scss'
import { ElementTiptapPlugin } from 'element-tiptap'
import 'element-tiptap/lib/index.css'
import VueClipboard from 'vue-clipboard2'
import directives from './directives'
import filters from './filters'
import plugins from './plugins'
import { mapState, mapMutations } from 'vuex'
import { fetchMenuTree } from './api/system/menu'
import preventReClick from '@/directives/directive'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'

Vue.component('treeselect', Treeselect)

Vue.use(preventReClick)
Vue.config.productionTip = false
Vue.use(ElementUI, {
  size: 'small'
})
Vue.use(ElementTiptapPlugin, {
  lang: 'zh'
})
Vue.use(VueClipboard)
Vue.use(directives)
Vue.use(filters)
Vue.use(plugins)

new Vue({
  data: {
    loading: false
  },
  router,
  store,
  computed: {
    ...mapState(['userInfo', 'homePage','topMenuCurrent','menuData'])
  },
  watch: {
    async userInfo () {
      if (this.userInfo == null) {
        return
      }
      await this.initRoutes()
    },
    async topMenuCurrent () {
      if (this.topMenuCurrent == null) {
        return
      }
      await this.chagneRoutes()
    }
  },
  methods: {
    ...mapMutations(['switchCollapseMenu', 'setHomePage', 'setTopMenuCurrent', 'setTopMenuCurrent','cleartagsview']),
    // 初始化本地配置
    initLocalConfig () {
      // 菜单状态配置
      const menuStatus = window.localStorage.getItem('MENU_STATUS')
      if (menuStatus != null) {
        this.switchCollapseMenu(menuStatus === 'true')
      }
    },
    // 初始化路由
    async initRoutes () {
      if (this.loading || this.userInfo == null) {
        return
      }
      this.loading = true
      // 重置菜单
      this.$store.commit('resetMenus')
      // 获取菜单
      const storeMenus = this.$store.state.menuData.list
      const storeTopMenus = this.$store.state.topMenuList.list
      if (storeMenus.length > 0 && this.homePage == null) {
        this.setHomePage(storeMenus[0])
      }
      await fetchMenuTree()
        .then(allmenus => {
          // 添加菜单
          var topList = allmenus.filter(item => {
            return item.type === 1
          })
          storeTopMenus.push.apply(storeTopMenus, topList)
          var topCurrent = null
          var tlist =[]
          topList.forEach(item => {
            if (item.linkType === 0 ) {
              if (topCurrent == null) {
                topCurrent = item
              }
              tlist.push(...item.children)
            }
          })
          this.setTopMenuCurrent(topCurrent)
          // console.log(topList)
          // var menus = []
          // topList.forEach(item => {
          //   console.log(topCurrent.id, item.id)
          //   if (item.id == this.topMenuCurrent.id) {
          //     menus = item.children
          //   }
          // })
          console.log('menus', this.menuData.list)
          storeMenus.push.apply(storeMenus, this.menuData.list)
          // 添加路由
          this.__addRouters(tlist)
          // 404
          router.addRoute({
            path: '*',
            redirect: '/not-found'
          })
          // 首页
          router.addRoute({
            name: 'index',
            path: '/',
            redirect: this.homePage.url
          })
          // 路由加载完成后，如果访问的是/，跳转至动态识别的首页
          if (this.$route.path === '/') {
            this.$router.push(this.homePage.url)
          }
        })
        .catch(e => {
          throw e
        })
        .finally(() => {
          this.loading = false
        })
    },
    async chagneRoutes () {
      // 重置菜单
      this.cleartagsview('/index')
      console.log('menus', this.menuData.list)
      // 添加路由
      // this.__addRouters(this.menuData.list)
      if(this.topMenuCurrent.homeUrl){
        await this.$router.push({path: this.topMenuCurrent.homeUrl, query: {}})
      }
    },
    // 新建路由
    __addRouters (routes, parents = []) {
      if (routes == null || routes.length === 0) {
        return
      }
      const rs = router.getRoutes()
      for (const route of routes) {
        const parentsDump = JSON.parse(JSON.stringify(parents))
        parentsDump.push(route)
        if (route.url == null || route.url === '') {
          this.__addRouters(route.children, parentsDump)
          continue
        }
        if (rs.findIndex(r => r.path === route.url) > -1) {
          this.__addRouters(route.children, parentsDump)
          continue
        }
        if (this.homePage == null) {
          this.setHomePage(route)
        }
        router.addRoute('layout', {
          path: route.url,
          name: route.label,
          meta: {
            title: route.label,
            paths: [...parents.map(p => p.label), route.label]
          },
          component: () => import('@/views' + route.url)
        })
        this.__addRouters(route.children, parentsDump)
      }
    }
  },
  async created () {
    if (this.userInfo == null) {
      return
    }
    await this.initRoutes()
      .catch(() => {})
  },
  mounted () {
    this.initLocalConfig()
  },
  render: h => h(App)
}).$mount('#app')