✨(component): update
This commit is contained in:
parent
e05781963d
commit
716af194bd
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@layui/layui-vue",
|
"name": "@layui/layui-vue",
|
||||||
"version": "1.4.0",
|
"version": "1.4.0-alpha.1",
|
||||||
"author": "就眠儀式",
|
"author": "就眠儀式",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"description": "a component library for Vue 3 base on layui-vue",
|
"description": "a component library for Vue 3 base on layui-vue",
|
||||||
|
@ -60,7 +60,6 @@ const ruleItems = computed(() => {
|
|||||||
if (!prop) {
|
if (!prop) {
|
||||||
return {};
|
return {};
|
||||||
}
|
}
|
||||||
|
|
||||||
let rulesArrs: RuleItem[] = [];
|
let rulesArrs: RuleItem[] = [];
|
||||||
if (isRequired.value) {
|
if (isRequired.value) {
|
||||||
rulesArrs.push({ required: true });
|
rulesArrs.push({ required: true });
|
||||||
@ -78,6 +77,7 @@ const ruleItems = computed(() => {
|
|||||||
const filedValue = computed(() =>
|
const filedValue = computed(() =>
|
||||||
props.prop ? layForm.model[props.prop] : undefined
|
props.prop ? layForm.model[props.prop] : undefined
|
||||||
);
|
);
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => filedValue.value,
|
() => filedValue.value,
|
||||||
(val) => validate(),
|
(val) => validate(),
|
||||||
@ -92,29 +92,22 @@ const validate = (callback?: ValidateCallback) => {
|
|||||||
if (props.prop && (ruleItems.value as RuleItem[]).length > 0) {
|
if (props.prop && (ruleItems.value as RuleItem[]).length > 0) {
|
||||||
// 校验规则
|
// 校验规则
|
||||||
const descriptor: Rules = {};
|
const descriptor: Rules = {};
|
||||||
descriptor[layForm.useCN ? props.label || props.prop : props.prop] =
|
descriptor[layForm.useCN ? props.label || props.prop : props.prop] = ruleItems.value;
|
||||||
ruleItems.value;
|
|
||||||
const validator = new Schema(descriptor);
|
const validator = new Schema(descriptor);
|
||||||
|
|
||||||
let model: { [key: string]: any } = {};
|
let model: { [key: string]: any } = {};
|
||||||
let validateMessage = null;
|
let validateMessage = null;
|
||||||
// 使用中文错误提示
|
// 使用中文错误提示
|
||||||
if (layForm.useCN) {
|
if (layForm.useCN) {
|
||||||
validateMessage = Object.assign(
|
validateMessage = Object.assign({},cnValidateMessage,layForm.validateMessage
|
||||||
{},
|
|
||||||
cnValidateMessage,
|
|
||||||
layForm.validateMessage
|
|
||||||
);
|
);
|
||||||
model[props.label || props.prop] = filedValue.value;
|
model[props.label || props.prop] = filedValue.value;
|
||||||
} else {
|
} else {
|
||||||
layForm.validateMessage && (validateMessage = layForm.validateMessage);
|
layForm.validateMessage && (validateMessage = layForm.validateMessage);
|
||||||
model[props.prop] = filedValue.value;
|
model[props.prop] = filedValue.value;
|
||||||
}
|
}
|
||||||
// 自定义校验消息
|
// @ts-ignore 自定义消息验证
|
||||||
layForm.requiredErrorMessage &&
|
layForm.requiredErrorMessage && (validateMessage = Object.assign(validateMessage, { required: layForm.requiredErrorMessage}));
|
||||||
(validateMessage = Object.assign(validateMessage, {
|
|
||||||
required: layForm.requiredErrorMessage,
|
|
||||||
}));
|
|
||||||
validateMessage && validator.messages(validateMessage);
|
validateMessage && validator.messages(validateMessage);
|
||||||
|
|
||||||
// 开始校验
|
// 开始校验
|
||||||
@ -123,15 +116,14 @@ const validate = (callback?: ValidateCallback) => {
|
|||||||
const slotParentDiv = slotParent.value as HTMLDivElement;
|
const slotParentDiv = slotParent.value as HTMLDivElement;
|
||||||
if (errorStatus.value) {
|
if (errorStatus.value) {
|
||||||
const _errors = errors as FieldValidateError[];
|
const _errors = errors as FieldValidateError[];
|
||||||
// 如果是中文,将错误信息转换成FieldValidateError类型
|
// 如果是中文,将错误信息转换成 FieldValidateError 类型
|
||||||
layForm.useCN &&
|
layForm.useCN &&
|
||||||
_errors.forEach((error) => {
|
_errors.forEach((error) => {
|
||||||
error.label = props.label;
|
error.label = props.label;
|
||||||
error.field = props.prop;
|
error.field = props.prop;
|
||||||
});
|
});
|
||||||
errorMsg.value = props.errorMessage ?? _errors[0].message;
|
errorMsg.value = props.errorMessage ?? _errors[0].message;
|
||||||
slotParentDiv.childElementCount > 0 &&
|
slotParentDiv.childElementCount > 0 && slotParentDiv.firstElementChild?.classList.add("layui-form-danger");
|
||||||
slotParentDiv.firstElementChild?.classList.add("layui-form-danger");
|
|
||||||
callback && callback(_errors, fields);
|
callback && callback(_errors, fields);
|
||||||
} else {
|
} else {
|
||||||
clearValidate();
|
clearValidate();
|
||||||
@ -168,10 +160,7 @@ onMounted(() => {
|
|||||||
const getMarginLeft = computed(() => {
|
const getMarginLeft = computed(() => {
|
||||||
if (props.mode == "block") {
|
if (props.mode == "block") {
|
||||||
if (props.labelPosition != "top") {
|
if (props.labelPosition != "top") {
|
||||||
let labelWidth =
|
let labelWidth = typeof props.labelWidth === "string" ? parseFloat(props.labelWidth) : props.labelWidth;
|
||||||
typeof props.labelWidth === "string"
|
|
||||||
? parseFloat(props.labelWidth)
|
|
||||||
: props.labelWidth;
|
|
||||||
labelWidth += 15;
|
labelWidth += 15;
|
||||||
return {
|
return {
|
||||||
"margin-left": `${labelWidth}px`,
|
"margin-left": `${labelWidth}px`,
|
||||||
|
@ -402,7 +402,6 @@ let scrollWidthCell = ref(0);
|
|||||||
const getScrollWidth = () => {
|
const getScrollWidth = () => {
|
||||||
const clientWidth: number = tableBody.value?.clientWidth || 0;
|
const clientWidth: number = tableBody.value?.clientWidth || 0;
|
||||||
const offsetWidth: number = tableBody.value?.offsetWidth || 0;
|
const offsetWidth: number = tableBody.value?.offsetWidth || 0;
|
||||||
|
|
||||||
if (clientWidth < offsetWidth) {
|
if (clientWidth < offsetWidth) {
|
||||||
scrollWidthCell.value = offsetWidth - clientWidth;
|
scrollWidthCell.value = offsetWidth - clientWidth;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user