km-card-layout-component-miniprogram 0.1.9 → 0.1.10

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 (23) hide show
  1. package/example/pages/home/index.js +338 -63
  2. package/miniprogram_dist/components/card-layout/elements/custom-element/index.js +4 -0
  3. package/miniprogram_dist/components/card-layout/elements/icon-element/index.js +4 -0
  4. package/miniprogram_dist/components/card-layout/elements/image-element/index.js +6 -1
  5. package/miniprogram_dist/components/card-layout/elements/text-element/index.js +6 -1
  6. package/miniprogram_dist/components/card-layout/index.js +4 -2
  7. package/miniprogram_dist/components/card-layout/index.wxml +6 -6
  8. package/miniprogram_dist/vendor/km-card-layout-core/data.js +1 -1
  9. package/miniprogram_dist/vendor/km-card-layout-core/interface/index.js +0 -1
  10. package/miniprogram_dist/vendor/km-card-layout-core/render/helpers.js +14 -4
  11. package/package.json +1 -1
  12. package/src/components/card-layout/elements/custom-element/index.ts +4 -0
  13. package/src/components/card-layout/elements/icon-element/index.ts +4 -0
  14. package/src/components/card-layout/elements/image-element/index.ts +6 -1
  15. package/src/components/card-layout/elements/text-element/index.ts +6 -1
  16. package/src/components/card-layout/index.ts +4 -2
  17. package/src/components/card-layout/index.wxml +6 -6
  18. package/src/vendor/km-card-layout-core/data.ts +1 -3
  19. package/src/vendor/km-card-layout-core/interface/index.ts +0 -1
  20. package/src/vendor/km-card-layout-core/render/helpers.ts +21 -6
  21. package/src/vendor/km-card-layout-core/types.d.ts +5 -5
  22. package/miniprogram_dist/vendor/km-card-layout-core/interface/context.js +0 -2
  23. package/src/vendor/km-card-layout-core/interface/context.ts +0 -6
package/example/pages/home/index.js CHANGED
@@ -1,108 +1,383 @@
1
1
  const layouts = [
2
2
  {
3
- name: "内置布局-右侧logo",
4
- container: { mode: "absolute" },
3
+ name: "双面布局",
5
4
  width: 343,
6
5
  height: 210,
7
- backgroundImage:
8
- "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/0a7331e2e1a9a4cbc828afe6c338aaae.png",
9
- backgroundZIndex: 1,
10
- fontColor: "#333333",
11
6
  children: [
12
7
  {
13
- id: "f2dd3515-2147-460a-b788-3f58dd5f858b",
14
- type: "custom",
15
- style: { borderRadius: 0, backgroundColor: "currentColor" },
16
- layout: { x: 20, y: 104, mode: "absolute", width: 12, height: 1, zIndex: 8 },
8
+ id: "3",
9
+ key: "mobile",
10
+ icon: { name: "mobile", size: 10, style: "fill", enable: true },
11
+ type: "text",
12
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
13
+ layout: { x: 204, y: 157, mode: "absolute", width: 120, height: 13, zIndex: 1 },
14
+ binding: "user.mobile",
17
15
  },
18
16
  {
19
- id: "7fd4c8cd-6bea-42d0-9a80-b1ba27f4abd3",
20
- type: "custom",
21
- style: { borderRadius: 0, backgroundColor: "currentColor" },
22
- layout: { x: 37, y: 104, mode: "absolute", width: 105, height: 1, zIndex: 9 },
17
+ id: "4",
18
+ key: "duty",
19
+ type: "text",
20
+ style: { fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 14 },
21
+ layout: { x: 40, y: 96, mode: "absolute", width: 120, height: 14, zIndex: 2 },
22
+ binding: "user.duty",
23
23
  },
24
24
  {
25
25
  id: "1",
26
26
  key: "name",
27
27
  type: "text",
28
- style: { color: "", fontSize: 16, textAlign: "left", fontWeight: "bold", lineHeight: 22 },
29
- layout: { x: 20, y: 45, mode: "absolute", width: 210, height: 22, zIndex: 1 },
28
+ style: { fontSize: 16, textAlign: "left", fontWeight: "bold", lineHeight: 22 },
29
+ layout: { x: 40, y: 70, mode: "absolute", width: 120, height: 22, zIndex: 3 },
30
30
  binding: "user.name",
31
- defaultValue: "名片君",
32
31
  },
33
32
  {
34
33
  id: "2",
35
34
  key: "company",
35
+ icon: { name: "company", size: 10, style: "fill", enable: true },
36
36
  type: "text",
37
- style: { color: "", fontSize: 11, textAlign: "left", fontWeight: "normal", lineHeight: 15 },
38
- layout: { x: 20, y: 74, mode: "absolute", width: 210, height: 15, zIndex: 3 },
37
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
38
+ layout: { x: 15, y: 157, mode: "absolute", width: 162, height: 13, zIndex: 4 },
39
39
  binding: "user.company",
40
- defaultValue: "合肥魅客网络有限公司",
41
- icon: { name: "company" },
42
40
  },
43
41
  {
44
- id: "4",
45
- key: "duty",
42
+ id: "5",
43
+ key: "email",
44
+ icon: { name: "email", size: 10, style: "fill", enable: true },
46
45
  type: "text",
47
- style: { color: "", fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 15 },
48
- layout: { x: 20, y: 21, mode: "absolute", width: 210, height: 15, zIndex: 2 },
49
- binding: "user.duty",
50
- defaultValue: "销售经理",
46
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
47
+ layout: { x: 204, y: 181, mode: "absolute", width: 120, height: 13, zIndex: 9 },
48
+ binding: "user.email",
51
49
  },
52
50
  {
53
- id: "3",
54
- key: "mobile",
55
- icon: { style: "fill", enable: true, name: "mobile" },
51
+ id: "9",
52
+ key: "address",
53
+ icon: { name: "address", size: 10, style: "fill", enable: true },
56
54
  type: "text",
57
- style: { color: "", fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 15 },
58
- layout: { x: 20, y: 123, mode: "absolute", width: 280, height: 15, zIndex: 5 },
59
- binding: "user.mobile",
60
- defaultValue: "18888888888",
55
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
56
+ layout: { x: 15, y: 181, mode: "absolute", width: 162, height: 26, zIndex: 10 },
57
+ binding: "user.addressName",
58
+ },
59
+ ],
60
+ container: { mode: "absolute" },
61
+ fontColor: "#ffffff",
62
+ backgroundImage:
63
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf.png",
64
+ backgroundZIndex: 0,
65
+ },
66
+ {
67
+ name: "双面布局-反面",
68
+ width: 343,
69
+ height: 210,
70
+ children: [
71
+ {
72
+ id: "12",
73
+ key: "en_name",
74
+ type: "text",
75
+ style: { fontSize: 16, textAlign: "left", fontWeight: "bold", lineHeight: 22 },
76
+ layout: { x: 40, y: 70, mode: "absolute", width: 180, height: 22, zIndex: 1 },
77
+ binding: "user.moreCardInfo.extInfo.name",
78
+ },
79
+ {
80
+ id: "13",
81
+ key: "en_duty",
82
+ type: "text",
83
+ style: { fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 14 },
84
+ layout: { x: 40, y: 96, mode: "absolute", width: 180, height: 14, zIndex: 2 },
85
+ binding: "user.moreCardInfo.extInfo.duty",
86
+ },
87
+ {
88
+ id: "14",
89
+ key: "en_company",
90
+ icon: { name: "company", style: "fill", enable: true },
91
+ type: "text",
92
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
93
+ layout: { x: 16, y: 157, mode: "absolute", width: 173, height: 13, zIndex: 3 },
94
+ binding: "user.moreCardInfo.extInfo.company",
95
+ },
96
+ {
97
+ id: "15",
98
+ key: "en_address",
99
+ icon: { name: "address", style: "fill", enable: true },
100
+ type: "text",
101
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
102
+ layout: { x: 16, y: 181, mode: "absolute", width: 173, height: 26, zIndex: 4 },
103
+ binding: "user.moreCardInfo.extInfo.address",
61
104
  },
62
105
  {
63
106
  id: "5",
64
107
  key: "email",
65
- icon: { style: "fill", enable: true, name: "email" },
108
+ icon: { name: "email", style: "fill", enable: true },
66
109
  type: "text",
67
- style: { color: "", fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 15 },
68
- layout: { x: 20, y: 145, mode: "absolute", width: 280, height: 15, zIndex: 6 },
110
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
111
+ layout: { x: 206, y: 181, mode: "absolute", width: 130, height: 13, zIndex: 9 },
69
112
  binding: "user.email",
70
- defaultValue: "km@kuanmai.com",
71
113
  },
72
114
  {
73
- id: "8",
74
- key: "logo",
75
- url: "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4c71811adfa51e1e3ab4181a88cebc87.png",
76
- type: "image",
77
- style: { color: "#000000", objectFit: "contain", borderRadius: 0 },
78
- layout: { x: 263, y: 20, mode: "absolute", width: 60, height: 60, zIndex: 4 },
79
- binding: "user.shareStyle.logo",
80
- defaultValue:
81
- "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4c71811adfa51e1e3ab4181a88cebc87.png",
82
- },
83
- {
84
- id: "9",
85
- key: "address",
86
- icon: { style: "fill", enable: true, name: "address" },
115
+ id: "3",
116
+ key: "mobile",
117
+ icon: { name: "mobile", style: "fill", enable: true },
87
118
  type: "text",
88
- style: { color: "", fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 15 },
89
- layout: { x: 20, y: 167, mode: "absolute", width: 280, height: 33, zIndex: 7 },
90
- binding: "user.addressName",
91
- defaultValue: "安徽省合肥市包河区硅谷大厦",
119
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
120
+ layout: { x: 206, y: 157, mode: "absolute", width: 130, height: 13, zIndex: 10 },
121
+ binding: "user.mobile",
92
122
  },
93
123
  ],
124
+ container: { mode: "absolute" },
125
+ fontColor: "#ffffff",
126
+ backgroundImage:
127
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf.png",
128
+ backgroundZIndex: 0,
94
129
  },
95
130
  ];
96
131
 
97
132
  const cardData = {
98
133
  user: {
99
- company: "Kuanmai Networks",
100
- name: "Ada Lovelace",
101
- duty: "Product Lead",
102
- phone: "+86 188-0000-0000",
103
- email: "ada@kuanmai.com",
104
- address: "1 Infinite Loop, Shenzhen",
105
- avatar: "https://picsum.photos/200/200?random=12",
134
+ companyRole: 0,
135
+ shareCardCode: "5fd4621ecd08cde75b915ffea91452b9",
136
+ vip: 20,
137
+ vipDays: 913,
138
+ vipLogo:
139
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/static/wechat/icon/user-vip-advanced-v2.png",
140
+ shareStyle: {
141
+ templateId: 7,
142
+ backgroundId: 33,
143
+ coverStyleId: 1,
144
+ hasAvatar: true,
145
+ hasLogo: true,
146
+ logo: "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202505/bf307d891024818150d955f6e5ebcd89.png",
147
+ bgMix: false,
148
+ person:
149
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202512/c49bb25859bc7d4d62e7117d6e5093bc.png",
150
+ styleId: 9,
151
+ template: 2,
152
+ background:
153
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/21dd21c0d693a1eb44e53bad64b9b94a.png",
154
+ colorStyle: 2,
155
+ coverStyle: 3,
156
+ backgroundConfig: {
157
+ id: 33,
158
+ name: "双面1",
159
+ fileId: 4834,
160
+ fontColor: "#ffffff",
161
+ fontColorExtra: [],
162
+ createAt: "2025-11-28 13:41:50",
163
+ updateAt: "2025-11-28 13:41:50",
164
+ file: {
165
+ id: 4834,
166
+ type: "image",
167
+ contentType: "image/png",
168
+ ext: "png",
169
+ hash: "4045e1c401d5ecf186409c98f54a4aaf",
170
+ url: "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf.png",
171
+ src: "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf.png",
172
+ imageThumb:
173
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf_thumb.jpg",
174
+ imageWidth: 1029,
175
+ imageHeight: 630,
176
+ mediaLong: 0,
177
+ size: 56139,
178
+ sensitiveStatus: 1,
179
+ sensitiveAt: 0,
180
+ sensitiveTraceId: "",
181
+ sensitiveResult: null,
182
+ sensitiveEndAt: 0,
183
+ checkStatus: 0,
184
+ checkAuid: 0,
185
+ checkMark: "",
186
+ checkAt: 0,
187
+ createAt: "2025-11-28 13:41:06",
188
+ updateAt: "2025-11-28 13:41:06",
189
+ deleteAt: 0,
190
+ },
191
+ },
192
+ templateConfig: {
193
+ id: 7,
194
+ name: "双面布局",
195
+ previewImg:
196
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/static/cardstyleV3/preview_01.png",
197
+ height: 210,
198
+ width: 343,
199
+ isBgCustomize: 0,
200
+ enableBgIds: "33,34",
201
+ enableItemIds: "1,2,3,4,5,9,12,13,14,15",
202
+ content: [
203
+ {
204
+ name: "双面布局",
205
+ width: 343,
206
+ height: 210,
207
+ children: [
208
+ {
209
+ id: "3",
210
+ key: "mobile",
211
+ icon: { name: "mobile", size: 10, style: "fill", enable: true },
212
+ type: "text",
213
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
214
+ layout: { x: 204, y: 157, mode: "absolute", width: 120, height: 13, zIndex: 1 },
215
+ binding: "user.mobile",
216
+ },
217
+ {
218
+ id: "4",
219
+ key: "duty",
220
+ type: "text",
221
+ style: { fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 14 },
222
+ layout: { x: 40, y: 96, mode: "absolute", width: 120, height: 14, zIndex: 2 },
223
+ binding: "user.duty",
224
+ },
225
+ {
226
+ id: "1",
227
+ key: "name",
228
+ type: "text",
229
+ style: { fontSize: 16, textAlign: "left", fontWeight: "bold", lineHeight: 22 },
230
+ layout: { x: 40, y: 70, mode: "absolute", width: 120, height: 22, zIndex: 3 },
231
+ binding: "user.name",
232
+ },
233
+ {
234
+ id: "2",
235
+ key: "company",
236
+ icon: { name: "company", size: 10, style: "fill", enable: true },
237
+ type: "text",
238
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
239
+ layout: { x: 15, y: 157, mode: "absolute", width: 162, height: 13, zIndex: 4 },
240
+ binding: "user.company",
241
+ },
242
+ {
243
+ id: "5",
244
+ key: "email",
245
+ icon: { name: "email", size: 10, style: "fill", enable: true },
246
+ type: "text",
247
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
248
+ layout: { x: 204, y: 181, mode: "absolute", width: 120, height: 13, zIndex: 9 },
249
+ binding: "user.email",
250
+ },
251
+ {
252
+ id: "9",
253
+ key: "address",
254
+ icon: { name: "address", size: 10, style: "fill", enable: true },
255
+ type: "text",
256
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
257
+ layout: { x: 15, y: 181, mode: "absolute", width: 162, height: 26, zIndex: 10 },
258
+ binding: "user.addressName",
259
+ },
260
+ ],
261
+ container: { mode: "absolute" },
262
+ fontColor: "#ffffff",
263
+ backgroundImage:
264
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf.png",
265
+ backgroundZIndex: 0,
266
+ },
267
+ {
268
+ name: "双面布局-反面",
269
+ width: 343,
270
+ height: 210,
271
+ children: [
272
+ {
273
+ id: "12",
274
+ key: "en_name",
275
+ type: "text",
276
+ style: { fontSize: 16, textAlign: "left", fontWeight: "bold", lineHeight: 22 },
277
+ layout: { x: 40, y: 70, mode: "absolute", width: 180, height: 22, zIndex: 1 },
278
+ binding: "user.moreCardInfo.extInfo.name",
279
+ },
280
+ {
281
+ id: "13",
282
+ key: "en_duty",
283
+ type: "text",
284
+ style: { fontSize: 10, textAlign: "left", fontWeight: "normal", lineHeight: 14 },
285
+ layout: { x: 40, y: 96, mode: "absolute", width: 180, height: 14, zIndex: 2 },
286
+ binding: "user.moreCardInfo.extInfo.duty",
287
+ },
288
+ {
289
+ id: "14",
290
+ key: "en_company",
291
+ icon: { name: "company", style: "fill", enable: true },
292
+ type: "text",
293
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
294
+ layout: { x: 16, y: 157, mode: "absolute", width: 173, height: 13, zIndex: 3 },
295
+ binding: "user.moreCardInfo.extInfo.company",
296
+ },
297
+ {
298
+ id: "15",
299
+ key: "en_address",
300
+ icon: { name: "address", style: "fill", enable: true },
301
+ type: "text",
302
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
303
+ layout: { x: 16, y: 181, mode: "absolute", width: 173, height: 26, zIndex: 4 },
304
+ binding: "user.moreCardInfo.extInfo.address",
305
+ },
306
+ {
307
+ id: "5",
308
+ key: "email",
309
+ icon: { name: "email", style: "fill", enable: true },
310
+ type: "text",
311
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
312
+ layout: { x: 206, y: 181, mode: "absolute", width: 130, height: 13, zIndex: 9 },
313
+ binding: "user.email",
314
+ },
315
+ {
316
+ id: "3",
317
+ key: "mobile",
318
+ icon: { name: "mobile", style: "fill", enable: true },
319
+ type: "text",
320
+ style: { fontSize: 9, textAlign: "left", fontWeight: "normal", lineHeight: 13 },
321
+ layout: { x: 206, y: 157, mode: "absolute", width: 130, height: 13, zIndex: 10 },
322
+ binding: "user.mobile",
323
+ },
324
+ ],
325
+ container: { mode: "absolute" },
326
+ fontColor: "#ffffff",
327
+ backgroundImage:
328
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/image/202511/4045e1c401d5ecf186409c98f54a4aaf.png",
329
+ backgroundZIndex: 0,
330
+ },
331
+ ],
332
+ isDefault: 0,
333
+ isMoreCompany: 0,
334
+ isDouble: 1,
335
+ isVip: 1,
336
+ createAt: "2025-11-28 13:40:51",
337
+ updateAt: "2025-12-12 17:04:26",
338
+ },
339
+ },
340
+ shareImage:
341
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/share/share_card_my_10094.png?key=1765607846",
342
+ moreCardInfo: {
343
+ duty: ["大大", "啊大大", "啊大大", "阿达啊", "啊大大"],
344
+ enInfo: { duty: "Kim", name: "Kayer", company: "kim" },
345
+ company: [],
346
+ extInfo: {
347
+ tel: "18454785698",
348
+ duty: "yingwenzhiwei",
349
+ name: "yingwenname",
350
+ domain: "www.baidu.com",
351
+ address: "yingwendizhi",
352
+ company: "yingwengongsi",
353
+ stockCode: "12121",
354
+ },
355
+ },
356
+ verifyAt: 1745910103,
357
+ jobCertifyAt: 0,
358
+ companyVerifyAt: 0,
359
+ spm: "u10094",
360
+ userId: 10094,
361
+ name: "灌灌灌灌",
362
+ image:
363
+ "https://km-1257079185.cos.ap-chengdu.myqcloud.com/local/avatar/202510/b60765d80e1f1af725988a97116b06d9.jpg",
364
+ imageId: 3687,
365
+ mobile: "18451976582",
366
+ duty: "嘎嘎嘎花城",
367
+ company: "嘎嘎嘎超小号",
368
+ companyId: 0,
369
+ email: "youxiang@qq.com",
370
+ wechat: "qeqe33小舅自己",
371
+ wechatQrcode: "",
372
+ address: "安徽省合肥市蜀山区望江ad啊大大阿达大大啊哒哒哒哒哒哒阿达大大阿达大大多大西路",
373
+ addressName: "蜀山区合力大厦A座(望江西路南100米)",
374
+ latitude: "31.829139",
375
+ longitude: "117.258776",
376
+ industry: "IT/互联网",
377
+ finishAt: 1742201476,
378
+ coin: 38,
379
+ showVisitor: 0,
380
+ showExperience: 1,
106
381
  },
107
382
  };
108
383
 
package/miniprogram_dist/components/card-layout/elements/custom-element/index.js CHANGED
@@ -10,6 +10,10 @@ Component({
10
10
  type: Object,
11
11
  value: {},
12
12
  },
13
+ rootData: {
14
+ type: Object,
15
+ value: {},
16
+ },
13
17
  },
14
18
  data: {
15
19
  wrapperStyle: '',
package/miniprogram_dist/components/card-layout/elements/icon-element/index.js CHANGED
@@ -19,6 +19,10 @@ Component({
19
19
  type: Object,
20
20
  value: {},
21
21
  },
22
+ rootData: {
23
+ type: Object,
24
+ value: {},
25
+ },
22
26
  },
23
27
  data: {
24
28
  wrapperStyle: '',
package/miniprogram_dist/components/card-layout/elements/image-element/index.js CHANGED
@@ -10,6 +10,10 @@ Component({
10
10
  type: Object,
11
11
  value: {},
12
12
  },
13
+ rootData: {
14
+ type: Object,
15
+ value: {},
16
+ },
13
17
  },
14
18
  data: {
15
19
  wrapperStyle: '',
@@ -21,9 +25,10 @@ Component({
21
25
  element(el) {
22
26
  if (!el)
23
27
  return;
28
+ const data = this.data.rootData || {};
24
29
  const wrapperStyle = (0, index_1.styleObjectToString)((0, index_1.buildWrapperStyle)(el, 'rpx'), 'rpx');
25
30
  const contentStyle = (0, index_1.styleObjectToString)((0, index_1.buildImageContentStyle)(el), 'rpx');
26
- const imageSrc = (0, index_1.getImageSrc)(el);
31
+ const imageSrc = (0, index_1.getImageSrc)(el, data);
27
32
  const mode = el.fit === 'contain' ? 'aspectFit' : 'aspectFill';
28
33
  this.setData({ wrapperStyle, contentStyle, imageSrc, mode });
29
34
  },
package/miniprogram_dist/components/card-layout/elements/text-element/index.js CHANGED
@@ -19,6 +19,10 @@ Component({
19
19
  type: Object,
20
20
  value: {},
21
21
  },
22
+ rootData: {
23
+ type: Object,
24
+ value: {},
25
+ },
22
26
  },
23
27
  data: {
24
28
  wrapperStyle: '',
@@ -30,9 +34,10 @@ Component({
30
34
  element(el) {
31
35
  if (!el)
32
36
  return;
37
+ const data = this.data.rootData || {};
33
38
  const wrapperStyle = (0, index_1.styleObjectToString)((0, index_1.buildWrapperStyle)(el, 'rpx'), 'rpx');
34
39
  const contentStyle = (0, index_1.styleObjectToString)((0, index_1.buildTextContentStyle)(el, 'rpx'), 'rpx');
35
- const textValue = (0, index_1.getTextValue)(el);
40
+ const textValue = (0, index_1.getTextValue)(el, data);
36
41
  const iconRaw = (0, index_1.buildTextIconMeta)(el, 'rpx');
37
42
  const iconMeta = iconRaw && iconRaw.name
38
43
  ? {
package/miniprogram_dist/components/card-layout/index.js CHANGED
@@ -51,6 +51,7 @@ Component({
51
51
  },
52
52
  data: {
53
53
  cards: [],
54
+ rootData: {},
54
55
  },
55
56
  observers: {
56
57
  layout() {
@@ -68,13 +69,14 @@ Component({
68
69
  methods: {
69
70
  rebuild() {
70
71
  const layoutInput = ensureArray(this.data.layout);
72
+ const rootData = (this.data.data || {});
71
73
  if (!layoutInput.length) {
72
- this.setData({ cards: [] });
74
+ this.setData({ cards: [], rootData });
73
75
  return;
74
76
  }
75
77
  const normalizedLayouts = (0, index_1.normalizeLayout)(layoutInput);
76
78
  const cards = buildCards(normalizedLayouts);
77
- this.setData({ cards });
79
+ this.setData({ cards, rootData });
78
80
  },
79
81
  },
80
82
  });
package/miniprogram_dist/components/card-layout/index.wxml CHANGED
@@ -10,7 +10,7 @@
10
10
  mode="aspectFill"
11
11
  />
12
12
  <block wx:for="{{item.elements}}" wx:key="id">
13
- <template is="render-element" data="{{el:item}}" />
13
+ <template is="render-element" data="{{el:item, rootData: rootData}}" />
14
14
  </block>
15
15
  </view>
16
16
  </view>
@@ -19,24 +19,24 @@
19
19
 
20
20
  <template name="render-element">
21
21
  <block wx:if="{{el.type === 'image'}}">
22
- <image-element element="{{el}}" />
22
+ <image-element element="{{el}}" rootData="{{rootData}}" />
23
23
  </block>
24
24
  <block wx:elif="{{el.type === 'icon'}}">
25
- <icon-element element="{{el}}" />
25
+ <icon-element element="{{el}}" rootData="{{rootData}}" />
26
26
  </block>
27
27
  <block wx:elif="{{el.type === 'layout-panel'}}">
28
28
  <view class="km-node" style="{{el.wrapperStyle}}">
29
29
  <view class="km-node__panel" style="{{el.contentStyle}}">
30
30
  <block wx:for="{{el.children}}" wx:key="id">
31
- <template is="render-element" data="{{el:item}}" />
31
+ <template is="render-element" data="{{el:item, rootData: rootData}}" />
32
32
  </block>
33
33
  </view>
34
34
  </view>
35
35
  </block>
36
36
  <block wx:elif="{{el.type === 'custom'}}">
37
- <custom-element element="{{el}}" />
37
+ <custom-element element="{{el}}" rootData="{{rootData}}" />
38
38
  </block>
39
39
  <block wx:else>
40
- <text-element element="{{el}}" />
40
+ <text-element element="{{el}}" rootData="{{rootData}}" />
41
41
  </block>
42
42
  </template>
package/miniprogram_dist/vendor/km-card-layout-core/data.js CHANGED
@@ -29,7 +29,7 @@ const readByPath = (data, path) => {
29
29
  }
30
30
  return cursor;
31
31
  };
32
- const resolveBindingValue = (binding, rootData, context) => {
32
+ const resolveBindingValue = (binding, rootData) => {
33
33
  if (!binding)
34
34
  return undefined;
35
35
  const value = readByPath(rootData, binding);
package/miniprogram_dist/vendor/km-card-layout-core/interface/index.js CHANGED
@@ -17,4 +17,3 @@ Object.defineProperty(exports, "__esModule", { value: true });
17
17
  __exportStar(require("./elements"), exports);
18
18
  __exportStar(require("./layout"), exports);
19
19
  __exportStar(require("./data/payload"), exports);
20
- __exportStar(require("./context"), exports);
package/miniprogram_dist/vendor/km-card-layout-core/render/helpers.js CHANGED
@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.buildTextIconMeta = exports.getIconName = exports.getImageSrc = exports.getTextValue = exports.buildImageContentStyle = exports.buildTextContentStyle = exports.buildPanelContentStyle = exports.buildBaseContentStyle = exports.buildBackgroundStyle = exports.buildCardStyle = exports.buildWrapperStyle = void 0;
4
4
  const helpers_1 = require("../helpers");
5
5
  const layout_1 = require("../layout");
6
+ const data_1 = require("../data");
6
7
  const buildWrapperStyle = (el, unit = 'px') => {
7
8
  const abs = (0, layout_1.getAbsLayout)(el);
8
9
  if (!abs)
@@ -87,11 +88,20 @@ const buildImageContentStyle = (el) => {
87
88
  return style;
88
89
  };
89
90
  exports.buildImageContentStyle = buildImageContentStyle;
90
- const getTextValue = (el) => el.defaultValue !== undefined && el.defaultValue !== null
91
- ? `${el.defaultValue}`
92
- : '';
91
+ const getTextValue = (el, data) => {
92
+ const bound = el.binding && data ? (0, data_1.resolveBindingValue)(el.binding, data) : undefined;
93
+ const val = bound !== undefined && bound !== null
94
+ ? bound
95
+ : el.defaultValue !== undefined && el.defaultValue !== null
96
+ ? el.defaultValue
97
+ : '';
98
+ return `${val !== null && val !== void 0 ? val : ''}`;
99
+ };
93
100
  exports.getTextValue = getTextValue;
94
- const getImageSrc = (el) => el.defaultUrl || el.defaultValue || '';
101
+ const getImageSrc = (el, data) => {
102
+ const bound = el.binding && data ? (0, data_1.resolveBindingValue)(el.binding, data) : undefined;
103
+ return bound || el.defaultUrl || el.defaultValue || '';
104
+ };
95
105
  exports.getImageSrc = getImageSrc;
96
106
  const getIconName = (el) => (el.name || el.defaultValue || '');
97
107
  exports.getIconName = getIconName;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "km-card-layout-component-miniprogram",
3
- "version": "0.1.9",
3
+ "version": "0.1.10",
4
4
  "description": "",
5
5
  "main": "miniprogram_dist/index.js",
6
6
  "miniprogram": "miniprogram_dist",
package/src/components/card-layout/elements/custom-element/index.ts CHANGED
@@ -14,6 +14,10 @@ Component({
14
14
  type: Object,
15
15
  value: {},
16
16
  },
17
+ rootData: {
18
+ type: Object,
19
+ value: {},
20
+ },
17
21
  },
18
22
  data: {
19
23
  wrapperStyle: '',
package/src/components/card-layout/elements/icon-element/index.ts CHANGED
@@ -23,6 +23,10 @@ Component({
23
23
  type: Object,
24
24
  value: {},
25
25
  },
26
+ rootData: {
27
+ type: Object,
28
+ value: {},
29
+ },
26
30
  },
27
31
  data: {
28
32
  wrapperStyle: '',
package/src/components/card-layout/elements/image-element/index.ts CHANGED
@@ -15,6 +15,10 @@ Component({
15
15
  type: Object,
16
16
  value: {},
17
17
  },
18
+ rootData: {
19
+ type: Object,
20
+ value: {},
21
+ },
18
22
  },
19
23
  data: {
20
24
  wrapperStyle: '',
@@ -25,9 +29,10 @@ Component({
25
29
  observers: {
26
30
  element(el: ImageElement) {
27
31
  if (!el) return;
32
+ const data: Record<string, any> = this.data.rootData || {};
28
33
  const wrapperStyle = styleObjectToString(buildWrapperStyle(el, 'rpx'), 'rpx');
29
34
  const contentStyle = styleObjectToString(buildImageContentStyle(el), 'rpx');
30
- const imageSrc = getImageSrc(el);
35
+ const imageSrc = getImageSrc(el, data);
31
36
  const mode = el.fit === 'contain' ? 'aspectFit' : 'aspectFill';
32
37
  this.setData({ wrapperStyle, contentStyle, imageSrc, mode });
33
38
  },
package/src/components/card-layout/elements/text-element/index.ts CHANGED
@@ -24,6 +24,10 @@ Component({
24
24
  type: Object,
25
25
  value: {},
26
26
  },
27
+ rootData: {
28
+ type: Object,
29
+ value: {},
30
+ },
27
31
  },
28
32
  data: {
29
33
  wrapperStyle: '',
@@ -34,9 +38,10 @@ Component({
34
38
  observers: {
35
39
  element(el: TextElement) {
36
40
  if (!el) return;
41
+ const data: Record<string, any> = this.data.rootData || {};
37
42
  const wrapperStyle = styleObjectToString(buildWrapperStyle(el, 'rpx'), 'rpx');
38
43
  const contentStyle = styleObjectToString(buildTextContentStyle(el, 'rpx'), 'rpx');
39
- const textValue = getTextValue(el);
44
+ const textValue = getTextValue(el, data);
40
45
  const iconRaw = buildTextIconMeta(el, 'rpx');
41
46
  const iconMeta =
42
47
  iconRaw && iconRaw.name
package/src/components/card-layout/index.ts CHANGED
@@ -82,6 +82,7 @@ Component({
82
82
  },
83
83
  data: {
84
84
  cards: [] as RenderCard[],
85
+ rootData: {} as Record<string, any>,
85
86
  },
86
87
  observers: {
87
88
  layout() {
@@ -99,16 +100,17 @@ Component({
99
100
  methods: {
100
101
  rebuild() {
101
102
  const layoutInput = ensureArray(this.data.layout as CardLayoutInput);
103
+ const rootData = (this.data.data || {}) as Record<string, any>;
102
104
 
103
105
  if (!layoutInput.length) {
104
- this.setData({ cards: [] });
106
+ this.setData({ cards: [], rootData });
105
107
  return;
106
108
  }
107
109
 
108
110
  const normalizedLayouts = normalizeLayout(layoutInput);
109
111
  const cards = buildCards(normalizedLayouts);
110
112
 
111
- this.setData({ cards });
113
+ this.setData({ cards, rootData });
112
114
  },
113
115
  },
114
116
  });
package/src/components/card-layout/index.wxml CHANGED
@@ -10,7 +10,7 @@
10
10
  mode="aspectFill"
11
11
  />
12
12
  <block wx:for="{{item.elements}}" wx:key="id">
13
- <template is="render-element" data="{{el:item}}" />
13
+ <template is="render-element" data="{{el:item, rootData: rootData}}" />
14
14
  </block>
15
15
  </view>
16
16
  </view>
@@ -19,24 +19,24 @@
19
19
 
20
20
  <template name="render-element">
21
21
  <block wx:if="{{el.type === 'image'}}">
22
- <image-element element="{{el}}" />
22
+ <image-element element="{{el}}" rootData="{{rootData}}" />
23
23
  </block>
24
24
  <block wx:elif="{{el.type === 'icon'}}">
25
- <icon-element element="{{el}}" />
25
+ <icon-element element="{{el}}" rootData="{{rootData}}" />
26
26
  </block>
27
27
  <block wx:elif="{{el.type === 'layout-panel'}}">
28
28
  <view class="km-node" style="{{el.wrapperStyle}}">
29
29
  <view class="km-node__panel" style="{{el.contentStyle}}">
30
30
  <block wx:for="{{el.children}}" wx:key="id">
31
- <template is="render-element" data="{{el:item}}" />
31
+ <template is="render-element" data="{{el:item, rootData: rootData}}" />
32
32
  </block>
33
33
  </view>
34
34
  </view>
35
35
  </block>
36
36
  <block wx:elif="{{el.type === 'custom'}}">
37
- <custom-element element="{{el}}" />
37
+ <custom-element element="{{el}}" rootData="{{rootData}}" />
38
38
  </block>
39
39
  <block wx:else>
40
- <text-element element="{{el}}" />
40
+ <text-element element="{{el}}" rootData="{{rootData}}" />
41
41
  </block>
42
42
  </template>
package/src/vendor/km-card-layout-core/data.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import { isObject } from './helpers';
2
- import type { BindingContext } from './interface';
3
2
 
4
3
  const pathToSegments = (path: string): string[] =>
5
4
  `${path || ''}`
@@ -30,8 +29,7 @@ const readByPath = (data: any, path: string): any => {
30
29
 
31
30
  export const resolveBindingValue = (
32
31
  binding: string | undefined,
33
- rootData: Record<string, any>,
34
- context?: BindingContext
32
+ rootData: Record<string, any>
35
33
  ): any => {
36
34
  if (!binding) return undefined;
37
35
  const value = readByPath(rootData, binding);
package/src/vendor/km-card-layout-core/interface/index.ts CHANGED
@@ -1,4 +1,3 @@
1
1
  export * from './elements';
2
2
  export * from './layout';
3
3
  export * from './data/payload';
4
- export * from './context';
package/src/vendor/km-card-layout-core/render/helpers.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { addUnit } from '../helpers';
2
2
  import { getAbsLayout } from '../layout';
3
+ import { resolveBindingValue } from '../data';
3
4
  import type {
4
5
  CardElement,
5
6
  CardLayoutSchema,
@@ -93,13 +94,27 @@ export const buildImageContentStyle = (el: ImageElement) => {
93
94
  return style;
94
95
  };
95
96
 
96
- export const getTextValue = (el: TextElement) =>
97
- el.defaultValue !== undefined && el.defaultValue !== null
98
- ? `${el.defaultValue}`
99
- : '';
97
+ export const getTextValue = (
98
+ el: TextElement,
99
+ data?: Record<string, any>
100
+ ) => {
101
+ const bound = el.binding && data ? resolveBindingValue(el.binding, data) : undefined;
102
+ const val =
103
+ bound !== undefined && bound !== null
104
+ ? bound
105
+ : el.defaultValue !== undefined && el.defaultValue !== null
106
+ ? el.defaultValue
107
+ : '';
108
+ return `${val ?? ''}`;
109
+ };
100
110
 
101
- export const getImageSrc = (el: ImageElement) =>
102
- el.defaultUrl || el.defaultValue || '';
111
+ export const getImageSrc = (
112
+ el: ImageElement,
113
+ data?: Record<string, any>
114
+ ) => {
115
+ const bound = el.binding && data ? resolveBindingValue(el.binding, data) : undefined;
116
+ return (bound as any) || el.defaultUrl || el.defaultValue || '';
117
+ };
103
118
 
104
119
  export const getIconName = (el: IconElement) =>
105
120
  (el.name || el.defaultValue || '') as string;
package/src/vendor/km-card-layout-core/types.d.ts CHANGED
@@ -6,7 +6,6 @@
6
6
  export * from './interface';
7
7
 
8
8
  import type {
9
- BindingContext,
10
9
  CardElement,
11
10
  CardLayoutInput,
12
11
  CardLayoutSchema,
@@ -66,8 +65,7 @@ export function areChildrenEqual(
66
65
 
67
66
  export function resolveBindingValue(
68
67
  binding: string | undefined,
69
- rootData: Record<string, any>,
70
- context?: BindingContext
68
+ rootData: Record<string, any>
71
69
  ): any;
72
70
 
73
71
  export function stripLayoutBindings(
@@ -180,11 +178,13 @@ export function buildImageContentStyle(
180
178
  ): Record<string, any>;
181
179
 
182
180
  export function getTextValue(
183
- el: import('./interface/elements').TextElement
181
+ el: import('./interface/elements').TextElement,
182
+ data?: Record<string, any>
184
183
  ): string;
185
184
 
186
185
  export function getImageSrc(
187
- el: import('./interface/elements').ImageElement
186
+ el: import('./interface/elements').ImageElement,
187
+ data?: Record<string, any>
188
188
  ): string;
189
189
 
190
190
  export function getIconName(
package/miniprogram_dist/vendor/km-card-layout-core/interface/context.js DELETED
@@ -1,2 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
package/src/vendor/km-card-layout-core/interface/context.ts DELETED
@@ -1,6 +0,0 @@
1
- export interface BindingContext {
2
- // Optional binding prefix for nested contexts
3
- contextBinding?: string;
4
- // Optional nested context data
5
- contextData?: any;
6
- }