shijiplus-web-plugin 0.1.52 → 0.1.53

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "shijiplus-web-plugin",
-  "version": "0.1.52",
+  "version": "0.1.53",
   "files": [
     "src"
   ],
-  "description": "A company project",
+  "description": "A company project update table component fixedheader",
   "author": "jia",
   "license": "ISC",
   "private": false,

package/src/components/plus-comp/plus-table/plus-table.vue

@@ -179,59 +179,7 @@ export default {
   watch: {
     fixedHeader: {
       handler(val) {
-        this.$nextTick(() => {
-          let tHeight = this.$refs.plusTableInnerRef.clientHeight
-          let tableWidth = this.$refs.plusTableInnerRef.clientWidth
-
-          // 获取元素的所有计算样式
-          var styles = window.getComputedStyle(this.$refs.plusTableInnerRef)
-
-          var styleHeight = parseFloat(styles.getPropertyValue('height'))
-          // 如果您只想获取特定方向的padding值，例如padding-top
-          var paddingLeft = parseFloat(styles.getPropertyValue('padding-left'))
-          var paddingRight = parseFloat(
-            styles.getPropertyValue('padding-right')
-          )
-          var paddingTop = parseFloat(styles.getPropertyValue('padding-top'))
-          var paddingBottom = parseFloat(
-            styles.getPropertyValue('padding-bottom')
-          )
-          if (paddingLeft) {
-            tableWidth -= paddingLeft
-          }
-          if (paddingRight) {
-            tableWidth -= paddingRight
-          }
-          if (paddingTop) {
-            tHeight -= paddingTop
-          }
-          if (paddingBottom) {
-            tHeight -= paddingBottom
-          }
-          this.tableWidth = tableWidth
-          if (this.$refs.searchAreaRef) {
-            tHeight -= this.$refs.searchAreaRef.clientHeight
-          }
-          if (this.$refs.headerRef) {
-            tHeight -= this.$refs.headerRef.clientHeight
-          }
-          if (this.$refs.footerRef) {
-            tHeight -= this.$refs.footerRef.clientHeight
-          }
-          if (val) {
-            this.height = tHeight
-          } else {
-            let tableWrap =
-              this.$refs.plusTableInnerRef.getElementsByClassName(
-                'ivu-table-wrapper'
-              )[0]
-            if (tableWrap) {
-              if (!this.data.data || !this.data.data.length) {
-                tableWrap.style.minHeight = tHeight + 'px'
-              }
-            }
-          }
-        })
+        this.calcTableHeight(0)
       },
       deep: true,
       immediate: true
@@ -377,6 +325,65 @@ export default {
     }
   },
   methods: {
+    calcTableHeight(count) {
+      this.$nextTick(() => {
+        let tHeight = this.$refs.plusTableInnerRef.clientHeight
+        if (!tHeight && count < 3) {
+          setTimeout(() => {
+            this.calcTableHeight(count + 1)
+          }, 100)
+          return
+        }
+        let tableWidth = this.$refs.plusTableInnerRef.clientWidth
+
+        // 获取元素的所有计算样式
+        var styles = window.getComputedStyle(this.$refs.plusTableInnerRef)
+
+        var styleHeight = parseFloat(styles.getPropertyValue('height'))
+        // 如果您只想获取特定方向的padding值，例如padding-top
+        var paddingLeft = parseFloat(styles.getPropertyValue('padding-left'))
+        var paddingRight = parseFloat(styles.getPropertyValue('padding-right'))
+        var paddingTop = parseFloat(styles.getPropertyValue('padding-top'))
+        var paddingBottom = parseFloat(
+          styles.getPropertyValue('padding-bottom')
+        )
+        if (paddingLeft) {
+          tableWidth -= paddingLeft
+        }
+        if (paddingRight) {
+          tableWidth -= paddingRight
+        }
+        if (paddingTop) {
+          tHeight -= paddingTop
+        }
+        if (paddingBottom) {
+          tHeight -= paddingBottom
+        }
+        this.tableWidth = tableWidth
+        if (this.$refs.searchAreaRef) {
+          tHeight -= this.$refs.searchAreaRef.clientHeight
+        }
+        if (this.$refs.headerRef) {
+          tHeight -= this.$refs.headerRef.clientHeight
+        }
+        if (this.$refs.footerRef) {
+          tHeight -= this.$refs.footerRef.clientHeight
+        }
+        if (this.fixedHeader) {
+          this.height = tHeight
+        } else {
+          let tableWrap =
+            this.$refs.plusTableInnerRef.getElementsByClassName(
+              'ivu-table-wrapper'
+            )[0]
+          if (tableWrap) {
+            if (!this.data.data || !this.data.data.length) {
+              tableWrap.style.minHeight = tHeight + 'px'
+            }
+          }
+        }
+      })
+    },
     slotValue(col, row) {
       return (col.computeValue && col.computeValue(row)) || row[col.key]
     },

package/src/components/plus-comp/plus-table-v2/plus-table-v2.vue

@@ -187,56 +187,7 @@ export default {
   watch: {
     fixedHeader: {
       handler(val) {
-        this.$nextTick(() => {
-          let tHeight = this.$refs.plusTableInnerRef.clientHeight
-          let tableWidth = this.$refs.plusTableInnerRef.clientWidth
-
-          // 获取元素的所有计算样式
-          var styles = window.getComputedStyle(this.$refs.plusTableInnerRef)
-
-          var styleHeight = parseFloat(styles.getPropertyValue('height'))
-          // 如果您只想获取特定方向的padding值，例如padding-top
-          var paddingLeft = parseFloat(styles.getPropertyValue('padding-left'))
-          var paddingRight = parseFloat(
-            styles.getPropertyValue('padding-right')
-          )
-          var paddingTop = parseFloat(styles.getPropertyValue('padding-top'))
-          var paddingBottom = parseFloat(
-            styles.getPropertyValue('padding-bottom')
-          )
-          if (paddingLeft) {
-            tableWidth -= paddingLeft
-          }
-          if (paddingRight) {
-            tableWidth -= paddingRight
-          }
-          if (paddingTop) {
-            tHeight -= paddingTop
-          }
-          if (paddingBottom) {
-            tHeight -= paddingBottom
-          }
-          this.tableWidth = tableWidth
-          if (this.$refs.searchAreaRef) {
-            tHeight -= this.$refs.searchAreaRef.clientHeight
-          }
-          if (this.$refs.footerRef) {
-            tHeight -= this.$refs.footerRef.clientHeight
-          }
-          if (val) {
-            this.height = tHeight
-          } else {
-            let tableWrap =
-              this.$refs.plusTableInnerRef.getElementsByClassName(
-                'ivu-table-wrapper'
-              )[0]
-            if (tableWrap) {
-              if (!this.data.data || !this.data.data.length) {
-                tableWrap.style.minHeight = tHeight + 'px'
-              }
-            }
-          }
-        })
+        this.calcTableHeight(0)
       },
       deep: true,
       immediate: true
@@ -382,6 +333,65 @@ export default {
     }
   },
   methods: {
+    calcTableHeight(count) {
+      this.$nextTick(() => {
+        let tHeight = this.$refs.plusTableInnerRef.clientHeight
+        if (!tHeight && count < 3) {
+          setTimeout(() => {
+            this.calcTableHeight(count + 1)
+          }, 100)
+          return
+        }
+        let tableWidth = this.$refs.plusTableInnerRef.clientWidth
+
+        // 获取元素的所有计算样式
+        var styles = window.getComputedStyle(this.$refs.plusTableInnerRef)
+
+        var styleHeight = parseFloat(styles.getPropertyValue('height'))
+        // 如果您只想获取特定方向的padding值，例如padding-top
+        var paddingLeft = parseFloat(styles.getPropertyValue('padding-left'))
+        var paddingRight = parseFloat(styles.getPropertyValue('padding-right'))
+        var paddingTop = parseFloat(styles.getPropertyValue('padding-top'))
+        var paddingBottom = parseFloat(
+          styles.getPropertyValue('padding-bottom')
+        )
+        if (paddingLeft) {
+          tableWidth -= paddingLeft
+        }
+        if (paddingRight) {
+          tableWidth -= paddingRight
+        }
+        if (paddingTop) {
+          tHeight -= paddingTop
+        }
+        if (paddingBottom) {
+          tHeight -= paddingBottom
+        }
+        this.tableWidth = tableWidth
+        if (this.$refs.searchAreaRef) {
+          tHeight -= this.$refs.searchAreaRef.clientHeight
+        }
+        if (this.$refs.headerRef) {
+          tHeight -= this.$refs.headerRef.clientHeight
+        }
+        if (this.$refs.footerRef) {
+          tHeight -= this.$refs.footerRef.clientHeight
+        }
+        if (this.fixedHeader) {
+          this.height = tHeight
+        } else {
+          let tableWrap =
+            this.$refs.plusTableInnerRef.getElementsByClassName(
+              'ivu-table-wrapper'
+            )[0]
+          if (tableWrap) {
+            if (!this.data.data || !this.data.data.length) {
+              tableWrap.style.minHeight = tHeight + 'px'
+            }
+          }
+        }
+      })
+    },
     slotValue(col, row) {
       return (col.computeValue && col.computeValue(row)) || row[col.key]
     },