Merge branch 'main' of https://github.com/cool-team-official/cool-unix
This commit is contained in:
@@ -59,6 +59,18 @@
|
|||||||
</cl-input>
|
</cl-input>
|
||||||
</demo-item>
|
</demo-item>
|
||||||
|
|
||||||
|
<demo-item :label="t('保留精度')">
|
||||||
|
<demo-tips>当 type 为 digit 时,可设置 precision 属性来保留精度</demo-tips>
|
||||||
|
|
||||||
|
<cl-input type="digit" :precision="precision"></cl-input>
|
||||||
|
|
||||||
|
<cl-list border :pt="{ className: 'mt-5' }">
|
||||||
|
<cl-list-item :label="t('精度')">
|
||||||
|
<cl-input-number v-model="precision"></cl-input-number>
|
||||||
|
</cl-list-item>
|
||||||
|
</cl-list>
|
||||||
|
</demo-item>
|
||||||
|
|
||||||
<demo-item :label="t('自定义')">
|
<demo-item :label="t('自定义')">
|
||||||
<cl-input
|
<cl-input
|
||||||
v-model="content"
|
v-model="content"
|
||||||
@@ -128,6 +140,8 @@ const isRightIcon = ref(false);
|
|||||||
const isDisabled = ref(false);
|
const isDisabled = ref(false);
|
||||||
const isColor = ref(false);
|
const isColor = ref(false);
|
||||||
|
|
||||||
|
const precision = ref<number>(2);
|
||||||
|
|
||||||
function toAlert() {
|
function toAlert() {
|
||||||
ui.showToast({
|
ui.showToast({
|
||||||
message: "Hello"
|
message: "Hello"
|
||||||
|
|||||||
@@ -7,6 +7,9 @@
|
|||||||
},
|
},
|
||||||
pt.className
|
pt.className
|
||||||
]"
|
]"
|
||||||
|
:style="{
|
||||||
|
height: parseRpx(size!)
|
||||||
|
}"
|
||||||
>
|
>
|
||||||
<view
|
<view
|
||||||
class="cl-input-number__minus"
|
class="cl-input-number__minus"
|
||||||
|
|||||||
@@ -8,7 +8,7 @@
|
|||||||
'cl-input--border': border,
|
'cl-input--border': border,
|
||||||
'cl-input--focus': isFocus,
|
'cl-input--focus': isFocus,
|
||||||
'cl-input--disabled': isDisabled,
|
'cl-input--disabled': isDisabled,
|
||||||
'cl-input--error': isError
|
'cl-input--error': isError,
|
||||||
}
|
}
|
||||||
]"
|
]"
|
||||||
@tap="onTap"
|
@tap="onTap"
|
||||||
@@ -23,12 +23,14 @@
|
|||||||
></cl-icon>
|
></cl-icon>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- @vue-ignore -->
|
||||||
<input
|
<input
|
||||||
class="cl-input__inner"
|
class="cl-input__inner"
|
||||||
:class="[
|
:class="[
|
||||||
{
|
{
|
||||||
'is-disabled': isDisabled,
|
'is-disabled': isDisabled,
|
||||||
'is-dark': isDark
|
'is-dark': isDark,
|
||||||
|
'is-exceed': isExceed
|
||||||
},
|
},
|
||||||
ptClassName
|
ptClassName
|
||||||
]"
|
]"
|
||||||
@@ -189,6 +191,11 @@ const props = defineProps({
|
|||||||
holdKeyboard: {
|
holdKeyboard: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
// 保留精度
|
||||||
|
precision: {
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -256,6 +263,17 @@ const showClear = computed(() => {
|
|||||||
// 是否显示密码
|
// 是否显示密码
|
||||||
const isPassword = ref(props.password);
|
const isPassword = ref(props.password);
|
||||||
|
|
||||||
|
// 是否超出限制
|
||||||
|
const isExceed = computed(() => {
|
||||||
|
// 检查数字精度是否超出限制
|
||||||
|
if (props.type == "digit" && props.precision >= 0 && value.value != "") {
|
||||||
|
const parts = value.value.split(".");
|
||||||
|
return parts.length > 1 && parts[1].length > props.precision;
|
||||||
|
} else {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// 切换密码显示状态
|
// 切换密码显示状态
|
||||||
function showPassword() {
|
function showPassword() {
|
||||||
isPassword.value = !isPassword.value;
|
isPassword.value = !isPassword.value;
|
||||||
@@ -271,6 +289,17 @@ function onFocus(e: UniInputFocusEvent) {
|
|||||||
function onBlur(e: UniInputBlurEvent) {
|
function onBlur(e: UniInputBlurEvent) {
|
||||||
emit("blur", e);
|
emit("blur", e);
|
||||||
|
|
||||||
|
// 处理数字精度
|
||||||
|
if (props.type == "digit" && props.precision > 0 && value.value != "") {
|
||||||
|
const numValue = parseFloat(value.value);
|
||||||
|
if (!isNaN(numValue)) {
|
||||||
|
const formattedValue = numValue.toFixed(props.precision);
|
||||||
|
value.value = formattedValue;
|
||||||
|
emit("update:modelValue", formattedValue);
|
||||||
|
emit("change", formattedValue);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
isFocus.value = false;
|
isFocus.value = false;
|
||||||
}, 0);
|
}, 0);
|
||||||
@@ -367,6 +396,14 @@ defineExpose({
|
|||||||
&.is-dark {
|
&.is-dark {
|
||||||
@apply text-white;
|
@apply text-white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.is-exceed {
|
||||||
|
@apply text-red-500;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.is-exceed.is-dark {
|
||||||
|
@apply text-red-400;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&__icon {
|
&__icon {
|
||||||
|
|||||||
@@ -29,4 +29,5 @@ export type ClInputProps = {
|
|||||||
adjustPosition?: boolean;
|
adjustPosition?: boolean;
|
||||||
maxlength?: number;
|
maxlength?: number;
|
||||||
holdKeyboard?: boolean;
|
holdKeyboard?: boolean;
|
||||||
|
precision?: number;
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user