form2.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var constants = require('./constants.js');
  5. var form = require('./form.js');
  6. var utils = require('./utils.js');
  7. var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
  8. var useFormCommonProps = require('./hooks/use-form-common-props.js');
  9. var index = require('../../../hooks/use-namespace/index.js');
  10. var error = require('../../../utils/error.js');
  11. var shared = require('@vue/shared');
  12. const COMPONENT_NAME = "ElForm";
  13. const __default__ = vue.defineComponent({
  14. name: COMPONENT_NAME
  15. });
  16. const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  17. ...__default__,
  18. props: form.formProps,
  19. emits: form.formEmits,
  20. setup(__props, { expose, emit }) {
  21. const props = __props;
  22. const fields = vue.reactive([]);
  23. const formSize = useFormCommonProps.useFormSize();
  24. const ns = index.useNamespace("form");
  25. const formClasses = vue.computed(() => {
  26. const { labelPosition, inline } = props;
  27. return [
  28. ns.b(),
  29. ns.m(formSize.value || "default"),
  30. {
  31. [ns.m(`label-${labelPosition}`)]: labelPosition,
  32. [ns.m("inline")]: inline
  33. }
  34. ];
  35. });
  36. const getField = (prop) => {
  37. return fields.find((field) => field.prop === prop);
  38. };
  39. const addField = (field) => {
  40. fields.push(field);
  41. };
  42. const removeField = (field) => {
  43. if (field.prop) {
  44. fields.splice(fields.indexOf(field), 1);
  45. }
  46. };
  47. const resetFields = (properties = []) => {
  48. if (!props.model) {
  49. error.debugWarn(COMPONENT_NAME, "model is required for resetFields to work.");
  50. return;
  51. }
  52. utils.filterFields(fields, properties).forEach((field) => field.resetField());
  53. };
  54. const clearValidate = (props2 = []) => {
  55. utils.filterFields(fields, props2).forEach((field) => field.clearValidate());
  56. };
  57. const isValidatable = vue.computed(() => {
  58. const hasModel = !!props.model;
  59. if (!hasModel) {
  60. error.debugWarn(COMPONENT_NAME, "model is required for validate to work.");
  61. }
  62. return hasModel;
  63. });
  64. const obtainValidateFields = (props2) => {
  65. if (fields.length === 0)
  66. return [];
  67. const filteredFields = utils.filterFields(fields, props2);
  68. if (!filteredFields.length) {
  69. error.debugWarn(COMPONENT_NAME, "please pass correct props!");
  70. return [];
  71. }
  72. return filteredFields;
  73. };
  74. const validate = async (callback) => validateField(void 0, callback);
  75. const doValidateField = async (props2 = []) => {
  76. if (!isValidatable.value)
  77. return false;
  78. const fields2 = obtainValidateFields(props2);
  79. if (fields2.length === 0)
  80. return true;
  81. let validationErrors = {};
  82. for (const field of fields2) {
  83. try {
  84. await field.validate("");
  85. if (field.validateState === "error")
  86. field.resetField();
  87. } catch (fields3) {
  88. validationErrors = {
  89. ...validationErrors,
  90. ...fields3
  91. };
  92. }
  93. }
  94. if (Object.keys(validationErrors).length === 0)
  95. return true;
  96. return Promise.reject(validationErrors);
  97. };
  98. const validateField = async (modelProps = [], callback) => {
  99. const shouldThrow = !shared.isFunction(callback);
  100. try {
  101. const result = await doValidateField(modelProps);
  102. if (result === true) {
  103. await (callback == null ? void 0 : callback(result));
  104. }
  105. return result;
  106. } catch (e) {
  107. if (e instanceof Error)
  108. throw e;
  109. const invalidFields = e;
  110. if (props.scrollToError) {
  111. scrollToField(Object.keys(invalidFields)[0]);
  112. }
  113. await (callback == null ? void 0 : callback(false, invalidFields));
  114. return shouldThrow && Promise.reject(invalidFields);
  115. }
  116. };
  117. const scrollToField = (prop) => {
  118. var _a;
  119. const field = utils.filterFields(fields, prop)[0];
  120. if (field) {
  121. (_a = field.$el) == null ? void 0 : _a.scrollIntoView(props.scrollIntoViewOptions);
  122. }
  123. };
  124. vue.watch(() => props.rules, () => {
  125. if (props.validateOnRuleChange) {
  126. validate().catch((err) => error.debugWarn(err));
  127. }
  128. }, { deep: true, flush: "post" });
  129. vue.provide(constants.formContextKey, vue.reactive({
  130. ...vue.toRefs(props),
  131. emit,
  132. resetFields,
  133. clearValidate,
  134. validateField,
  135. getField,
  136. addField,
  137. removeField,
  138. ...utils.useFormLabelWidth()
  139. }));
  140. expose({
  141. validate,
  142. validateField,
  143. resetFields,
  144. clearValidate,
  145. scrollToField,
  146. fields
  147. });
  148. return (_ctx, _cache) => {
  149. return vue.openBlock(), vue.createElementBlock("form", {
  150. class: vue.normalizeClass(vue.unref(formClasses))
  151. }, [
  152. vue.renderSlot(_ctx.$slots, "default")
  153. ], 2);
  154. };
  155. }
  156. });
  157. var Form = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "form.vue"]]);
  158. exports["default"] = Form;
  159. //# sourceMappingURL=form2.js.map