sun-card-design 1.1.37 → 1.1.39

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 (162) hide show
  1. package/README.md +114 -112
  2. package/dist/mobile/sun-card-design-mobile.es11.js +3 -3
  3. package/dist/mobile/sun-card-design-mobile.es3.js +4 -4
  4. package/dist/mobile/sun-card-design-mobile.es4.js +5 -5
  5. package/dist/mobile/sun-card-design-mobile.es56.js +3 -4
  6. package/dist/mobile/sun-card-design-mobile.es6.js +2 -10
  7. package/dist/pc/sun-card-design-pc.es11.js +3 -3
  8. package/dist/pc/sun-card-design-pc.es3.js +4 -4
  9. package/dist/pc/sun-card-design-pc.es4.js +5 -5
  10. package/dist/pc/sun-card-design-pc.es56.js +3 -4
  11. package/dist/pc/sun-card-design-pc.es6.js +2 -10
  12. package/dist/public/sun-card-design.css +1 -1
  13. package/package.json +98 -96
  14. package/dist/public/sun-card-designer.css +0 -1
  15. package/dist/sun-card-designer.es.js +0 -25
  16. package/dist/sun-card-designer.es10.js +0 -167
  17. package/dist/sun-card-designer.es11.js +0 -197
  18. package/dist/sun-card-designer.es12.js +0 -203
  19. package/dist/sun-card-designer.es13.js +0 -130
  20. package/dist/sun-card-designer.es14.js +0 -120
  21. package/dist/sun-card-designer.es151.js +0 -4
  22. package/dist/sun-card-designer.es152.js +0 -4
  23. package/dist/sun-card-designer.es153.js +0 -4
  24. package/dist/sun-card-designer.es154.js +0 -4
  25. package/dist/sun-card-designer.es155.js +0 -82
  26. package/dist/sun-card-designer.es156.js +0 -91
  27. package/dist/sun-card-designer.es157.js +0 -92
  28. package/dist/sun-card-designer.es158.js +0 -191
  29. package/dist/sun-card-designer.es159.js +0 -86
  30. package/dist/sun-card-designer.es16.js +0 -10
  31. package/dist/sun-card-designer.es160.js +0 -238
  32. package/dist/sun-card-designer.es161.js +0 -113
  33. package/dist/sun-card-designer.es162.js +0 -49
  34. package/dist/sun-card-designer.es163.js +0 -43
  35. package/dist/sun-card-designer.es164.js +0 -39
  36. package/dist/sun-card-designer.es165.js +0 -46
  37. package/dist/sun-card-designer.es166.js +0 -58
  38. package/dist/sun-card-designer.es167.js +0 -56
  39. package/dist/sun-card-designer.es168.js +0 -58
  40. package/dist/sun-card-designer.es169.js +0 -73
  41. package/dist/sun-card-designer.es17.js +0 -333
  42. package/dist/sun-card-designer.es170.js +0 -59
  43. package/dist/sun-card-designer.es171.js +0 -69
  44. package/dist/sun-card-designer.es172.js +0 -182
  45. package/dist/sun-card-designer.es173.js +0 -176
  46. package/dist/sun-card-designer.es174.js +0 -184
  47. package/dist/sun-card-designer.es175.js +0 -409
  48. package/dist/sun-card-designer.es176.js +0 -365
  49. package/dist/sun-card-designer.es177.js +0 -70
  50. package/dist/sun-card-designer.es178.js +0 -68
  51. package/dist/sun-card-designer.es179.js +0 -184
  52. package/dist/sun-card-designer.es18.js +0 -68
  53. package/dist/sun-card-designer.es180.js +0 -193
  54. package/dist/sun-card-designer.es181.js +0 -193
  55. package/dist/sun-card-designer.es182.js +0 -193
  56. package/dist/sun-card-designer.es184.js +0 -228
  57. package/dist/sun-card-designer.es185.js +0 -71
  58. package/dist/sun-card-designer.es19.js +0 -611
  59. package/dist/sun-card-designer.es196.js +0 -4
  60. package/dist/sun-card-designer.es20.js +0 -225
  61. package/dist/sun-card-designer.es201.js +0 -125
  62. package/dist/sun-card-designer.es21.js +0 -69
  63. package/dist/sun-card-designer.es22.js +0 -719
  64. package/dist/sun-card-designer.es220.js +0 -63
  65. package/dist/sun-card-designer.es221.js +0 -80
  66. package/dist/sun-card-designer.es222.js +0 -82
  67. package/dist/sun-card-designer.es223.js +0 -94
  68. package/dist/sun-card-designer.es224.js +0 -87
  69. package/dist/sun-card-designer.es225.js +0 -226
  70. package/dist/sun-card-designer.es226.js +0 -105
  71. package/dist/sun-card-designer.es227.js +0 -45
  72. package/dist/sun-card-designer.es228.js +0 -31
  73. package/dist/sun-card-designer.es229.js +0 -29
  74. package/dist/sun-card-designer.es23.js +0 -211
  75. package/dist/sun-card-designer.es230.js +0 -32
  76. package/dist/sun-card-designer.es231.js +0 -46
  77. package/dist/sun-card-designer.es232.js +0 -42
  78. package/dist/sun-card-designer.es233.js +0 -44
  79. package/dist/sun-card-designer.es234.js +0 -61
  80. package/dist/sun-card-designer.es235.js +0 -46
  81. package/dist/sun-card-designer.es236.js +0 -54
  82. package/dist/sun-card-designer.es237.js +0 -130
  83. package/dist/sun-card-designer.es238.js +0 -127
  84. package/dist/sun-card-designer.es239.js +0 -132
  85. package/dist/sun-card-designer.es24.js +0 -265
  86. package/dist/sun-card-designer.es240.js +0 -375
  87. package/dist/sun-card-designer.es241.js +0 -348
  88. package/dist/sun-card-designer.es242.js +0 -69
  89. package/dist/sun-card-designer.es243.js +0 -65
  90. package/dist/sun-card-designer.es244.js +0 -87
  91. package/dist/sun-card-designer.es245.js +0 -98
  92. package/dist/sun-card-designer.es246.js +0 -98
  93. package/dist/sun-card-designer.es247.js +0 -98
  94. package/dist/sun-card-designer.es25.js +0 -857
  95. package/dist/sun-card-designer.es26.js +0 -768
  96. package/dist/sun-card-designer.es260.js +0 -125
  97. package/dist/sun-card-designer.es27.js +0 -264
  98. package/dist/sun-card-designer.es273.js +0 -192
  99. package/dist/sun-card-designer.es28.js +0 -809
  100. package/dist/sun-card-designer.es29.js +0 -220
  101. package/dist/sun-card-designer.es3.js +0 -506
  102. package/dist/sun-card-designer.es30.js +0 -809
  103. package/dist/sun-card-designer.es31.js +0 -220
  104. package/dist/sun-card-designer.es32.js +0 -820
  105. package/dist/sun-card-designer.es33.js +0 -225
  106. package/dist/sun-card-designer.es34.js +0 -69
  107. package/dist/sun-card-designer.es35.js +0 -375
  108. package/dist/sun-card-designer.es36.js +0 -186
  109. package/dist/sun-card-designer.es37.js +0 -119
  110. package/dist/sun-card-designer.es38.js +0 -354
  111. package/dist/sun-card-designer.es39.js +0 -127
  112. package/dist/sun-card-designer.es4.js +0 -365
  113. package/dist/sun-card-designer.es40.js +0 -100
  114. package/dist/sun-card-designer.es41.js +0 -214
  115. package/dist/sun-card-designer.es42.js +0 -119
  116. package/dist/sun-card-designer.es43.js +0 -250
  117. package/dist/sun-card-designer.es44.js +0 -118
  118. package/dist/sun-card-designer.es45.js +0 -64
  119. package/dist/sun-card-designer.es46.js +0 -223
  120. package/dist/sun-card-designer.es47.js +0 -196
  121. package/dist/sun-card-designer.es48.js +0 -77
  122. package/dist/sun-card-designer.es49.js +0 -85
  123. package/dist/sun-card-designer.es5.js +0 -317
  124. package/dist/sun-card-designer.es50.js +0 -85
  125. package/dist/sun-card-designer.es51.js +0 -64
  126. package/dist/sun-card-designer.es52.js +0 -283
  127. package/dist/sun-card-designer.es53.js +0 -64
  128. package/dist/sun-card-designer.es54.js +0 -142
  129. package/dist/sun-card-designer.es55.js +0 -52
  130. package/dist/sun-card-designer.es56.js +0 -85
  131. package/dist/sun-card-designer.es57.js +0 -258
  132. package/dist/sun-card-designer.es58.js +0 -226
  133. package/dist/sun-card-designer.es59.js +0 -169
  134. package/dist/sun-card-designer.es6.js +0 -190
  135. package/dist/sun-card-designer.es60.js +0 -280
  136. package/dist/sun-card-designer.es61.js +0 -168
  137. package/dist/sun-card-designer.es62.js +0 -219
  138. package/dist/sun-card-designer.es63.js +0 -168
  139. package/dist/sun-card-designer.es64.js +0 -275
  140. package/dist/sun-card-designer.es65.js +0 -760
  141. package/dist/sun-card-designer.es66.js +0 -272
  142. package/dist/sun-card-designer.es67.js +0 -559
  143. package/dist/sun-card-designer.es68.js +0 -124
  144. package/dist/sun-card-designer.es69.js +0 -528
  145. package/dist/sun-card-designer.es7.js +0 -65
  146. package/dist/sun-card-designer.es70.js +0 -185
  147. package/dist/sun-card-designer.es71.js +0 -107
  148. package/dist/sun-card-designer.es72.js +0 -153
  149. package/dist/sun-card-designer.es73.js +0 -315
  150. package/dist/sun-card-designer.es74.js +0 -114
  151. package/dist/sun-card-designer.es76.js +0 -4211
  152. package/dist/sun-card-designer.es79.js +0 -4
  153. package/dist/sun-card-designer.es8.js +0 -171
  154. package/dist/sun-card-designer.es80.js +0 -4
  155. package/dist/sun-card-designer.es81.js +0 -4
  156. package/dist/sun-card-designer.es84.js +0 -228
  157. package/dist/sun-card-designer.es87.js +0 -52
  158. package/dist/sun-card-designer.es88.js +0 -52
  159. package/dist/sun-card-designer.es9.js +0 -207
  160. package/dist/sun-card-designer.es91.js +0 -344
  161. package/dist/sun-card-designer.es92.js +0 -199
  162. package/dist/sun-card-designer.es95.js +0 -180
@@ -1,225 +0,0 @@
1
- import { ref, onMounted, watch, resolveComponent, createElementBlock, openBlock, createElementVNode, createVNode, withCtx, createBlock, createCommentVNode, createTextVNode } from "vue";
2
- import OpenVariable from "./sun-card-designer.es91.js";
3
- import _sfc_main$1 from "./sun-card-designer.es95.js";
4
- import EditInput from "./sun-card-designer.es92.js";
5
- /* empty css */
6
- import _export_sfc from "./sun-card-designer.es16.js";
7
- const _hoisted_1 = { class: "title-action" };
8
- const _hoisted_2 = { class: "click-action" };
9
- const _sfc_main = {
10
- __name: "columnsActionPes",
11
- props: ["record"],
12
- setup(__props) {
13
- const props = __props;
14
- const qflowRef = ref();
15
- const modalBindOptions = ref([
16
- {
17
- label: "日期组件",
18
- value: "dateComponent"
19
- },
20
- {
21
- label: "文本组件",
22
- value: "textComponent"
23
- },
24
- {
25
- label: "图形组件",
26
- value: "echartsComponent"
27
- }
28
- ]);
29
- const clickEventConfigOptions = ref([
30
- {
31
- label: "打开URL",
32
- value: "url"
33
- },
34
- {
35
- label: "自定义事件",
36
- value: "event"
37
- },
38
- {
39
- label: "给智能体发消息",
40
- value: "agent"
41
- },
42
- {
43
- label: "调用工具",
44
- value: "tool"
45
- },
46
- {
47
- label: "关联弹窗",
48
- value: "modal"
49
- }
50
- ]);
51
- const autoLabel = ref("URL");
52
- const obj = {
53
- url: "URL",
54
- event: "事件",
55
- agent: "消息",
56
- tool: "调用工具",
57
- modal: "关联弹窗"
58
- };
59
- const switchChange = (val) => {
60
- if (!val) {
61
- props.record.options.clickEventConfig.type = "url";
62
- props.record.options.clickEventConfig.value = "";
63
- props.record.options.clickEventConfig.variableName = null;
64
- props.record.options.clickEventConfig.toolItem = null;
65
- props.record.options.clickEventConfig.modalComponent = null;
66
- }
67
- };
68
- const onChange = () => {
69
- props.record.options.clickEventConfig.value = "";
70
- props.record.options.clickEventConfig.variableName = null;
71
- props.record.options.clickEventConfig.toolItem = null;
72
- props.record.options.clickEventConfig.modalComponent = null;
73
- };
74
- const onOpen = () => {
75
- qflowRef.value.onOpen(props.record.options.clickEventConfig.toolItem);
76
- };
77
- const selectQFlow = (params) => {
78
- props.record.options.clickEventConfig.toolItem = params;
79
- };
80
- const onOpenConfig = () => {
81
- props.record.options.clickEventConfig.toolItem.configParams;
82
- props.record.options.clickEventConfig.tooltemParams;
83
- };
84
- onMounted(() => {
85
- autoLabel.value = obj[props.record.options.clickEventConfig.type];
86
- });
87
- watch(
88
- () => props.record.options.clickEventConfig.type,
89
- (val) => {
90
- autoLabel.value = obj[val];
91
- }
92
- );
93
- const editInputRef = ref();
94
- const selectTreeChange = (params) => {
95
- const { item, node } = params;
96
- editInputRef.value.insertToken(`{${item.name}#${node}}`);
97
- };
98
- const selectChange = (record) => {
99
- editInputRef.value.insertToken(`{${record.name}}`);
100
- };
101
- return (_ctx, _cache) => {
102
- const _component_a_switch = resolveComponent("a-switch");
103
- const _component_a_select = resolveComponent("a-select");
104
- const _component_a_form_item = resolveComponent("a-form-item");
105
- const _component_a_button = resolveComponent("a-button");
106
- const _component_a_textarea = resolveComponent("a-textarea");
107
- const _component_a_col = resolveComponent("a-col");
108
- const _component_a_row = resolveComponent("a-row");
109
- const _component_a_form = resolveComponent("a-form");
110
- return openBlock(), createElementBlock("div", _hoisted_1, [
111
- _cache[6] || (_cache[6] = createElementVNode("div", { class: "title" }, "操作", -1)),
112
- createVNode(_component_a_form, { layout: "vertical" }, {
113
- default: withCtx(() => [
114
- createVNode(_component_a_row, { gutter: [16, 16] }, {
115
- default: withCtx(() => [
116
- createVNode(_component_a_col, { span: 24 }, {
117
- default: withCtx(() => [
118
- createElementVNode("div", _hoisted_2, [
119
- _cache[3] || (_cache[3] = createElementVNode("span", null, "点击事件", -1)),
120
- createVNode(_component_a_switch, {
121
- checked: props.record.options.clickEvent,
122
- "onUpdate:checked": _cache[0] || (_cache[0] = ($event) => props.record.options.clickEvent = $event),
123
- onChange: switchChange
124
- }, null, 8, ["checked"])
125
- ]),
126
- props.record.options.clickEvent ? (openBlock(), createBlock(_component_a_form_item, {
127
- key: 0,
128
- label: ""
129
- }, {
130
- default: withCtx(() => [
131
- createVNode(_component_a_select, {
132
- value: props.record.options.clickEventConfig.type,
133
- "onUpdate:value": _cache[1] || (_cache[1] = ($event) => props.record.options.clickEventConfig.type = $event),
134
- options: clickEventConfigOptions.value,
135
- style: { "width": "100%" },
136
- onChange
137
- }, null, 8, ["value", "options"])
138
- ]),
139
- _: 1
140
- })) : createCommentVNode("", true),
141
- props.record.options.clickEvent && props.record.options.clickEventConfig.type === "modal" ? (openBlock(), createBlock(_component_a_form_item, {
142
- key: 1,
143
- label: "关联组件"
144
- }, {
145
- default: withCtx(() => [
146
- createVNode(_component_a_select, {
147
- value: props.record.options.clickEventConfig.modalComponent,
148
- "onUpdate:value": _cache[2] || (_cache[2] = ($event) => props.record.options.clickEventConfig.modalComponent = $event),
149
- options: modalBindOptions.value,
150
- placeholder: "请选择关联组件",
151
- style: { "width": "100%" }
152
- }, null, 8, ["value", "options"])
153
- ]),
154
- _: 1
155
- })) : createCommentVNode("", true),
156
- props.record.options.clickEvent ? (openBlock(), createBlock(_component_a_form_item, {
157
- key: 2,
158
- label: autoLabel.value
159
- }, {
160
- default: withCtx(() => [
161
- props.record.options.clickEventConfig.type != "tool" ? (openBlock(), createBlock(OpenVariable, {
162
- key: 0,
163
- showCom: false,
164
- onOnSelect: selectChange,
165
- onOnSelectTree: selectTreeChange
166
- })) : createCommentVNode("", true),
167
- props.record.options.clickEventConfig.type != "tool" ? (openBlock(), createBlock(EditInput, {
168
- key: 1,
169
- ref_key: "editInputRef",
170
- ref: editInputRef,
171
- record: props.record.options.clickEventConfig,
172
- filed: "value",
173
- minRows: 2
174
- }, null, 8, ["record"])) : (openBlock(), createBlock(_component_a_button, {
175
- key: 2,
176
- style: { "width": "100%", "background": "#f0f0f0" },
177
- onClick: onOpen
178
- }, {
179
- default: withCtx(() => [..._cache[4] || (_cache[4] = [
180
- createTextVNode(" + 选择 ", -1)
181
- ])]),
182
- _: 1
183
- })),
184
- !!props.record.options.clickEventConfig.toolItem ? (openBlock(), createBlock(_component_a_textarea, {
185
- key: 3,
186
- autoSize: { minRows: 1, maxRows: 2 },
187
- disabled: true,
188
- value: props.record.options.clickEventConfig.toolItem.label,
189
- style: { "width": "100%", "margin-top": "10px", "border": "none" }
190
- }, null, 8, ["value"])) : createCommentVNode("", true),
191
- !!props.record.options.clickEventConfig.toolItem ? (openBlock(), createBlock(_component_a_button, {
192
- key: 4,
193
- style: { "width": "100%", "background": "#0066ff1a", "color": "#0066ff", "margin-top": "16px" },
194
- onClick: onOpenConfig
195
- }, {
196
- default: withCtx(() => [..._cache[5] || (_cache[5] = [
197
- createTextVNode("配置参数", -1)
198
- ])]),
199
- _: 1
200
- })) : createCommentVNode("", true)
201
- ]),
202
- _: 1
203
- }, 8, ["label"])) : createCommentVNode("", true)
204
- ]),
205
- _: 1
206
- })
207
- ]),
208
- _: 1
209
- })
210
- ]),
211
- _: 1
212
- }),
213
- createVNode(_sfc_main$1, {
214
- ref_key: "qflowRef",
215
- ref: qflowRef,
216
- onConfirm: selectQFlow
217
- }, null, 512)
218
- ]);
219
- };
220
- }
221
- };
222
- const ColumnsActionPes = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-73261873"]]);
223
- export {
224
- ColumnsActionPes as default
225
- };
@@ -1,69 +0,0 @@
1
- import { ref, computed, resolveComponent, createElementBlock, openBlock, createElementVNode, createVNode, withCtx } from "vue";
2
- import OpenVariable from "./sun-card-designer.es91.js";
3
- import EditInput from "./sun-card-designer.es92.js";
4
- import "./sun-card-designer.es13.js";
5
- /* empty css */
6
- import _export_sfc from "./sun-card-designer.es16.js";
7
- const _hoisted_1 = { class: "button-pes" };
8
- const _sfc_main = {
9
- __name: "buttonBasePes",
10
- props: ["record", "sourceData"],
11
- setup(__props) {
12
- const props = __props;
13
- const editInputRef = ref();
14
- const selectTreeChange = (params) => {
15
- const { item, node } = params;
16
- editInputRef.value.insertToken(`{${item.name}#${node}}`);
17
- };
18
- const selectChange = (record) => {
19
- editInputRef.value.insertToken(`{${record.name}}`);
20
- };
21
- const inGridWithVariableName = computed(() => {
22
- return true;
23
- });
24
- return (_ctx, _cache) => {
25
- const _component_a_form_item = resolveComponent("a-form-item");
26
- const _component_a_col = resolveComponent("a-col");
27
- const _component_a_row = resolveComponent("a-row");
28
- const _component_a_form = resolveComponent("a-form");
29
- return openBlock(), createElementBlock("div", _hoisted_1, [
30
- _cache[0] || (_cache[0] = createElementVNode("div", { class: "title" }, "数据", -1)),
31
- createVNode(_component_a_form, { layout: "vertical" }, {
32
- default: withCtx(() => [
33
- createVNode(_component_a_row, { gutter: [16, 16] }, {
34
- default: withCtx(() => [
35
- createVNode(_component_a_col, { span: 24 }, {
36
- default: withCtx(() => [
37
- createVNode(_component_a_form_item, { label: "标签" }, {
38
- default: withCtx(() => [
39
- createVNode(OpenVariable, {
40
- disabled: inGridWithVariableName.value,
41
- onOnSelect: selectChange,
42
- onOnSelectTree: selectTreeChange
43
- }, null, 8, ["disabled"]),
44
- createVNode(EditInput, {
45
- ref_key: "editInputRef",
46
- ref: editInputRef,
47
- record: props.record.options,
48
- minRows: 1
49
- }, null, 8, ["record"])
50
- ]),
51
- _: 1
52
- })
53
- ]),
54
- _: 1
55
- })
56
- ]),
57
- _: 1
58
- })
59
- ]),
60
- _: 1
61
- })
62
- ]);
63
- };
64
- }
65
- };
66
- const ButtonBasePes = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c885ec04"]]);
67
- export {
68
- ButtonBasePes as default
69
- };
@@ -1,375 +0,0 @@
1
- import { ref, computed, onMounted, onBeforeUnmount, resolveComponent, createElementBlock, openBlock, createVNode, createElementVNode, withCtx, createBlock, createCommentVNode, withModifiers, resolveDynamicComponent, unref, Fragment, renderList, normalizeStyle, toDisplayString } from "vue";
2
- import { EditOutlined, DeleteOutlined, CloseOutlined, CheckOutlined, ClearOutlined, DownloadOutlined, SearchOutlined, DownOutlined } from "@ant-design/icons-vue";
3
- import { ColorList, ColorNameMap } from "./sun-card-designer.es76.js";
4
- /* empty css */
5
- import _export_sfc from "./sun-card-designer.es16.js";
6
- const _hoisted_1 = { class: "title-style" };
7
- const _hoisted_2 = { class: "swatch icon" };
8
- const _hoisted_3 = { class: "arrow" };
9
- const _hoisted_4 = {
10
- key: 0,
11
- class: "color-picker"
12
- };
13
- const _hoisted_5 = { class: "color-grid icons" };
14
- const _hoisted_6 = ["onClick"];
15
- const _hoisted_7 = { class: "label" };
16
- const _hoisted_8 = { class: "arrow" };
17
- const _hoisted_9 = {
18
- key: 0,
19
- class: "color-picker"
20
- };
21
- const _hoisted_10 = { class: "color-grid" };
22
- const _hoisted_11 = ["onClick"];
23
- const _hoisted_12 = { class: "label" };
24
- const _hoisted_13 = { class: "arrow" };
25
- const _hoisted_14 = {
26
- key: 0,
27
- class: "color-picker"
28
- };
29
- const _hoisted_15 = { class: "color-grid" };
30
- const _hoisted_16 = ["onClick"];
31
- const _hoisted_17 = { class: "slider-row" };
32
- const _hoisted_18 = { class: "slider-row" };
33
- const _hoisted_19 = { class: "slider-row" };
34
- const _sfc_main = {
35
- __name: "buttonStylePes",
36
- props: ["record"],
37
- setup(__props) {
38
- const props = __props;
39
- const iconMap = {
40
- SearchOutlined,
41
- DownloadOutlined,
42
- ClearOutlined,
43
- CheckOutlined,
44
- CloseOutlined,
45
- DeleteOutlined,
46
- EditOutlined
47
- };
48
- const iconKeys = ref(Object.keys(iconMap));
49
- const iconPicker = ref(false);
50
- const backgroundPicker = ref(false);
51
- const textColorPicker = ref(false);
52
- const colorList = ref(ColorList);
53
- const nameMap = ColorNameMap;
54
- const backgroundColor = ref("#0066ff");
55
- const backgroundColorName = computed(() => nameMap[backgroundColor.value] || "自定义");
56
- const textColor = ref("#fff");
57
- const textColorName = computed(() => nameMap[textColor.value] || "自定义");
58
- const buttonSizeOptions = ref([
59
- {
60
- label: "小",
61
- value: "small"
62
- },
63
- {
64
- label: "中",
65
- value: "middle"
66
- },
67
- {
68
- label: "大",
69
- value: "large"
70
- }
71
- ]);
72
- const buttonAlignOptions = ref([
73
- {
74
- label: "左对齐",
75
- value: "left"
76
- },
77
- {
78
- label: "居中对齐",
79
- value: "center"
80
- },
81
- {
82
- label: "右对齐",
83
- value: "right"
84
- }
85
- ]);
86
- const buttonWidthOptions = ref([
87
- {
88
- label: "自适应",
89
- value: "auto"
90
- },
91
- {
92
- label: "拉伸",
93
- value: "all"
94
- },
95
- {
96
- label: "固定",
97
- value: "fixed"
98
- }
99
- ]);
100
- const buttonWidthChange = (val) => {
101
- props.record.options.style.widthValue = val !== "fixed" ? null : 72;
102
- };
103
- const toggleIconPicker = () => {
104
- iconPicker.value = !iconPicker.value;
105
- };
106
- const pickIcon = (name) => {
107
- props.record.options.style.iconName = name;
108
- iconPicker.value = false;
109
- };
110
- const toggleBackgroundPicker = () => {
111
- backgroundPicker.value = !backgroundPicker.value;
112
- };
113
- const pickBackground = (hex) => {
114
- backgroundColor.value = hex;
115
- backgroundPicker.value = false;
116
- props.record.options.style.background = hex;
117
- };
118
- const toggleTextColorPicker = () => {
119
- textColorPicker.value = !textColorPicker.value;
120
- };
121
- const pickTextColor = (hex) => {
122
- textColor.value = hex;
123
- textColorPicker.value = false;
124
- props.record.options.style.color = hex;
125
- };
126
- const onClickOutside = () => {
127
- iconPicker.value = false;
128
- backgroundPicker.value = false;
129
- textColorPicker.value = false;
130
- };
131
- onMounted(() => {
132
- document.addEventListener("click", onClickOutside);
133
- backgroundColor.value = props.record.options.style.background || "#0066ff";
134
- textColor.value = props.record.options.style.color || "#fff";
135
- });
136
- onBeforeUnmount(() => {
137
- document.removeEventListener("click", onClickOutside);
138
- });
139
- return (_ctx, _cache) => {
140
- const _component_a_divider = resolveComponent("a-divider");
141
- const _component_a_form_item = resolveComponent("a-form-item");
142
- const _component_a_select = resolveComponent("a-select");
143
- const _component_a_input_number = resolveComponent("a-input-number");
144
- const _component_a_slider = resolveComponent("a-slider");
145
- const _component_a_col = resolveComponent("a-col");
146
- const _component_a_row = resolveComponent("a-row");
147
- const _component_a_form = resolveComponent("a-form");
148
- return openBlock(), createElementBlock("div", _hoisted_1, [
149
- createVNode(_component_a_divider, { style: { "margin-top": "0" } }),
150
- _cache[11] || (_cache[11] = createElementVNode("div", { class: "title" }, "样式", -1)),
151
- createVNode(_component_a_form, { layout: "vertical" }, {
152
- default: withCtx(() => [
153
- createVNode(_component_a_row, { gutter: [16, 16] }, {
154
- default: withCtx(() => [
155
- createVNode(_component_a_col, { span: 24 }, {
156
- default: withCtx(() => [
157
- createVNode(_component_a_form_item, { label: "图标" }, {
158
- default: withCtx(() => [
159
- createElementVNode("div", {
160
- class: "color-select",
161
- onClick: withModifiers(toggleIconPicker, ["stop"])
162
- }, [
163
- createElementVNode("span", _hoisted_2, [
164
- props.record.options.style.iconName ? (openBlock(), createBlock(resolveDynamicComponent(iconMap[props.record.options.style.iconName]), {
165
- key: 0,
166
- class: "icon-preview"
167
- })) : createCommentVNode("", true)
168
- ]),
169
- _cache[10] || (_cache[10] = createElementVNode("span", { class: "label" }, null, -1)),
170
- createElementVNode("span", _hoisted_3, [
171
- createVNode(unref(DownOutlined))
172
- ]),
173
- iconPicker.value ? (openBlock(), createElementBlock("div", _hoisted_4, [
174
- createElementVNode("div", _hoisted_5, [
175
- (openBlock(true), createElementBlock(Fragment, null, renderList(iconKeys.value, (name) => {
176
- return openBlock(), createElementBlock("span", {
177
- class: "chip icon-chip",
178
- key: "i-" + name,
179
- onClick: withModifiers(($event) => pickIcon(name), ["stop"])
180
- }, [
181
- (openBlock(), createBlock(resolveDynamicComponent(iconMap[name]), { class: "icon-preview" }))
182
- ], 8, _hoisted_6);
183
- }), 128))
184
- ])
185
- ])) : createCommentVNode("", true)
186
- ])
187
- ]),
188
- _: 1
189
- }),
190
- createVNode(_component_a_form_item, { label: "尺寸" }, {
191
- default: withCtx(() => [
192
- createVNode(_component_a_select, {
193
- value: props.record.options.style.size,
194
- "onUpdate:value": _cache[0] || (_cache[0] = ($event) => props.record.options.style.size = $event),
195
- options: buttonSizeOptions.value,
196
- style: { "width": "100%" }
197
- }, null, 8, ["value", "options"])
198
- ]),
199
- _: 1
200
- }),
201
- createVNode(_component_a_form_item, { label: "对齐方式" }, {
202
- default: withCtx(() => [
203
- createVNode(_component_a_select, {
204
- value: props.record.options.style.align,
205
- "onUpdate:value": _cache[1] || (_cache[1] = ($event) => props.record.options.style.align = $event),
206
- options: buttonAlignOptions.value,
207
- style: { "width": "100%" }
208
- }, null, 8, ["value", "options"])
209
- ]),
210
- _: 1
211
- }),
212
- createVNode(_component_a_form_item, { label: "宽度" }, {
213
- default: withCtx(() => [
214
- createVNode(_component_a_select, {
215
- value: props.record.options.style.widthType,
216
- "onUpdate:value": _cache[2] || (_cache[2] = ($event) => props.record.options.style.widthType = $event),
217
- options: buttonWidthOptions.value,
218
- style: { "width": "100%" },
219
- onChange: buttonWidthChange
220
- }, null, 8, ["value", "options"])
221
- ]),
222
- _: 1
223
- }),
224
- props.record.options.style.widthType === "fixed" ? (openBlock(), createBlock(_component_a_form_item, {
225
- key: 0,
226
- label: "宽度值"
227
- }, {
228
- default: withCtx(() => [
229
- createVNode(_component_a_input_number, {
230
- style: { "margin-top": "10px", "width": "100%" },
231
- value: props.record.options.style.widthValue,
232
- "onUpdate:value": _cache[3] || (_cache[3] = ($event) => props.record.options.style.widthValue = $event),
233
- min: 72,
234
- max: 360
235
- }, null, 8, ["value"])
236
- ]),
237
- _: 1
238
- })) : createCommentVNode("", true),
239
- createVNode(_component_a_form_item, { label: "背景颜色" }, {
240
- default: withCtx(() => [
241
- createElementVNode("div", {
242
- class: "color-select",
243
- onClick: withModifiers(toggleBackgroundPicker, ["stop"])
244
- }, [
245
- createElementVNode("span", {
246
- class: "swatch",
247
- style: normalizeStyle({ backgroundColor: backgroundColor.value })
248
- }, null, 4),
249
- createElementVNode("span", _hoisted_7, toDisplayString(backgroundColorName.value), 1),
250
- createElementVNode("span", _hoisted_8, [
251
- createVNode(unref(DownOutlined))
252
- ]),
253
- backgroundPicker.value ? (openBlock(), createElementBlock("div", _hoisted_9, [
254
- createElementVNode("div", _hoisted_10, [
255
- (openBlock(true), createElementBlock(Fragment, null, renderList(colorList.value, (c) => {
256
- return openBlock(), createElementBlock("span", {
257
- class: "chip",
258
- key: "bg-" + c,
259
- style: normalizeStyle({ backgroundColor: c }),
260
- onClick: withModifiers(($event) => pickBackground(c), ["stop"])
261
- }, null, 12, _hoisted_11);
262
- }), 128))
263
- ])
264
- ])) : createCommentVNode("", true)
265
- ])
266
- ]),
267
- _: 1
268
- }),
269
- createVNode(_component_a_form_item, { label: "字体颜色" }, {
270
- default: withCtx(() => [
271
- createElementVNode("div", {
272
- class: "color-select",
273
- onClick: withModifiers(toggleTextColorPicker, ["stop"])
274
- }, [
275
- createElementVNode("span", {
276
- class: "swatch",
277
- style: normalizeStyle({ backgroundColor: textColor.value })
278
- }, null, 4),
279
- createElementVNode("span", _hoisted_12, toDisplayString(textColorName.value), 1),
280
- createElementVNode("span", _hoisted_13, [
281
- createVNode(unref(DownOutlined))
282
- ]),
283
- textColorPicker.value ? (openBlock(), createElementBlock("div", _hoisted_14, [
284
- createElementVNode("div", _hoisted_15, [
285
- (openBlock(true), createElementBlock(Fragment, null, renderList(colorList.value, (c) => {
286
- return openBlock(), createElementBlock("span", {
287
- class: "chip",
288
- key: "text-" + c,
289
- style: normalizeStyle({ backgroundColor: c }),
290
- onClick: withModifiers(($event) => pickTextColor(c), ["stop"])
291
- }, null, 12, _hoisted_16);
292
- }), 128))
293
- ])
294
- ])) : createCommentVNode("", true)
295
- ])
296
- ]),
297
- _: 1
298
- }),
299
- createVNode(_component_a_form_item, { label: "圆角" }, {
300
- default: withCtx(() => [
301
- createElementVNode("div", _hoisted_17, [
302
- createVNode(_component_a_slider, {
303
- min: 0,
304
- max: 20,
305
- value: props.record.options.style.borderRadius,
306
- "onUpdate:value": _cache[4] || (_cache[4] = ($event) => props.record.options.style.borderRadius = $event),
307
- style: { "flex": "1", "margin-right": "12px" }
308
- }, null, 8, ["value"]),
309
- createVNode(_component_a_input_number, {
310
- min: 0,
311
- max: 20,
312
- value: props.record.options.style.borderRadius,
313
- "onUpdate:value": _cache[5] || (_cache[5] = ($event) => props.record.options.style.borderRadius = $event)
314
- }, null, 8, ["value"])
315
- ])
316
- ]),
317
- _: 1
318
- }),
319
- createVNode(_component_a_form_item, { label: "上下边距" }, {
320
- default: withCtx(() => [
321
- createElementVNode("div", _hoisted_18, [
322
- createVNode(_component_a_slider, {
323
- min: 0,
324
- max: 20,
325
- value: props.record.options.style.tbPadding,
326
- "onUpdate:value": _cache[6] || (_cache[6] = ($event) => props.record.options.style.tbPadding = $event),
327
- style: { "flex": "1", "margin-right": "12px" }
328
- }, null, 8, ["value"]),
329
- createVNode(_component_a_input_number, {
330
- min: 0,
331
- max: 20,
332
- value: props.record.options.style.tbPadding,
333
- "onUpdate:value": _cache[7] || (_cache[7] = ($event) => props.record.options.style.tbPadding = $event)
334
- }, null, 8, ["value"])
335
- ])
336
- ]),
337
- _: 1
338
- }),
339
- createVNode(_component_a_form_item, { label: "左右边距" }, {
340
- default: withCtx(() => [
341
- createElementVNode("div", _hoisted_19, [
342
- createVNode(_component_a_slider, {
343
- min: 0,
344
- max: 10,
345
- value: props.record.options.style.lrPadding,
346
- "onUpdate:value": _cache[8] || (_cache[8] = ($event) => props.record.options.style.lrPadding = $event),
347
- style: { "flex": "1", "margin-right": "12px" }
348
- }, null, 8, ["value"]),
349
- createVNode(_component_a_input_number, {
350
- min: 0,
351
- max: 10,
352
- value: props.record.options.style.lrPadding,
353
- "onUpdate:value": _cache[9] || (_cache[9] = ($event) => props.record.options.style.lrPadding = $event)
354
- }, null, 8, ["value"])
355
- ])
356
- ]),
357
- _: 1
358
- })
359
- ]),
360
- _: 1
361
- })
362
- ]),
363
- _: 1
364
- })
365
- ]),
366
- _: 1
367
- })
368
- ]);
369
- };
370
- }
371
- };
372
- const ButtonStylePes = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4072e452"]]);
373
- export {
374
- ButtonStylePes as default
375
- };