emacroh5lib 1.0.87 → 1.0.89

package/src/views/TestView/index.vue

@@ -1,24 +1,69 @@
 <template>
   <div class="app-container">
-
     <button @click="handleOpen">打开查看器</button>
     <button @click="handleOpen2">打开模型查看器查看器</button>
     <button @click="exportExcel($event)">透过Excel模板导出表格</button>
+    <button @click="importExcel($event)">读取excel文件</button>
     <button @click="selectFile($event)">选择文件</button>
     <button @click="fileMD5($event)">文件MD5</button>
     <button @click="excelTest()">Excel测试</button>
+    <button @click="printElement('printtestdiv')">打印元素</button>
+
+    <div id="printtestdiv">
+      <div
+        style="
+          width: 100%;
+          height: 100%;
+          background-color: aqua;
+          color: royalblue;
+          left: 0;
+          top: 0;
+        "
+      >
+        <label>打印测试</label>
+
+        <div>1111</div>
+
+        <div style="margin-top: 29vh; font-size: 46px">就算...</div>
+      </div>
+    </div>
 
-    <image-viewer :list="srcList" @open="openCallback" @close="closeCallback" :show.sync="showViewer"
-      :currentIndex="currentIndex" />
+    <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"
-        :isActive="rect.active" :minw="rect.minw" :minh="rect.minh" :isDraggable="rect.draggable"
-        :isResizable="rect.resizable" :parentLimitation="rect.parentLim" :snapToGrid="rect.snapToGrid"
-        :aspectRatio="rect.aspectRatio" :z="rect.zIndex" :contentClass="rect.class" v-on:activated="activateEv(index)"
-        v-on:deactivated="deactivateEv(index)" v-on:dragging="changePosition($event, index)"
-        v-on:resizing="changeSize($event, index)">
+      <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"
+        :isActive="rect.active"
+        :minw="rect.minw"
+        :minh="rect.minh"
+        :isDraggable="rect.draggable"
+        :isResizable="rect.resizable"
+        :parentLimitation="rect.parentLim"
+        :snapToGrid="rect.snapToGrid"
+        :aspectRatio="rect.aspectRatio"
+        :z="rect.zIndex"
+        :contentClass="rect.class"
+        v-on:activated="activateEv(index)"
+        v-on:deactivated="deactivateEv(index)"
+        v-on:dragging="changePosition($event, index)"
+        v-on:resizing="changeSize($event, index)"
+      >
         <div class="filler" :style="{ backgroundColor: rect.color }"></div>
       </DragResizeView>
     </div>
@@ -26,328 +71,386 @@
     <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="90%" height="90%" :background="null" />
 
+    <!-- <video-viewer :list="srcList" :show.sync="showVideoViewer" width="80%" height="80%" /> -->
+    <model-viewer
+      :list="modelList"
+      :show.sync="showModelViewer"
+      width="90%"
+      height="90%"
+      :background="null"
+    />
   </div>
 </template>
 
 <script lang="ts">
-  import { Component, Vue } from "vue-property-decorator";
-  import ImageViewer from "@/views/ImageViewer/index.vue";
-  import VideoViewer from "@/views/VideoViewer/index.vue";
-  import ModelViewer from "@/views/ModelViewer/index.vue";
-  import DragResizeView from "@/views/DragResizeView/index.vue";
-  import Draw from "@/views/Draw/index.vue";
-  import { formatJson, export_json_to_excel, number_to_excel, testToExcel } from "./Export2Excel"
-  import { EMacro } from "../../utilities/EMacro";
-  import axios from 'axios'
-  import Cookie from 'js-cookie'
-  import LAY_EXCEL from 'lay-excel';
-  import BMF from 'browser-md5-file';
-  import { info } from "console";
-  import base64 from "./txt.js";
-
-
-  @Component({
-    components: {
-      ImageViewer,
-      DragResizeView,
-      VideoViewer,
-      ModelViewer,
-      Draw
-    },
-    mounted() {
-
-    }
-  })
-  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",
-      "http://emacrosys.cn:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\060 广西电子商务公共服务平台大数据中心.png",
-      "https://scpic.chinaz.net/files/pic/pic9/202203/apic39703.jpg",
-      "https://scpic.chinaz.net/files/pic/pic9/202005/zzpic24899.jpg",
-      "https://scpic.chinaz.net/files/pic/pic9/202109/bpic24244.jpg",
-      "https://scpic.chinaz.net/files/pic/pic9/202110/hpic4529.jpg",
-      "https://scpic.chinaz.net/files/pic/pic9/201912/zzpic22106.jpg",
-      "https://scpic.chinaz.net/files/pic/pic9/202202/apic38580.jpg",
-      // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4",
-      // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\ker.mp4",
-      // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\video2.mp4",
-      // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
-    ] // 图片查看器数据集
-
-    public modelList: Array<Object> = [{
+import { Component, Vue } from "vue-property-decorator";
+import ImageViewer from "@/views/ImageViewer/index.vue";
+import VideoViewer from "@/views/VideoViewer/index.vue";
+import ModelViewer from "@/views/ModelViewer/index.vue";
+import DragResizeView from "@/views/DragResizeView/index.vue";
+import Draw from "@/views/Draw/index.vue";
+import {
+  formatJson,
+  export_json_to_excel,
+  number_to_excel,
+  testToExcel,
+} from "./Export2Excel";
+import { EMacro } from "../../utilities/EMacro";
+import axios from "axios";
+import Cookie from "js-cookie";
+import LAY_EXCEL from "lay-excel";
+import BMF from "browser-md5-file";
+import { info } from "console";
+import base64 from "./txt.js";
+
+@Component({
+  components: {
+    ImageViewer,
+    DragResizeView,
+    VideoViewer,
+    ModelViewer,
+    Draw,
+  },
+  mounted() {},
+})
+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",
+    "http://emacrosys.cn:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\060 广西电子商务公共服务平台大数据中心.png",
+    "https://scpic.chinaz.net/files/pic/pic9/202203/apic39703.jpg",
+    "https://scpic.chinaz.net/files/pic/pic9/202005/zzpic24899.jpg",
+    "https://scpic.chinaz.net/files/pic/pic9/202109/bpic24244.jpg",
+    "https://scpic.chinaz.net/files/pic/pic9/202110/hpic4529.jpg",
+    "https://scpic.chinaz.net/files/pic/pic9/201912/zzpic22106.jpg",
+    "https://scpic.chinaz.net/files/pic/pic9/202202/apic38580.jpg",
+    // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4",
+    // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\ker.mp4",
+    // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\video2.mp4",
+    // "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\看板整体图.png",
+  ]; // 图片查看器数据集
+
+  public modelList: Array<Object> = [
+    {
       type: "obj",
       name: "产品1",
       // mtl: "http://www.emacrosys.cn:8019/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.mtl",
       // obj: "http://www.emacrosys.cn:8019/H5/GetFile?type=0&path=C:/SOP/PCB001/test.obj"
       mtl: "http://www.emacrosys.cn:8019/H5/GetFile?type=0&path=C:\\SOP\\File\\book\\test7.mtl",
-      obj: "http://www.emacrosys.cn:8019/H5/GetFile?type=0&path=C:\\SOP\\File\\book\\test7.obj"
-    }, {
+      obj: "http://www.emacrosys.cn:8019/H5/GetFile?type=0&path=C:\\SOP\\File\\book\\test7.obj",
+    },
+    {
       type: "obj",
       name: "产品2",
       mtl: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.mtl",
-      obj: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.obj"
-    }]
-
-    // public src: String = "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4"
-
-    public showViewer: Boolean = false // 是否打开图片查看器
-    public showVideoViewer: Boolean = false // 是否打开图片查看器
-    public showModelViewer: Boolean = false
-
-    public listWidth = 0;
-    public listHeight = 0;
-
-    public handleOpen() {
-      this.showViewer = true;
-      // this.showVideoViewer = true;
-    }
-
-    public handleOpen2() {
-      this.showModelViewer = true;
-      // this.showVideoViewer = true;
-    }
-
-    public openCallback() { } // 打开时的回调
-    public closeCallback() { } // 关闭时的回调
-
-    public rects = [
-      {
-        'name': "test-0",
-        'width': 200,
-        'height': 150,
-        'top': 10,
-        'left': 10,
-        'draggable': true,
-        'resizable': true,
-        'minw': 10,
-        'minh': 10,
-        'axis': 'both',
-        'parentLim': true,
-        'snapToGrid': false,
-        'aspectRatio': false,
-        'zIndex': 1,
-        'color': '#EF9A9A',
-        'active': false
-      },
-      {
-        'name': "test-1",
-        'width': 200,
-        'height': 150,
-        'top': 170,
-        'left': 220,
-        'draggable': true,
-        'resizable': true,
-        'minw': 10,
-        'minh': 10,
-        'axis': 'both',
-        'parentLim': true,
-        'snapToGrid': false,
-        'aspectRatio': false,
-        'zIndex': 1,
-        'color': '#E6C27A',
-        'active': false,
-        'class': 'box-shaddow'
-      },
-      {
-        'name': "test-2",
-        'width': 200,
-        'height': 150,
-        'top': 10,
-        'left': 220,
-        'draggable': true,
-        'resizable': true,
-        'minw': 10,
-        'minh': 10,
-        'axis': 'both',
-        'parentLim': true,
-        'snapToGrid': false,
-        'aspectRatio': false,
-        'zIndex': 2,
-        'color': '#AED581',
-        'active': false
-      },
-      {
-        'name': "test-3",
-        'width': 200,
-        'height': 150,
-        'top': 170,
-        'left': 10,
-        'draggable': true,
-        'resizable': true,
-        'minw': 10,
-        'minh': 10,
-        'axis': 'both',
-        'parentLim': true,
-        'snapToGrid': false,
-        'aspectRatio': false,
-        'zIndex': 3,
-        'color': '#81D4FA',
-        'active': false
-      }
-    ]
-
-
-    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);
+      obj: "http://221.225.49.240:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\test.obj",
+    },
+  ];
 
-      // testToExcel(e)
-      // LAY_EXCEL.exportExcel([[1, 2, 3]], '表格导出.xlsx', 'xlsx')
+  // public src: String = "http://192.168.0.107:99/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4"
 
-      // var list = [[null,1, 2, 3], [null,1, 2, "a撒地方打赏打发士大夫"]]
-      var list = {
-        "aaa1撒旦飞洒": [
-          [null, 1, 2, 3]
-        ],
-        "bbb1": [
-          [2, 1, 2, null]
-        ]
-      }
+  public showViewer: Boolean = false; // 是否打开图片查看器
+  public showVideoViewer: Boolean = false; // 是否打开图片查看器
+  public showModelViewer: Boolean = false;
 
-      // 2. 使用批量设置样式函数 setExportCellStyle 对单元格维度的数据进行批量设置样式
-      // PS:注意这里是ARGB，前两位是透明度
-      LAY_EXCEL.setExportCellStyle(list, 'A1:Z1', {
-        s: {
-          border: {
-            top: { style: 'thick', color: { rgb: 'FFFF0000' } },
-            bottom: { style: 'thick', color: { rgb: 'FFFF0000' } },
-            left: { style: 'thick', color: { rgb: 'FFFF0000' } },
-            right: { style: 'thick', color: { rgb: 'FFFF0000' } }
-          },
-          fill: {
-            fgColor: {
-              rgb: "ffff00"
-            }
-          },
-          font: {
-            name: "楷体",
-            sz: 22,
-            color: {
-              rgb: "ff0000"
-            },
-            bold: true,
-            italic: false,
-            underline: false
-          },
-        }
-      })
+  public listWidth = 0;
+  public listHeight = 0;
 
-      LAY_EXCEL.exportExcel(list, '表格导出.xlsx', 'xlsx')
-    }
+  public handleOpen() {
+    this.showViewer = true;
+    // this.showVideoViewer = true;
+  }
 
-    public selectFile(e) {
+  public handleOpen2() {
+    this.showModelViewer = true;
+    // this.showVideoViewer = true;
+  }
 
-      EMacro.File.selectFile().then((files) => {
-        EMacro.File.uploadFiles(files, file => {
+  public openCallback() {} // 打开时的回调
+  public closeCallback() {} // 关闭时的回调
+
+  public rects = [
+    {
+      name: "test-0",
+      width: 200,
+      height: 150,
+      top: 10,
+      left: 10,
+      draggable: true,
+      resizable: true,
+      minw: 10,
+      minh: 10,
+      axis: "both",
+      parentLim: true,
+      snapToGrid: false,
+      aspectRatio: false,
+      zIndex: 1,
+      color: "#EF9A9A",
+      active: false,
+    },
+    {
+      name: "test-1",
+      width: 200,
+      height: 150,
+      top: 170,
+      left: 220,
+      draggable: true,
+      resizable: true,
+      minw: 10,
+      minh: 10,
+      axis: "both",
+      parentLim: true,
+      snapToGrid: false,
+      aspectRatio: false,
+      zIndex: 1,
+      color: "#E6C27A",
+      active: false,
+      class: "box-shaddow",
+    },
+    {
+      name: "test-2",
+      width: 200,
+      height: 150,
+      top: 10,
+      left: 220,
+      draggable: true,
+      resizable: true,
+      minw: 10,
+      minh: 10,
+      axis: "both",
+      parentLim: true,
+      snapToGrid: false,
+      aspectRatio: false,
+      zIndex: 2,
+      color: "#AED581",
+      active: false,
+    },
+    {
+      name: "test-3",
+      width: 200,
+      height: 150,
+      top: 170,
+      left: 10,
+      draggable: true,
+      resizable: true,
+      minw: 10,
+      minh: 10,
+      axis: "both",
+      parentLim: true,
+      snapToGrid: false,
+      aspectRatio: false,
+      zIndex: 3,
+      color: "#81D4FA",
+      active: false,
+    },
+  ];
 
-          file.savePath = "C:\\MES\\EMacroAndroidServer_Windows_v1.1\\EMacroAssets\\file\\" + file.fileName
+  importExcel() {
 
-          let postData = { 'id': 0, 'message': '', 'action': 'uploadSOPFile', 'user': {}, 'data': file }
-          axios.post("http://121.228.113.68:8019/H5/prod/Command/requestVueData", postData, {
-            timeout: 6000,
-            headers: {
-              Authorization: "Basic RU1hY3JvOkVNYWNybw==",
-              "Content-Type": "application/json;charset=UTF-8",
-            }
-          }).then(data => {
+    EMacro.File.readLocalExcel((file, workbook) => {
 
-            console.log("上传返回", data);
+      console.log("导入", workbook);
 
-          }).catch(err => {
-            console.error("上传错误: ", err);
-          })
+    })
 
-        })
 
-      }).catch(err => {
-        console.error(err);
-      })
+  }
 
-    }
+  printElement(id) {
+    const el = document.getElementById(id);
 
-    activateEv(index) {
-      console.log("activateEv index", index);
+    if (el == null) {
+      alert("元素找不到");
+      return;
     }
 
-    deactivateEv(index) {
-      console.log("deactivateEv index", index);
+    if (!el.innerHTML) {
+      alert("元素内容空");
+      return;
     }
 
-    changePosition(newRect, index) {
-      console.log("changePosition newRect", newRect);
-      console.log("changePosition index", index);
-    }
+    const iframe = document.createElement("IFRAME") as any;
+
+    const attributes = {
+      style:
+        "position: absolute;top: 500vh;left:0;width: 100%;height: 100%; display: flex;align-items: flex-start; justify-items: flex-start; ",
+      height: "100%",
+      width: "100%",
+      frameborder: "no",
+      border: "0",
+      marginwidth: "0",
+      marginheight: "0",
+      scrolling: "no",
+      allowtransparency: "yes",
+      seamless: "true",
+      allowfullscreen: "true",
+      webkitallowfullscreen: "true",
+      mozallowfullscreen: "true",
+    };
+    Object.keys(attributes).forEach((key) => {
+      iframe.setAttribute(key, attributes[key]);
+    });
+    document.body.appendChild(iframe);
+    const doc = iframe.contentWindow.document as any;
+    doc.write("<div>" + el.innerHTML + "</div>");
+    doc.close();
+    iframe.contentWindow.focus();
+    iframe.contentWindow.print();
+
+    document.body.removeChild(iframe);
+  }
 
-    changeSize(newRect, index) {
-      console.log("changeSize newRect", newRect);
-      console.log("changeSize index", index);
-    }
+  public excelTest() {
+    console.log("测试", base64);
+    const workbook = EMacro.File.toExcel(base64, "base64");
+    // console.log("测试", workbook.Sheets["Sheet1"]["A23"]);
 
-    public fileMD5() {
+    // workbook.Sheets["Sheet1"]["A23"].v = "测试abc"
+    // console.log("测试", workbook.Sheets["Sheet1"]["A23"]);
+    // console.log("测试", workbook);
 
-      EMacro.File.selectFile().then(files => {
+    EMacro.File.downloadExcel(workbook, "Report2222.xls");
+  }
 
-        if (files == null) {
-          return
-        }
-        EMacro.File.getFileMD5(files[0]).then(md5 => {
-          console.log("文件MD5", md5);
-        })
+  public exportExcel(e): void {
+    console.log("event", e);
+
+    // testToExcel(e)
+    // LAY_EXCEL.exportExcel([[1, 2, 3]], '表格导出.xlsx', 'xlsx')
+
+    // var list = [[null,1, 2, 3], [null,1, 2, "a撒地方打赏打发士大夫"]]
+    var list = {
+      aaa1撒旦飞洒: [[null, 1, 2, 3]],
+      bbb1: [[2, 1, 2, null]],
+    };
+
+    // 2. 使用批量设置样式函数 setExportCellStyle 对单元格维度的数据进行批量设置样式
+    // PS:注意这里是ARGB，前两位是透明度
+    LAY_EXCEL.setExportCellStyle(list, "A1:Z1", {
+      s: {
+        border: {
+          top: { style: "thick", color: { rgb: "FFFF0000" } },
+          bottom: { style: "thick", color: { rgb: "FFFF0000" } },
+          left: { style: "thick", color: { rgb: "FFFF0000" } },
+          right: { style: "thick", color: { rgb: "FFFF0000" } },
+        },
+        fill: {
+          fgColor: {
+            rgb: "ffff00",
+          },
+        },
+        font: {
+          name: "楷体",
+          sz: 22,
+          color: {
+            rgb: "ff0000",
+          },
+          bold: true,
+          italic: false,
+          underline: false,
+        },
+      },
+    });
 
-        // new MD5().update(buffer).digest()
+    LAY_EXCEL.exportExcel(list, "表格导出.xlsx", "xlsx");
+  }
 
-        // const hash = crypto
-        //   .createHash('md5')
-        //   .update(files[0], 'utf8')
-        //   .digest('hex');
+  public selectFile(e) {
+    EMacro.File.selectFile()
+      .then((files) => {
+        EMacro.File.uploadFiles(files, (file) => {
+          file.savePath =
+            "C:\\MES\\EMacroAndroidServer_Windows_v1.1\\EMacroAssets\\file\\" +
+            file.fileName;
+
+          let postData = {
+            id: 0,
+            message: "",
+            action: "uploadSOPFile",
+            user: {},
+            data: file,
+          };
+          axios
+            .post(
+              "http://121.228.113.68:8019/H5/prod/Command/requestVueData",
+              postData,
+              {
+                timeout: 6000,
+                headers: {
+                  Authorization: "Basic RU1hY3JvOkVNYWNybw==",
+                  "Content-Type": "application/json;charset=UTF-8",
+                },
+              }
+            )
+            .then((data) => {
+              console.log("上传返回", data);
+            })
+            .catch((err) => {
+              console.error("上传错误: ", err);
+            });
+        });
       })
+      .catch((err) => {
+        console.error(err);
+      });
+  }
 
+  activateEv(index) {
+    console.log("activateEv index", index);
+  }
 
+  deactivateEv(index) {
+    console.log("deactivateEv index", index);
+  }
 
-    }
+  changePosition(newRect, index) {
+    console.log("changePosition newRect", newRect);
+    console.log("changePosition index", index);
+  }
 
-    public mounted() {
+  changeSize(newRect, index) {
+    console.log("changeSize newRect", newRect);
+    console.log("changeSize index", index);
+  }
 
-      EMacro.getVideoScale("http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4").then(info => {
-        console.log("获取视频", info);
+  public fileMD5() {
+    EMacro.File.selectFile().then((files) => {
+      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');
+    });
+  }
 
-      // const listEl = document.getElementById('list') as HTMLElement;
-      // this.listWidth = listEl.clientWidth;
-      // this.listHeight = listEl.clientHeight;
-
-      window.addEventListener('resize', () => {
-        // this.listWidth = listEl.clientWidth;
-        // this.listHeight = listEl.clientHeight;
-      })
-    }
+  public mounted() {
+    EMacro.getVideoScale(
+      "http://121.228.113.68:8069/H5/GetFile?type=0&path=C:\\SOP\\PCB001\\编程向未来.mp4"
+    ).then((info) => {
+      console.log("获取视频", info);
+    });
 
+    // const listEl = document.getElementById('list') as HTMLElement;
+    // this.listWidth = listEl.clientWidth;
+    // this.listHeight = listEl.clientHeight;
 
+    window.addEventListener("resize", () => {
+      // this.listWidth = listEl.clientWidth;
+      // this.listHeight = listEl.clientHeight;
+    });
   }
+}
 </script>
 
 <style lang="less" scoped>
-  @import "index.less";
-</style>
+@import "index.less";
+</style>