@tmagic/editor 1.5.0-beta.9 → 1.5.0

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 (52) hide show
  1. package/dist/style.css +75 -16
  2. package/dist/tmagic-editor.js +797 -518
  3. package/dist/tmagic-editor.umd.cjs +802 -525
  4. package/package.json +12 -10
  5. package/src/Editor.vue +6 -1
  6. package/src/components/CodeBlockEditor.vue +11 -5
  7. package/src/components/CodeParams.vue +3 -3
  8. package/src/editorProps.ts +3 -1
  9. package/src/fields/Code.vue +1 -2
  10. package/src/fields/CodeSelect.vue +13 -11
  11. package/src/fields/CodeSelectCol.vue +32 -5
  12. package/src/fields/CondOpSelect.vue +5 -2
  13. package/src/fields/DataSourceFields.vue +31 -12
  14. package/src/fields/DataSourceMethods.vue +72 -14
  15. package/src/fields/DisplayConds.vue +8 -3
  16. package/src/fields/EventSelect.vue +28 -11
  17. package/src/fields/KeyValue.vue +15 -10
  18. package/src/fields/UISelect.vue +6 -3
  19. package/src/hooks/index.ts +0 -1
  20. package/src/hooks/use-code-block-edit.ts +1 -1
  21. package/src/hooks/use-data-source-edit.ts +3 -2
  22. package/src/hooks/use-filter.ts +1 -1
  23. package/src/hooks/use-node-status.ts +2 -2
  24. package/src/initService.ts +177 -74
  25. package/src/layouts/Framework.vue +8 -4
  26. package/src/layouts/PropsPanel.vue +3 -3
  27. package/src/layouts/page-bar/AddButton.vue +29 -9
  28. package/src/layouts/page-bar/PageBar.vue +78 -65
  29. package/src/layouts/page-bar/PageBarScrollContainer.vue +82 -96
  30. package/src/layouts/page-bar/PageList.vue +5 -3
  31. package/src/layouts/page-bar/Search.vue +67 -0
  32. package/src/layouts/sidebar/Sidebar.vue +3 -0
  33. package/src/layouts/sidebar/code-block/CodeBlockList.vue +6 -1
  34. package/src/layouts/sidebar/data-source/DataSourceConfigPanel.vue +7 -5
  35. package/src/layouts/sidebar/data-source/DataSourceList.vue +6 -1
  36. package/src/layouts/sidebar/layer/use-node-status.ts +2 -3
  37. package/src/layouts/workspace/Workspace.vue +5 -2
  38. package/src/layouts/workspace/viewer/Stage.vue +23 -5
  39. package/src/services/dataSource.ts +12 -5
  40. package/src/services/dep.ts +61 -13
  41. package/src/services/editor.ts +46 -51
  42. package/src/theme/page-bar.scss +38 -16
  43. package/src/theme/search-input.scss +1 -0
  44. package/src/type.ts +2 -1
  45. package/src/utils/data-source/formConfigs/http.ts +2 -0
  46. package/src/utils/data-source/index.ts +2 -2
  47. package/src/utils/editor.ts +78 -22
  48. package/src/utils/idle-task.ts +36 -4
  49. package/src/utils/props.ts +3 -3
  50. package/types/index.d.ts +835 -1169
  51. package/src/hooks/use-data-source-method.ts +0 -100
  52. package/src/layouts/page-bar/SwitchTypeButton.vue +0 -45
@@ -1,100 +0,0 @@
1
- import { nextTick, ref } from 'vue';
2
- import { cloneDeep } from 'lodash-es';
3
-
4
- import type { CodeBlockContent, DataSourceSchema } from '@tmagic/core';
5
- import { tMagicMessage } from '@tmagic/design';
6
-
7
- import CodeBlockEditor from '@editor/components/CodeBlockEditor.vue';
8
- import { getEditorConfig } from '@editor/utils/config';
9
-
10
- export const useDataSourceMethod = () => {
11
- const codeConfig = ref<CodeBlockContent>();
12
- const codeBlockEditor = ref<InstanceType<typeof CodeBlockEditor>>();
13
-
14
- const dataSource = ref<DataSourceSchema>();
15
- const dataSourceMethod = ref('');
16
-
17
- return {
18
- codeConfig,
19
- codeBlockEditor,
20
-
21
- createCode: async (model: DataSourceSchema) => {
22
- codeConfig.value = {
23
- name: '',
24
- content: `({ params, dataSource, app }) => {\n // place your code here\n}`,
25
- params: [],
26
- };
27
-
28
- await nextTick();
29
-
30
- dataSource.value = model;
31
- dataSourceMethod.value = '';
32
-
33
- codeBlockEditor.value?.show();
34
- },
35
-
36
- editCode: async (model: DataSourceSchema, methodName: string) => {
37
- const method = model.methods?.find((method) => method.name === methodName);
38
-
39
- if (!method) {
40
- tMagicMessage.error('获取数据源方法失败');
41
- return;
42
- }
43
-
44
- let codeContent = method.content || `({ params, dataSource, app }) => {\n // place your code here\n}`;
45
-
46
- if (typeof codeContent !== 'string') {
47
- codeContent = codeContent.toString();
48
- }
49
-
50
- codeConfig.value = {
51
- ...cloneDeep(method),
52
- content: codeContent,
53
- };
54
-
55
- await nextTick();
56
-
57
- dataSource.value = model;
58
- dataSourceMethod.value = methodName;
59
-
60
- codeBlockEditor.value?.show();
61
- },
62
-
63
- deleteCode: async (model: DataSourceSchema, methodName: string) => {
64
- if (!model.methods) return;
65
-
66
- const index = model.methods.findIndex((method) => method.name === methodName);
67
-
68
- if (index === -1) {
69
- return;
70
- }
71
-
72
- model.methods.splice(index, 1);
73
- },
74
-
75
- submitCode: (values: CodeBlockContent) => {
76
- if (!dataSource.value) return;
77
-
78
- if (!dataSource.value.methods) {
79
- dataSource.value.methods = [];
80
- }
81
-
82
- if (values.content) {
83
- // 在保存的时候转换代码内容
84
- const parseDSL = getEditorConfig('parseDSL');
85
- if (typeof values.content === 'string') {
86
- values.content = parseDSL<(...args: any[]) => any>(values.content);
87
- }
88
- }
89
-
90
- if (dataSourceMethod.value) {
91
- const index = dataSource.value.methods.findIndex((method) => method.name === dataSourceMethod.value);
92
- dataSource.value.methods.splice(index, 1, values);
93
- } else {
94
- dataSource.value.methods.push(values);
95
- }
96
-
97
- codeBlockEditor.value?.hide();
98
- },
99
- };
100
- };
@@ -1,45 +0,0 @@
1
- <template>
2
- <TMagicButton
3
- v-for="item in data"
4
- class="m-editor-page-bar-switch-type-button"
5
- size="small"
6
- :key="item.type"
7
- link
8
- :class="{ active: modelValue === item.type }"
9
- :type="modelValue === item.type ? 'primary' : ''"
10
- @click="clickHandler(item.type)"
11
- >{{ item.text }}</TMagicButton
12
- >
13
- </template>
14
-
15
- <script setup lang="ts">
16
- import { NodeType } from '@tmagic/core';
17
- import { TMagicButton } from '@tmagic/design';
18
-
19
- defineOptions({
20
- name: 'MEditorPageBarSwitchTypeButton',
21
- });
22
-
23
- defineProps<{
24
- modelValue: NodeType.PAGE | NodeType.PAGE_FRAGMENT;
25
- }>();
26
-
27
- const data: { type: NodeType.PAGE | NodeType.PAGE_FRAGMENT; text: string }[] = [
28
- {
29
- type: NodeType.PAGE,
30
- text: '页面',
31
- },
32
- {
33
- type: NodeType.PAGE_FRAGMENT,
34
- text: '页面片',
35
- },
36
- ];
37
-
38
- const emit = defineEmits<{
39
- 'update:modelValue': [value: NodeType.PAGE | NodeType.PAGE_FRAGMENT];
40
- }>();
41
-
42
- const clickHandler = (value: NodeType.PAGE | NodeType.PAGE_FRAGMENT) => {
43
- emit('update:modelValue', value);
44
- };
45
- </script>