@topmindspace/tms-skills 2.0.0 → 2.0.2
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.
- package/CHANGELOG.md +139 -123
- package/README.md +126 -103
- package/bin/tms-skills.js +160 -160
- package/package.json +48 -48
- package/top-ppt-html/README.md +254 -253
- package/top-ppt-html/SKILL.md +111 -111
- package/top-ppt-html/assets/examples/2026-09-09-architecture-graphite-dark.html +3873 -3926
- package/top-ppt-html/assets/examples/2026-09-09-architecture-graphite-dark.model.json +167 -167
- package/top-ppt-html/assets/examples/2026-09-09-architecture-spectrum.html +3873 -3926
- package/top-ppt-html/assets/examples/2026-09-09-architecture-spectrum.model.json +167 -167
- package/top-ppt-html/assets/examples/2026-09-09-presentation-apple-mono.html +4272 -4325
- package/top-ppt-html/assets/examples/2026-09-09-presentation-apple-mono.model.json +320 -320
- package/top-ppt-html/assets/examples/2026-09-09-presentation-brand-red.html +4272 -4325
- package/top-ppt-html/assets/examples/2026-09-09-presentation-brand-red.model.json +320 -320
- package/top-ppt-html/assets/examples/2026-09-09-presentation-business-blue.html +4272 -4325
- package/top-ppt-html/assets/examples/2026-09-09-presentation-business-blue.model.json +320 -320
- package/top-ppt-html/assets/examples/2026-09-09-research-deep-teal.html +5474 -5527
- package/top-ppt-html/assets/examples/2026-09-09-research-deep-teal.model.json +913 -913
- package/top-ppt-html/assets/examples/2026-09-09-research-indigo-violet.html +5474 -5527
- package/top-ppt-html/assets/examples/2026-09-09-research-indigo-violet.model.json +913 -913
- package/top-ppt-html/assets/examples/2026-09-09-research-mckinsey.html +5474 -5527
- package/top-ppt-html/assets/examples/2026-09-09-research-mckinsey.model.json +913 -913
- package/top-ppt-html/assets/examples/2026-09-09-research-warm-sand.html +5474 -5527
- package/top-ppt-html/assets/examples/2026-09-09-research-warm-sand.model.json +913 -913
- package/top-ppt-html/assets/pptx-export.js +1944 -1944
- package/top-ppt-html/assets/style-gallery.html +559 -589
- package/top-ppt-html/assets/templates/architecture.html +3675 -3728
- package/top-ppt-html/assets/templates/engine.css +787 -840
- package/top-ppt-html/assets/templates/presentation.html +3685 -3738
- package/top-ppt-html/assets/templates/research.html +3964 -4017
- package/top-ppt-html/assets/templates/ui.js +520 -520
- package/top-ppt-html/assets/theme-overview-architecture.png +0 -0
- package/top-ppt-html/assets/theme-overview-presentation.png +0 -0
- package/top-ppt-html/assets/theme-overview-research.png +0 -0
- package/top-ppt-html/assets/theme-overview.png +0 -0
- package/top-ppt-html/evals/prompts.csv +15 -15
- package/top-ppt-html/evals/rubric.schema.json +25 -25
- package/top-ppt-html/evals/run_evals.py +220 -220
- package/top-ppt-html/evals/trace.example.json +16 -16
- package/top-ppt-html/package-lock.json +175 -0
- package/top-ppt-html/package.json +30 -35
- package/top-ppt-html/references/charts-basic.md +624 -624
- package/top-ppt-html/references/charts-discipline.md +108 -108
- package/top-ppt-html/references/charts-extended.md +482 -482
- package/top-ppt-html/references/charts.md +28 -28
- package/top-ppt-html/references/components-atoms.md +624 -624
- package/top-ppt-html/references/components.md +30 -30
- package/top-ppt-html/references/content-rules.md +490 -490
- package/top-ppt-html/references/design-system-engine.md +235 -235
- package/top-ppt-html/references/design-system.md +471 -478
- package/top-ppt-html/references/failure-modes.md +214 -214
- package/top-ppt-html/references/high-fidelity.md +127 -127
- package/top-ppt-html/references/icons.md +397 -397
- package/top-ppt-html/references/industry-benchmark.md +105 -105
- package/top-ppt-html/references/infographics-stats.md +308 -308
- package/top-ppt-html/references/infographics-structure.md +226 -226
- package/top-ppt-html/references/infographics.md +43 -43
- package/top-ppt-html/references/layout-grammar.md +315 -315
- package/top-ppt-html/references/layouts-architecture.md +108 -108
- package/top-ppt-html/references/layouts-combo.md +600 -600
- package/top-ppt-html/references/layouts-research.md +160 -160
- package/top-ppt-html/references/modes.md +254 -254
- package/top-ppt-html/references/outline-design.md +275 -275
- package/top-ppt-html/references/playbook.md +266 -266
- package/top-ppt-html/references/pptx-export.md +209 -209
- package/top-ppt-html/references/reform-plan.md +252 -252
- package/top-ppt-html/references/styles.md +336 -370
- package/top-ppt-html/references/tech-design.md +138 -138
- package/top-ppt-html/scripts/audit_css.py +109 -109
- package/top-ppt-html/scripts/audit_docs.py +176 -176
- package/top-ppt-html/scripts/audit_skill.py +220 -220
- package/top-ppt-html/scripts/audit_styles.py +293 -351
- package/top-ppt-html/scripts/build_examples.py +2276 -2276
- package/top-ppt-html/scripts/build_pptx.js +2380 -2380
- package/top-ppt-html/scripts/capture_theme_overview.js +78 -78
- package/top-ppt-html/scripts/checks_html.py +127 -127
- package/top-ppt-html/scripts/cross_verify.py +294 -294
- package/top-ppt-html/scripts/env_probe.py +158 -158
- package/top-ppt-html/scripts/extract_model.py +210 -210
- package/top-ppt-html/scripts/extract_snippet.py +374 -374
- package/top-ppt-html/scripts/gen_channel_a.js +214 -214
- package/top-ppt-html/scripts/layout-constants.json +3309 -3377
- package/top-ppt-html/scripts/layout_slots.json +830 -830
- package/top-ppt-html/scripts/lib_layout_regions.js +412 -412
- package/top-ppt-html/scripts/measure_height.py +178 -178
- package/top-ppt-html/scripts/model-schema.json +547 -547
- package/top-ppt-html/scripts/negative_tests.py +307 -307
- package/top-ppt-html/scripts/package_skill.py +291 -291
- package/top-ppt-html/scripts/prepare_images.py +341 -341
- package/top-ppt-html/scripts/probe_image_export.py +188 -188
- package/top-ppt-html/scripts/quality_gate.py +301 -301
- package/top-ppt-html/scripts/regression.py +307 -308
- package/top-ppt-html/scripts/render_compare.py +275 -275
- package/top-ppt-html/scripts/render_from_model.py +698 -698
- package/top-ppt-html/scripts/scaffold_report.py +1054 -1054
- package/top-ppt-html/scripts/section-file-map.json +104 -104
- package/top-ppt-html/scripts/sync_runtime.py +662 -662
- package/top-ppt-html/scripts/validate_pptx.py +1510 -1510
- package/top-ppt-html/scripts/validate_report.py +1456 -1456
|
@@ -1,589 +1,559 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="zh-CN">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
-
<title>风格 × 模式矩阵 · TopPPT HTML</title>
|
|
7
|
-
<style>
|
|
8
|
-
*{box-sizing:border-box;margin:0;padding:0}
|
|
9
|
-
body{
|
|
10
|
-
font-family:"Google Sans","Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",
|
|
11
|
-
"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
|
|
12
|
-
background:#eef0f3;color:#202124;padding:52px 32px 72px;
|
|
13
|
-
-webkit-font-smoothing:antialiased;
|
|
14
|
-
}
|
|
15
|
-
.head{max-width:1360px;margin:0 auto 22px}
|
|
16
|
-
.head h1{font-size:34px;font-weight:700;letter-spacing:-.02em;margin-bottom:10px}
|
|
17
|
-
.head p{font-size:15px;color:#5f6368;line-height:1.65;max-width:960px}
|
|
18
|
-
.head code{background:#e0e3e8;padding:2px 7px;border-radius:6px;font-size:13px}
|
|
19
|
-
|
|
20
|
-
.caps{max-width:1360px;margin:0 auto 26px;display:flex;flex-wrap:wrap;gap:9px}
|
|
21
|
-
.caps span{font-size:12.5px;font-weight:600;color:#3c4043;background:#fff;
|
|
22
|
-
border:1px solid #e0e3e8;padding:7px 14px;border-radius:999px}
|
|
23
|
-
.caps span.b{background:#1a73e8;color:#fff;border-color:#1a73e8}
|
|
24
|
-
|
|
25
|
-
/* ── 模式 Tab(一级维度) ── */
|
|
26
|
-
.modes{max-width:1360px;margin:0 auto 24px;display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
|
|
27
|
-
.mtab{flex:1;min-width:280px;text-align:left;background:#fff;border:1px solid #e0e3e8;
|
|
28
|
-
border-radius:16px;padding:16px 20px;cursor:pointer;font-family:inherit;
|
|
29
|
-
transition:transform .2s cubic-bezier(.2,0,0,1),box-shadow .2s,border-color .2s}
|
|
30
|
-
.mtab:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08)}
|
|
31
|
-
.mtab.on{border-color:#1a73e8;box-shadow:0 0 0 2px #d2e3fc}
|
|
32
|
-
.mtab__k{font-size:11px;font-weight:700;letter-spacing:.1em;color:#1a73e8;margin-bottom:5px}
|
|
33
|
-
.mtab__t{font-size:16px;font-weight:700;color:#202124;margin-bottom:4px}
|
|
34
|
-
.mtab__d{font-size:12.5px;color:#5f6368;line-height:1.55}
|
|
35
|
-
|
|
36
|
-
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:26px;
|
|
37
|
-
max-width:1360px;margin:0 auto}
|
|
38
|
-
|
|
39
|
-
.preset{border-radius:22px;overflow:hidden;border:1px solid #e0e0e0;background:#fff;
|
|
40
|
-
box-shadow:0 3px 10px rgba(0,0,0,.06);cursor:pointer;
|
|
41
|
-
transition:transform .22s cubic-bezier(.2,0,0,1),box-shadow .22s,outline-color .15s;
|
|
42
|
-
outline:3px solid transparent;outline-offset:-3px}
|
|
43
|
-
.preset:hover{transform:translateY(-5px);box-shadow:0 16px 38px rgba(0,0,0,.13)}
|
|
44
|
-
.preset.sel{outline-color:#1a73e8}
|
|
45
|
-
.preset.sel .meta__pick{background:#1a73e8;color:#fff;border-color:#1a73e8}
|
|
46
|
-
|
|
47
|
-
/* ── 预览区(每张卡用自己的变量渲染当前模式的迷你版式) ── */
|
|
48
|
-
.pv{padding:20px 22px 18px;background:var(--pbg);color:var(--ptxt);font-family:var(--pfont
|
|
49
|
-
border-bottom:1px solid var(--pbd)
|
|
50
|
-
.pv__bar{display:flex;align-items:center;gap:9px;margin-bottom:
|
|
51
|
-
.pv__mark{width:24px;height:24px;border-radius:var(--prad,8px);background:var(--pa);color:var(--paon);
|
|
52
|
-
display:grid;place-items:center;font-size:10px;font-weight:700}
|
|
53
|
-
.pv__bart{font-size:12.5px;font-weight:600
|
|
54
|
-
.pv__barsub{margin-left:auto;display:flex;gap:6px;align-items:center}
|
|
55
|
-
.pv__dot{width:12px;height:12px;border-radius:50%;border:1px solid var(--pbd)}
|
|
56
|
-
.pv__pager{font-size:9.5px;color:var(--ptxt2);border:1px solid var(--pbd);border-radius:999px;
|
|
57
|
-
padding:2px 7px;font-weight:600}
|
|
58
|
-
|
|
59
|
-
.pv__eyebrow{font-size:10px;font-weight:700;letter-spacing
|
|
60
|
-
color:var(--pa);margin-bottom:6px}
|
|
61
|
-
.pv__h{font-size:
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
.pv__metric{
|
|
66
|
-
.pv__metric div
|
|
67
|
-
|
|
68
|
-
.
|
|
69
|
-
.pv__bars{
|
|
70
|
-
.
|
|
71
|
-
.
|
|
72
|
-
|
|
73
|
-
.pv__chip{
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
.
|
|
80
|
-
|
|
81
|
-
.
|
|
82
|
-
.
|
|
83
|
-
.
|
|
84
|
-
.
|
|
85
|
-
.
|
|
86
|
-
.
|
|
87
|
-
.
|
|
88
|
-
|
|
89
|
-
.
|
|
90
|
-
|
|
91
|
-
.
|
|
92
|
-
.
|
|
93
|
-
.pv__cols{
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
.
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
.pv__layer{
|
|
101
|
-
.
|
|
102
|
-
|
|
103
|
-
.
|
|
104
|
-
.
|
|
105
|
-
.pv__node{
|
|
106
|
-
.
|
|
107
|
-
.
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
.
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
.
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
.
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
.
|
|
125
|
-
|
|
126
|
-
.
|
|
127
|
-
.
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
.
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
.
|
|
134
|
-
.
|
|
135
|
-
|
|
136
|
-
.
|
|
137
|
-
.
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
.
|
|
141
|
-
.
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
<
|
|
148
|
-
|
|
149
|
-
<
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
<
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
<div class="
|
|
162
|
-
<
|
|
163
|
-
|
|
164
|
-
<
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
/*
|
|
173
|
-
/*
|
|
174
|
-
/*
|
|
175
|
-
/*
|
|
176
|
-
/*
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
var
|
|
181
|
-
var
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
'
|
|
186
|
-
'
|
|
187
|
-
'
|
|
188
|
-
'
|
|
189
|
-
'
|
|
190
|
-
'
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
'
|
|
194
|
-
}
|
|
195
|
-
|
|
196
|
-
'
|
|
197
|
-
'
|
|
198
|
-
'
|
|
199
|
-
'
|
|
200
|
-
'
|
|
201
|
-
'
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
};
|
|
206
|
-
var
|
|
207
|
-
var
|
|
208
|
-
var
|
|
209
|
-
var
|
|
210
|
-
var
|
|
211
|
-
var
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
var
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
return { x: MX, y:
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
return { x: MX, y:
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
return { x: MX, y: P.
|
|
291
|
-
}
|
|
292
|
-
if (type === '
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
return { x: MX, y:
|
|
306
|
-
}
|
|
307
|
-
if (type === '
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
return { x: MX, y:
|
|
313
|
-
}
|
|
314
|
-
if (type === '
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
{id
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
{
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
];
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
}
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
var
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
var
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
'
|
|
495
|
-
|
|
496
|
-
'
|
|
497
|
-
|
|
498
|
-
'<
|
|
499
|
-
'<
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
'
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
var
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
'</div>'
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
'<
|
|
521
|
-
'<
|
|
522
|
-
}
|
|
523
|
-
|
|
524
|
-
function
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
'
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
(
|
|
542
|
-
(s
|
|
543
|
-
|
|
544
|
-
(s.
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
}
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
b.innerHTML='<div class="mtab__k">'+m.k+'</div><div class="mtab__t">'+m.t+'</div>'+
|
|
561
|
-
'<div class="mtab__d">'+m.d+'</div><div class="mtab__d" style="margin-top:5px;color:#1a73e8">'+m.rec+'</div>';
|
|
562
|
-
b.addEventListener('click',function(){curMode=m.id;renderModes();renderGrid();});
|
|
563
|
-
box.appendChild(b);
|
|
564
|
-
});
|
|
565
|
-
}
|
|
566
|
-
|
|
567
|
-
function renderGrid(){
|
|
568
|
-
var g=document.getElementById('grid');
|
|
569
|
-
g.innerHTML='';
|
|
570
|
-
STYLES.forEach(function(s){
|
|
571
|
-
var d=document.createElement('div');
|
|
572
|
-
d.innerHTML=cardHtml(s,curMode);
|
|
573
|
-
var el=d.firstChild;
|
|
574
|
-
if(picked[curMode]===s.id)el.classList.add('sel');
|
|
575
|
-
el.addEventListener('click',function(){
|
|
576
|
-
picked[curMode]=s.id;
|
|
577
|
-
g.querySelectorAll('.preset').forEach(function(x){x.classList.remove('sel')});
|
|
578
|
-
el.classList.add('sel');
|
|
579
|
-
console.log('已标记:data-mode="'+curMode+'" + data-style="'+s.id+'"');
|
|
580
|
-
});
|
|
581
|
-
g.appendChild(el);
|
|
582
|
-
});
|
|
583
|
-
}
|
|
584
|
-
|
|
585
|
-
renderModes();
|
|
586
|
-
renderGrid();
|
|
587
|
-
</script>
|
|
588
|
-
</body>
|
|
589
|
-
</html>
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="zh-CN">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>风格 × 模式矩阵 · TopPPT HTML</title>
|
|
7
|
+
<style>
|
|
8
|
+
*{box-sizing:border-box;margin:0;padding:0}
|
|
9
|
+
body{
|
|
10
|
+
font-family:"Google Sans","Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",
|
|
11
|
+
"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
|
|
12
|
+
background:#eef0f3;color:#202124;padding:52px 32px 72px;
|
|
13
|
+
-webkit-font-smoothing:antialiased;
|
|
14
|
+
}
|
|
15
|
+
.head{max-width:1360px;margin:0 auto 22px}
|
|
16
|
+
.head h1{font-size:34px;font-weight:700;letter-spacing:-.02em;margin-bottom:10px}
|
|
17
|
+
.head p{font-size:15px;color:#5f6368;line-height:1.65;max-width:960px}
|
|
18
|
+
.head code{background:#e0e3e8;padding:2px 7px;border-radius:6px;font-size:13px}
|
|
19
|
+
|
|
20
|
+
.caps{max-width:1360px;margin:0 auto 26px;display:flex;flex-wrap:wrap;gap:9px}
|
|
21
|
+
.caps span{font-size:12.5px;font-weight:600;color:#3c4043;background:#fff;
|
|
22
|
+
border:1px solid #e0e3e8;padding:7px 14px;border-radius:999px}
|
|
23
|
+
.caps span.b{background:#1a73e8;color:#fff;border-color:#1a73e8}
|
|
24
|
+
|
|
25
|
+
/* ── 模式 Tab(一级维度) ── */
|
|
26
|
+
.modes{max-width:1360px;margin:0 auto 24px;display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}
|
|
27
|
+
.mtab{flex:1;min-width:280px;text-align:left;background:#fff;border:1px solid #e0e3e8;
|
|
28
|
+
border-radius:16px;padding:16px 20px;cursor:pointer;font-family:inherit;
|
|
29
|
+
transition:transform .2s cubic-bezier(.2,0,0,1),box-shadow .2s,border-color .2s}
|
|
30
|
+
.mtab:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08)}
|
|
31
|
+
.mtab.on{border-color:#1a73e8;box-shadow:0 0 0 2px #d2e3fc}
|
|
32
|
+
.mtab__k{font-size:11px;font-weight:700;letter-spacing:.1em;color:#1a73e8;margin-bottom:5px}
|
|
33
|
+
.mtab__t{font-size:16px;font-weight:700;color:#202124;margin-bottom:4px}
|
|
34
|
+
.mtab__d{font-size:12.5px;color:#5f6368;line-height:1.55}
|
|
35
|
+
|
|
36
|
+
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:26px;
|
|
37
|
+
max-width:1360px;margin:0 auto}
|
|
38
|
+
|
|
39
|
+
.preset{border-radius:22px;overflow:hidden;border:1px solid #e0e0e0;background:#fff;
|
|
40
|
+
box-shadow:0 3px 10px rgba(0,0,0,.06);cursor:pointer;
|
|
41
|
+
transition:transform .22s cubic-bezier(.2,0,0,1),box-shadow .22s,outline-color .15s;
|
|
42
|
+
outline:3px solid transparent;outline-offset:-3px}
|
|
43
|
+
.preset:hover{transform:translateY(-5px);box-shadow:0 16px 38px rgba(0,0,0,.13)}
|
|
44
|
+
.preset.sel{outline-color:#1a73e8}
|
|
45
|
+
.preset.sel .meta__pick{background:#1a73e8;color:#fff;border-color:#1a73e8}
|
|
46
|
+
|
|
47
|
+
/* ── 预览区(每张卡用自己的变量渲染当前模式的迷你版式) ── */
|
|
48
|
+
.pv{padding:20px 22px 18px;background:var(--pbg);color:var(--ptxt);font-family:var(--pfont);
|
|
49
|
+
border-bottom:1px solid var(--pbd)}
|
|
50
|
+
.pv__bar{display:flex;align-items:center;gap:9px;margin-bottom:14px}
|
|
51
|
+
.pv__mark{width:24px;height:24px;border-radius:var(--prad,8px);background:var(--pa);color:var(--paon);
|
|
52
|
+
display:grid;place-items:center;font-size:10px;font-weight:700}
|
|
53
|
+
.pv__bart{font-size:12.5px;font-weight:600}
|
|
54
|
+
.pv__barsub{margin-left:auto;display:flex;gap:6px;align-items:center}
|
|
55
|
+
.pv__dot{width:12px;height:12px;border-radius:50%;border:1px solid var(--pbd)}
|
|
56
|
+
.pv__pager{font-size:9.5px;color:var(--ptxt2);border:1px solid var(--pbd);border-radius:999px;
|
|
57
|
+
padding:2px 7px;font-weight:600}
|
|
58
|
+
|
|
59
|
+
.pv__eyebrow{font-size:10px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
|
|
60
|
+
color:var(--pa);margin-bottom:6px}
|
|
61
|
+
.pv__h{font-size:22px;line-height:1.18;letter-spacing:-.02em;font-weight:700;margin-bottom:14px}
|
|
62
|
+
|
|
63
|
+
/* presentation 迷你件 */
|
|
64
|
+
.pv__metric{display:flex;gap:16px;margin-bottom:12px}
|
|
65
|
+
.pv__metric div b{font-size:26px;font-weight:700;letter-spacing:-.03em;color:var(--pa);display:block;line-height:1}
|
|
66
|
+
.pv__metric div span{font-size:10px;color:var(--ptxt2)}
|
|
67
|
+
.pv__bars{display:flex;align-items:flex-end;gap:8px;height:56px}
|
|
68
|
+
.pv__bars i{flex:1;border-radius:5px 5px 0 0;background:var(--ps3)}
|
|
69
|
+
.pv__bars i.a{background:var(--pa)}
|
|
70
|
+
.pv__chips{display:flex;gap:7px;margin-top:13px;flex-wrap:wrap}
|
|
71
|
+
.pv__chip{font-size:10.5px;font-weight:600;padding:4px 11px;border-radius:999px;
|
|
72
|
+
background:var(--pas);color:var(--pa)}
|
|
73
|
+
.pv__chip.l{background:transparent;border:1px solid var(--pbd);color:var(--ptxt2)}
|
|
74
|
+
|
|
75
|
+
/* research 迷你件:Exhibit 框 + sowhat + 双栏 */
|
|
76
|
+
.pv__exh{border:1px solid var(--pbd);border-radius:8px;background:#fff;padding:10px 12px;margin-bottom:10px}
|
|
77
|
+
.pv__exhHd{display:flex;justify-content:space-between;align-items:baseline;
|
|
78
|
+
border-bottom:1px solid var(--pbd);padding-bottom:6px;margin-bottom:8px}
|
|
79
|
+
.pv__exhNo{font-size:9px;font-weight:700;letter-spacing:.08em;color:var(--pa)}
|
|
80
|
+
.pv__exhT{font-size:10.5px;font-weight:600;color:var(--ptxt)}
|
|
81
|
+
.pv__hrow{display:flex;align-items:center;gap:8px;margin-bottom:6px}
|
|
82
|
+
.pv__hrow span{font-size:10px;color:var(--ptxt2);width:30px;flex:none}
|
|
83
|
+
.pv__htrack{flex:1;height:8px;border-radius:999px;background:var(--ps3);overflow:hidden}
|
|
84
|
+
.pv__hfill{height:100%;border-radius:999px;background:var(--pa)}
|
|
85
|
+
.pv__hval{font-size:10px;font-weight:700;color:var(--ptxt);width:28px;text-align:right;flex:none}
|
|
86
|
+
.pv__src{font-size:9px;color:var(--ptxt2);border-top:1px solid var(--pbd);padding-top:5px;margin-top:2px}
|
|
87
|
+
.pv__sowhat{display:flex;align-items:baseline;gap:8px;border-left:3px solid var(--pa);
|
|
88
|
+
background:var(--pas);border-radius:0 6px 6px 0;padding:6px 10px;margin-bottom:10px}
|
|
89
|
+
.pv__swK{font-size:8.5px;font-weight:700;letter-spacing:.1em;color:var(--pa);flex:none}
|
|
90
|
+
.pv__swV{font-size:10px;font-weight:500;color:var(--ptxt);line-height:1.5}
|
|
91
|
+
.pv__cols{column-count:2;column-gap:14px;font-size:9.5px;color:var(--ptxt2);line-height:1.6}
|
|
92
|
+
.pv__cols p{margin-bottom:5px;break-inside:avoid-column}
|
|
93
|
+
.pv__cols b{color:var(--ptxt)}
|
|
94
|
+
|
|
95
|
+
/* architecture 迷你件:分层带 */
|
|
96
|
+
.pv__arch{display:flex;flex-direction:column;gap:6px}
|
|
97
|
+
.pv__layer{display:grid;grid-template-columns:56px 1fr;gap:8px;align-items:stretch}
|
|
98
|
+
.pv__lname{font-size:9px;font-weight:700;letter-spacing:.05em;color:var(--ptxt2);
|
|
99
|
+
border-left:3px solid var(--pbd);padding-left:7px;display:flex;align-items:center}
|
|
100
|
+
.pv__layer--f .pv__lname{color:var(--pa);border-left-color:var(--pa)}
|
|
101
|
+
.pv__nodes{display:grid;grid-template-columns:1fr 1fr;gap:6px}
|
|
102
|
+
.pv__node{border:1px solid var(--pbd);border-radius:7px;padding:6px 9px;background:#fff}
|
|
103
|
+
.pv__node--a{background:var(--pas);border-color:transparent}
|
|
104
|
+
.pv__nt{font-size:10px;font-weight:600;color:var(--ptxt)}
|
|
105
|
+
.pv__node--a .pv__nt{color:var(--pa)}
|
|
106
|
+
.pv__nd{font-size:8.5px;color:var(--ptxt2);margin-top:1px}
|
|
107
|
+
.pv__legend{display:flex;gap:7px;justify-content:flex-end;margin-top:9px}
|
|
108
|
+
|
|
109
|
+
/* 编码色板展示条(9 套风格各有 c1–c5;彩色只属于数据系列) */
|
|
110
|
+
.pv__pal{display:flex;align-items:center;gap:6px;margin-top:13px;flex-wrap:wrap}
|
|
111
|
+
.pv__pd{width:14px;height:14px;border-radius:5px;flex:none;border:1px solid rgba(0,0,0,.08)}
|
|
112
|
+
.pv__palt{font-size:9.5px;font-weight:600;color:var(--ptxt2);margin-left:3px}
|
|
113
|
+
|
|
114
|
+
/* 深色优先卡(graphite):主预览用 dark token,白底小件换深色面 */
|
|
115
|
+
.preset.dm .pv__exh{background:var(--psoft)}
|
|
116
|
+
.preset.dm .pv__node{background:var(--psoft)}
|
|
117
|
+
|
|
118
|
+
/* 暗色预览条 */
|
|
119
|
+
.dk{display:flex;align-items:center;gap:14px;padding:13px 22px;background:var(--dbg);
|
|
120
|
+
border-bottom:1px solid var(--pbd)}
|
|
121
|
+
.dk__tag{font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--dtxt2);
|
|
122
|
+
border:1px solid var(--dbd);border-radius:999px;padding:3px 9px}
|
|
123
|
+
.dk__h{font-size:14px;font-weight:700;color:var(--dtxt);font-family:var(--pfont)}
|
|
124
|
+
.dk__bars{display:flex;align-items:flex-end;gap:4px;height:26px;margin-left:auto}
|
|
125
|
+
.dk__bars i{width:10px;border-radius:3px 3px 0 0;background:var(--ds3)}
|
|
126
|
+
.dk__bars i.a{background:var(--da)}
|
|
127
|
+
.dk__num{font-size:17px;font-weight:700;color:var(--da);font-family:var(--pfont)}
|
|
128
|
+
|
|
129
|
+
/* 卡底说明 */
|
|
130
|
+
.meta{padding:16px 22px 18px;background:#fff}
|
|
131
|
+
.meta__name{display:flex;align-items:center;gap:9px;font-size:16.5px;font-weight:700;color:#202124}
|
|
132
|
+
.meta__name .sw{width:16px;height:16px;border-radius:5px;background:var(--pa);border:1px solid rgba(0,0,0,.08)}
|
|
133
|
+
.meta__en{font-size:12px;color:#9aa0a6;font-weight:400}
|
|
134
|
+
.meta__pick{margin-left:auto;font-size:12px;font-weight:600;color:#1a73e8;border:1px solid #d2e3fc;
|
|
135
|
+
border-radius:999px;padding:5px 13px;background:#fff;cursor:pointer}
|
|
136
|
+
.meta__d{font-size:13.5px;color:#5f6368;line-height:1.6;margin-top:8px}
|
|
137
|
+
.meta__s{font-size:12.5px;color:#80868b;margin-top:7px}
|
|
138
|
+
.meta__s b{color:#3c4043;font-weight:600}
|
|
139
|
+
|
|
140
|
+
.foot{max-width:1360px;margin:34px auto 0;font-size:13.5px;color:#80868b;line-height:1.7}
|
|
141
|
+
.foot code{background:#e0e3e8;padding:2px 7px;border-radius:6px;font-size:12.5px}
|
|
142
|
+
</style>
|
|
143
|
+
</head>
|
|
144
|
+
<body>
|
|
145
|
+
|
|
146
|
+
<div class="head">
|
|
147
|
+
<h1>风格 × 模式矩阵 · TopPPT HTML</h1>
|
|
148
|
+
<p>三种报告模式 × 9 套风格 × 亮/暗双主题,正交组合任意选用。<strong>模式</strong>(演示汇报 / 研究报告 / 信息架构图)是内容呈现形态与信息密度——生成时确定,切模式即换一套独立模板;<strong>风格</strong>是纯视觉皮肤——header 下拉可实时切换;<strong>主题</strong>(浅色 / 深色)在问询时一并确认——<strong>HTML 与 PPTX 导出同主题</strong>。切换上方模式 Tab,查看每种风格在该模式下的迷你版式特征;点击卡片标记,把 <code>data-mode + data-style + data-theme</code> 交给生成流程。</p>
|
|
149
|
+
<p style="margin-top:10px">三模式完整样例见 <code>assets/examples/</code>(presentation×2、research×3、architecture×2,AI 智能体发展研究主题);三份模式模板见 <code>assets/templates/</code>。本页每张卡片已同时展示浅色(主预览)与深色(底部辅助条)两个变体,可一并挑选主题。</p>
|
|
150
|
+
</div>
|
|
151
|
+
|
|
152
|
+
<div class="caps">
|
|
153
|
+
<span class="b">三模式 × 9 风格 × 亮暗主题</span><span class="b">模式独立模板</span><span class="b">PPTX 三模式高保真</span><span class="b">PPTX 同主题导出</span>
|
|
154
|
+
<span>9 套风格</span><span>亮暗双主题</span><span>header 工具栏</span><span>宽屏 16:9</span><span>MD3 对齐</span>
|
|
155
|
+
<span>引用闭环</span><span>去AI味</span><span>质量校验闭环</span><span>常量单源</span>
|
|
156
|
+
</div>
|
|
157
|
+
|
|
158
|
+
<div class="modes" id="modes"></div>
|
|
159
|
+
<div class="grid" id="grid"></div>
|
|
160
|
+
|
|
161
|
+
<div class="foot">
|
|
162
|
+
结构与风格分离:三份模式模板见 <code>assets/templates/</code>,9 套 token 见 <code>references/styles.md</code>(PPTX 侧与 <code>scripts/layout-constants.json</code> 同源)。
|
|
163
|
+
模式规则见 <code>references/modes.md</code>:演示汇报(3 秒一主张,台上宣讲)/ 研究报告(咨询密排:行动标题 + Exhibit 编号 + so-what + 双/三栏论证 + 密表 + 矩阵)/ 信息架构图(图为王,1–3 张全幅主图)。
|
|
164
|
+
每张卡底部辅助条:石墨深灰为「深色优先」——主预览即 dark 变体、辅助条展示浅色辅助变体;其余 8 套主预览为 light、辅助条为 dark。每套风格的 5 色数据色板(c1–c5,单源 <code>STYLE_DATA_COLORS</code>)在主预览中随模式展示(彩色只属于数据系列)。
|
|
165
|
+
新增风格:styles.md 加两个覆盖块 → 本页 <code>STYLE_META</code> 加一项(卡片列表与配色由单源派生,不必手改)→ 完。
|
|
166
|
+
</div>
|
|
167
|
+
|
|
168
|
+
<script>
|
|
169
|
+
/* __TOPPPT_CONSTANTS_START__ */
|
|
170
|
+
/* ── 由 scripts/sync_runtime.py 从 scripts/layout-constants.json 注入 · 禁止手改 ── */
|
|
171
|
+
/* MTS = 三模式独立排版比例尺(按模式取 pt;基准 TS_BASE = presentation 档) */
|
|
172
|
+
/* PRESETS_DARK = 风格 dark token(REPORT_MODEL.theme="dark" 时导出深色版)*/
|
|
173
|
+
/* GRID = 12 列网格;TYPO = 语义字阶 C0–T14;CONT = 容器内边距;REG = 图表登记四元组;DEEP = 深度模式配置 */
|
|
174
|
+
/* IMG = 素材图片规格与配图占位约定(版式/裁切/建议尺寸/占位标签,双引擎同源) */
|
|
175
|
+
/* STYLE_DATA_COLORS(_DARK) = 9 套风格各自的编码色板 c1–c5(数据系列;结构色纪律不变) */
|
|
176
|
+
/* LAYOUT_SLOTS + regionOf = 页型布局区域 IR(与 scripts/lib_layout_regions.js 同源) */
|
|
177
|
+
var PW = 13.333, PH = 7.5, MX = 0.6, CW = PW - 2 * MX, EMU = 914400;
|
|
178
|
+
var TS_BASE = {"coverTitle":44,"coverSub":18,"h1":30,"h2":17,"lead":14,"body":13,"caption":11,"micro":10};
|
|
179
|
+
var MTS = {"presentation":{"coverTitle":44,"coverSub":18,"h1":30,"h2":17,"lead":14,"body":13,"caption":11,"micro":10},"research":{"coverTitle":36,"coverSub":14,"h1":22,"h2":13.5,"lead":11.5,"body":10.5,"caption":9,"micro":8.5},"architecture":{"coverTitle":44,"coverSub":19,"h1":30,"h2":17,"lead":14,"body":13,"caption":11,"micro":10}};
|
|
180
|
+
var PT = {"layout":{"contentTop":2.35,"contentBottom":6.9,"contentBottomWithNote":6.4,"pageNumY":7.0},"common":{"headEyebrowY":0.48,"headTitleY":0.82,"headRuleY":1.72,"leadY":1.88,"bodyY":2.35,"bodyYWithLead":2.55,"pagerY":7.0},"cover":{"metaY":0.7,"titleY":2.4,"titleH":2.0,"subtitleY":4.5,"subtitleH":0.8},"closing":{"eyebrowY":0.7,"titleY":1.2,"titleH":1.2,"pointsY":3.0,"pointTitleH":0.6,"pointBodyH":1.2},"points":{"listY":2.5,"rowH":0.72,"rowHMin":0.5,"markSize":0.14,"metricY":4.7,"metricW":2.6,"metricValH":0.9,"metricCapY":5.6},"metrics":{"bandY":3.1,"cardH":2.3,"valY":3.45,"valH":1.1,"capY":4.55,"capH":0.7,"gap":0.3,"maxW":2.9},"table":{"y":2.5,"rowH":0.55,"rowHMin":0.32,"headRowH":0.5},"bar":{"hbarY0":2.6,"hbarY1":6.25,"chartX":0.6,"chartY":2.95,"chartW":1.2,"chartH":3.35,"noteY":6.55},"note":{"y":6.55,"h":0.4},"exhibit":{"badgeY":2.35,"chartY":2.75,"chartH":3.25,"soWhatY":6.05,"footnoteY":6.72},"twocol":{"colGap":0.5,"bodyH":3.6,"rowHMin":0.5},"hbar":{"labelW":1.9,"valW":1.0,"rowH":0.55,"barRatio":0.5},"diagram":{"layerBarW":1.35,"layerGap":0.15,"nodeGap":0.15,"bodyStartY":2.9,"maxLayerH":1.15,"nodeMaxW":2.2},"split":{"leftW":0.55,"rightW":0.415,"rightX":0.585,"pointsY":2.7,"rowH":0.78,"capY":2.55,"chartY":3.0,"chartH":3.7,"tableY":2.7,"tableRowH":0.5},"cards":{"startY":3.0,"gap":0.25,"maxH":2.0,"titleH":0.4},"timeline":{"labelY":2.95,"axisY":3.58,"dotY":3.51,"dotR":0.18,"nameY":3.9,"descY":4.45,"descH":1.2},"research":{"col3Gap":0.38,"matrixLabelW":1.5,"matrixCellH":0.85,"matrixY":2.2,"denseTableY":2.2,"denseRowH":0.42,"halfTableW":0.52,"halfChartX":0.57,"halfChartW":0.43},"arch":{"fullStartY":2.1,"fullEndY":6.9,"laneH":0.72,"laneHMin":0.5,"laneGap":0.14,"laneHeadW":1.3,"stepGap":0.12,"stepMaxW":1.9},"kpi":{"heroY":2.9,"heroW":0.52,"heroH":1.6,"dividerX":0.56,"metricY0":2.95,"metricRowH":0.85},"comparison":{"panelGap":0.4,"panelY":2.55,"panelH":3.4,"titleH":0.45,"rowH":0.62},"quote":{"markY":1.75,"textY":2.7,"textH":2.3,"authorY":5.25,"contextY":5.8},"donut":{"centerX":3.05,"centerY":4.6,"r":1.6,"holeR":0.95,"legendX":5.6,"legendRowH":0.55,"legendLabelW":3.4,"legendValW":1.3,"legendPctX":5.3,"legendPctW":1.3},"steps":{"y":3.05,"barH":1.35,"gap":0.12,"arrowW":0.3,"numH":0.3,"titleH":0.34,"pad":0.08,"maxPerRow":6},"heatmap":{"y":2.6,"labelW":1.7,"headH":0.42,"cellH":0.6,"cellGap":0.06,"legendW":1.6},"pyramid":{"y":2.35,"rowH":0.72,"gap":0.08,"minW":0.34,"labelW":3.2},"bullet":{"y":2.6,"rowH":0.8,"labelW":2.4,"valW":1.7,"barH":0.26},"image":{"y":2.3,"h":4.2,"halfW":0.56,"halfGap":0.06,"capY":6.6,"capH":0.3,"radius":0.09,"noteRowH":0.62,"gridGap":0.16,"gridCols":{"2":2,"3":3,"4":4,"6":3},"gridCapH":0.28,"compareGap":0.3,"compareTagH":0.26,"wallCellH":0.92,"wallGap":0.18,"wallMaxRows":2},"flagbar":{"hdH":0.26,"rowH":0.24,"maxRows":3,"gap":0.12},"sankey":{"y":2.45,"h":4.1,"nodeW":0.32,"nodeGap":0.14,"labelW":1.55,"minBandH":0.22,"maxNodes":12,"maxFlows":24},"treemap":{"y":2.45,"h":4.1,"gap":0.05,"labelMinH":0.34,"maxLeaves":16,"maxDepth":3},"boxplot":{"y":2.7,"h":3.7,"labelW":1.5,"groupGap":0.3,"boxMaxW":0.9,"whiskerCapW":0.34,"maxGroups":8},"network":{"y":2.4,"h":4.2,"nodeR":0.28,"nodeRMin":0.18,"labelMaxW":1.4,"maxNodes":18,"maxEdges":30},"marimekko":{"y":2.6,"h":3.75,"labelW":1.55,"colGap":0.06,"legendH":0.42,"maxCols":6,"maxSegs":4},"streamgraph":{"y":2.6,"h":3.75,"labelW":1.4,"bandMinH":0.12,"maxSeries":6}};
|
|
181
|
+
var PRESETS = {
|
|
182
|
+
'business-blue': { accent:'1A73E8', ink:'202124', body:'5F6368', faint:'80868B', bg:'FFFFFF', surface:'F8F9FA', line:'DADCE0', soft:'E8F0FE', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
183
|
+
'apple-mono': { accent:'1D1D1F', ink:'1D1D1F', body:'6E6E73', faint:'86868B', bg:'FFFFFF', surface:'F5F5F7', line:'D2D2D7', soft:'F5F5F7', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
184
|
+
'mckinsey': { accent:'003A70', ink:'101828', body:'475467', faint:'667085', bg:'FFFFFF', surface:'F2F4F7', line:'D0D5DD', soft:'EEF4FB', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
185
|
+
'brand-red': { accent:'D0021B', ink:'1F1A1B', body:'5D5456', faint:'8A8083', bg:'FFFFFF', surface:'FAF7F7', line:'E2D9DA', soft:'FBECEC', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
186
|
+
'warm-sand': { accent:'96681F', ink:'2A2521', body:'6B5F52', faint:'93836F', bg:'FBF9F6', surface:'F6F2EC', line:'E0D7C9', soft:'F3ECDD', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
187
|
+
'deep-teal': { accent:'0F6B5C', ink:'14201E', body:'4A5A57', faint:'73837F', bg:'FFFFFF', surface:'F2F6F5', line:'CFDEDC', soft:'E4F1EE', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
188
|
+
'graphite-dark': { accent:'0369A1', ink:'1A1D21', body:'4B5158', faint:'767C84', bg:'F4F5F7', surface:'ECEEF1', line:'CED1D6', soft:'E2EFF7', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
189
|
+
'indigo-violet': { accent:'5B5BD6', ink:'1B1A2E', body:'52506B', faint:'7A779A', bg:'FFFFFF', surface:'F4F4FB', line:'D7D7E8', soft:'ECECF9', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
190
|
+
'spectrum': { accent:'4563EF', ink:'171A21', body:'4D5566', faint:'7B8494', bg:'FBFCFE', surface:'F4F6FA', line:'D6DCE6', soft:'ECEEFF', onAccent:'FFFFFF', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' }
|
|
191
|
+
};
|
|
192
|
+
var PRESETS_DARK = {
|
|
193
|
+
'business-blue': { accent:'8AB4F8', ink:'E8EAED', body:'ADB4BD', faint:'868D96', bg:'0D0F13', surface:'191D23', line:'2F353D', soft:'16243A', onAccent:'0D1B2E', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
194
|
+
'apple-mono': { accent:'F5F5F7', ink:'F5F5F7', body:'A1A1A6', faint:'86868B', bg:'000000', surface:'161617', line:'38383D', soft:'1D1D1F', onAccent:'000000', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
195
|
+
'mckinsey': { accent:'7FB2E5', ink:'E4E7EC', body:'AAB3C2', faint:'8A94A6', bg:'0C1116', surface:'12181F', line:'2A3342', soft:'12233A', onAccent:'0C1A2E', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
196
|
+
'brand-red': { accent:'FF5A66', ink:'F3ECEC', body:'C4B6B7', faint:'9A8D8E', bg:'130D0E', surface:'1A1213', line:'37272A', soft:'331518', onAccent:'2A0D10', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
197
|
+
'warm-sand': { accent:'D9B36A', ink:'ECE5DB', body:'C4B8A8', faint:'9B8D7A', bg:'15120E', surface:'1D1913', line:'3A3128', soft:'2E2417', onAccent:'2A1F10', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
198
|
+
'deep-teal': { accent:'4FC3B0', ink:'E2ECEA', body:'B3C2BF', faint:'86948F', bg:'0D1312', surface:'131B1A', line:'293834', soft:'12312C', onAccent:'0C2420', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
199
|
+
'graphite-dark': { accent:'4DA3FF', ink:'EEF2F6', body:'B9C2CD', faint:'85909D', bg:'0B0E12', surface:'171D24', line:'2B3540', soft:'132841', onAccent:'07182B', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
200
|
+
'indigo-violet': { accent:'A5A4F0', ink:'E6E5F5', body:'B6B4D4', faint:'8B89B0', bg:'100F1C', surface:'171629', line:'322F52', soft:'232146', onAccent:'171631', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' },
|
|
201
|
+
'spectrum': { accent:'8BA0F8', ink:'E8EBF2', body:'A7AFBF', faint:'7E8798', bg:'0E1116', surface:'171C26', line:'2B3342', soft:'1B2242', onAccent:'141A38', font:'Microsoft YaHei', fontDisplay:'Microsoft YaHei' }
|
|
202
|
+
};
|
|
203
|
+
var STYLE_DATA_COLORS = {"business-blue":["1a73e8","3526bb","21a199","b77148","99983d"],"apple-mono":["1d1d1f","0071e3","0f7b6c","c2410c","7c3aed"],"mckinsey":["003a70","2826bb","21a18e","b76848","99903d"],"brand-red":["d0021b","bb6326","d634ae","40a182","438aa8"],"warm-sand":["96681f","839324","cf3b3e","4d88b2","4a47a4"],"deep-teal":["0f6b5c","2683bb","22aa3e","b74870","a85c43"],"graphite-dark":["0369a1","2637bb","1f9977","b75948","a18a40"],"indigo-violet":["5b5bd6","7432ae","4197c8","a08f4b","7ca04b"],"spectrum":["4563ef","5b26bb","269ebb","af8746","83993d"]};
|
|
204
|
+
var STYLE_DATA_COLORS_DARK = {"business-blue":["8ab4f8","7966e0","88e7e5","d4ad91","cbce83"],"apple-mono":["f5f5f7","2997ff","2dd4bf","ff9f0a","bf5af2"],"mckinsey":["7fb2e5","6f6bdb","8ce3d8","d1a694","cbc586"],"brand-red":["ff5a66","e09e66","e788cb","91d4c2","83b4ce"],"warm-sand":["d9b36a","c2d571","df9391","97b5ce","8e89c7"],"deep-teal":["4fc3b0","7aaecd","97d8a4","c99cac","c29c8f"],"graphite-dark":["4da3ff","6c66e0","88e7dc","d4a691","cec983"],"indigo-violet":["a5a4f0","a967e0","89c3e7","d3c792","aece83"],"spectrum":["8ba0f8","9066e0","88d6e7","d4ba91","bdce83"]};
|
|
205
|
+
var GRID = {"columns":12,"gutter":0.16,"colW":0.8644,"x":[0.6,1.6244,2.6488,3.6732,4.6976,5.722,6.7464,7.7708,8.7952,9.8196,10.844,11.8684,12.733],"y":[2.35,3.27,4.19,5.11,6.03,6.9],"safe":{"top":0.4,"bottom":0.4,"left":0.6,"right":0.6}};
|
|
206
|
+
var TYPO = {"levels":[{"id":"C0","name":"封面/章节幕标题","role":"coverTitle","usage":"封面主标题、章节幕标题"},{"id":"T1","name":"页码/章节徽章","role":"caption","usage":"页码徽章、章节编号"},{"id":"T2","name":"页面主标题/结论标题","role":"h1","usage":"每页顶部结论句(research 行动标题)"},{"id":"T3","name":"副标题/语境说明","role":"lead","usage":"主标题下方导语"},{"id":"T4","name":"模块标题/图表标题","role":"h2","usage":"卡片标题、图表标题、面板标题"},{"id":"T5","name":"证据编号/轻量标签","role":"micro","usage":"Exhibit 编号、状态标签"},{"id":"T6","name":"证据块标题/小节标题","role":"h2","usage":"分栏小标题、证据块标题"},{"id":"T7","name":"正文解释段落","role":"body","usage":"证据解释、管理解读正文、表格正文"},{"id":"T8","name":"结论条文字","role":"body","usage":"so-what 结论条、核心结论框"},{"id":"T9","name":"SO WHAT 标签","role":"caption","usage":"so-what 标签行"},{"id":"T10","name":"SO WHAT 正文/业务含义","role":"body","usage":"so-what 正文、行动含义、表格行动项"},{"id":"T11","name":"图表轴/图例/刻度/微标签","role":"micro","usage":"坐标轴、图例、刻度、单位(禁用于表格正文与完整短句)"},{"id":"T12","name":"图表数据标签","role":"caption","usage":"折线点值、柱形标签、百分比标注"},{"id":"T13","name":"关键 KPI 大数字","role":"h1","usage":"KPI 大数字、hero 数值"},{"id":"T14","name":"注释/口径/来源/页脚","role":"micro","usage":"footnote、来源行、页脚、小页码"}],"tableSemanticRule":{"body":["T7","T10"],"microAllowed":["T11"],"microForbiddenFor":["表格正文","行动项","风险项","解释句","建议句","长项目符号","完整短句"]}};
|
|
207
|
+
var CONT = {"pad":{"card":0.18,"panel":0.2,"cell":0.08,"band":0.16,"soWhat":0.16,"kpi":0.18,"chart":0.1,"head":0.05,"footer":0.05,"node":0.06},"minPad":0.06,"textMetrics":{"lineFactor":1.45,"emAsciiRatio":0.52},"overflowRule":"溢出处置优先级:① 优化内容(列表化/精炼/合并/拆页/换组合版式)→ ② 调整容器尺寸与行宽 → ③ 有限度缩小字号(见 fontShrink)→ ④ 仍装不下则拆页。禁止无限缩字号硬塞,也禁止把「精简」当第一手段砍掉决策必需信息。","fontShrink":{"ladder":[15,14,13.5,13,12.5,12,11.5,11,10.5,10,9.5,9,8.5],"maxShrinkSteps":4,"floorPt":{"presentation":10,"research":9,"architecture":10},"preferContentFirst":true,"warnBelow":9.5},"continuousTextRule":"语义连续的一句话 / so-what 主句 / 结论句 / 表格单元格正文不得拆成多个独立文本框(避免异常空格、断句、基线漂移);局部加粗高亮必须用同一文本框内富文本。"};
|
|
208
|
+
var REG = {"bar":{"html":"svg-bars","pptx":"native","nativeType":"bar","dataTable":"notes","min":{"vbHeightMin":160}},"hbar":{"html":"svg-hbars","pptx":"native","nativeType":"bar","dataTable":"notes","min":{"vbHeightMin":100}},"stack":{"html":"svg-stack","pptx":"native","nativeType":"bar","dataTable":"notes","min":{"vbHeightMin":160},"nativeOpt":{"barGrouping":"stacked"}},"stackline":{"html":"svg-stackline","pptx":"native","nativeType":"bar","dataTable":"notes","min":{"vbHeightMin":40},"nativeOpt":{"barGrouping":"percentStacked"}},"line":{"html":"svg-line","pptx":"native","nativeType":"line","dataTable":"notes","min":{"vbHeightMin":160}},"dualline":{"html":"svg-dualline","pptx":"native","nativeType":"line","dataTable":"notes","min":{"vbHeightMin":160}},"area":{"html":"svg-area","pptx":"native","nativeType":"area","dataTable":"notes","min":{"vbHeightMin":160}},"donut":{"html":"svg-donut","pptx":"native","nativeType":"doughnut","dataTable":"notes","min":{"pxWidthMin":140}},"multidonut":{"html":"svg-mdonut","pptx":"native","nativeType":"doughnut","dataTable":"notes","min":{"pxWidthMin":140}},"pie":{"html":"svg-pie","pptx":"native","nativeType":"pie","dataTable":"notes","min":{"pxWidthMin":140}},"radar":{"html":"svg-radar","pptx":"native","nativeType":"radar","dataTable":"notes","min":{"pxWidthMin":220}},"scatter":{"html":"svg-scatter","pptx":"native","nativeType":"scatter","dataTable":"notes","min":{"vbHeightMin":180}},"bubble":{"html":"svg-bubble","pptx":"native","nativeType":"bubble","dataTable":"notes","min":{"vbHeightMin":180}},"waterfall":{"html":"svg-wf","pptx":"native","nativeType":"bar","dataTable":"notes","min":{"vbHeightMin":170},"nativeTrick":"stacked+hiddenBase+connector"},"gauge":{"html":"svg-gauge","pptx":"native","nativeType":"doughnut","dataTable":"notes","min":{"pxWidthMin":180},"nativeTrick":"doughnut+firstSliceAng+hiddenRemainder"},"pareto":{"html":"svg-pareto","pptx":"native","nativeType":"bar","dataTable":"notes","min":{"vbHeightMin":180},"nativeTrick":"multiType+bar+line"},"gantt":{"html":"svg-gantt","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":130},"path":{"forbidPresetShapes":true}},"vsbar":{"html":"svg-vsbar","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":100},"path":{"forbidPresetShapes":true}},"progress":{"html":"svg-progress","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":100},"path":{"forbidPresetShapes":true}},"sparkline":{"html":"svg-spark","pptx":"shape","dataTable":"off","min":{"vbHeightMin":20},"path":{"forbidPresetShapes":true}},"funnel":{"html":"svg-funnel","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":160},"path":{"minSamplePoints":8,"forbidPresetShapes":true}},"treemap":{"html":"svg-treemap","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":170},"path":{"forbidPresetShapes":true}},"marimekko":{"html":"svg-marimekko","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":160},"path":{"forbidPresetShapes":true}},"boxplot":{"html":"svg-boxplot","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":180},"path":{"forbidPresetShapes":true}},"network":{"html":"svg-network","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":200},"path":{"forbidPresetShapes":true}},"sankey":{"html":"svg-sankey","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":200},"path":{"minSamplePoints":16,"trackBothEdges":true,"forbidPresetShapes":true}},"streamgraph":{"html":"svg-stream","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":160},"path":{"minSamplePoints":24,"trackBothEdges":true,"forbidPresetShapes":true}},"slope":{"html":"svg-slope","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":180},"path":{"forbidPresetShapes":true}},"dumbbell":{"html":"svg-dumbbell","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":160},"path":{"forbidPresetShapes":true}},"lollipop":{"html":"svg-lollipop","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":140},"path":{"forbidPresetShapes":true}},"dotplot":{"html":"svg-dotplot","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":120},"path":{"forbidPresetShapes":true}},"bulletchart":{"html":"svg-bullet","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":140},"path":{"forbidPresetShapes":true}},"waffle":{"html":"svg-waffle","pptx":"shape","dataTable":"notes","min":{"vbHeightMin":160},"path":{"forbidPresetShapes":true}},"radialbar":{"html":"svg-radialbar","pptx":"shape","dataTable":"notes","min":{"pxWidthMin":200},"path":{"minSamplePoints":16,"forbidPresetShapes":true}},"rose":{"html":"svg-rose","pptx":"shape","dataTable":"notes","min":{"pxWidthMin":180},"path":{"minSamplePoints":16,"forbidPresetShapes":true}},"candlestick":{"html":"svg-candle","pptx":"shape","dataTable":"appendix","min":{"vbHeightMin":180},"path":{"forbidPresetShapes":true}}};
|
|
209
|
+
var DEEP = {"triggers":["高保真","1:1","一比一","精确还原","按图还原","正式交付","不能偏移","像素级","严格对照","逐页验收"],"complexCharts":["sankey","streamgraph","treemap","marimekko","boxplot","network","rose","radialbar","candlestick","funnel"],"checks":{"anchors":true,"containerOverflow":true,"renderCompare":true,"manifest":true},"renderCompare":{"engine":"soffice","fallback":"powerpoint-com","skipIfMissing":true,"dpi":96}};
|
|
210
|
+
var IMG = {"layouts":["full","half","bleed","grid","compare","wall"],"multiLayouts":["grid","compare","wall"],"fitEnum":["cover","contain"],"fitDefault":"cover","formats":["png","jpeg","jpg","webp","svg"],"ratioDefault":{"full":"3:1","half":"4:3","bleed":"21:9","grid":"4:3","compare":"4:3","wall":"1:1"},"ratioCssClass":{"full":"media--r3-1","half":"media--r4-3","bleed":"media--r21-9","grid":"media--r4-3","compare":"media--r4-3","wall":"media--r1-1"},"recommendedSizePx":{"full":"2400×800","half":"1400×1050","bleed":"2560×1100","grid":"900×675","compare":"1400×1050","wall":"480×480"},"maxInlineBytes":1572864,"maxTotalInlineBytes":8388608,"maxPerPage":6,"placeholderLabel":"配图占位","placeholderHintPrefix":"建议 ","placeholderHintSuffix":"px","zeroExternal":true,"qualityRule":"位图优先提供 ≥2× 显示尺寸;截图用 16:9 或 4:3 锁定比例;数据图不要用截图(应用内联 SVG 图表,可随主题变色)。"};
|
|
211
|
+
var LAYOUT_SLOTS = {"version":"9.0","pageTypes":{"points":{"mode":["presentation","research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".grid.g-2 / .card / .ul","pptx":"points columns","minUnits":1},{"id":"annotation","role":"annotation","required":false,"html":".sowhat / .note","pptx":"soWhatBar / footnoteLine"}]},"metrics":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".metric","pptx":"metric row","minUnits":4},{"id":"annotation","role":"annotation","required":false,"html":"口径行 / .sowhat","pptx":"footnoteLine / soWhatBar"}]},"kpi":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"hero","role":"primary","required":true,"html":".t-metric hero","pptx":"hero number"},{"id":"metrics","role":"secondary","required":false,"html":".metric","pptx":"support metrics"},{"id":"annotation","role":"annotation","required":false,"html":".sowhat / .note","pptx":"soWhatBar"}]},"exhibit":{"mode":["research","presentation"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead / .exhibit__hd","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart] / .exhibit","pptx":"nativeChart | shapeChart","channel":"registry"},{"id":"secondary","role":"secondary","required":false,"html":"要点列表","pptx":"side bullets"},{"id":"annotation","role":"annotation","required":true,"html":".exhibit__src / .sowhat","pptx":"footnoteLine / soWhatBar / notes"}]},"split":{"mode":["presentation","research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"left","role":"primary","required":true,"html":"左区(points/table/image/chart)","pptx":"left zone"},{"id":"right","role":"secondary","required":true,"html":"右区(points/table/image/chart)","pptx":"right zone"},{"id":"annotation","role":"annotation","required":false,"html":".sowhat / .note","pptx":"soWhatBar"}]},"table":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".tbl-wrap table","pptx":"addTable","maxRows":{"presentation":8,"research":16}},{"id":"annotation","role":"annotation","required":false,"html":".sowhat / .note","pptx":"soWhatBar / footnoteLine"}]},"bar":{"mode":["presentation","research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart]","pptx":"nativeChart | shapeChart","channel":"registry"},{"id":"annotation","role":"annotation","required":true,"html":"note / dataTable","pptx":"footnoteLine / notes / inline table"}]},"donut":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=donut]","pptx":"addChart doughnut"},{"id":"annotation","role":"annotation","required":false,"html":"中心合计 / 图例 / .note","pptx":"center label / legend / notes"}]},"twocol":{"mode":["research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".cols-2","pptx":"two text columns"},{"id":"annotation","role":"annotation","required":false,"html":".sowhat","pptx":"soWhatBar"}]},"threecol":{"mode":["research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".cols-3","pptx":"three text columns"},{"id":"annotation","role":"annotation","required":false,"html":".sowhat","pptx":"soWhatBar"}]},"halftable":{"mode":["research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"左表","pptx":"addTable left"},{"id":"secondary","role":"secondary","required":true,"html":"右图","pptx":"chart right"},{"id":"annotation","role":"annotation","required":false,"html":".sowhat","pptx":"soWhatBar"}]},"matrix":{"mode":["research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".matrix","pptx":"matrix cells"},{"id":"annotation","role":"annotation","required":false,"html":".sowhat","pptx":"soWhatBar"}]},"comparison":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"left","role":"primary","required":true,"html":"左面板","pptx":"left panel"},{"id":"right","role":"secondary","required":true,"html":"右面板","pptx":"right panel"},{"id":"annotation","role":"annotation","required":false,"html":"verdict / .sowhat","pptx":"verdict bar"}]},"quote":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"金句正文","pptx":"quote text"}]},"timeline":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".tl","pptx":"timeline axis"}]},"steps":{"mode":["presentation","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".steps","pptx":"step row"}]},"cards":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".card grid","pptx":"card grid"}]},"heatmap":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".heat","pptx":"heat cells"}]},"bullet":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".bul","pptx":"bullet rows"}]},"pyramid":{"mode":["presentation","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".pyr","pptx":"pyramid layers"}]},"image":{"mode":["presentation","research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".media*","pptx":"imageLayoutShapes"}]},"diagram":{"mode":["architecture","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".arch / layers","pptx":"layered nodes + edges","maxNodes":24,"maxLayers":4},{"id":"annotation","role":"annotation","required":false,"html":".arch__legend / .note","pptx":"legend chips / notes"}]},"lane":{"mode":["architecture","research"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":".lane","pptx":"lanes + steps"}]},"sankey":{"mode":["research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=sankey]","pptx":"infoSankey","maxNodes":12},{"id":"annotation","role":"annotation","required":true,"html":"dataTable / .note","pptx":"notes"}]},"treemap":{"mode":["research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=treemap]","pptx":"infoTreemap"},{"id":"annotation","role":"annotation","required":true,"html":"dataTable / .note","pptx":"notes"}]},"boxplot":{"mode":["research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=boxplot]","pptx":"infoBoxplot"},{"id":"annotation","role":"annotation","required":true,"html":"dataTable / .note","pptx":"notes"}]},"network":{"mode":["research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=network]","pptx":"infoNetwork"},{"id":"annotation","role":"annotation","required":true,"html":"dataTable / .note","pptx":"notes"}]},"marimekko":{"mode":["research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=marimekko]","pptx":"infoMarimekko"},{"id":"annotation","role":"annotation","required":true,"html":"dataTable / .note","pptx":"notes"}]},"streamgraph":{"mode":["research","architecture"],"slots":[{"id":"head","role":"chrome","required":true,"html":".shead","pptx":"head()"},{"id":"primary","role":"primary","required":true,"html":"svg[data-chart=streamgraph]","pptx":"infoStreamgraph"},{"id":"annotation","role":"annotation","required":true,"html":"dataTable / .note","pptx":"notes"}]}}};
|
|
212
|
+
|
|
213
|
+
/* regionOf(pageType, slotId, opts) — 页型布局区域 IR(与 scripts/lib_layout_regions.js 同源) */
|
|
214
|
+
function regionOf(pageType, slotId, opts) {
|
|
215
|
+
var type = String(pageType || 'points'), slot = String(slotId || '');
|
|
216
|
+
opts = opts || {};
|
|
217
|
+
var L = PT.layout || {}, C = PT.common || {};
|
|
218
|
+
var topDefault = C.bodyY || 2.5;
|
|
219
|
+
var bottomDefault = opts.withNote ? (L.contentBottomWithNote || 6.4) : (L.contentBottom || 6.9);
|
|
220
|
+
if (slot === 'head' || slot === 'chrome') {
|
|
221
|
+
return { x: MX, y: C.headEyebrowY || 0.55, w: CW,
|
|
222
|
+
h: Math.max(0.4, (C.headRuleY || 1.95) - (C.headEyebrowY || 0.55)),
|
|
223
|
+
titleY: C.headTitleY, ruleY: C.headRuleY, leadY: C.leadY, bodyY: C.bodyY };
|
|
224
|
+
}
|
|
225
|
+
if (slot === 'annotation' || slot === 'soWhat') {
|
|
226
|
+
var sy = (PT.exhibit && PT.exhibit.soWhatY != null) ? PT.exhibit.soWhatY : 6.05;
|
|
227
|
+
return { x: MX, y: sy, w: CW, h: 0.62 };
|
|
228
|
+
}
|
|
229
|
+
if (slot === 'footnote') {
|
|
230
|
+
var fy = (PT.exhibit && PT.exhibit.footnoteY != null) ? PT.exhibit.footnoteY : ((PT.note && PT.note.y) || 6.55);
|
|
231
|
+
return { x: MX, y: fy, w: CW - 1.2, h: (PT.note && PT.note.h) || 0.32 };
|
|
232
|
+
}
|
|
233
|
+
var P = PT[type] || {};
|
|
234
|
+
if (type === 'exhibit' && slot === 'primary') {
|
|
235
|
+
var ey = P.chartY || 2.95;
|
|
236
|
+
return { x: MX, y: ey, w: CW, h: Math.max(1.2, (L.contentBottomWithNote || 6.4) - ey), badgeY: P.badgeY };
|
|
237
|
+
}
|
|
238
|
+
if (type === 'metrics' && slot === 'primary') {
|
|
239
|
+
return { x: MX, y: P.bandY || 3.1, w: CW, h: P.cardH || 2.3, gap: P.gap, maxW: P.maxW,
|
|
240
|
+
valY: P.valY, valH: P.valH, capY: P.capY, capH: P.capH };
|
|
241
|
+
}
|
|
242
|
+
if (type === 'table' && slot === 'primary') {
|
|
243
|
+
var ty = P.y || topDefault;
|
|
244
|
+
return { x: MX, y: ty, w: CW, h: Math.max(1, (opts.bottom != null ? opts.bottom : bottomDefault) - ty) };
|
|
245
|
+
}
|
|
246
|
+
if (type === 'bar' && slot === 'primary') {
|
|
247
|
+
var by = P.chartY || 2.95;
|
|
248
|
+
var bb = opts.bottom != null ? opts.bottom : bottomDefault;
|
|
249
|
+
return { x: MX + (P.chartX || 0), y: by, w: CW - (P.chartW || 0), h: Math.max(1.2, bb - by) };
|
|
250
|
+
}
|
|
251
|
+
if (type === 'bar' && slot === 'hbar') {
|
|
252
|
+
var y0 = P.hbarY0 || 2.6;
|
|
253
|
+
var y1 = opts.bottom != null ? opts.bottom : (P.hbarY1 || 6.25);
|
|
254
|
+
return { x: MX, y: y0, w: CW, h: Math.max(1.2, y1 - y0) };
|
|
255
|
+
}
|
|
256
|
+
if (type === 'points' && (slot === 'primary' || slot === 'list')) {
|
|
257
|
+
var ly = P.listY || topDefault;
|
|
258
|
+
return { x: MX, y: ly, w: CW, h: Math.max(0.8, (opts.bottom != null ? opts.bottom : bottomDefault) - ly) };
|
|
259
|
+
}
|
|
260
|
+
if (type === 'split' && (slot === 'left' || slot === 'right')) {
|
|
261
|
+
var st = P.chartY || topDefault;
|
|
262
|
+
var sb = opts.bottom != null ? opts.bottom : bottomDefault;
|
|
263
|
+
if (slot === 'left') return { x: MX, y: st, w: CW * (P.leftW || 0.55), h: Math.max(1.2, sb - st) };
|
|
264
|
+
return { x: MX + CW * (P.rightX != null ? P.rightX : 0.585), y: st, w: CW * (P.rightW || 0.415), h: Math.max(1.2, sb - st) };
|
|
265
|
+
}
|
|
266
|
+
if (type === 'twocol' && (slot === 'primary' || slot === 'left' || slot === 'right')) {
|
|
267
|
+
var gap = P.colGap || 0.5, colW = (CW - gap) / 2;
|
|
268
|
+
var tt = opts.top != null ? opts.top : topDefault;
|
|
269
|
+
var tb = opts.bottom != null ? opts.bottom : bottomDefault;
|
|
270
|
+
if (slot === 'right') return { x: MX + colW + gap, y: tt, w: colW, h: Math.max(1, tb - tt) };
|
|
271
|
+
return { x: MX, y: tt, w: colW, h: Math.max(1, tb - tt) };
|
|
272
|
+
}
|
|
273
|
+
if ((type === 'diagram' || type === 'lane') && slot === 'primary') {
|
|
274
|
+
var arch = PT.arch || {};
|
|
275
|
+
var dy = (opts.mode === 'architecture' && arch.fullStartY != null) ? arch.fullStartY : (P.bodyStartY || 2.9);
|
|
276
|
+
var db = (opts.mode === 'architecture' && arch.fullEndY != null) ? arch.fullEndY
|
|
277
|
+
: (opts.bottom != null ? opts.bottom : bottomDefault);
|
|
278
|
+
return { x: MX, y: dy, w: CW, h: Math.max(1.2, db - dy) };
|
|
279
|
+
}
|
|
280
|
+
if (type === 'kpi' && (slot === 'hero' || slot === 'primary')) {
|
|
281
|
+
return { x: MX, y: P.heroY || 2.9, w: CW * (P.heroW || 0.52), h: P.heroH || 1.6,
|
|
282
|
+
dividerX: P.dividerX, metricY0: P.metricY0, metricRowH: P.metricRowH };
|
|
283
|
+
}
|
|
284
|
+
if (type === 'comparison' && (slot === 'left' || slot === 'primary' || slot === 'right')) {
|
|
285
|
+
var cg = P.panelGap || 0.4, pw = (CW - cg) / 2;
|
|
286
|
+
if (slot === 'right') return { x: MX + pw + cg, y: P.panelY || 2.55, w: pw, h: P.panelH || 3.4 };
|
|
287
|
+
return { x: MX, y: P.panelY || 2.55, w: pw, h: P.panelH || 3.4 };
|
|
288
|
+
}
|
|
289
|
+
if (type === 'quote' && slot === 'primary') {
|
|
290
|
+
return { x: MX + 1.05, y: P.textY || 2.7, w: CW - 2.1, h: P.textH || 2.3 };
|
|
291
|
+
}
|
|
292
|
+
if (type === 'heatmap' && slot === 'primary') {
|
|
293
|
+
var hy = P.y || 2.6;
|
|
294
|
+
return { x: MX, y: hy, w: CW, h: Math.max(1, (opts.bottom != null ? opts.bottom : bottomDefault) - hy) };
|
|
295
|
+
}
|
|
296
|
+
if (type === 'bullet' && slot === 'primary') {
|
|
297
|
+
var uy = P.y || 2.6;
|
|
298
|
+
return { x: MX, y: uy, w: CW, h: Math.max(1, (opts.bottom != null ? opts.bottom : bottomDefault) - uy) };
|
|
299
|
+
}
|
|
300
|
+
if (type === 'pyramid' && slot === 'primary') {
|
|
301
|
+
var py2 = P.y || 2.35;
|
|
302
|
+
return { x: MX, y: py2, w: CW, h: Math.max(1, (opts.bottom != null ? opts.bottom : bottomDefault) - py2) };
|
|
303
|
+
}
|
|
304
|
+
if (type === 'steps' && slot === 'primary') {
|
|
305
|
+
return { x: MX, y: P.y || 3.05, w: CW, h: P.barH || 1.35 };
|
|
306
|
+
}
|
|
307
|
+
if (type === 'cards' && slot === 'primary') {
|
|
308
|
+
var cy2 = P.startY || 3.0;
|
|
309
|
+
return { x: MX, y: cy2, w: CW, h: Math.max(1, (opts.bottom != null ? opts.bottom : bottomDefault) - cy2) };
|
|
310
|
+
}
|
|
311
|
+
if (type === 'timeline' && slot === 'primary') {
|
|
312
|
+
return { x: MX, y: P.labelY || 2.95, w: CW, h: Math.max(1, bottomDefault - (P.labelY || 2.95)) };
|
|
313
|
+
}
|
|
314
|
+
if (type === 'image' && slot === 'primary') {
|
|
315
|
+
var iy2 = Math.max(P.y || 2.3, opts.top || 0);
|
|
316
|
+
return { x: MX, y: iy2, w: CW, h: Math.max(1.2, Math.min(P.h || 4.2, (opts.bottom != null ? opts.bottom : bottomDefault) - iy2)) };
|
|
317
|
+
}
|
|
318
|
+
if ((type === 'halftable') && (slot === 'left' || slot === 'primary')) {
|
|
319
|
+
var rs = PT.research || {};
|
|
320
|
+
return { x: MX, y: topDefault, w: CW * (rs.halfTableW || 0.52), h: Math.max(1, bottomDefault - topDefault) };
|
|
321
|
+
}
|
|
322
|
+
if ((type === 'halftable') && (slot === 'right' || slot === 'secondary')) {
|
|
323
|
+
var rs2 = PT.research || {};
|
|
324
|
+
return { x: MX + CW * (rs2.halfChartX || 0.57), y: topDefault, w: CW * (rs2.halfChartW || 0.43), h: Math.max(1, bottomDefault - topDefault) };
|
|
325
|
+
}
|
|
326
|
+
if (type === 'matrix' && slot === 'primary') {
|
|
327
|
+
var rm = PT.research || {};
|
|
328
|
+
var my = rm.matrixY || 2.3;
|
|
329
|
+
return { x: MX, y: my, w: CW, h: Math.max(1, (opts.bottom != null ? opts.bottom : bottomDefault) - my) };
|
|
330
|
+
}
|
|
331
|
+
var INFO = { sankey:1, treemap:1, boxplot:1, network:1, marimekko:1, streamgraph:1 };
|
|
332
|
+
if (INFO[type] && slot === 'primary') {
|
|
333
|
+
var iy3 = P.y || topDefault;
|
|
334
|
+
var ih3 = Math.max(1.2, Math.min(P.h || 4.1, (opts.bottom != null ? opts.bottom : bottomDefault) - iy3));
|
|
335
|
+
return { x: MX, y: iy3, w: CW, h: ih3 };
|
|
336
|
+
}
|
|
337
|
+
return { x: MX, y: topDefault, w: CW, h: Math.max(0.8, bottomDefault - topDefault) };
|
|
338
|
+
}
|
|
339
|
+
|
|
340
|
+
/* __TOPPPT_CONSTANTS_END__ */
|
|
341
|
+
|
|
342
|
+
/* ── 三种模式(一级维度;独立模板,生成时确定) ── */
|
|
343
|
+
var MODES=[
|
|
344
|
+
{id:'presentation',k:'模式 A · data-mode="presentation"',t:'演示汇报',
|
|
345
|
+
d:'台上讲给人听:版心 1400、正文 17–18px、每屏一主张、大图表。8–15 页。',rec:'默认'},
|
|
346
|
+
{id:'research',k:'模式 B · data-mode="research"',t:'研究报告',
|
|
347
|
+
d:'咨询机构坐读材料:版心 1240、正文 14–15px、行动标题、Exhibit 编号、双/三栏论证、密表、so-what。12–25 页。',rec:'推荐风格:麦肯锡 / 墨绿 / 暖沙金'},
|
|
348
|
+
{id:'architecture',k:'模式 C · data-mode="architecture"',t:'信息架构图',
|
|
349
|
+
d:'图为王:版心 1600、每页一张全幅主图(分层带/泳道/管线),文字退到图注级。1–3 张图,可省 Agenda。',rec:'推荐风格:石墨 / 商务蓝 / 彩色'}
|
|
350
|
+
];
|
|
351
|
+
|
|
352
|
+
/* ── 风格的「描述性字段」手写(名称/定位/适用/字体);**卡片列表与配色一律取自单源**
|
|
353
|
+
(PRESETS / PRESETS_DARK / STYLE_DATA_COLORS,由 sync_runtime.py 注入)
|
|
354
|
+
——风格集增删时画廊自动跟随,配色不可能与 HTML/PPTX 侧漂移。 ── */
|
|
355
|
+
var STYLE_META=[
|
|
356
|
+
{id:'business-blue',name:'商务蓝',en:'business-blue',d:'专业克制、信息密度高。中性灰阶 + 单一蓝,最通用的商务选择。',s:'技术 / 数据 / 通用商务汇报',
|
|
357
|
+
pfont:"'Google Sans','Roboto','PingFang SC','Microsoft YaHei',sans-serif"},
|
|
358
|
+
{id:'apple-mono',name:'优雅黑白',en:'apple-mono',d:'苹果式极简。大留白、超大字、几乎无彩色,靠排版与留白取胜。',s:'产品发布 / 品牌 / 高管演示',
|
|
359
|
+
pfont:"-apple-system,'SF Pro Display','Helvetica Neue','PingFang SC',sans-serif"},
|
|
360
|
+
{id:'mckinsey',name:'麦肯锡咨询',en:'mckinsey',d:'结构化、正式、咨询范。衬线标题 + 细线框架 + 高密表格。',s:'战略 / 咨询 / 立项 / 对标',
|
|
361
|
+
pfont:"Georgia,'Times New Roman','Songti SC','SimSun',serif",prad:'4px'},
|
|
362
|
+
{id:'brand-red',name:'品牌红',en:'brand-red',d:'以品牌主色红为强调,正式有辨识度。可替换为任意企业品牌色。',s:'企业品牌材料 / 正式汇报 / 对外宣讲',
|
|
363
|
+
pfont:"'HarmonyOS Sans','PingFang SC','Microsoft YaHei',sans-serif"},
|
|
364
|
+
{id:'warm-sand',name:'暖沙金',en:'warm-sand',d:'温暖高级、编辑感/年报感。米白暖底 + 古铜金强调,衬线标题。',s:'年度报告 / 品牌叙事 / 文化建设',
|
|
365
|
+
pfont:"Georgia,'Playfair Display','Songti SC','STSong','SimSun',serif"},
|
|
366
|
+
{id:'deep-teal',name:'墨绿',en:'deep-teal',d:'沉稳、可信赖。冷灰底 + 深青强调。',s:'金融 / 风控 / ESG / 审计',
|
|
367
|
+
pfont:"'Inter','Source Han Sans','PingFang SC','Microsoft YaHei',sans-serif"},
|
|
368
|
+
{id:'graphite-dark',name:'石墨深灰',en:'graphite-dark',
|
|
369
|
+
d:'深色优先的沉浸石墨风:近黑石墨面板 + 亮蓝青强调,默认即深色;浅色变体(中性石墨纸灰 + 同系蓝青)为打印/外发辅助。',s:'产品发布会 / 指挥中心大屏 / 深色优先',
|
|
370
|
+
darkMain:true,das:'#132841',ds2:'#171d24',daon:'#07182b',
|
|
371
|
+
pfont:"'Inter','SF Pro Text','PingFang SC','Microsoft YaHei',sans-serif"},
|
|
372
|
+
{id:'indigo-violet',name:'靛紫',en:'indigo-violet',d:'创新、前沿。冷白底 + 靛紫强调。',s:'AI / 科技 / 研发 / 前沿技术',
|
|
373
|
+
pfont:"'Inter','SF Pro Text','PingFang SC','Microsoft YaHei',sans-serif"},
|
|
374
|
+
{id:'spectrum',name:'光谱彩色',en:'spectrum',
|
|
375
|
+
d:'中性结构 + 5 色数据色板(c1–c5):图表、图例、小段标签出彩,页面骨架安静。强调色 = 主系列色 c1 的深化版(保按钮对比度),彩色只属于数据系列。',s:'数据密集汇报 / 运营复盘 / 大屏看板',
|
|
376
|
+
pfont:"'Inter','SF Pro Text','PingFang SC','Microsoft YaHei',sans-serif"},
|
|
377
|
+
/* ── 新增风格族 ── */
|
|
378
|
+
|
|
379
|
+
];
|
|
380
|
+
|
|
381
|
+
/* 颜色派生:p* = light 预览卡,d* = dark 预览条;全部来自上方注入的 PRESETS / PRESETS_DARK(单源)。
|
|
382
|
+
ps3 / ds3(分块底色)在单源里无同名 token,取当前主题的 line(边框色)近似——画廊只用于挑风格,不参与交付。 */
|
|
383
|
+
var STYLE_META_MAP={}; STYLE_META.forEach(function(m){STYLE_META_MAP[m.id]=m;});
|
|
384
|
+
/* 卡片列表由单源派生(PRESETS 来自 layout-constants.json 注入):风格集变更时画廊自动跟随,
|
|
385
|
+
不再需要两处维护;缺描述时 warn 并降级为最小字段。 */
|
|
386
|
+
var STYLE_IDS=(typeof PRESETS!=='undefined'&&PRESETS)?Object.keys(PRESETS):STYLE_META.map(function(m){return m.id;});
|
|
387
|
+
var STYLES=(function(){
|
|
388
|
+
function hx(x){return '#'+String(x||'').toLowerCase();}
|
|
389
|
+
return STYLE_IDS.map(function(id){
|
|
390
|
+
var m=STYLE_META_MAP[id];
|
|
391
|
+
if(!m){ if(window.console)console.warn('画廊缺少风格描述 STYLE_META: '+id); m={id:id,name:id,en:id,d:'',s:''}; }
|
|
392
|
+
var L=(typeof PRESETS!=='undefined' && PRESETS[id])||{};
|
|
393
|
+
var D=(typeof PRESETS_DARK!=='undefined' && PRESETS_DARK[id])||L;
|
|
394
|
+
var o={}; for(var k in m){if(m.hasOwnProperty(k))o[k]=m[k];}
|
|
395
|
+
o.pa=hx(L.accent); o.paon=hx(L.onAccent); o.pas=hx(L.soft); o.psoft=hx(L.surface);
|
|
396
|
+
o.pbg=hx(L.bg); o.ps3=hx(L.line); o.ptxt=hx(L.ink); o.ptxt2=hx(L.body); o.pbd=hx(L.line);
|
|
397
|
+
o.dbg=hx(D.bg); o.dtxt=hx(D.ink); o.dtxt2=hx(D.faint); o.da=hx(D.accent);
|
|
398
|
+
o.das=hx(D.soft); o.ds2=hx(D.surface); o.ds3=hx(D.line); o.dbd=hx(D.line); o.daon=hx(D.onAccent);
|
|
399
|
+
/* 编码色板:9 套风格各有 c1–c5(单源 STYLE_DATA_COLORS / _DARK;单源存裸 hex,CSS 侧补 #) */
|
|
400
|
+
var C=(typeof STYLE_DATA_COLORS!=='undefined'&&STYLE_DATA_COLORS[id])||null;
|
|
401
|
+
if(C)o.colors=C.map(hx);
|
|
402
|
+
return o;
|
|
403
|
+
});
|
|
404
|
+
})();
|
|
405
|
+
|
|
406
|
+
var MODE_TITLES={
|
|
407
|
+
presentation:'六成企业试点,规模化不足两成',
|
|
408
|
+
research:'试点率与增幅互证:研发域一年内有望反超',
|
|
409
|
+
architecture:'三层解耦:模型、编排、应用'
|
|
410
|
+
};
|
|
411
|
+
|
|
412
|
+
/* 三模式标题字号差异:演示大字疏朗 / 研究密排 / 架构中等——直观传达密度差 */
|
|
413
|
+
var MODE_HSIZE={presentation:'24px',research:'17px',architecture:'20px'};
|
|
414
|
+
|
|
415
|
+
var curMode='presentation';
|
|
416
|
+
var picked={}; /* mode -> styleId */
|
|
417
|
+
|
|
418
|
+
function hbarRow(label,v,max,fill){
|
|
419
|
+
var w=Math.round(v/max*100);
|
|
420
|
+
return '<div class="pv__hrow"><span>'+label+'</span>'+
|
|
421
|
+
'<div class="pv__htrack"><div class="pv__hfill" style="width:'+w+'%'+';background:'+(fill||'var(--pa)')+'"></div></div>'+
|
|
422
|
+
'<div class="pv__hval">'+v+'%</div></div>';
|
|
423
|
+
}
|
|
424
|
+
|
|
425
|
+
/* 编码色板展示行:9 套风格各有 c1–c5(彩色只属于数据系列) */
|
|
426
|
+
function palRow(s){
|
|
427
|
+
if(!s.colors)return '';
|
|
428
|
+
return '<div class="pv__pal">'+s.colors.map(function(c){
|
|
429
|
+
return '<span class="pv__pd" style="background:'+c+'"></span>';}).join('')+
|
|
430
|
+
'<span class="pv__palt">数据色板 c1–c5</span></div>';
|
|
431
|
+
}
|
|
432
|
+
|
|
433
|
+
function pvBody(s,mode){
|
|
434
|
+
var t=MODE_TITLES[mode];
|
|
435
|
+
var bar='<div class="pv__bar"><div class="pv__mark">AI</div><div class="pv__bart">AI 智能体研究</div>'+
|
|
436
|
+
'<div class="pv__barsub"><div class="pv__dot" style="background:var(--pa)"></div>'+
|
|
437
|
+
'<div class="pv__dot" style="background:var(--ps3)"></div>'+
|
|
438
|
+
'<div class="pv__pager">3 / 12</div></div></div>';
|
|
439
|
+
var eyebrow='<div class="pv__eyebrow">'+(mode==='research'?'03 · 域间差异':(mode==='architecture'?'01 · 总体架构':'01 · 范式跃迁'))+'</div>';
|
|
440
|
+
var h='<div class="pv__h" style="font-size:'+MODE_HSIZE[mode]+'">'+t+'</div>';
|
|
441
|
+
var pal=s.colors;
|
|
442
|
+
|
|
443
|
+
if(mode==='presentation'){
|
|
444
|
+
var bars=pal
|
|
445
|
+
?'<div class="pv__bars">'+pal.map(function(c,i){return '<i style="background:'+c+';height:'+(42+i*14)+'%"></i>';}).join('')+'</div>'
|
|
446
|
+
:'<div class="pv__bars"><i style="height:38%"></i><i style="height:55%"></i>'+
|
|
447
|
+
'<i class="a" style="height:78%"></i><i class="a" style="height:100%"></i></div>';
|
|
448
|
+
return bar+eyebrow+h+
|
|
449
|
+
'<div class="pv__metric"><div><b>61%</b><span>企业试点率</span></div>'+
|
|
450
|
+
'<div><b style="color:var(--ptxt)">18%</b><span>规模化占比</span></div></div>'+
|
|
451
|
+
bars+
|
|
452
|
+
'<div class="pv__chips"><span class="pv__chip">试点及以上 61%</span><span class="pv__chip l">观望 39%</span></div>'+
|
|
453
|
+
palRow(s);
|
|
454
|
+
}
|
|
455
|
+
if(mode==='research'){
|
|
456
|
+
return bar+eyebrow+h+
|
|
457
|
+
'<div class="pv__exh"><div class="pv__exhHd"><span class="pv__exhNo">EXHIBIT 1</span>'+
|
|
458
|
+
'<span class="pv__exhT">各业务域试点率对比</span></div>'+
|
|
459
|
+
hbarRow('客服',72,100,pal?pal[0]:null)+hbarRow('财务',57,100,pal?pal[1]:null)+
|
|
460
|
+
hbarRow('营销',48,100,pal?pal[2]:null)+hbarRow('研发',38,100,pal?pal[3]:null)+
|
|
461
|
+
'<div class="pv__src">来源:企业智能体发展调研,2026-08;口径说明一行</div></div>'+
|
|
462
|
+
'<div class="pv__sowhat"><span class="pv__swK">SO WHAT</span>'+
|
|
463
|
+
'<span class="pv__swV">研发域势能最大,工具链补齐后有望反超客服域。</span></div>'+
|
|
464
|
+
'<div class="pv__cols"><p><b>发现。</b>试点率 61%,规模化仅 18%。</p>'+
|
|
465
|
+
'<p><b>证据。</b>37/42 家卡在权限与集成。</p>'+
|
|
466
|
+
'<p><b>含义。</b>瓶颈在治理,不在模型。</p>'+
|
|
467
|
+
'<p><b>推论。</b>平台先行,场景分层放量。</p></div>'+
|
|
468
|
+
palRow(s);
|
|
469
|
+
}
|
|
470
|
+
/* architecture */
|
|
471
|
+
return bar+eyebrow+h+
|
|
472
|
+
'<div class="pv__arch">'+
|
|
473
|
+
'<div class="pv__layer pv__layer--f"><div class="pv__lname">应用层</div>'+
|
|
474
|
+
'<div class="pv__nodes"><div class="pv__node pv__node--a"><div class="pv__nt">智能客服</div><div class="pv__nd">7×24 应答</div></div>'+
|
|
475
|
+
'<div class="pv__node"><div class="pv__nt">研发副驾</div><div class="pv__nd">代码操作</div></div></div></div>'+
|
|
476
|
+
'<div class="pv__layer"><div class="pv__lname">编排层</div>'+
|
|
477
|
+
'<div class="pv__nodes"><div class="pv__node"><div class="pv__nt">任务规划</div><div class="pv__nd">目标拆解</div></div>'+
|
|
478
|
+
'<div class="pv__node"><div class="pv__nt">工具调度</div><div class="pv__nd">千级注册</div></div></div></div>'+
|
|
479
|
+
'<div class="pv__layer"><div class="pv__lname">模型层</div>'+
|
|
480
|
+
'<div class="pv__nodes"><div class="pv__node"><div class="pv__nt">多模型接入</div><div class="pv__nd">按场景路由</div></div>'+
|
|
481
|
+
'<div class="pv__node"><div class="pv__nt">统一网关</div><div class="pv__nd">配额降级</div></div></div></div>'+
|
|
482
|
+
'</div>'+
|
|
483
|
+
'<div class="pv__legend"><span class="pv__chip">建设焦点</span><span class="pv__chip l">已有能力</span></div>'+
|
|
484
|
+
palRow(s);
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
function dkStrip(s,mode){
|
|
488
|
+
var tag=s.darkMain?'浅色辅助变体 · 打印/外发'
|
|
489
|
+
:{presentation:'演示汇报 · 深色',research:'研究报告 · 深色',architecture:'信息架构图 · 深色'}[mode];
|
|
490
|
+
var bars='<div class="dk__bars">'+
|
|
491
|
+
(s.colors
|
|
492
|
+
? s.colors.map(function(c,i){return '<i style="background:'+c+';height:'+(40+i*15)+'%"></i>';}).join('')
|
|
493
|
+
: '<i style="height:45%"></i><i style="height:70%"></i><i class="a" style="height:100%"></i><i class="a" style="height:60%"></i>')+
|
|
494
|
+
'</div>';
|
|
495
|
+
var num=s.darkMain?'深色优先'
|
|
496
|
+
:(mode==='research'?'10.5pt':(mode==='architecture'?'图为王':'17px'));
|
|
497
|
+
return '<div class="dk"><span class="dk__tag">'+tag+'</span>'+
|
|
498
|
+
'<span class="dk__h">'+MODE_TITLES[mode].substring(0,10)+'…</span>'+bars+
|
|
499
|
+
'<span class="dk__num">'+num+'</span></div>';
|
|
500
|
+
}
|
|
501
|
+
|
|
502
|
+
function cardHtml(s,mode){
|
|
503
|
+
/* 主预览 token:darkMain 风格(石墨)用 dark 值渲染,其余用 light */
|
|
504
|
+
var lightVars='--pa:'+s.pa+';--paon:'+s.paon+';--pas:'+s.pas+';--psoft:'+s.psoft+';--pbg:'+s.pbg+
|
|
505
|
+
';--ps3:'+s.ps3+';--ptxt:'+s.ptxt+';--ptxt2:'+s.ptxt2+';--pbd:'+s.pbd+';';
|
|
506
|
+
var darkVars='--pa:'+s.da+';--paon:'+(s.daon||s.paon)+';--pas:'+(s.das||'rgba(128,128,128,.16)')+
|
|
507
|
+
';--psoft:'+(s.ds2||s.ds3)+';--pbg:'+s.dbg+
|
|
508
|
+
';--ps3:'+s.ds3+';--ptxt:'+s.dtxt+';--ptxt2:'+s.dtxt2+';--pbd:'+s.dbd+';';
|
|
509
|
+
var pvVars=(s.darkMain?darkVars:lightVars);
|
|
510
|
+
/* 辅助条 token:darkMain 卡的辅助条展示 light 变体,其余展示 dark */
|
|
511
|
+
var dkLight='--dbg:'+s.pbg+';--dtxt:'+s.ptxt+';--dtxt2:'+s.ptxt2+';--da:'+s.pa+';--ds3:'+s.ps3+';--dbd:'+s.pbd+';';
|
|
512
|
+
var dkDark='--dbg:'+s.dbg+';--dtxt:'+s.dtxt+';--dtxt2:'+s.dtxt2+';--da:'+s.da+';--ds3:'+s.ds3+';--dbd:'+s.dbd+';';
|
|
513
|
+
var dkVars=(s.darkMain?dkLight:dkDark);
|
|
514
|
+
var font=';--pfont:'+s.pfont.replace(/'/g,''')+';'+(s.prad?'--prad:'+s.prad+';':'');
|
|
515
|
+
return '<article class="preset'+(s.darkMain?' dm':'')+'" data-style="'+s.id+'" style="'+pvVars+dkVars+font+'">'+
|
|
516
|
+
'<div class="pv">'+pvBody(s,mode)+'</div>'+dkStrip(s,mode)+
|
|
517
|
+
'<div class="meta"><div class="meta__name"><span class="sw"></span>'+s.name+
|
|
518
|
+
'<span class="meta__en">'+s.en+'</span>'+
|
|
519
|
+
'<span class="meta__pick">选用 '+s.name+'</span></div>'+
|
|
520
|
+
'<div class="meta__d">'+s.d+'</div>'+
|
|
521
|
+
'<div class="meta__s">适用:<b>'+s.s+'</b> · 模式:'+mode+'</div></div></article>';
|
|
522
|
+
}
|
|
523
|
+
|
|
524
|
+
function renderModes(){
|
|
525
|
+
var box=document.getElementById('modes');
|
|
526
|
+
box.innerHTML='';
|
|
527
|
+
MODES.forEach(function(m){
|
|
528
|
+
var b=document.createElement('button');
|
|
529
|
+
b.type='button';b.className='mtab'+(m.id===curMode?' on':'');
|
|
530
|
+
b.innerHTML='<div class="mtab__k">'+m.k+'</div><div class="mtab__t">'+m.t+'</div>'+
|
|
531
|
+
'<div class="mtab__d">'+m.d+'</div><div class="mtab__d" style="margin-top:5px;color:#1a73e8">'+m.rec+'</div>';
|
|
532
|
+
b.addEventListener('click',function(){curMode=m.id;renderModes();renderGrid();});
|
|
533
|
+
box.appendChild(b);
|
|
534
|
+
});
|
|
535
|
+
}
|
|
536
|
+
|
|
537
|
+
function renderGrid(){
|
|
538
|
+
var g=document.getElementById('grid');
|
|
539
|
+
g.innerHTML='';
|
|
540
|
+
STYLES.forEach(function(s){
|
|
541
|
+
var d=document.createElement('div');
|
|
542
|
+
d.innerHTML=cardHtml(s,curMode);
|
|
543
|
+
var el=d.firstChild;
|
|
544
|
+
if(picked[curMode]===s.id)el.classList.add('sel');
|
|
545
|
+
el.addEventListener('click',function(){
|
|
546
|
+
picked[curMode]=s.id;
|
|
547
|
+
g.querySelectorAll('.preset').forEach(function(x){x.classList.remove('sel')});
|
|
548
|
+
el.classList.add('sel');
|
|
549
|
+
console.log('已标记:data-mode="'+curMode+'" + data-style="'+s.id+'"');
|
|
550
|
+
});
|
|
551
|
+
g.appendChild(el);
|
|
552
|
+
});
|
|
553
|
+
}
|
|
554
|
+
|
|
555
|
+
renderModes();
|
|
556
|
+
renderGrid();
|
|
557
|
+
</script>
|
|
558
|
+
</body>
|
|
559
|
+
</html>
|