优化modules

src/components/upload-form/elemInfo.md

-## 组件简介
-
-|  字段值  | 说明                       | 字段属性 | 默认值 |
-| ------- | ------------------------- | ------- | ----- |
-| `type`  | 类型：`String`; 说明：组件类型名 | 自定义字段 | `upload-form` |
-| `action`  | 类型：`String`; 说明：上传请求接口path | 自定义字段 | `` |
-| `deleteAction`  | 类型：`String`; 说明：删除请求接口path | 自定义字段 | `` |
-| `html`  | 类型：`String`; 说明：上传说明，支持html | 自定义字段 | `` |
-| `label` | 类型：`String`; 说明：组件左侧显示名称 | element-ui el-form-item对应字段 | `''` |
-| `label-width` | 类型：`String`; 说明：组件左侧显示名称宽度（加单位），父级设置可以子级继承 | element-ui el-form-item对应字段 | `''` |
-| `required` | 类型：`Boolean`; 说明：标识是否必填 | element-ui el-form-item对应字段 | `false` |
-| `disabled` | 类型：`Boolean`; 说明：标识是否只读 | element-ui el-form-item对应字段 | `false` |
-| `model` | 类型：`String`; 说明：表单提交name值和回显对照字段 | 自定义字段 | `''` |
-| `placeholder` | 类型：`String`; 说明：组件input框中，默认提示文字 | element-ui el-input对应字段 | `''` |
-| `attrs` | 类型：`Object`; 说明：定义标签上Data属性值 | element-ui对应字段 | `{}` |
-| `rules` | 类型：`Array`; 说明：组件错误提示规则 | element-ui el-form-item对应字段 | `[]` |
-
-### Demo Example:
-``` js
-return {
-  type: 'upload-form',
-  label: '姓名',
-  labeWidth: '160px',
-  required: true,
-  disabled: false,
-  model: 'uploadArrs',
-  action: '',
-  data: {
-
-  },
-  deleteAction: '',
-  deleteData: {
-
-  },
-  html: `
-    <div style="color: #72818c; font-size: 14px;">
-      <p style="margin: 0;">申请者需要将有效身份证件原件扫描或者拍照后提交。</p>
-      <p style="margin: 0;">请您提供有效身份证件的扫描件，身份证与台港澳居民大陆通行证应包括正反两面扫描件。</p>
-      <p style="margin: 0;">只上传一个文件，多份文件需合并到一个文件后打印出来检查无误后再上传。</p>
-      <p style="margin: 0;">上传文件仅限“jpg,jpeg,gif,png”格式，文件小于10MB。</p>
-    </div>
-  `,
-  attrs: {
-    multiple: false,
-    limit: 1
-  },
-  rules: [
-    {
-      required: true,
-      message: '请上传',
-      trigger: 'blur'
-    }
-  ]
-}
-```
-
-* 其他属性 [参考文档]([https://](https://element.eleme.cn/#/zh-CN/component/input))

src/components/upload-form/index.js

-import Upload from './src/uploadForm.vue'
-
-/* istanbul ignore next */
-Upload.install = function (Vue) {
-  Vue.component(Upload.name, Upload)
-}
-
-export default Upload

src/components/upload-form/src/ajax.js

-function getError (action, option, xhr) {
-  let msg
-  if (xhr.response) {
-    msg = `${xhr.response.error || xhr.response}`
-  } else if (xhr.responseText) {
-    msg = `${xhr.responseText}`
-  } else {
-    msg = `fail to post ${action} ${xhr.status}`
-  }
-
-  const err = new Error(msg)
-  err.status = xhr.status
-  err.method = 'post'
-  err.url = action
-  return err
-}
-
-function getBody (xhr) {
-  const text = xhr.responseText || xhr.response
-  if (!text) {
-    return text
-  }
-
-  try {
-    return JSON.parse(text)
-  } catch (e) {
-    return text
-  }
-}
-
-export function deleteFile (option) {
-  if (typeof XMLHttpRequest === 'undefined') {
-    return
-  }
-
-  // eslint-disable-next-line no-undef
-  const xhr = new XMLHttpRequest()
-  let action = option.action
-
-  xhr.onerror = function error (e) {
-    option.onError(e)
-  }
-
-  xhr.onload = function onload () {
-    if (xhr.status < 200 || xhr.status >= 300) {
-      return option.onError(getError(action, option, xhr))
-    }
-
-    option.onSuccess(getBody(xhr))
-  }
-
-  xhr.open('delete', action, true)
-
-  if (option.withCredentials && 'withCredentials' in xhr) {
-    xhr.withCredentials = true
-  }
-
-  const headers = option.headers || {}
-
-  for (let item in headers) {
-    if (headers.hasOwnProperty(item) && headers[item] !== null) {
-      xhr.setRequestHeader(item, headers[item])
-    }
-  }
-  xhr.send()
-  return xhr
-}
-
-export default function upload (option) {
-  if (typeof XMLHttpRequest === 'undefined') {
-    return
-  }
-
-  // eslint-disable-next-line no-undef
-  const xhr = new XMLHttpRequest()
-  const action = option.action
-
-  if (xhr.upload) {
-    xhr.upload.onprogress = function progress (e) {
-      if (e.total > 0) {
-        e.percent = e.loaded / e.total * 100
-      }
-      option.onProgress(e)
-    }
-  }
-
-  // eslint-disable-next-line no-undef
-  const formData = new FormData()
-
-  if (option.data) {
-    Object.keys(option.data).forEach(key => {
-      formData.append(key, option.data[key])
-    })
-  }
-
-  formData.append(option.filename, option.file, option.file.name)
-
-  xhr.onerror = function error (e) {
-    option.onError(e)
-  }
-
-  xhr.onload = function onload () {
-    if (xhr.status < 200 || xhr.status >= 300) {
-      return option.onError(getError(action, option, xhr))
-    }
-
-    option.onSuccess(getBody(xhr))
-  }
-
-  xhr.open('post', action, true)
-
-  if (option.withCredentials && 'withCredentials' in xhr) {
-    xhr.withCredentials = true
-  }
-
-  const headers = option.headers || {}
-
-  for (let item in headers) {
-    if (headers.hasOwnProperty(item) && headers[item] !== null) {
-      xhr.setRequestHeader(item, headers[item])
-    }
-  }
-  xhr.send(formData)
-  return xhr
-}

src/components/upload-form/src/uploadForm.vue

-<template>
-  <div class="upload-form">
-    <div class="u-babel">{{ item.label }}</div>
-    <el-upload style="display: inline-block;"
-      :action="item.action"
-      :data="item.data"
-      :before-upload="beforeUploadFile"
-      :on-success="onSuccessFile"
-      :with-credentials="true"
-      :show-file-list="false"
-      :disabled="(item.disabled || false) || !isUpload"
-      v-bind="item.attrs || {}"
-    >
-      <el-button type="primary" size="small" :disabled="!isUpload">点击上传</el-button>
-      <template v-if="formData[item.model] !== null && formData[item.model] !== '' && formData[item.model] !== undefined">
-        <div class="self-icon el-icon-circle-check" style="color: #237f00;"></div>
-      </template>
-      <div class="self-icon el-icon-circle-close" style="color: #b01c40;"></div>
-    </el-upload>
-    <div style="overflow: hidden; padding: 10px 0 0 0;">
-      <template v-if="filesArr.length">
-        <!-- 遍历显示文件 -->
-        <template v-for="(item, index) in filesArr">
-          <template v-if="/(jpeg)|(jpg)|(png)|(gif)/gi.test(item.url)">
-            <div v-bind:key="item.id" class="show-file">
-              <template v-if="!(item.disabled || false) && isUpload">
-                <div class="close" @click="deleteFiles(index)">X</div>
-              </template>
-              <el-avatar shape="square" :size="100" fit="contain" :src="item.url"></el-avatar>
-              <span class="title">{{ item.sso_file_name }}</span>
-              <div class="hover">
-                <a target="_blank" :href="item.url">下载</a>
-              </div>
-            </div>
-          </template>
-          <template v-else>
-            <div v-bind:key="item.id" class="show-file">
-              <template v-if="!(item.disabled || false) && isUpload">
-                <div class="close" @click="deleteFiles(index)">X</div>
-              </template>
-              <el-avatar shape="square" :size="100" fit="contain" :src="item.url"></el-avatar>
-              <span class="title">{{ item.sso_file_name }}</span>
-              <div class="hover">
-                <a target="_blank" :href="item.url">下载</a>
-              </div>
-            </div>
-          </template>
-        </template>
-      </template>
-    </div>
-    <div class='info' style="line-height: 1.5;" v-html="item.html"></div>
-  </div>
-</template>
-
-<script>
-// import { deleteFile } from './ajax'
-
-export default {
-  name: 'UploadForm',
-  componentName: 'UploadForm',
-  props: {
-    item: {
-      type: Object,
-      default () {
-        return {}
-      }
-    },
-    formData: {
-      type: Object,
-      default () {
-        return {}
-      }
-    },
-    isUpload: {
-      type: Boolean,
-      default () {
-        return true
-      }
-    }
-  },
-  data () {
-    const tmpArr = this.formData[this.item.model] || []
-    this.formData[this.item.model] = tmpArr
-    return {
-      project_id: '',
-      filesArr: tmpArr
-    }
-  },
-  methods: {
-    beforeUploadFile (file) {},
-    onSuccessFile (response, file, fileList) {
-      response.url = response.url || response.file || ''
-      response.sso_file_name = file.name
-      this.filesArr.push(response)
-      // this.$emit('onSubmit')
-    },
-    deleteFiles (index) {
-      this.filesArr.splice(index, 1)
-      // let temp = this.filesArr[index]
-      // deleteFile({
-      //   action: this.item.deleteAction + '/' + temp.id + '?project_id=' + this.item.data.project_id,
-      //   onError: () => {},
-      //   onSuccess: (res) => {
-      //     if (res.status === 200) {
-      //       this.filesArr.splice(index, 1)
-      //     }
-      //   }
-      // })
-    }
-  },
-  watch: {
-    filesArr: {
-      immediate: true,
-      deep: true,
-      handler (value) {
-        if (this.formData[this.item.model].length !== value.length) {
-          this.formData[this.item.model] = value
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-  .u-babel {
-    display: inline-block;
-    margin-right: 10px;
-  }
-  .self-icon {
-    display: none !important;
-    vertical-align: middle;
-    margin-left: 10px;
-    font-size: 21px;
-    line-height: 22px;
-  }
-  .is-error .self-icon.el-icon-circle-close { display: inline-block !important; }
-  .is-success .self-icon.el-icon-circle-check { display: inline-block !important; }
-
-  .show-file {
-    position: relative;
-    float: left;
-    margin-right: 10px;
-    .close {
-      position: absolute;
-      z-index: 10;
-      right: -10px;
-      top: -10px;
-      width: 20px;
-      height: 20px;
-      color: #fff;
-      font-size: 12px;
-      line-height: 20px;
-      text-align: center;
-      background: #efefef;
-      border-radius: 50%;
-      cursor: pointer;
-    }
-    .el-avatar {
-      img {
-        width: 100%;
-      }
-    }
-    .title {
-      position: absolute;
-      left: 0;
-      bottom: 8px;
-      width: 100%;
-      padding-left: 5px;
-      font-size: 12px;
-      line-height: 20px;
-      background: #efefef;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      word-break: break-all;
-      box-sizing: border-box;
-    }
-    .hover {
-      display: none;
-      position: absolute;
-      z-index: 9;
-      top: 0;
-      left: 0;
-      height: 100px;
-      width: 100%;
-      background: rgba(0, 0, 0, 0.2);
-      line-height: 100px;
-      text-align: center;
-      a {
-        color: #f1f1f1;
-      }
-    }
-    &:hover {
-      .hover {
-        display: block;
-      }
-    }
-  }
-</style>

src/main.js

 import Vue from 'vue' // 引入vue框架
-import VueRouter from 'vue-router' // 使用 vue-router
-import createRouter from './router' // router定义
+import router from './router' // router定义
 import VueI18n from 'vue-i18n' // 使用 国际化
 import createI18n from './assets/languages' // 国际化定义
-
+import store from './store'
 import App from './app.vue' // 初始化 vue页面
-import UploadForm from './components/upload-form'
 import './style.scss' // 公共样式
-import MetaInfo from 'vue-meta-info'
 import Element from 'element-ui'
-import modules from './modules'
-
+import Modules from '@/modules'
 import createBefore from './components/beforeEnter'
-import store from './store'
-
 import _ from 'lodash'
+
 Vue.prototype.$_ = _
 
-Vue.use(VueRouter)
-Vue.use(UploadForm)
-Vue.component(UploadForm.name, UploadForm)
-const router = createRouter()
 Vue.use(VueI18n)
 const i18n = createI18n()
-
-Vue.use(MetaInfo)
-
 Vue.use(Element, { i18n: (key, value) => i18n.t(key, value) })
-Vue.use(modules, { i18n })
+Vue.use(Modules, { i18n, router })
 
 /* 设置全局变量 */
 window.G = Vue.prototype.$GLOBAL = {
   VERSION: 'PC-1.0.0'
 }
-// window.Promise = Promise
+
 /**
  * 定义全局变量 - 用作全局事件发布订阅
  * 使用 vue自带事件 $emit 和 $on 进行发布订阅
  */
 Vue.prototype.VueEvent = new Vue()
+
 /* 创建实例之前，通过导航守卫，处理部分逻辑，如：是否直接进入系统 */
-const before = createBefore()
+const routerBefore = createBefore()
 /* 导航守卫 */
 router.beforeEach((to, from, next) => {
-  before.update(to, from, next)
+  routerBefore.update(to, from, next)
   // next()
 })
 

src/modules/viewer/components/player/videoPlayer.vue

@@ -29,26 +29,26 @@ export default {
       this.player = new Aliplayer(
         {
           id: 'player',
-          source: JSON.stringify({ FD, LD, SD }),
+          source: JSON.stringify({ SD, LD, FD }),
           width: '100%',
           height: '100%',
           autoplay: this.autoplay,
           isLive: false,
           controlBarVisibility: 'always',
           definition: 'FD,LD,SD',
-          defaultDefinition: 'LD',
+          defaultDefinition: 'SD',
           useHlsPluginForSafari: true
         },
-        function(player) {
-          player.on('ready', function() {
+        function (player) {
+          player.on('ready', function () {
             // 跳过片头
             _this.isSkip && player.seek(6)
             _this.$emit('ready', player)
           })
-          player.on('timeupdate', function(event) {
+          player.on('timeupdate', function (event) {
             _this.$emit('timeupdate', player.getCurrentTime())
           })
-          player.on('error', function(event) {
+          player.on('error', function (event) {
             console.log(event)
           })
         }

src/modules/viewer/index.js

+import Viewer from './index'
+import Routes from './routes'
+
+Viewer.install = function(Vue, options = {}) {
+  // 国际化
+  if (options.i18n) {
+    options.i18n.mergeLocaleMessage()
+  }
+  // 路由
+  if (options.router) {
+    options.router.addRoutes(Routes)
+  }
+}
+export default Viewer

src/modules/viewer/languages/en.js

+export default {
+  viewerPlayer: {},
+  viewerWork: {},
+  viewerExam: {},
+  viewerRead: {},
+  viewerLive: {}
+}

src/modules/viewer/languages/zh-CN.js

+export default {
+  viewerPlayer: {},
+  viewerWork: {},
+  viewerExam: {},
+  viewerRead: {},
+  viewerLive: {}
+}

src/router/index.js

+import Vue from 'vue'
 import Router from 'vue-router'
 import routes from './routes'
 
-export default () => {
-  return new Router({
-    routes,
-    mode: 'history', // 还有一个 hash 默认
-    fallback: true, // 浏览器不支持 history时，自动改成 hash方式
-    scrollBehavior (to, from, savedPosition) { // 每次打开，滚动到 最顶端
-      return { x: 0, y: 0 }
-    }
-  })
-}
+Vue.use(Router)
+
+export default new Router({
+  routes,
+  mode: 'history', // 还有一个 hash 默认
+  fallback: true, // 浏览器不支持 history时，自动改成 hash方式
+  scrollBehavior(to, from, savedPosition) {
+    // 每次打开，滚动到 最顶端
+    return { x: 0, y: 0 }
+  }
+})