front/src/main.js

import Vue from 'vue'

// use code below to debug in mobile devices.
// import vConsole from 'vconsole'
// new vConsole()

import Cookies from 'js-cookie'
import Element from 'element-ui'
import './assets/styles/element-variables.scss'

import '@/assets/styles/common.scss' // common css
import '@/assets/styles/index.scss' // global css
import '@/assets/styles/ruoyi.scss' // ruoyi css
import App from './App'
import store from './store'
import router from './router'
import permission from './directive/permission'

import './assets/icons' // icon
import '@/assets/icons/iconfont.css' // 阿里巴巴icon css
import './permission' // permission control
import { getDicts } from "@/api/system/dict/data";
import { getConfigKey } from "@/api/system/config";
import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, download, handleTree } from "@/utils/ruoyi";
import Pagination from "@/components/Pagination";
// 自定义表格工具扩展
import RightToolbar from "@/components/RightToolbar"
import formSearch from "@/components/formSearch"
import EvaluationTitle from "@/components/EvaluationTitle"
import EvaluationCard from "@/components/EvaluationCard"
import EvaluationEmpty from "@/components/EvaluationEmpty"
import StudentCard from "@/components/StudentCard"
import MxDateRangePicker from "@/components/MxDateRangePicker"
import MxSeperator from "@/components/MxSeperator"
import MxTable from "@/components/MxTable"
import MxCheckStatus from "@/components/MxCheckStatus"
import Province from "@/components/Province"
import UploadDialog from "@/components/UploadDialog"
import selectTree from "@/components/selectTree"
import globalVariable from '@/utils/globalVariable'
import BottomP from '@/components/BottomP'
import Top from '@/components/Top'
import MxVideo from '@/components/MxVideo'
import FileUpload from '@/components/FileUpload'
import ImageUpload from '@/components/ImageUpload'
import hasHistory from "@/directive/hasHistory"

// 用于静态弹窗 函数式调用
import MxDialog from '@/components/MxDialog/index'
import DictData from "@/components/DictData"

Vue.prototype.$ossBase = 'https://mingxuejingbang.oss-cn-beijing.aliyuncs.com'
Vue.prototype.$imgBase = Vue.prototype.$ossBase + '/mingxueMainImgs/'
Vue.prototype.$Dialog = MxDialog
Vue.prototype.mxGlobal = globalVariable
// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey
Vue.prototype.parseTime = parseTime
Vue.prototype.resetForm = resetForm
Vue.prototype.addDateRange = addDateRange
Vue.prototype.selectDictLabel = selectDictLabel
Vue.prototype.selectDictLabels = selectDictLabels
Vue.prototype.download = download
Vue.prototype.handleTree = handleTree
DictData.install()

Vue.prototype.msgSuccess = function (msg) {
  this.$message({ showClose: true, message: msg, type: "success" });
}

Vue.prototype.msgError = function (msg) {
  this.$message({ showClose: true, message: msg, type: "error" });
}

Vue.prototype.msgInfo = function (msg) {
  this.$message.info(msg);
}

// 扩展挂载
import ext from "@/common/mx-extension.js"
Vue.use(ext)
// filters
import filters from "@/filters/index"
Object.keys(filters).forEach(key => Vue.filter(key, filters[key]))
// directives
Vue.directive('has-history', hasHistory)
// 电子签名
import vueEsign from 'vue-esign'
Vue.use(vueEsign)
// 全局组件挂载
Vue.component('Pagination', Pagination)
Vue.component('RightToolbar', RightToolbar)
Vue.component('formSearch', formSearch)//搜索
Vue.component('EvaluationTitle', EvaluationTitle) // 标题行
Vue.component('EvaluationCard', EvaluationCard)//测评通用卡片样式
Vue.component('EvaluationEmpty', EvaluationEmpty) // 无数据样式
Vue.component('StudentCard', StudentCard) // 学生样式
Vue.component('MxDateRangePicker', MxDateRangePicker) //开始结束分开选
Vue.component('MxSeperator', MxSeperator) // 分割线
Vue.component('MxTable', MxTable) // 通用表格
Vue.component('MxCheckStatus', MxCheckStatus) // 选中样式/true/false
Vue.component('Province', Province)//省市区
Vue.component('UploadDialog', UploadDialog)//上传附件确认组件
Vue.component('selectTree', selectTree)//下拉树
Vue.component('BottomP', BottomP)//底部
Vue.component('Top', Top)//头部
Vue.component('MxVideo', MxVideo) //试图替换系统的video组件
Vue.component('FileUpload', FileUpload) // OSS文件上传
Vue.component('ImageUpload', ImageUpload) // OSS文件上传
Vue.component('DictTag', DictTag)

Vue.use(permission)

// vue-video-player
import VideoPlayer from 'vue-video-player'
require('video.js/dist/video-js.css')
require('vue-video-player/src/custom-theme.css')
const hls = require('videojs-contrib-hls')
Vue.use(hls)
Vue.use(VideoPlayer)

// scroll to component
import VueScrollTo from 'vue-scrollto'
import DictTag from "@/components/DictTag/index.vue";
const scrollToOpts = {
  container: 'body', // 滚动的容器
  duration: 500, // 滚动时间
  easing: 'ease', // 缓动类型
  offset: -90, // 滚动时应应用的偏移量。此选项接受回调函数
  force: true, // 是否应执行滚动
  cancelable: true, // 用户是否可以取消滚动
  onStart: false, // 滚动开始时的钩子函数
  onDone: false, // 滚动结束时候的钩子函数
  onCancel: false, // 用户取消滚动的钩子函数
  x: false, // 是否要在x轴上也滚动
  y: true // 是否要在y轴上滚动
}
Vue.use(VueScrollTo, scrollToOpts)

/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online! ! !
 */

Vue.use(Element, {
  size: Cookies.get('size') || 'medium' // set element-ui default size
})

// /* use mockjs in dev-environment */
// import requireContext from 'require-context.macro';
// if (process.env.NODE_ENV === 'development') {
//   const mockModules = requireContext('../mock/modules', false, /\.js$/)
//   const mocks = mockModules.keys()
//     .map(key => mockModules(key))
//     .reduce(function(prev, current) {
//       return prev.concat(current)
//     }, [])
//   const { mockXHR } = require('../mock')
//   mockXHR(mocks)
// }

Vue.config.productionTip = false

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