@tmagic/editor 1.8.0-beta.13 → 1.8.0-beta.14

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 (120) hide show
  1. package/dist/es/Editor.vue_vue_type_script_setup_true_lang.js +15 -3
  2. package/dist/es/components/ContentMenu.vue_vue_type_script_setup_true_lang.js +11 -4
  3. package/dist/es/components/FloatingBox.vue_vue_type_script_setup_true_lang.js +7 -2
  4. package/dist/es/fields/Code.vue_vue_type_script_setup_true_lang.js +4 -1
  5. package/dist/es/fields/CodeLink.vue_vue_type_script_setup_true_lang.js +4 -1
  6. package/dist/es/fields/CodeSelect.vue_vue_type_script_setup_true_lang.js +80 -55
  7. package/dist/es/fields/CodeSelectCol.vue_vue_type_script_setup_true_lang.js +5 -1
  8. package/dist/es/fields/CondOpSelect.vue_vue_type_script_setup_true_lang.js +4 -1
  9. package/dist/es/fields/DataSourceFieldSelect/Index.vue_vue_type_script_setup_true_lang.js +10 -7
  10. package/dist/es/fields/DataSourceFields.vue_vue_type_script_setup_true_lang.js +4 -1
  11. package/dist/es/fields/DataSourceInput.vue_vue_type_script_setup_true_lang.js +4 -1
  12. package/dist/es/fields/DataSourceMethodSelect.vue_vue_type_script_setup_true_name_true_lang.js +4 -1
  13. package/dist/es/fields/DataSourceMethods.vue_vue_type_script_setup_true_lang.js +4 -1
  14. package/dist/es/fields/DataSourceMocks.vue_vue_type_script_setup_true_lang.js +4 -1
  15. package/dist/es/fields/DataSourceSelect.vue_vue_type_script_setup_true_lang.js +4 -1
  16. package/dist/es/fields/DisplayConds.vue_vue_type_script_setup_true_lang.js +8 -2
  17. package/dist/es/fields/EventSelect.vue_vue_type_script_setup_true_lang.js +99 -64
  18. package/dist/es/fields/KeyValue.vue_vue_type_script_setup_true_lang.js +4 -1
  19. package/dist/es/fields/PageFragmentSelect.vue_vue_type_script_setup_true_lang.js +4 -1
  20. package/dist/es/fields/StyleSetter/Index.vue_vue_type_script_setup_true_lang.js +5 -4
  21. package/dist/es/fields/StyleSetter/components/BackgroundPosition.vue_vue_type_script_setup_true_lang.js +4 -1
  22. package/dist/es/fields/StyleSetter/components/Border.vue_vue_type_script_setup_true_lang.js +1 -1
  23. package/dist/es/fields/StyleSetter/icons/align-items/Center.js +31 -0
  24. package/dist/es/fields/StyleSetter/icons/align-items/FlexEnd.js +31 -0
  25. package/dist/es/fields/StyleSetter/icons/align-items/FlexStart.js +31 -0
  26. package/dist/es/fields/StyleSetter/icons/align-items/SpaceAround.js +50 -0
  27. package/dist/es/fields/StyleSetter/icons/align-items/SpaceBetween.js +50 -0
  28. package/dist/es/fields/StyleSetter/icons/background-repeat/NoRepeat.js +6 -6
  29. package/dist/es/fields/StyleSetter/icons/background-repeat/Repeat.js +5 -2
  30. package/dist/es/fields/StyleSetter/icons/background-repeat/RepeatX.js +28 -5
  31. package/dist/es/fields/StyleSetter/icons/background-repeat/RepeatY.js +31 -5
  32. package/dist/es/fields/StyleSetter/icons/flex-direction/Column.js +10 -2
  33. package/dist/es/fields/StyleSetter/icons/flex-direction/ColumnReverse.js +10 -2
  34. package/dist/es/fields/StyleSetter/icons/flex-direction/Row.js +10 -2
  35. package/dist/es/fields/StyleSetter/icons/flex-direction/RowReverse.js +10 -2
  36. package/dist/es/fields/StyleSetter/icons/justify-content/Center.js +16 -2
  37. package/dist/es/fields/StyleSetter/icons/justify-content/FlexEnd.js +18 -2
  38. package/dist/es/fields/StyleSetter/icons/justify-content/FlexStart.js +18 -2
  39. package/dist/es/fields/StyleSetter/icons/justify-content/SpaceAround.js +36 -2
  40. package/dist/es/fields/StyleSetter/icons/justify-content/SpaceBetween.js +32 -2
  41. package/dist/es/fields/StyleSetter/pro/Background.vue_vue_type_script_setup_true_lang.js +7 -6
  42. package/dist/es/fields/StyleSetter/pro/Font.vue_vue_type_script_setup_true_lang.js +6 -3
  43. package/dist/es/fields/StyleSetter/pro/Layout.vue_vue_type_script_setup_true_lang.js +47 -25
  44. package/dist/es/fields/UISelect.vue_vue_type_script_setup_true_lang.js +4 -1
  45. package/dist/es/icons/DatasourceIcon.js +17 -0
  46. package/dist/es/index.js +2 -2
  47. package/dist/es/layouts/Framework.vue_vue_type_script_setup_true_lang.js +14 -10
  48. package/dist/es/layouts/props-panel/PropsPanel.vue_vue_type_script_setup_true_lang.js +10 -1
  49. package/dist/es/layouts/sidebar/Sidebar.vue_vue_type_script_setup_true_lang.js +3 -3
  50. package/dist/es/plugin.js +2 -1
  51. package/dist/es/services/editor.js +54 -13
  52. package/dist/es/services/ui.js +5 -3
  53. package/dist/es/style.css +303 -40
  54. package/dist/es/utils/config.js +4 -1
  55. package/dist/es/utils/const.js +2 -2
  56. package/dist/es/utils/props.js +43 -29
  57. package/dist/style.css +303 -40
  58. package/dist/themes/magic-admin.css +3000 -0
  59. package/dist/tmagic-editor.umd.cjs +1066 -449
  60. package/package.json +7 -7
  61. package/src/Editor.vue +22 -1
  62. package/src/components/ContentMenu.vue +10 -2
  63. package/src/components/FloatingBox.vue +8 -2
  64. package/src/editorProps.ts +4 -0
  65. package/src/fields/CodeSelect.vue +54 -43
  66. package/src/fields/CodeSelectCol.vue +1 -0
  67. package/src/fields/DataSourceFieldSelect/Index.vue +14 -5
  68. package/src/fields/DisplayConds.vue +4 -1
  69. package/src/fields/EventSelect.vue +56 -32
  70. package/src/fields/StyleSetter/Index.vue +1 -4
  71. package/src/fields/StyleSetter/components/Border.vue +1 -1
  72. package/src/fields/StyleSetter/icons/align-items/Center.vue +19 -0
  73. package/src/fields/StyleSetter/icons/align-items/FlexEnd.vue +19 -0
  74. package/src/fields/StyleSetter/icons/align-items/FlexStart.vue +19 -0
  75. package/src/fields/StyleSetter/icons/align-items/SpaceAround.vue +34 -0
  76. package/src/fields/StyleSetter/icons/align-items/SpaceBetween.vue +34 -0
  77. package/src/fields/StyleSetter/icons/align-items/index.ts +5 -0
  78. package/src/fields/StyleSetter/icons/background-repeat/NoRepeat.vue +20 -4
  79. package/src/fields/StyleSetter/icons/background-repeat/Repeat.vue +10 -28
  80. package/src/fields/StyleSetter/icons/background-repeat/RepeatX.vue +4 -5
  81. package/src/fields/StyleSetter/icons/background-repeat/RepeatY.vue +4 -5
  82. package/src/fields/StyleSetter/icons/flex-direction/Column.vue +4 -3
  83. package/src/fields/StyleSetter/icons/flex-direction/ColumnReverse.vue +4 -3
  84. package/src/fields/StyleSetter/icons/flex-direction/Row.vue +4 -3
  85. package/src/fields/StyleSetter/icons/flex-direction/RowReverse.vue +4 -3
  86. package/src/fields/StyleSetter/icons/justify-content/Center.vue +5 -2
  87. package/src/fields/StyleSetter/icons/justify-content/FlexEnd.vue +15 -2
  88. package/src/fields/StyleSetter/icons/justify-content/FlexStart.vue +15 -2
  89. package/src/fields/StyleSetter/icons/justify-content/SpaceAround.vue +28 -3
  90. package/src/fields/StyleSetter/icons/justify-content/SpaceBetween.vue +28 -2
  91. package/src/fields/StyleSetter/pro/Background.vue +7 -2
  92. package/src/fields/StyleSetter/pro/Font.vue +3 -3
  93. package/src/fields/StyleSetter/pro/Layout.vue +98 -28
  94. package/src/icons/DatasourceIcon.vue +7 -0
  95. package/src/index.ts +3 -0
  96. package/src/layouts/Framework.vue +7 -1
  97. package/src/layouts/props-panel/PropsPanel.vue +19 -1
  98. package/src/layouts/sidebar/Sidebar.vue +3 -3
  99. package/src/plugin.ts +3 -2
  100. package/src/services/editor.ts +54 -11
  101. package/src/services/ui.ts +20 -5
  102. package/src/theme/code-block.scss +37 -0
  103. package/src/theme/common/var.scss +1 -1
  104. package/src/theme/component-list-panel.scss +2 -2
  105. package/src/theme/data-source-field.scss +4 -0
  106. package/src/theme/display-conds.scss +11 -0
  107. package/src/theme/event.scss +58 -4
  108. package/src/theme/framework.scss +4 -1
  109. package/src/theme/history-list-panel.scss +9 -9
  110. package/src/theme/nav-menu.scss +5 -1
  111. package/src/theme/props-panel.scss +2 -1
  112. package/src/theme/style-setter/border.scss +14 -5
  113. package/src/theme/theme.scss +1 -0
  114. package/src/theme/themes/magic-admin/index.scss +214 -0
  115. package/src/theme/ui-select.scss +1 -1
  116. package/src/type.ts +27 -6
  117. package/src/utils/config.ts +9 -1
  118. package/src/utils/const.ts +3 -2
  119. package/src/utils/props.ts +22 -9
  120. package/types/index.d.ts +88 -35
@@ -18,13 +18,16 @@ import dep_default from "./services/dep.js";
18
18
  import keybinding_default from "./services/keybinding.js";
19
19
  import stageOverlay_default from "./services/stageOverlay.js";
20
20
  import { initServiceEvents, initServiceState } from "./initService.js";
21
- import { createBlock, createVNode, defineComponent, mergeDefaults, openBlock, provide, ref, renderSlot, unref, withCtx } from "vue";
21
+ import { M_THEME_KEY } from "@tmagic/design";
22
+ import { computed, createBlock, createVNode, defineComponent, mergeDefaults, openBlock, provide, ref, renderSlot, unref, withCtx } from "vue";
22
23
  import { EventEmitter } from "events";
23
24
  //#region packages/editor/src/Editor.vue?vue&type=script&setup=true&lang.ts
24
25
  var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
25
26
  name: "MEditor",
26
27
  __name: "Editor",
27
28
  props: /*@__PURE__*/ mergeDefaults({
29
+ isLargeStageContainer: { type: Boolean },
30
+ theme: {},
28
31
  modelValue: {},
29
32
  componentGroupList: {},
30
33
  datasourceList: {},
@@ -138,6 +141,7 @@ var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
138
141
  * 与 PropsPanel 通过 `:extend-state` 显式传入的方式保持等价。
139
142
  */
140
143
  provide("extendFormState", props.extendFormState);
144
+ provide("isLargeStageContainer", computed(() => props.isLargeStageContainer));
141
145
  /**
142
146
  * 提供 PropsPanel 主属性表单的 formState getter,供历史差异弹窗复用,
143
147
  * 让 CompareForm 与 PropsPanel 的 filterFunction 上下文保持一致。
@@ -150,6 +154,12 @@ var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
150
154
  */
151
155
  provide("historyListExtraTabs", props.historyListExtraTabs);
152
156
  provide("eventBus", new EventEmitter());
157
+ /**
158
+ * 把当前主题以响应式 ref 形式 provide 给后代,供包含 `Teleport` 的组件
159
+ * (如 `TMagicPopover` / `FloatingBox` / `ContentMenu`)在传送目标上挂 `m-theme--<theme>`
160
+ * 类,让主题级 CSS 变量在 portal 节点上也能命中。详见 `@tmagic/design/theme.ts`。
161
+ */
162
+ provide(M_THEME_KEY, computed(() => props.theme ?? ""));
153
163
  const propsPanelMountedHandler = (e) => {
154
164
  propsPanelRef.value = e;
155
165
  emit("props-panel-mounted", e);
@@ -173,7 +183,8 @@ var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
173
183
  "disabled-page-fragment": __props.disabledPageFragment,
174
184
  "page-bar-sort-options": __props.pageBarSortOptions,
175
185
  "page-filter-function": __props.pageFilterFunction,
176
- "hide-sidebar": __props.hideSidebar
186
+ "hide-sidebar": __props.hideSidebar,
187
+ theme: __props.theme
177
188
  }, {
178
189
  header: withCtx(() => [renderSlot(_ctx.$slots, "header")]),
179
190
  nav: withCtx(() => [renderSlot(_ctx.$slots, "nav", { editorService: unref(editor_default) }, () => [createVNode(NavMenu_default, { data: __props.menu }, null, 8, ["data"])])]),
@@ -254,7 +265,8 @@ var Editor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
254
265
  "disabled-page-fragment",
255
266
  "page-bar-sort-options",
256
267
  "page-filter-function",
257
- "hide-sidebar"
268
+ "hide-sidebar",
269
+ "theme"
258
270
  ]);
259
271
  };
260
272
  }
@@ -1,6 +1,6 @@
1
1
  import ToolButton_default from "./ToolButton.js";
2
- import { useZIndex } from "@tmagic/design";
3
- import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, resolveComponent, useTemplateRef, vShow, withCtx, withDirectives, withModifiers } from "vue";
2
+ import { useThemeClass, useZIndex } from "@tmagic/design";
3
+ import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, resolveComponent, unref, useTemplateRef, vShow, withCtx, withDirectives, withModifiers } from "vue";
4
4
  //#region packages/editor/src/components/ContentMenu.vue?vue&type=script&setup=true&lang.ts
5
5
  var ContentMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
6
6
  name: "MEditorContentMenu",
@@ -29,6 +29,13 @@ var ContentMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
29
29
  const buttonRefs = useTemplateRef("buttons");
30
30
  const subMenuRef = useTemplateRef("subMenu");
31
31
  const visible = ref(false);
32
+ /**
33
+ * 主题修饰类(来自最近的 `<MEditor>` / `<MForm>` 祖先 provide)。
34
+ * - 顶层 `ContentMenu` 渲染在编辑器子树中,加上去是冗余但无害;
35
+ * - 子菜单(递归 `<content-menu :is-sub-menu="true">` 被 `<teleport to="body">` 送到 body)
36
+ * 不在编辑器子树中,必须显式挂上主题类,主题级 CSS 变量才能命中。
37
+ */
38
+ const themeClass = useThemeClass();
32
39
  const subMenuData = ref([]);
33
40
  const zIndex = useZIndex();
34
41
  const curZIndex = ref(0);
@@ -118,8 +125,8 @@ var ContentMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
118
125
  persisted: ""
119
126
  }, {
120
127
  default: withCtx(() => [withDirectives(createElementVNode("div", {
121
- class: "magic-editor-content-menu",
122
128
  ref: "menu",
129
+ class: normalizeClass(["magic-editor-content-menu", unref(themeClass)]),
123
130
  style: normalizeStyle(menuStyle.value),
124
131
  onMouseenter: _cache[0] || (_cache[0] = ($event) => mouseenterHandler()),
125
132
  onContextmenu: _cache[1] || (_cache[1] = withModifiers(() => {}, ["prevent"]))
@@ -150,7 +157,7 @@ var ContentMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
150
157
  "is-sub-menu": true,
151
158
  onHide: hide
152
159
  }, null, 8, ["active", "menu-data"])) : createCommentVNode("v-if", true)]))
153
- ], 36), [[vShow, visible.value]])]),
160
+ ], 38), [[vShow, visible.value]])]),
154
161
  _: 3
155
162
  });
156
163
  };
@@ -1,5 +1,5 @@
1
1
  import Icon_default from "./Icon.js";
2
- import { TMagicButton, useZIndex } from "@tmagic/design";
2
+ import { TMagicButton, useThemeClass, useZIndex } from "@tmagic/design";
3
3
  import { Teleport, computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeStyle, onBeforeUnmount, openBlock, provide, ref, renderSlot, toDisplayString, unref, useModel, useTemplateRef, watch, withCtx } from "vue";
4
4
  import { Close } from "@element-plus/icons-vue";
5
5
  import VanillaMoveable from "moveable";
@@ -43,6 +43,11 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
43
43
  const props = __props;
44
44
  const targetEl = useTemplateRef("target");
45
45
  const titleEl = useTemplateRef("title");
46
+ /**
47
+ * 主题修饰类(来自最近的 `<MEditor>` / `<MForm>` 祖先 provide)。
48
+ * 挂在 `Teleport` 出去的浮动面板根节点上,让主题级 CSS 变量在 portal 节点上也能命中。
49
+ */
50
+ const themeClass = useThemeClass();
46
51
  const zIndex = useZIndex();
47
52
  const curZIndex = ref(0);
48
53
  const titleHeight = ref(0);
@@ -179,7 +184,7 @@ var FloatingBox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
179
184
  to: "body"
180
185
  }, [createElementVNode("div", mergeProps({
181
186
  ref: "target",
182
- class: "m-editor-float-box"
187
+ class: ["m-editor-float-box", unref(themeClass)]
183
188
  }, _ctx.$attrs, {
184
189
  style: {
185
190
  ...style.value,
@@ -17,7 +17,10 @@ var Code_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCompo
17
17
  },
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 CodeLink_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"],
21
24
  setup(__props, { emit: __emit }) {
@@ -1,9 +1,10 @@
1
1
  import { useServices } from "../hooks/use-services.js";
2
2
  import { MContainer } from "@tmagic/form";
3
- import { TMagicCard } from "@tmagic/design";
3
+ import { TMagicButton, TMagicCard } from "@tmagic/design";
4
4
  import { HookCodeType, HookType } from "@tmagic/core";
5
- import { computed, createElementBlock, createVNode, defineComponent, normalizeClass, openBlock, unref, watch, withCtx } from "vue";
5
+ import { computed, createElementBlock, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, watch, withCtx } from "vue";
6
6
  import { isEmpty } from "lodash-es";
7
+ import { Plus } from "@element-plus/icons-vue";
7
8
  //#region packages/editor/src/fields/CodeSelect.vue?vue&type=script&setup=true&lang.ts
8
9
  var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
9
10
  name: "MFieldsCodeSelect",
@@ -18,7 +19,10 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
18
19
  disabled: { type: Boolean },
19
20
  size: {},
20
21
  lastValues: {},
21
- isCompare: { type: Boolean }
22
+ isCompare: { type: Boolean },
23
+ text: {},
24
+ labelWidth: {},
25
+ labelPosition: {}
22
26
  },
23
27
  emits: ["change"],
24
28
  setup(__props, { emit: __emit }) {
@@ -39,11 +43,21 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
39
43
  * 仅当存在历史值时才启用对比,避免 lastValues 缺失时退化为「全部新增」的空对比。
40
44
  */
41
45
  const isCompareMode = computed(() => Boolean(props.isCompare && props.lastValues));
46
+ const newHandler = () => {
47
+ const defaultCode = {
48
+ codeType: HookCodeType.CODE,
49
+ codeId: ""
50
+ };
51
+ const name = props.config.name || "";
52
+ const hookData = props.model[name]?.hookData || [];
53
+ emit("change", defaultCode, { modifyKey: `hookData.${hookData.length}` });
54
+ };
42
55
  const codeConfig = computed(() => ({
43
56
  type: "group-list",
44
57
  name: "hookData",
45
58
  enableToggleMode: false,
46
59
  expandAll: true,
60
+ addable: () => false,
47
61
  title: (mForm, { model, index }) => {
48
62
  if (model.codeType === HookCodeType.DATA_SOURCE_METHOD) {
49
63
  if (Array.isArray(model.codeId)) {
@@ -56,57 +70,54 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
56
70
  if (codeContent) return codeContent.name;
57
71
  return model.codeId || index;
58
72
  },
59
- items: [{
60
- type: "row",
61
- items: [
62
- {
63
- type: "select",
64
- name: "codeType",
65
- span: 6,
66
- options: [{
67
- value: HookCodeType.CODE,
68
- text: "代码块"
69
- }, {
70
- value: HookCodeType.DATA_SOURCE_METHOD,
71
- text: "数据源方法"
72
- }],
73
- rules: [{
74
- typeMatch: true,
75
- trigger: "change"
76
- }],
77
- defaultValue: HookCodeType.CODE,
78
- onChange: (_mForm, v, { setModel }) => {
79
- if (v === HookCodeType.DATA_SOURCE_METHOD) setModel("codeId", []);
80
- else setModel("codeId", "");
81
- return v;
82
- }
83
- },
84
- {
85
- type: "code-select-col",
86
- name: "codeId",
87
- span: 18,
88
- labelWidth: 0,
89
- display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
90
- notEditable: () => !codeBlockService.getEditStatus(),
91
- rules: [{
92
- typeMatch: true,
93
- trigger: "change"
94
- }]
95
- },
96
- {
97
- type: "data-source-method-select",
98
- name: "codeId",
99
- span: 18,
100
- labelWidth: 0,
101
- display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
102
- notEditable: () => !dataSourceService.get("editable"),
103
- rules: [{
104
- typeMatch: true,
105
- trigger: "change"
106
- }]
73
+ titlePrefix: props.config.name === void 0 ? void 0 : String(props.config.name),
74
+ items: [
75
+ {
76
+ text: "代码类型",
77
+ type: "select",
78
+ name: "codeType",
79
+ labelPosition: "right",
80
+ rules: [{
81
+ typeMatch: true,
82
+ trigger: "change"
83
+ }],
84
+ options: [{
85
+ value: HookCodeType.CODE,
86
+ text: "代码块"
87
+ }, {
88
+ value: HookCodeType.DATA_SOURCE_METHOD,
89
+ text: "数据源方法"
90
+ }],
91
+ defaultValue: HookCodeType.CODE,
92
+ onChange: (_mForm, v, { setModel }) => {
93
+ if (v === HookCodeType.DATA_SOURCE_METHOD) setModel("codeId", []);
94
+ else setModel("codeId", "");
95
+ return v;
107
96
  }
108
- ]
109
- }]
97
+ },
98
+ {
99
+ type: "code-select-col",
100
+ name: "codeId",
101
+ text: "代码块",
102
+ rules: [{
103
+ typeMatch: true,
104
+ trigger: "change"
105
+ }],
106
+ display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
107
+ notEditable: () => !codeBlockService.getEditStatus()
108
+ },
109
+ {
110
+ type: "data-source-method-select",
111
+ name: "codeId",
112
+ text: "数据源字段",
113
+ rules: [{
114
+ typeMatch: true,
115
+ trigger: "change"
116
+ }],
117
+ display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
118
+ notEditable: () => !dataSourceService.get("editable")
119
+ }
120
+ ]
110
121
  }));
111
122
  watch(() => props.model[props.name], (value) => {
112
123
  if (isEmpty(value)) props.model[props.name] = {
@@ -116,10 +127,11 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
116
127
  }, { immediate: true });
117
128
  const changeHandler = (v, eventData) => emit("change", v, eventData);
118
129
  return (_ctx, _cache) => {
119
- return openBlock(), createElementBlock("div", { class: normalizeClass(["m-fields-code-select", __props.config.className]) }, [createVNode(unref(TMagicCard), null, {
130
+ return openBlock(), createElementBlock("div", { class: normalizeClass(["m-fields-code-select", __props.config.className]) }, [createVNode(unref(TMagicCard), { flat: __props.config.flat }, {
120
131
  default: withCtx(() => [createVNode(unref(MContainer), {
121
132
  config: codeConfig.value,
122
133
  size: __props.size,
134
+ class: "code-select-content",
123
135
  prop: __props.prop,
124
136
  disabled: __props.disabled,
125
137
  "is-compare": isCompareMode.value,
@@ -134,9 +146,22 @@ var CodeSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
134
146
  "is-compare",
135
147
  "last-values",
136
148
  "model"
149
+ ]), createVNode(unref(TMagicButton), {
150
+ class: "create-button fullWidth",
151
+ icon: unref(Plus),
152
+ size: __props.size,
153
+ disabled: __props.disabled,
154
+ onClick: _cache[0] || (_cache[0] = ($event) => newHandler())
155
+ }, {
156
+ default: withCtx(() => [createTextVNode("添加" + toDisplayString(__props.config.text), 1)]),
157
+ _: 1
158
+ }, 8, [
159
+ "icon",
160
+ "size",
161
+ "disabled"
137
162
  ])]),
138
163
  _: 1
139
- })], 2);
164
+ }, 8, ["flat"])], 2);
140
165
  };
141
166
  }
142
167
  });
@@ -26,7 +26,10 @@ var CodeSelectCol_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
26
26
  },
27
27
  size: {},
28
28
  lastValues: {},
29
- isCompare: { type: Boolean }
29
+ isCompare: { type: Boolean },
30
+ text: {},
31
+ labelWidth: {},
32
+ labelPosition: {}
30
33
  },
31
34
  emits: ["change"],
32
35
  setup(__props, { emit: __emit }) {
@@ -72,6 +75,7 @@ var CodeSelectCol_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
72
75
  type: "select",
73
76
  name: props.name,
74
77
  disabled: props.disabled,
78
+ text: props.config.text,
75
79
  options: () => {
76
80
  if (codeDsl.value) return map(codeDsl.value, (value, key) => ({
77
81
  text: `${value.name}(${key})`,
@@ -17,7 +17,10 @@ var CondOpSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
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 }) {
@@ -1,13 +1,12 @@
1
1
  import { useServices } from "../../hooks/use-services.js";
2
2
  import Icon_default from "../../components/Icon.js";
3
+ import DatasourceIcon_default from "../../icons/DatasourceIcon.js";
3
4
  import FieldSelect_default from "./FieldSelect.js";
4
5
  import { getFormField } from "@tmagic/form";
5
6
  import { TMagicButton, TMagicTooltip, tMagicMessage } from "@tmagic/design";
6
7
  import { DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX, removeDataSourceFieldPrefix } from "@tmagic/utils";
7
- import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, inject, openBlock, ref, resolveComponent, resolveDynamicComponent, unref, watch, withCtx } from "vue";
8
- import { Coin } from "@element-plus/icons-vue";
8
+ import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, inject, normalizeClass, openBlock, ref, resolveComponent, resolveDynamicComponent, unref, watch, withCtx } from "vue";
9
9
  //#region packages/editor/src/fields/DataSourceFieldSelect/Index.vue?vue&type=script&setup=true&lang.ts
10
- var _hoisted_1 = { class: "m-fields-data-source-field-select" };
11
10
  var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
12
11
  name: "MFieldsDataSourceFieldSelect",
13
12
  __name: "Index",
@@ -24,13 +23,17 @@ var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
24
23
  },
25
24
  size: {},
26
25
  lastValues: {},
27
- isCompare: { type: Boolean }
26
+ isCompare: { type: Boolean },
27
+ text: {},
28
+ labelWidth: {},
29
+ labelPosition: {}
28
30
  },
29
31
  emits: ["change"],
30
32
  setup(__props, { emit: __emit }) {
31
33
  const emit = __emit;
32
34
  const props = __props;
33
35
  const showDataSourceFieldSelect = ref(false);
36
+ const isSelectValid = computed(() => !disabledDataSource.value && (showDataSourceFieldSelect.value || !props.config.fieldConfig));
34
37
  watch(() => props.model[props.name], (value) => {
35
38
  if (Array.isArray(value) && typeof value[0] === "string" && value[0].startsWith(DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX)) showDataSourceFieldSelect.value = true;
36
39
  else showDataSourceFieldSelect.value = false;
@@ -100,7 +103,7 @@ var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
100
103
  showDataSourceFieldSelect.value = !showDataSourceFieldSelect.value;
101
104
  };
102
105
  return (_ctx, _cache) => {
103
- return openBlock(), createElementBlock("div", _hoisted_1, [!disabledDataSource.value && (showDataSourceFieldSelect.value || !__props.config.fieldConfig) ? (openBlock(), createBlock(FieldSelect_default, {
106
+ return openBlock(), createElementBlock("div", { class: normalizeClass(["m-fields-data-source-field-select", { [`data-source-field-${type.value}`]: !isSelectValid.value }]) }, [isSelectValid.value ? (openBlock(), createBlock(FieldSelect_default, {
104
107
  key: 0,
105
108
  "model-value": __props.model[__props.name],
106
109
  disabled: __props.disabled,
@@ -151,7 +154,7 @@ var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
151
154
  disabled: __props.disabled,
152
155
  onClick: onToggleDataSourceFieldSelectHandler
153
156
  }, {
154
- default: withCtx(() => [createVNode(Icon_default, { icon: unref(Coin) }, null, 8, ["icon"])]),
157
+ default: withCtx(() => [createVNode(Icon_default, { icon: DatasourceIcon_default })]),
155
158
  _: 1
156
159
  }, 8, [
157
160
  "type",
@@ -159,7 +162,7 @@ var Index_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
159
162
  "disabled"
160
163
  ])]),
161
164
  _: 1
162
- }, 8, ["disabled"])) : createCommentVNode("v-if", true)]);
165
+ }, 8, ["disabled"])) : createCommentVNode("v-if", true)], 2);
163
166
  };
164
167
  }
165
168
  });
@@ -30,7 +30,10 @@ var DataSourceFields_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
30
30
  },
31
31
  size: {},
32
32
  lastValues: {},
33
- isCompare: { type: Boolean }
33
+ isCompare: { type: Boolean },
34
+ text: {},
35
+ labelWidth: {},
36
+ labelPosition: {}
34
37
  }, {
35
38
  "width": { default: 670 },
36
39
  "widthModifiers": {},
@@ -31,7 +31,10 @@ var DataSourceInput_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
31
31
  },
32
32
  size: {},
33
33
  lastValues: {},
34
- isCompare: { type: Boolean }
34
+ isCompare: { type: Boolean },
35
+ text: {},
36
+ labelWidth: {},
37
+ labelPosition: {}
35
38
  },
36
39
  emits: ["change"],
37
40
  setup(__props, { emit: __emit }) {
@@ -27,7 +27,10 @@ var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default
27
27
  },
28
28
  size: {},
29
29
  lastValues: {},
30
- isCompare: { type: Boolean }
30
+ isCompare: { type: Boolean },
31
+ text: {},
32
+ labelWidth: {},
33
+ labelPosition: {}
31
34
  },
32
35
  emits: ["change"],
33
36
  setup(__props, { emit: __emit }) {
@@ -25,7 +25,10 @@ var DataSourceMethods_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
25
25
  },
26
26
  size: {},
27
27
  lastValues: {},
28
- isCompare: { type: Boolean }
28
+ isCompare: { type: Boolean },
29
+ text: {},
30
+ labelWidth: {},
31
+ labelPosition: {}
29
32
  },
30
33
  emits: ["change"],
31
34
  setup(__props, { emit: __emit }) {
@@ -30,7 +30,10 @@ var DataSourceMocks_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
30
30
  },
31
31
  size: {},
32
32
  lastValues: {},
33
- isCompare: { type: Boolean }
33
+ isCompare: { type: Boolean },
34
+ text: {},
35
+ labelWidth: {},
36
+ labelPosition: {}
34
37
  }, {
35
38
  "width": { default: 670 },
36
39
  "widthModifiers": {},
@@ -23,7 +23,10 @@ var DataSourceSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
23
23
  },
24
24
  size: {},
25
25
  lastValues: {},
26
- isCompare: { type: Boolean }
26
+ isCompare: { type: Boolean },
27
+ text: {},
28
+ labelWidth: {},
29
+ labelPosition: {}
27
30
  },
28
31
  emits: ["change"],
29
32
  setup(__props, { emit: __emit }) {
@@ -19,7 +19,10 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
19
19
  },
20
20
  size: {},
21
21
  lastValues: {},
22
- isCompare: { type: Boolean }
22
+ isCompare: { type: Boolean },
23
+ text: {},
24
+ labelWidth: {},
25
+ labelPosition: {}
23
26
  },
24
27
  emits: ["change"],
25
28
  setup(__props, { emit: __emit }) {
@@ -43,11 +46,14 @@ var DisplayConds_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
43
46
  titlePrefix: props.config.titlePrefix,
44
47
  expandAll: true,
45
48
  enableToggleMode: false,
49
+ flat: props.config.flat,
46
50
  items: [{
47
51
  type: "table",
48
52
  name: "cond",
49
- operateColWidth: 80,
53
+ operateColWidth: props.config.operateColWidth,
50
54
  enableToggleMode: false,
55
+ fixed: props.config.fixed,
56
+ flat: props.config.flat,
51
57
  items: [
52
58
  parentFields.value.length ? {
53
59
  type: "cascader",