@wetspace/pro-components/dist/pro-form/src/steps-form/index.mjs

::: tip 基本介绍

import { defineComponent as p, shallowRef as h, ref as F, computed as E, provide as S, createVNode as o, mergeProps as w, Fragment as g, createTextVNode as r, isVNode as x } from "vue";
import { useNamespace as C, ElSteps as B, ElButton as l } from "element-plus";
import { SymbolState as I } from "./symbol.mjs";
import { wetSetpsFormProps as N } from "../types.mjs";
import { useDebounceFn as v } from "../../../node_modules/.pnpm/@vueuse_shared@10.11.1_vue@3.5.12_typescript@5.4.2_/node_modules/@vueuse/shared/index.mjs";
function W(e) {
  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !x(e);
}
const O = /* @__PURE__ */ p({
  name: "WetStepsForm",
  props: N,
  emits: {
    "update:active": (e) => typeof e,
    next: (e) => typeof e,
    submit: (e) => typeof e
  },
  setup(e, {
    emit: c,
    slots: s,
    expose: y
  }) {
    const a = C("setps-form"), u = h(), n = F([]), b = E(() => n.value[e.active].uid), m = v(async () => {
      const t = await n.value[e.active].formIns.submit();
      c("next", t);
      const i = e.active + 1;
      c("update:active", i);
    }, 200), d = v(() => {
      const t = e.active - 1;
      c("update:active", t);
    }, 200), f = async () => {
      const t = await Promise.all(n.value.map((i) => i.formIns.submit()));
      c("submit", t);
    };
    return S(I, {
      divRef: u,
      activeCreateFormUid: n,
      showStepForm: b
    }), y({
      resetForm: () => {
        n.value.forEach((t) => {
          t.formIns.reset();
        });
      },
      clearForm: () => {
        n.value.forEach((t) => {
          t.formIns.clear();
        });
      }
    }), () => {
      let t;
      return o("div", {
        class: [a.b(), a.is("vertical", e.direction === "vertical")]
      }, [o("div", {
        class: [a.e("hd")]
      }, [o(B, w({
        "finish-status": "success"
      }, e), W(t = s.default()) ? t : {
        default: () => [t]
      })]), o("div", {
        class: [a.e("body")]
      }, [o("div", {
        class: [a.e("body-content")],
        style: {
          "--wet-body-content-w": typeof e.contentWidth == "string" ? e.contentWidth : `${e.contentWidth}px`
        }
      }, null), o("div", {
        ref: u
      }, null), o("div", {
        class: [a.e("footer")]
      }, [s.actions ? s.actions({
        active: e.active,
        next: m,
        pre: d,
        submit: f
      }) : o(g, null, [o(l, {
        style: {
          display: e.active === 0 && "none"
        },
        onClick: d
      }, {
        default: () => [r("上一步")]
      }), o(l, {
        style: {
          display: e.active === n.value.length - 1 && "none"
        },
        onClick: m
      }, {
        default: () => [r("下一步")]
      }), o(l, {
        style: {
          display: e.active !== n.value.length - 1 && "none"
        },
        onClick: f
      }, {
        default: () => [r("提交")]
      })])])])]);
    };
  }
});
export {
  O as default
};