sun-card-design 1.1.48 → 1.2.1

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 (43) hide show
  1. package/README.md +20 -2
  2. package/dist/mobile/sun-card-design-mobile.es18.js +5 -4
  3. package/dist/mobile/sun-card-design-mobile.es21.js +2 -2
  4. package/dist/mobile/sun-card-design-mobile.es23.js +2 -2
  5. package/dist/mobile/sun-card-design-mobile.es25.js +6 -6
  6. package/dist/mobile/sun-card-design-mobile.es32.js +4 -2
  7. package/dist/mobile/sun-card-design-mobile.es55.js +226 -0
  8. package/dist/mobile/sun-card-design-mobile.es56.js +64 -0
  9. package/dist/mobile/sun-card-design-mobile.es57.js +65 -204
  10. package/dist/mobile/sun-card-design-mobile.es58.js +81 -47
  11. package/dist/mobile/sun-card-design-mobile.es59.js +123 -48
  12. package/dist/mobile/sun-card-design-mobile.es6.js +2 -2
  13. package/dist/mobile/sun-card-design-mobile.es60.js +116 -52
  14. package/dist/mobile/sun-card-design-mobile.es61.js +116 -52
  15. package/dist/pc/sun-card-design-pc.es18.js +5 -4
  16. package/dist/pc/sun-card-design-pc.es21.js +2 -2
  17. package/dist/pc/sun-card-design-pc.es23.js +2 -2
  18. package/dist/pc/sun-card-design-pc.es25.js +6 -6
  19. package/dist/pc/sun-card-design-pc.es32.js +4 -2
  20. package/dist/pc/sun-card-design-pc.es55.js +226 -0
  21. package/dist/pc/sun-card-design-pc.es56.js +45 -207
  22. package/dist/pc/sun-card-design-pc.es57.js +70 -47
  23. package/dist/pc/sun-card-design-pc.es58.js +20 -9
  24. package/dist/pc/sun-card-design-pc.es59.js +116 -52
  25. package/dist/pc/sun-card-design-pc.es6.js +2 -2
  26. package/dist/pc/sun-card-design-pc.es60.js +116 -52
  27. package/dist/public/sun-card-design.css +1 -1
  28. package/package.json +3 -2
  29. package/dist/assets/cardDesigner.png +0 -0
  30. package/dist/assets/img.png +0 -0
  31. package/dist/assets/pic1.jpg +0 -0
  32. package/dist/assets/picsl1.jpg +0 -0
  33. package/dist/assets/song.mp3 +0 -0
  34. package/dist/assets/tmCard1.jpg +0 -0
  35. package/dist/assets/tmCard2.jpg +0 -0
  36. package/dist/assets/tmList1.jpg +0 -0
  37. package/dist/assets/video.mp4 +0 -0
  38. package/dist/mobile/sun-card-design-mobile.es51.js +0 -4
  39. package/dist/mobile/sun-card-design-mobile.es62.js +0 -98
  40. package/dist/pc/sun-card-design-pc.es51.js +0 -4
  41. package/dist/pc/sun-card-design-pc.es61.js +0 -98
  42. /package/dist/mobile/{sun-card-design-mobile.es66.js → sun-card-design-mobile.es65.js} +0 -0
  43. /package/dist/pc/{sun-card-design-pc.es66.js → sun-card-design-pc.es65.js} +0 -0
@@ -2,13 +2,20 @@ import { resolveComponent, createElementBlock, openBlock, normalizeStyle, create
2
2
  import FormItem from "./sun-card-design-pc.es25.js";
3
3
  /* empty css */
4
4
  import _export_sfc from "./sun-card-design-pc.es28.js";
5
+ const _hoisted_1 = ["onClick"];
5
6
  const _sfc_main = {
6
- __name: "singleColumn",
7
+ __name: "multipleColumn",
7
8
  props: ["record", "recordData", "columnsIndex"],
8
9
  emits: ["clickEvent", "clickColumnsEvent", "fileUpdateEvent"],
9
10
  setup(__props, { emit: __emit }) {
10
11
  const props = __props;
11
12
  const emit = __emit;
13
+ const getIndex = (index) => {
14
+ if (index !== void 0) {
15
+ return index;
16
+ }
17
+ return props.columnsIndex;
18
+ };
12
19
  const onClick = (record) => {
13
20
  emit("clickEvent", record);
14
21
  };
@@ -32,7 +39,7 @@ const _sfc_main = {
32
39
  const _component_a_col = resolveComponent("a-col");
33
40
  const _component_a_row = resolveComponent("a-row");
34
41
  return openBlock(), createElementBlock("div", {
35
- class: "main-singleColumn",
42
+ class: "main-grid",
36
43
  style: normalizeStyle({ background: getBackground() })
37
44
  }, [
38
45
  createVNode(_component_a_row, {
@@ -43,7 +50,10 @@ const _sfc_main = {
43
50
  return openBlock(), createBlock(_component_a_col, {
44
51
  key: index.toString(),
45
52
  flex: props.record.columns[index]?.flex,
46
- span: 24
53
+ span: 24,
54
+ style: normalizeStyle({
55
+ flex: props.record.columns[index]?.flex
56
+ })
47
57
  }, {
48
58
  default: withCtx(() => [
49
59
  createElementVNode("div", {
@@ -56,23 +66,24 @@ const _sfc_main = {
56
66
  justifyContent: props.record.options.style?.alignItems || "start",
57
67
  minHeight: props.record.options.style?.minHeight + "px" || "48px",
58
68
  boxShadow: props.record.options.style?.boxShadow || null
59
- })
69
+ }),
70
+ onClick: ($event) => onClickColumns(item)
60
71
  }, [
61
72
  (openBlock(true), createElementBlock(Fragment, null, renderList(item.list, (element, index2) => {
62
73
  return openBlock(), createBlock(FormItem, {
63
74
  record: element,
64
75
  key: index2,
65
76
  recordData: props.recordData,
66
- columnsIndex: props.columnsIndex,
77
+ columnsIndex: getIndex(item.index),
67
78
  onClickEvent: onClick,
68
79
  onFileUpdateEvent: onUpdate,
69
80
  onClickColumnsEvent: onClickColumns
70
81
  }, null, 8, ["record", "recordData", "columnsIndex"]);
71
82
  }), 128))
72
- ], 4)
83
+ ], 12, _hoisted_1)
73
84
  ]),
74
85
  _: 2
75
- }, 1032, ["flex"]);
86
+ }, 1032, ["flex", "style"]);
76
87
  }), 128))
77
88
  ]),
78
89
  _: 1
@@ -81,7 +92,7 @@ const _sfc_main = {
81
92
  };
82
93
  }
83
94
  };
84
- const SingleColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1fc2bfb4"]]);
95
+ const MultipleColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-20b79e7a"]]);
85
96
  export {
86
- SingleColumn as default
97
+ MultipleColumn as default
87
98
  };
@@ -1,15 +1,52 @@
1
- import { resolveComponent, createElementBlock, openBlock, normalizeStyle, createVNode, withCtx, Fragment, renderList, createBlock, createElementVNode } from "vue";
1
+ import { ref, computed, watch, resolveComponent, createElementBlock, openBlock, normalizeStyle, createElementVNode, createVNode, withCtx, TransitionGroup, Fragment, renderList, createBlock, Transition, createCommentVNode } from "vue";
2
2
  import FormItem from "./sun-card-design-pc.es25.js";
3
3
  /* empty css */
4
4
  import _export_sfc from "./sun-card-design-pc.es28.js";
5
- const _hoisted_1 = ["onClick"];
5
+ const _hoisted_1 = { class: "expand-list-container" };
6
+ const _hoisted_2 = ["onClick"];
6
7
  const _sfc_main = {
7
- __name: "multipleColumn",
8
+ __name: "multipleLine",
8
9
  props: ["record", "recordData", "columnsIndex"],
9
10
  emits: ["clickEvent", "clickColumnsEvent", "fileUpdateEvent"],
10
11
  setup(__props, { emit: __emit }) {
11
12
  const props = __props;
12
13
  const emit = __emit;
14
+ const currentDisplayCount = ref(0);
15
+ const collapse = computed(() => props.record.options?.style?.collapse ?? false);
16
+ const collapseLine = computed(() => props.record.options?.style?.collapseLine ?? 2);
17
+ const expandType = computed(() => props.record.options?.style?.expandType || "noRepeat");
18
+ const expandLine = computed(() => props.record.options?.style?.expandLine ?? 2);
19
+ const totalColumns = computed(() => props.record.columns?.length || 0);
20
+ watch([collapse, collapseLine, totalColumns], () => {
21
+ if (collapse.value) {
22
+ currentDisplayCount.value = Math.min(collapseLine.value, totalColumns.value);
23
+ } else {
24
+ currentDisplayCount.value = totalColumns.value;
25
+ }
26
+ if (currentDisplayCount.value > totalColumns.value) {
27
+ currentDisplayCount.value = totalColumns.value;
28
+ }
29
+ }, { immediate: true });
30
+ const displayedColumns = computed(() => {
31
+ if (!collapse.value) {
32
+ return props.record.columns || [];
33
+ }
34
+ return (props.record.columns || []).slice(0, currentDisplayCount.value);
35
+ });
36
+ const showExpandMore = computed(() => {
37
+ if (!collapse.value) return false;
38
+ return currentDisplayCount.value < totalColumns.value;
39
+ });
40
+ const handleExpandMore = () => {
41
+ if (expandType.value === "noRepeat") {
42
+ currentDisplayCount.value = totalColumns.value;
43
+ } else if (expandType.value === "repeat") {
44
+ currentDisplayCount.value = Math.min(
45
+ currentDisplayCount.value + expandLine.value,
46
+ totalColumns.value
47
+ );
48
+ }
49
+ };
13
50
  const getIndex = (index) => {
14
51
  if (index !== void 0) {
15
52
  return index;
@@ -26,73 +63,100 @@ const _sfc_main = {
26
63
  if (!record.options.clickEvent) return;
27
64
  emit("clickColumnsEvent", record);
28
65
  };
29
- const getBackground = () => {
66
+ function isGradientColor(color) {
67
+ return /^(linear|radial)-gradient\(.*\)$/.test(color);
68
+ }
69
+ const getBackground = computed(() => {
70
+ if (!props.recordData?.config?.background) {
71
+ return "transparent";
72
+ }
30
73
  if (isGradientColor(props.recordData.config.background)) {
31
74
  return "none";
32
75
  }
33
76
  return props.recordData.config.background;
34
- };
35
- function isGradientColor(color) {
36
- return /^(linear|radial)-gradient\(.*\)$/.test(color);
37
- }
77
+ });
38
78
  return (_ctx, _cache) => {
39
79
  const _component_a_col = resolveComponent("a-col");
40
80
  const _component_a_row = resolveComponent("a-row");
41
81
  return openBlock(), createElementBlock("div", {
42
82
  class: "main-grid",
43
- style: normalizeStyle({ background: getBackground() })
83
+ style: normalizeStyle({ background: getBackground.value })
44
84
  }, [
45
- createVNode(_component_a_row, {
46
- gutter: [props.record.options.style.lrGutter, props.record.options.style.tbGutter]
47
- }, {
48
- default: withCtx(() => [
49
- (openBlock(true), createElementBlock(Fragment, null, renderList(props.record.columns, (item, index) => {
50
- return openBlock(), createBlock(_component_a_col, {
51
- key: index.toString(),
52
- flex: props.record.columns[index]?.flex,
53
- span: 24,
54
- style: normalizeStyle({
55
- flex: props.record.columns[index]?.flex
56
- })
85
+ createElementVNode("div", _hoisted_1, [
86
+ createVNode(_component_a_row, {
87
+ gutter: [props.record.options.style.lrGutter, props.record.options.style.tbGutter]
88
+ }, {
89
+ default: withCtx(() => [
90
+ createVNode(TransitionGroup, {
91
+ name: "expand-list",
92
+ tag: "div",
93
+ class: "expand-list-group"
57
94
  }, {
58
95
  default: withCtx(() => [
59
- createElementVNode("div", {
60
- class: "box",
61
- style: normalizeStyle({
62
- background: props.record.options.style?.background,
63
- border: props.record.options.style?.borderColor === "none" ? "none" : "1px solid " + (props.record.options.style?.borderColor || "transparent"),
64
- borderRadius: props.record.options.style?.borderRadius + "px",
65
- padding: props.record.options.style?.tbPadding + "px " + props.record.options.style?.lrPadding + "px",
66
- justifyContent: props.record.options.style?.alignItems || "start",
67
- minHeight: props.record.options.style?.minHeight + "px" || "48px",
68
- boxShadow: props.record.options.style?.boxShadow || null
69
- }),
70
- onClick: ($event) => onClickColumns(item)
71
- }, [
72
- (openBlock(true), createElementBlock(Fragment, null, renderList(item.list, (element, index2) => {
73
- return openBlock(), createBlock(FormItem, {
74
- record: element,
75
- key: index2,
76
- recordData: props.recordData,
77
- columnsIndex: getIndex(item.index),
78
- onClickEvent: onClick,
79
- onFileUpdateEvent: onUpdate,
80
- onClickColumnsEvent: onClickColumns
81
- }, null, 8, ["record", "recordData", "columnsIndex"]);
82
- }), 128))
83
- ], 12, _hoisted_1)
96
+ (openBlock(true), createElementBlock(Fragment, null, renderList(displayedColumns.value, (item, index) => {
97
+ return openBlock(), createBlock(_component_a_col, {
98
+ key: item.uuid || `col-${index}`,
99
+ flex: item.flex,
100
+ span: 24,
101
+ style: normalizeStyle({
102
+ flex: _ctx.none
103
+ }),
104
+ class: "expand-col-item"
105
+ }, {
106
+ default: withCtx(() => [
107
+ createElementVNode("div", {
108
+ class: "box",
109
+ style: normalizeStyle({
110
+ background: props.record.options.style?.background,
111
+ border: props.record.options.style?.borderColor === "none" ? "none" : "1px solid " + (props.record.options.style?.borderColor || "transparent"),
112
+ borderRadius: props.record.options.style?.borderRadius + "px",
113
+ padding: props.record.options.style?.tbPadding + "px " + props.record.options.style?.lrPadding + "px",
114
+ justifyContent: props.record.options.style?.alignItems || "start",
115
+ minHeight: props.record.options.style?.minHeight + "px" || "48px",
116
+ boxShadow: props.record.options.style?.boxShadow || null
117
+ }),
118
+ onClick: ($event) => onClickColumns(item)
119
+ }, [
120
+ (openBlock(true), createElementBlock(Fragment, null, renderList(item.list, (element, index2) => {
121
+ return openBlock(), createBlock(FormItem, {
122
+ record: element,
123
+ key: index2,
124
+ recordData: props.recordData,
125
+ columnsIndex: getIndex(item.index),
126
+ onClickEvent: onClick,
127
+ onFileUpdateEvent: onUpdate,
128
+ onClickColumnsEvent: onClickColumns
129
+ }, null, 8, ["record", "recordData", "columnsIndex"]);
130
+ }), 128))
131
+ ], 12, _hoisted_2)
132
+ ]),
133
+ _: 2
134
+ }, 1032, ["flex", "style"]);
135
+ }), 128))
84
136
  ]),
85
- _: 2
86
- }, 1032, ["flex", "style"]);
87
- }), 128))
137
+ _: 1
138
+ })
139
+ ]),
140
+ _: 1
141
+ }, 8, ["gutter"])
142
+ ]),
143
+ createVNode(Transition, { name: "fade" }, {
144
+ default: withCtx(() => [
145
+ showExpandMore.value ? (openBlock(), createElementBlock("div", {
146
+ key: 0,
147
+ class: "expand-more",
148
+ onClick: handleExpandMore
149
+ }, [..._cache[0] || (_cache[0] = [
150
+ createElementVNode("span", null, "展开更多", -1)
151
+ ])])) : createCommentVNode("", true)
88
152
  ]),
89
153
  _: 1
90
- }, 8, ["gutter"])
154
+ })
91
155
  ], 4);
92
156
  };
93
157
  }
94
158
  };
95
- const MultipleColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-20b79e7a"]]);
159
+ const MultipleLine = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-dad6f574"]]);
96
160
  export {
97
- MultipleColumn as default
161
+ MultipleLine as default
98
162
  };
@@ -1,6 +1,6 @@
1
1
  import { ref, watch, createElementBlock, openBlock, normalizeStyle, createElementVNode } from "vue";
2
2
  import { renderTextByVariables } from "./sun-card-design-pc.es26.js";
3
- import IMG from "./sun-card-design-pc.es32.js";
3
+ import { IMG } from "./sun-card-design-pc.es32.js";
4
4
  /* empty css */
5
5
  import _export_sfc from "./sun-card-design-pc.es28.js";
6
6
  const _sfc_main = {
@@ -91,7 +91,7 @@ const _sfc_main = {
91
91
  };
92
92
  }
93
93
  };
94
- const Picture = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-de06c2bc"]]);
94
+ const Picture = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b7f1d53f"]]);
95
95
  export {
96
96
  Picture as default
97
97
  };
@@ -1,15 +1,52 @@
1
- import { resolveComponent, createElementBlock, openBlock, normalizeStyle, createVNode, withCtx, Fragment, renderList, createBlock, createElementVNode, normalizeClass } from "vue";
1
+ import { ref, computed, watch, resolveComponent, createElementBlock, openBlock, normalizeStyle, createElementVNode, createVNode, withCtx, TransitionGroup, Fragment, renderList, createBlock, Transition, createCommentVNode } from "vue";
2
2
  import FormItem from "./sun-card-design-pc.es25.js";
3
3
  /* empty css */
4
4
  import _export_sfc from "./sun-card-design-pc.es28.js";
5
- const _hoisted_1 = ["onClick"];
5
+ const _hoisted_1 = { class: "expand-list-container" };
6
+ const _hoisted_2 = ["onClick"];
6
7
  const _sfc_main = {
7
- __name: "multipleLine",
8
+ __name: "gridList",
8
9
  props: ["record", "recordData", "columnsIndex"],
9
10
  emits: ["clickEvent", "clickColumnsEvent", "fileUpdateEvent"],
10
11
  setup(__props, { emit: __emit }) {
11
12
  const props = __props;
12
13
  const emit = __emit;
14
+ const currentDisplayRows = ref(0);
15
+ const collapse = computed(() => props.record.options?.style?.collapse ?? false);
16
+ const collapseLine = computed(() => props.record.options?.style?.collapseLine ?? 2);
17
+ const expandType = computed(() => props.record.options?.style?.expandType || "noRepeat");
18
+ const expandLine = computed(() => props.record.options?.style?.expandLine ?? 2);
19
+ const totalColumns = computed(() => props.record.columns?.length || 0);
20
+ const autoNumber = computed(() => props.record.options?.autoNumber || 2);
21
+ const totalRows = computed(() => Math.ceil(totalColumns.value / autoNumber.value));
22
+ watch([collapse, collapseLine, totalRows], () => {
23
+ if (collapse.value) {
24
+ currentDisplayRows.value = Math.min(collapseLine.value, totalRows.value);
25
+ } else {
26
+ currentDisplayRows.value = totalRows.value;
27
+ }
28
+ }, { immediate: true });
29
+ const displayedColumns = computed(() => {
30
+ if (!collapse.value) {
31
+ return props.record.columns || [];
32
+ }
33
+ const displayCount = currentDisplayRows.value * autoNumber.value;
34
+ return (props.record.columns || []).slice(0, displayCount);
35
+ });
36
+ const showExpandMore = computed(() => {
37
+ if (!collapse.value) return false;
38
+ return currentDisplayRows.value < totalRows.value;
39
+ });
40
+ const handleExpandMore = () => {
41
+ if (expandType.value === "noRepeat") {
42
+ currentDisplayRows.value = totalRows.value;
43
+ } else if (expandType.value === "repeat") {
44
+ currentDisplayRows.value = Math.min(
45
+ currentDisplayRows.value + expandLine.value,
46
+ totalRows.value
47
+ );
48
+ }
49
+ };
13
50
  const getIndex = (index) => {
14
51
  if (index !== void 0) {
15
52
  return index;
@@ -26,73 +63,100 @@ const _sfc_main = {
26
63
  if (!record.options.clickEvent) return;
27
64
  emit("clickColumnsEvent", record);
28
65
  };
29
- const getBackground = () => {
66
+ function isGradientColor(color) {
67
+ return /^(linear|radial)-gradient\(.*\)$/.test(color);
68
+ }
69
+ const getBackground = computed(() => {
70
+ if (!props.recordData?.config?.background) {
71
+ return "transparent";
72
+ }
30
73
  if (isGradientColor(props.recordData.config.background)) {
31
74
  return "none";
32
75
  }
33
76
  return props.recordData.config.background;
34
- };
35
- function isGradientColor(color) {
36
- return /^(linear|radial)-gradient\(.*\)$/.test(color);
37
- }
77
+ });
38
78
  return (_ctx, _cache) => {
39
79
  const _component_a_col = resolveComponent("a-col");
40
80
  const _component_a_row = resolveComponent("a-row");
41
81
  return openBlock(), createElementBlock("div", {
42
82
  class: "main-grid",
43
- style: normalizeStyle({ background: getBackground() })
83
+ style: normalizeStyle({ background: getBackground.value })
44
84
  }, [
45
- createVNode(_component_a_row, {
46
- gutter: [props.record.options.style.lrGutter, props.record.options.style.tbGutter]
47
- }, {
48
- default: withCtx(() => [
49
- (openBlock(true), createElementBlock(Fragment, null, renderList(props.record.columns, (item, index) => {
50
- return openBlock(), createBlock(_component_a_col, {
51
- key: index.toString(),
52
- flex: props.record.columns[index]?.flex,
53
- span: 24,
54
- style: normalizeStyle({
55
- flex: _ctx.none
56
- })
85
+ createElementVNode("div", _hoisted_1, [
86
+ createVNode(_component_a_row, {
87
+ gutter: [props.record.options.style.lrGutter, props.record.options.style.tbGutter]
88
+ }, {
89
+ default: withCtx(() => [
90
+ createVNode(TransitionGroup, {
91
+ name: "expand-list",
92
+ tag: "div",
93
+ class: "expand-list-group"
57
94
  }, {
58
95
  default: withCtx(() => [
59
- createElementVNode("div", {
60
- class: normalizeClass(["box", { active: _ctx.currentUuid === item.uuid }]),
61
- style: normalizeStyle({
62
- background: props.record.options.style?.background,
63
- border: props.record.options.style?.borderColor === "none" ? "none" : "1px solid " + (props.record.options.style?.borderColor || "transparent"),
64
- borderRadius: props.record.options.style?.borderRadius + "px",
65
- padding: props.record.options.style?.tbPadding + "px " + props.record.options.style?.lrPadding + "px",
66
- justifyContent: props.record.options.style?.alignItems || "start",
67
- minHeight: props.record.options.style?.minHeight + "px" || "48px",
68
- boxShadow: props.record.options.style?.boxShadow || null
69
- }),
70
- onClick: ($event) => onClickColumns(item)
71
- }, [
72
- (openBlock(true), createElementBlock(Fragment, null, renderList(item.list, (element, index2) => {
73
- return openBlock(), createBlock(FormItem, {
74
- record: element,
75
- key: index2,
76
- recordData: props.recordData,
77
- columnsIndex: getIndex(item.index),
78
- onClickEvent: onClick,
79
- onFileUpdateEvent: onUpdate,
80
- onClickColumnsEvent: onClickColumns
81
- }, null, 8, ["record", "recordData", "columnsIndex"]);
82
- }), 128))
83
- ], 14, _hoisted_1)
96
+ (openBlock(true), createElementBlock(Fragment, null, renderList(displayedColumns.value, (item, index) => {
97
+ return openBlock(), createBlock(_component_a_col, {
98
+ key: item.uuid || `col-${index}`,
99
+ flex: item.flex,
100
+ span: 24 / props.record.options.autoNumber,
101
+ style: normalizeStyle({
102
+ flex: _ctx.none
103
+ }),
104
+ class: "expand-col-item"
105
+ }, {
106
+ default: withCtx(() => [
107
+ createElementVNode("div", {
108
+ class: "box",
109
+ style: normalizeStyle({
110
+ background: props.record.options.style?.background,
111
+ border: props.record.options.style?.borderColor === "none" ? "none" : "1px solid " + (props.record.options.style?.borderColor || "transparent"),
112
+ borderRadius: props.record.options.style?.borderRadius + "px",
113
+ padding: props.record.options.style?.tbPadding + "px " + props.record.options.style?.lrPadding + "px",
114
+ justifyContent: props.record.options.style?.alignItems || "start",
115
+ minHeight: props.record.options.style?.minHeight + "px" || "48px",
116
+ boxShadow: props.record.options.style?.boxShadow || null
117
+ }),
118
+ onClick: ($event) => onClickColumns(item)
119
+ }, [
120
+ (openBlock(true), createElementBlock(Fragment, null, renderList(item.list, (element, index2) => {
121
+ return openBlock(), createBlock(FormItem, {
122
+ record: element,
123
+ key: index2,
124
+ recordData: props.recordData,
125
+ columnsIndex: getIndex(item.index),
126
+ onClickEvent: onClick,
127
+ onFileUpdateEvent: onUpdate,
128
+ onClickColumnsEvent: onClickColumns
129
+ }, null, 8, ["record", "recordData", "columnsIndex"]);
130
+ }), 128))
131
+ ], 12, _hoisted_2)
132
+ ]),
133
+ _: 2
134
+ }, 1032, ["flex", "span", "style"]);
135
+ }), 128))
84
136
  ]),
85
- _: 2
86
- }, 1032, ["flex", "style"]);
87
- }), 128))
137
+ _: 1
138
+ })
139
+ ]),
140
+ _: 1
141
+ }, 8, ["gutter"])
142
+ ]),
143
+ createVNode(Transition, { name: "fade" }, {
144
+ default: withCtx(() => [
145
+ showExpandMore.value ? (openBlock(), createElementBlock("div", {
146
+ key: 0,
147
+ class: "expand-more",
148
+ onClick: handleExpandMore
149
+ }, [..._cache[0] || (_cache[0] = [
150
+ createElementVNode("span", null, "展开更多", -1)
151
+ ])])) : createCommentVNode("", true)
88
152
  ]),
89
153
  _: 1
90
- }, 8, ["gutter"])
154
+ })
91
155
  ], 4);
92
156
  };
93
157
  }
94
158
  };
95
- const MultipleLine = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c1ba89a8"]]);
159
+ const GridList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-159c873b"]]);
96
160
  export {
97
- MultipleLine as default
161
+ GridList as default
98
162
  };
@@ -1 +1 @@
1
- .main-title[data-v-1093ec93]{display:flex;align-items:center;width:100%}.main-title .line[data-v-1093ec93]{width:5px;border-radius:2px;margin-right:6px}.main-title h3[data-v-1093ec93]{margin:0}.main-text[data-v-1705860f]{display:flex;align-items:center;width:100%}.main-text .line[data-v-1705860f]{width:4px;border-radius:1px;margin-right:6px}.main-button[data-v-a265d74a]{display:flex;align-items:center;margin:0;padding:0;width:100%}.main-grid[data-v-812d703d]{width:100%}.main-grid .box[data-v-812d703d]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-title[data-v-42f0f48a]{width:100%}.main-title .file-box[data-v-42f0f48a]{display:grid;grid-template-columns:32px 1fr;grid-column-gap:10px;align-items:flex-start}.main-title .file-box .file-icon[data-v-42f0f48a]{grid-column:1 / 2;grid-row:1 / span 2;display:flex;align-items:flex-start}.main-title .file-box .file-icon.align-center[data-v-42f0f48a]{align-self:center}.main-title .file-box .name[data-v-42f0f48a]{grid-column:2 / 3;grid-row:1 / 2;margin:0;line-height:1.2;align-self:flex-start}.main-title .file-box .name.align-center[data-v-42f0f48a]{grid-row:1 / span 2;align-self:center}.main-title .file-box .subtitle[data-v-42f0f48a]{grid-column:2 / 3;grid-row:2 / 3;margin-top:4px;line-height:1.4;word-break:break-word;white-space:normal}.main-title .file-box[data-v-42f0f48a] svg path{fill:currentColor!important}.upload-comp[data-v-4363e2fe]{display:flex;flex-direction:column;align-items:flex-start;width:100%;overflow:hidden;border-radius:6px}.upload-comp .parse-type-info[data-v-4363e2fe]{margin-top:8px;display:flex;align-items:center}.upload-comp .upload-progress[data-v-4363e2fe]{display:flex;position:absolute;left:50%;top:12px;width:90%;transform:translate(-50%);z-index:1000;display:inline-flex;align-items:center;gap:12px;background:#404040f2;color:#fff;padding:10px 16px;border-radius:12px;box-shadow:0 6px 18px #0003}.upload-comp .upload-progress .spinner[data-v-4363e2fe]{width:28px;height:28px;border-radius:50%;border:3px solid rgba(255,255,255,.2);border-top-color:#4ad46a;animation:spin-4363e2fe 1s linear infinite}.upload-comp .upload-progress .progress-text-container[data-v-4363e2fe]{flex:1;display:flex;align-items:center;justify-content:space-between}.upload-comp .upload-progress .progress-text[data-v-4363e2fe]{font-size:14px;color:#fff}.upload-comp .upload-progress .cancel-btn[data-v-4363e2fe]{background:#666;color:#eee;border:none}@keyframes spin-4363e2fe{to{transform:rotate(360deg)}}.upload-comp .file-list[data-v-4363e2fe]{width:100%;margin-top:6px}.upload-comp .file-item-name[data-v-4363e2fe]{font-size:13px;color:#333}.main-picture[data-v-de06c2bc]{display:flex;width:100%}.main-picture .picture-container[data-v-de06c2bc]{background-color:#fff;border-radius:4px}.main-picture h3[data-v-de06c2bc]{margin:0}.main-tag[data-v-6bc73f7b],.main-rate[data-v-20282c61]{width:100%}.main-rate[data-v-20282c61] .ant-rate-star-full,.main-rate[data-v-20282c61] .ant-rate-star-half,.main-rate[data-v-20282c61] .ant-rate-star-active{color:#ff9500}.main-divider[data-v-bd99764a]{display:flex;justify-content:center;align-items:center;width:100%}.custom-player[data-v-f85fd551]{--play-btn-color: #4a6bff;--progress-color: linear-gradient(90deg, #ff4d4d, #f9cb28);width:100%;position:relative}.custom-player audio[data-v-f85fd551]{display:none}.controls[data-v-f85fd551]{display:flex;align-items:center}.play-btn[data-v-f85fd551]{width:32px;height:32px;background:var(--play-btn-color);border-radius:50%;border:none;cursor:pointer;position:relative;margin-right:15px;transition:all .3s}.play-btn[data-v-f85fd551]:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-35%,-50%);width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid white}.play-btn.paused[data-v-f85fd551]:before{width:14px;height:16px;border:none;background:linear-gradient(to right,white 0 4px,transparent 4px) left center / 4px 16px no-repeat,linear-gradient(to right,white 0 4px,transparent 4px) right center / 4px 16px no-repeat;transform:translate(-50%,-50%)}.progress-container[data-v-f85fd551]{flex:1;height:4px;background:#0000001a;border-radius:2px;cursor:pointer}.progress-bar[data-v-f85fd551]{height:100%;width:0;background:var(--progress-color);border-radius:2px;position:relative}.progress-bar[data-v-f85fd551]:after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:12px;height:12px;background:#fff;border-radius:50%;box-shadow:0 0 4px #0000004d;opacity:0;transition:opacity .2s}.progress-container:hover .progress-bar[data-v-f85fd551]:after{opacity:1}.main-audio[data-v-3a42929f],.main-select[data-v-5707ab7d]{width:100%}.main-select h3[data-v-5707ab7d],.main-select[data-v-5707ab7d] .ant-form-item{margin:0}.main-video[data-v-ba6459c2]{width:100%}.main-video .custom-video[data-v-ba6459c2]{width:100%;outline:none;background:#000}.main-input[data-v-f4e2b8e3]{width:100%}.main-input h3[data-v-f4e2b8e3],.main-input[data-v-f4e2b8e3] .ant-form-item{margin:0}.main-button[data-v-4806336e]{display:flex;align-items:center;margin:0;width:100%}.main-enterpriseSearch[data-v-d616ad69]{width:100%}.main-enterpriseSearch h3[data-v-d616ad69],.main-enterpriseSearch[data-v-d616ad69] .ant-form-item{margin:0}.main-table[data-v-f6dd6b54]{width:100%}.main-table[data-v-f6dd6b54] .ant-table{font-size:var(--tbl-font-size)}.main-table[data-v-f6dd6b54] .ant-table-cell{padding:var(--tbl-cell-padding)!important;font-size:var(--tbl-font-size)}.barChart-table[data-v-bdc1c7d2],.pieChart-table[data-v-28332879],.lineChart-table[data-v-c3a80733]{width:100%}.mian-barChart3d[data-v-d1f70e46]{width:100%;background:#f7f7fc;border-radius:6px}.main-pieChart3d[data-v-991262f9]{width:100%;background:#f7f7fc}.canvas[data-v-d6ec0f1f]{display:flex;justify-content:center;align-items:center;position:fixed;left:0;top:0;width:100%;height:100%;z-index:9999;background:#0009}.canvas .canvas-view[data-v-d6ec0f1f]{position:relative;width:calc(100% - 60px);height:calc(100% - 100px);border-radius:10px;background-color:#3e8be4ad;overflow:hidden}.canvas .icon[data-v-d6ec0f1f]{position:absolute;top:30px;right:10px;font-size:26px;color:#fff}.main-panorama[data-v-bf23cf13]{width:100%;border-radius:6px}.main-panorama .panorama-box[data-v-bf23cf13]{overflow:hidden;position:relative;z-index:1}.main-panorama .panorama-box .panorama-box-icon[data-v-bf23cf13]{position:absolute;right:10px;top:10px;cursor:pointer}.main-icon[data-v-4b920fa7],.main-singleColumn[data-v-1fc2bfb4]{width:100%}.main-singleColumn .box[data-v-1fc2bfb4]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-grid[data-v-20b79e7a]{width:100%}.main-grid .box[data-v-20b79e7a]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-grid[data-v-c1ba89a8]{width:100%}.main-grid .box[data-v-c1ba89a8]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-grid[data-v-c6c62c4f]{width:100%}.main-grid .box[data-v-c6c62c4f]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-box[data-v-1202bb9d]{position:relative}.msg-main[data-v-9e0be1d2]{height:auto;border:1px solid #f1f1f1;overflow:hidden}
1
+ .main-title[data-v-1093ec93]{display:flex;align-items:center;width:100%}.main-title .line[data-v-1093ec93]{width:5px;border-radius:2px;margin-right:6px}.main-title h3[data-v-1093ec93]{margin:0}.main-text[data-v-1705860f]{display:flex;align-items:center;width:100%}.main-text .line[data-v-1705860f]{width:4px;border-radius:1px;margin-right:6px}.main-button[data-v-a265d74a]{display:flex;align-items:center;margin:0;padding:0;width:100%}.main-grid[data-v-812d703d]{width:100%}.main-grid .box[data-v-812d703d]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-title[data-v-42f0f48a]{width:100%}.main-title .file-box[data-v-42f0f48a]{display:grid;grid-template-columns:32px 1fr;grid-column-gap:10px;align-items:flex-start}.main-title .file-box .file-icon[data-v-42f0f48a]{grid-column:1 / 2;grid-row:1 / span 2;display:flex;align-items:flex-start}.main-title .file-box .file-icon.align-center[data-v-42f0f48a]{align-self:center}.main-title .file-box .name[data-v-42f0f48a]{grid-column:2 / 3;grid-row:1 / 2;margin:0;line-height:1.2;align-self:flex-start}.main-title .file-box .name.align-center[data-v-42f0f48a]{grid-row:1 / span 2;align-self:center}.main-title .file-box .subtitle[data-v-42f0f48a]{grid-column:2 / 3;grid-row:2 / 3;margin-top:4px;line-height:1.4;word-break:break-word;white-space:normal}.main-title .file-box[data-v-42f0f48a] svg path{fill:currentColor!important}.upload-comp[data-v-4363e2fe]{display:flex;flex-direction:column;align-items:flex-start;width:100%;overflow:hidden;border-radius:6px}.upload-comp .parse-type-info[data-v-4363e2fe]{margin-top:8px;display:flex;align-items:center}.upload-comp .upload-progress[data-v-4363e2fe]{display:flex;position:absolute;left:50%;top:12px;width:90%;transform:translate(-50%);z-index:1000;display:inline-flex;align-items:center;gap:12px;background:#404040f2;color:#fff;padding:10px 16px;border-radius:12px;box-shadow:0 6px 18px #0003}.upload-comp .upload-progress .spinner[data-v-4363e2fe]{width:28px;height:28px;border-radius:50%;border:3px solid rgba(255,255,255,.2);border-top-color:#4ad46a;animation:spin-4363e2fe 1s linear infinite}.upload-comp .upload-progress .progress-text-container[data-v-4363e2fe]{flex:1;display:flex;align-items:center;justify-content:space-between}.upload-comp .upload-progress .progress-text[data-v-4363e2fe]{font-size:14px;color:#fff}.upload-comp .upload-progress .cancel-btn[data-v-4363e2fe]{background:#666;color:#eee;border:none}@keyframes spin-4363e2fe{to{transform:rotate(360deg)}}.upload-comp .file-list[data-v-4363e2fe]{width:100%;margin-top:6px}.upload-comp .file-item-name[data-v-4363e2fe]{font-size:13px;color:#333}.main-picture[data-v-b7f1d53f]{display:flex;width:100%}.main-picture .picture-container[data-v-b7f1d53f]{background-color:#fff;border-radius:4px}.main-picture h3[data-v-b7f1d53f]{margin:0}.main-tag[data-v-6bc73f7b],.main-rate[data-v-20282c61]{width:100%}.main-rate[data-v-20282c61] .ant-rate-star-full,.main-rate[data-v-20282c61] .ant-rate-star-half,.main-rate[data-v-20282c61] .ant-rate-star-active{color:#ff9500}.main-divider[data-v-bd99764a]{display:flex;justify-content:center;align-items:center;width:100%}.custom-player[data-v-f85fd551]{--play-btn-color: #4a6bff;--progress-color: linear-gradient(90deg, #ff4d4d, #f9cb28);width:100%;position:relative}.custom-player audio[data-v-f85fd551]{display:none}.controls[data-v-f85fd551]{display:flex;align-items:center}.play-btn[data-v-f85fd551]{width:32px;height:32px;background:var(--play-btn-color);border-radius:50%;border:none;cursor:pointer;position:relative;margin-right:15px;transition:all .3s}.play-btn[data-v-f85fd551]:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-35%,-50%);width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid white}.play-btn.paused[data-v-f85fd551]:before{width:14px;height:16px;border:none;background:linear-gradient(to right,white 0 4px,transparent 4px) left center / 4px 16px no-repeat,linear-gradient(to right,white 0 4px,transparent 4px) right center / 4px 16px no-repeat;transform:translate(-50%,-50%)}.progress-container[data-v-f85fd551]{flex:1;height:4px;background:#0000001a;border-radius:2px;cursor:pointer}.progress-bar[data-v-f85fd551]{height:100%;width:0;background:var(--progress-color);border-radius:2px;position:relative}.progress-bar[data-v-f85fd551]:after{content:"";position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:12px;height:12px;background:#fff;border-radius:50%;box-shadow:0 0 4px #0000004d;opacity:0;transition:opacity .2s}.progress-container:hover .progress-bar[data-v-f85fd551]:after{opacity:1}.main-audio[data-v-3a42929f],.main-select[data-v-5707ab7d]{width:100%}.main-select h3[data-v-5707ab7d],.main-select[data-v-5707ab7d] .ant-form-item{margin:0}.main-video[data-v-ba6459c2]{width:100%}.main-video .custom-video[data-v-ba6459c2]{width:100%;outline:none;background:#000}.main-input[data-v-f4e2b8e3]{width:100%}.main-input h3[data-v-f4e2b8e3],.main-input[data-v-f4e2b8e3] .ant-form-item{margin:0}.main-button[data-v-4806336e]{display:flex;align-items:center;margin:0;width:100%}.main-enterpriseSearch[data-v-c4da076f]{width:100%}.main-enterpriseSearch h3[data-v-c4da076f],.main-enterpriseSearch[data-v-c4da076f] .ant-form-item{margin:0}.main-table[data-v-f6dd6b54]{width:100%}.main-table[data-v-f6dd6b54] .ant-table{font-size:var(--tbl-font-size)}.main-table[data-v-f6dd6b54] .ant-table-cell{padding:var(--tbl-cell-padding)!important;font-size:var(--tbl-font-size)}.barChart-table[data-v-bdc1c7d2],.pieChart-table[data-v-28332879],.lineChart-table[data-v-c3a80733]{width:100%}.mian-barChart3d[data-v-6b648570]{width:100%;background:#f7f7fc;border-radius:6px}.main-pieChart3d[data-v-b39e3b32]{width:100%;background:#f7f7fc}.canvas[data-v-d6ec0f1f]{display:flex;justify-content:center;align-items:center;position:fixed;left:0;top:0;width:100%;height:100%;z-index:9999;background:#0009}.canvas .canvas-view[data-v-d6ec0f1f]{position:relative;width:calc(100% - 60px);height:calc(100% - 100px);border-radius:10px;background-color:#3e8be4ad;overflow:hidden}.canvas .icon[data-v-d6ec0f1f]{position:absolute;top:30px;right:10px;font-size:26px;color:#fff}.main-panorama[data-v-bf23cf13]{width:100%;border-radius:6px}.main-panorama .panorama-box[data-v-bf23cf13]{overflow:hidden;position:relative;z-index:1}.main-panorama .panorama-box .panorama-box-icon[data-v-bf23cf13]{position:absolute;right:10px;top:10px;cursor:pointer}.main-icon[data-v-4b920fa7],.main-singleColumn[data-v-1fc2bfb4]{width:100%}.main-singleColumn .box[data-v-1fc2bfb4]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-grid[data-v-20b79e7a]{width:100%}.main-grid .box[data-v-20b79e7a]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-grid[data-v-dad6f574]{width:100%}.main-grid .box[data-v-dad6f574]{display:flex;flex-direction:column;width:100%;min-height:48px;border:1px solid #e9e9e9;overflow:hidden}.main-grid .expand-more[data-v-dad6f574]{text-align:center;padding:12px 0;cursor:pointer;color:#1677ff;font-size:14px;transition:color .3s}.main-grid .expand-more[data-v-dad6f574]:hover{color:#4096ff}.expand-list-container[data-v-dad6f574]{width:100%}.expand-list-group[data-v-dad6f574]{display:contents}.expand-list-enter-active[data-v-dad6f574]{transition:all .4s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(-20px)}.expand-list-enter-to[data-v-dad6f574]{opacity:1;transform:translateY(0)}.expand-list-enter-from[data-v-dad6f574]{opacity:0;transform:translateY(-20px)}.expand-list-move[data-v-dad6f574]{transition:transform .4s cubic-bezier(.4,0,.2,1)}.expand-col-item[data-v-dad6f574]{transition:opacity .3s ease,transform .3s ease}.fade-enter-active[data-v-dad6f574],.fade-leave-active[data-v-dad6f574]{transition:opacity .3s ease}.fade-enter-from[data-v-dad6f574],.fade-leave-to[data-v-dad6f574]{opacity:0}.main-grid[data-v-159c873b]{width:100%}.main-grid .box[data-v-159c873b]{display:flex;flex-direction:column;width:100%;min-height:48px;overflow:hidden}.main-grid .expand-more[data-v-159c873b]{text-align:center;padding:12px 0;cursor:pointer;color:#1677ff;font-size:14px;transition:color .3s}.main-grid .expand-more[data-v-159c873b]:hover{color:#4096ff}.expand-list-container[data-v-159c873b]{width:100%}.expand-list-group[data-v-159c873b]{display:contents}.expand-list-enter-active[data-v-159c873b]{transition:all .4s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(-20px)}.expand-list-enter-to[data-v-159c873b]{opacity:1;transform:translateY(0)}.expand-list-enter-from[data-v-159c873b]{opacity:0;transform:translateY(-20px)}.expand-list-move[data-v-159c873b]{transition:transform .4s cubic-bezier(.4,0,.2,1)}.expand-col-item[data-v-159c873b]{transition:opacity .3s ease,transform .3s ease}.fade-enter-active[data-v-159c873b],.fade-leave-active[data-v-159c873b]{transition:opacity .3s ease}.fade-enter-from[data-v-159c873b],.fade-leave-to[data-v-159c873b]{opacity:0}.main-box[data-v-1202bb9d]{position:relative}.msg-main[data-v-9e0be1d2]{height:auto;border:1px solid #f1f1f1;overflow:hidden}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sun-card-design",
3
- "version": "1.1.48",
3
+ "version": "1.2.1",
4
4
  "private": false,
5
5
  "description": "Vue3 卡片设计组件库,支持 PC 和移动端预览",
6
6
  "keywords": [
@@ -11,7 +11,7 @@
11
11
  "pc",
12
12
  "mobile"
13
13
  ],
14
- "author": "your-name <js-feng@foxmail.com>",
14
+ "author": "sunxfire",
15
15
  "license": "MIT",
16
16
  "repository": {
17
17
  "type": "git",
@@ -228,6 +228,7 @@
228
228
  "@liripeng/vue-audio-player": "^2.0.4",
229
229
  "@tweenjs/tween.js": "^25.0.0",
230
230
  "ant-design-vue": "^4.1.2",
231
+ "axios": "^1.13.2",
231
232
  "crypto-js": "^4.2.0",
232
233
  "echarts": "^5.4.3",
233
234
  "html2canvas": "^1.4.1",
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file
Binary file