update

package/component/es/input/index2.js

@@ -102,11 +102,37 @@ const _sfc_main = defineComponent({
     });
     const isPassword = computed(() => type.value == "password");
     const composing = ref(false);
+    const formatMoney = function(s) {
+      var noNegative = true;
+      s = parseFloat((s + "").replace(/[^\d\.-]/g, "")) + "";
+      if (parseFloat(s) < 0) {
+        s = Math.abs(s) + "";
+        noNegative = false;
+      }
+      var l = s.split(".")[0].split("").reverse(), r = s.split(".")[1];
+      var t = "";
+      for (let i = 0; i < l.length; i++) {
+        if (i % 3 == 2 && i != l.length - 1) {
+          t += l[i] + ",";
+        } else {
+          t += l[i] + "";
+        }
+      }
+      let z = (noNegative ? "" : "-") + t.split("").reverse().join("");
+      if (r) {
+        return z + "." + r;
+      } else {
+        return isNaN(parseInt(z)) ? 0 : z;
+      }
+    };
     watch(() => props.type, () => {
       type.value = props.type;
     });
+    const input = ref();
     watch(() => props.modelValue, () => {
-      if (props.qfw && currentValue.value.indexOf(",") != -1) {
+      console.log(input);
+      if (!(input.value == document.activeElement) && props.qfw) {
+        currentValue.value = formatMoney(props.modelValue.toString());
         return;
       }
       currentValue.value = String(props.modelValue == null ? "" : props.modelValue);
@@ -142,6 +168,15 @@ const _sfc_main = defineComponent({
       if (props.type === "number") {
         onNumberBlur(event);
       }
+      if (props.qfw) {
+        try {
+          let reg = /\d{1,3}(?=(\d{3})+$)/g;
+          console.log("\u6DFB\u52A0\uFF0C", formatMoney(props.modelValue.toString()));
+          currentValue.value = formatMoney(props.modelValue.toString());
+        } catch {
+          currentValue.value = "\u8F93\u5165\u9519\u8BEF";
+        }
+      }
       emit("blur", event);
     };
     const onNumberBlur = (event) => {
@@ -157,7 +192,6 @@ const _sfc_main = defineComponent({
       if (props.qfw) {
         value = value.replace(/,/g, "");
       }
-      currentValue.value = new String(props.modelValue).toLocaleString();
       emit("update:modelValue", value);
     };
     const onCompositionstart = () => {
@@ -213,7 +247,9 @@ const _sfc_main = defineComponent({
             onFocus,
             onBlur,
             onCompositionstart,
-            onCompositionend
+            onCompositionend,
+            ref_key: "input",
+            ref: input
           }, null, 40, _hoisted_5),
           __props.password && unref(hasContent) ? (openBlock(), createElementBlock("span", {
             key: 1,

package/component/src/component/input/index.vue

@@ -29,7 +29,7 @@ export interface InputProps {
   maxlength?: number;
   max?: number;
   min?: number;
-  qfw?:boolean;
+  qfw?: boolean;
 }
 
 const props = withDefaults(defineProps<InputProps>(), {
@@ -40,7 +40,7 @@ const props = withDefaults(defineProps<InputProps>(), {
   password: false,
   modelValue: "",
   size: "md",
-  qfw: false
+  qfw: false,
 });
 
 interface InputEmits {
@@ -63,18 +63,48 @@ const hasContent = computed(() => (props.modelValue as string)?.length > 0);
 const isPassword = computed(() => type.value == "password");
 const composing = ref(false);
 
+const formatMoney = function (s: string) {
+  var noNegative = true;
+  s = parseFloat((s + "").replace(/[^\d\.-]/g, "")) + "";
+  if (parseFloat(s) < 0) {
+    s = Math.abs(s) + "";
+    noNegative = false;
+  }
+
+  var l = s.split(".")[0].split("").reverse(),
+    r = s.split(".")[1];
+  var t = "";
+  for (let i = 0; i < l.length; i++) {
+    if (i % 3 == 2 && i != l.length - 1) {
+      t += l[i] + ",";
+    } else {
+      t += l[i] + ""; //加上空格
+    }
+  }
+  let z: any = (noNegative ? "" : "-") + t.split("").reverse().join("");
+  // z = isNaN(z) ? 0 : z;
+  if (r) {
+    return z + "." + r;
+  } else {
+    return isNaN(parseInt(z)) ? 0 : z;
+  }
+};
+
 watch(
   () => props.type,
   () => {
     type.value = props.type;
   }
 );
+const input: any = ref<Element>();
 
 watch(
   () => props.modelValue,
   () => {
-    if(props.qfw && currentValue.value.indexOf(",") != -1){
-      return
+    console.log(input);
+    if (!(input.value == document.activeElement) && props.qfw) {
+      currentValue.value = formatMoney(props.modelValue.toString());
+      return;
     }
     currentValue.value = String(
       props.modelValue == null ? "" : props.modelValue
@@ -87,8 +117,8 @@ const onInput = function (event: Event) {
   let value = inputElement.value;
   emit("input", value);
   if (composing.value) return;
-  if(props.qfw){
-    value = value.replace(/,/g,"")
+  if (props.qfw) {
+    value = value.replace(/,/g, "");
   }
   emit("update:modelValue", value);
 };
@@ -99,15 +129,15 @@ const onClear = () => {
 };
 
 const onFocus = (event: Event) => {
-  currentValue.value = new String(props.modelValue).replace(/,/g,"")
+  currentValue.value = new String(props.modelValue).replace(/,/g, "");
   emit("focus", event);
 };
 
 const onChange = (event: Event) => {
   const inputElement = event.target as HTMLInputElement;
   let value = inputElement.value;
-  if(props.qfw){
-    value = value.replace(/,/g,"")
+  if (props.qfw) {
+    value = value.replace(/,/g, "");
   }
   emit("change", value);
 };
@@ -116,6 +146,17 @@ const onBlur = (event: Event) => {
   if (props.type === "number") {
     onNumberBlur(event);
   }
+  if (props.qfw) {
+    try {
+      let reg = /\d{1,3}(?=(\d{3})+$)/g;
+      // new String(props.modelValue).replace(reg, '$&,');
+      console.log("添加，", formatMoney(props.modelValue.toString()));
+      currentValue.value = formatMoney(props.modelValue.toString());
+    } catch {
+      currentValue.value = "输入错误";
+    }
+  }
+
   emit("blur", event);
 };
 
@@ -127,10 +168,9 @@ const onNumberBlur = (event: Event) => {
     if (props.max && props.max < Number(value)) value = props.max.toString();
     if (props.min && props.min > Number(value)) value = props.min.toString();
   }
-  if(props.qfw){
-    value = value.replace(/,/g,"")
+  if (props.qfw) {
+    value = value.replace(/,/g, "");
   }
-  currentValue.value = new String(props.modelValue).toLocaleString()
   emit("update:modelValue", value);
 };
 
@@ -191,6 +231,7 @@ const showPassword = () => {
         @blur="onBlur"
         @compositionstart="onCompositionstart"
         @compositionend="onCompositionend"
+        ref="input"
       />
       <span
         class="layui-input-password"

package/layer/src/component/index.vue

@@ -631,6 +631,29 @@ defineExpose({ reset, open, close });
           :style="{ height: contentHeight }"
           :class="contentClasses"
         >
+          <template v-if="type === 3">
+            <div style="scale: 0.5">
+              <div class="loading"></div>
+              <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
+                <defs>
+                  <filter id="goo">
+                    <feGaussianBlur
+                      in="SourceGraphic"
+                      stdDeviation="6.3"
+                      result="blur"
+                    />
+                    <feColorMatrix
+                      in="blur"
+                      mode="matrix"
+                      values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 14 -4"
+                      result="goo"
+                    />
+                    <feBlend in="SourceGraphic" in2="goo" />
+                  </filter>
+                </defs>
+              </svg>
+            </div>
+          </template>
           <template v-if="type === 0 || type === 1 || type === 4">
             <i v-if="icon" :class="iconClass"></i>
             <slot v-if="slots.default"></slot>

package/layer/src/theme/index.css

@@ -869,9 +869,9 @@
 }
 
 .layui-layer-loading .layui-layer-content {
-  width: 60px;
-  height: 24px;
-  background: url(loading-0.gif) no-repeat;
+  width: 0px;
+  height: 0px;
+  /* background: url(loading-0.gif) no-repeat; */
 }
 
 .layui-layer-loading .layui-layer-loading1 {
@@ -1125,4 +1125,52 @@
   transform: scale(0.7);
   margin-left: -7px;
   margin-right: 3px;
+}
+
+
+/* 下面是添加的新的加载动画 */
+.loading {
+  width: 83px;
+  height: 83px;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  -webkit-filter: url("#goo");
+  filter: url("#goo");
+}
+.loading span {
+  width: 100%;
+  text-align: center;
+  color: linear-gradient(to right, #92fe9d 0%, #00c9ff 100%);
+  font-weight: bold;
+  text-transform: uppercase;
+  font-size: 15px;
+  letter-spacing: 1px;
+  position: absolute;
+  left: 1px;
+  top: 46%;
+}
+.loading:before, .loading:after {
+  content: '';
+  border-radius: 50%;
+  background-color: rgb(22, 120, 160);
+  width: 26px;
+  height: 26px;
+  position: absolute;
+  left: 72px;
+  top: 8px;
+  animation: rotate 6s linear;
+  animation-iteration-count: infinite;
+  transform-origin: 12px 76px;
+}
+.loading:before {
+  box-shadow: 45px 19px 0px 0px rgb(22, 120, 160), 62px 63px 0px 0px rgb(22, 120, 160), 45px 107px 0px 0px rgb(22, 120, 160), 0px 126px 0px 0px rgb(22, 120, 160), -46px 107px 0px 0px rgb(22, 120, 160), -63px 63px 0px 0px rgb(22, 120, 160), -46px 19px 0px 0px rgb(22, 120, 160);
+}
+.loading:after {
+  animation-direction: reverse;
+}
+@keyframes rotate {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(-360deg); }
 }

pnpm-lock.yaml

@@ -88,7 +88,7 @@ importers:
     dependencies:
       '@ctrl/tinycolor': 3.4.1
       '@layui/icons-vue': link:../icons
-      '@layui/layer-vue': git.theluyuan.com/luyuan/layui-layer/4b0c6aafd57d16ef1458a65066138a290dc2eb50
+      '@layui/layer-vue': git.theluyuan.com/luyuan/layui-layer/c391e9c213adb6abbffa59160f19fd3563ed12ca
       '@umijs/ssr-darkreader': 4.9.45
       '@vueuse/core': 9.2.0
       async-validator: 4.1.1
@@ -5652,8 +5652,8 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  git.theluyuan.com/luyuan/layui-layer/4b0c6aafd57d16ef1458a65066138a290dc2eb50:
-    resolution: {commit: 4b0c6aafd57d16ef1458a65066138a290dc2eb50, repo: https://git.theluyuan.com/luyuan/layui-layer.git, type: git}
+  git.theluyuan.com/luyuan/layui-layer/c391e9c213adb6abbffa59160f19fd3563ed12ca:
+    resolution: {commit: c391e9c213adb6abbffa59160f19fd3563ed12ca, repo: https://git.theluyuan.com/luyuan/layui-layer.git, type: git}
     name: '@layui/layer-vue'
     version: 1.4.7
     dev: false