@tmagic/form 1.8.0-beta.9 → 1.8.0-manmanyu.11

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 (64) 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 +37 -12
  4. package/dist/es/containers/Container.vue_vue_type_script_setup_true_lang.js +22 -16
  5. package/dist/es/containers/GroupList.vue_vue_type_script_setup_true_lang.js +6 -5
  6. package/dist/es/containers/GroupListItem.vue_vue_type_script_setup_true_lang.js +41 -31
  7. package/dist/es/containers/Panel.vue_vue_type_script_setup_true_lang.js +16 -10
  8. package/dist/es/containers/table/ActionsColumn.vue_vue_type_script_setup_true_lang.js +13 -6
  9. package/dist/es/containers/table/Table.vue_vue_type_script_setup_true_lang.js +4 -2
  10. package/dist/es/containers/table/useTableColumns.js +6 -2
  11. package/dist/es/containers/table-group-list/TableGroupList.vue_vue_type_script_setup_true_lang.js +2 -1
  12. package/dist/es/fields/Cascader.vue_vue_type_script_setup_true_lang.js +4 -1
  13. package/dist/es/fields/Checkbox.vue_vue_type_script_setup_true_lang.js +4 -1
  14. package/dist/es/fields/CheckboxGroup.vue_vue_type_script_setup_true_lang.js +4 -1
  15. package/dist/es/fields/ColorPicker.vue_vue_type_script_setup_true_lang.js +4 -1
  16. package/dist/es/fields/Date.vue_vue_type_script_setup_true_lang.js +4 -1
  17. package/dist/es/fields/DateTime.vue_vue_type_script_setup_true_lang.js +4 -1
  18. package/dist/es/fields/Daterange.vue_vue_type_script_setup_true_lang.js +4 -1
  19. package/dist/es/fields/Display.vue_vue_type_script_setup_true_lang.js +4 -1
  20. package/dist/es/fields/DynamicField.vue_vue_type_script_setup_true_lang.js +4 -1
  21. package/dist/es/fields/Link.vue_vue_type_script_setup_true_lang.js +29 -7
  22. package/dist/es/fields/Number.vue_vue_type_script_setup_true_lang.js +8 -3
  23. package/dist/es/fields/NumberRange.vue_vue_type_script_setup_true_lang.js +4 -1
  24. package/dist/es/fields/RadioGroup.vue_vue_type_script_setup_true_lang.js +16 -8
  25. package/dist/es/fields/Select.vue_vue_type_script_setup_true_lang.js +4 -1
  26. package/dist/es/fields/Switch.vue_vue_type_script_setup_true_lang.js +4 -1
  27. package/dist/es/fields/Text.vue_vue_type_script_setup_true_lang.js +112 -77
  28. package/dist/es/fields/Textarea.vue_vue_type_script_setup_true_lang.js +4 -1
  29. package/dist/es/fields/Time.vue_vue_type_script_setup_true_lang.js +4 -1
  30. package/dist/es/fields/Timerange.vue_vue_type_script_setup_true_lang.js +4 -1
  31. package/dist/es/plugin.js +2 -0
  32. package/dist/es/style.css +121 -8
  33. package/dist/style.css +121 -8
  34. package/dist/themes/magic-admin.css +495 -0
  35. package/dist/tmagic-form.umd.cjs +448 -225
  36. package/package.json +4 -4
  37. package/src/Form.vue +53 -4
  38. package/src/FormDialog.vue +14 -3
  39. package/src/FormDrawer.vue +40 -12
  40. package/src/containers/Container.vue +16 -5
  41. package/src/containers/GroupList.vue +1 -1
  42. package/src/containers/GroupListItem.vue +28 -22
  43. package/src/containers/Panel.vue +10 -3
  44. package/src/containers/table/ActionsColumn.vue +10 -4
  45. package/src/containers/table/Table.vue +1 -0
  46. package/src/containers/table/useTableColumns.ts +10 -4
  47. package/src/containers/table-group-list/TableGroupList.vue +7 -1
  48. package/src/fields/Link.vue +17 -3
  49. package/src/fields/Number.vue +5 -2
  50. package/src/fields/RadioGroup.vue +11 -5
  51. package/src/fields/Text.vue +43 -19
  52. package/src/plugin.ts +2 -0
  53. package/src/theme/container.scss +3 -0
  54. package/src/theme/fieldset.scss +50 -0
  55. package/src/theme/form.scss +6 -0
  56. package/src/theme/group-list.scss +9 -7
  57. package/src/theme/index.scss +1 -0
  58. package/src/theme/link.scss +17 -0
  59. package/src/theme/panel.scss +1 -1
  60. package/src/theme/radio-group.scss +23 -0
  61. package/src/theme/tabs.scss +2 -2
  62. package/src/theme/text.scss +38 -0
  63. package/src/theme/themes/magic-admin/index.scss +91 -0
  64. package/types/index.d.ts +46 -1
@@ -1,13 +1,21 @@
1
1
  import { useAddField } from "../utils/useAddField.js";
2
- import { Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, inject, openBlock, readonly, ref, shallowRef, toDisplayString, unref, watch, withCtx, withModifiers } from "vue";
2
+ import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, readonly, ref, shallowRef, toDisplayString, unref, watch, withCtx, withModifiers } from "vue";
3
3
  import { debounce } from "lodash-es";
4
4
  import { TMagicButton, TMagicInput } from "@tmagic/design";
5
5
  import { isNumber } from "@tmagic/utils";
6
6
  import { createPopper } from "@popperjs/core";
7
7
  //#region packages/form/src/fields/Text.vue?vue&type=script&setup=true&lang.ts
8
- var _hoisted_1 = { class: "m-fields-text" };
9
- var _hoisted_2 = { key: 1 };
10
- var _hoisted_3 = { style: {
8
+ var _hoisted_1 = { key: 0 };
9
+ var _hoisted_2 = {
10
+ key: 0,
11
+ class: "m-fields-text__prepend"
12
+ };
13
+ var _hoisted_3 = { class: "m-fields-text__value" };
14
+ var _hoisted_4 = ["src"];
15
+ var _hoisted_5 = { key: 2 };
16
+ var _hoisted_6 = ["src"];
17
+ var _hoisted_7 = { key: 2 };
18
+ var _hoisted_8 = { style: {
11
19
  "display": "flex",
12
20
  "justify-content": "flex-end"
13
21
  } };
@@ -24,7 +32,10 @@ var Text_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCompo
24
32
  disabled: { type: Boolean },
25
33
  size: {},
26
34
  lastValues: {},
27
- isCompare: { type: Boolean }
35
+ isCompare: { type: Boolean },
36
+ text: {},
37
+ labelWidth: {},
38
+ labelPosition: {}
28
39
  },
29
40
  emits: ["change", "input"],
30
41
  setup(__props, { emit: __emit }) {
@@ -37,21 +48,15 @@ var Text_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCompo
37
48
  value.value = v;
38
49
  }, { immediate: true });
39
50
  const appendConfig = computed(() => {
40
- if (typeof props.config.append === "string") return {
51
+ const { append } = props.config;
52
+ if (typeof append === "string") return {
41
53
  type: "text",
42
- text: props.config.append,
54
+ text: append,
43
55
  handler: void 0
44
56
  };
45
- if (typeof props.config.append === "object") {
46
- if (typeof props.config.append?.handler === "function") return {
47
- type: "button",
48
- text: props.config.append.text,
49
- handler: props.config.append.handler
50
- };
51
- if (props.config.append) {
52
- if (props.config.append.value === 0) return false;
53
- return props.config.append;
54
- }
57
+ if (typeof append === "object" && append) {
58
+ if (append.value === 0) return false;
59
+ return append;
55
60
  }
56
61
  return false;
57
62
  });
@@ -147,67 +152,97 @@ var Text_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCompo
147
152
  instanceRef.value = void 0;
148
153
  };
149
154
  return (_ctx, _cache) => {
150
- return openBlock(), createElementBlock("div", _hoisted_1, [createVNode(unref(TMagicInput), {
151
- modelValue: value.value,
152
- "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
153
- ref_key: "input",
154
- ref: input,
155
- clearable: __props.config.clearable ?? true,
156
- size: __props.size,
157
- placeholder: __props.config.placeholder,
158
- disabled: __props.disabled,
159
- onChange: changeHandler,
160
- onInput: inputHandler,
161
- onKeyup: _cache[1] || (_cache[1] = ($event) => keyUpHandler($event))
162
- }, createSlots({ _: 2 }, [__props.config.prepend ? {
163
- name: "prepend",
164
- fn: withCtx(() => [createElementVNode("span", null, toDisplayString(__props.config.prepend), 1)]),
165
- key: "0"
166
- } : void 0, appendConfig.value ? {
167
- name: "append",
168
- fn: withCtx(() => [appendConfig.value.type === "button" ? (openBlock(), createBlock(unref(TMagicButton), {
169
- key: 0,
170
- style: { "color": "#409eff" },
155
+ return openBlock(), createElementBlock("div", { class: normalizeClass(["m-fields-text", { "m-fields-text--static": __props.config.static }]) }, [
156
+ __props.config.disabled ? (openBlock(), createElementBlock("div", _hoisted_1)) : createCommentVNode("v-if", true),
157
+ createCommentVNode(" 新增静态展示文本样式 "),
158
+ __props.config.static ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
159
+ __props.config.prepend ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.config.prepend), 1)) : createCommentVNode("v-if", true),
160
+ createElementVNode("span", _hoisted_3, toDisplayString(value.value), 1),
161
+ appendConfig.value ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [appendConfig.value.type === "button" ? (openBlock(), createBlock(unref(TMagicButton), {
162
+ key: 0,
163
+ style: { "color": "#0056ea" },
164
+ size: __props.size,
165
+ onClick: withModifiers(buttonClickHandler, ["prevent"])
166
+ }, {
167
+ default: withCtx(() => [createTextVNode(toDisplayString(appendConfig.value.text), 1)]),
168
+ _: 1
169
+ }, 8, ["size"])) : appendConfig.value.type === "icon" ? (openBlock(), createElementBlock("img", {
170
+ key: 1,
171
+ class: "m-fields-text__icon",
172
+ src: appendConfig.value.text,
173
+ onClick: buttonClickHandler
174
+ }, null, 8, _hoisted_4)) : (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(appendConfig.value.text), 1))], 64)) : createCommentVNode("v-if", true)
175
+ ], 64)) : (openBlock(), createBlock(unref(TMagicInput), {
176
+ key: 2,
177
+ modelValue: value.value,
178
+ "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
179
+ ref_key: "input",
180
+ ref: input,
181
+ clearable: __props.config.clearable ?? true,
171
182
  size: __props.size,
172
- onClick: withModifiers(buttonClickHandler, ["prevent"])
173
- }, {
174
- default: withCtx(() => [createTextVNode(toDisplayString(appendConfig.value.text), 1)]),
175
- _: 1
176
- }, 8, ["size"])) : (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(appendConfig.value.text), 1))]),
177
- key: "1"
178
- } : void 0]), 1032, [
179
- "modelValue",
180
- "clearable",
181
- "size",
182
- "placeholder",
183
- "disabled"
184
- ]), (openBlock(), createBlock(Teleport, { to: "body" }, [popoverVisible.value ? (openBlock(), createElementBlock("div", {
185
- key: 0,
186
- class: "tmagic-form-text-popper m-form-item__content",
187
- ref_key: "popoverEl",
188
- ref: popoverEl
189
- }, [
190
- _cache[5] || (_cache[5] = createElementVNode("div", { class: "m-form-validate__warning" }, "输入内容前后有空格,是否移除空格?", -1)),
191
- createElementVNode("div", _hoisted_3, [createVNode(unref(TMagicButton), {
192
- link: "",
193
- size: "small",
194
- onClick: _cache[2] || (_cache[2] = ($event) => popoverVisible.value = false)
195
- }, {
196
- default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode("保持原样", -1)])]),
197
- _: 1
198
- }), createVNode(unref(TMagicButton), {
199
- type: "primary",
200
- size: "small",
201
- onClick: confirmTrimHandler
202
- }, {
203
- default: withCtx(() => [..._cache[4] || (_cache[4] = [createTextVNode("移除空格", -1)])]),
204
- _: 1
205
- })]),
206
- _cache[6] || (_cache[6] = createElementVNode("span", {
207
- class: "tmagic-form-text-popper-arrow",
208
- "data-popper-arrow": ""
209
- }, null, -1))
210
- ], 512)) : createCommentVNode("v-if", true)]))]);
183
+ placeholder: __props.config.placeholder,
184
+ disabled: __props.disabled,
185
+ onChange: changeHandler,
186
+ onInput: inputHandler,
187
+ onKeyup: _cache[1] || (_cache[1] = ($event) => keyUpHandler($event))
188
+ }, createSlots({ _: 2 }, [__props.config.prepend ? {
189
+ name: "prepend",
190
+ fn: withCtx(() => [createElementVNode("span", null, toDisplayString(__props.config.prepend), 1)]),
191
+ key: "0"
192
+ } : void 0, appendConfig.value ? {
193
+ name: "append",
194
+ fn: withCtx(() => [appendConfig.value.type === "button" ? (openBlock(), createBlock(unref(TMagicButton), {
195
+ key: 0,
196
+ style: { "color": "#0056ea" },
197
+ size: __props.size,
198
+ onClick: withModifiers(buttonClickHandler, ["prevent"])
199
+ }, {
200
+ default: withCtx(() => [createTextVNode(toDisplayString(appendConfig.value.text), 1)]),
201
+ _: 1
202
+ }, 8, ["size"])) : appendConfig.value.type === "icon" ? (openBlock(), createElementBlock("img", {
203
+ key: 1,
204
+ src: appendConfig.value.text,
205
+ onClick: buttonClickHandler
206
+ }, null, 8, _hoisted_6)) : (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(appendConfig.value.text), 1))]),
207
+ key: "1"
208
+ } : void 0]), 1032, [
209
+ "modelValue",
210
+ "clearable",
211
+ "size",
212
+ "placeholder",
213
+ "disabled"
214
+ ])),
215
+ !__props.config.static ? (openBlock(), createBlock(Teleport, {
216
+ key: 3,
217
+ to: "body"
218
+ }, [popoverVisible.value ? (openBlock(), createElementBlock("div", {
219
+ key: 0,
220
+ class: "tmagic-form-text-popper m-form-item__content",
221
+ ref_key: "popoverEl",
222
+ ref: popoverEl
223
+ }, [
224
+ _cache[5] || (_cache[5] = createElementVNode("div", { class: "m-form-validate__warning" }, "输入内容前后有空格,是否移除空格?", -1)),
225
+ createElementVNode("div", _hoisted_8, [createVNode(unref(TMagicButton), {
226
+ link: "",
227
+ size: "small",
228
+ onClick: _cache[2] || (_cache[2] = ($event) => popoverVisible.value = false)
229
+ }, {
230
+ default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode("保持原样", -1)])]),
231
+ _: 1
232
+ }), createVNode(unref(TMagicButton), {
233
+ type: "primary",
234
+ size: "small",
235
+ onClick: confirmTrimHandler
236
+ }, {
237
+ default: withCtx(() => [..._cache[4] || (_cache[4] = [createTextVNode("移除空格", -1)])]),
238
+ _: 1
239
+ })]),
240
+ _cache[6] || (_cache[6] = createElementVNode("span", {
241
+ class: "tmagic-form-text-popper-arrow",
242
+ "data-popper-arrow": ""
243
+ }, null, -1))
244
+ ], 512)) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)
245
+ ], 2);
211
246
  };
212
247
  }
213
248
  });
@@ -15,7 +15,10 @@ var Textarea_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineC
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", "input"],
21
24
  setup(__props, { emit: __emit }) {
@@ -15,7 +15,10 @@ var Time_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCompo
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 }) {
@@ -17,7 +17,10 @@ var Timerange_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
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 }) {
package/dist/es/plugin.js CHANGED
@@ -3,6 +3,7 @@ import { setConfig } from "./utils/config.js";
3
3
  import Container_default from "./containers/Container.js";
4
4
  import Form_default from "./Form.js";
5
5
  import FormDialog_default from "./FormDialog.js";
6
+ import FormDrawer_default from "./FormDrawer.js";
6
7
  import Fieldset_default from "./containers/Fieldset.js";
7
8
  import FlexLayout_default from "./containers/FlexLayout.js";
8
9
  import Panel_default from "./containers/Panel.js";
@@ -38,6 +39,7 @@ var plugin_default = { install(app, opt = {}) {
38
39
  setConfig(option);
39
40
  app.component("m-form", Form_default);
40
41
  app.component("m-form-dialog", FormDialog_default);
42
+ app.component("m-form-drawer", FormDrawer_default);
41
43
  app.component("m-form-container", Container_default);
42
44
  app.component("m-form-fieldset", Fieldset_default);
43
45
  app.component("m-form-group-list", TableGroupList_default);
package/dist/es/style.css CHANGED
@@ -16,6 +16,9 @@
16
16
  .m-form-container .tmagic-design-form-item.show-before-diff {
17
17
  background: #f7dadd;
18
18
  }
19
+ .m-form-container .m-form-title-extra {
20
+ margin-left: 8px;
21
+ }
19
22
 
20
23
  .m-form-dialog .el-dialog__body {
21
24
  padding: 0 !important;
@@ -76,6 +79,10 @@
76
79
  margin-bottom: var(--td-comp-margin-xxl);
77
80
  }
78
81
 
82
+ .m-form-container .m-form-container-expand {
83
+ text-align: center;
84
+ }
85
+
79
86
  .magic-datetime-picker-popper .el-picker-panel__footer button:first-child {
80
87
  display: none;
81
88
  }
@@ -85,6 +92,24 @@
85
92
  align-items: center;
86
93
  width: 100%;
87
94
  }
95
+ .m-fields-text--static {
96
+ gap: 6px;
97
+ min-height: 32px;
98
+ }
99
+ .m-fields-text--static .m-fields-text__prepend {
100
+ color: var(--el-text-color-secondary, #909399);
101
+ }
102
+ .m-fields-text--static .m-fields-text__value {
103
+ color: var(--el-text-color-regular, #606266);
104
+ overflow: hidden;
105
+ text-overflow: ellipsis;
106
+ white-space: nowrap;
107
+ }
108
+ .m-fields-text--static .m-fields-text__icon {
109
+ width: 16px;
110
+ height: 16px;
111
+ cursor: pointer;
112
+ }
88
113
 
89
114
  .m-form-validate__warning {
90
115
  color: var(--el-color-warning);
@@ -110,6 +135,16 @@
110
135
  outline: none;
111
136
  }
112
137
 
138
+ .m-container-text.m-fields-title-container .tmagic-design-form-item .el-form-item__label {
139
+ color: #0f1113;
140
+ font-weight: 500;
141
+ font-size: 16px;
142
+ }
143
+ .m-container-text.m-fields-title-container .tmagic-design-form-item {
144
+ line-height: 24px;
145
+ margin-bottom: 16px;
146
+ }
147
+
113
148
  .tmagic-form-text-popper[data-popper-placement^=top] > .tmagic-form-text-popper-arrow {
114
149
  bottom: -4px;
115
150
  }
@@ -148,6 +183,65 @@ div.m-fields-link {
148
183
  width: fit-content;
149
184
  }
150
185
 
186
+ a.magic-admin-link {
187
+ width: 100%;
188
+ box-sizing: border-box;
189
+ border-radius: 4px;
190
+ border: 1px solid #e6e6e6;
191
+ background-color: #fafafa;
192
+ padding: 0 8px;
193
+ height: 28px;
194
+ display: inline-flex;
195
+ gap: 4px;
196
+ align-items: center;
197
+ text-decoration: none;
198
+ }
199
+ a.magic-admin-link i {
200
+ margin-right: 4px;
201
+ }
202
+
203
+ .m-container-fieldset.no-border-fieldset.fieldset-in-row > fieldset.m-fieldset legend {
204
+ left: 0;
205
+ }
206
+ .m-container-fieldset.no-border-fieldset > fieldset.m-fieldset {
207
+ border: 0;
208
+ }
209
+ .m-container-fieldset.no-border-fieldset > fieldset.m-fieldset legend {
210
+ position: relative;
211
+ left: -5px;
212
+ font-size: 16px;
213
+ font-weight: 500;
214
+ line-height: 24px;
215
+ padding: 0;
216
+ }
217
+ .m-container-fieldset.fieldset-in-card-fit {
218
+ border-bottom: 1px solid #e6e6e6;
219
+ }
220
+ .m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset {
221
+ padding: 16px 0 16px 0 !important;
222
+ border: 0;
223
+ margin-top: 0;
224
+ margin-bottom: 0;
225
+ }
226
+ .m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset legend {
227
+ position: relative;
228
+ top: 10px;
229
+ }
230
+ .m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-last {
231
+ padding-bottom: 0 !important;
232
+ border-bottom: 0;
233
+ }
234
+ .m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-first {
235
+ padding-top: 0 !important;
236
+ }
237
+ .m-container-fieldset.fieldset-in-card-fit:last-child {
238
+ padding-bottom: 0 !important;
239
+ border-bottom: 0;
240
+ }
241
+ .m-container-fieldset.fieldset-in-card-fit:first {
242
+ padding-top: 0 !important;
243
+ }
244
+
151
245
  fieldset.m-fieldset {
152
246
  position: relative;
153
247
  border: 1px solid rgb(229, 229, 229);
@@ -174,6 +268,9 @@ fieldset.m-fieldset .m-form-tip {
174
268
  margin-left: 5px;
175
269
  }
176
270
 
271
+ .m-fields-group-list .m-fields-group-list-item.tmagic-design-card--flat:last-child {
272
+ border: 0;
273
+ }
177
274
  .m-fields-group-list .el-button--text {
178
275
  padding: 0;
179
276
  margin-bottom: 7px;
@@ -192,23 +289,23 @@ fieldset.m-fieldset .m-form-tip {
192
289
  .m-fields-group-list .m-fields-group-list-item:last-of-type {
193
290
  border-bottom: 0;
194
291
  }
195
- .m-fields-group-list .tmagic-design-card .el-card__header {
196
- padding: 5px 20px;
197
- }
198
- .m-fields-group-list .tmagic-design-card .t-card__header {
199
- padding: 5px 0;
292
+ .m-fields-group-list .m-fields-group-list-item .m-fields-group-list-item-header {
293
+ display: flex;
294
+ align-items: center;
295
+ gap: 8px;
200
296
  }
201
297
  .m-fields-group-list .m-fields-group-list-footer {
202
298
  display: flex;
203
299
  justify-content: space-between;
204
300
  margin-top: 10px;
301
+ margin-bottom: 16px;
205
302
  }
206
303
 
207
304
  .m-form-panel .el-card__header:hover {
208
305
  background: #f2f6fc;
209
306
  }
210
307
  .m-form-panel .el-card__header a {
211
- color: #409eff;
308
+ color: var(--el-color-primary, #409eff);
212
309
  }
213
310
  .m-form-panel .el-card__body {
214
311
  padding: 10px;
@@ -287,8 +384,8 @@ fieldset.m-fieldset .m-form-tip {
287
384
  margin-right: auto;
288
385
  min-width: 50px;
289
386
  outline: none;
290
- border-color: #409eff;
291
- color: #409eff;
387
+ border-color: var(--el-color-primary, #409eff);
388
+ color: var(--el-color-primary, #409eff);
292
389
  width: 10px;
293
390
  }
294
391
  .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab::before {
@@ -325,4 +422,20 @@ fieldset.m-fieldset .m-form-tip {
325
422
  display: flex;
326
423
  align-items: center;
327
424
  justify-content: space-between;
425
+ }
426
+
427
+ .m-fields-radio-group__option {
428
+ display: flex;
429
+ align-items: center;
430
+ }
431
+
432
+ .m-fields-radio-group__text {
433
+ display: inline-block;
434
+ vertical-align: middle;
435
+ white-space: pre-line;
436
+ line-height: 20px;
437
+ }
438
+
439
+ .m-fields-radio-group__icon_with_text {
440
+ margin-right: 8px;
328
441
  }/*$vite$:1*/
package/dist/style.css CHANGED
@@ -16,6 +16,9 @@
16
16
  .m-form-container .tmagic-design-form-item.show-before-diff {
17
17
  background: #f7dadd;
18
18
  }
19
+ .m-form-container .m-form-title-extra {
20
+ margin-left: 8px;
21
+ }
19
22
 
20
23
  .m-form-dialog .el-dialog__body {
21
24
  padding: 0 !important;
@@ -76,6 +79,10 @@
76
79
  margin-bottom: var(--td-comp-margin-xxl);
77
80
  }
78
81
 
82
+ .m-form-container .m-form-container-expand {
83
+ text-align: center;
84
+ }
85
+
79
86
  .magic-datetime-picker-popper .el-picker-panel__footer button:first-child {
80
87
  display: none;
81
88
  }
@@ -85,6 +92,24 @@
85
92
  align-items: center;
86
93
  width: 100%;
87
94
  }
95
+ .m-fields-text--static {
96
+ gap: 6px;
97
+ min-height: 32px;
98
+ }
99
+ .m-fields-text--static .m-fields-text__prepend {
100
+ color: var(--el-text-color-secondary, #909399);
101
+ }
102
+ .m-fields-text--static .m-fields-text__value {
103
+ color: var(--el-text-color-regular, #606266);
104
+ overflow: hidden;
105
+ text-overflow: ellipsis;
106
+ white-space: nowrap;
107
+ }
108
+ .m-fields-text--static .m-fields-text__icon {
109
+ width: 16px;
110
+ height: 16px;
111
+ cursor: pointer;
112
+ }
88
113
 
89
114
  .m-form-validate__warning {
90
115
  color: var(--el-color-warning);
@@ -110,6 +135,16 @@
110
135
  outline: none;
111
136
  }
112
137
 
138
+ .m-container-text.m-fields-title-container .tmagic-design-form-item .el-form-item__label {
139
+ color: #0f1113;
140
+ font-weight: 500;
141
+ font-size: 16px;
142
+ }
143
+ .m-container-text.m-fields-title-container .tmagic-design-form-item {
144
+ line-height: 24px;
145
+ margin-bottom: 16px;
146
+ }
147
+
113
148
  .tmagic-form-text-popper[data-popper-placement^=top] > .tmagic-form-text-popper-arrow {
114
149
  bottom: -4px;
115
150
  }
@@ -148,6 +183,65 @@ div.m-fields-link {
148
183
  width: fit-content;
149
184
  }
150
185
 
186
+ a.magic-admin-link {
187
+ width: 100%;
188
+ box-sizing: border-box;
189
+ border-radius: 4px;
190
+ border: 1px solid #e6e6e6;
191
+ background-color: #fafafa;
192
+ padding: 0 8px;
193
+ height: 28px;
194
+ display: inline-flex;
195
+ gap: 4px;
196
+ align-items: center;
197
+ text-decoration: none;
198
+ }
199
+ a.magic-admin-link i {
200
+ margin-right: 4px;
201
+ }
202
+
203
+ .m-container-fieldset.no-border-fieldset.fieldset-in-row > fieldset.m-fieldset legend {
204
+ left: 0;
205
+ }
206
+ .m-container-fieldset.no-border-fieldset > fieldset.m-fieldset {
207
+ border: 0;
208
+ }
209
+ .m-container-fieldset.no-border-fieldset > fieldset.m-fieldset legend {
210
+ position: relative;
211
+ left: -5px;
212
+ font-size: 16px;
213
+ font-weight: 500;
214
+ line-height: 24px;
215
+ padding: 0;
216
+ }
217
+ .m-container-fieldset.fieldset-in-card-fit {
218
+ border-bottom: 1px solid #e6e6e6;
219
+ }
220
+ .m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset {
221
+ padding: 16px 0 16px 0 !important;
222
+ border: 0;
223
+ margin-top: 0;
224
+ margin-bottom: 0;
225
+ }
226
+ .m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset legend {
227
+ position: relative;
228
+ top: 10px;
229
+ }
230
+ .m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-last {
231
+ padding-bottom: 0 !important;
232
+ border-bottom: 0;
233
+ }
234
+ .m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-first {
235
+ padding-top: 0 !important;
236
+ }
237
+ .m-container-fieldset.fieldset-in-card-fit:last-child {
238
+ padding-bottom: 0 !important;
239
+ border-bottom: 0;
240
+ }
241
+ .m-container-fieldset.fieldset-in-card-fit:first {
242
+ padding-top: 0 !important;
243
+ }
244
+
151
245
  fieldset.m-fieldset {
152
246
  position: relative;
153
247
  border: 1px solid rgb(229, 229, 229);
@@ -174,6 +268,9 @@ fieldset.m-fieldset .m-form-tip {
174
268
  margin-left: 5px;
175
269
  }
176
270
 
271
+ .m-fields-group-list .m-fields-group-list-item.tmagic-design-card--flat:last-child {
272
+ border: 0;
273
+ }
177
274
  .m-fields-group-list .el-button--text {
178
275
  padding: 0;
179
276
  margin-bottom: 7px;
@@ -192,23 +289,23 @@ fieldset.m-fieldset .m-form-tip {
192
289
  .m-fields-group-list .m-fields-group-list-item:last-of-type {
193
290
  border-bottom: 0;
194
291
  }
195
- .m-fields-group-list .tmagic-design-card .el-card__header {
196
- padding: 5px 20px;
197
- }
198
- .m-fields-group-list .tmagic-design-card .t-card__header {
199
- padding: 5px 0;
292
+ .m-fields-group-list .m-fields-group-list-item .m-fields-group-list-item-header {
293
+ display: flex;
294
+ align-items: center;
295
+ gap: 8px;
200
296
  }
201
297
  .m-fields-group-list .m-fields-group-list-footer {
202
298
  display: flex;
203
299
  justify-content: space-between;
204
300
  margin-top: 10px;
301
+ margin-bottom: 16px;
205
302
  }
206
303
 
207
304
  .m-form-panel .el-card__header:hover {
208
305
  background: #f2f6fc;
209
306
  }
210
307
  .m-form-panel .el-card__header a {
211
- color: #409eff;
308
+ color: var(--el-color-primary, #409eff);
212
309
  }
213
310
  .m-form-panel .el-card__body {
214
311
  padding: 10px;
@@ -287,8 +384,8 @@ fieldset.m-fieldset .m-form-tip {
287
384
  margin-right: auto;
288
385
  min-width: 50px;
289
386
  outline: none;
290
- border-color: #409eff;
291
- color: #409eff;
387
+ border-color: var(--el-color-primary, #409eff);
388
+ color: var(--el-color-primary, #409eff);
292
389
  width: 10px;
293
390
  }
294
391
  .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab::before {
@@ -325,4 +422,20 @@ fieldset.m-fieldset .m-form-tip {
325
422
  display: flex;
326
423
  align-items: center;
327
424
  justify-content: space-between;
425
+ }
426
+
427
+ .m-fields-radio-group__option {
428
+ display: flex;
429
+ align-items: center;
430
+ }
431
+
432
+ .m-fields-radio-group__text {
433
+ display: inline-block;
434
+ vertical-align: middle;
435
+ white-space: pre-line;
436
+ line-height: 20px;
437
+ }
438
+
439
+ .m-fields-radio-group__icon_with_text {
440
+ margin-right: 8px;
328
441
  }/*$vite$:1*/