import { createApp } from 'vue'
import App from './App.vue'
import { router, filterExclude } from './router'
import store from './store'

import VueAxios from 'vue-axios'
import axios from 'axios'
// 配置默认axios参数
const service = axios.create({
  timeout: 10000
})

import { ElMessage, ElLoading } from 'element-plus'
import 'element-plus/theme-chalk/el-message.css'
import 'element-plus/theme-chalk/el-message-box.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'

// 添加请求拦截器
service.interceptors.request.use(config => {
  // 在发送请求之前添加token到请求头
  const token = mountedApp.$store.state.loginInfo.token
  if (token !== null && config.headers) {
    config.headers.token = token
  }
  return config
}, err => {
  // 请求错误的处理
  ElMessage.error('请求超时，请稍后再试')
  return Promise.reject(err)
})

service.interceptors.response.use(res=> {
  return res.data
}, err => {
  if (err.response.status >= 500) {
    ElMessage.error('服务器内部错误')
  } else if (err.response.status >= 400) {
    if(typeof err.response.data.message === 'string') {
      ElMessage.warning(err.response.data.message)
    } else if (Array.isArray(err.response.data.message)) {
      let message = err.response.data.message.join('<br/>')
      ElMessage.warning(message)
    }
    if (err.response.status === 403) {
      mountedApp.$router.push('/login')
    }
  }
  return Promise.reject(err)
})

// 全局路由导航前置守卫
router.beforeEach(function (to, from, next) {
  if (to.meta?.title) {
    mountedApp.$store.commit('addTab', { title: to.meta.title, path: to.path, name: to.name })
  }
  mountedApp.$store.state.activeTab = to.path
  if(filterExclude.indexOf(to.path) !== -1 || mountedApp.$store.state.loginInfo.token) {
    next()
  } else {
    next('/login')
  }
})

const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

const mountedApp = app.use(router)
  .use(store)
  .use(VueAxios, service)
  .directive('loading', ElLoading.directive)
  .mount('#app')