emacroh5lib 1.0.83 → 1.0.85

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "emacroh5lib",
-  "version": "1.0.83",
+  "version": "1.0.85",
   "description": "EMacro前端组件库",
   "main": "dist/emacroh5lib.min.js",
   "scripts": {
@@ -95,7 +95,6 @@
     "register-service-worker": "^1.7.2",
     "sync-task-queue": "^1.0.4",
     "three": "^0.139.2",
-    "types": "file:../../browser-md5-file",
     "typings": "^2.1.1",
     "vue": "^2.6.14",
     "vue-class-component": "^7.2.3",
@@ -103,7 +102,6 @@
     "vue-property-decorator": "^9.1.2",
     "vue-tsx-support": "^3.2.0",
     "vuex": "^3.6.2",
-    "xlsx": "^0.18.5",
-    "xlsx-style": "^0.8.13"
+    "xlsx": "^0.18.5"
   }
-}
+}

package/src/components/SelectBox.jsx

@@ -0,0 +1,29 @@
+<!-- 下拉可编辑输入框 -->
+<div style="position:relative;">
+  <select v-model='faultAction' onchange="this.nextElementSibling.value=''">
+    <option v-for="(item, index) in optionListAction">{{ fieldsMap[item] || $t(item) }}</option>
+  </select>
+  <input class="select-input" type="text" value="" autocomplete="off" @input="(item)=>{this.faultAction = item.target.value}" />
+</div>
+
+
+
+.select-input {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    right: 5px;
+    height: 100%;
+    padding: 0px;
+    margin-left: 5px;
+    font-size: 17px !important; 
+    border: none !important;  
+    background-color: transparent;
+    outline: transparent !important; 
+    border: transparent !important;  
+    box-shadow: none !important;
+
+    &:focus {
+      outline: none;
+    }
+  }

package/src/utilities/E9ChartUtils.js

@@ -0,0 +1,189 @@
+/**
+ *  echarts tooltip 自动轮播
+ *  @author dalalalalaa
+ *  @param chart
+ *  @param chartOption
+ *  @param options
+ *  {
+ *  interval    轮播时间间隔，单位毫秒，默认为2000
+ *  loopSeries  boolean类型，默认为false。
+ *              true表示循环所有series的tooltip，false则显示指定seriesIndex的tooltip
+ * 	seriesIndex 默认为0，指定某个系列（option中的series索引）循环显示tooltip，
+ * 	            当loopSeries为true时，从seriesIndex系列开始执行.
+ *  }
+ * @returns {{clearLoop: clearLoop}}
+ */
+const loopShowTooltip = function (chart, chartOption, options) {
+    var defaultOptions = {
+        interval: 3000,
+        loopSeries: true,
+        seriesIndex: 0,
+        updateData: null,
+    };
+
+    if (!chart) {
+        return {};
+    }
+    if (!chartOption) {
+        chartOption = chart.getOption();
+    }
+
+    var dataIndex = 0; // 数据索引，初始化为-1，是为了判断是否是第一次执行
+    var seriesIndex = 0; // 系列索引
+    var timeTicket = 0;
+    var seriesLen = chartOption.series.length; // 系列个数
+    var dataLen = 0; // 某个系列数据个数
+    var chartType; // 系列类型
+    var first = true;
+
+    // 不循环series时seriesIndex指定显示tooltip的系列，不指定默认为0，指定多个则默认为第一个
+    // 循环series时seriesIndex指定循环的series，不指定则从0开始循环所有series，指定单个则相当于不循环，指定多个
+    // 要不要添加开始series索引和开始的data索引？
+
+    if (options) {
+        options.interval = options.interval || defaultOptions.interval;
+        options.loopSeries = options.loopSeries || defaultOptions.loopSeries;
+        options.seriesIndex = options.seriesIndex || defaultOptions.seriesIndex;
+        options.updateData = options.updateData || defaultOptions.updateData;
+    } else {
+        options = defaultOptions;
+    }
+
+    // 如果设置的seriesIndex无效，则默认为0
+    if (options.seriesIndex < 0 || options.seriesIndex >= seriesLen) {
+        seriesIndex = 0;
+    } else {
+        seriesIndex = options.seriesIndex;
+    }
+
+    function autoShowTip() {
+        function showTip() {
+            // 判断是否更新数据
+            if (
+                dataIndex === 0 &&
+                !first &&
+                typeof options.updateData === 'function'
+            ) {
+                options.updateData();
+                chart.setOption(chartOption);
+            }
+
+            var series = chartOption.series;
+            chartType = series[seriesIndex].type; // 系列类型
+            dataLen = series[seriesIndex].data.length; // 某个系列的数据个数
+
+            var tipParams = { seriesIndex: seriesIndex };
+            switch (chartType) {
+                case 'map':
+                case 'pie':
+                case 'chord':
+                    tipParams.name = series[seriesIndex].data[dataIndex].name;
+                    break;
+                case 'radar': // 雷达图
+                    tipParams.seriesIndex = seriesIndex;
+                    tipParams.dataIndex = dataIndex;
+                    break;
+                default:
+                    tipParams.dataIndex = dataIndex;
+                    break;
+            }
+
+            if (chartType === 'pie' || chartType === 'radar') {
+                // 取消之前高亮的图形
+                chart.dispatchAction({
+                    type: 'downplay',
+                    seriesIndex: options.loopSeries
+                        ? seriesIndex === 0
+                            ? seriesLen - 1
+                            : seriesIndex - 1
+                        : seriesIndex,
+                    dataIndex: dataIndex === 0 ? dataLen - 1 : dataIndex - 1,
+                });
+
+                // 高亮当前图形
+                chart.dispatchAction({
+                    type: 'highlight',
+                    seriesIndex: seriesIndex,
+                    dataIndex: dataIndex,
+                });
+            }
+
+            // 显示 tooltip
+            tipParams.type = 'showTip';
+            chart.dispatchAction(tipParams);
+
+            dataIndex = (dataIndex + 1) % dataLen;
+            if (options.loopSeries && dataIndex === 0 && !first) {
+                // 数据索引归0表示当前系列数据已经循环完
+                seriesIndex = (seriesIndex + 1) % seriesLen;
+            }
+
+            first = false;
+        }
+
+        showTip();
+        timeTicket = setInterval(showTip, options.interval);
+    }
+
+    // 关闭轮播
+    function stopAutoShow() {
+        if (timeTicket) {
+            clearInterval(timeTicket);
+            timeTicket = 0;
+
+            if (chartType === 'pie' || chartType === 'radar') {
+                // 取消高亮的图形
+                chart.dispatchAction({
+                    type: 'downplay',
+                    seriesIndex: options.loopSeries
+                        ? seriesIndex === 0
+                            ? seriesLen - 1
+                            : seriesIndex - 1
+                        : seriesIndex,
+                    dataIndex: dataIndex === 0 ? dataLen - 1 : dataIndex - 1,
+                });
+            }
+        }
+    }
+
+    var zRender = chart.getZr();
+
+    function zRenderMouseMove(param) {
+        if (param.event) {
+            // 阻止canvas上的鼠标移动事件冒泡
+            param.event.cancelBubble = true;
+        }
+
+        stopAutoShow();
+    }
+
+    // 离开echarts图时恢复自动轮播
+    function zRenderGlobalOut() {
+        if (!timeTicket) {
+            autoShowTip();
+        }
+    }
+
+    // 鼠标在echarts图上时停止轮播
+    chart.on('mousemove', stopAutoShow);
+    zRender.on('mousemove', zRenderMouseMove);
+    zRender.on('globalout', zRenderGlobalOut);
+
+    autoShowTip();
+
+    return {
+        clearLoop: function () {
+            if (timeTicket) {
+                clearInterval(timeTicket);
+                timeTicket = 0;
+            }
+            chart.off('mousemove', stopAutoShow);
+            zRender.off('mousemove', zRenderMouseMove);
+            zRender.off('globalout', zRenderGlobalOut);
+        },
+    };
+};
+
+
+export { loopShowTooltip };
+

package/src/utilities/EMacro.ts

@@ -1,9 +1,16 @@
 
-import * as XLSX from "xlsx";
+import XLSX from "xlsx";
+// import XLSX from "./dist/xlsx.js";
+ 
+
+
+// const XLSX = require("./dist/xlsx.js")
 import BMF from 'browser-md5-file';
 
 import createTaskQueue from 'sync-task-queue'
 
+import { saveAs } from 'file-saver';
+
 export namespace EMacro {
 
     export const version = "1.72"
@@ -147,6 +154,31 @@ export namespace EMacro {
             })
         }
 
+        // type: 'base64' | 'binary' | 'buffer' | 'file' | 'array' | 'string'
+        public static toExcel(data, type) {
+            let workbook = XLSX.read(data, { type: type });
+            return workbook;
+        }
+
+        public static downloadExcel(workbook, name) {
+ 
+            /* bookType can be 'xlsx' or 'xlsm' or 'xlsb' */
+            const wopts:any = { bookType: 'xls', bookSST: false, type: 'binary',  cellStyles: true };
+
+            var wbout = XLSX.write(workbook, wopts);
+
+            function s2ab(s) {
+                var buf = new ArrayBuffer(s.length);
+                var view = new Uint8Array(buf);
+                for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
+                return buf;
+            }
+
+            /* the saveAs call downloads a file on the local machine */
+            saveAs(new Blob([s2ab(wbout)], { type: 'application/octet-stream' }), name)
+
+        }
+
     }
 
     export const fullScreen = (docElm: any = null) => {
@@ -251,12 +283,12 @@ export namespace EMacro {
         return base64;
     }
 
-    export function getType(values){
+    export function getType(values) {
         return Object
             .prototype
             .toString
             .call(values)
-            .replace(/\[(\S+) (\S+)\]/,'$2')
+            .replace(/\[(\S+) (\S+)\]/, '$2')
     }
 
     export const extensionToLowerCase = (fileName: string) => {

package/src/views/ExcelExporter/index.vue

@@ -13,7 +13,6 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 import $ from "jquery";
 
 import { saveAs } from 'file-saver';
-import XLSX from "xlsx-style";
 
 import * as echarts from "echarts";
  

package/src/views/ModelViewer/index.vue

@@ -3,7 +3,7 @@
     <div class="duo-viewer-mask">
       <div id="WebGL-output" class="duo-viewer-mask__image" :style="viewerStyle()" v-loading="loading"
         element-loading-text="模型加载中" element-loading-spinner="el-icon-loading"
-        element-loading-background="rgba(0, 0, 0, 0.8)">
+        element-loading-background="rgba(0, 0, 0, 0.0)">
       </div>
     </div>
     <div class="duo-viewer-footer" v-if="showThumbnail">
@@ -128,6 +128,10 @@
       showThumbnail: {
         type: Boolean,
         default: false,
+      },
+      background: {
+        type: Number,
+        default: 0xb9d3ff,
       }
     },
     computed: {
@@ -159,7 +163,7 @@
     mounted() {
 
       // this.show = true
-     
+
 
 
       // Message.success("按键提示 ");
@@ -182,8 +186,6 @@
         return scale;
       },
 
-
-
       viewerStyle() {
         return `width:${this.width};height:${this.height};`
       },
@@ -363,8 +365,10 @@
 
       // 计算空间两点中点
       getCenterPosition(A, B) {
-        let pos = { x: (A.x + B.x) / 2, y: (A.y + B.y) / 2, z: (A.z + B.z) / 2 }
-        return pos
+        if (A.z == null || B.z == null) {
+          return { x: (A.x + B.x) / 2, y: (A.y + B.y) / 2 }
+        }
+        return { x: (A.x + B.x) / 2, y: (A.y + B.y) / 2, z: (A.z + B.z) / 2 }
       },
 
 
@@ -407,6 +411,12 @@
         this.loading = false
 
 
+        const keyEvent = new KeyboardEvent('keydown', {
+          bubbles: true, cancelable: true, keyCode: 90
+        });
+        document.dispatchEvent(keyEvent);
+
+
 
 
 
@@ -742,6 +752,7 @@
           this.gl.pointLight = pointLight
           pointLight.position.set(200, 300, 10); //点光源位置,参数分别代表：
           this.gl.scene.add(pointLight);
+          this.gl.scene.background = null;
           //环境光
           let ambient = new THREE.AmbientLight(0x444444, 1);
           this.gl.ambient = ambient
@@ -761,9 +772,9 @@
           /**
            * 创建渲染器对象
            */
-          this.gl.renderer = new THREE.WebGLRenderer();
+          this.gl.renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
           this.gl.renderer.setSize(width, height); //设置渲染区域尺寸
-          this.gl.renderer.setClearColor(0xb9d3ff, 1); //设置背景颜色
+          this.gl.renderer.setClearColor(this.background, this.background == null ? 0 : 1); //设置背景颜色
 
           this.gl.WebGLoutput.innerHTML = ""
           this.gl.renderer.domElement.style.width = "100%"
@@ -850,6 +861,20 @@
           })
 
 
+          document.addEventListener("keydown", event => {
+
+            if (event.key == '') {
+              const gl = this.gl
+              const zd = gl.camera.position.z !== 0 ? -gl.camera.position.z : -d
+              gl.camera.position.set(0, 0, zd);
+              gl.camera.lookAt(new THREE.Vector3(0, 0, 0));
+              gl.ambient.position.set(0, 0, zd);
+              gl.pointLight.position.set(0, 0, zd);
+              gl.axialDirection = zd > 0 ? 'z' : '-z';
+            }
+
+          })
+
 
           document.addEventListener("keyup", event => {
 

package/src/views/ModelViewer/style/css/index.css

@@ -29,6 +29,7 @@
   z-index: 8;
   /* transition-property: transform, height, width; */
   transition-duration: 0.3s, 0.3s, 0.3s;
+  background: transparent;
 }
 .duo-viewer-footer {
   position: absolute;

package/src/views/TestView/Export2Excel.ts

@@ -1,6 +1,5 @@
 
-import * as  XLSX from 'xlsx'
-import * as XLSXS from 'xlsx-style'
+import * as  XLSX from 'xlsx' 
 import { saveAs } from 'file-saver'
 import { BookType } from 'xlsx';
 

package/src/views/TestView/index.vue

@@ -6,10 +6,11 @@
     <button @click="exportExcel($event)">透过Excel模板导出表格</button>
     <button @click="selectFile($event)">选择文件</button>
     <button @click="fileMD5($event)">文件MD5</button>
+    <button @click="excelTest()">Excel测试</button>
 
     <image-viewer :list="srcList" @open="openCallback" @close="closeCallback" :show.sync="showViewer"
       :currentIndex="currentIndex" />
- 
+
     <div class="list" id="list" v-if="false">
       <DragResizeView v-for="(rect, index) in rects" :key="index" :isStorage="true" :name="rect.name" :w="rect.width"
         :h="rect.height" :x="rect.left" :y="rect.top" :parentW="listWidth" :parentH="listHeight" :axis="rect.axis"
@@ -25,9 +26,9 @@
     <Draw v-if="false">
       <div class="filler2">111</div>
     </Draw>
-
+ 
     <!-- <video-viewer :list="srcList" :show.sync="showVideoViewer" width="80%" height="80%" /> -->
-    <model-viewer :list="modelList" :show.sync="showModelViewer" width="80%" height="80%" />
+    <model-viewer :list="modelList" :show.sync="showModelViewer" width="90%" height="90%" :background="null" />
 
   </div>
 </template>
@@ -46,6 +47,7 @@
   import LAY_EXCEL from 'lay-excel';
   import BMF from 'browser-md5-file';
   import { info } from "console";
+  import base64 from "./txt.js";
 
 
   @Component({
@@ -62,6 +64,7 @@
   })
   export default class TestView extends Vue {
 
+
     public currentIndex: Number = 0; // 打开图片查看器时，需要定位到的图片的索引
     public srcList: Array<String> = [
       "http://emacrosys.cn:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
@@ -190,6 +193,21 @@
       }
     ]
 
+
+    public excelTest() {
+
+      console.log("测试", base64);
+      const workbook = EMacro.File.toExcel(base64, "base64")
+      // console.log("测试", workbook.Sheets["Sheet1"]["A23"]);
+
+      // workbook.Sheets["Sheet1"]["A23"].v = "测试abc"
+      // console.log("测试", workbook.Sheets["Sheet1"]["A23"]);
+      // console.log("测试", workbook);
+
+      EMacro.File.downloadExcel(workbook, "Report2222.xls");
+
+    }
+
     public exportExcel(e): void {
       console.log('event', e);
 
@@ -292,22 +310,16 @@
         if (files == null) {
           return
         }
-
         EMacro.File.getFileMD5(files[0]).then(md5 => {
-
           console.log("文件MD5", md5);
-
         })
 
-
         // new MD5().update(buffer).digest()
 
-
         // const hash = crypto
         //   .createHash('md5')
         //   .update(files[0], 'utf8')
         //   .digest('hex');
-
       })