xianniu-ui 2.0.4 → 2.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xianniu-ui",
-  "version": "2.0.4",
+  "version": "2.0.6",
   "private": false,
   "main": "lib/xianniu-ui.umd.min.js",
   "scripts": {

package/packages/amount/main.vue

@@ -8,11 +8,15 @@
       >
         <slot name="prefix">{{ prefix }}</slot>
       </i><!--
-      --><slot>{{
-        formatValue
-          | doPrecision(legalPrecision, isRoundUp, emptyValue)
-          | doFormat(hasSeparator, separator)
-      }}</slot><!--
+      --><template v-if="$slots.default">
+        <template v-if="slotTextContent !== null && !isNaN(Number(slotTextContent))">
+          {{ formatUserValue(Number(slotTextContent)) }}
+        </template>
+        <slot v-else></slot>
+      </template>
+      <template v-else>
+        {{ formattedValue }}
+      </template><!--
       --><i
         class="xn-amount-suffix"
         :style="suffixStyle"
@@ -114,6 +118,11 @@ export default {
     },
     // 处理格式
     doFormat(value, hasSeparator, separator) {
+      // 如果值为空或者是非数字字符串（如空值显示），直接返回
+      if (!value || isNaN(parseFloat(value))) {
+        return value;
+      }
+      
       if (!hasSeparator) {
         return value;
       }
@@ -167,10 +176,52 @@ export default {
     legalPrecision() {
       return this.precision > 0 ? this.precision : 0;
     },
+    // 计算格式化后的值
+    formattedValue() {
+      // 如果有默认插槽内容，则不对插槽内容进行格式化
+      if (this.$slots.default) {
+        return;
+      }
+      
+      // 应用精度和分隔符格式化
+      const value = this.formatValue;
+      const precisionValue = this.$options.filters.doPrecision(
+        value, 
+        this.legalPrecision, 
+        this.isRoundUp, 
+        this.emptyValue
+      );
+      return this.$options.filters.doFormat(
+        precisionValue, 
+        this.hasSeparator, 
+        this.separator
+      );
+    },
+    // 获取默认插槽的文本内容
+    slotTextContent() {
+      if (!this.$slots.default || !this.$slots.default.length) {
+        return null;
+      }
+      
+      // 获取插槽内容
+      const slot = this.$slots.default[0];
+      
+      // 如果是文本节点
+      if (slot.text) {
+        return slot.text.trim();
+      }
+      
+      // 如果是简单的VNode且包含文本
+      if (slot.children && slot.children.length > 0 && slot.children[0].text) {
+        return slot.children[0].text.trim();
+      }
+      
+      return null;
+    },
   },
   data() {
     return {
-      formatValue: 0,
+      formatValue: null,
       isMounted: false,
     };
   },
@@ -180,6 +231,17 @@ export default {
   methods: {
     // 动画显示数值变化
     $_doAnimateDisplay(fromValue = 0, toValue = 0) {
+      // 如果目标值为null，直接设置为null
+      if (toValue == null) {
+        this.formatValue = null;
+        return;
+      }
+      
+      // 如果起始值为null，设置为0
+      if (fromValue == null) {
+        fromValue = 0;
+      }
+      
       /* istanbul ignore next  */
       const step = (percent) => {
         if (percent === 1) {
@@ -193,6 +255,25 @@ export default {
       const verify = (id) => id;
       Animate.start(step, verify, noop, this.duration);
     },
+    // 格式化用户提供的值
+    formatUserValue(value) {
+      if (value == null || isNaN(value)) {
+        return this.emptyValue;
+      }
+      
+      // 应用精度和分隔符格式化
+      const precisionValue = this.$options.filters.doPrecision(
+        value, 
+        this.legalPrecision, 
+        this.isRoundUp, 
+        this.emptyValue
+      );
+      return this.$options.filters.doFormat(
+        precisionValue, 
+        this.hasSeparator, 
+        this.separator
+      );
+    },
   },
 };
 </script>

package/packages/style/src/card.scss

@@ -1,6 +1,6 @@
 .xn-card {
     background-color: #fff;
-    padding: 0 30px;
+    padding: 0 24px;
     &-header {
         padding: 20px 0 13px 0;
         border-bottom: 1px solid #f2f2f2;