| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182 |
- import { useAttrs as m, ref as n, computed as f, watchEffect as i, openBlock as p, createElementBlock as y, createVNode as h, mergeProps as _, unref as b, withCtx as v, renderSlot as g } from "vue";
- import { l as x, an as S } from "./index2.js";
- const w = { class: "s-form" }, C = {
- __name: "SForm",
- props: {
- model: {
- type: Object,
- default() {
- return {};
- }
- },
- rules: {
- type: Object,
- default() {
- return {};
- }
- },
- layout: {
- type: String,
- default() {
- return "horizontal";
- }
- },
- column: {
- type: [Number, String],
- default() {
- return 1;
- }
- },
- labelWidth: {
- type: [Number, String],
- default() {
- return 80;
- }
- }
- },
- setup(r, { expose: u }) {
- const c = m(), e = r, a = n(), s = n(e.column >= 5 ? 4 : e.column), d = f(() => {
- const l = e.layout, t = (e == null ? void 0 : e.labelWidth) + "";
- return l === "horizontal" ? {
- style: {
- width: t.includes("px") ? t : t + "px"
- }
- } : {};
- });
- return i(() => {
- e.column > 4 && console.warn(`当前设置表单列column【${e.column}】最多显示为4列,已默认为最多4列`);
- }), u({ validate: () => new Promise((l, t) => {
- a.value.validate().then((o) => {
- l(o);
- }).catch((o) => {
- t(o);
- });
- }) }), (l, t) => {
- const o = S;
- return p(), y("div", w, [
- h(o, _({
- labelCol: d.value.labelCol,
- model: r.model,
- rules: r.rules,
- layout: r.layout
- }, b(c), {
- ref_key: "form",
- ref: a,
- style: {
- display: "grid",
- gridTemplateColumns: `repeat(${s.value}, 1fr)`,
- gap: "20px"
- }
- }), {
- default: v(() => [
- g(l.$slots, "default", {}, void 0, !0)
- ]),
- _: 3
- }, 16, ["labelCol", "model", "rules", "layout", "style"])
- ]);
- };
- }
- }, $ = /* @__PURE__ */ x(C, [["__scopeId", "data-v-cad3adca"]]);
- export {
- $ as default
- };
|