This commit is contained in:
Theluyuan 2022-12-30 16:14:41 +08:00
parent c5d893ba35
commit 7ab98231e8
14 changed files with 454 additions and 187 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -102,11 +102,37 @@ const _sfc_main = defineComponent({
}); });
const isPassword = computed(() => type.value == "password"); const isPassword = computed(() => type.value == "password");
const composing = ref(false); 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, () => { watch(() => props.type, () => {
type.value = props.type; type.value = props.type;
}); });
const input = ref();
watch(() => props.modelValue, () => { 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; return;
} }
currentValue.value = String(props.modelValue == null ? "" : props.modelValue); currentValue.value = String(props.modelValue == null ? "" : props.modelValue);
@ -142,6 +168,15 @@ const _sfc_main = defineComponent({
if (props.type === "number") { if (props.type === "number") {
onNumberBlur(event); 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); emit("blur", event);
}; };
const onNumberBlur = (event) => { const onNumberBlur = (event) => {
@ -157,7 +192,6 @@ const _sfc_main = defineComponent({
if (props.qfw) { if (props.qfw) {
value = value.replace(/,/g, ""); value = value.replace(/,/g, "");
} }
currentValue.value = new String(props.modelValue).toLocaleString();
emit("update:modelValue", value); emit("update:modelValue", value);
}; };
const onCompositionstart = () => { const onCompositionstart = () => {
@ -213,7 +247,9 @@ const _sfc_main = defineComponent({
onFocus, onFocus,
onBlur, onBlur,
onCompositionstart, onCompositionstart,
onCompositionend onCompositionend,
ref_key: "input",
ref: input
}, null, 40, _hoisted_5), }, null, 40, _hoisted_5),
__props.password && unref(hasContent) ? (openBlock(), createElementBlock("span", { __props.password && unref(hasContent) ? (openBlock(), createElementBlock("span", {
key: 1, key: 1,

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -40,7 +40,7 @@ const props = withDefaults(defineProps<InputProps>(), {
password: false, password: false,
modelValue: "", modelValue: "",
size: "md", size: "md",
qfw: false qfw: false,
}); });
interface InputEmits { interface InputEmits {
@ -63,18 +63,48 @@ const hasContent = computed(() => (props.modelValue as string)?.length > 0);
const isPassword = computed(() => type.value == "password"); const isPassword = computed(() => type.value == "password");
const composing = ref(false); 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( watch(
() => props.type, () => props.type,
() => { () => {
type.value = props.type; type.value = props.type;
} }
); );
const input: any = ref<Element>();
watch( watch(
() => props.modelValue, () => props.modelValue,
() => { () => {
if(props.qfw && currentValue.value.indexOf(",") != -1){ console.log(input);
return if (!(input.value == document.activeElement) && props.qfw) {
currentValue.value = formatMoney(props.modelValue.toString());
return;
} }
currentValue.value = String( currentValue.value = String(
props.modelValue == null ? "" : props.modelValue props.modelValue == null ? "" : props.modelValue
@ -88,7 +118,7 @@ const onInput = function (event: Event) {
emit("input", value); emit("input", value);
if (composing.value) return; if (composing.value) return;
if (props.qfw) { if (props.qfw) {
value = value.replace(/,/g,"") value = value.replace(/,/g, "");
} }
emit("update:modelValue", value); emit("update:modelValue", value);
}; };
@ -99,7 +129,7 @@ const onClear = () => {
}; };
const onFocus = (event: Event) => { const onFocus = (event: Event) => {
currentValue.value = new String(props.modelValue).replace(/,/g,"") currentValue.value = new String(props.modelValue).replace(/,/g, "");
emit("focus", event); emit("focus", event);
}; };
@ -107,7 +137,7 @@ const onChange = (event: Event) => {
const inputElement = event.target as HTMLInputElement; const inputElement = event.target as HTMLInputElement;
let value = inputElement.value; let value = inputElement.value;
if (props.qfw) { if (props.qfw) {
value = value.replace(/,/g,"") value = value.replace(/,/g, "");
} }
emit("change", value); emit("change", value);
}; };
@ -116,6 +146,17 @@ const onBlur = (event: Event) => {
if (props.type === "number") { if (props.type === "number") {
onNumberBlur(event); 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); emit("blur", event);
}; };
@ -128,9 +169,8 @@ const onNumberBlur = (event: Event) => {
if (props.min && props.min > Number(value)) value = props.min.toString(); if (props.min && props.min > Number(value)) value = props.min.toString();
} }
if (props.qfw) { if (props.qfw) {
value = value.replace(/,/g,"") value = value.replace(/,/g, "");
} }
currentValue.value = new String(props.modelValue).toLocaleString()
emit("update:modelValue", value); emit("update:modelValue", value);
}; };
@ -191,6 +231,7 @@ const showPassword = () => {
@blur="onBlur" @blur="onBlur"
@compositionstart="onCompositionstart" @compositionstart="onCompositionstart"
@compositionend="onCompositionend" @compositionend="onCompositionend"
ref="input"
/> />
<span <span
class="layui-input-password" class="layui-input-password"

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -631,6 +631,29 @@ defineExpose({ reset, open, close });
:style="{ height: contentHeight }" :style="{ height: contentHeight }"
:class="contentClasses" :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"> <template v-if="type === 0 || type === 1 || type === 4">
<i v-if="icon" :class="iconClass"></i> <i v-if="icon" :class="iconClass"></i>
<slot v-if="slots.default"></slot> <slot v-if="slots.default"></slot>

View File

@ -869,9 +869,9 @@
} }
.layui-layer-loading .layui-layer-content { .layui-layer-loading .layui-layer-content {
width: 60px; width: 0px;
height: 24px; height: 0px;
background: url(loading-0.gif) no-repeat; /* background: url(loading-0.gif) no-repeat; */
} }
.layui-layer-loading .layui-layer-loading1 { .layui-layer-loading .layui-layer-loading1 {
@ -1126,3 +1126,51 @@
margin-left: -7px; margin-left: -7px;
margin-right: 3px; 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); }
}

6
pnpm-lock.yaml generated
View File

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