v-viewer转化成cdn文件,优化包

components/AiOkrTree/model/node.js

@@ -1,4 +1,4 @@
-import { markNodeData, NODE_KEY } from './util';
+import {markNodeData} from './util';
 import objectAssign from './merge';
 
 const getPropertyFromData = function (node, prop) {

components/AiOkrTree/model/tree-store.js

@@ -1,5 +1,6 @@
 import Node from "./node";
 import {getNodeKey} from "./util";
+
 export default class TreeStore {
   constructor(options) {
     this.currentNode = null;

components/layout/AiDvDisplay/asset/displayItem-bg1.svg

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="128px" height="128px" viewBox="0 0 128 128" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="128px" height="128px" viewBox="0 0 128 128" version="1.1" xmlns="http://www.w3.org/2000/svg">
     <title>编组 3</title>
     <defs>
         <linearGradient x1="100%" y1="0%" x2="0%" y2="100%" id="linearGradient-1">

components/layout/AiDvSummary/asset/summary3-big.svg

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="280px" height="218px" viewBox="0 0 280 218" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="280px" height="218px" viewBox="0 0 280 218" version="1.1" xmlns="http://www.w3.org/2000/svg">
     <title>编组备份 3</title>
     <defs>
         <linearGradient x1="100%" y1="37.8854658%" x2="1.48868591%" y2="37.8854658%" id="linearGradient-1">

components/layout/AiDvSummary/asset/summary3-small.svg

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="214px" height="164px" viewBox="0 0 214 164" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="214px" height="164px" viewBox="0 0 214 164" version="1.1" xmlns="http://www.w3.org/2000/svg">
     <title>编组备份 4</title>
     <defs>
         <linearGradient x1="100%" y1="37.8854658%" x2="1.48868591%" y2="37.8854658%" id="linearGradient-1">

components/layout/AiDvSummary/asset/summary8-bg.svg

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="480px" height="124px" viewBox="0 0 480 124" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<svg width="480px" height="124px" viewBox="0 0 480 124" version="1.1" xmlns="http://www.w3.org/2000/svg">
     <title>矩形</title>
     <defs>
         <radialGradient cx="50%" cy="50%" fx="50%" fy="50%" r="219.598516%" gradientTransform="translate(0.500000,0.500000),scale(0.258333,1.000000),scale(1.000000,1.764370),translate(-0.500000,-0.500000)" id="radialGradient-1">

package.json

@@ -23,6 +23,8 @@
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@jiaminghi/data-view": "^2.10.0",
     "@logicflow/core": "^1.2.1",
+    "ag-grid-community": "^31.0.2",
+    "ag-grid-vue": "^31.0.2",
     "bin-ace-editor": "^3.2.0",
     "dayjs": "^1.8.35",
     "dui": "^2.0.0",
@@ -61,7 +63,6 @@
     "sass": "~1.32.6",
     "sass-loader": "^7.3.1",
     "uglifyjs-webpack-plugin": "^2.2.0",
-    "v-viewer": "^1.6.4",
     "vue": "^2.7.14",
     "vue-router": "^3.3.4",
     "vue-template-compiler": "^2.7.14",

packages/bigscreen/designer/components/datasourcePicker.vue

@@ -3,6 +3,8 @@
     <config-item label="数据类型">
       <ai-select v-model="source.dataType" placeholder="请选择数据类型" :select-list="dataTypes"/>
     </config-item>
+    <config-item label="静态数据" v-if="source.dataType === 'staticData'">
+    </config-item>
     <div class="codeEditor" v-if="['htmlData','staticData'].includes(source.dataType)">
       <ai-dialog-btn :modal="false" dialog-title="编辑器" :customFooter="false"
                      @confirm="changeData(JSON.parse(content))" @open="content=contentstr">

packages/bigscreen/designer/components/tableEditor.vue

@@ -0,0 +1,23 @@
+<script>
+import {AgGridVue} from "ag-grid-vue";
+import "ag-grid-community/styles/ag-grid.min.css"
+import "ag-grid-community/styles/ag-theme-balham.min.css"
+
+export default {
+  name: "tableEditor",
+  props: {
+    tableData: {default: () => []},
+    configs: {default: () => []}
+  },
+  components: {AgGridVue},
+  computed: {
+    columns: v => v.configs
+  },
+}
+</script>
+
+<template>
+  <section class="tableEditor">
+    <ag-grid-vue class="ag-theme-balham" :columnDefs="columns" :rowData="tableData"/>
+  </section>
+</template>

packages/conv/AppVillageAlbum/components/List.vue

@@ -67,9 +67,6 @@
 
 <script>
 import {mapState} from 'vuex'
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
 
 export default {
   name: 'FormList',
@@ -89,8 +86,7 @@
         timeTag: ''
       },
       isShowAdd: false,
-        form: {
+      form: {},
-        },
       list: [],
       total: 0,
       loading: false,
@@ -231,6 +227,7 @@
 .list {
   :deep( .ai-list__content ) {
     width: 100%;
+
     .ai-list__content--right {
       width: 100% !important;
 
@@ -241,6 +238,7 @@
       }
     }
   }
+
   :deep(.el-pager ) {
     li.active + li {
       border-left: 1px solid #D0D4DC;
@@ -258,6 +256,7 @@
       width: 100%;
       padding: 0;
     }
+
     :deep( .el-pager li.active ) {
       background-color: #fff !important;
       color: #2266FF !important;
@@ -388,6 +387,7 @@
         :deep( .el-button ) {
           margin-left: 0;
           padding: 0;
+
           i {
             color: #8899BB;
             font-size: 14px;

packages/party/AppMeetingChinaunion/components/meetingDetail.vue

@@ -213,12 +213,8 @@
 </template>
 
 <script>
-import Vue from 'vue'
 import {mapState} from "vuex";
 import moment from 'dayjs';
-import Viewer from 'v-viewer'
-
-Vue.use(Viewer)
 
 export default {
   name: "meetingDetail",

packages/publicity/AppHotTopic/components/hotDetail.vue

@@ -47,10 +47,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer' ;
-  import Vue from 'vue' ;
-
-  Vue.use(Viewer);
 export default {
   name: "hotDetail",
   label: "热点详情",

packages/publicity/AppPressCenter/components/newsDetail.vue

@@ -31,10 +31,6 @@
 </template>
 
 <script>
-import Viewer from 'v-viewer';
-import Vue from 'vue';
-
-Vue.use(Viewer);
 export default {
   name: "newsDetail",
   props: {

packages/publicity/AppPressCenter/components/videoDetail.vue

@@ -29,11 +29,8 @@
 </template>
 
 <script>
-import Viewer from 'v-viewer';
-
 export default {
   name: "videoDetail",
-  components: {Viewer},
   props: {
     instance: Function,
     dict: Object,

packages/work/processManagement/approvalManage/components/approvalDetail.vue

@@ -326,10 +326,6 @@
 <script>
 import moment from 'dayjs'
 import {mapState} from "vuex";
-import Viewer from 'v-viewer'
-import Vue from 'vue'
-
-Vue.use(Viewer)
 
 export default {
   name: "approvalDetail",

packages/work/processManagement/massesMessage/components/messageDetail.vue

@@ -89,10 +89,6 @@
 </template>
 <script>
 import { mapState } from 'vuex'
-// import 'viewerjs/dist/viewer.css'
-import Viewer from 'v-viewer'
-import Vue from 'vue'
-Vue.use(Viewer)
 
 export default {
   name: 'messageDetail',

packages/xbot/AppSensitiveXbot/components/Detail.vue

@@ -170,14 +170,9 @@
 
 <script>
   import { mapState } from 'vuex'
-  import Viewer from 'v-viewer'
   import AMapLoader from '@amap/amap-jsapi-loader'
-  import Vue from 'vue'
-  Vue.use(Viewer);
-
   import html2canvas from "html2canvas";
   import jsPDF from "jspdf";
-
   import { Loading } from "element-ui";
 
   const PdfLoader = (ele, pdfFileName) => {

packages/xbot/AppSessionArchiveXbot/components/Detail.vue

@@ -289,14 +289,9 @@
 
 <script>
 import { mapState } from "vuex";
-import Viewer from "v-viewer";
 import AMapLoader from "@amap/amap-jsapi-loader";
-import Vue from "vue";
-Vue.use(Viewer);
-
 import html2canvas from "html2canvas";
 import jsPDF from "jspdf";
-
 import { Loading } from "element-ui";
 
 const PdfLoader = (ele, pdfFileName) => {

project/biaopin/AppIntegratingOrder/components/ResidentList.vue

@@ -113,9 +113,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'ResidentList',
 

project/biaopin/AppIntegratingSupermarket/components/GoodsList.vue

@@ -79,9 +79,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'GoodsList',
 

project/fengdu/app/AppIntegratingOrder/components/ResidentList.vue

@@ -113,9 +113,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
 export default {
   name: 'ResidentList',
 
@@ -161,8 +158,7 @@
     }
   },
 
-    computed: {
+  computed: {},
-    },
 
   created() {
     this.dict.load('integralSGType', 'integralSGOStatus', 'yesOrNo', 'integralSGTypeText').then(() => {
@@ -236,15 +232,18 @@
     display: flex;
     align-items: center;
   }
+
   .img-content {
     position: relative;
     margin-right: 8px;
+
     img {
       width: 120px;
       height: 120px;
       cursor: pointer;
     }
   }
+
   .type {
     position: absolute;
     top: 0;
@@ -255,9 +254,11 @@
     color: #fff;
     z-index: 999;
   }
+
   .type1 {
     background-color: #E64E39;
   }
+
   .type0 {
     background-color: #FF6900;
   }

project/fengdu/app/AppIntegratingSupermarket/components/GoodsList.vue

@@ -79,12 +79,8 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
 export default {
   name: 'GoodsList',
-
   props: {
     instance: Function,
     dict: Object,
@@ -113,8 +109,7 @@
     }
   },
 
-    computed: {
+  computed: {},
-    },
 
   created() {
     this.dict.load('integralSGType', 'integralSGStatus', 'integralSGTypeText').then(() => {
@@ -200,15 +195,18 @@
     display: flex;
     align-items: center;
   }
+
   .img-content {
     position: relative;
     margin-right: 8px;
+
     img {
       width: 120px;
       height: 120px;
       cursor: pointer;
     }
   }
+
   .type {
     position: absolute;
     top: 0;
@@ -219,9 +217,11 @@
     z-index: 999;
     font-size: 12px;
   }
+
   .type1 {
     background-color: #E64E39;
   }
+
   .type0 {
     background-color: #FF6900;
   }

project/lulong/AppIntegratingOrder/components/ResidentList.vue

@@ -113,9 +113,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'ResidentList',
 

project/lulong/AppIntegratingSupermarket/components/GoodsList.vue

@@ -79,9 +79,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'GoodsList',
 

project/pidu/app/AppSensitive/components/Detail.vue

@@ -170,14 +170,9 @@
 
 <script>
   import { mapState } from 'vuex'
-  import Viewer from 'v-viewer'
   import AMapLoader from '@amap/amap-jsapi-loader'
-  import Vue from 'vue'
-  Vue.use(Viewer);
-
   import html2canvas from "html2canvas";
   import jsPDF from "jspdf";
-
   import { Loading } from "element-ui";
 
   const PdfLoader = (ele, pdfFileName) => {

project/pidu/app/AppSessionArchive/components/Detail.vue

@@ -289,14 +289,9 @@
 
 <script>
 import { mapState } from "vuex";
-import Viewer from "v-viewer";
 import AMapLoader from "@amap/amap-jsapi-loader";
-import Vue from "vue";
-Vue.use(Viewer);
-
 import html2canvas from "html2canvas";
 import jsPDF from "jspdf";
-
 import { Loading } from "element-ui";
 
 const PdfLoader = (ele, pdfFileName) => {

project/pingchang/apps/AppCheckpointManage/components/List.vue

@@ -55,9 +55,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'List',
 

project/shuzipingchang/app/AppIntegratingOrder/components/ResidentList.vue

@@ -111,9 +111,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'ResidentList',
 

project/shuzipingchang/app/AppIntegratingSupermarket/components/GoodsList.vue

@@ -78,9 +78,6 @@
 </template>
 
 <script>
-  import Viewer from 'v-viewer'
-  import Vue from 'vue'
-  Vue.use(Viewer)
   export default {
     name: 'GoodsList',
 

project/xiushan/apps/AppNewsCenter/components/newsDetail.vue

@@ -31,10 +31,6 @@
 </template>
 
 <script>
-import Viewer from 'v-viewer';
-import Vue from 'vue';
-
-Vue.use(Viewer);
 export default {
   name: "newsDetail",
   props: {

project/xiushan/apps/AppNewsCenter/components/videoDetail.vue

@@ -27,11 +27,8 @@
 </template>
 
 <script>
-import Viewer from 'v-viewer';
-
 export default {
   name: "videoDetail",
-  components: {Viewer},
   props: {
     instance: Function,
     dict: Object,

project/xiushan/apps/processManagement/approvalManage/components/approvalDetail.vue

@@ -300,13 +300,9 @@
 <script>
 import moment from 'dayjs'
 import {mapState} from "vuex";
-import Viewer from 'v-viewer'
-import Vue from 'vue'
 import PersonCreditReport from "../../../../components/personCreditReport";
 import EnterpriseDialog from "../../../../components/enterpriseDialog";
 
-Vue.use(Viewer)
-
 export default {
   name: "approvalDetail",
   components: {EnterpriseDialog, PersonCreditReport},

project/xiushan/apps/processManagement/massesMessage/components/messageDetail.vue

@@ -89,10 +89,6 @@
 </template>
 <script>
 import { mapState } from 'vuex'
-// import 'viewerjs/dist/viewer.css'
-import Viewer from 'v-viewer'
-import Vue from 'vue'
-Vue.use(Viewer)
 
 export default {
   name: 'messageDetail',

public/cdn/viewerjs/1.11.6/viewer.css

@@ -0,0 +1,446 @@
+/*!
+ * Viewer.js v1.11.6
+ * https://fengyuanchen.github.io/viewerjs
+ *
+ * Copyright 2015-present Chen Fengyuan
+ * Released under the MIT license
+ *
+ * Date: 2023-09-17T03:16:35.830Z
+ */
+
+.viewer-zoom-in::before, .viewer-zoom-out::before, .viewer-one-to-one::before, .viewer-reset::before, .viewer-prev::before, .viewer-play::before, .viewer-next::before, .viewer-rotate-left::before, .viewer-rotate-right::before, .viewer-flip-horizontal::before, .viewer-flip-vertical::before, .viewer-fullscreen::before, .viewer-fullscreen-exit::before, .viewer-close::before {
+    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAAAUCAYAAABWOyJDAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAQPSURBVHic7Zs/iFxVFMa/0U2UaJGksUgnIVhYxVhpjDbZCBmLdAYECxsRFBTUamcXUiSNncgKQbSxsxH8gzAP3FU2jY0kKKJNiiiIghFlccnP4p3nPCdv3p9778vsLOcHB2bfveeb7955c3jvvNkBIMdxnD64a94GHMfZu3iBcRynN7zAOI7TG15gHCeeNUkr8zaxG2lbYDYsdgMbktBsP03jdQwljSXdtBhLOmtjowC9Mg9L+knSlcD8TNKpSA9lBpK2JF2VdDSR5n5J64m0qli399hNFMUlpshQii5jbXTbHGviB0nLNeNDSd9VO4A2UdB2fp+x0eCnaXxWXGA2X0au/3HgN9P4LFCjIANOJdrLr0zzZ+BEpNYDwKbpnQMeAw4m8HjQtM6Z9qa917zPQwFr3M5KgA6J5rTJCdFZJj9/lyvGhsDvwFNVuV2MhhjrK6b9bFiE+j1r87eBl4HDwCF7/U/k+ofAX5b/EXBv5JoLMuILzf3Ap6Z3EzgdqHMCuF7hcQf4HDgeoHnccncqdK/TvSDWffFXI/exICY/xZyqc6XLWF1UFZna4gJ7q8BsRvgd2/xXpo6P+D9dfT7PpECtA3cnWPM0GXGFZh/wgWltA+cDNC7X+AP4GzjZQe+k5dRxuYPeiuXU7e1qwLpDz7dFjXKRaSwuMLvAlG8zZlG+YmiK1HoFqT7wP2z+4Q45TfEGcMt01xLoNZEBTwRqD4BLpnMLeC1A41UmVxsXgXeBayV/Wx20rpTyrpnWRft7p6O/FdqzGrDukPNtkaMoMo3FBdBSQMOnYBCReyf05s126fU9ytfX98+mY54Kxnp7S9K3kj6U9KYdG0h6UdLbkh7poFXMfUnSOyVvL0h6VtIXHbS6nOP+s/Zm9mvyXW1uuC9ohZ72E9uDmXWLJOB1GxsH+DxPftsB8B6wlGDN02TAkxG6+4D3TWsbeC5CS8CDFce+AW500LhhOW2020TRjK3b21HEmgti9m0RonxbdMZeVzV+/4tF3cBpP7E9mKHNL5q8h5g0eYsCMQz0epq8gQrwMXAgcs0FGXGFRcB9wCemF9PkbYqM/Bas7fxLwNeJPdTdpo4itQti8lPMqTpXuozVRVXPpbHI3KkNTB1NfkL81j2mvhDp91HgV9MKuRIqrykj3WPq4rHyL+axj8/qGPmTqi6F9YDlHOvJU6oYcTsh/TYSzWmTE6JT19CtLTJt32D6CmHe0eQn1O8z5AXgT4sx4Vcu0/EQecMydB8z0hUWkTd2t4CrwNEePqMBcAR4mrBbwyXLPWJa8zrXmmLEhNBmfpkuY2102xxrih+pb+ieAb6vGhuA97UcJ5KR8gZ77K+99xxeYBzH6Q3/Z0fHcXrDC4zjOL3hBcZxnN74F+zlvXFWXF9PAAAAAElFTkSuQmCC');
+    background-repeat: no-repeat;
+    background-size: 280px;
+    color: transparent;
+    display: block;
+    font-size: 0;
+    height: 20px;
+    line-height: 0;
+    width: 20px;
+  }
+
+.viewer-zoom-in::before {
+  background-position: 0 0;
+  content: 'Zoom In';
+}
+
+.viewer-zoom-out::before {
+  background-position: -20px 0;
+  content: 'Zoom Out';
+}
+
+.viewer-one-to-one::before {
+  background-position: -40px 0;
+  content: 'One to One';
+}
+
+.viewer-reset::before {
+  background-position: -60px 0;
+  content: 'Reset';
+}
+
+.viewer-prev::before {
+  background-position: -80px 0;
+  content: 'Previous';
+}
+
+.viewer-play::before {
+  background-position: -100px 0;
+  content: 'Play';
+}
+
+.viewer-next::before {
+  background-position: -120px 0;
+  content: 'Next';
+}
+
+.viewer-rotate-left::before {
+  background-position: -140px 0;
+  content: 'Rotate Left';
+}
+
+.viewer-rotate-right::before {
+  background-position: -160px 0;
+  content: 'Rotate Right';
+}
+
+.viewer-flip-horizontal::before {
+  background-position: -180px 0;
+  content: 'Flip Horizontal';
+}
+
+.viewer-flip-vertical::before {
+  background-position: -200px 0;
+  content: 'Flip Vertical';
+}
+
+.viewer-fullscreen::before {
+  background-position: -220px 0;
+  content: 'Enter Full Screen';
+}
+
+.viewer-fullscreen-exit::before {
+  background-position: -240px 0;
+  content: 'Exit Full Screen';
+}
+
+.viewer-close::before {
+  background-position: -260px 0;
+  content: 'Close';
+}
+
+.viewer-container {
+  bottom: 0;
+  direction: ltr;
+  font-size: 0;
+  left: 0;
+  line-height: 0;
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  -webkit-tap-highlight-color: transparent;
+  top: 0;
+  -ms-touch-action: none;
+      touch-action: none;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+
+.viewer-container::-moz-selection, .viewer-container *::-moz-selection {
+    background-color: transparent;
+  }
+
+.viewer-container::selection,
+  .viewer-container *::selection {
+    background-color: transparent;
+  }
+
+.viewer-container:focus {
+    outline: 0;
+  }
+
+.viewer-container img {
+    display: block;
+    height: auto;
+    max-height: none !important;
+    max-width: none !important;
+    min-height: 0 !important;
+    min-width: 0 !important;
+    width: 100%;
+  }
+
+.viewer-canvas {
+  bottom: 0;
+  left: 0;
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.viewer-canvas > img {
+    height: auto;
+    margin: 15px auto;
+    max-width: 90% !important;
+    width: auto;
+  }
+
+.viewer-footer {
+  bottom: 0;
+  left: 0;
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  text-align: center;
+}
+
+.viewer-navbar {
+  background-color: rgba(0, 0, 0, 0.5);
+  overflow: hidden;
+}
+
+.viewer-list {
+  box-sizing: content-box;
+  height: 50px;
+  margin: 0;
+  overflow: hidden;
+  padding: 1px 0;
+}
+
+.viewer-list > li {
+    color: transparent;
+    cursor: pointer;
+    float: left;
+    font-size: 0;
+    height: 50px;
+    line-height: 0;
+    opacity: 0.5;
+    overflow: hidden;
+    transition: opacity 0.15s;
+    width: 30px;
+  }
+
+.viewer-list > li:focus,
+    .viewer-list > li:hover {
+      opacity: 0.75;
+    }
+
+.viewer-list > li:focus {
+      outline: 0;
+    }
+
+.viewer-list > li + li {
+      margin-left: 1px;
+    }
+
+.viewer-list > .viewer-loading {
+    position: relative;
+  }
+
+.viewer-list > .viewer-loading::after {
+      border-width: 2px;
+      height: 20px;
+      margin-left: -10px;
+      margin-top: -10px;
+      width: 20px;
+    }
+
+.viewer-list > .viewer-active,
+  .viewer-list > .viewer-active:focus,
+  .viewer-list > .viewer-active:hover {
+    opacity: 1;
+  }
+
+.viewer-player {
+  background-color: #000;
+  bottom: 0;
+  cursor: none;
+  display: none;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 1;
+}
+
+.viewer-player > img {
+    left: 0;
+    position: absolute;
+    top: 0;
+  }
+
+.viewer-toolbar > ul {
+    display: inline-block;
+    margin: 0 auto 5px;
+    overflow: hidden;
+    padding: 6px 3px;
+  }
+
+.viewer-toolbar > ul > li {
+      background-color: rgba(0, 0, 0, 0.5);
+      border-radius: 50%;
+      cursor: pointer;
+      float: left;
+      height: 24px;
+      overflow: hidden;
+      transition: background-color 0.15s;
+      width: 24px;
+    }
+
+.viewer-toolbar > ul > li:focus,
+      .viewer-toolbar > ul > li:hover {
+        background-color: rgba(0, 0, 0, 0.8);
+      }
+
+.viewer-toolbar > ul > li:focus {
+        box-shadow: 0 0 3px #fff;
+        outline: 0;
+        position: relative;
+        z-index: 1;
+      }
+
+.viewer-toolbar > ul > li::before {
+        margin: 2px;
+      }
+
+.viewer-toolbar > ul > li + li {
+        margin-left: 1px;
+      }
+
+.viewer-toolbar > ul > .viewer-small {
+      height: 18px;
+      margin-bottom: 3px;
+      margin-top: 3px;
+      width: 18px;
+    }
+
+.viewer-toolbar > ul > .viewer-small::before {
+        margin: -1px;
+      }
+
+.viewer-toolbar > ul > .viewer-large {
+      height: 30px;
+      margin-bottom: -3px;
+      margin-top: -3px;
+      width: 30px;
+    }
+
+.viewer-toolbar > ul > .viewer-large::before {
+        margin: 5px;
+      }
+
+.viewer-tooltip {
+  background-color: rgba(0, 0, 0, 0.8);
+  border-radius: 10px;
+  color: #fff;
+  display: none;
+  font-size: 12px;
+  height: 20px;
+  left: 50%;
+  line-height: 20px;
+  margin-left: -25px;
+  margin-top: -10px;
+  position: absolute;
+  text-align: center;
+  top: 50%;
+  width: 50px;
+}
+
+.viewer-title {
+  color: #ccc;
+  display: inline-block;
+  font-size: 12px;
+  line-height: 1.2;
+  margin: 5px 5%;
+  max-width: 90%;
+  min-height: 14px;
+  opacity: 0.8;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  transition: opacity 0.15s;
+  white-space: nowrap;
+}
+
+.viewer-title:hover {
+    opacity: 1;
+  }
+
+.viewer-button {
+  -webkit-app-region: no-drag;
+  background-color: rgba(0, 0, 0, 0.5);
+  border-radius: 50%;
+  cursor: pointer;
+  height: 80px;
+  overflow: hidden;
+  position: absolute;
+  right: -40px;
+  top: -40px;
+  transition: background-color 0.15s;
+  width: 80px;
+}
+
+.viewer-button:focus,
+  .viewer-button:hover {
+    background-color: rgba(0, 0, 0, 0.8);
+  }
+
+.viewer-button:focus {
+    box-shadow: 0 0 3px #fff;
+    outline: 0;
+  }
+
+.viewer-button::before {
+    bottom: 15px;
+    left: 15px;
+    position: absolute;
+  }
+
+.viewer-fixed {
+  position: fixed;
+}
+
+.viewer-open {
+  overflow: hidden;
+}
+
+.viewer-show {
+  display: block;
+}
+
+.viewer-hide {
+  display: none;
+}
+
+.viewer-backdrop {
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+.viewer-invisible {
+  visibility: hidden;
+}
+
+.viewer-move {
+  cursor: move;
+  cursor: grab;
+}
+
+.viewer-fade {
+  opacity: 0;
+}
+
+.viewer-in {
+  opacity: 1;
+}
+
+.viewer-transition {
+  transition: all 0.3s;
+}
+
+@keyframes viewer-spinner {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+.viewer-loading::after {
+    animation: viewer-spinner 1s linear infinite;
+    border: 4px solid rgba(255, 255, 255, 0.1);
+    border-left-color: rgba(255, 255, 255, 0.5);
+    border-radius: 50%;
+    content: '';
+    display: inline-block;
+    height: 40px;
+    left: 50%;
+    margin-left: -20px;
+    margin-top: -20px;
+    position: absolute;
+    top: 50%;
+    width: 40px;
+    z-index: 1;
+  }
+
+@media (max-width: 767px) {
+  .viewer-hide-xs-down {
+    display: none;
+  }
+}
+
+@media (max-width: 991px) {
+  .viewer-hide-sm-down {
+    display: none;
+  }
+}
+
+@media (max-width: 1199px) {
+  .viewer-hide-md-down {
+    display: none;
+  }
+}

public/index.html

@@ -4,7 +4,9 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
-  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico"/>
+    <link rel="stylesheet" href="<%= BASE_URL %>cdn/viewerjs/1.11.6/viewer.css"/>
+    <script src="<%= BASE_URL %>cdn/viewerjs/1.11.6/viewer.min.js"></script>
     <title>web端应用库-展示页面</title>
     <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" referrerpolicy="origin"></script>
     <script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js" referrerpolicy="origin"></script>

ui/lib/cdn/v-viewer/1.7.4/v-viewer.js

@@ -0,0 +1,826 @@
+import Viewer from "viewerjs";
+import Vue from "vue";
+
+export { default as Viewer } from "viewerjs";
+var freeGlobal = typeof global == "object" && global && global.Object === Object && global;
+var freeGlobal$1 = freeGlobal;
+var freeSelf = typeof self == "object" && self && self.Object === Object && self;
+var root = freeGlobal$1 || freeSelf || Function("return this")();
+var root$1 = root;
+var Symbol$1 = root$1.Symbol;
+var Symbol$2 = Symbol$1;
+var objectProto$8 = Object.prototype;
+var hasOwnProperty$6 = objectProto$8.hasOwnProperty;
+var nativeObjectToString$1 = objectProto$8.toString;
+var symToStringTag$1 = Symbol$2 ? Symbol$2.toStringTag : void 0;
+function getRawTag(value) {
+  var isOwn = hasOwnProperty$6.call(value, symToStringTag$1), tag = value[symToStringTag$1];
+  try {
+    value[symToStringTag$1] = void 0;
+    var unmasked = true;
+  } catch (e) {
+  }
+  var result = nativeObjectToString$1.call(value);
+  if (unmasked) {
+    if (isOwn) {
+      value[symToStringTag$1] = tag;
+    } else {
+      delete value[symToStringTag$1];
+    }
+  }
+  return result;
+}
+var objectProto$7 = Object.prototype;
+var nativeObjectToString = objectProto$7.toString;
+function objectToString(value) {
+  return nativeObjectToString.call(value);
+}
+var nullTag = "[object Null]", undefinedTag = "[object Undefined]";
+var symToStringTag = Symbol$2 ? Symbol$2.toStringTag : void 0;
+function baseGetTag(value) {
+  if (value == null) {
+    return value === void 0 ? undefinedTag : nullTag;
+  }
+  return symToStringTag && symToStringTag in Object(value) ? getRawTag(value) : objectToString(value);
+}
+function isObjectLike(value) {
+  return value != null && typeof value == "object";
+}
+var symbolTag = "[object Symbol]";
+function isSymbol(value) {
+  return typeof value == "symbol" || isObjectLike(value) && baseGetTag(value) == symbolTag;
+}
+var isArray = Array.isArray;
+var isArray$1 = isArray;
+var reWhitespace = /\s/;
+function trimmedEndIndex(string) {
+  var index2 = string.length;
+  while (index2-- && reWhitespace.test(string.charAt(index2))) {
+  }
+  return index2;
+}
+var reTrimStart = /^\s+/;
+function baseTrim(string) {
+  return string ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, "") : string;
+}
+function isObject(value) {
+  var type = typeof value;
+  return value != null && (type == "object" || type == "function");
+}
+var NAN = 0 / 0;
+var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
+var reIsBinary = /^0b[01]+$/i;
+var reIsOctal = /^0o[0-7]+$/i;
+var freeParseInt = parseInt;
+function toNumber(value) {
+  if (typeof value == "number") {
+    return value;
+  }
+  if (isSymbol(value)) {
+    return NAN;
+  }
+  if (isObject(value)) {
+    var other = typeof value.valueOf == "function" ? value.valueOf() : value;
+    value = isObject(other) ? other + "" : other;
+  }
+  if (typeof value != "string") {
+    return value === 0 ? value : +value;
+  }
+  value = baseTrim(value);
+  var isBinary = reIsBinary.test(value);
+  return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
+}
+function identity(value) {
+  return value;
+}
+var asyncTag = "[object AsyncFunction]", funcTag$1 = "[object Function]", genTag = "[object GeneratorFunction]", proxyTag = "[object Proxy]";
+function isFunction(value) {
+  if (!isObject(value)) {
+    return false;
+  }
+  var tag = baseGetTag(value);
+  return tag == funcTag$1 || tag == genTag || tag == asyncTag || tag == proxyTag;
+}
+var coreJsData = root$1["__core-js_shared__"];
+var coreJsData$1 = coreJsData;
+var maskSrcKey = function() {
+  var uid = /[^.]+$/.exec(coreJsData$1 && coreJsData$1.keys && coreJsData$1.keys.IE_PROTO || "");
+  return uid ? "Symbol(src)_1." + uid : "";
+}();
+function isMasked(func) {
+  return !!maskSrcKey && maskSrcKey in func;
+}
+var funcProto$1 = Function.prototype;
+var funcToString$1 = funcProto$1.toString;
+function toSource(func) {
+  if (func != null) {
+    try {
+      return funcToString$1.call(func);
+    } catch (e) {
+    }
+    try {
+      return func + "";
+    } catch (e) {
+    }
+  }
+  return "";
+}
+var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
+var reIsHostCtor = /^\[object .+?Constructor\]$/;
+var funcProto = Function.prototype, objectProto$6 = Object.prototype;
+var funcToString = funcProto.toString;
+var hasOwnProperty$5 = objectProto$6.hasOwnProperty;
+var reIsNative = RegExp(
+  "^" + funcToString.call(hasOwnProperty$5).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
+);
+function baseIsNative(value) {
+  if (!isObject(value) || isMasked(value)) {
+    return false;
+  }
+  var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
+  return pattern.test(toSource(value));
+}
+function getValue(object, key) {
+  return object == null ? void 0 : object[key];
+}
+function getNative(object, key) {
+  var value = getValue(object, key);
+  return baseIsNative(value) ? value : void 0;
+}
+function apply(func, thisArg, args) {
+  switch (args.length) {
+    case 0:
+      return func.call(thisArg);
+    case 1:
+      return func.call(thisArg, args[0]);
+    case 2:
+      return func.call(thisArg, args[0], args[1]);
+    case 3:
+      return func.call(thisArg, args[0], args[1], args[2]);
+  }
+  return func.apply(thisArg, args);
+}
+var HOT_COUNT = 800, HOT_SPAN = 16;
+var nativeNow = Date.now;
+function shortOut(func) {
+  var count = 0, lastCalled = 0;
+  return function() {
+    var stamp = nativeNow(), remaining = HOT_SPAN - (stamp - lastCalled);
+    lastCalled = stamp;
+    if (remaining > 0) {
+      if (++count >= HOT_COUNT) {
+        return arguments[0];
+      }
+    } else {
+      count = 0;
+    }
+    return func.apply(void 0, arguments);
+  };
+}
+function constant(value) {
+  return function() {
+    return value;
+  };
+}
+var defineProperty = function() {
+  try {
+    var func = getNative(Object, "defineProperty");
+    func({}, "", {});
+    return func;
+  } catch (e) {
+  }
+}();
+var defineProperty$1 = defineProperty;
+var baseSetToString = !defineProperty$1 ? identity : function(func, string) {
+  return defineProperty$1(func, "toString", {
+    "configurable": true,
+    "enumerable": false,
+    "value": constant(string),
+    "writable": true
+  });
+};
+var baseSetToString$1 = baseSetToString;
+var setToString = shortOut(baseSetToString$1);
+var setToString$1 = setToString;
+var MAX_SAFE_INTEGER$1 = 9007199254740991;
+var reIsUint = /^(?:0|[1-9]\d*)$/;
+function isIndex(value, length) {
+  var type = typeof value;
+  length = length == null ? MAX_SAFE_INTEGER$1 : length;
+  return !!length && (type == "number" || type != "symbol" && reIsUint.test(value)) && (value > -1 && value % 1 == 0 && value < length);
+}
+function baseAssignValue(object, key, value) {
+  if (key == "__proto__" && defineProperty$1) {
+    defineProperty$1(object, key, {
+      "configurable": true,
+      "enumerable": true,
+      "value": value,
+      "writable": true
+    });
+  } else {
+    object[key] = value;
+  }
+}
+function eq(value, other) {
+  return value === other || value !== value && other !== other;
+}
+var objectProto$5 = Object.prototype;
+var hasOwnProperty$4 = objectProto$5.hasOwnProperty;
+function assignValue(object, key, value) {
+  var objValue = object[key];
+  if (!(hasOwnProperty$4.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) {
+    baseAssignValue(object, key, value);
+  }
+}
+function copyObject(source, props, object, customizer) {
+  var isNew = !object;
+  object || (object = {});
+  var index2 = -1, length = props.length;
+  while (++index2 < length) {
+    var key = props[index2];
+    var newValue = customizer ? customizer(object[key], source[key], key, object, source) : void 0;
+    if (newValue === void 0) {
+      newValue = source[key];
+    }
+    if (isNew) {
+      baseAssignValue(object, key, newValue);
+    } else {
+      assignValue(object, key, newValue);
+    }
+  }
+  return object;
+}
+var nativeMax$1 = Math.max;
+function overRest(func, start, transform) {
+  start = nativeMax$1(start === void 0 ? func.length - 1 : start, 0);
+  return function() {
+    var args = arguments, index2 = -1, length = nativeMax$1(args.length - start, 0), array = Array(length);
+    while (++index2 < length) {
+      array[index2] = args[start + index2];
+    }
+    index2 = -1;
+    var otherArgs = Array(start + 1);
+    while (++index2 < start) {
+      otherArgs[index2] = args[index2];
+    }
+    otherArgs[start] = transform(array);
+    return apply(func, this, otherArgs);
+  };
+}
+function baseRest(func, start) {
+  return setToString$1(overRest(func, start, identity), func + "");
+}
+var MAX_SAFE_INTEGER = 9007199254740991;
+function isLength(value) {
+  return typeof value == "number" && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
+}
+function isArrayLike(value) {
+  return value != null && isLength(value.length) && !isFunction(value);
+}
+function isIterateeCall(value, index2, object) {
+  if (!isObject(object)) {
+    return false;
+  }
+  var type = typeof index2;
+  if (type == "number" ? isArrayLike(object) && isIndex(index2, object.length) : type == "string" && index2 in object) {
+    return eq(object[index2], value);
+  }
+  return false;
+}
+function createAssigner(assigner) {
+  return baseRest(function(object, sources) {
+    var index2 = -1, length = sources.length, customizer = length > 1 ? sources[length - 1] : void 0, guard = length > 2 ? sources[2] : void 0;
+    customizer = assigner.length > 3 && typeof customizer == "function" ? (length--, customizer) : void 0;
+    if (guard && isIterateeCall(sources[0], sources[1], guard)) {
+      customizer = length < 3 ? void 0 : customizer;
+      length = 1;
+    }
+    object = Object(object);
+    while (++index2 < length) {
+      var source = sources[index2];
+      if (source) {
+        assigner(object, source, index2, customizer);
+      }
+    }
+    return object;
+  });
+}
+var objectProto$4 = Object.prototype;
+function isPrototype(value) {
+  var Ctor = value && value.constructor, proto = typeof Ctor == "function" && Ctor.prototype || objectProto$4;
+  return value === proto;
+}
+function baseTimes(n, iteratee) {
+  var index2 = -1, result = Array(n);
+  while (++index2 < n) {
+    result[index2] = iteratee(index2);
+  }
+  return result;
+}
+var argsTag$1 = "[object Arguments]";
+function baseIsArguments(value) {
+  return isObjectLike(value) && baseGetTag(value) == argsTag$1;
+}
+var objectProto$3 = Object.prototype;
+var hasOwnProperty$3 = objectProto$3.hasOwnProperty;
+var propertyIsEnumerable = objectProto$3.propertyIsEnumerable;
+var isArguments = baseIsArguments(function() {
+  return arguments;
+}()) ? baseIsArguments : function(value) {
+  return isObjectLike(value) && hasOwnProperty$3.call(value, "callee") && !propertyIsEnumerable.call(value, "callee");
+};
+var isArguments$1 = isArguments;
+function stubFalse() {
+  return false;
+}
+var freeExports$1 = typeof exports == "object" && exports && !exports.nodeType && exports;
+var freeModule$1 = freeExports$1 && typeof module == "object" && module && !module.nodeType && module;
+var moduleExports$1 = freeModule$1 && freeModule$1.exports === freeExports$1;
+var Buffer = moduleExports$1 ? root$1.Buffer : void 0;
+var nativeIsBuffer = Buffer ? Buffer.isBuffer : void 0;
+var isBuffer = nativeIsBuffer || stubFalse;
+var isBuffer$1 = isBuffer;
+var argsTag = "[object Arguments]", arrayTag = "[object Array]", boolTag = "[object Boolean]", dateTag = "[object Date]", errorTag = "[object Error]", funcTag = "[object Function]", mapTag = "[object Map]", numberTag = "[object Number]", objectTag = "[object Object]", regexpTag = "[object RegExp]", setTag = "[object Set]", stringTag = "[object String]", weakMapTag = "[object WeakMap]";
+var arrayBufferTag = "[object ArrayBuffer]", dataViewTag = "[object DataView]", float32Tag = "[object Float32Array]", float64Tag = "[object Float64Array]", int8Tag = "[object Int8Array]", int16Tag = "[object Int16Array]", int32Tag = "[object Int32Array]", uint8Tag = "[object Uint8Array]", uint8ClampedTag = "[object Uint8ClampedArray]", uint16Tag = "[object Uint16Array]", uint32Tag = "[object Uint32Array]";
+var typedArrayTags = {};
+typedArrayTags[float32Tag] = typedArrayTags[float64Tag] = typedArrayTags[int8Tag] = typedArrayTags[int16Tag] = typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] = typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] = typedArrayTags[uint32Tag] = true;
+typedArrayTags[argsTag] = typedArrayTags[arrayTag] = typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] = typedArrayTags[dataViewTag] = typedArrayTags[dateTag] = typedArrayTags[errorTag] = typedArrayTags[funcTag] = typedArrayTags[mapTag] = typedArrayTags[numberTag] = typedArrayTags[objectTag] = typedArrayTags[regexpTag] = typedArrayTags[setTag] = typedArrayTags[stringTag] = typedArrayTags[weakMapTag] = false;
+function baseIsTypedArray(value) {
+  return isObjectLike(value) && isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
+}
+function baseUnary(func) {
+  return function(value) {
+    return func(value);
+  };
+}
+var freeExports = typeof exports == "object" && exports && !exports.nodeType && exports;
+var freeModule = freeExports && typeof module == "object" && module && !module.nodeType && module;
+var moduleExports = freeModule && freeModule.exports === freeExports;
+var freeProcess = moduleExports && freeGlobal$1.process;
+var nodeUtil = function() {
+  try {
+    var types = freeModule && freeModule.require && freeModule.require("util").types;
+    if (types) {
+      return types;
+    }
+    return freeProcess && freeProcess.binding && freeProcess.binding("util");
+  } catch (e) {
+  }
+}();
+var nodeUtil$1 = nodeUtil;
+var nodeIsTypedArray = nodeUtil$1 && nodeUtil$1.isTypedArray;
+var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;
+var isTypedArray$1 = isTypedArray;
+var objectProto$2 = Object.prototype;
+var hasOwnProperty$2 = objectProto$2.hasOwnProperty;
+function arrayLikeKeys(value, inherited) {
+  var isArr = isArray$1(value), isArg = !isArr && isArguments$1(value), isBuff = !isArr && !isArg && isBuffer$1(value), isType = !isArr && !isArg && !isBuff && isTypedArray$1(value), skipIndexes = isArr || isArg || isBuff || isType, result = skipIndexes ? baseTimes(value.length, String) : [], length = result.length;
+  for (var key in value) {
+    if ((inherited || hasOwnProperty$2.call(value, key)) && !(skipIndexes && (key == "length" || isBuff && (key == "offset" || key == "parent") || isType && (key == "buffer" || key == "byteLength" || key == "byteOffset") || isIndex(key, length)))) {
+      result.push(key);
+    }
+  }
+  return result;
+}
+function overArg(func, transform) {
+  return function(arg) {
+    return func(transform(arg));
+  };
+}
+var nativeKeys = overArg(Object.keys, Object);
+var nativeKeys$1 = nativeKeys;
+var objectProto$1 = Object.prototype;
+var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
+function baseKeys(object) {
+  if (!isPrototype(object)) {
+    return nativeKeys$1(object);
+  }
+  var result = [];
+  for (var key in Object(object)) {
+    if (hasOwnProperty$1.call(object, key) && key != "constructor") {
+      result.push(key);
+    }
+  }
+  return result;
+}
+function keys(object) {
+  return isArrayLike(object) ? arrayLikeKeys(object) : baseKeys(object);
+}
+var objectProto = Object.prototype;
+var hasOwnProperty = objectProto.hasOwnProperty;
+var assign = createAssigner(function(object, source) {
+  if (isPrototype(source) || isArrayLike(source)) {
+    copyObject(source, keys(source), object);
+    return;
+  }
+  for (var key in source) {
+    if (hasOwnProperty.call(source, key)) {
+      assignValue(object, key, source[key]);
+    }
+  }
+});
+var assign$1 = assign;
+var now = function() {
+  return root$1.Date.now();
+};
+var now$1 = now;
+var FUNC_ERROR_TEXT = "Expected a function";
+var nativeMax = Math.max, nativeMin = Math.min;
+function debounce(func, wait, options) {
+  var lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true;
+  if (typeof func != "function") {
+    throw new TypeError(FUNC_ERROR_TEXT);
+  }
+  wait = toNumber(wait) || 0;
+  if (isObject(options)) {
+    leading = !!options.leading;
+    maxing = "maxWait" in options;
+    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
+    trailing = "trailing" in options ? !!options.trailing : trailing;
+  }
+  function invokeFunc(time) {
+    var args = lastArgs, thisArg = lastThis;
+    lastArgs = lastThis = void 0;
+    lastInvokeTime = time;
+    result = func.apply(thisArg, args);
+    return result;
+  }
+  function leadingEdge(time) {
+    lastInvokeTime = time;
+    timerId = setTimeout(timerExpired, wait);
+    return leading ? invokeFunc(time) : result;
+  }
+  function remainingWait(time) {
+    var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime, timeWaiting = wait - timeSinceLastCall;
+    return maxing ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
+  }
+  function shouldInvoke(time) {
+    var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime;
+    return lastCallTime === void 0 || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
+  }
+  function timerExpired() {
+    var time = now$1();
+    if (shouldInvoke(time)) {
+      return trailingEdge(time);
+    }
+    timerId = setTimeout(timerExpired, remainingWait(time));
+  }
+  function trailingEdge(time) {
+    timerId = void 0;
+    if (trailing && lastArgs) {
+      return invokeFunc(time);
+    }
+    lastArgs = lastThis = void 0;
+    return result;
+  }
+  function cancel() {
+    if (timerId !== void 0) {
+      clearTimeout(timerId);
+    }
+    lastInvokeTime = 0;
+    lastArgs = lastCallTime = lastThis = timerId = void 0;
+  }
+  function flush() {
+    return timerId === void 0 ? result : trailingEdge(now$1());
+  }
+  function debounced() {
+    var time = now$1(), isInvoking = shouldInvoke(time);
+    lastArgs = arguments;
+    lastThis = this;
+    lastCallTime = time;
+    if (isInvoking) {
+      if (timerId === void 0) {
+        return leadingEdge(lastCallTime);
+      }
+      if (maxing) {
+        clearTimeout(timerId);
+        timerId = setTimeout(timerExpired, wait);
+        return invokeFunc(lastCallTime);
+      }
+    }
+    if (timerId === void 0) {
+      timerId = setTimeout(timerExpired, wait);
+    }
+    return result;
+  }
+  debounced.cancel = cancel;
+  debounced.flush = flush;
+  return debounced;
+}
+var render = function() {
+  var _vm = this;
+  var _h = _vm.$createElement;
+  var _c = _vm._self._c || _h;
+  return _c("div", [_vm._t("default", null, { "images": _vm.images, "options": _vm.options })], 2);
+};
+var staticRenderFns = [];
+function normalizeComponent(scriptExports, render2, staticRenderFns2, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
+  var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
+  if (render2) {
+    options.render = render2;
+    options.staticRenderFns = staticRenderFns2;
+    options._compiled = true;
+  }
+  if (functionalTemplate) {
+    options.functional = true;
+  }
+  if (scopeId) {
+    options._scopeId = "data-v-" + scopeId;
+  }
+  var hook;
+  if (moduleIdentifier) {
+    hook = function(context) {
+      context = context || this.$vnode && this.$vnode.ssrContext || this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext;
+      if (!context && typeof __VUE_SSR_CONTEXT__ !== "undefined") {
+        context = __VUE_SSR_CONTEXT__;
+      }
+      if (injectStyles) {
+        injectStyles.call(this, context);
+      }
+      if (context && context._registeredComponents) {
+        context._registeredComponents.add(moduleIdentifier);
+      }
+    };
+    options._ssrRegister = hook;
+  } else if (injectStyles) {
+    hook = shadowMode ? function() {
+      injectStyles.call(
+        this,
+        (options.functional ? this.parent : this).$root.$options.shadowRoot
+      );
+    } : injectStyles;
+  }
+  if (hook) {
+    if (options.functional) {
+      options._injectStyles = hook;
+      var originalRender = options.render;
+      options.render = function renderWithStyleInjection(h, context) {
+        hook.call(context);
+        return originalRender(h, context);
+      };
+    } else {
+      var existing = options.beforeCreate;
+      options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
+    }
+  }
+  return {
+    exports: scriptExports,
+    options
+  };
+}
+const __vue2_script = {
+  props: {
+    images: {
+      type: Array
+    },
+    rebuild: {
+      type: Boolean,
+      default: false
+    },
+    trigger: {},
+    options: {
+      type: Object
+    }
+  },
+  data() {
+    return {};
+  },
+  computed: {},
+  watch: {
+    images() {
+      this.$nextTick(() => {
+        this.onChange();
+      });
+    },
+    trigger: {
+      handler() {
+        this.$nextTick(() => {
+          this.onChange();
+        });
+      },
+      deep: true
+    },
+    options: {
+      handler() {
+        this.$nextTick(() => {
+          this.rebuildViewer();
+        });
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.createViewer();
+  },
+  unmounted() {
+    this.destroyViewer();
+  },
+  methods: {
+    onChange() {
+      if (this.rebuild) {
+        this.rebuildViewer();
+      } else {
+        this.updateViewer();
+      }
+    },
+    rebuildViewer() {
+      this.destroyViewer();
+      this.createViewer();
+    },
+    updateViewer() {
+      if (this.$viewer) {
+        this.$viewer.update();
+        this.$emit("inited", this.$viewer);
+      } else {
+        this.createViewer();
+      }
+    },
+    destroyViewer() {
+      this.$viewer && this.$viewer.destroy();
+    },
+    createViewer() {
+      this.$viewer = new Viewer(this.$el, this.options);
+      this.$emit("inited", this.$viewer);
+    }
+  }
+};
+const __cssModules = {};
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  __vue2_script,
+  render,
+  staticRenderFns,
+  false,
+  __vue2_injectStyles,
+  null,
+  null,
+  null
+);
+function __vue2_injectStyles(context) {
+  for (let o in __cssModules) {
+    this[o] = __cssModules[o];
+  }
+}
+var component = /* @__PURE__ */ function() {
+  return __component__.exports;
+}();
+const directive = ({ name = "viewer", debug = false } = {}) => {
+  function createViewer(el, options, rebuild = false, observer = false) {
+    Vue.nextTick(() => {
+      if (observer && !imageDiff(el))
+        return;
+      if (rebuild || !el[`$${name}`]) {
+        destroyViewer(el);
+        el[`$${name}`] = new Viewer(el, options);
+        log("Viewer created");
+      } else {
+        el[`$${name}`].update();
+        log("Viewer updated");
+      }
+    });
+  }
+  function imageDiff(el) {
+    const imageContent = el.innerHTML.match(/<img([\w\W]+?)[\\/]?>/g);
+    const viewerImageText = imageContent ? imageContent.join("") : void 0;
+    if (el.__viewerImageDiffCache === viewerImageText) {
+      log("Element change detected, but image(s) has not changed");
+      return false;
+    } else {
+      log("Image change detected");
+      el.__viewerImageDiffCache = viewerImageText;
+      return true;
+    }
+  }
+  function createObserver(el, options, debouncedCreateViewer, rebuild) {
+    destroyObserver(el);
+    const MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
+    if (!MutationObserver) {
+      log("Observer not supported");
+      return;
+    }
+    const observer = new MutationObserver((mutations) => {
+      mutations.forEach((mutation) => {
+        log(`Viewer mutation:${mutation.type}`);
+        debouncedCreateViewer(el, options, rebuild, true);
+      });
+    });
+    const config = { attributes: true, childList: true, characterData: true, subtree: true };
+    observer.observe(el, config);
+    el.__viewerMutationObserver = observer;
+    log("Observer created");
+  }
+  function createWatcher(el, { expression }, vnode, debouncedCreateViewer) {
+    const simplePathRE = /^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*|\['[^']*?']|\["[^"]*?"]|\[\d+]|\[[A-Za-z_$][\w$]*])*$/;
+    if (!expression || !simplePathRE.test(expression)) {
+      log("Only simple dot-delimited paths can create watcher");
+      return;
+    }
+    el.__viewerUnwatch = vnode.context.$watch(expression, (newVal, oldVal) => {
+      log("Change detected by watcher: ", expression);
+      debouncedCreateViewer(el, newVal, true);
+    }, {
+      deep: true
+    });
+    log("Watcher created, expression: ", expression);
+  }
+  function destroyViewer(el) {
+    if (!el[`$${name}`]) {
+      return;
+    }
+    el[`$${name}`].destroy();
+    delete el[`$${name}`];
+    log("Viewer destroyed");
+  }
+  function destroyObserver(el) {
+    if (!el.__viewerMutationObserver) {
+      return;
+    }
+    el.__viewerMutationObserver.disconnect();
+    delete el.__viewerMutationObserver;
+    log("Observer destroyed");
+  }
+  function destroyWatcher(el) {
+    if (!el.__viewerUnwatch) {
+      return;
+    }
+    el.__viewerUnwatch();
+    delete el.__viewerUnwatch;
+    log("Watcher destroyed");
+  }
+  function log() {
+    debug && console.log(...arguments);
+  }
+  const directive2 = {
+    bind(el, binding, vnode) {
+      log("Viewer bind");
+      const debouncedCreateViewer = debounce(createViewer, 50);
+      debouncedCreateViewer(el, binding.value);
+      createWatcher(el, binding, vnode, debouncedCreateViewer);
+      if (!binding.modifiers.static) {
+        createObserver(el, binding.value, debouncedCreateViewer, binding.modifiers.rebuild);
+      }
+    },
+    unbind(el, binding) {
+      log("Viewer unbind");
+      destroyObserver(el);
+      destroyWatcher(el);
+      destroyViewer(el);
+    }
+  };
+  return directive2;
+};
+const api = ({ images = [], options = {} } = {}) => {
+  options = assign$1(options, {
+    inline: false
+  });
+  const ViewerToken = Vue.extend({
+    render(h) {
+      return h(
+        "div",
+        {
+          style: {
+            display: "none"
+          },
+          class: ["__viewer-token"]
+        },
+        images.map((attr) => {
+          return h(
+            "img",
+            {
+              attrs: typeof attr === "string" ? { src: attr } : attr
+            }
+          );
+        })
+      );
+    }
+  });
+  const token = new ViewerToken();
+  token.$mount();
+  document.body.appendChild(token.$el);
+  const $viewer = new Viewer(token.$el, options);
+  const $destroy = $viewer.destroy.bind($viewer);
+  $viewer.destroy = function() {
+    $destroy();
+    token.$destroy();
+    document.body.removeChild(token.$el);
+    return $viewer;
+  };
+  $viewer.show();
+  token.$el.addEventListener("hidden", function() {
+    if (this.viewer === $viewer) {
+      $viewer.destroy();
+    }
+  });
+  return $viewer;
+};
+var index = {
+  install(Vue2, { name = "viewer", debug = false, defaultOptions } = {}) {
+    Viewer.setDefaults(defaultOptions);
+    Vue2.component(name, assign$1(component, { name }));
+    Vue2.directive(name, directive({ name, debug }));
+    Vue2.prototype[`$${name}Api`] = api;
+  },
+  setDefaults(defaultOptions) {
+    Viewer.setDefaults(defaultOptions);
+  }
+};
+export { api, component, index as default, directive };

ui/lib/js/directives.js

@@ -1,3 +1,5 @@
+import {directive as viewer} from '../cdn/v-viewer/1.7.4/v-viewer'
+
 const map = {
   throttle: {
     bind: function (el, obj) {
@@ -24,7 +26,8 @@ const map = {
         el.style.display = 'none'
       }
     }
-  }
+  },
+  viewer: viewer({debug: true})
 }
 
 

ui/package.json

@@ -19,7 +19,6 @@
     "html2canvas": "^1.4.1",
     "jspdf": "^2.5.1",
     "echarts": "^5.1.2",
-    "v-viewer": "^1.5.1",
     "vue-cropper": "^0.5.5",
     "vue-qr": "^2.2.1",
     "vuedraggable": "^2.24.3",

ui/packages/basic/AiUploader.vue

@@ -89,14 +89,8 @@
 
 <script>
 import {VueCropper} from 'vue-cropper'
-import 'viewerjs/dist/viewer.css'
-import Viewer from 'v-viewer'
 import Vue from "vue";
 
-Viewer.setDefaults({
-  zIndex: 20170
-})
-Vue.use(Viewer)
 export default {
   name: 'AiUploader',
   components: {VueCropper},
@@ -279,7 +273,6 @@ export default {
     },
     handlePictureCardPreview(file) {
       if (this.fileType !== 'img') return
-
       const index = this.imgList.indexOf(file.url)
       const viewer = this.$el.querySelector('.images').$viewer
       viewer.view(index)
@@ -409,7 +402,7 @@ export default {
         parent.$emit.apply(parent, [eventName].concat(params));
       }
     },
-  }
+  },
 }
 </script>
 

vue.config.js

@@ -1,6 +1,7 @@
 const path = require('path');
 const proxy = {
-  dv: "https://pingchangdjweb.icunwei.com/",
+  // dv: "https://pingchangdjweb.icunwei.com/",
+  dv: "http://192.168.1.87:9000",
   fengdu: "https://web.fdfengshou.cn/"
 }[process.env.VUE_APP_SCOPE] || "http://192.168.1.87:9000"
 module.exports = {