ie兼容

package-lock.json

@@ -2726,6 +2726,11 @@
       "integrity": "sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw==",
       "dev": true
     },
+    "batch-processor": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmmirror.com/batch-processor/-/batch-processor-1.0.0.tgz",
+      "integrity": "sha512-xoLQD8gmmR32MeuBHgH0Tzd5PuSZx71ZsbhVxOCRbgktZEPe4SQy7s9Z50uPp0F/f7iw2XmkHN2xkgbMfckMDA=="
+    },
     "big.js": {
       "version": "5.2.2",
       "resolved": "https://registry.npmmirror.com/big.js/-/big.js-5.2.2.tgz",
@@ -4089,6 +4094,14 @@
       "resolved": "https://registry.npmmirror.com/electron-to-chromium/-/electron-to-chromium-1.5.104.tgz",
       "integrity": "sha512-Us9M2L4cO/zMBqVkJtnj353nQhMju9slHm62NprKTmdF3HH8wYOtNvDFq/JB2+ZRoGLzdvYDiATlMHs98XBM1g=="
     },
+    "element-resize-detector": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmmirror.com/element-resize-detector/-/element-resize-detector-1.2.4.tgz",
+      "integrity": "sha512-Fl5Ftk6WwXE0wqCgNoseKWndjzZlDCwuPTcoVZfCP9R3EHQF8qUtr3YUPNETegRBOKqQKPW3n4kiIWngGi8tKg==",
+      "requires": {
+        "batch-processor": "1.0.0"
+      }
+    },
     "element-ui": {
       "version": "2.15.14",
       "resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.14.tgz",

package.json

@@ -16,6 +16,7 @@
     "core-js": "^3.8.3",
     "decimal.js": "^10.5.0",
     "echarts": "^5.6.0",
+    "element-resize-detector": "^1.2.4",
     "element-ui": "^2.15.14",
     "fs": "0.0.1-security",
     "lodash": "^4.17.21",

src/components/AutoComponents/ECharts/index.vue

@@ -6,9 +6,10 @@
 </template>
 
 <script>
-import { generateUUID } from '@/utils'
+import { generateUUID, isIE } from '@/utils'
 import EChartsComponent from './eCharts'
-// import elementResizeDetector from "element-resize-detector"
+
+import elementResizeDetector from 'element-resize-detector'
 export default {
   name: 'e-charts',
   data () {
@@ -28,15 +29,15 @@ export default {
     setupResizeObserver () {
       if (!this.$refs.content) return
 
-      // if (ie11) {
-      //   this.resizeDetector = elementResizeDetector();
-      //   this.resizeDetector.listenTo(this.$refs.content, () => {
-      //     if (this.chart) {
-      //       this.onResize()
-      //     }
-      //   })
-      //   return
-      // }
+      if (isIE()) {
+        this.resizeDetector = elementResizeDetector()
+        this.resizeDetector.listenTo(this.$refs.content, () => {
+          if (this.chart) {
+            this.onResize()
+          }
+        })
+        return
+      }
       this.resizeObserver = new ResizeObserver(() => {
         if (this.chart) {
           this.onResize()
@@ -46,13 +47,13 @@ export default {
     },
     cleanup () {
       window.removeEventListener('resize', this.onResize)
+      if (isIE() && this.resizeDetector) {
+        this.resizeDetector.removeListener(
+          this.$refs.content,
+          this.handleResize
+        )
+      }
       if (this.resizeObserver) {
-        // if (ie11) {
-        //   this.resizeDetector.removeListener(
-        //     this.$refs.content,
-        //     this.handleResize
-        //   )
-        // }
         this.resizeObserver.disconnect() // 停止监听
         this.resizeObserver = null
       }

src/components/AutoComponents/MDialog/index.vue

@@ -7,13 +7,11 @@
     :close-on-click-modal="false"
     :close-on-press-escape="false"
     destroy-on-close
+    :class="{'el-dialog--hide-footer': hideFooter }"
     v-bind="$attrs"
     v-on="$listeners"
   >
-    <!-- 兼容ie自动撑开 -->
-    <div class="el-dialog__body_content">
-      <slot></slot>
-    </div>
+    <slot></slot>
     <span slot="footer" v-if="!hideFooter">
       <m-button @click="show = false">{{ option?.textCancel ?? '取 消'}}</m-button>
       <m-button :type="option?.colorSure ?? 'orange'" @click="sure">{{ option?.textSure ?? '确 定'}}</m-button>
@@ -118,25 +116,37 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.el-dialog--hide-footer {
+  ::v-deep .el-dialog {
+    &.is-fullscreen {
+      &>.el-dialog__body {
+        height: calc(100% - 55px);
+      }
+    }
+  }
+}
 ::v-deep .el-dialog {
   &.is-fullscreen {
     height: 100vh;
+    overflow: hidden;
     border-spacing: 0; /* 避免单元格间距影响 */
-    display: table;
-    &>.el-dialog__header, &>.el-dialog__footer {
-      display: table-cell; /* 固定高度的行 */
-      height: 1px; /* 最小高度，内容撑开 */
-    }
+    // display: table;
+    // &>.el-dialog__header, &>.el-dialog__footer {
+    //   display: table-cell; /* 固定高度的行 */
+    //   height: 1px; /* 最小高度，内容撑开 */
+    // }
     &>.el-dialog__body {
-      display: table-row; /* 自动填充剩余高度 */
-      height: 100%; /* 关键：占满剩余空间 */
-      padding: 0;
-      position: relative;
-      &>.el-dialog__body_content {
-        position: absolute;
-        width: 100%;
-        height: 100%;
-      }
+      height: calc(100% - 55px - 70px); /* 减去头部和底部的高度 */
+      box-sizing: border-box;
+    //   display: table-row; /* 自动填充剩余高度 */
+    //   height: 100%; /* 关键：占满剩余空间 */
+    //   padding: 0;
+    //   position: relative;
+    //   &>.el-dialog__body_content {
+    //     position: absolute;
+    //     width: 100%;
+    //     height: 100%;
+    //   }
     }
   }
 }