xt-element-ui 2.0.0 → 2.0.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xt-element-ui",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "基于 Vue 2.7 + ElementUI 的企业级组件库，提供丰富的自定义组件和扩展组件",
   "main": "lib/index.common.js",
   "module": "lib/index.esm.js",

package/src/components/xt-button/index.js

@@ -1,8 +1,8 @@
-import XtButton from './index.vue'
-
-XtButton.install = function (Vue) {
-  Vue.component(XtButton.name, XtButton)
-}
-
-export default XtButton
+import XtButton from './index.vue'
+
+XtButton.install = function (Vue) {
+  Vue.component(XtButton.name, XtButton)
+}
+
+export default XtButton
 export { XtButton }

package/src/components/xt-card/index.js

@@ -1,7 +1,7 @@
-import XtCard from './index.vue'
-
-XtCard.install = function (Vue) {
-  Vue.component(XtCard.name, XtCard)
-}
-
+import XtCard from './index.vue'
+
+XtCard.install = function (Vue) {
+  Vue.component(XtCard.name, XtCard)
+}
+
 export default XtCard

package/src/components/xt-chart/index.js

@@ -1,8 +1,8 @@
-import XtChart from './index.vue'
-
-XtChart.install = function (Vue) {
-  Vue.component(XtChart.name, XtChart)
-}
-
-export default XtChart
+import XtChart from './index.vue'
+
+XtChart.install = function (Vue) {
+  Vue.component(XtChart.name, XtChart)
+}
+
+export default XtChart
 export { XtChart }

package/src/components/xt-date-picker/index.js

@@ -1,8 +1,8 @@
-import XtDatePicker from './index.vue'
-
-XtDatePicker.install = function (Vue) {
-  Vue.component(XtDatePicker.name, XtDatePicker)
-}
-
-export default XtDatePicker
+import XtDatePicker from './index.vue'
+
+XtDatePicker.install = function (Vue) {
+  Vue.component(XtDatePicker.name, XtDatePicker)
+}
+
+export default XtDatePicker
 export { XtDatePicker }

package/src/components/xt-icon/index.js

@@ -1,8 +1,8 @@
-import XtIcon from './index.vue'
-
-XtIcon.install = function (Vue) {
-  Vue.component(XtIcon.name, XtIcon)
-}
-
-export default XtIcon
+import XtIcon from './index.vue'
+
+XtIcon.install = function (Vue) {
+  Vue.component(XtIcon.name, XtIcon)
+}
+
+export default XtIcon
 export { XtIcon }

package/src/components/xt-page/index.js

@@ -1,8 +1,8 @@
-import XtPage from './index.vue'
-
-XtPage.install = function (Vue) {
-  Vue.component(XtPage.name, XtPage)
-}
-
-export default XtPage
+import XtPage from './index.vue'
+
+XtPage.install = function (Vue) {
+  Vue.component(XtPage.name, XtPage)
+}
+
+export default XtPage
 export { XtPage }

package/src/components/xt-select-tree/index.js

@@ -1,8 +1,8 @@
-import XtSelectTree from './index.vue'
-
-XtSelectTree.install = function (Vue) {
-  Vue.component(XtSelectTree.name, XtSelectTree)
-}
-
-export default XtSelectTree
+import XtSelectTree from './index.vue'
+
+XtSelectTree.install = function (Vue) {
+  Vue.component(XtSelectTree.name, XtSelectTree)
+}
+
+export default XtSelectTree
 export { XtSelectTree }

package/src/components/xt-step-price/index.vue

@@ -154,6 +154,7 @@ export default {
         if (next) {
           let curMax = this.safeNumber(cur[this.keyMax], curMin + stepVal)
           if (curMax <= curMin) curMax = curMin + stepVal
+          curMax = Number(curMax.toFixed(this.precision))
           cur[this.keyMax] = curMax
           next[this.keyMin] = curMax
         } else {
@@ -173,13 +174,19 @@ export default {
     onItemInput(val, idx) {
       const cur = this.localItems[idx]
       if (!cur) return
-      if (val && val[this.keyPrice] !== undefined) cur[this.keyPrice] = this.safeNumber(val[this.keyPrice], 0)
+      if (val && val[this.keyPrice] !== undefined) {
+        let p = this.safeNumber(val[this.keyPrice], 0)
+        p = Number(p.toFixed(this.precision))
+        cur[this.keyPrice] = p
+      }
     },
 
     onMaxChange(val, idx) {
       const cur = this.localItems[idx]
       if (!cur) return
-      const n = this.safeNumber(val, this.safeNumber(cur[this.keyMin], 0) + 1)
+      const stepVal = this.safeNumber(this.step, 1)
+      let n = this.safeNumber(val, this.safeNumber(cur[this.keyMin], 0) + stepVal)
+      n = Number(n.toFixed(this.precision))
       cur[this.keyMax] = n
       const next = this.localItems[idx + 1]
       if (next) next[this.keyMin] = n
@@ -192,7 +199,10 @@ export default {
       if (idx === 0) {
         cur[this.keyMin] = 0
       } else {
-        const n = this.safeNumber(val, this.safeNumber(cur[this.keyMin], 0))
+        let n = this.safeNumber(val, this.safeNumber(cur[this.keyMin], 0))
+        if (n !== 0) {
+          n = Number(n.toFixed(this.precision))
+        }
         cur[this.keyMin] = n
         const prev = this.localItems[idx - 1]
         if (prev) prev[this.keyMax] = n

package/src/components/xt-step-price-item/index.vue

@@ -155,7 +155,10 @@ export default {
     },
 
     onMinBlur() {
-      const v = this.safeNumber(this.minInput, 0)
+      let v = this.safeNumber(this.minInput, 0)
+      if (v !== 0) {
+        v = Number(v.toFixed(this.precision))
+      }
       this.minInput = v
       this.$emit('min-change', v, this.index)
       this.emitChange({ [this.keyMin]: v })
@@ -164,8 +167,10 @@ export default {
     onMaxBlur() {
       if (this.isLast) return
       const minVal = this.safeNumber(this.minInput, 0)
-      let v = this.safeNumber(this.maxInput, minVal + 1)
-      if (v <= minVal) v = minVal + 1
+      const stepVal = this.safeNumber(this.step, 1)
+      let v = this.safeNumber(this.maxInput, minVal + stepVal)
+      if (v <= minVal) v = minVal + stepVal
+      v = Number(v.toFixed(this.precision))
       this.maxInput = v
       this.$emit('max-change', v, this.index)
       this.emitChange({ [this.keyMax]: v })

package/src/components/xt-table/index.js

@@ -1,8 +1,8 @@
-import XtTable from './index.vue'
-
-XtTable.install = function (Vue) {
-  Vue.component(XtTable.name, XtTable)
-}
-
-export default XtTable
+import XtTable from './index.vue'
+
+XtTable.install = function (Vue) {
+  Vue.component(XtTable.name, XtTable)
+}
+
+export default XtTable
 export { XtTable }

package/src/components/xt-text/index.vue

@@ -1,5 +1,35 @@
 <template>
+  <el-tooltip
+    v-if="showTooltip && ellipsis"
+    :content="displayTooltipContent"
+    :placement="tooltipPlacement"
+    :disabled="!isOverflow"
+    effect="dark"
+  >
+    <span 
+      ref="textRef"
+      class="xt-text" 
+      :class="[
+        type ? 'xt-text--' + type : '',
+        'xt-text--' + size,
+        { 'xt-text--bold': bold },
+        { 'xt-text--money': format === 'money' },
+        { 'xt-text--ellipsis': ellipsis },
+        { 'xt-text--ellipsis-multiline': ellipsis && ellipsisRows > 1 }
+      ]"
+      :style="customStyle"
+      @mouseenter="handleMouseEnter"
+    >
+      <slot name="prefix">{{ prefix }}</slot>
+      <slot>
+        <template v-if="formattedValue !== undefined">{{ formattedValue }}</template>
+      </slot>
+      <slot name="suffix">{{ suffix }}</slot> 
+    </span>
+  </el-tooltip>
   <span 
+    v-else
+    ref="textRef"
     class="xt-text" 
     :class="[
       type ? 'xt-text--' + type : '',
@@ -54,6 +84,19 @@ export default {
       default: 1,
       validator: (val) => val >= 1 && val <= 10
     },
+    showTooltip: {
+      type: Boolean,
+      default: true
+    },
+    tooltipPlacement: {
+      type: String,
+      default: 'top',
+      validator: (val) => ['top', 'bottom', 'left', 'right', 'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-start', 'left-end', 'right-start', 'right-end'].includes(val)
+    },
+    tooltipContent: {
+      type: String,
+      default: ''
+    },
 
     // 格式化模式：normal 普通 | thousand 千分位 | money 金额
     format: {
@@ -98,6 +141,11 @@ export default {
       default: ''
     }
   },
+  data() {
+    return {
+      isOverflow: false
+    }
+  },
   computed: {
     // 兼容旧 money 属性：如果传了 money=true，自动切为金额模式
     realFormat() {
@@ -115,6 +163,19 @@ export default {
       return style
     },
 
+    displayTooltipContent() {
+      if (this.tooltipContent) {
+        return this.tooltipContent
+      }
+      if (this.formattedValue !== undefined) {
+        return this.formattedValue
+      }
+      if (this.$slots.default && this.$slots.default.length > 0) {
+        return this.extractSlotText(this.$slots.default)
+      }
+      return this.value
+    },
+
     formattedValue() {
       const fmt = this.realFormat
       const { value } = this
@@ -163,6 +224,75 @@ export default {
         return value
       }
     }
+  },
+  methods: {
+    handleMouseEnter() {
+      this.checkOverflow()
+    },
+    checkOverflow() {
+      const el = this.$refs.textRef
+      if (!el) {
+        this.isOverflow = false
+        return
+      }
+
+      if (this.ellipsisRows > 1) {
+        this.isOverflow = el.scrollHeight > el.clientHeight
+      } else {
+        this.isOverflow = el.scrollWidth > el.clientWidth
+      }
+    },
+    extractSlotText(nodes) {
+      let text = ''
+      nodes.forEach(node => {
+        if (typeof node.children === 'string') {
+          text += node.children
+        } else if (typeof node.text === 'string') {
+          text += node.text
+        } else if (node.children && Array.isArray(node.children)) {
+          text += this.extractSlotText(node.children)
+        }
+      })
+      return text.trim()
+    }
+  },
+  mounted() {
+    if (this.ellipsis && this.showTooltip) {
+      this.$nextTick(() => {
+        this.checkOverflow()
+      })
+    }
+    this._resizeObserver = new ResizeObserver(() => {
+      if (this.ellipsis && this.showTooltip) {
+        this.checkOverflow()
+      }
+    })
+    this.$nextTick(() => {
+      if (this.$refs.textRef) {
+        this._resizeObserver.observe(this.$refs.textRef)
+      }
+    })
+  },
+  beforeDestroy() {
+    if (this._resizeObserver) {
+      this._resizeObserver.disconnect()
+    }
+  },
+  watch: {
+    value() {
+      if (this.ellipsis && this.showTooltip) {
+        this.$nextTick(() => {
+          this.checkOverflow()
+        })
+      }
+    },
+    ellipsis(newVal) {
+      if (newVal && this.showTooltip) {
+        this.$nextTick(() => {
+          this.checkOverflow()
+        })
+      }
+    }
   }
 }
 </script>