leisure-core 0.5.72 → 0.5.74

package/le-input-validate/src/main.vue

@@ -9,6 +9,7 @@
       @input="handleInput"
       @blur="handleBlur"
       @clear="handleClear"
+      @focus="handleFocus"
     >
       <template v-if="showCount" #suffix>
         <span class="input-count" :class="{ 'is-error': isOverMaxLength }">
@@ -44,6 +45,11 @@ export default {
       type: Boolean,
       default: false,
     },
+    // 金额类型
+    amount: {
+      type: Boolean,
+      default: false,
+    },
     // 最大长度
     maxlength: {
       type: [Number, String],
@@ -64,6 +70,16 @@ export default {
       type: [String, Number],
       default: "",
     },
+    // 是否允许小数
+    allowDecimal: {
+      type: Boolean,
+      default: true,
+    },
+    // 小数位数限制
+    decimalLimit: {
+      type: Number,
+      default: 2,
+    },
   },
 
   data() {
@@ -72,6 +88,7 @@ export default {
       errorMessage: "",
       internalValue: this.value,
       isTouched: false,
+      isFocused: false,
     };
   },
 
@@ -87,10 +104,13 @@ export default {
       delete attrs.number;
       delete attrs.mobile;
       delete attrs.email;
+      delete attrs.amount;
       delete attrs.maxlength;
       delete attrs.showCount;
       delete attrs.validator;
       delete attrs.value;
+      delete attrs.allowDecimal;
+      delete attrs.decimalLimit;
 
       // 合并值，确保我们的 value 逻辑优先
       return {
@@ -122,6 +142,10 @@ export default {
     },
 
     displayValue() {
+      // 金额类型在非聚焦状态下显示格式化后的值
+      if (this.amount && !this.isFocused && this.internalValue) {
+        return this.formatAmount(this.internalValue);
+      }
       return this.internalValue;
     },
   },
@@ -152,6 +176,11 @@ export default {
         processedValue = this.formatMobile(value);
       }
 
+      // 金额类型处理
+      if (this.amount) {
+        processedValue = this.formatAmountInput(value);
+      }
+
       // 长度限制
       if (
         this.computedMaxlength &&
@@ -169,6 +198,7 @@ export default {
 
     handleBlur(event) {
       this.isTouched = true;
+      this.isFocused = false;
       this.validateInput(this.internalValue, true);
       this.$emit("blur", event);
 
@@ -176,6 +206,14 @@ export default {
       this.$listeners.blur && this.$listeners.blur(event);
     },
 
+    handleFocus(event) {
+      this.isFocused = true;
+      this.$emit("focus", event);
+
+      // 触发外部监听的事件
+      this.$listeners.focus && this.$listeners.focus(event);
+    },
+
     handleClear() {
       this.hasError = false;
       this.errorMessage = "";
@@ -195,6 +233,47 @@ export default {
       return value.replace(/\D/g, "");
     },
 
+    formatAmountInput(value) {
+      // 金额输入过滤：只允许数字和小数点
+      let filteredValue = value.replace(/[^\d.]/g, "");
+
+      // 处理多个小数点的情况
+      const parts = filteredValue.split(".");
+      if (parts.length > 2) {
+        filteredValue = parts[0] + "." + parts.slice(1).join("");
+      }
+
+      // 限制小数位数
+      if (parts.length === 2 && parts[1].length > this.decimalLimit) {
+        filteredValue =
+          parts[0] + "." + parts[1].substring(0, this.decimalLimit);
+      }
+
+      return filteredValue;
+    },
+
+    formatAmount(value) {
+      if (!value) return "";
+
+      // 将值转换为字符串
+      const strValue = String(value);
+
+      // 分割整数和小数部分
+      const parts = strValue.split(".");
+      let integerPart = parts[0];
+      let decimalPart = parts.length > 1 ? parts[1] : "";
+
+      // 对整数部分添加千分位分隔符
+      integerPart = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+
+      // 组合整数和小数部分
+      if (decimalPart && this.allowDecimal) {
+        return `${integerPart}.${decimalPart}`;
+      } else {
+        return integerPart;
+      }
+    },
+
     validateInput(value, showError = false) {
       if (!this.isTouched && !showError) return true;
 
@@ -227,6 +306,20 @@ export default {
         }
       }
 
+      // 金额验证
+      if (this.amount && strValue) {
+        const amountRegex = this.allowDecimal
+          ? new RegExp(`^\\d+(\\.\\d{0,${this.decimalLimit}})?$`)
+          : /^\d+$/;
+
+        if (!amountRegex.test(strValue.replace(/,/g, ""))) {
+          isValid = false;
+          message = this.allowDecimal
+            ? `请输入有效的金额（最多${this.decimalLimit}位小数）`
+            : "请输入有效的金额（整数）";
+        }
+      }
+
       // 最大长度验证
       if (this.computedMaxlength && strValue.length > this.computedMaxlength) {
         isValid = false;

package/le-list/src/main.vue

@@ -58,7 +58,7 @@
           <template v-else>
             <div class="rowBtns">
               <le-button @click="editItem(scope.row)" v-if="disBtn === 'edit'">
-                编辑</le-button
+                {{ editBtnText }}</le-button
               >
               <le-button @click="detail(scope.row)" v-if="disBtn === 'detail'">
                 详情</le-button
@@ -153,6 +153,10 @@ export default {
       type: String,
       default: "id",
     },
+    editBtnText: {
+      type: String,
+      default: "编辑",
+    },
   },
   watch: {
     searchParam: {
@@ -286,17 +290,29 @@ export default {
       this.rowItems = val;
     },
     format(type, value, spec) {
-      const renderers = {
-        bool: () => (value == 1 ? "是" : "否"),
-        date: () => {
-          if (spec) {
-            this.parseTime(value, spec);
-          } else this.parseTime(value);
-        },
-        currency: () => `$${parseFloat(value).toFixed(2)}`,
-      };
-      let result = renderers[type]?.() || value;
-      return result;
+      // 参数验证
+      if (type === undefined || value === undefined) return value;
+
+      switch (type) {
+        case "bool":
+          return value === 1 || value === "1" || value === true ? "是" : "否";
+
+        case "date":
+          if (!value) return "";
+          try {
+            return spec ? this.parseTime(value, spec) : this.parseTime(value);
+          } catch {
+            return value;
+          }
+
+        case "currency":
+          if (value == null || value === "") return "";
+          const num = parseFloat(value);
+          return isNaN(num) ? value : `$${num.toFixed(2)}`;
+
+        default:
+          return value;
+      }
     },
   },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "leisure-core",
-  "version": "0.5.72",
+  "version": "0.5.74",
   "description": "leisure-core是京心数据基于vue2.x开发的一套后台管理系统桌面端组件库，封装了大量实用的UI控件模板,非常方便开发者快速搭建前端应用",
   "private": false,
   "author": "北方乐逍遥(zcx7878)",