@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
110 lines (109 loc) • 3.7 kB
JavaScript
import { defineComponent as E, useSlots as N, inject as u, toRef as O, ref as y, computed as c, createBlock as x, openBlock as h, unref as o, mergeProps as F, createSlots as w, withCtx as m, renderSlot as d, createElementBlock as z, createCommentVNode as R, createTextVNode as $, toDisplayString as L, withModifiers as M } from "vue";
import "../button/index.mjs";
import { FIELD_OPTIONS as A, FORM_PROPS as D, FORM_ACTIONS as V } from "./symbol.mjs";
import { useProps as j, createIconProp as v, useNameHelper as H, useLocale as q, emitEvent as S } from "@vexip-ui/config";
import { useSetTimeout as G } from "@vexip-ui/hooks";
import { isPromise as J } from "@vexip-ui/utils";
import { formSubmitProps as K } from "./props.mjs";
import Q from "../button/button.mjs";
const ne = /* @__PURE__ */ E({
name: "FormSubmit",
__name: "form-submit",
props: K,
setup(k, { expose: P }) {
const e = j("form-submit", k, {
size: null,
locale: null,
type: "primary",
label: null,
dashed: null,
text: null,
simple: null,
ghost: null,
disabled: null,
circle: null,
loadingIcon: v(),
loadingEffect: null,
icon: v(),
color: null,
buttonType: null,
block: null,
onBeforeSubmit: {
default: null,
isFunc: !0
}
}), f = N(), p = u(A, null), b = u(D, {}), s = u(V, null), B = H("form"), I = q("form", O(e, "locale")), { timer: T } = G(), i = y(!1), r = y(), a = c(() => b.method && b.action), _ = c(() => !!s || e.inherit), g = c(() => i.value || (p ? p.loading.value : !1));
P({ submit: r, isNative: a, isLoading: g });
async function C() {
var l;
if (e.disabled || i.value || !s) return;
i.value = !0;
const t = await s.validate();
if (t.length)
S(e.onError, t);
else {
let n = !0;
typeof e.onBeforeSubmit == "function" && (n = e.onBeforeSubmit(), J(n) && (n = await n)), n !== !1 && (S(e.onSubmit), a.value && ((l = r.value) == null || l.click()));
}
T.loading = setTimeout(() => {
i.value = !1;
}, 300);
}
return (t, l) => (h(), x(o(Q), F(t.$attrs, {
inherit: _.value,
class: o(B).be("submit"),
size: o(e).size,
type: o(e).type,
simple: o(e).simple,
ghost: o(e).ghost,
dashed: o(e).dashed,
text: o(e).text,
disabled: o(e).disabled,
loading: g.value,
circle: o(e).circle,
"loading-icon": o(e).loadingIcon,
"loading-effect": o(e).loadingEffect,
icon: o(e).icon,
color: o(e).color,
"button-type": o(e).buttonType,
block: o(e).block,
tag: o(e).tag,
onClick: C
}), w({
default: m(() => [
d(t.$slots, "default", {}, () => [
$(L(o(e).label || o(I).submit), 1)
]),
a.value ? (h(), z("button", {
key: 0,
ref_key: "submit",
ref: r,
type: "submit",
style: { display: "none" },
onClick: l[0] || (l[0] = M(() => {
}, ["stop"]))
}, null, 512)) : R("", !0)
]),
_: 2
}, [
f.icon ? {
name: "icon",
fn: m(() => [
d(t.$slots, "icon")
]),
key: "0"
} : void 0,
f.loading ? {
name: "loading",
fn: m(() => [
d(t.$slots, "loading")
]),
key: "1"
} : void 0
]), 1040, ["inherit", "class", "size", "type", "simple", "ghost", "dashed", "text", "disabled", "loading", "circle", "loading-icon", "loading-effect", "icon", "color", "button-type", "block", "tag"]));
}
});
export {
ne as default
};
//# sourceMappingURL=form-submit.vue2.mjs.map