@tmagic/form 1.8.0-beta.7 → 1.8.0-manmanyu.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/dist/es/Form.vue_vue_type_script_setup_true_lang.js +44 -5
  2. package/dist/es/FormDialog.vue_vue_type_script_setup_true_lang.js +12 -5
  3. package/dist/es/FormDrawer.vue_vue_type_script_setup_true_lang.js +13 -5
  4. package/dist/es/containers/Container.vue_vue_type_script_setup_true_lang.js +20 -15
  5. package/dist/es/containers/GroupListItem.vue_vue_type_script_setup_true_lang.js +22 -18
  6. package/dist/es/containers/Panel.vue_vue_type_script_setup_true_lang.js +16 -10
  7. package/dist/es/containers/table/ActionsColumn.vue_vue_type_script_setup_true_lang.js +13 -6
  8. package/dist/es/containers/table/useTableColumns.js +1 -0
  9. package/dist/es/containers/table-group-list/TableGroupList.vue_vue_type_script_setup_true_lang.js +2 -1
  10. package/dist/es/fields/Cascader.vue_vue_type_script_setup_true_lang.js +4 -1
  11. package/dist/es/fields/Checkbox.vue_vue_type_script_setup_true_lang.js +4 -1
  12. package/dist/es/fields/CheckboxGroup.vue_vue_type_script_setup_true_lang.js +4 -1
  13. package/dist/es/fields/ColorPicker.vue_vue_type_script_setup_true_lang.js +4 -1
  14. package/dist/es/fields/Date.vue_vue_type_script_setup_true_lang.js +4 -1
  15. package/dist/es/fields/DateTime.vue_vue_type_script_setup_true_lang.js +4 -1
  16. package/dist/es/fields/Daterange.vue_vue_type_script_setup_true_lang.js +4 -1
  17. package/dist/es/fields/Display.vue_vue_type_script_setup_true_lang.js +4 -1
  18. package/dist/es/fields/DynamicField.vue_vue_type_script_setup_true_lang.js +4 -1
  19. package/dist/es/fields/Link.vue_vue_type_script_setup_true_lang.js +29 -7
  20. package/dist/es/fields/Number.vue_vue_type_script_setup_true_lang.js +4 -1
  21. package/dist/es/fields/NumberRange.vue_vue_type_script_setup_true_lang.js +4 -1
  22. package/dist/es/fields/RadioGroup.vue_vue_type_script_setup_true_lang.js +16 -8
  23. package/dist/es/fields/Select.vue_vue_type_script_setup_true_lang.js +4 -1
  24. package/dist/es/fields/Switch.vue_vue_type_script_setup_true_lang.js +4 -1
  25. package/dist/es/fields/Text.vue_vue_type_script_setup_true_lang.js +112 -77
  26. package/dist/es/fields/Textarea.vue_vue_type_script_setup_true_lang.js +4 -1
  27. package/dist/es/fields/Time.vue_vue_type_script_setup_true_lang.js +4 -1
  28. package/dist/es/fields/Timerange.vue_vue_type_script_setup_true_lang.js +4 -1
  29. package/dist/es/plugin.js +2 -0
  30. package/dist/es/style.css +120 -8
  31. package/dist/style.css +120 -8
  32. package/dist/themes/magic-admin.css +53 -0
  33. package/dist/tmagic-form.umd.cjs +392 -201
  34. package/package.json +4 -4
  35. package/src/Form.vue +53 -4
  36. package/src/FormDialog.vue +14 -3
  37. package/src/FormDrawer.vue +15 -4
  38. package/src/containers/Container.vue +14 -5
  39. package/src/containers/GroupListItem.vue +14 -12
  40. package/src/containers/Panel.vue +10 -3
  41. package/src/containers/table/ActionsColumn.vue +10 -4
  42. package/src/containers/table/useTableColumns.ts +1 -0
  43. package/src/containers/table-group-list/TableGroupList.vue +5 -1
  44. package/src/fields/Link.vue +17 -3
  45. package/src/fields/RadioGroup.vue +11 -5
  46. package/src/fields/Text.vue +43 -19
  47. package/src/plugin.ts +2 -0
  48. package/src/theme/container.scss +3 -0
  49. package/src/theme/fieldset.scss +50 -0
  50. package/src/theme/form.scss +6 -0
  51. package/src/theme/group-list.scss +8 -7
  52. package/src/theme/index.scss +1 -0
  53. package/src/theme/link.scss +17 -0
  54. package/src/theme/panel.scss +1 -1
  55. package/src/theme/radio-group.scss +23 -0
  56. package/src/theme/tabs.scss +2 -2
  57. package/src/theme/text.scss +38 -0
  58. package/src/theme/themes/magic-admin/index.scss +89 -0
  59. package/types/index.d.ts +43 -1
@@ -2,9 +2,9 @@ import { FORM_DIFF_CONFIG_KEY } from "./schema.js";
2
2
  import { getConfig } from "./utils/config.js";
3
3
  import { initValue } from "./utils/form.js";
4
4
  import Container_default from "./containers/Container.js";
5
- import { Fragment, createBlock, createCommentVNode, createElementBlock, createSlots, defineComponent, mergeProps, normalizeStyle, openBlock, provide, reactive, ref, renderList, renderSlot, shallowRef, toRaw, unref, useTemplateRef, watch, watchEffect, withCtx } from "vue";
5
+ import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createSlots, defineComponent, inject, mergeProps, normalizeClass, normalizeStyle, openBlock, provide, reactive, ref, renderList, renderSlot, shallowRef, toRaw, unref, useTemplateRef, watch, watchEffect, withCtx } from "vue";
6
6
  import { cloneDeep, isEqual } from "lodash-es";
7
- import { TMagicForm, tMagicMessage, tMagicMessageBox } from "@tmagic/design";
7
+ import { M_THEME_KEY, TMagicForm, tMagicMessage, tMagicMessageBox } from "@tmagic/design";
8
8
  import { setValueByKeyPath } from "@tmagic/utils";
9
9
  //#region packages/form/src/Form.vue?vue&type=script&setup=true&lang.ts
10
10
  var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -37,7 +37,8 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
37
37
  preventSubmitDefault: { type: Boolean },
38
38
  extendState: {},
39
39
  showDiff: {},
40
- selfDiffFieldTypes: {}
40
+ selfDiffFieldTypes: {},
41
+ theme: {}
41
42
  },
42
43
  emits: [
43
44
  "change",
@@ -56,6 +57,25 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
56
57
  const fields = /* @__PURE__ */ new Map();
57
58
  const requestFuc = getConfig("request");
58
59
  /**
60
+ * 当前表单生效的主题名称:
61
+ * - 优先用本组件自己的 `props.theme`;
62
+ * - 没设置时回退到最近祖先 `<MEditor>` / `<MForm>` provide 的主题,便于内嵌于编辑器
63
+ * 时自动跟随外层主题,无需在每个 `MForm` 上重复传 `theme`。
64
+ *
65
+ * 同时把合并后的值再 provide 出去(见下方 `provide(M_THEME_KEY, ...)`),让 form 子树
66
+ * 里再嵌套的 portal 组件(`TMagicPopover` 等)依然能拿到非空主题。
67
+ */
68
+ const ancestorTheme = inject(M_THEME_KEY, null);
69
+ const effectiveTheme = computed(() => props.theme || ancestorTheme?.value || "");
70
+ /**
71
+ * 拼到 `formState.popperClass` 上的主题修饰类(仅 `m-theme--<theme>`,
72
+ * 不带 `m-form` / `m-editor` 前缀,因为 Element Plus 弹层节点本身既不是 form 也不是 editor)。
73
+ *
74
+ * 这条类会随所有读 `mForm.popperClass` 的字段(Select / DateTime / Cascader 等)下发到
75
+ * Element Plus 的 `popper-class`,让 portal 节点也命中 `m-theme--<theme>` 上的 CSS 变量。
76
+ */
77
+ const themeClass = computed(() => effectiveTheme.value ? `m-theme--${effectiveTheme.value}` : "");
78
+ /**
59
79
  * formState 实现说明:
60
80
  *
61
81
  * 1. 与 props 直接对应的字段(config / initValues / lastValues / isCompare / parentValues /
@@ -71,13 +91,21 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
71
91
  * 把最新值刷进 formState。
72
92
  * - accessor 描述符(`{ get stage() { return ... } }`)按原样写入,调用方可以控制
73
93
  * 读时求值,每次读取都会重新执行 getter。
94
+ *
95
+ * 4. `popperClass` 会自动拼接 `themeClass`:调用方传入的 `popperClass` + 当前主题
96
+ * 修饰类(含祖先 `<MEditor>` provide 的主题)。这样所有透传到 Element Plus 弹层
97
+ * `popper-class` 的字段(Select / DateTime / Cascader 等)能自带主题作用域。
74
98
  */
75
99
  const formState = reactive({
76
100
  get keyProp() {
77
101
  return props.keyProp;
78
102
  },
79
103
  get popperClass() {
80
- return props.popperClass;
104
+ const userClass = props.popperClass ?? "";
105
+ const tc = themeClass.value;
106
+ if (!userClass) return tc;
107
+ if (!tc) return userClass;
108
+ return `${userClass} ${tc}`;
81
109
  },
82
110
  get config() {
83
111
  return props.config;
@@ -153,6 +181,12 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
153
181
  }
154
182
  });
155
183
  provide("mForm", formState);
184
+ /**
185
+ * 把生效主题(自身或祖先)再 provide 出去,供 form 子树内含 `Teleport` 的组件
186
+ * (如 `TMagicPopover`)在传送目标上挂 `m-theme--<theme>` 类。
187
+ * 详见 `@tmagic/design/theme.ts`。
188
+ */
189
+ provide(M_THEME_KEY, effectiveTheme);
156
190
  provide(FORM_DIFF_CONFIG_KEY, {
157
191
  get showDiff() {
158
192
  return props.showDiff;
@@ -256,7 +290,11 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
256
290
  });
257
291
  return (_ctx, _cache) => {
258
292
  return openBlock(), createBlock(unref(TMagicForm), {
259
- class: "m-form",
293
+ class: normalizeClass([
294
+ "m-form",
295
+ effectiveTheme.value ? `m-form--${effectiveTheme.value}` : "",
296
+ effectiveTheme.value ? `m-theme--${effectiveTheme.value}` : ""
297
+ ]),
260
298
  ref: "tMagicForm",
261
299
  model: values.value,
262
300
  "label-width": __props.labelWidth,
@@ -294,6 +332,7 @@ var Form_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
294
332
  }), 128)) : createCommentVNode("v-if", true)]),
295
333
  _: 3
296
334
  }, 8, [
335
+ "class",
297
336
  "model",
298
337
  "label-width",
299
338
  "style",
@@ -1,6 +1,6 @@
1
1
  import Form_default from "./Form.js";
2
- import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeStyle, openBlock, ref, renderSlot, toDisplayString, unref, withCtx } from "vue";
3
- import { TMagicButton, TMagicCol, TMagicDialog, TMagicRow } from "@tmagic/design";
2
+ import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, normalizeStyle, openBlock, provide, ref, renderSlot, toDisplayString, unref, withCtx } from "vue";
3
+ import { M_THEME_KEY, TMagicButton, TMagicCol, TMagicDialog, TMagicRow } from "@tmagic/design";
4
4
  //#region packages/form/src/FormDialog.vue?vue&type=script&setup=true&lang.ts
5
5
  var _hoisted_1 = { style: { "min-height": "1px" } };
6
6
  var FormDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -41,7 +41,8 @@ var FormDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
41
41
  type: Boolean,
42
42
  default: true
43
43
  },
44
- extendState: {}
44
+ extendState: {},
45
+ theme: {}
45
46
  },
46
47
  emits: [
47
48
  "close",
@@ -51,6 +52,9 @@ var FormDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
51
52
  ],
52
53
  setup(__props, { expose: __expose, emit: __emit }) {
53
54
  const props = __props;
55
+ const ancestorTheme = inject(M_THEME_KEY, null);
56
+ const effectiveTheme = computed(() => props.theme || ancestorTheme?.value || "");
57
+ provide(M_THEME_KEY, effectiveTheme);
54
58
  const emit = __emit;
55
59
  const form = ref();
56
60
  const dialogVisible = ref(false);
@@ -110,7 +114,7 @@ var FormDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
110
114
  return openBlock(), createBlock(unref(TMagicDialog), {
111
115
  modelValue: dialogVisible.value,
112
116
  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => dialogVisible.value = $event),
113
- class: "m-form-dialog",
117
+ class: normalizeClass(["m-form-dialog", effectiveTheme.value ? `m-theme--${effectiveTheme.value}` : ""]),
114
118
  top: "20px",
115
119
  "append-to-body": "",
116
120
  title: __props.title,
@@ -192,6 +196,7 @@ var FormDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
192
196
  inline: __props.inline,
193
197
  "prevent-submit-default": __props.preventSubmitDefault,
194
198
  "extend-state": __props.extendState,
199
+ theme: effectiveTheme.value,
195
200
  onChange: changeHandler
196
201
  }, null, 8, [
197
202
  "modelValue",
@@ -204,11 +209,13 @@ var FormDialog_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
204
209
  "label-position",
205
210
  "inline",
206
211
  "prevent-submit-default",
207
- "extend-state"
212
+ "extend-state",
213
+ "theme"
208
214
  ]), renderSlot(_ctx.$slots, "default")], 4)) : createCommentVNode("v-if", true)]),
209
215
  _: 3
210
216
  }, 8, [
211
217
  "modelValue",
218
+ "class",
212
219
  "title",
213
220
  "width",
214
221
  "zIndex",
@@ -1,6 +1,6 @@
1
1
  import Form_default from "./Form.js";
2
- import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, renderSlot, toDisplayString, unref, watchEffect, withCtx } from "vue";
3
- import { TMagicButton, TMagicCol, TMagicDrawer, TMagicRow } from "@tmagic/design";
2
+ import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, provide, ref, renderSlot, toDisplayString, unref, watchEffect, withCtx } from "vue";
3
+ import { M_THEME_KEY, TMagicButton, TMagicCol, TMagicDrawer, TMagicRow } from "@tmagic/design";
4
4
  //#region packages/form/src/FormDrawer.vue?vue&type=script&setup=true&lang.ts
5
5
  var _hoisted_1 = { style: { "min-height": "1px" } };
6
6
  var FormDrawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -25,7 +25,8 @@ var FormDrawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
25
25
  labelPosition: {},
26
26
  preventSubmitDefault: { type: Boolean },
27
27
  beforeClose: {},
28
- extendState: {}
28
+ extendState: {},
29
+ theme: {}
29
30
  },
30
31
  emits: [
31
32
  "close",
@@ -37,6 +38,10 @@ var FormDrawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
37
38
  "opened"
38
39
  ],
39
40
  setup(__props, { expose: __expose, emit: __emit }) {
41
+ const props = __props;
42
+ const ancestorTheme = inject(M_THEME_KEY, null);
43
+ const effectiveTheme = computed(() => props.theme || ancestorTheme?.value || "");
44
+ provide(M_THEME_KEY, effectiveTheme);
40
45
  const emit = __emit;
41
46
  const drawer = ref();
42
47
  const form = ref();
@@ -90,7 +95,7 @@ var FormDrawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
90
95
  });
91
96
  return (_ctx, _cache) => {
92
97
  return openBlock(), createBlock(unref(TMagicDrawer), {
93
- class: "m-form-drawer",
98
+ class: normalizeClass(["m-form-drawer", effectiveTheme.value ? `m-theme--${effectiveTheme.value}` : ""]),
94
99
  ref_key: "drawer",
95
100
  ref: drawer,
96
101
  modelValue: visible.value,
@@ -150,6 +155,7 @@ var FormDrawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
150
155
  inline: __props.inline,
151
156
  "prevent-submit-default": __props.preventSubmitDefault,
152
157
  "extend-state": __props.extendState,
158
+ theme: effectiveTheme.value,
153
159
  onChange: changeHandler
154
160
  }, null, 8, [
155
161
  "size",
@@ -161,10 +167,12 @@ var FormDrawer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
161
167
  "label-position",
162
168
  "inline",
163
169
  "prevent-submit-default",
164
- "extend-state"
170
+ "extend-state",
171
+ "theme"
165
172
  ]), renderSlot(_ctx.$slots, "default")], 512)) : createCommentVNode("v-if", true)]),
166
173
  _: 3
167
174
  }, 8, [
175
+ "class",
168
176
  "modelValue",
169
177
  "title",
170
178
  "close-on-press-escape",
@@ -7,19 +7,23 @@ import { Fragment, computed, createBlock, createCommentVNode, createElementBlock
7
7
  import { isEqual } from "lodash-es";
8
8
  import { TMagicButton, TMagicFormItem, TMagicIcon, TMagicTooltip } from "@tmagic/design";
9
9
  import { getValueByKeyPath } from "@tmagic/utils";
10
- import { WarningFilled } from "@element-plus/icons-vue";
10
+ import { ArrowDown, ArrowUp, WarningFilled } from "@element-plus/icons-vue";
11
11
  //#region packages/form/src/containers/Container.vue?vue&type=script&setup=true&lang.ts
12
12
  var _hoisted_1 = ["data-tmagic-id", "data-tmagic-form-item-prop"];
13
- var _hoisted_2 = ["innerHTML"];
13
+ var _hoisted_2 = {
14
+ key: 0,
15
+ class: "m-form-tip m-form-title-extra"
16
+ };
14
17
  var _hoisted_3 = ["innerHTML"];
15
18
  var _hoisted_4 = ["innerHTML"];
16
19
  var _hoisted_5 = ["innerHTML"];
17
20
  var _hoisted_6 = ["innerHTML"];
18
21
  var _hoisted_7 = ["innerHTML"];
19
22
  var _hoisted_8 = ["innerHTML"];
20
- var _hoisted_9 = {
23
+ var _hoisted_9 = ["innerHTML"];
24
+ var _hoisted_10 = {
21
25
  key: 5,
22
- style: { "text-align": "center" }
26
+ class: "m-form-container-expand"
23
27
  };
24
28
  var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
25
29
  name: "MFormContainer",
@@ -297,12 +301,12 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
297
301
  "use-label",
298
302
  "label-title",
299
303
  "text"
300
- ])])]),
304
+ ]), __props.config.titleExtra && __props.config.labelPosition === "top" ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.config.titleExtra), 1)) : createCommentVNode("v-if", true)])]),
301
305
  default: withCtx(() => [tooltip.value.text ? (openBlock(), createBlock(unref(TMagicTooltip), {
302
306
  key: 0,
303
307
  placement: tooltip.value.placement
304
308
  }, {
305
- content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_2)]),
309
+ content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_3)]),
306
310
  default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(tagName.value), mergeProps(fieldsProps.value, {
307
311
  model: __props.model,
308
312
  "last-values": __props.lastValues,
@@ -331,7 +335,7 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
331
335
  key: 0,
332
336
  placement: "top"
333
337
  }, {
334
- content: withCtx(() => [createElementVNode("div", { innerHTML: __props.config.tip }, null, 8, _hoisted_3)]),
338
+ content: withCtx(() => [createElementVNode("div", { innerHTML: __props.config.tip }, null, 8, _hoisted_4)]),
335
339
  default: withCtx(() => [createVNode(unref(TMagicIcon), { style: {
336
340
  "line-height": "40px",
337
341
  "margin-left": "5px"
@@ -370,7 +374,7 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
370
374
  key: 0,
371
375
  placement: tooltip.value.placement
372
376
  }, {
373
- content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_4)]),
377
+ content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_5)]),
374
378
  default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(tagName.value), mergeProps(fieldsProps.value, {
375
379
  model: __props.model,
376
380
  "last-values": __props.lastValues,
@@ -423,7 +427,7 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
423
427
  key: 0,
424
428
  placement: tooltip.value.placement
425
429
  }, {
426
- content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_5)]),
430
+ content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_6)]),
427
431
  default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(tagName.value), mergeProps(fieldsProps.value, {
428
432
  model: __props.lastValues,
429
433
  onChange: onChangeHandler
@@ -439,7 +443,7 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
439
443
  key: 0,
440
444
  placement: "top"
441
445
  }, {
442
- content: withCtx(() => [createElementVNode("div", { innerHTML: __props.config.tip }, null, 8, _hoisted_6)]),
446
+ content: withCtx(() => [createElementVNode("div", { innerHTML: __props.config.tip }, null, 8, _hoisted_7)]),
443
447
  default: withCtx(() => [createVNode(unref(TMagicIcon), { style: {
444
448
  "line-height": "40px",
445
449
  "margin-left": "5px"
@@ -480,7 +484,7 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
480
484
  key: 0,
481
485
  placement: tooltip.value.placement
482
486
  }, {
483
- content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_7)]),
487
+ content: withCtx(() => [createElementVNode("div", { innerHTML: tooltip.value.text }, null, 8, _hoisted_8)]),
484
488
  default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(tagName.value), mergeProps(fieldsProps.value, {
485
489
  model: __props.model,
486
490
  onChange: onChangeHandler
@@ -496,7 +500,7 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
496
500
  key: 1,
497
501
  placement: "top"
498
502
  }, {
499
- content: withCtx(() => [createElementVNode("div", { innerHTML: __props.config.tip }, null, 8, _hoisted_8)]),
503
+ content: withCtx(() => [createElementVNode("div", { innerHTML: __props.config.tip }, null, 8, _hoisted_9)]),
500
504
  default: withCtx(() => [createVNode(unref(TMagicIcon), { style: {
501
505
  "line-height": "40px",
502
506
  "margin-left": "5px"
@@ -538,16 +542,17 @@ var Container_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
538
542
  "label-width",
539
543
  "prop"
540
544
  ]);
541
- }), 128)) : createCommentVNode("v-if", true)], 64)) : createCommentVNode("v-if", true), __props.config.expand && type.value !== "fieldset" ? (openBlock(), createElementBlock("div", _hoisted_9, [createVNode(unref(TMagicButton), {
545
+ }), 128)) : createCommentVNode("v-if", true)], 64)) : createCommentVNode("v-if", true), __props.config.expand && type.value !== "fieldset" ? (openBlock(), createElementBlock("div", _hoisted_10, [createVNode(unref(TMagicButton), {
542
546
  type: "primary",
543
547
  size: "small",
544
548
  disabled: false,
545
549
  link: "",
546
- onClick: expandHandler
550
+ onClick: expandHandler,
551
+ icon: expand.value ? unref(ArrowUp) : unref(ArrowDown)
547
552
  }, {
548
553
  default: withCtx(() => [createTextVNode(toDisplayString(expand.value ? "收起配置" : "展开更多配置"), 1)]),
549
554
  _: 1
550
- })])) : createCommentVNode("v-if", true)], 14, _hoisted_1);
555
+ }, 8, ["icon"])])) : createCommentVNode("v-if", true)], 14, _hoisted_1);
551
556
  };
552
557
  }
553
558
  });
@@ -2,14 +2,15 @@ import { filterFunction } from "../utils/form.js";
2
2
  import Container_default from "./Container.js";
3
3
  import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, openBlock, ref, unref, vShow, withCtx, withDirectives } from "vue";
4
4
  import { TMagicButton, TMagicCard, TMagicIcon, TMagicInputNumber, TMagicPopover } from "@tmagic/design";
5
- import { CaretBottom, CaretRight, CaretTop, Delete, DocumentCopy, Position } from "@element-plus/icons-vue";
5
+ import { ArrowDown, ArrowRight, Bottom, Delete, DocumentCopy, Position, Top } from "@element-plus/icons-vue";
6
6
  //#region packages/form/src/containers/GroupListItem.vue?vue&type=script&setup=true&lang.ts
7
- var _hoisted_1 = ["innerHTML"];
8
- var _hoisted_2 = { style: {
7
+ var _hoisted_1 = { class: "m-fields-group-list-item-header" };
8
+ var _hoisted_2 = ["innerHTML"];
9
+ var _hoisted_3 = { style: {
9
10
  "text-align": "right",
10
11
  "margin-top": "20px"
11
12
  } };
12
- var _hoisted_3 = ["innerHTML"];
13
+ var _hoisted_4 = ["innerHTML"];
13
14
  var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
14
15
  name: "MFormGroupListItem",
15
16
  __name: "GroupListItem",
@@ -85,25 +86,28 @@ var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
85
86
  return (_ctx, _cache) => {
86
87
  return openBlock(), createBlock(unref(TMagicCard), {
87
88
  class: "m-fields-group-list-item",
89
+ flat: __props.config.flat,
88
90
  "body-style": { display: expand.value ? "block" : "none" }
89
91
  }, {
90
- header: withCtx(() => [createElementVNode("div", null, [
92
+ header: withCtx(() => [createElementVNode("div", _hoisted_1, [
91
93
  createVNode(unref(TMagicButton), {
92
94
  link: "",
93
95
  disabled: __props.disabled,
94
- onClick: expandHandler
96
+ onClick: expandHandler,
97
+ class: "expand-button"
95
98
  }, {
96
99
  default: withCtx(() => [createVNode(unref(TMagicIcon), null, {
97
- default: withCtx(() => [expand.value ? (openBlock(), createBlock(unref(CaretBottom), { key: 0 })) : (openBlock(), createBlock(unref(CaretRight), { key: 1 }))]),
100
+ default: withCtx(() => [expand.value ? (openBlock(), createBlock(unref(ArrowDown), { key: 0 })) : (openBlock(), createBlock(unref(ArrowRight), { key: 1 }))]),
98
101
  _: 1
99
- }), createElementVNode("span", { innerHTML: title.value }, null, 8, _hoisted_1)]),
102
+ })]),
100
103
  _: 1
101
104
  }, 8, ["disabled"]),
105
+ createElementVNode("span", { innerHTML: title.value }, null, 8, _hoisted_2),
102
106
  !__props.isCompare ? withDirectives((openBlock(), createBlock(unref(TMagicButton), {
103
107
  key: 0,
104
- type: "danger",
105
- size: "small",
108
+ size: "default",
106
109
  link: "",
110
+ class: "delete-button",
107
111
  icon: unref(Delete),
108
112
  disabled: __props.disabled,
109
113
  onClick: removeHandler
@@ -111,7 +115,7 @@ var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
111
115
  copyable.value && !__props.isCompare ? (openBlock(), createBlock(unref(TMagicButton), {
112
116
  key: 1,
113
117
  link: "",
114
- size: "small",
118
+ size: "default",
115
119
  type: "primary",
116
120
  icon: unref(DocumentCopy),
117
121
  disabled: __props.disabled,
@@ -122,18 +126,18 @@ var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
122
126
  }, 8, ["icon", "disabled"])) : createCommentVNode("v-if", true),
123
127
  movable.value && !__props.isCompare ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [withDirectives(createVNode(unref(TMagicButton), {
124
128
  link: "",
125
- size: "small",
129
+ size: "default",
126
130
  disabled: __props.disabled,
127
- icon: unref(CaretTop),
131
+ icon: unref(Top),
128
132
  onClick: _cache[0] || (_cache[0] = ($event) => changeOrder(-1))
129
133
  }, {
130
134
  default: withCtx(() => [..._cache[7] || (_cache[7] = [createTextVNode("上移", -1)])]),
131
135
  _: 1
132
136
  }, 8, ["disabled", "icon"]), [[vShow, __props.index !== 0]]), withDirectives(createVNode(unref(TMagicButton), {
133
137
  link: "",
134
- size: "small",
138
+ size: "default",
135
139
  disabled: __props.disabled,
136
- icon: unref(CaretBottom),
140
+ icon: unref(Bottom),
137
141
  onClick: _cache[1] || (_cache[1] = ($event) => changeOrder(1))
138
142
  }, {
139
143
  default: withCtx(() => [..._cache[8] || (_cache[8] = [createTextVNode("下移", -1)])]),
@@ -168,7 +172,7 @@ var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
168
172
  disabled: __props.disabled
169
173
  }, null, 8, ["modelValue", "disabled"]),
170
174
  _cache[11] || (_cache[11] = createTextVNode("行 ", -1))
171
- ]), createElementVNode("div", _hoisted_2, [createVNode(unref(TMagicButton), {
175
+ ]), createElementVNode("div", _hoisted_3, [createVNode(unref(TMagicButton), {
172
176
  size: "small",
173
177
  text: "",
174
178
  onClick: _cache[4] || (_cache[4] = ($event) => moveSpecifyLocationVisible.value = false)
@@ -189,7 +193,7 @@ var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
189
193
  key: 4,
190
194
  innerHTML: itemExtra.value,
191
195
  class: "m-form-tip"
192
- }, null, 8, _hoisted_3)) : createCommentVNode("v-if", true)
196
+ }, null, 8, _hoisted_4)) : createCommentVNode("v-if", true)
193
197
  ])]),
194
198
  default: withCtx(() => [expand.value ? (openBlock(), createBlock(Container_default, {
195
199
  key: 0,
@@ -214,7 +218,7 @@ var GroupListItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
214
218
  "disabled"
215
219
  ])) : createCommentVNode("v-if", true)]),
216
220
  _: 1
217
- }, 8, ["body-style"]);
221
+ }, 8, ["flat", "body-style"]);
218
222
  };
219
223
  }
220
224
  });
@@ -1,8 +1,8 @@
1
1
  import { filterFunction } from "../utils/form.js";
2
2
  import Container_default from "./Container.js";
3
- import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, openBlock, ref, renderList, renderSlot, toDisplayString, unref, withCtx } from "vue";
3
+ import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, inject, openBlock, ref, renderList, renderSlot, toDisplayString, unref, withCtx } from "vue";
4
4
  import { TMagicButton, TMagicCard } from "@tmagic/design";
5
- import { CaretBottom, CaretRight } from "@element-plus/icons-vue";
5
+ import { ArrowDown, ArrowRight } from "@element-plus/icons-vue";
6
6
  //#region packages/form/src/containers/Panel.vue?vue&type=script&setup=true&lang.ts
7
7
  var _hoisted_1 = { style: {
8
8
  "width": "100%",
@@ -28,7 +28,8 @@ var Panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
28
28
  labelWidth: {},
29
29
  prop: {},
30
30
  size: {},
31
- disabled: { type: Boolean }
31
+ disabled: { type: Boolean },
32
+ hideExpand: { type: Boolean }
32
33
  },
33
34
  emits: ["change", "addDiffCount"],
34
35
  setup(__props, { expose: __expose, emit: __emit }) {
@@ -52,21 +53,26 @@ var Panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
52
53
  return items.value && items.value.length ? (openBlock(), createBlock(unref(TMagicCard), {
53
54
  key: 0,
54
55
  class: "box-card m-form-panel",
55
- "body-style": { display: expand.value ? "block" : "none" }
56
+ "body-style": { display: expand.value ? "block" : "none" },
57
+ flat: __props.config.flat
56
58
  }, {
57
59
  header: withCtx(() => [createElementVNode("div", _hoisted_1, [
58
- createVNode(unref(TMagicButton), {
59
- style: { "padding": "0" },
60
+ !__props.hideExpand ? (openBlock(), createBlock(unref(TMagicButton), {
61
+ key: 0,
62
+ style: {
63
+ "padding": "0",
64
+ "margin-right": "10px"
65
+ },
60
66
  link: "",
61
- icon: expand.value ? unref(CaretBottom) : unref(CaretRight),
67
+ icon: expand.value ? unref(ArrowDown) : unref(ArrowRight),
62
68
  onClick: _cache[0] || (_cache[0] = ($event) => expand.value = !expand.value)
63
- }, null, 8, ["icon"]),
69
+ }, null, 8, ["icon"])) : createCommentVNode("v-if", true),
64
70
  renderSlot(_ctx.$slots, "header", {}, () => [createElementVNode("span", {
65
71
  style: { "cursor": "pointer" },
66
72
  onClick: _cache[1] || (_cache[1] = ($event) => expand.value = !expand.value)
67
73
  }, toDisplayString(filter(__props.config.title)), 1)]),
68
74
  __props.config && __props.config.extra ? (openBlock(), createElementBlock("span", {
69
- key: 0,
75
+ key: 1,
70
76
  innerHTML: __props.config.extra,
71
77
  class: "m-form-tip"
72
78
  }, null, 8, _hoisted_2)) : createCommentVNode("v-if", true)
@@ -122,7 +128,7 @@ var Panel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
122
128
  ]);
123
129
  }), 128))])]),
124
130
  _: 3
125
- }, 8, ["body-style"])) : createCommentVNode("v-if", true);
131
+ }, 8, ["body-style", "flat"])) : createCommentVNode("v-if", true);
126
132
  };
127
133
  }
128
134
  });
@@ -1,4 +1,4 @@
1
- import { Fragment, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, inject, normalizeClass, openBlock, renderSlot, unref, vShow, withCtx, withDirectives } from "vue";
1
+ import { Fragment, createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, renderSlot, unref, vShow, withCtx, withDirectives } from "vue";
2
2
  import { cloneDeep } from "lodash-es";
3
3
  import { TMagicButton, TMagicTooltip } from "@tmagic/design";
4
4
  import { Delete, DocumentCopy, Sort } from "@element-plus/icons-vue";
@@ -15,7 +15,8 @@ var ActionsColumn_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
15
15
  index: {},
16
16
  row: {},
17
17
  prop: {},
18
- sortKey: {}
18
+ sortKey: {},
19
+ flat: { type: Boolean }
19
20
  },
20
21
  emits: ["change"],
21
22
  setup(__props, { emit: __emit }) {
@@ -86,19 +87,25 @@ var ActionsColumn_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
86
87
  type: "danger",
87
88
  link: "",
88
89
  title: "删除",
89
- icon: __props.config.deleteActionButtonIcon || unref(Delete),
90
+ icon: __props.flat ? void 0 : __props.config.deleteActionButtonIcon || unref(Delete),
90
91
  onClick: _cache[0] || (_cache[0] = ($event) => removeHandler(__props.index + 1 + __props.currentPage * __props.pageSize - 1))
91
- }, null, 8, ["icon"]), [[vShow, showDelete(__props.index + 1 + __props.currentPage * __props.pageSize - 1)]]),
92
+ }, {
93
+ default: withCtx(() => [__props.flat ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createTextVNode("删除")], 64)) : createCommentVNode("v-if", true)]),
94
+ _: 1
95
+ }, 8, ["icon"]), [[vShow, showDelete(__props.index + 1 + __props.currentPage * __props.pageSize - 1)]]),
92
96
  copyable(__props.index + 1 + __props.currentPage * __props.pageSize - 1) ? (openBlock(), createBlock(unref(TMagicButton), {
93
97
  key: 1,
94
98
  link: "",
95
99
  size: "small",
96
100
  type: "primary",
97
101
  title: "复制",
98
- icon: __props.config.copyActionButtonIcon || unref(DocumentCopy),
102
+ icon: __props.flat ? void 0 : __props.config.copyActionButtonIcon || unref(DocumentCopy),
99
103
  disabled: __props.disabled,
100
104
  onClick: _cache[1] || (_cache[1] = ($event) => copyHandler(__props.index + 1 + __props.currentPage * __props.pageSize - 1))
101
- }, null, 8, ["icon", "disabled"])) : createCommentVNode("v-if", true)
105
+ }, {
106
+ default: withCtx(() => [__props.flat ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createTextVNode("复制")], 64)) : createCommentVNode("v-if", true)]),
107
+ _: 1
108
+ }, 8, ["icon", "disabled"])) : createCommentVNode("v-if", true)
102
109
  ], 64);
103
110
  };
104
111
  }
@@ -77,6 +77,7 @@ var useTableColumns = (props, emit, currentPage, pageSize, modelName) => {
77
77
  },
78
78
  cell: ({ row, $index }) => h(ActionsColumn_default, {
79
79
  row,
80
+ flat: props.config.flat,
80
81
  index: $index,
81
82
  model: props.model,
82
83
  config: props.config,
@@ -127,9 +127,10 @@ var TableGroupList_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
127
127
  size: addButtonSize.value,
128
128
  plain: displayMode.value === "table",
129
129
  icon: unref(Plus),
130
+ text: "",
130
131
  disabled: __props.disabled
131
132
  }, currentConfig.value.addButtonConfig?.props || { type: "primary" }, { onClick: unref(newHandler) }), {
132
- default: withCtx(() => [createTextVNode(toDisplayString(currentConfig.value.addButtonConfig?.text || (displayMode.value === "table" ? "新增一行" : "新增")), 1)]),
133
+ default: withCtx(() => [createTextVNode(toDisplayString(currentConfig.value.addButtonConfig?.text || (displayMode.value === "table" ? "新增一行" : `新增${groupListConfig.value.titlePrefix || ""}`)), 1)]),
133
134
  _: 1
134
135
  }, 16, [
135
136
  "class",
@@ -17,7 +17,10 @@ var Cascader_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
17
17
  disabled: { type: Boolean },
18
18
  size: {},
19
19
  lastValues: {},
20
- isCompare: { type: Boolean }
20
+ isCompare: { type: Boolean },
21
+ text: {},
22
+ labelWidth: {},
23
+ labelPosition: {}
21
24
  },
22
25
  emits: ["change"],
23
26
  setup(__props, { emit: __emit }) {
@@ -15,7 +15,10 @@ var Checkbox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
15
15
  disabled: { type: Boolean },
16
16
  size: {},
17
17
  lastValues: {},
18
- isCompare: { type: Boolean }
18
+ isCompare: { type: Boolean },
19
+ text: {},
20
+ labelWidth: {},
21
+ labelPosition: {}
19
22
  },
20
23
  emits: ["change"],
21
24
  setup(__props, { emit: __emit }) {
@@ -16,7 +16,10 @@ var CheckboxGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
16
16
  disabled: { type: Boolean },
17
17
  size: {},
18
18
  lastValues: {},
19
- isCompare: { type: Boolean }
19
+ isCompare: { type: Boolean },
20
+ text: {},
21
+ labelWidth: {},
22
+ labelPosition: {}
20
23
  },
21
24
  emits: ["change"],
22
25
  setup(__props, { emit: __emit }) {
@@ -15,7 +15,10 @@ var ColorPicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
15
15
  disabled: { type: Boolean },
16
16
  size: {},
17
17
  lastValues: {},
18
- isCompare: { type: Boolean }
18
+ isCompare: { type: Boolean },
19
+ text: {},
20
+ labelWidth: {},
21
+ labelPosition: {}
19
22
  },
20
23
  emits: ["change"],
21
24
  setup(__props, { emit: __emit }) {
@@ -16,7 +16,10 @@ var Date_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCom
16
16
  disabled: { type: Boolean },
17
17
  size: {},
18
18
  lastValues: {},
19
- isCompare: { type: Boolean }
19
+ isCompare: { type: Boolean },
20
+ text: {},
21
+ labelWidth: {},
22
+ labelPosition: {}
20
23
  },
21
24
  emits: ["change"],
22
25
  setup(__props, { emit: __emit }) {