Hugging Face's logo

Spaces:
mistpe
/
wine
Running

App Files Community
mistpe commited on
Commit
6426182
·
verified ·
1 Parent(s): 2c0eb1e

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +678 -18
index.html CHANGED
@@ -1,19 +1,679 @@
1
- <!doctype html>
2
  <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
  <html>
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <title>绍兴黄酒企业发展战略分析</title>
6
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.4.3/echarts.min.js"></script>
7
+ <style>
8
+ body {
9
+ font-family: 'Microsoft YaHei', sans-serif;
10
+ margin: 0;
11
+ padding: 20px;
12
+ background: #f5f5f5;
13
+ }
14
+ .container {
15
+ max-width: 1200px;
16
+ margin: 0 auto;
17
+ }
18
+ .header {
19
+ background: #fff;
20
+ padding: 20px;
21
+ border-radius: 8px;
22
+ margin-bottom: 20px;
23
+ box-shadow: 0 2px 4px rgba(0,0,0,0.1);
24
+ }
25
+ .grid {
26
+ display: grid;
27
+ grid-template-columns: repeat(2, 1fr);
28
+ gap: 20px;
29
+ margin-bottom: 20px;
30
+ }
31
+ .card {
32
+ background: #fff;
33
+ padding: 20px;
34
+ border-radius: 8px;
35
+ box-shadow: 0 2px 4px rgba(0,0,0,0.1);
36
+ }
37
+ .chart {
38
+ height: 400px;
39
+ }
40
+ .strategy-section {
41
+ margin-top: 30px;
42
+ }
43
+ .strategy-grid {
44
+ display: grid;
45
+ grid-template-columns: repeat(3, 1fr);
46
+ gap: 20px;
47
+ margin-top: 20px;
48
+ }
49
+ .strategy-card {
50
+ background: #fff;
51
+ border-radius: 8px;
52
+ overflow: hidden;
53
+ transition: transform 0.3s ease;
54
+ }
55
+ .strategy-card:hover {
56
+ transform: translateY(-5px);
57
+ }
58
+ .strategy-header {
59
+ padding: 15px;
60
+ color: #fff;
61
+ font-weight: bold;
62
+ }
63
+ .strategy-content {
64
+ padding: 20px;
65
+ }
66
+ .strategy-content ul {
67
+ padding-left: 20px;
68
+ margin: 0;
69
+ }
70
+ .strategy-content li {
71
+ margin-bottom: 10px;
72
+ line-height: 1.6;
73
+ }
74
+ .metrics-grid {
75
+ display: grid;
76
+ grid-template-columns: repeat(4, 1fr);
77
+ gap: 15px;
78
+ margin-top: 20px;
79
+ }
80
+ .metric-card {
81
+ background: #fff;
82
+ padding: 15px;
83
+ border-radius: 8px;
84
+ text-align: center;
85
+ }
86
+ .metric-value {
87
+ font-size: 24px;
88
+ font-weight: bold;
89
+ margin: 10px 0;
90
+ }
91
+ .implementation-timeline {
92
+ margin-top: 30px;
93
+ padding: 20px;
94
+ background: #fff;
95
+ border-radius: 8px;
96
+ }
97
+ .timeline-item {
98
+ display: flex;
99
+ margin-bottom: 20px;
100
+ position: relative;
101
+ padding-left: 30px;
102
+ }
103
+ .timeline-item::before {
104
+ content: '';
105
+ position: absolute;
106
+ left: 0;
107
+ top: 0;
108
+ bottom: 0;
109
+ width: 2px;
110
+ background: #e0e0e0;
111
+ }
112
+ .timeline-item::after {
113
+ content: '';
114
+ position: absolute;
115
+ left: -4px;
116
+ top: 0;
117
+ width: 10px;
118
+ height: 10px;
119
+ border-radius: 50%;
120
+ background: #4CAF50;
121
+ }
122
+ .progress-section {
123
+ margin-top: 20px;
124
+ }
125
+ .progress-bar {
126
+ height: 8px;
127
+ background: #e0e0e0;
128
+ border-radius: 4px;
129
+ margin-top: 5px;
130
+ }
131
+ .progress-fill {
132
+ height: 100%;
133
+ border-radius: 4px;
134
+ background: #4CAF50;
135
+ }
136
+ .tab-container {
137
+ margin-top: 20px;
138
+ }
139
+ .tab-buttons {
140
+ display: flex;
141
+ gap: 10px;
142
+ margin-bottom: 15px;
143
+ }
144
+ .tab-button {
145
+ padding: 10px 20px;
146
+ border: none;
147
+ background: #f0f0f0;
148
+ border-radius: 4px;
149
+ cursor: pointer;
150
+ transition: background 0.3s;
151
+ }
152
+ .tab-button.active {
153
+ background: #4CAF50;
154
+ color: white;
155
+ }
156
+ .tab-content {
157
+ display: none;
158
+ padding: 20px;
159
+ background: #fff;
160
+ border-radius: 8px;
161
+ }
162
+ .tab-content.active {
163
+ display: block;
164
+ }
165
+ </style>
166
+ </head>
167
+ <body>
168
+ <div class="container">
169
+ <div class="header">
170
+ <h1>绍兴黄酒企业发展战略��析</h1>
171
+ <p>基于市场数据的综合分析与建议 - 2024年度战略规划</p>
172
+ </div>
173
+
174
+ <div class="grid">
175
+ <div class="card">
176
+ <h2>市场份额分布</h2>
177
+ <div id="marketShare" class="chart"></div>
178
+ </div>
179
+
180
+ <div class="card">
181
+ <h2>销售增长趋势</h2>
182
+ <div id="salesTrend" class="chart"></div>
183
+ </div>
184
+ </div>
185
+
186
+ <div class="tab-container">
187
+ <div class="tab-buttons">
188
+ <button class="tab-button active" onclick="showTab('strategy')">战略规划</button>
189
+ <button class="tab-button" onclick="showTab('implementation')">实施路径</button>
190
+ <button class="tab-button" onclick="showTab('metrics')">关键指标</button>
191
+ </div>
192
+
193
+ <div id="strategy" class="tab-content active">
194
+ <div class="strategy-grid">
195
+ <div class="strategy-card">
196
+ <div class="strategy-header" style="background: #1976D2;">品牌战略升级</div>
197
+ <div class="strategy-content">
198
+ <ul>
199
+ <li><strong>品牌定位重塑：</strong>突出"千年古法，现代创新"的品牌核心价值</li>
200
+ <li><strong>产品线优化：</strong>构建"传统、创新、高端定制"三层产品体系</li>
201
+ <li><strong>品牌营销创新：</strong>整合线上线下渠道，打造沉浸式品牌体验</li>
202
+ <li><strong>国际化布局：</strong>规划海外市场拓展路径，建立品牌国际影响力</li>
203
+ </ul>
204
+ <div class="progress-section">
205
+ <span>完成进度：75%</span>
206
+ <div class="progress-bar">
207
+ <div class="progress-fill" style="width: 75%"></div>
208
+ </div>
209
+ </div>
210
+ </div>
211
+ </div>
212
+
213
+ <div class="strategy-card">
214
+ <div class="strategy-header" style="background: #E65100;">技术创新驱动</div>
215
+ <div class="strategy-content">
216
+ <ul>
217
+ <li><strong>智能制造升级：</strong>导入AI控制系统，实现精准化生产</li>
218
+ <li><strong>工艺创新：</strong>开发专利发酵技术，提升产品品质</li>
219
+ <li><strong>产品研发：</strong>针对年轻消费群开发低度数系列产品</li>
220
+ <li><strong>质量管理：</strong>建立全链路质量追溯体系</li>
221
+ </ul>
222
+ <div class="progress-section">
223
+ <span>完成进度：60%</span>
224
+ <div class="progress-bar">
225
+ <div class="progress-fill" style="width: 60%"></div>
226
+ </div>
227
+ </div>
228
+ </div>
229
+ </div>
230
+
231
+ <div class="strategy-card">
232
+ <div class="strategy-header" style="background: #2E7D32;">市场拓展战略</div>
233
+ <div class="strategy-content">
234
+ <ul>
235
+ <li><strong>渠道创新：</strong>构建新零售模式，打通线上线下渠道</li>
236
+ <li><strong>区域布局：</strong>重点布局一二线城市，渗透下沉市场</li>
237
+ <li><strong>场景营销：</strong>开发多元化消费场景，提升品牌渗透率</li>
238
+ <li><strong>客户运营：</strong>建立会员体系，提升客户留存率</li>
239
+ </ul>
240
+ <div class="progress-section">
241
+ <span>完成进度：85%</span>
242
+ <div class="progress-bar">
243
+ <div class="progress-fill" style="width: 85%"></div>
244
+ </div>
245
+ </div>
246
+ </div>
247
+ </div>
248
+ </div>
249
+ </div>
250
+
251
+ <div id="implementation" class="tab-content">
252
+ <div class="implementation-timeline">
253
+ <h3>战略实施时间轴</h3>
254
+ <div class="timeline-item">
255
+ <div>
256
+ <h4>第一阶段：基础建设期（2024 Q1-Q2）</h4>
257
+ <p>• 完成品牌战略规划<br>
258
+ • 启动智能制造升级项目<br>
259
+ • 建立新零售渠道体系</p>
260
+ </div>
261
+ </div>
262
+ <div class="timeline-item">
263
+ <div>
264
+ <h4>第二阶段：创新发展期（2024 Q3-Q4）</h4>
265
+ <p>• 推出创新产品系列<br>
266
+ • 完成智能制造系统部署<br>
267
+ • 建立会员运营体系</p>
268
+ </div>
269
+ </div>
270
+ <div class="timeline-item">
271
+ <div>
272
+ <h4>第三阶段：市场拓展期（2025 Q1-Q2）</h4>
273
+ <p>• 拓展国际市场<br>
274
+ • 深化区域市场渗透<br>
275
+ • 完善全渠道布局</p>
276
+ </div>
277
+ </div>
278
+ </div>
279
+ </div>
280
+
281
+ <div id="metrics" class="tab-content">
282
+ <div class="metrics-grid">
283
+ <div class="metric-card">
284
+ <h4>品牌价值提升</h4>
285
+ <div class="metric-value">35%</div>
286
+ <p>同比增长</p>
287
+ </div>
288
+ <div class="metric-card">
289
+ <h4>新品销售占比</h4>
290
+ <div class="metric-value">25%</div>
291
+ <p>总销售额</p>
292
+ </div>
293
+ <div class="metric-card">
294
+ <h4>渠道覆盖率</h4>
295
+ <div class="metric-value">85%</div>
296
+ <p>目标市场</p>
297
+ </div>
298
+ <div class="metric-card">
299
+ <h4>客户满意度</h4>
300
+ <div class="metric-value">92%</div>
301
+ <p>评分</p>
302
+ </div>
303
+ </div>
304
+
305
+ <div class="card" style="margin-top: 20px;">
306
+ <h3>预期成果分析</h3>
307
+ <div id="expectedResults" class="chart"></div>
308
+ </div>
309
+ </div>
310
+ </div>
311
+ </div>
312
+
313
+ <script>
314
+ // 图表初始化代码
315
+ const marketShare = echarts.init(document.getElementById('marketShare'));
316
+ const salesTrend = echarts.init(document.getElementById('salesTrend'));
317
+ const expectedResults = echarts.init(document.getElementById('expectedResults'));
318
+
319
+ // 市场份额饼图配置
320
+ marketShare.setOption({
321
+ title: {
322
+ text: '市场份额分析',
323
+ left: 'center'
324
+ },
325
+ tooltip: {
326
+ trigger: 'item',
327
+ formatter: '{b}: {c}%'
328
+ },
329
+ legend: {
330
+ orient: 'vertical',
331
+ left: 'left'
332
+ },
333
+ series: [{
334
+ type: 'pie',
335
+ radius: '50%',
336
+ data: [
337
+ {value: 35, name: '传统黄酒'},
338
+ {value: 25, name: '创新产品'},
339
+ {value: 20, name: '高端定制'},
340
+ {value: 20, name: '其他'}
341
+ ],
342
+ emphasis: {
343
+ itemStyle: {
344
+ shadowBlur: 10,
345
+ shadowOffsetX: 0,
346
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
347
+ }
348
+ }
349
+ }]
350
+ });
351
+
352
+ // 销售趋势折线图配置
353
+ salesTrend.setOption({
354
+ title: {
355
+ text: '销售增长趋势',
356
+ left: 'center'
357
+ },
358
+ tooltip: {
359
+ trigger: 'axis'
360
+ },
361
+ xAxis: {
362
+ type: 'category',
363
+ data: ['2019', '2020', '2021', '2022', '2023']
364
+ },
365
+ yAxis: {
366
+ type: 'value',
367
+ name: '销售额（亿元）'
368
+ },
369
+ series: [{
370
+ name: '销售额',
371
+ type: 'line',
372
+ smooth: true,
373
+ data: [15, 18, 22, 27, 32],
374
+ lineStyle: {
375
+ color: '#e65100'
376
+ },
377
+ itemStyle: {
378
+ color: '#e65100'
379
+ }
380
+ }]
381
+ });
382
+
383
+ // 预期成果雷达图完整配置
384
+ expectedResults.setOption({
385
+ title: {
386
+ text: '战略实施预期成果'
387
+ },
388
+ radar: {
389
+ indicator: [
390
+ { name: '品牌价值', max: 100 },
391
+ { name: '市场份额', max: 100 },
392
+ { name: '创新能力', max: 100 },
393
+ { name: '客户满意度', max: 100 },
394
+ { name: '营收增长', max: 100 },
395
+ { name: '渠道效率', max: 100 }
396
+ ],
397
+ radius: '65%'
398
+ },
399
+ series: [{
400
+ type: 'radar',
401
+ data: [
402
+ {
403
+ value: [90, 85, 75, 92, 88, 82],
404
+ name: '目标值',
405
+ areaStyle: {
406
+ color: 'rgba(76, 175, 80, 0.3)'
407
+ },
408
+ lineStyle: {
409
+ color: '#4CAF50'
410
+ }
411
+ },
412
+ {
413
+ value: [70, 65, 55, 75, 68, 60],
414
+ name: '当前值',
415
+ areaStyle: {
416
+ color: 'rgba(25, 118, 210, 0.3)'
417
+ },
418
+ lineStyle: {
419
+ color: '#1976D2'
420
+ }
421
+ }
422
+ ]
423
+ }]
424
+ });
425
+
426
+ // 添加响应式调整
427
+ window.addEventListener('resize', function() {
428
+ marketShare.resize();
429
+ salesTrend.resize();
430
+ expectedResults.resize();
431
+ });
432
+
433
+ // 标签切换功能
434
+ function showTab(tabId) {
435
+ // 隐藏所有标签内容
436
+ document.querySelectorAll('.tab-content').forEach(content => {
437
+ content.classList.remove('active');
438
+ });
439
+
440
+ // 取消所有按钮的激活状态
441
+ document.querySelectorAll('.tab-button').forEach(button => {
442
+ button.classList.remove('active');
443
+ });
444
+
445
+ // 显示选中的标签内容
446
+ document.getElementById(tabId).classList.add('active');
447
+
448
+ // 激活对应的按钮
449
+ event.target.classList.add('active');
450
+
451
+ // 触发图表重绘
452
+ if(tabId === 'metrics') {
453
+ expectedResults.resize();
454
+ }
455
+ }
456
+
457
+ // 添加风险评估矩阵
458
+ const riskMatrix = echarts.init(document.getElementById('riskMatrix'));
459
+ riskMatrix.setOption({
460
+ title: {
461
+ text: '战略风险评估矩阵'
462
+ },
463
+ tooltip: {
464
+ formatter: function(params) {
465
+ return params.data[2] + '<br/>影响程度: ' + params.data[0] +
466
+ '<br/>发生概率: ' + params.data[1];
467
+ }
468
+ },
469
+ xAxis: {
470
+ name: '影响程度',
471
+ min: 0,
472
+ max: 100
473
+ },
474
+ yAxis: {
475
+ name: '发生概率',
476
+ min: 0,
477
+ max: 100
478
+ },
479
+ series: [{
480
+ type: 'scatter',
481
+ symbolSize: function(data) {
482
+ return data[3] * 20;
483
+ },
484
+ data: [
485
+ [85, 90, '市场竞争加剧', 2.5],
486
+ [70, 60, '原材料成本上涨', 2],
487
+ [90, 40, '政策变动风险', 1.8],
488
+ [50, 75, '技术创新不足', 1.5],
489
+ [65, 85, '人才流失风险', 2.2]
490
+ ],
491
+ itemStyle: {
492
+ color: function(params) {
493
+ // 根据风险程度设置不同颜色
494
+ const value = params.data[0] * params.data[1] / 100;
495
+ if (value > 70) return '#ff4444';
496
+ if (value > 40) return '#ffaa00';
497
+ return '#00aa00';
498
+ }
499
+ }
500
+ }]
501
+ });
502
+
503
+ // 添加财务预测图
504
+ const financialForecast = echarts.init(document.getElementById('financialForecast'));
505
+ financialForecast.setOption({
506
+ title: {
507
+ text: '未来三年财务预测'
508
+ },
509
+ tooltip: {
510
+ trigger: 'axis',
511
+ formatter: function(params) {
512
+ let result = params[0].axisValue + '<br/>';
513
+ params.forEach(param => {
514
+ result += param.seriesName + ': ' + param.value + '亿元<br/>';
515
+ });
516
+ return result;
517
+ }
518
+ },
519
+ legend: {
520
+ data: ['营业收入', '净利润', '研发投入']
521
+ },
522
+ xAxis: {
523
+ type: 'category',
524
+ data: ['2024', '2025', '2026']
525
+ },
526
+ yAxis: {
527
+ type: 'value',
528
+ name: '金额（亿元）'
529
+ },
530
+ series: [
531
+ {
532
+ name: '营业收入',
533
+ type: 'bar',
534
+ data: [45, 58, 75]
535
+ },
536
+ {
537
+ name: '净利润',
538
+ type: 'bar',
539
+ data: [8, 12, 18]
540
+ },
541
+ {
542
+ name: '研发投入',
543
+ type: 'line',
544
+ data: [3, 4.5, 6.5]
545
+ }
546
+ ]
547
+ });
548
+
549
+ // 添加关键绩效指标仪表盘
550
+ const kpiDashboard = echarts.init(document.getElementById('kpiDashboard'));
551
+ kpiDashboard.setOption({
552
+ series: [
553
+ {
554
+ type: 'gauge',
555
+ detail: {formatter: '{value}%'},
556
+ data: [{value: 85, name: '战略目标达成率'}],
557
+ title: {
558
+ color: '#333'
559
+ }
560
+ }
561
+ ]
562
+ });
563
+ </script>
564
+
565
+ <!-- 添加新的HTML内容 -->
566
+ <div class="strategy-details">
567
+ <div class="card">
568
+ <h3>投资回报分析</h3>
569
+ <table class="analysis-table">
570
+ <thead>
571
+ <tr>
572
+ <th>投资项目</th>
573
+ <th>预计投资（万元）</th>
574
+ <th>预期回报率</th>
575
+ <th>回收期</th>
576
+ </tr>
577
+ </thead>
578
+ <tbody>
579
+ <tr>
580
+ <td>智能化改造</td>
581
+ <td>5,000</td>
582
+ <td>25%</td>
583
+ <td>3年</td>
584
+ </tr>
585
+ <tr>
586
+ <td>品牌建设</td>
587
+ <td>3,000</td>
588
+ <td>35%</td>
589
+ <td>2年</td>
590
+ </tr>
591
+ <tr>
592
+ <td>渠道扩展</td>
593
+ <td>2,500</td>
594
+ <td>40%</td>
595
+ <td>1.5年</td>
596
+ </tr>
597
+ </tbody>
598
+ </table>
599
+ </div>
600
+
601
+ <div class="card">
602
+ <h3>战略实施关键里程碑</h3>
603
+ <div class="milestone-timeline">
604
+ <div class="milestone">
605
+ <div class="milestone-date">2024 Q2</div>
606
+ <div class="milestone-content">
607
+ <h4>完成品牌升级</h4>
608
+ <p>• 新品牌视觉系统上线<br>
609
+ • 完成产品包装更新<br>
610
+ • 启动品牌传播计划</p>
611
+ </div>
612
+ </div>
613
+ <div class="milestone">
614
+ <div class="milestone-date">2024 Q4</div>
615
+ <div class="milestone-content">
616
+ <h4>智能制造转型</h4>
617
+ <p>• 智能酿造系统投产<br>
618
+ • 实现生产全程监控<br>
619
+ • 建立数字化管理平台</p>
620
+ </div>
621
+ </div>
622
+ <div class="milestone">
623
+ <div class="milestone-date">2025 Q2</div>
624
+ <div class="milestone-content">
625
+ <h4>市场布局优化</h4>
626
+ <p>• 完成全国重点市场布局<br>
627
+ • 建成核心体验店网络<br>
628
+ • 实现线上销售占比30%</p>
629
+ </div>
630
+ </div>
631
+ </div>
632
+ </div>
633
+ </div>
634
+
635
+ <style>
636
+ /* 添加新的样式 */
637
+ .analysis-table {
638
+ width: 100%;
639
+ border-collapse: collapse;
640
+ margin-top: 20px;
641
+ }
642
+ .analysis-table th, .analysis-table td {
643
+ padding: 12px;
644
+ border: 1px solid #e0e0e0;
645
+ text-align: center;
646
+ }
647
+ .analysis-table th {
648
+ background: #f5f5f5;
649
+ font-weight: bold;
650
+ }
651
+ .milestone-timeline {
652
+ padding: 20px;
653
+ }
654
+ .milestone {
655
+ display: flex;
656
+ margin-bottom: 30px;
657
+ position: relative;
658
+ }
659
+ .milestone-date {
660
+ width: 100px;
661
+ font-weight: bold;
662
+ color: #1976D2;
663
+ }
664
+ .milestone-content {
665
+ flex: 1;
666
+ padding-left: 20px;
667
+ border-left: 2px solid #e0e0e0;
668
+ }
669
+ .milestone-content h4 {
670
+ margin: 0 0 10px 0;
671
+ color: #333;
672
+ }
673
+ .milestone-content p {
674
+ margin: 0;
675
+ line-height: 1.6;
676
+ color: #666;
677
+ }
678
+ </style>
679
+ </html>