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

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 (127) 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 +31 -8
  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 +15 -4
  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 +13 -4
  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 +86 -24
  52. package/dist/es/services/history.js +16 -0
  53. package/dist/es/services/ui.js +5 -3
  54. package/dist/es/style.css +307 -40
  55. package/dist/es/utils/config.js +4 -1
  56. package/dist/es/utils/const.js +2 -2
  57. package/dist/es/utils/data-source/index.js +4 -2
  58. package/dist/es/utils/props.js +43 -29
  59. package/dist/es/utils/type-match-rules.js +12 -5
  60. package/dist/style.css +307 -40
  61. package/dist/themes/magic-admin.css +3004 -0
  62. package/dist/tmagic-editor.umd.cjs +1161 -476
  63. package/package.json +7 -7
  64. package/src/Editor.vue +22 -1
  65. package/src/components/ContentMenu.vue +44 -8
  66. package/src/components/FloatingBox.vue +8 -2
  67. package/src/editorProps.ts +4 -0
  68. package/src/fields/Code.vue +10 -2
  69. package/src/fields/CodeSelect.vue +54 -43
  70. package/src/fields/CodeSelectCol.vue +1 -0
  71. package/src/fields/DataSourceFieldSelect/Index.vue +14 -5
  72. package/src/fields/DisplayConds.vue +4 -1
  73. package/src/fields/EventSelect.vue +56 -32
  74. package/src/fields/StyleSetter/Index.vue +1 -4
  75. package/src/fields/StyleSetter/components/Border.vue +1 -1
  76. package/src/fields/StyleSetter/icons/align-items/Center.vue +19 -0
  77. package/src/fields/StyleSetter/icons/align-items/FlexEnd.vue +19 -0
  78. package/src/fields/StyleSetter/icons/align-items/FlexStart.vue +19 -0
  79. package/src/fields/StyleSetter/icons/align-items/SpaceAround.vue +34 -0
  80. package/src/fields/StyleSetter/icons/align-items/SpaceBetween.vue +34 -0
  81. package/src/fields/StyleSetter/icons/align-items/index.ts +5 -0
  82. package/src/fields/StyleSetter/icons/background-repeat/NoRepeat.vue +20 -4
  83. package/src/fields/StyleSetter/icons/background-repeat/Repeat.vue +10 -28
  84. package/src/fields/StyleSetter/icons/background-repeat/RepeatX.vue +4 -5
  85. package/src/fields/StyleSetter/icons/background-repeat/RepeatY.vue +4 -5
  86. package/src/fields/StyleSetter/icons/flex-direction/Column.vue +4 -3
  87. package/src/fields/StyleSetter/icons/flex-direction/ColumnReverse.vue +4 -3
  88. package/src/fields/StyleSetter/icons/flex-direction/Row.vue +4 -3
  89. package/src/fields/StyleSetter/icons/flex-direction/RowReverse.vue +4 -3
  90. package/src/fields/StyleSetter/icons/justify-content/Center.vue +5 -2
  91. package/src/fields/StyleSetter/icons/justify-content/FlexEnd.vue +15 -2
  92. package/src/fields/StyleSetter/icons/justify-content/FlexStart.vue +15 -2
  93. package/src/fields/StyleSetter/icons/justify-content/SpaceAround.vue +28 -3
  94. package/src/fields/StyleSetter/icons/justify-content/SpaceBetween.vue +28 -2
  95. package/src/fields/StyleSetter/pro/Background.vue +7 -2
  96. package/src/fields/StyleSetter/pro/Font.vue +3 -3
  97. package/src/fields/StyleSetter/pro/Layout.vue +98 -28
  98. package/src/icons/DatasourceIcon.vue +7 -0
  99. package/src/index.ts +3 -0
  100. package/src/layouts/Framework.vue +7 -1
  101. package/src/layouts/props-panel/PropsPanel.vue +38 -12
  102. package/src/layouts/sidebar/Sidebar.vue +3 -3
  103. package/src/plugin.ts +3 -2
  104. package/src/services/editor.ts +76 -11
  105. package/src/services/history.ts +22 -1
  106. package/src/services/ui.ts +20 -5
  107. package/src/theme/code-block.scss +37 -0
  108. package/src/theme/common/var.scss +1 -1
  109. package/src/theme/component-list-panel.scss +2 -2
  110. package/src/theme/data-source-field.scss +4 -0
  111. package/src/theme/display-conds.scss +11 -0
  112. package/src/theme/event.scss +58 -4
  113. package/src/theme/framework.scss +4 -1
  114. package/src/theme/history-list-panel.scss +9 -9
  115. package/src/theme/nav-menu.scss +5 -1
  116. package/src/theme/props-panel.scss +2 -1
  117. package/src/theme/style-setter/border.scss +14 -5
  118. package/src/theme/theme.scss +1 -0
  119. package/src/theme/themes/magic-admin/index.scss +214 -0
  120. package/src/theme/ui-select.scss +1 -1
  121. package/src/type.ts +33 -6
  122. package/src/utils/config.ts +9 -1
  123. package/src/utils/const.ts +3 -2
  124. package/src/utils/data-source/index.ts +3 -3
  125. package/src/utils/props.ts +22 -9
  126. package/src/utils/type-match-rules.ts +11 -5
  127. package/types/index.d.ts +114 -35
package/dist/es/style.css CHANGED
@@ -50,6 +50,63 @@
50
50
  transform: rotate(45deg);
51
51
  }
52
52
 
53
+ .tmagic-design-card.tmagic-design-card--flat {
54
+ background: #fff;
55
+ box-shadow: none !important;
56
+ border-top: 0;
57
+ border-left: 0;
58
+ border-right: 0;
59
+ border-radius: 0;
60
+ border-bottom: 0;
61
+ }
62
+ .tmagic-design-card.tmagic-design-card--flat.m-fields-group-list-item {
63
+ margin-bottom: 0;
64
+ }
65
+ .tmagic-design-card.tmagic-design-card--flat.is-always-shadow {
66
+ box-shadow: none;
67
+ }
68
+ .tmagic-design-card.tmagic-design-card--flat .el-card__header {
69
+ border-bottom: none;
70
+ padding: 16px;
71
+ }
72
+ .tmagic-design-card.tmagic-design-card--flat .el-card__header:hover {
73
+ background: transparent;
74
+ box-shadow: none;
75
+ cursor: default;
76
+ }
77
+ .tmagic-design-card.tmagic-design-card--flat .el-card__body {
78
+ padding: 0 16px 0 16px;
79
+ }
80
+ .tmagic-design-card.tmagic-design-card--flat .el-card__body .tmagic-design-form-item:not(tbody .tmagic-design-form-item) {
81
+ margin-bottom: 16px;
82
+ }
83
+ .tmagic-design-card.tmagic-design-card--flat .el-card__body > .m-container-row {
84
+ overflow-x: hidden;
85
+ }
86
+ .m-split-title-card-container > .tmagic-design-card.tmagic-design-card--flat {
87
+ background-color: transparent;
88
+ }
89
+ .m-split-title-card-container > .tmagic-design-card.tmagic-design-card--flat > .el-card__header {
90
+ margin-bottom: 10px;
91
+ padding: 0;
92
+ font-size: 16px;
93
+ font-weight: 500;
94
+ line-height: 24px;
95
+ }
96
+ .m-split-title-card-container > .tmagic-design-card.tmagic-design-card--flat > .el-card__body {
97
+ background-color: #fff;
98
+ padding-top: 16px;
99
+ }
100
+
101
+ .tmagic-design-color-picker-input {
102
+ margin-left: 8px;
103
+ width: calc(var(--el-input-width, 100%) - 40px);
104
+ }
105
+
106
+ .tmagic-design-color-picker {
107
+ flex: 0 0 auto;
108
+ }
109
+
53
110
  .m-table .el-button.action-btn + .el-button.action-btn {
54
111
  margin-left: 0;
55
112
  }
@@ -97,6 +154,9 @@
97
154
  .m-form-container .tmagic-design-form-item.show-before-diff {
98
155
  background: #f7dadd;
99
156
  }
157
+ .m-form-container .m-form-title-extra {
158
+ margin-left: 8px;
159
+ }
100
160
 
101
161
  .m-form-dialog .el-dialog__body {
102
162
  padding: 0 !important;
@@ -157,6 +217,10 @@
157
217
  margin-bottom: var(--td-comp-margin-xxl);
158
218
  }
159
219
 
220
+ .m-form-container .m-form-container-expand {
221
+ text-align: center;
222
+ }
223
+
160
224
  .magic-datetime-picker-popper .el-picker-panel__footer button:first-child {
161
225
  display: none;
162
226
  }
@@ -166,6 +230,24 @@
166
230
  align-items: center;
167
231
  width: 100%;
168
232
  }
233
+ .m-fields-text--static {
234
+ gap: 6px;
235
+ min-height: 32px;
236
+ }
237
+ .m-fields-text--static .m-fields-text__prepend {
238
+ color: var(--el-text-color-secondary, #909399);
239
+ }
240
+ .m-fields-text--static .m-fields-text__value {
241
+ color: var(--el-text-color-regular, #606266);
242
+ overflow: hidden;
243
+ text-overflow: ellipsis;
244
+ white-space: nowrap;
245
+ }
246
+ .m-fields-text--static .m-fields-text__icon {
247
+ width: 16px;
248
+ height: 16px;
249
+ cursor: pointer;
250
+ }
169
251
 
170
252
  .m-form-validate__warning {
171
253
  color: var(--el-color-warning);
@@ -191,6 +273,16 @@
191
273
  outline: none;
192
274
  }
193
275
 
276
+ .m-container-text.m-fields-title-container .tmagic-design-form-item .el-form-item__label {
277
+ color: #0f1113;
278
+ font-weight: 500;
279
+ font-size: 16px;
280
+ }
281
+ .m-container-text.m-fields-title-container .tmagic-design-form-item {
282
+ line-height: 24px;
283
+ margin-bottom: 16px;
284
+ }
285
+
194
286
  .tmagic-form-text-popper[data-popper-placement^=top] > .tmagic-form-text-popper-arrow {
195
287
  bottom: -4px;
196
288
  }
@@ -229,6 +321,66 @@ div.m-fields-link {
229
321
  width: fit-content;
230
322
  }
231
323
 
324
+ a.magic-admin-link {
325
+ width: 100%;
326
+ box-sizing: border-box;
327
+ border-radius: 4px;
328
+ border: 1px solid #e6e6e6;
329
+ background-color: #fafafa;
330
+ padding: 0 8px;
331
+ height: 28px;
332
+ display: inline-flex;
333
+ gap: 4px;
334
+ align-items: center;
335
+ text-decoration: none;
336
+ }
337
+ a.magic-admin-link i {
338
+ margin-right: 4px;
339
+ }
340
+
341
+ .m-container-fieldset.no-border-fieldset.fieldset-in-row > fieldset.m-fieldset legend {
342
+ left: 0;
343
+ }
344
+ .m-container-fieldset.no-border-fieldset > fieldset.m-fieldset {
345
+ border: 0;
346
+ }
347
+ .m-container-fieldset.no-border-fieldset > fieldset.m-fieldset legend {
348
+ position: relative;
349
+ left: -5px;
350
+ font-size: 16px;
351
+ font-weight: 500;
352
+ line-height: 24px;
353
+ padding: 0;
354
+ }
355
+ .m-container-fieldset.fieldset-in-card-fit {
356
+ border-bottom: 1px solid #e6e6e6;
357
+ }
358
+ .m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset {
359
+ padding: 16px 0 16px 0 !important;
360
+ border: 0;
361
+ margin-top: 0;
362
+ margin-bottom: 0;
363
+ }
364
+ .m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset legend {
365
+ position: relative;
366
+ top: 10px;
367
+ background-color: transparent;
368
+ }
369
+ .m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-last {
370
+ padding-bottom: 0 !important;
371
+ border-bottom: 0;
372
+ }
373
+ .m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-first {
374
+ padding-top: 0 !important;
375
+ }
376
+ .m-container-fieldset.fieldset-in-card-fit:last-child {
377
+ padding-bottom: 0 !important;
378
+ border-bottom: 0;
379
+ }
380
+ .m-container-fieldset.fieldset-in-card-fit:first {
381
+ padding-top: 0 !important;
382
+ }
383
+
232
384
  fieldset.m-fieldset {
233
385
  position: relative;
234
386
  border: 1px solid rgb(229, 229, 229);
@@ -255,6 +407,9 @@ fieldset.m-fieldset .m-form-tip {
255
407
  margin-left: 5px;
256
408
  }
257
409
 
410
+ .m-fields-group-list .m-fields-group-list-item.tmagic-design-card--flat:last-child {
411
+ border: 0;
412
+ }
258
413
  .m-fields-group-list .el-button--text {
259
414
  padding: 0;
260
415
  margin-bottom: 7px;
@@ -273,23 +428,23 @@ fieldset.m-fieldset .m-form-tip {
273
428
  .m-fields-group-list .m-fields-group-list-item:last-of-type {
274
429
  border-bottom: 0;
275
430
  }
276
- .m-fields-group-list .tmagic-design-card .el-card__header {
277
- padding: 5px 20px;
278
- }
279
- .m-fields-group-list .tmagic-design-card .t-card__header {
280
- padding: 5px 0;
431
+ .m-fields-group-list .m-fields-group-list-item .m-fields-group-list-item-header {
432
+ display: flex;
433
+ align-items: center;
434
+ gap: 8px;
281
435
  }
282
436
  .m-fields-group-list .m-fields-group-list-footer {
283
437
  display: flex;
284
438
  justify-content: space-between;
285
439
  margin-top: 10px;
440
+ margin-bottom: 16px;
286
441
  }
287
442
 
288
443
  .m-form-panel .el-card__header:hover {
289
444
  background: #f2f6fc;
290
445
  }
291
446
  .m-form-panel .el-card__header a {
292
- color: #409eff;
447
+ color: var(--el-color-primary, #409eff);
293
448
  }
294
449
  .m-form-panel .el-card__body {
295
450
  padding: 10px;
@@ -372,8 +527,8 @@ fieldset.m-fieldset .m-form-tip {
372
527
  margin-right: auto;
373
528
  min-width: 50px;
374
529
  outline: none;
375
- border-color: #409eff;
376
- color: #409eff;
530
+ border-color: var(--el-color-primary, #409eff);
531
+ color: var(--el-color-primary, #409eff);
377
532
  width: 10px;
378
533
  }
379
534
  .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab::before {
@@ -412,6 +567,22 @@ fieldset.m-fieldset .m-form-tip {
412
567
  justify-content: space-between;
413
568
  }
414
569
 
570
+ .m-fields-radio-group__option {
571
+ display: flex;
572
+ align-items: center;
573
+ }
574
+
575
+ .m-fields-radio-group__text {
576
+ display: inline-block;
577
+ vertical-align: middle;
578
+ white-space: pre-line;
579
+ line-height: 20px;
580
+ }
581
+
582
+ .m-fields-radio-group__icon_with_text {
583
+ margin-right: 8px;
584
+ }
585
+
415
586
  .tmagic-design-input.search-input {
416
587
  background: #fff;
417
588
  color: #bbbbbb;
@@ -440,7 +611,7 @@ fieldset.m-fieldset .m-form-tip {
440
611
  font-weight: 400;
441
612
  box-sizing: border-box;
442
613
  margin: 0px;
443
- flex: 0 0 35px;
614
+ flex: 0 0 var(--editor-nav-height, 35px);
444
615
  border-bottom: 1px solid #d8dee8;
445
616
  }
446
617
  .m-editor-nav-menu > div {
@@ -569,7 +740,7 @@ fieldset.m-fieldset .m-form-tip {
569
740
  color: #909399;
570
741
  }
571
742
  .m-editor-history-list-popover .m-editor-history-list-close:hover {
572
- color: #409eff;
743
+ color: var(--el-color-primary, #409eff);
573
744
  }
574
745
  .m-editor-history-list-popover .m-editor-history-list-tabs .el-tabs__header,
575
746
  .m-editor-history-list-popover .m-editor-history-list-tabs .t-tabs__header {
@@ -625,14 +796,14 @@ fieldset.m-fieldset .m-form-tip {
625
796
  }
626
797
  .m-editor-history-list-popover .m-editor-history-list-item.is-current:not(.m-editor-history-list-group.is-merged) {
627
798
  background-color: rgba(64, 158, 255, 0.1);
628
- box-shadow: inset 2px 0 0 #409eff;
799
+ box-shadow: inset 2px 0 0 var(--el-color-primary, #409eff);
629
800
  }
630
801
  .m-editor-history-list-popover .m-editor-history-list-item.is-current:not(.m-editor-history-list-group.is-merged):hover {
631
802
  background-color: rgba(64, 158, 255, 0.16);
632
803
  }
633
804
  .m-editor-history-list-popover .m-editor-history-list-item.is-current:not(.m-editor-history-list-group.is-merged) .m-editor-history-list-item-desc {
634
805
  font-weight: 600;
635
- color: #409eff;
806
+ color: var(--el-color-primary, #409eff);
636
807
  }
637
808
  .m-editor-history-list-popover .m-editor-history-list-group {
638
809
  flex-direction: column;
@@ -687,11 +858,11 @@ fieldset.m-fieldset .m-form-tip {
687
858
  .m-editor-history-list-popover .m-editor-history-list-group.is-merged.is-current {
688
859
  background-color: rgba(64, 158, 255, 0.08);
689
860
  border-color: rgba(64, 158, 255, 0.3);
690
- border-left-color: #409eff;
861
+ border-left-color: var(--el-color-primary, #409eff);
691
862
  box-shadow: none;
692
863
  }
693
864
  .m-editor-history-list-popover .m-editor-history-list-group.is-merged.is-current .m-editor-history-list-group-head {
694
- color: #409eff;
865
+ color: var(--el-color-primary, #409eff);
695
866
  }
696
867
  .m-editor-history-list-popover .m-editor-history-list-substeps {
697
868
  margin: 6px 0 0 6px;
@@ -719,7 +890,7 @@ fieldset.m-fieldset .m-form-tip {
719
890
  color: #c0c4cc;
720
891
  }
721
892
  .m-editor-history-list-popover .m-editor-history-list-substeps li.is-current {
722
- color: #409eff;
893
+ color: var(--el-color-primary, #409eff);
723
894
  font-weight: 600;
724
895
  background-color: rgba(64, 158, 255, 0.08);
725
896
  border-radius: 3px;
@@ -731,7 +902,7 @@ fieldset.m-fieldset .m-form-tip {
731
902
  font-size: 10px;
732
903
  line-height: 16px;
733
904
  color: #fff;
734
- background-color: #409eff;
905
+ background-color: var(--el-color-primary, #409eff);
735
906
  font-weight: 500;
736
907
  }
737
908
  .m-editor-history-list-popover .m-editor-history-list-item-index {
@@ -860,7 +1031,7 @@ fieldset.m-fieldset .m-form-tip {
860
1031
  border-radius: 2px;
861
1032
  font-size: 10px;
862
1033
  line-height: 16px;
863
- color: #409eff;
1034
+ color: var(--el-color-primary, #409eff);
864
1035
  background-color: rgba(64, 158, 255, 0.1);
865
1036
  cursor: pointer;
866
1037
  user-select: none;
@@ -923,7 +1094,7 @@ fieldset.m-fieldset .m-form-tip {
923
1094
  flex: 1 1 auto;
924
1095
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
925
1096
  font-size: 11px;
926
- color: #409eff;
1097
+ color: var(--el-color-primary, #409eff);
927
1098
  overflow: hidden;
928
1099
  text-overflow: ellipsis;
929
1100
  white-space: nowrap;
@@ -1001,7 +1172,7 @@ fieldset.m-fieldset .m-form-tip {
1001
1172
  width: 100%;
1002
1173
  }
1003
1174
  .m-editor-content {
1004
- height: calc(100% - 35px);
1175
+ height: calc(100% - var(--editor-nav-height, 35px));
1005
1176
  }
1006
1177
  .m-editor-framework-center {
1007
1178
  position: relative;
@@ -1049,8 +1220,8 @@ fieldset.m-fieldset .m-form-tip {
1049
1220
  margin-top: 5px;
1050
1221
  }
1051
1222
  .m-editor-empty-button:hover {
1052
- border-color: #2882e0;
1053
- color: #2882e0;
1223
+ border-color: var(--el-color-primary, #2882e0);
1224
+ color: var(--el-color-primary, #2882e0);
1054
1225
  }
1055
1226
 
1056
1227
  .m-editor-sidebar {
@@ -1059,7 +1230,7 @@ fieldset.m-fieldset .m-form-tip {
1059
1230
  position: relative;
1060
1231
  }
1061
1232
  .m-editor-sidebar .m-editor-sidebar-header {
1062
- background: #2882e0;
1233
+ background: var(--el-color-primary, #2882e0);
1063
1234
  height: 100%;
1064
1235
  width: 40px;
1065
1236
  }
@@ -1241,9 +1412,9 @@ fieldset.m-fieldset .m-form-tip {
1241
1412
  }
1242
1413
  .ui-component-panel.tmagic-design-collapse .el-collapse-item__wrap .component-item i:hover,
1243
1414
  .ui-component-panel.tmagic-design-collapse .t-collapse-panel__body .component-item i:hover {
1244
- background: #2882e0;
1415
+ background: var(--el-color-primary, #2882e0);
1245
1416
  color: #fff;
1246
- border-color: #4e8be1;
1417
+ border-color: var(--el-color-primary, #4e8be1);
1247
1418
  }
1248
1419
  .ui-component-panel.tmagic-design-collapse .el-collapse-item__wrap .component-item span,
1249
1420
  .ui-component-panel.tmagic-design-collapse .t-collapse-panel__body .component-item span {
@@ -1393,7 +1564,7 @@ fieldset.m-fieldset .m-form-tip {
1393
1564
  }
1394
1565
  .m-editor-page-bar-item-icon .icon-active {
1395
1566
  font-weight: bold;
1396
- color: #2882e0;
1567
+ color: var(--el-color-primary, #2882e0);
1397
1568
  }
1398
1569
  .m-editor-page-bar-item-title {
1399
1570
  max-width: 150px;
@@ -1427,7 +1598,7 @@ fieldset.m-fieldset .m-form-tip {
1427
1598
  background-color: #f3f5f9;
1428
1599
  }
1429
1600
  .page-bar-popover .menu-item.active .tmagic-design-button {
1430
- color: #2882e0;
1601
+ color: var(--el-color-primary, #2882e0);
1431
1602
  }
1432
1603
 
1433
1604
  .m-editor-page-bar-search-panel {
@@ -1538,7 +1709,8 @@ fieldset.m-fieldset .m-form-tip {
1538
1709
  padding-left: 10px;
1539
1710
  }
1540
1711
  .m-editor-props-form-panel-form > .m-container-tab > .tmagic-design-tabs > .el-tabs__content {
1541
- padding-top: 55px;
1712
+ margin-top: var(--el-tabs-header-height);
1713
+ padding-top: 15px;
1542
1714
  }
1543
1715
  .m-editor-props-form-panel-form > .m-container-tab > .tmagic-design-tabs > .el-tabs__header.is-top {
1544
1716
  position: absolute;
@@ -1607,7 +1779,7 @@ fieldset.m-fieldset .m-form-tip {
1607
1779
  color: #313a40;
1608
1780
  }
1609
1781
  .magic-editor-content-menu .menu-item.button.active {
1610
- background-color: #2882e0;
1782
+ background-color: var(--el-color-primary, #2882e0);
1611
1783
  }
1612
1784
  .magic-editor-content-menu .menu-item.button.active .tmagic-design-button,
1613
1785
  .magic-editor-content-menu .menu-item.button.active .tmagic-design-button:active,
@@ -1738,12 +1910,51 @@ fieldset.m-fieldset .m-form-tip {
1738
1910
  .m-fields-code-select {
1739
1911
  width: 100%;
1740
1912
  }
1913
+ .m-fields-code-select > .el-card.tmagic-design-card--flat {
1914
+ background-color: transparent;
1915
+ margin-bottom: 10px;
1916
+ }
1917
+ .m-fields-code-select > .el-card.tmagic-design-card--flat > .el-card__body {
1918
+ padding-left: 0;
1919
+ }
1920
+ .m-fields-code-select > .el-card.tmagic-design-card--flat > .el-card__body .code-select-content > .m-fields-group-list > .tmagic-design-card--flat.el-card {
1921
+ padding-left: 16px;
1922
+ padding-right: 16px;
1923
+ margin-bottom: 10px;
1924
+ border: 0 !important;
1925
+ }
1926
+ .m-fields-code-select .el-card__body .tmagic-design-form-item {
1927
+ margin-bottom: 18px;
1928
+ }
1929
+ .m-fields-code-select .code-select-content > .m-fields-group-list > .tmagic-design-card--flat > .el-card__header {
1930
+ padding: 16px 0;
1931
+ }
1932
+ .m-fields-code-select .create-button.fullWidth {
1933
+ width: 100%;
1934
+ margin: 0 0 16px 0;
1935
+ }
1741
1936
 
1742
1937
  .m-fields-event-select {
1743
1938
  width: 100%;
1744
1939
  }
1745
1940
  .m-fields-event-select .fullWidth {
1746
1941
  width: 100%;
1942
+ box-sizing: border-box;
1943
+ }
1944
+ .m-fields-event-select .event-select-container {
1945
+ padding: 0 16px;
1946
+ }
1947
+ .m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__header {
1948
+ border-bottom: 1px solid #ebeef5;
1949
+ }
1950
+ .m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__body {
1951
+ padding-bottom: 16px;
1952
+ }
1953
+ .m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__body .m-fields-group-list-footer div {
1954
+ justify-content: flex-start !important;
1955
+ }
1956
+ .m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__body .el-card.tmagic-design-card--flat > .el-card__header {
1957
+ padding: 16px 0;
1747
1958
  }
1748
1959
  .m-fields-event-select .event-select-code {
1749
1960
  margin-left: 20px;
@@ -1777,7 +1988,40 @@ fieldset.m-fieldset .m-form-tip {
1777
1988
  margin-right: 5px;
1778
1989
  }
1779
1990
 
1780
- .el-form-item .el-form-item.is-error {
1991
+ .event-select-container {
1992
+ padding: 0 16px;
1993
+ }
1994
+
1995
+ .event-select-header {
1996
+ display: flex;
1997
+ align-items: center;
1998
+ justify-content: space-between;
1999
+ margin-bottom: 8px;
2000
+ }
2001
+ .event-select-header .event-select-title {
2002
+ color: #0f1113;
2003
+ font-size: 16px;
2004
+ font-weight: 500;
2005
+ line-height: 24px;
2006
+ }
2007
+
2008
+ .event-item-header {
2009
+ position: relative;
2010
+ width: 100%;
2011
+ }
2012
+ .event-item-header .event-item-title {
2013
+ color: #0f1113;
2014
+ font-size: 16px;
2015
+ font-weight: 500;
2016
+ line-height: 24px;
2017
+ margin-bottom: 16px;
2018
+ }
2019
+ .event-item-header .event-item-delete-button {
2020
+ position: absolute;
2021
+ right: 0;
2022
+ top: 0;
2023
+ }
2024
+ .event-item-header .el-form-item .el-form-item.is-error {
1781
2025
  margin-bottom: 18px;
1782
2026
  }
1783
2027
 
@@ -1917,18 +2161,18 @@ fieldset.m-fieldset .m-form-tip {
1917
2161
  color: #313a40;
1918
2162
  }
1919
2163
  .m-editor-tree .m-editor-tree-node .tree-node.selected {
1920
- background-color: #2882e0;
2164
+ background-color: var(--el-color-primary, #2882e0);
1921
2165
  color: #f3f5f9;
1922
2166
  }
1923
2167
  .m-editor-tree .m-editor-tree-node .tree-node.drag-inner .tree-node-content {
1924
- background-color: rgba(40, 130, 224, 0.5);
2168
+ background-color: rgba(var(--el-color-primary, #2882e0), 0.5);
1925
2169
  color: #f3f5f9;
1926
2170
  }
1927
2171
  .m-editor-tree .m-editor-tree-node .tree-node.drag-before .tree-node-content {
1928
- border-top-color: rgba(40, 130, 224, 0.5);
2172
+ border-top-color: rgba(var(--el-color-primary, #2882e0), 0.5);
1929
2173
  }
1930
2174
  .m-editor-tree .m-editor-tree-node .tree-node.drag-after .tree-node-content {
1931
- border-bottom-color: rgba(40, 130, 224, 0.5);
2175
+ border-bottom-color: rgba(var(--el-color-primary, #2882e0), 0.5);
1932
2176
  }
1933
2177
  .m-editor-tree .m-editor-tree-node .tree-node .expand-icon {
1934
2178
  padding: 4px;
@@ -2031,6 +2275,15 @@ fieldset.m-fieldset .m-form-tip {
2031
2275
  display: flex;
2032
2276
  align-items: center;
2033
2277
  }
2278
+ .m-fields-data-source-select.data-source-field-img-upload, .m-fields-data-source-select.data-source-field-big-img-upload,
2279
+ .m-fields-data-source-field-select.data-source-field-img-upload,
2280
+ .m-fields-data-source-field-select.data-source-field-big-img-upload,
2281
+ .m-fields-data-source-method-select .data-source-method-select-container.data-source-field-img-upload,
2282
+ .m-fields-data-source-method-select .data-source-method-select-container.data-source-field-big-img-upload,
2283
+ .m-fields-code-select-col .code-select-container.data-source-field-img-upload,
2284
+ .m-fields-code-select-col .code-select-container.data-source-field-big-img-upload {
2285
+ align-items: flex-start;
2286
+ }
2034
2287
  .m-fields-data-source-select .m-fields-select-action-button,
2035
2288
  .m-fields-data-source-field-select .m-fields-select-action-button,
2036
2289
  .m-fields-data-source-method-select .data-source-method-select-container .m-fields-select-action-button,
@@ -2057,6 +2310,16 @@ fieldset.m-fieldset .m-form-tip {
2057
2310
  padding: 5px 8px;
2058
2311
  }
2059
2312
 
2313
+ .m-container-text.display-conds-title .tmagic-design-form-item .el-form-item__label {
2314
+ color: #111;
2315
+ font-weight: 500;
2316
+ font-size: 16px;
2317
+ }
2318
+ .m-container-text.display-conds-title .tmagic-design-form-item {
2319
+ line-height: 24px;
2320
+ margin-bottom: 10px;
2321
+ }
2322
+
2060
2323
  .m-editor-scroll-bar {
2061
2324
  position: absolute;
2062
2325
  background-color: transparent;
@@ -2109,7 +2372,7 @@ fieldset.m-fieldset .m-form-tip {
2109
2372
  margin-right: 3px;
2110
2373
  }
2111
2374
  .m-fields-ui-select span {
2112
- color: #2882e0;
2375
+ color: var(--el-color-primary, #2882e0);
2113
2376
  }
2114
2377
 
2115
2378
  .m-editor-layer-node-content {
@@ -2127,6 +2390,7 @@ fieldset.m-fieldset .m-form-tip {
2127
2390
 
2128
2391
  .border-box-container {
2129
2392
  display: flex;
2393
+ --unuse-border-style: dashed;
2130
2394
  }
2131
2395
  .border-box-container .border-icon-container {
2132
2396
  display: flex;
@@ -2158,24 +2422,27 @@ fieldset.m-fieldset .m-form-tip {
2158
2422
  border-color: var(--el-color-success, var(--td-success-color, #2ba471));
2159
2423
  }
2160
2424
  .border-box-container .border-icon-container .border-icon.active {
2425
+ border-color: var(--el-color-primary);
2426
+ border-width: 1px;
2427
+ }
2428
+ .border-box-container .border-icon-container .border-icon.center {
2161
2429
  border-width: 1px;
2162
- border-color: var(--el-color-primary, var(--td-brand-color, #0052d9));
2163
2430
  }
2164
2431
  .border-box-container .border-icon-container .border-icon.border-icon-top {
2165
2432
  border-top-width: 2px;
2166
- border-style: solid dashed dashed dashed;
2433
+ border-style: solid var(--unuse-border-style) var(--unuse-border-style) var(--unuse-border-style);
2167
2434
  }
2168
2435
  .border-box-container .border-icon-container .border-icon.border-icon-right {
2169
2436
  border-right-width: 2px;
2170
- border-style: dashed solid dashed dashed;
2437
+ border-style: var(--unuse-border-style) solid var(--unuse-border-style) var(--unuse-border-style);
2171
2438
  }
2172
2439
  .border-box-container .border-icon-container .border-icon.border-icon-bottom {
2173
2440
  border-bottom-width: 2px;
2174
- border-style: dashed dashed solid dashed;
2441
+ border-style: var(--unuse-border-style) var(--unuse-border-style) solid var(--unuse-border-style);
2175
2442
  }
2176
2443
  .border-box-container .border-icon-container .border-icon.border-icon-left {
2177
2444
  border-left-width: 2px;
2178
- border-style: dashed dashed dashed solid;
2445
+ border-style: var(--unuse-border-style) var(--unuse-border-style) var(--unuse-border-style) solid;
2179
2446
  }
2180
2447
  .border-box-container .border-value-container {
2181
2448
  margin-left: 16px;
@@ -2395,7 +2662,7 @@ fieldset.m-fieldset .m-form-tip {
2395
2662
  border: 1px solid #1d1f24;
2396
2663
  }
2397
2664
  .background-position-container .presets-value-list .position-icon.active {
2398
- background-color: #2882e0;
2665
+ background-color: var(--el-color-primary, #2882e0);
2399
2666
  }
2400
2667
  .background-position-container .presets-value-list .position-icon.active::after {
2401
2668
  border: 1px solid #fff;
@@ -1,8 +1,11 @@
1
+ import { ref } from "vue";
1
2
  //#region packages/editor/src/utils/config.ts
2
3
  var $TMAGIC_EDITOR = {};
4
+ var isGlobalFlat = ref(false);
3
5
  var setEditorConfig = (option) => {
4
6
  $TMAGIC_EDITOR = option;
7
+ isGlobalFlat.value = option.flat ?? false;
5
8
  };
6
9
  var getEditorConfig = (key) => $TMAGIC_EDITOR[key];
7
10
  //#endregion
8
- export { getEditorConfig, setEditorConfig };
11
+ export { getEditorConfig, isGlobalFlat, setEditorConfig };
@@ -4,9 +4,9 @@ var UI_SELECT_MODE_EVENT_NAME = "ui-select";
4
4
  var LEFT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorLeftColumnWidthData";
5
5
  var RIGHT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorRightColumnWidthData";
6
6
  var PROPS_PANEL_WIDTH_STORAGE_KEY = "$MagicEditorPropsPanelWidthData";
7
- var DEFAULT_LEFT_COLUMN_WIDTH = 310;
7
+ var DEFAULT_LEFT_COLUMN_WIDTH = 345;
8
8
  var DEFAULT_RIGHT_COLUMN_WIDTH = 480;
9
- var MIN_LEFT_COLUMN_WIDTH = 200;
9
+ var MIN_LEFT_COLUMN_WIDTH = 345;
10
10
  var MIN_CENTER_COLUMN_WIDTH = 400;
11
11
  var MIN_RIGHT_COLUMN_WIDTH = 300;
12
12
  var H_GUIDE_LINE_STORAGE_KEY = "$MagicStageHorizontalGuidelinesData";
@@ -199,12 +199,14 @@ var resolveFieldByPath = (fields, fieldNames, options = {}) => {
199
199
  if (options.skipNumberIndices && isNumber(name)) continue;
200
200
  if (!currentFields.length) return {
201
201
  ok: false,
202
- fields: currentFields
202
+ fields: currentFields,
203
+ failedName: name
203
204
  };
204
205
  field = currentFields.find((item) => item.name === name);
205
206
  if (!field) return {
206
207
  ok: false,
207
- fields: currentFields
208
+ fields: currentFields,
209
+ failedName: name
208
210
  };
209
211
  currentFields = field.fields || [];
210
212
  }