@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, openBlock as h, createBlock as x, unref as o, mergeProps as F, createSlots as w, withCtx as m, renderSlot as d, createTextVNode as z, toDisplayString as R, createElementBlock as $, withModifiers as L, createCommentVNode 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", {}, () => [
z(R(o(e).label || o(I).submit), 1)
]),
a.value ? (h(), $("button", {
key: 0,
ref_key: "submit",
ref: r,
type: "submit",
style: { display: "none" },
onClick: l[0] || (l[0] = L(() => {
}, ["stop"]))
}, null, 512)) : M("", !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