新增智慧学校页面并完善政策与架构内容
This commit is contained in:
Frudrax Cheng
@@ -0,0 +1,164 @@
|
||||
---
|
||||
const painSections = [
|
||||
{
|
||||
index: '痛点一',
|
||||
title: '巡检模式传统，风险发现偏后',
|
||||
summary: '校园日常安全巡检仍依赖人工经验，覆盖频次和标准执行不稳定，异常问题经常在事后才进入处置流程。',
|
||||
items: [
|
||||
{
|
||||
title: '人工巡查',
|
||||
desc: '依赖人员定时巡检，重点区域和高峰时段存在覆盖盲区。',
|
||||
icon: '/img/education/pain-1-manual-patrol.svg'
|
||||
},
|
||||
{
|
||||
title: '事后处置',
|
||||
desc: '问题发现滞后，处置流程启动慢，风险扩散概率增加。',
|
||||
icon: '/img/education/pain-1-post-response.svg'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
index: '痛点二',
|
||||
title: '重点领域监管与合规压力',
|
||||
summary: '关键环节监管标准执行不到位，过程记录不完整、不规范，难以满足最新政策法规与行业监管要求。',
|
||||
items: [
|
||||
{
|
||||
title: '食品安全',
|
||||
desc: '食材采购溯源难、加工过程监控缺失，存在卫生隐患。',
|
||||
icon: '/img/education/pain-2-food-safety.svg'
|
||||
},
|
||||
{
|
||||
title: '消防安防',
|
||||
desc: '设施巡检不及时，隐患排查记录不规范，应急响应慢。',
|
||||
icon: '/img/education/pain-2-fire-security.svg'
|
||||
},
|
||||
{
|
||||
title: '后勤运维',
|
||||
desc: '设备维护记录不全，维修流程不透明，资源浪费严重。',
|
||||
icon: '/img/education/pain-2-ops-maintenance.svg'
|
||||
}
|
||||
],
|
||||
risk: '重点环节整改不及时，可能面临监管处罚、责任追责与舆情风险。'
|
||||
},
|
||||
{
|
||||
index: '痛点三',
|
||||
title: '系统割裂，数据协同不足',
|
||||
summary: '出入管理、视频监控、消防报警等系统相互独立，数据难汇聚、事件难联动，管理效率受限。',
|
||||
items: [
|
||||
{
|
||||
title: '出入管理系统',
|
||||
desc: '访客、车辆、师生进出规则分散，异常通行难以统一预警。',
|
||||
icon: '/img/education/pain-3-access-control.svg'
|
||||
},
|
||||
{
|
||||
title: '视频监控系统',
|
||||
desc: '监控数据孤立，难与其他业务系统形成协同处置链路。',
|
||||
icon: '/img/education/pain-3-video-surveillance.svg'
|
||||
},
|
||||
{
|
||||
title: '消防报警系统',
|
||||
desc: '告警信息无法与现场管理流程联动，闭环追踪困难。',
|
||||
icon: '/img/education/pain-3-fire-alarm.svg'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
index: '痛点四',
|
||||
title: '治理机制不完善，处置质量不稳定',
|
||||
summary: '处理流程不规范、管理体系缺失、跨部门协同不足，导致同类问题反复出现，难以形成长效治理。',
|
||||
items: [
|
||||
{
|
||||
title: '处理流程不规范',
|
||||
desc: '事件分级、责任分派、验收标准不统一，执行偏差大。',
|
||||
icon: '/img/education/pain-4-process-nonstandard.svg'
|
||||
},
|
||||
{
|
||||
title: '管理体系缺失',
|
||||
desc: '缺少制度化台账与持续评估机制，整改难以沉淀为标准。',
|
||||
icon: '/img/education/pain-4-system-missing.svg'
|
||||
},
|
||||
{
|
||||
title: '联动协同不足',
|
||||
desc: '安保、后勤、教务之间信息传递链路长，响应效率低。',
|
||||
icon: '/img/education/pain-4-collab-weak.svg'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
index: '痛点五',
|
||||
title: '设备和台账管理粗放，运维成本持续抬升',
|
||||
summary: '设备数量多、类型杂，依赖人工登记与分散记录，漏检失修与信息不一致问题并存。',
|
||||
items: [
|
||||
{
|
||||
title: '漏检失修',
|
||||
desc: '周期巡检执行不到位，关键设备状态变化无法及时掌握。',
|
||||
icon: '/img/education/pain-5-missed-inspection.svg'
|
||||
},
|
||||
{
|
||||
title: '人工登记',
|
||||
desc: '纸质或分散表格记录易遗漏、易出错，追溯效率低。',
|
||||
icon: '/img/education/pain-5-manual-record.svg'
|
||||
},
|
||||
{
|
||||
title: '设备繁杂',
|
||||
desc: '多品牌多协议并存，维护策略难统一，管理复杂度高。',
|
||||
icon: '/img/education/pain-5-device-complex.svg'
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
---
|
||||
|
||||
<section class="px-4 lg:px-0 py-16 bg-slate-50 overflow-hidden">
|
||||
<div class="max-w-7xl mx-auto">
|
||||
<div class="text-center mb-12">
|
||||
<p class="inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold tracking-wide">
|
||||
<i class="fa fa-exclamation-triangle"></i>
|
||||
<span>校园管理核心痛点</span>
|
||||
</p>
|
||||
<h3 class="text-3xl md:text-5xl font-black text-gray-900 tracking-tight mt-5">
|
||||
按场景拆解问题，按闭环重建治理
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="space-y-6 md:space-y-8">
|
||||
{painSections.map((section) => (
|
||||
<article class="rounded-3xl border border-blue-100 bg-white/95 shadow-sm p-5 md:p-8">
|
||||
<div class="flex flex-col gap-3 md:gap-4">
|
||||
<h4 class="text-2xl md:text-4xl font-black text-blue-600 tracking-tight">
|
||||
{section.index}：{section.title}
|
||||
</h4>
|
||||
<div class="rounded-2xl border border-slate-200 bg-slate-50 px-4 md:px-6 py-4">
|
||||
<p class="text-gray-700 text-base md:text-lg leading-relaxed">{section.summary}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class={`grid grid-cols-1 gap-4 mt-5 ${section.items.length === 2 ? 'md:grid-cols-2' : 'md:grid-cols-3'}`}>
|
||||
{section.items.map((item) => (
|
||||
<div class="rounded-2xl border border-blue-200 bg-blue-50 p-4 md:p-5">
|
||||
<div class="flex items-center gap-3 mb-3">
|
||||
<div class="w-10 h-10 rounded-xl border border-blue-200 bg-white flex items-center justify-center shrink-0">
|
||||
<img src={item.icon} alt={item.title} class="w-6 h-6 object-contain" />
|
||||
</div>
|
||||
<p class="text-xl font-black text-blue-600 leading-none">{item.title}</p>
|
||||
</div>
|
||||
<p class="text-gray-700 text-sm md:text-[1.05rem] leading-relaxed">{item.desc}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{section.risk && (
|
||||
<div class="mt-5 rounded-2xl border border-dashed border-blue-200 bg-blue-50/70 px-4 md:px-6 py-4 flex items-start gap-3">
|
||||
<div class="w-8 h-8 rounded-lg bg-red-100 text-red-600 flex items-center justify-center shrink-0 mt-0.5">
|
||||
<i class="fa fa-bell"></i>
|
||||
</div>
|
||||
<p class="text-gray-700 text-sm md:text-base leading-relaxed">
|
||||
<span class="font-black text-blue-600 mr-1">合规风险提示：</span>{section.risk}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
Reference in New Issue
Block a user