import Vue from 'vue'

import 'normalize.css/normalize.css' // A modern alternative to CSS resets

import ElementUI from 'element-ui'

// 照片查看组件
import { Message, MessageBox } from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

import '@/styles/index.scss' // global css

import App from './App'
import store from './store'
import router from './router'
import * as filters from './filters'

import '@/icons' // icon
import '@/permission' // permission control
import '@/global' // 注册全局组件

/**
 * This project originally used easy-mock to simulate data,
 * but its official service is very unstable,
 * and you can build your own service if you need it.
 * So here I use Mock.js for local emulation,
 * it will intercept your request, so you won't see the request in the network.
 * If you remove `../mock` it will automatically request easy-mock data.
 */
// import '../mock' // simulation data
Vue.config.productionTip = false

// 已在main.js用cdn引入
Vue.use(ElementUI)

import imgPreview from './components/imgPreview/index.js'
Vue.use(imgPreview)
// 注册全局的过滤器
for (const key of Object.keys(filters)) {
  Vue.filter(key, filters[key])
}

// 统一的网络请求处理
Object.defineProperty(Vue.prototype, '$http', {
  value: function(requestPromise, successCallback, errorCallback, selfHandle) {
    requestPromise.then(res => {
      if (!res) return
      // 针对res.c === 0
      if (res.code !== undefined && res.code === 0) {
        successCallback && successCallback(res)
      } else {
        // 其他情况，当成错误信息显示
        throw new Error(res.message || '')
      }
    }).catch(err => {
      // 排除特殊情况
      if (!selfHandle) {
        // 显示错误信息
        Message({
          message: err.message,
          type: 'error',
          duration: 5 * 1000
        })
      }
      errorCallback && errorCallback(err)
    })
  }
})

/**
 * 全局确认框
 * @param {String} title 标题
 * @param {String} content 文本内容
 * @param {Function} confirmCallback 确定按钮的回调函数
 * @param {Function} cancelCallback 取消按钮回调函数
 */
Object.defineProperty(Vue.prototype, '$confirm', {
  value: function(title, content, confirmCallback, cancelCallback) {
    MessageBox.confirm(content, title, {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
      // center: true
    }).then(() => {
      confirmCallback && confirmCallback()
    }).catch(() => {
      cancelCallback && cancelCallback()
    })
  }
})

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})



