theluyuan/layui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

qfw

Browse Source
This commit is contained in:
Theluyuan 2022-12-12 09:59:03 +08:00
parent 937a34f05e
commit f99c22984f
4 changed files with 130 additions and 146 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
es/input/index2.js
View File

@ -102,10 +102,32 @@ 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).toFixed(2) + "";
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] + "";
}
}
return (noNegative ? "" : "-") + t.split("").reverse().join("") + "." + r;
};
watch(() => props.type, () => { watch(() => props.type, () => {
type.value = props.type; type.value = props.type;
}); });
watch(() => props.modelValue, () => { watch(() => props.modelValue, () => {
if (props.qfw) {
currentValue.value = formatMoney(props.modelValue.toString());
return;
}
currentValue.value = String(props.modelValue == null ? "" : props.modelValue); currentValue.value = String(props.modelValue == null ? "" : props.modelValue);
}); });
const onInput = function(event) { const onInput = function(event) {
@ -140,24 +162,6 @@ const _sfc_main = defineComponent({
onNumberBlur(event); onNumberBlur(event);
} }
if (props.qfw) { if (props.qfw) {
var formatMoney = function(s) {
var noNegative = true;
s = parseFloat((s + "").replace(/[^\d\.-]/g, "")) + "";
if (parseFloat(s) < 0) {
s = Math.abs(s).toFixed(2) + "";
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] + "";
}
}
return (noNegative ? "" : "-") + t.split("").reverse().join("") + "." + r;
};
try { try {
let reg = /\d{1,3}(?=(\d{3})+$)/g; let reg = /\d{1,3}(?=(\d{3})+$)/g;
console.log("\u6DFB\u52A0\uFF0C", formatMoney(props.modelValue.toString())); console.log("\u6DFB\u52A0\uFF0C", formatMoney(props.modelValue.toString()));

40
lib/index.js
View File

@ -11198,10 +11198,32 @@ const _sfc_main$1v = defineComponent({
}); });
const isPassword = computed$1(() => type4.value == "password"); const isPassword = computed$1(() => type4.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).toFixed(2) + "";
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] + "";
}
}
return (noNegative ? "" : "-") + t.split("").reverse().join("") + "." + r;
};
watch(() => props.type, () => { watch(() => props.type, () => {
type4.value = props.type; type4.value = props.type;
}); });
watch(() => props.modelValue, () => { watch(() => props.modelValue, () => {
if (props.qfw) {
currentValue.value = formatMoney(props.modelValue.toString());
return;
}
currentValue.value = String(props.modelValue == null ? "" : props.modelValue); currentValue.value = String(props.modelValue == null ? "" : props.modelValue);
}); });
const onInput = function(event) { const onInput = function(event) {
@ -11236,24 +11258,6 @@ const _sfc_main$1v = defineComponent({
onNumberBlur(event); onNumberBlur(event);
} }
if (props.qfw) { if (props.qfw) {
var formatMoney = function(s) {
var noNegative = true;
s = parseFloat((s + "").replace(/[^\d\.-]/g, "")) + "";
if (parseFloat(s) < 0) {
s = Math.abs(s).toFixed(2) + "";
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] + "";
}
}
return (noNegative ? "" : "-") + t.split("").reverse().join("") + "." + r;
};
try { try {
let reg = /\d{1,3}(?=(\d{3})+$)/g; let reg = /\d{1,3}(?=(\d{3})+$)/g;
console.log("\u6DFB\u52A0\uFF0C", formatMoney(props.modelValue.toString())); console.log("\u6DFB\u52A0\uFF0C", formatMoney(props.modelValue.toString()));

112
src/component/input/index.vue
View File

@ -29,7 +29,7 @@ export interface InputProps {
maxlength?: number; maxlength?: number;
max?: number; max?: number;
min?: number; min?: number;
qfw?:boolean; qfw?: boolean;
} }
const props = withDefaults(defineProps<InputProps>(), { const props = withDefaults(defineProps<InputProps>(), {
@ -63,6 +63,27 @@ 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).toFixed(2) + "";
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] + ""; //加上空格
}
}
return (noNegative ? "" : "-") + t.split("").reverse().join("") + "." + r;
}
watch( watch(
() => props.type, () => props.type,
() => { () => {
@ -73,6 +94,10 @@ watch(
watch( watch(
() => props.modelValue, () => props.modelValue,
() => { () => {
if(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
); );
@ -84,8 +109,8 @@ const onInput = function (event: Event) {
let value = inputElement.value; let value = inputElement.value;
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);
}; };
@ -96,15 +121,15 @@ 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);
}; };
const onChange = (event: Event) => { 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);
}; };
@ -113,33 +138,14 @@ const onBlur = (event: Event) => {
if (props.type === "number") { if (props.type === "number") {
onNumberBlur(event); onNumberBlur(event);
} }
if(props.qfw){ if (props.qfw) {
var formatMoney=function(s: string){
var noNegative = true;
s = parseFloat((s + "").replace(/[^\d\.-]/g, "")) + "";
if(parseFloat(s) < 0){
s = Math.abs(s).toFixed(2) + "";
noNegative = false;
}
var l = s.split(".")[0].split("").reverse(), try {
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]+""; //加上空格
}
}
return (noNegative?"":"-") + t.split("").reverse().join("") + "." + r;
}
try{
let reg = /\d{1,3}(?=(\d{3})+$)/g; let reg = /\d{1,3}(?=(\d{3})+$)/g;
// new String(props.modelValue).replace(reg, '$&,'); // new String(props.modelValue).replace(reg, '$&,');
console.log("添加，", formatMoney(props.modelValue.toString())) console.log("添加，", formatMoney(props.modelValue.toString()))
currentValue.value = formatMoney(props.modelValue.toString()); currentValue.value = formatMoney(props.modelValue.toString());
}catch{ } catch {
currentValue.value = "输入错误" currentValue.value = "输入错误"
} }
} }
@ -156,8 +162,8 @@ const onNumberBlur = (event: Event) => {
if (props.max && props.max < Number(value)) value = props.max.toString(); if (props.max && props.max < Number(value)) value = props.max.toString();
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, "")
} }
emit("update:modelValue", value); emit("update:modelValue", value);
}; };
@ -195,52 +201,22 @@ const showPassword = () => {
<div class="layui-input-wrapper"> <div class="layui-input-wrapper">
<span class="layui-input-prefix" v-if="slots.prefix || props.prefixIcon"> <span class="layui-input-prefix" v-if="slots.prefix || props.prefixIcon">
<slot name="prefix" v-if="slots.prefix"></slot> <slot name="prefix" v-if="slots.prefix"></slot>
<lay-icon <lay-icon v-else :type="props.prefixIcon" class="layui-input-prefix-icon"></lay-icon>
v-else
:type="props.prefixIcon"
class="layui-input-prefix-icon"
></lay-icon>
</span> </span>
<input <input :type="type" :name="name" :disabled="disabled" :placeholder="placeholder" :autofocus="autofocus"
:type="type" :autocomplete="autocomplete" :maxlength="maxlength" :max="max" :min="min" :readonly="readonly"
:name="name" :value="currentValue" @input="onInput" @change="onChange" @focus="onFocus" @blur="onBlur"
:disabled="disabled" @compositionstart="onCompositionstart" @compositionend="onCompositionend" />
:placeholder="placeholder" <span class="layui-input-password" @click="showPassword" v-if="password && hasContent">
:autofocus="autofocus"
:autocomplete="autocomplete"
:maxlength="maxlength"
:max="max"
:min="min"
:readonly="readonly"
:value="currentValue"
@input="onInput"
@change="onChange"
@focus="onFocus"
@blur="onBlur"
@compositionstart="onCompositionstart"
@compositionend="onCompositionend"
/>
<span
class="layui-input-password"
@click="showPassword"
v-if="password && hasContent"
>
<password-icon v-if="isPassword"></password-icon> <password-icon v-if="isPassword"></password-icon>
<un-password-icon v-else></un-password-icon> <un-password-icon v-else></un-password-icon>
</span> </span>
<span <span class="layui-input-clear" v-if="allowClear && hasContent && !disabled">
class="layui-input-clear"
v-if="allowClear && hasContent && !disabled"
>
<lay-icon type="layui-icon-close-fill" @click.stop="onClear"></lay-icon> <lay-icon type="layui-icon-close-fill" @click.stop="onClear"></lay-icon>
</span> </span>
<span class="layui-input-suffix" v-if="slots.suffix || props.suffixIcon"> <span class="layui-input-suffix" v-if="slots.suffix || props.suffixIcon">
<slot name="suffix" v-if="slots.suffix"></slot> <slot name="suffix" v-if="slots.suffix"></slot>
<lay-icon <lay-icon v-else :type="props.suffixIcon" class="layui-input-suffix-icon"></lay-icon>
v-else
:type="props.suffixIcon"
class="layui-input-suffix-icon"
></lay-icon>
</span> </span>
</div> </div>
<div class="layui-input-append" v-if="slots.append"> <div class="layui-input-append" v-if="slots.append">

78
umd/index.js
View File

File diff suppressed because one or more lines are too long