| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180 |
- import { resolveComponent as u, openBlock as _, createBlock as b, withCtx as n, createVNode as o, createTextVNode as v } from "vue";
- import { l as g, bv as C, U as h } from "./index2.js";
- import { C as k } from "./index25.js";
- const y = {
- name: "FormPage",
- props: {
- id: {
- type: String,
- default: ""
- }
- },
- watch: {
- id: {
- handler(e) {
- this.props.id = e || this.id;
- },
- immediate: !0
- }
- },
- data() {
- return {
- props: {
- id: ""
- },
- form: {
- name: "",
- code: ""
- },
- rules: {
- name: [{ required: !0, message: "请输入表单名称", trigger: "blur" }]
- },
- tabs: [
- {
- name: "第一页",
- value: 1
- },
- {
- name: "第二页",
- value: 2
- },
- {
- name: "第三页",
- value: 3
- }
- ]
- };
- },
- methods: {
- tabsChange(e) {
- console.log(e);
- },
- footCallback(e) {
- e === "cancel" && this.$router.go(-1);
- },
- handSubmit() {
- this.$refs.form.validate().then((e) => {
- console.log("success", e);
- }).catch((e) => {
- console.log(e);
- }), this.$refs["group-form"].validate().then((e) => {
- console.log("success", e);
- }).catch((e) => {
- console.log(e);
- });
- }
- },
- mounted() {
- }
- };
- function x(e, t, U, T, l, s) {
- const r = C, m = u("s-form-item"), f = u("s-form"), c = k, d = u("check-outlined"), i = h, p = u("s-form-layout");
- return _(), b(p, {
- ref: "formLayout",
- title: "选项卡表单示例",
- subTitle: "",
- onFooterCallback: s.footCallback,
- tabs: l.tabs,
- tabKey: { label: "name", value: "value" },
- onTabsChange: s.tabsChange
- }, {
- form: n(() => [
- o(c, {
- class: "mb-50",
- title: "表单列可设置为最多4列"
- }, {
- default: n(() => [
- o(f, {
- model: l.form,
- rules: l.rules,
- ref: "form",
- layout: "horizontal",
- column: 4
- }, {
- default: n(() => [
- o(m, {
- label: "表单名称",
- name: "name"
- }, {
- default: n(() => [
- o(r, {
- value: l.form.name,
- "onUpdate:value": t[0] || (t[0] = (a) => l.form.name = a)
- }, null, 8, ["value"])
- ]),
- _: 1
- }),
- o(m, {
- label: "表单编码",
- name: "code"
- }, {
- default: n(() => [
- o(r, {
- value: l.form.code,
- "onUpdate:value": t[1] || (t[1] = (a) => l.form.code = a)
- }, null, 8, ["value"])
- ]),
- _: 1
- }),
- o(m, {
- label: "表单类型",
- name: "code"
- }, {
- default: n(() => [
- o(r, {
- value: l.form.code,
- "onUpdate:value": t[2] || (t[2] = (a) => l.form.code = a)
- }, null, 8, ["value"])
- ]),
- _: 1
- }),
- o(m, {
- label: "表单状态",
- name: "code"
- }, {
- default: n(() => [
- o(r, {
- value: l.form.code,
- "onUpdate:value": t[3] || (t[3] = (a) => l.form.code = a)
- }, null, 8, ["value"])
- ]),
- _: 1
- }),
- o(m, {
- label: "表单属性",
- name: "code"
- }, {
- default: n(() => [
- o(r, {
- value: l.form.code,
- "onUpdate:value": t[4] || (t[4] = (a) => l.form.code = a)
- }, null, 8, ["value"])
- ]),
- _: 1
- })
- ]),
- _: 1
- }, 8, ["model", "rules"])
- ]),
- _: 1
- })
- ]),
- footer: n(() => [
- o(i, {
- type: "primary",
- onClick: s.handSubmit
- }, {
- default: n(() => [
- o(d),
- t[5] || (t[5] = v("提交"))
- ]),
- _: 1
- }, 8, ["onClick"])
- ]),
- _: 1
- }, 8, ["onFooterCallback", "tabs", "onTabsChange"]);
- }
- const w = /* @__PURE__ */ g(y, [["render", x]]);
- export {
- w as default
- };
|