Files
Agent-n8n/web_frontend/web_result/pages/risk.html
Yep_Q 2b1ed656cd feat: 优化会展网站首页用户体验和视觉效果
主要改进:
- 修复星形图标可见性问题,改为黄色高对比度显示
- 移除'立即参展'按钮,清理冗余CTA元素
- 修正背景图片路径并优化透明度(opacity-10)
- 为所有容器区域添加hover提示文字
- 删除'立即参与,共创绿色出行未来'整个CTA区块
- 优化页面加载器和图片错误处理
- 修复展会信息卡片文字对比度问题
- 增强多层背景遮罩效果

影响文件:
- web_frontend/web_result/index.html
- web_frontend/web_result/css/animations.css
- web_frontend/web_result/js/main.js
- 新增多个页面和样式文件

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
2025-09-08 14:05:26 +08:00

634 lines
37 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>风险评估 - 2024长三角国际新能源汽车展</title>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<style>
* {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.nav-link {
position: relative;
transition: color 0.3s ease;
}
.nav-link::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 0;
height: 2px;
background: #667eea;
transition: width 0.3s ease;
}
.nav-link:hover::after,
.nav-link.active::after {
width: 100%;
}
.risk-card {
transition: all 0.3s ease;
}
.risk-card:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}
.risk-level-high {
border-left: 4px solid #ef4444;
}
.risk-level-medium {
border-left: 4px solid #f59e0b;
}
.risk-level-low {
border-left: 4px solid #10b981;
}
.radar-chart {
width: 300px;
height: 300px;
position: relative;
}
.radar-chart::before {
content: '';
position: absolute;
inset: 0;
background: conic-gradient(from 0deg, #ef4444 0deg 72deg, #f59e0b 72deg 144deg, #3b82f6 144deg 216deg, #10b981 216deg 288deg, #8b5cf6 288deg 360deg);
border-radius: 50%;
opacity: 0.3;
animation: rotate 20s linear infinite;
}
@keyframes rotate {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
.alert-pulse {
animation: alertPulse 2s infinite;
}
@keyframes alertPulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.6; }
}
</style>
</head>
<body class="bg-gray-50">
<!-- Navigation -->
<nav class="fixed top-0 w-full bg-white shadow-md z-50">
<div class="container mx-auto px-6 py-4">
<div class="flex items-center justify-between">
<div class="flex items-center">
<svg class="w-8 h-8 mr-3 text-purple-600" fill="currentColor" viewBox="0 0 20 20">
<path d="M10 2a8 8 0 100 16 8 8 0 000-16zm1 11H9v-2h2v2zm0-4H9V5h2v4z"/>
</svg>
<span class="text-xl font-bold text-gray-800">Green Mobility 2024</span>
</div>
<div class="hidden md:flex space-x-8">
<a href="../index.html" class="nav-link text-gray-700 hover:text-purple-600">首页</a>
<a href="overview.html" class="nav-link text-gray-700 hover:text-purple-600">策划概述</a>
<a href="exhibition.html" class="nav-link text-gray-700 hover:text-purple-600">展会介绍</a>
<a href="marketing.html" class="nav-link text-gray-700 hover:text-purple-600">营销方案</a>
<a href="operation.html" class="nav-link text-gray-700 hover:text-purple-600">现场运营</a>
<a href="budget.html" class="nav-link text-gray-700 hover:text-purple-600">预算分析</a>
<a href="risk.html" class="nav-link active text-gray-700 hover:text-purple-600">风险评估</a>
</div>
</div>
</div>
</nav>
<!-- Page Header -->
<section class="bg-gradient-to-r from-red-600 to-orange-600 text-white pt-24 pb-12">
<div class="container mx-auto px-6">
<h1 class="text-4xl md:text-5xl font-bold mb-4">风险评估与应急预案</h1>
<p class="text-xl opacity-90">全面识别风险,制定应对策略,确保展会安全顺利</p>
</div>
</section>
<!-- Risk Overview -->
<section class="py-16 bg-white">
<div class="container mx-auto px-6">
<div class="text-center mb-12">
<h2 class="text-3xl font-bold text-gray-800 mb-4">风险评估总览</h2>
<p class="text-gray-600">识别潜在风险,评估影响程度,制定防控措施</p>
</div>
<!-- Risk Level Distribution -->
<div class="max-w-4xl mx-auto mb-12">
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div class="bg-red-50 border-2 border-red-200 rounded-xl p-6 text-center">
<div class="w-16 h-16 bg-red-500 text-white rounded-full flex items-center justify-center mx-auto mb-3">
<span class="text-2xl font-bold">3</span>
</div>
<h3 class="text-lg font-bold text-red-600 mb-1">高风险</h3>
<p class="text-sm text-gray-600">需重点关注防控</p>
</div>
<div class="bg-yellow-50 border-2 border-yellow-200 rounded-xl p-6 text-center">
<div class="w-16 h-16 bg-yellow-500 text-white rounded-full flex items-center justify-center mx-auto mb-3">
<span class="text-2xl font-bold">5</span>
</div>
<h3 class="text-lg font-bold text-yellow-600 mb-1">中风险</h3>
<p class="text-sm text-gray-600">制定应对措施</p>
</div>
<div class="bg-green-50 border-2 border-green-200 rounded-xl p-6 text-center">
<div class="w-16 h-16 bg-green-500 text-white rounded-full flex items-center justify-center mx-auto mb-3">
<span class="text-2xl font-bold">4</span>
</div>
<h3 class="text-lg font-bold text-green-600 mb-1">低风险</h3>
<p class="text-sm text-gray-600">常规监控管理</p>
</div>
</div>
</div>
<!-- Risk Matrix -->
<div class="max-w-5xl mx-auto">
<div class="bg-gray-50 rounded-2xl p-8">
<h3 class="text-2xl font-bold mb-6 text-center">风险矩阵分析</h3>
<div class="grid grid-cols-3 gap-4">
<div class="text-center">
<div class="font-semibold text-gray-700 mb-2">低概率</div>
<div class="space-y-2">
<div class="bg-yellow-100 rounded p-2 text-sm">疫情反复</div>
<div class="bg-green-100 rounded p-2 text-sm">技术故障</div>
</div>
</div>
<div class="text-center">
<div class="font-semibold text-gray-700 mb-2">中概率</div>
<div class="space-y-2">
<div class="bg-yellow-100 rounded p-2 text-sm">参展商不足</div>
<div class="bg-orange-100 rounded p-2 text-sm">恶劣天气</div>
</div>
</div>
<div class="text-center">
<div class="font-semibold text-gray-700 mb-2">高概率</div>
<div class="space-y-2">
<div class="bg-red-100 rounded p-2 text-sm">市场竞争</div>
<div class="bg-yellow-100 rounded p-2 text-sm">观众流量</div>
</div>
</div>
</div>
<div class="mt-6 pt-6 border-t flex justify-center space-x-8 text-sm">
<div class="flex items-center">
<div class="w-4 h-4 bg-green-200 rounded mr-2"></div>
<span>低影响</span>
</div>
<div class="flex items-center">
<div class="w-4 h-4 bg-yellow-200 rounded mr-2"></div>
<span>中影响</span>
</div>
<div class="flex items-center">
<div class="w-4 h-4 bg-red-200 rounded mr-2"></div>
<span>高影响</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Market Risk -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center text-gray-800 mb-12">市场风险分析</h2>
<div class="max-w-6xl mx-auto">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
<!-- Risk Factors -->
<div>
<div class="bg-white rounded-xl shadow-lg p-6 risk-card risk-level-high">
<div class="flex items-center mb-4">
<div class="w-12 h-12 bg-red-100 rounded-lg flex items-center justify-center mr-4">
<svg class="w-6 h-6 text-red-600" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7 4a1 1 0 11-2 0 1 1 0 012 0zm-1-9a1 1 0 00-1 1v4a1 1 0 102 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/>
</svg>
</div>
<div>
<h3 class="text-lg font-bold">行业政策变化</h3>
<span class="text-xs bg-red-100 text-red-600 px-2 py-1 rounded">高风险</span>
</div>
</div>
<div class="space-y-3">
<div class="bg-gray-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">风险描述</h4>
<p class="text-sm text-gray-600">新能源汽车补贴政策调整,可能影响企业参展意愿</p>
</div>
<div class="bg-blue-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">应对措施</h4>
<ul class="text-sm text-gray-600 space-y-1">
<li>• 密切关注政策动向</li>
<li>• 调整展会定位和宣传策略</li>
<li>• 增加政策解读论坛</li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="bg-white rounded-xl shadow-lg p-6 risk-card risk-level-medium">
<div class="flex items-center mb-4">
<div class="w-12 h-12 bg-yellow-100 rounded-lg flex items-center justify-center mr-4">
<svg class="w-6 h-6 text-yellow-600" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/>
</svg>
</div>
<div>
<h3 class="text-lg font-bold">市场竞争加剧</h3>
<span class="text-xs bg-yellow-100 text-yellow-600 px-2 py-1 rounded">中风险</span>
</div>
</div>
<div class="space-y-3">
<div class="bg-gray-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">风险描述</h4>
<p class="text-sm text-gray-600">同期其他展会竞争,分流参展商和观众资源</p>
</div>
<div class="bg-blue-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">应对措施</h4>
<ul class="text-sm text-gray-600 space-y-1">
<li>• 差异化定位,突出特色</li>
<li>• 提升展会品质和服务</li>
<li>• 加强营销推广力度</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Operational Risk -->
<section class="py-16 bg-white">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center text-gray-800 mb-12">运营风险管控</h2>
<div class="max-w-6xl mx-auto">
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<!-- Exhibitor Risk -->
<div class="bg-white border-2 border-gray-200 rounded-xl p-6 hover:border-blue-500 transition">
<div class="w-14 h-14 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
<svg class="w-7 h-7 text-blue-600" fill="currentColor" viewBox="0 0 20 20">
<path d="M9 2a1 1 0 000 2h2a1 1 0 100-2H9z"/>
<path fill-rule="evenodd" d="M4 5a2 2 0 012-2 1 1 0 000 2H6a2 2 0 100 4h2a2 2 0 100-4h-.5a1 1 0 000-2H8a2 2 0 00-2 2v10a2 2 0 002 2h8a2 2 0 002-2V5a2 2 0 00-2-2h-5.5z" clip-rule="evenodd"/>
</svg>
</div>
<h3 class="text-lg font-bold text-center mb-3">参展商管理风险</h3>
<div class="space-y-2 text-sm">
<div class="flex justify-between py-2 border-b">
<span class="text-gray-600">招展不足</span>
<span class="text-yellow-600 font-semibold"></span>
</div>
<div class="flex justify-between py-2 border-b">
<span class="text-gray-600">临时退展</span>
<span class="text-green-600 font-semibold"></span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-600">款项拖欠</span>
<span class="text-yellow-600 font-semibold"></span>
</div>
</div>
<div class="mt-4 pt-4 border-t">
<p class="text-xs text-gray-500">预防措施:签订合同、收取定金、建立黑名单</p>
</div>
</div>
<!-- Audience Risk -->
<div class="bg-white border-2 border-gray-200 rounded-xl p-6 hover:border-green-500 transition">
<div class="w-14 h-14 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
<svg class="w-7 h-7 text-green-600" fill="currentColor" viewBox="0 0 20 20">
<path d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"/>
</svg>
</div>
<h3 class="text-lg font-bold text-center mb-3">观众组织风险</h3>
<div class="space-y-2 text-sm">
<div class="flex justify-between py-2 border-b">
<span class="text-gray-600">人数不足</span>
<span class="text-yellow-600 font-semibold"></span>
</div>
<div class="flex justify-between py-2 border-b">
<span class="text-gray-600">质量不高</span>
<span class="text-green-600 font-semibold"></span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-600">现场拥堵</span>
<span class="text-yellow-600 font-semibold"></span>
</div>
</div>
<div class="mt-4 pt-4 border-t">
<p class="text-xs text-gray-500">预防措施:多渠道推广、预登记系统、分时入场</p>
</div>
</div>
<!-- Service Risk -->
<div class="bg-white border-2 border-gray-200 rounded-xl p-6 hover:border-purple-500 transition">
<div class="w-14 h-14 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4">
<svg class="w-7 h-7 text-purple-600" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z" clip-rule="evenodd"/>
</svg>
</div>
<h3 class="text-lg font-bold text-center mb-3">服务质量风险</h3>
<div class="space-y-2 text-sm">
<div class="flex justify-between py-2 border-b">
<span class="text-gray-600">服务投诉</span>
<span class="text-green-600 font-semibold"></span>
</div>
<div class="flex justify-between py-2 border-b">
<span class="text-gray-600">设备故障</span>
<span class="text-yellow-600 font-semibold"></span>
</div>
<div class="flex justify-between py-2">
<span class="text-gray-600">人员不足</span>
<span class="text-green-600 font-semibold"></span>
</div>
</div>
<div class="mt-4 pt-4 border-t">
<p class="text-xs text-gray-500">预防措施:培训上岗、设备检修、人员储备</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Safety Risk -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center text-gray-800 mb-12">安全风险防控</h2>
<div class="max-w-5xl mx-auto">
<div class="bg-white rounded-2xl shadow-lg p-8">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
<!-- Fire Safety -->
<div class="border-2 border-red-200 rounded-xl p-6 alert-pulse">
<div class="flex items-center mb-4">
<div class="w-10 h-10 bg-red-500 text-white rounded-lg flex items-center justify-center mr-3">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M12.395 2.553a1 1 0 00-1.45-.385c-.345.23-.614.558-.822.88-.214.33-.403.713-.57 1.116-.334.804-.614 1.768-.84 2.734a31.365 31.365 0 00-.613 3.58 2.64 2.64 0 01-.945-1.067c-.328-.68-.398-1.534-.398-2.654A1 1 0 005.05 6.05 6.981 6.981 0 003 11a7 7 0 1011.95-4.95c-.592-.591-.98-.985-1.348-1.467-.363-.476-.724-1.063-1.207-2.03zM12.12 15.12A3 3 0 017 13s.879.5 2.5.5c0-1 .5-4 1.25-4.5.5 1 .786 1.293 1.371 1.879A2.99 2.99 0 0113 13a2.99 2.99 0 01-.879 2.121z" clip-rule="evenodd"/>
</svg>
</div>
<h3 class="text-lg font-bold">消防安全</h3>
</div>
<div class="space-y-3">
<div class="bg-red-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">重点防控</h4>
<ul class="text-xs text-gray-600 space-y-1">
<li>• 展台搭建材料防火等级</li>
<li>• 电气线路安全检查</li>
<li>• 消防通道保持畅通</li>
</ul>
</div>
<div class="bg-gray-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">应急措施</h4>
<ul class="text-xs text-gray-600 space-y-1">
<li>• 消防器材配备齐全</li>
<li>• 专业消防队伍值守</li>
<li>• 定期消防演练</li>
</ul>
</div>
</div>
</div>
<!-- Personnel Safety -->
<div class="border-2 border-blue-200 rounded-xl p-6">
<div class="flex items-center mb-4">
<div class="w-10 h-10 bg-blue-500 text-white rounded-lg flex items-center justify-center mr-3">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M2.166 4.999A11.954 11.954 0 0010 1.944 11.954 11.954 0 0017.834 5c.11.65.166 1.32.166 2.001 0 5.225-3.34 9.67-8 11.317C5.34 16.67 2 12.225 2 7c0-.682.057-1.35.166-2.001zm11.541 3.708a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/>
</svg>
</div>
<h3 class="text-lg font-bold">人员安全</h3>
</div>
<div class="space-y-3">
<div class="bg-blue-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">安保措施</h4>
<ul class="text-xs text-gray-600 space-y-1">
<li>• 专业安保团队100人</li>
<li>• 安检设备全覆盖</li>
<li>• 实名制入场管理</li>
</ul>
</div>
<div class="bg-gray-50 rounded-lg p-3">
<h4 class="font-semibold text-sm mb-1">应急处置</h4>
<ul class="text-xs text-gray-600 space-y-1">
<li>• 医疗急救点5个</li>
<li>• 应急疏散预案</li>
<li>• 警务室现场值守</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Emergency Contact -->
<div class="mt-8 bg-gradient-to-r from-red-50 to-orange-50 rounded-xl p-6">
<h3 class="text-lg font-bold mb-4 text-red-600">应急联系方式</h3>
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 text-sm">
<div>
<p class="font-semibold">消防急救</p>
<p class="text-red-600 text-lg">119</p>
</div>
<div>
<p class="font-semibold">医疗急救</p>
<p class="text-red-600 text-lg">120</p>
</div>
<div>
<p class="font-semibold">公安报警</p>
<p class="text-red-600 text-lg">110</p>
</div>
<div>
<p class="font-semibold">现场指挥</p>
<p class="text-red-600 text-lg">138****8888</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Force Majeure -->
<section class="py-16 bg-white">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center text-gray-800 mb-12">不可抗力应对</h2>
<div class="max-w-5xl mx-auto">
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- Pandemic Response -->
<div class="bg-gradient-to-br from-purple-50 to-pink-50 rounded-2xl p-8">
<div class="flex items-center mb-6">
<div class="w-12 h-12 bg-purple-600 text-white rounded-full flex items-center justify-center mr-4">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20">
<path d="M10 2a6 6 0 00-6 6v3.586l-.707.707A1 1 0 004 14h12a1 1 0 00.707-1.707L16 11.586V8a6 6 0 00-6-6zM10 18a3 3 0 01-3-3h6a3 3 0 01-3 3z"/>
</svg>
</div>
<h3 class="text-xl font-bold">疫情防控预案</h3>
</div>
<div class="space-y-4">
<div class="bg-white rounded-lg p-4">
<h4 class="font-semibold mb-2">预防措施</h4>
<ul class="text-sm text-gray-600 space-y-1">
<li>• 健康码查验系统</li>
<li>• 体温检测设备</li>
<li>• 场馆定时消毒</li>
<li>• 人流密度控制</li>
</ul>
</div>
<div class="bg-white rounded-lg p-4">
<h4 class="font-semibold mb-2">应急方案</h4>
<ul class="text-sm text-gray-600 space-y-1">
<li>• 线上线下融合办展</li>
<li>• VR云展厅备选</li>
<li>• 延期/取消保险</li>
<li>• 退款机制完善</li>
</ul>
</div>
</div>
</div>
<!-- Weather Response -->
<div class="bg-gradient-to-br from-blue-50 to-cyan-50 rounded-2xl p-8">
<div class="flex items-center mb-6">
<div class="w-12 h-12 bg-blue-600 text-white rounded-full flex items-center justify-center mr-4">
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.05 3.636a1 1 0 010 1.414 7 7 0 000 9.9 1 1 0 11-1.414 1.414 9 9 0 010-12.728 1 1 0 011.414 0zm9.9 0a1 1 0 011.414 0 9 9 0 010 12.728 1 1 0 11-1.414-1.414 7 7 0 000-9.9 1 1 0 010-1.414zM7.879 6.464a1 1 0 010 1.414 3 3 0 000 4.243 1 1 0 11-1.415 1.414 5 5 0 010-7.07 1 1 0 011.415 0zm4.242 0a1 1 0 011.415 0 5 5 0 010 7.072 1 1 0 01-1.415-1.415 3 3 0 000-4.242 1 1 0 010-1.415zM10 9a1 1 0 011 1v.01a1 1 0 11-2 0V10a1 1 0 011-1z" clip-rule="evenodd"/>
</svg>
</div>
<h3 class="text-xl font-bold">恶劣天气应对</h3>
</div>
<div class="space-y-4">
<div class="bg-white rounded-lg p-4">
<h4 class="font-semibold mb-2">监测预警</h4>
<ul class="text-sm text-gray-600 space-y-1">
<li>• 天气预报实时监控</li>
<li>• 气象部门联动</li>
<li>• 提前72小时预警</li>
<li>• 多渠道信息发布</li>
</ul>
</div>
<div class="bg-white rounded-lg p-4">
<h4 class="font-semibold mb-2">应对措施</h4>
<ul class="text-sm text-gray-600 space-y-1">
<li>• 室外活动调整方案</li>
<li>• 交通疏导预案</li>
<li>• 展品保护措施</li>
<li>• 参展商损失补偿</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Emergency Plan Summary -->
<section class="py-16 bg-gray-50">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center text-gray-800 mb-12">应急预案体系</h2>
<div class="max-w-6xl mx-auto">
<div class="bg-white rounded-2xl shadow-lg p-8">
<!-- Emergency Command Structure -->
<div class="mb-8">
<h3 class="text-2xl font-bold mb-6 text-center">应急指挥体系</h3>
<div class="bg-gradient-to-r from-blue-50 to-purple-50 rounded-xl p-6">
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 text-center">
<div>
<div class="w-20 h-20 bg-red-500 text-white rounded-full flex items-center justify-center mx-auto mb-3">
<span class="text-2xl font-bold"></span>
</div>
<h4 class="font-bold mb-2">总指挥</h4>
<p class="text-sm text-gray-600">统筹全局决策</p>
</div>
<div>
<div class="w-20 h-20 bg-orange-500 text-white rounded-full flex items-center justify-center mx-auto mb-3">
<span class="text-2xl font-bold"></span>
</div>
<h4 class="font-bold mb-2">副总指挥</h4>
<p class="text-sm text-gray-600">协调各部门行动</p>
</div>
<div>
<div class="w-20 h-20 bg-yellow-500 text-white rounded-full flex items-center justify-center mx-auto mb-3">
<span class="text-2xl font-bold"></span>
</div>
<h4 class="font-bold mb-2">应急小组</h4>
<p class="text-sm text-gray-600">具体执行处置</p>
</div>
</div>
</div>
</div>
<!-- Response Procedures -->
<div>
<h3 class="text-xl font-bold mb-4">应急响应流程</h3>
<div class="space-y-3">
<div class="flex items-center">
<div class="w-8 h-8 bg-blue-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4">1</div>
<div class="flex-1 bg-blue-50 rounded-lg p-3">
<h4 class="font-semibold">事件发生</h4>
<p class="text-sm text-gray-600">现场人员立即上报,启动应急响应</p>
</div>
</div>
<div class="flex items-center">
<div class="w-8 h-8 bg-green-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4">2</div>
<div class="flex-1 bg-green-50 rounded-lg p-3">
<h4 class="font-semibold">评估判断</h4>
<p class="text-sm text-gray-600">快速评估事件等级,确定响应级别</p>
</div>
</div>
<div class="flex items-center">
<div class="w-8 h-8 bg-yellow-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4">3</div>
<div class="flex-1 bg-yellow-50 rounded-lg p-3">
<h4 class="font-semibold">应急处置</h4>
<p class="text-sm text-gray-600">按预案执行处置,保障人员安全</p>
</div>
</div>
<div class="flex items-center">
<div class="w-8 h-8 bg-purple-600 text-white rounded-full flex items-center justify-center flex-shrink-0 mr-4">4</div>
<div class="flex-1 bg-purple-50 rounded-lg p-3">
<h4 class="font-semibold">善后恢复</h4>
<p class="text-sm text-gray-600">事件处理完毕,恢复正常运营</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Risk Summary -->
<section class="py-16 bg-gradient-to-r from-red-600 to-orange-600 text-white">
<div class="container mx-auto px-6 text-center">
<h2 class="text-3xl font-bold mb-6">全面防控,确保安全</h2>
<p class="text-xl mb-8 opacity-90">建立完善的风险防控体系,为展会成功保驾护航</p>
<div class="grid grid-cols-1 md:grid-cols-4 gap-6 max-w-4xl mx-auto">
<div class="bg-white/10 backdrop-blur rounded-lg p-4">
<div class="text-2xl font-bold mb-1">12项</div>
<div class="text-sm opacity-90">风险识别</div>
</div>
<div class="bg-white/10 backdrop-blur rounded-lg p-4">
<div class="text-2xl font-bold mb-1">48条</div>
<div class="text-sm opacity-90">防控措施</div>
</div>
<div class="bg-white/10 backdrop-blur rounded-lg p-4">
<div class="text-2xl font-bold mb-1">100%</div>
<div class="text-sm opacity-90">预案覆盖</div>
</div>
<div class="bg-white/10 backdrop-blur rounded-lg p-4">
<div class="text-2xl font-bold mb-1">24H</div>
<div class="text-sm opacity-90">应急响应</div>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-900 text-white py-12">
<div class="container mx-auto px-6">
<div class="text-center text-sm text-gray-400">
<p>&copy; 2024 长三角国际新能源汽车与智能交通产业博览会. All rights reserved.</p>
</div>
</div>
</footer>
</body>
</html>