110 lines
5.7 KiB
JavaScript
110 lines
5.7 KiB
JavaScript
|
import { w as withInstall } from "../badge/index2.js";
|
||
|
import { defineComponent, onMounted, provide, reactive, toRefs, openBlock, createElementBlock, renderSlot } from "vue";
|
||
|
var index = /* @__PURE__ */ (() => '.layui-form-item{margin-bottom:20px;clear:both}.layui-form-item-right .layui-form-label{text-align:right}.layui-form-item-left .layui-form-label{text-align:left}.layui-form-item-top .layui-form-label{text-align:left;float:none}.layui-form-item-top>div{margin-left:0}.layui-form-item:after{content:" ";clear:both;display:block;height:0}.layui-form-label{float:left;display:block;width:95px;padding-right:15px;line-height:38px;font-weight:400}.layui-form-label-col{display:block;float:none;padding:9px 0;line-height:20px;text-align:left}.layui-form-item .layui-inline{margin-bottom:5px;margin-right:10px}.layui-input-block{margin-left:110px;min-height:36px}.layui-input-inline{display:inline-block;vertical-align:middle}.layui-form-item .layui-input-inline{float:left;width:190px;margin-right:10px}.layui-form-text .layui-input-inline{width:auto}.layui-form-mid{float:left;display:block;padding:9px 0!important;line-height:20px;margin-right:10px}.layui-form-danger+.layui-form-select .layui-input,.layui-form-danger:focus{border-color:#ff5722!important}.layui-form-item .layui-form-checkbox{margin-top:4px}.layui-form-item .layui-form-checkbox[lay-skin=primary]{margin-top:10px}.layui-required{color:#ff5722;font-size:12px;line-height:1}.layui-form .layui-form-item .layui-input-block .layui-form-danger,.layui-form .layui-form-item .layui-input-inline .layui-form-danger,.layui-form .layui-form-item .layui-input-block .layui-form-danger .layui-textarea,.layui-form .layui-form-item .layui-input-inline .layui-form-danger .layui-textarea,.layui-form .layui-form-item .layui-input-block .layui-form-danger .layui-tag-input,.layui-form .layui-form-item .layui-input-inline .layui-form-danger .layui-tag-input,.layui-form .layui-form-item .layui-input-block .layui-form-danger .layui-input,.layui-form .layui-form-item .layui-input-inline .layui-form-danger .layui-input{border-color:#ff5722!important}.layui-error-message{color:#ff5722;font-size:12px;line-height:1;padding-top:5px;position:absolute;top:100%;left:0}.layui-error-message-anim{-ms-transform-origin:0 0;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-animation:layui-top-show-anim .3s ease 1;animation:layui-top-show-anim .3s ease 1}@keyframes layui-top-show-anim{0%{opacity:.3;transform:rotateX(45deg)}to{opacity:1;transform:rotateX(0)}}\n')();
|
||
|
const __default__ = {
|
||
|
name: "LayForm"
|
||
|
};
|
||
|
const _sfc_main = defineComponent({
|
||
|
...__default__,
|
||
|
props: {
|
||
|
model: { default: function() {
|
||
|
return {};
|
||
|
} },
|
||
|
required: { type: Boolean },
|
||
|
rules: null,
|
||
|
initValidate: { type: Boolean, default: false },
|
||
|
requiredIcons: { default: "" },
|
||
|
requiredErrorMessage: null,
|
||
|
validateMessage: null,
|
||
|
useCN: { type: Boolean, default: true }
|
||
|
},
|
||
|
emits: ["submit"],
|
||
|
setup(__props, { expose, emit }) {
|
||
|
const props = __props;
|
||
|
const formItems = [];
|
||
|
const formItemMap = {};
|
||
|
onMounted(() => {
|
||
|
var _a;
|
||
|
props.initValidate && ((_a = validate()) == null ? void 0 : _a.catch((err) => {
|
||
|
}));
|
||
|
});
|
||
|
const submit = function() {
|
||
|
let _isValidate = false;
|
||
|
validate((isValidate, model, errors) => {
|
||
|
_isValidate = isValidate;
|
||
|
emit("submit", isValidate, model, errors);
|
||
|
});
|
||
|
return _isValidate;
|
||
|
};
|
||
|
const validate = function(fields, callback) {
|
||
|
let validateItems = formItems;
|
||
|
if (typeof fields === "function") {
|
||
|
callback = fields;
|
||
|
} else if (typeof fields === "string" || Array.isArray(fields) && fields.length > 0) {
|
||
|
validateItems = [];
|
||
|
const validateFields = !fields ? [] : [].concat(fields);
|
||
|
validateFields.forEach((field) => formItemMap[field] && validateItems.push(formItemMap[field]));
|
||
|
}
|
||
|
let errorsArrs = [];
|
||
|
validateItems.forEach((filed) => {
|
||
|
filed.validate((errors, _fields) => {
|
||
|
errorsArrs = errorsArrs.concat(errors);
|
||
|
});
|
||
|
});
|
||
|
const isValidate = errorsArrs.length === 0;
|
||
|
if (typeof callback === "function") {
|
||
|
isValidate ? callback(true, props.model, null) : callback(false, props.model, errorsArrs);
|
||
|
return null;
|
||
|
}
|
||
|
return new Promise((resolve, reject) => {
|
||
|
const callbackParams = {
|
||
|
isValidate,
|
||
|
model: props.model,
|
||
|
errors: isValidate ? null : errorsArrs
|
||
|
};
|
||
|
callbackParams.isValidate ? resolve(callbackParams) : reject(callbackParams);
|
||
|
});
|
||
|
};
|
||
|
const clearValidate = function(fields) {
|
||
|
const clearFields = !fields ? [] : [].concat(fields);
|
||
|
if (clearFields.length === 0) {
|
||
|
formItems.forEach((filed) => filed.clearValidate());
|
||
|
} else {
|
||
|
clearFields.forEach((field) => formItemMap[field] && formItemMap[field].clearValidate());
|
||
|
}
|
||
|
};
|
||
|
const reset = function() {
|
||
|
for (const key in props.model) {
|
||
|
props.model[key] = null;
|
||
|
}
|
||
|
setTimeout(() => {
|
||
|
var _a;
|
||
|
return (_a = validate()) == null ? void 0 : _a.catch((err) => {
|
||
|
});
|
||
|
}, 0);
|
||
|
};
|
||
|
const addField = function(item) {
|
||
|
formItems.push(item);
|
||
|
formItemMap[item.prop] = item;
|
||
|
};
|
||
|
expose({ validate, clearValidate, reset });
|
||
|
provide("LayForm", reactive({
|
||
|
formItems,
|
||
|
addField,
|
||
|
clearValidate,
|
||
|
validate,
|
||
|
...toRefs(props)
|
||
|
}));
|
||
|
return (_ctx, _cache) => {
|
||
|
return openBlock(), createElementBlock("form", {
|
||
|
class: "layui-form",
|
||
|
onsubmit: submit
|
||
|
}, [
|
||
|
renderSlot(_ctx.$slots, "default")
|
||
|
]);
|
||
|
};
|
||
|
}
|
||
|
});
|
||
|
const component = withInstall(_sfc_main);
|
||
|
export { component as default };
|