tdesign-mobile-vue
Version:
tdesign-mobile-vue
331 lines (327 loc) • 13 kB
JavaScript
/**
* tdesign v1.7.0
* (c) 2024 TDesign Group
* @license MIT
*/
import { _ as _slicedToArray } from '../_chunks/dep-cd74809c.mjs';
import { _ as _asyncToGenerator, r as regenerator } from '../_chunks/dep-80e4de18.mjs';
import { defineComponent, toRefs, ref, provide, reactive, createVNode } from 'vue';
import { i as isEmpty_1 } from '../_chunks/dep-40507aac.mjs';
import { i as isArray_1 } from '../_chunks/dep-019e292f.mjs';
import { i as isBoolean_1 } from '../_chunks/dep-ea9a17dc.mjs';
import { i as isFunction_1 } from '../_chunks/dep-91d696ea.mjs';
import props from './props.mjs';
import { FormInjectionKey } from './const.mjs';
import config from '../config.mjs';
import '../shared/index.mjs';
import { preventDefault } from '../shared/dom.mjs';
import { useTNodeJSX } from '../hooks/tnode.mjs';
import { usePrefixClass } from '../hooks/useClass.mjs';
import { renderContent } from '../shared/render.mjs';
import '../_chunks/dep-8d37dbf8.mjs';
import '../_chunks/dep-620d73f7.mjs';
import '../_chunks/dep-8bf3054e.mjs';
import '../_chunks/dep-2bce42ea.mjs';
import '../_chunks/dep-e57d46f3.mjs';
import '../_chunks/dep-3d249f65.mjs';
import '../_chunks/dep-9b2de386.mjs';
import '../_chunks/dep-4f44985d.mjs';
import '../_chunks/dep-6bc862af.mjs';
import '../_chunks/dep-b84be35c.mjs';
import '../_chunks/dep-08bc7a4c.mjs';
import '../_chunks/dep-e6c129ab.mjs';
import '../_chunks/dep-32364550.mjs';
import '../shared/functions.mjs';
import '../shared/util.mjs';
import '../_chunks/dep-52fdc8e1.mjs';
import '../shared/component.mjs';
import '../shared/constants.mjs';
import '../shared/render-tnode.mjs';
import '../shared/useToggle/index.mjs';
import '../shared/useCountDown/index.mjs';
import '@vueuse/core';
import '../shared/useCountDown/utils.mjs';
import '../shared/useDefault/index.mjs';
import '../_chunks/dep-60cadef8.mjs';
import '../_chunks/dep-8140c29b.mjs';
import '../_chunks/dep-0d52e58f.mjs';
import '../_chunks/dep-a836a38c.mjs';
import '../_chunks/dep-0ea7bbde.mjs';
import '../_chunks/dep-b437ef0b.mjs';
import '../shared/useChildSlots/index.mjs';
import '../_chunks/dep-f0f403be.mjs';
import '../shared/useVModel/index.mjs';
import '../_chunks/dep-6917b9bc.mjs';
import '../shared/useTouch/index.mjs';
import '../shared/useScrollParent/index.mjs';
import '../shared/useExpose/index.mjs';
import '../shared/useTest/index.mjs';
import '../_chunks/dep-219bb5a7.mjs';
import '../shared/useClickAway/index.mjs';
import '../shared/useGesture/index.mjs';
import '@use-gesture/vanilla';
import '../shared/hover.mjs';
import '../_chunks/dep-6303c50c.mjs';
import '../hooks/render-tnode.mjs';
import '../_chunks/dep-b9b8ead5.mjs';
import '../_chunks/dep-6c53a3e4.mjs';
import '../_chunks/dep-d2161895.mjs';
import '../_chunks/dep-89951f45.mjs';
import '../_chunks/dep-4931819d.mjs';
import '../_chunks/dep-10f4d030.mjs';
import '../_chunks/dep-8ee6f5cd.mjs';
import '../_chunks/dep-933f3a85.mjs';
import '../_chunks/dep-ac139980.mjs';
import '../_chunks/dep-154c1925.mjs';
import '../_chunks/dep-ba131d9c.mjs';
import '../_chunks/dep-007f294e.mjs';
import '../_common/js/global-config/mobile/default-config.mjs';
import '../_common/js/global-config/mobile/locale/zh_CN.mjs';
import '../_chunks/dep-161f0c44.mjs';
import '../_chunks/dep-5fd0eaa4.mjs';
import '../_chunks/dep-3c59bf72.mjs';
import '../config-provider/type.mjs';
var prefix = config.prefix;
var requestSubmit = function requestSubmit(target) {
if (!(target instanceof HTMLFormElement)) {
throw new Error("target must be HTMLFormElement");
}
var submitter = document.createElement("input");
submitter.type = "submit";
submitter.hidden = true;
target.appendChild(submitter);
submitter.click();
target.removeChild(submitter);
};
var _Form = defineComponent({
name: "".concat(prefix, "-form"),
props: props,
setup: function setup(props2, _ref) {
var expose = _ref.expose;
var renderTNodeJSX = useTNodeJSX();
var _toRefs = toRefs(props2),
disabled = _toRefs.disabled,
showErrorMessage = _toRefs.showErrorMessage,
labelWidth = _toRefs.labelWidth,
labelAlign = _toRefs.labelAlign,
contentAlign = _toRefs.contentAlign,
data = _toRefs.data,
colon = _toRefs.colon,
requiredMark = _toRefs.requiredMark,
rules = _toRefs.rules,
errorMessage = _toRefs.errorMessage,
resetType = _toRefs.resetType;
var formRef = ref();
var children = ref([]);
provide("formDisabled", {
disabled: disabled
});
provide(FormInjectionKey, reactive({
showErrorMessage: showErrorMessage,
labelWidth: labelWidth,
labelAlign: labelAlign,
contentAlign: contentAlign,
data: data,
colon: colon,
requiredMark: requiredMark,
rules: rules,
errorMessage: errorMessage,
resetType: resetType,
children: children,
renderContent: renderContent
}));
var formClass = usePrefixClass("form");
var needValidate = function needValidate(name, fields) {
if (!fields || !isArray_1(fields)) return true;
return fields.indexOf("".concat(name)) !== -1;
};
var formatValidateResult = function formatValidateResult(validateResultList) {
var result = validateResultList.reduce(function (r, err) {
return Object.assign(r || {}, err);
}, {});
Object.keys(result).forEach(function (key) {
if (result[key] === true) {
delete result[key];
}
});
return isEmpty_1(result) ? true : result;
};
var validate = /*#__PURE__*/function () {
var _ref2 = _asyncToGenerator(/*#__PURE__*/regenerator.mark(function _callee(param) {
var _props2$onValidate;
var _ref3, fields, _ref3$trigger, trigger, showErrorMessage2, list, arr, result;
return regenerator.wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
_ref3 = param || {}, fields = _ref3.fields, _ref3$trigger = _ref3.trigger, trigger = _ref3$trigger === void 0 ? "all" : _ref3$trigger, showErrorMessage2 = _ref3.showErrorMessage;
list = children.value.filter(function (child) {
return isFunction_1(child.validate) && needValidate(String(child.name), fields);
}).map(function (child) {
return child.validate(trigger, showErrorMessage2);
});
_context.next = 4;
return Promise.all(list);
case 4:
arr = _context.sent;
result = formatValidateResult(arr);
(_props2$onValidate = props2.onValidate) === null || _props2$onValidate === void 0 || _props2$onValidate.call(props2, {
validateResult: result
});
return _context.abrupt("return", result);
case 8:
case "end":
return _context.stop();
}
}, _callee);
}));
return function validate(_x) {
return _ref2.apply(this, arguments);
};
}();
var getFirstError = function getFirstError(result) {
var _result$Object$keys$, _Object$keys3;
if (isBoolean_1(result)) return "";
var _Object$keys = Object.keys(result),
_Object$keys2 = _slicedToArray(_Object$keys, 1),
firstKey = _Object$keys2[0];
if (props2.scrollToFirstError) {
var tmpClassName = "".concat(formClass.value, "-item__").concat(firstKey);
scrollTo(tmpClassName);
}
var resArr = result[firstKey];
if (!isArray_1(resArr)) return "";
return (result === null || result === void 0 || (_result$Object$keys$ = result[(_Object$keys3 = Object.keys(result)) === null || _Object$keys3 === void 0 ? void 0 : _Object$keys3[0]]) === null || _result$Object$keys$ === void 0 || (_result$Object$keys$ = _result$Object$keys$[0]) === null || _result$Object$keys$ === void 0 ? void 0 : _result$Object$keys$.message) || "";
};
var scrollTo = function scrollTo(selector) {
var _formRef$value$getEle = formRef.value.getElementsByClassName(selector),
_formRef$value$getEle2 = _slicedToArray(_formRef$value$getEle, 1),
dom = _formRef$value$getEle2[0];
var behavior = props2.scrollToFirstError;
if (behavior) {
dom && dom.scrollIntoView({
behavior: behavior
});
}
};
var validateOnly = /*#__PURE__*/function () {
var _ref4 = _asyncToGenerator(/*#__PURE__*/regenerator.mark(function _callee2(params) {
var _ref5, fields, _ref5$trigger, trigger, list, arr;
return regenerator.wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
_ref5 = params || {}, fields = _ref5.fields, _ref5$trigger = _ref5.trigger, trigger = _ref5$trigger === void 0 ? "all" : _ref5$trigger;
list = children.value.filter(function (child) {
return isFunction_1(child.validateOnly) && needValidate(String(child.name), fields);
}).map(function (child) {
return child.validateOnly(trigger);
});
_context2.next = 4;
return Promise.all(list);
case 4:
arr = _context2.sent;
return _context2.abrupt("return", formatValidateResult(arr));
case 6:
case "end":
return _context2.stop();
}
}, _callee2);
}));
return function validateOnly(_x2) {
return _ref4.apply(this, arguments);
};
}();
var submitParams = ref();
var _onSubmit = function onSubmit(e) {
if (props2.preventSubmitDefault && e) {
preventDefault(e, true);
}
validate(submitParams.value).then(function (r) {
var _props2$onSubmit;
var firstError = getFirstError(r);
(_props2$onSubmit = props2.onSubmit) === null || _props2$onSubmit === void 0 || _props2$onSubmit.call(props2, {
validateResult: r,
firstError: firstError
});
});
submitParams.value = void 0;
};
var submit = /*#__PURE__*/function () {
var _ref6 = _asyncToGenerator(/*#__PURE__*/regenerator.mark(function _callee3(params) {
return regenerator.wrap(function _callee3$(_context3) {
while (1) switch (_context3.prev = _context3.next) {
case 0:
submitParams.value = params;
requestSubmit(formRef.value);
case 2:
case "end":
return _context3.stop();
}
}, _callee3);
}));
return function submit(_x3) {
return _ref6.apply(this, arguments);
};
}();
var resetParams = ref();
var _onReset = function onReset(e) {
var _props2$onReset;
if (props2.preventSubmitDefault && e) {
preventDefault(e, true);
}
children.value.filter(function (child) {
var _resetParams$value;
return isFunction_1(child.resetField) && needValidate(String(child.name), (_resetParams$value = resetParams.value) === null || _resetParams$value === void 0 ? void 0 : _resetParams$value.fields);
}).forEach(function (child) {
var _resetParams$value2;
return child.resetField((_resetParams$value2 = resetParams.value) === null || _resetParams$value2 === void 0 ? void 0 : _resetParams$value2.type);
});
resetParams.value = void 0;
(_props2$onReset = props2.onReset) === null || _props2$onReset === void 0 || _props2$onReset.call(props2, {
e: e
});
};
var reset = function reset(params) {
resetParams.value = params;
formRef.value.reset();
};
var clearValidate = function clearValidate(fields) {
children.value.forEach(function (child) {
if (isFunction_1(child.resetHandler) && needValidate(String(child.name), fields)) {
child.resetHandler();
}
});
};
var setValidateMessage = function setValidateMessage(validateMessage) {
var keys = Object.keys(validateMessage);
if (!keys.length) return;
var list = children.value.filter(function (child) {
return isFunction_1(child.setValidateMessage) && keys.includes("".concat(child.name));
}).map(function (child) {
return child.setValidateMessage(validateMessage["".concat(child.name)]);
});
Promise.all(list);
};
expose({
validate: validate,
submit: submit,
reset: reset,
clearValidate: clearValidate,
setValidateMessage: setValidateMessage,
validateOnly: validateOnly
});
return function () {
return createVNode("form", {
"ref": formRef,
"class": formClass.value,
"onSubmit": function onSubmit(e) {
return _onSubmit(e);
},
"onReset": function onReset(e) {
return _onReset(e);
}
}, [renderTNodeJSX("default")]);
};
}
});
export { _Form as default, requestSubmit };
//# sourceMappingURL=form.mjs.map