增加物业楼宇模块
This commit is contained in:
Frudrax Cheng
Vendored
+1
-1
@@ -194,6 +194,6 @@ declare module 'astro:content' {
|
|||||||
LiveContentConfig['collections'][C]['loader']
|
LiveContentConfig['collections'][C]['loader']
|
||||||
>;
|
>;
|
||||||
|
|
||||||
export type ContentConfig = typeof import("./../src/content.config.mjs");
|
export type ContentConfig = typeof import("../src/content.config.mjs");
|
||||||
export type LiveContentConfig = never;
|
export type LiveContentConfig = never;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"_variables": {
|
"_variables": {
|
||||||
"lastUpdateCheck": 1776058818761
|
"lastUpdateCheck": 1778136453785
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 238 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 208 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
@@ -0,0 +1,34 @@
|
|||||||
|
<section class="px-4 lg:px-0 py-16 bg-white overflow-hidden">
|
||||||
|
<div class="max-w-7xl mx-auto">
|
||||||
|
<div class="bg-slate-50 rounded-3xl border border-blue-100 p-5 md:p-8 lg:p-10">
|
||||||
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-10 items-center">
|
||||||
|
<div>
|
||||||
|
<p class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold tracking-wide mb-4">
|
||||||
|
<i class="fa fa-sitemap"></i>
|
||||||
|
<span>系统架构</span>
|
||||||
|
</p>
|
||||||
|
<h3 class="text-3xl md:text-4xl font-black text-gray-900 tracking-tight leading-tight mb-4">
|
||||||
|
街道-社区-物业三级协同的安全治理底座
|
||||||
|
</h3>
|
||||||
|
<p class="text-gray-600 leading-relaxed mb-6">
|
||||||
|
平台以 AI 视频与物联感知作为前端感知入口，在中台完成统一告警、分级研判与工单流转，向上对接街道指挥侧、向下连通物业执行侧，把感知、决策、处置串成同一条责任链。
|
||||||
|
</p>
|
||||||
|
<div class="grid grid-cols-2 gap-3">
|
||||||
|
<div class="bg-blue-600 text-white rounded-xl py-3 text-center text-sm font-bold">全域感知</div>
|
||||||
|
<div class="bg-blue-600 text-white rounded-xl py-3 text-center text-sm font-bold">统一告警</div>
|
||||||
|
<div class="bg-blue-600 text-white rounded-xl py-3 text-center text-sm font-bold">工单闭环</div>
|
||||||
|
<div class="bg-blue-600 text-white rounded-xl py-3 text-center text-sm font-bold">三级协同</div>
|
||||||
|
</div>
|
||||||
|
<div class="mt-6 bg-white border border-blue-100 rounded-2xl p-4">
|
||||||
|
<p class="text-sm font-bold text-blue-700 mb-2">建设目标</p>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed">让街道全域态势"一屏掌控"、社区精细化管理"一键处置"、物业巡检"一机搞定"，全面打通任务下发-执行-反馈的全流程闭环。</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="rounded-2xl overflow-hidden border border-white shadow-lg bg-white">
|
||||||
|
<img src="/img/property/architecture.webp" alt="物业楼宇系统架构图" class="w-full h-auto object-cover" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,277 @@
|
|||||||
|
---
|
||||||
|
const roles = [
|
||||||
|
{
|
||||||
|
title: '街道管委会',
|
||||||
|
channel: 'PC 端',
|
||||||
|
desc: '查看全域安全数据、下发检查任务、查阅台账并开展考核。',
|
||||||
|
img: '/img/property/multi-end-street.webp'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '社区管委会',
|
||||||
|
channel: 'PC 端 + 小程序',
|
||||||
|
desc: '管理人员与设备档案、调度隐患处置、上报工作进度，查看告警音视频。',
|
||||||
|
img: '/img/property/multi-end-community.webp'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '物业巡检员',
|
||||||
|
channel: '小程序',
|
||||||
|
desc: '接收任务、上传检查记录、实时处理告警隐患，移动化作业。',
|
||||||
|
img: '/img/property/multi-end-inspector.webp'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const channels = [
|
||||||
|
{ name: '电话', icon: 'fa-phone' },
|
||||||
|
{ name: '短信', icon: 'fa-envelope' },
|
||||||
|
{ name: '小程序', icon: 'fa-mobile' },
|
||||||
|
{ name: 'PC 端', icon: 'fa-desktop' },
|
||||||
|
{ name: '大屏 IOC', icon: 'fa-tv' }
|
||||||
|
];
|
||||||
|
|
||||||
|
const alerts = [
|
||||||
|
{
|
||||||
|
num: '1',
|
||||||
|
name: '一级 · 紧急告警',
|
||||||
|
timing: '20 秒内响应',
|
||||||
|
desc: '关键风险事件秒级触达，五通道同时推送至全链路负责人，自动升级提醒。',
|
||||||
|
active: [true, true, true, true, true],
|
||||||
|
from: 'from-red-500',
|
||||||
|
to: 'to-red-600',
|
||||||
|
ring: 'ring-red-100',
|
||||||
|
text: 'text-red-600',
|
||||||
|
bg: 'bg-red-50',
|
||||||
|
border: 'border-red-200'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
num: '2',
|
||||||
|
name: '二级 · 一般告警',
|
||||||
|
timing: '实时推送',
|
||||||
|
desc: '短信、小程序与 PC 端三通道同步推送，匹配日常处置流程，确保及时处置。',
|
||||||
|
active: [false, true, true, true, false],
|
||||||
|
from: 'from-amber-400',
|
||||||
|
to: 'to-amber-500',
|
||||||
|
ring: 'ring-amber-100',
|
||||||
|
text: 'text-amber-600',
|
||||||
|
bg: 'bg-amber-50',
|
||||||
|
border: 'border-amber-200'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
num: '3',
|
||||||
|
name: '三级 · 提示告警',
|
||||||
|
timing: '系统留痕',
|
||||||
|
desc: '小程序与 PC 端推送，事件全链路留痕，统计分析便于复盘与考核。',
|
||||||
|
active: [false, false, true, true, false],
|
||||||
|
from: 'from-blue-500',
|
||||||
|
to: 'to-blue-600',
|
||||||
|
ring: 'ring-blue-100',
|
||||||
|
text: 'text-blue-600',
|
||||||
|
bg: 'bg-blue-50',
|
||||||
|
border: 'border-blue-200'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<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 relative">
|
||||||
|
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-64 h-64 bg-blue-100/50 blur-3xl rounded-full -z-10"></div>
|
||||||
|
<h3 class="text-3xl md:text-5xl font-black tracking-tight leading-tight mt-5">
|
||||||
|
<span class="text-blue-600">基础支撑</span>三大核心能力
|
||||||
|
</h3>
|
||||||
|
<div class="w-24 h-1.5 bg-blue-600 mx-auto mt-8 rounded-full shadow-sm shadow-blue-200"></div>
|
||||||
|
<p class="text-gray-600 mt-6 max-w-2xl mx-auto">为街道、社区、物业各级角色提供从可视化中心、协同管理到分级告警的全链路底层能力。</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 能力 1：可视化中心大屏 -->
|
||||||
|
<article class="bg-white rounded-3xl border border-blue-100 shadow-sm p-5 md:p-8 mb-6">
|
||||||
|
<div class="flex flex-col md:flex-row md:items-end md:justify-between gap-4 mb-6">
|
||||||
|
<div>
|
||||||
|
<p class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold tracking-wide mb-3">
|
||||||
|
<i class="fa fa-tv"></i>
|
||||||
|
<span>能力一</span>
|
||||||
|
</p>
|
||||||
|
<h4 class="text-2xl font-black text-gray-900 mb-2">可视化中心大屏</h4>
|
||||||
|
<p class="text-base text-gray-600 leading-relaxed md:max-w-2xl">
|
||||||
|
双版本可视化大屏，街道版聚焦全域态势一屏掌控，社区版聚焦精细化管理一键处置。
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="hidden md:flex items-center gap-3 shrink-0 bg-blue-50 border border-blue-100 rounded-2xl px-4 py-3">
|
||||||
|
<div class="flex -space-x-1">
|
||||||
|
<div class="w-9 h-9 rounded-lg bg-blue-600 text-white flex items-center justify-center border-2 border-white shadow-sm">
|
||||||
|
<i class="fa fa-tv"></i>
|
||||||
|
</div>
|
||||||
|
<div class="w-9 h-9 rounded-lg bg-blue-500 text-white flex items-center justify-center border-2 border-white shadow-sm">
|
||||||
|
<i class="fa fa-desktop"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p class="text-sm font-black text-blue-700 leading-none">双版本协同</p>
|
||||||
|
<p class="text-[11px] text-gray-500 mt-1">街道 + 社区</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
|
||||||
|
<!-- 街道版 -->
|
||||||
|
<div class="rounded-2xl bg-white border border-slate-200 ring-4 ring-blue-100 overflow-hidden hover:shadow-lg transition-all duration-300">
|
||||||
|
<div class="bg-gradient-to-br from-blue-500 to-blue-600 p-4 flex items-center gap-3">
|
||||||
|
<div class="w-12 h-12 rounded-xl bg-white/20 backdrop-blur flex items-center justify-center shrink-0 border border-white/30">
|
||||||
|
<i class="fa fa-globe text-2xl text-white"></i>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<p class="text-white font-black text-lg leading-tight">街道版</p>
|
||||||
|
<p class="text-white/85 text-xs font-bold mt-0.5 tracking-wide">
|
||||||
|
<i class="fa fa-arrows-alt mr-1"></i>全域态势 · 一屏掌控
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-5">
|
||||||
|
<p class="text-base text-gray-600 leading-relaxed mb-4">呈现全域地图，标注各社区安全状态、实时告警与设备资产，一屏掌握街道全域安全态势。</p>
|
||||||
|
<p class="text-xs font-black text-gray-400 tracking-wider mb-3">核心模块</p>
|
||||||
|
<div class="grid grid-cols-2 gap-3">
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-map-marker text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">全域地图</span>
|
||||||
|
</div>
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-bell text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">实时告警</span>
|
||||||
|
</div>
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-server text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">设备资产</span>
|
||||||
|
</div>
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-pie-chart text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">辖区考核</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 社区版 -->
|
||||||
|
<div class="rounded-2xl bg-white border border-slate-200 ring-4 ring-blue-100 overflow-hidden hover:shadow-lg transition-all duration-300">
|
||||||
|
<div class="bg-gradient-to-br from-blue-500 to-blue-600 p-4 flex items-center gap-3">
|
||||||
|
<div class="w-12 h-12 rounded-xl bg-white/20 backdrop-blur flex items-center justify-center shrink-0 border border-white/30">
|
||||||
|
<i class="fa fa-building text-2xl text-white"></i>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<p class="text-white font-black text-lg leading-tight">社区版</p>
|
||||||
|
<p class="text-white/85 text-xs font-bold mt-0.5 tracking-wide">
|
||||||
|
<i class="fa fa-crosshairs mr-1"></i>精细管理 · 一键处置
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-5">
|
||||||
|
<p class="text-base text-gray-600 leading-relaxed mb-4">聚焦单社区管理，展示设备点位、巡检任务与待办事项，告警事件自动弹窗辅助处置。</p>
|
||||||
|
<p class="text-xs font-black text-gray-400 tracking-wider mb-3">核心模块</p>
|
||||||
|
<div class="grid grid-cols-2 gap-3">
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-dot-circle-o text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">设备点位</span>
|
||||||
|
</div>
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-tasks text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">巡检任务</span>
|
||||||
|
</div>
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-list-alt text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">待办事项</span>
|
||||||
|
</div>
|
||||||
|
<div class="rounded-xl bg-blue-50 border border-blue-100 p-3 flex items-center gap-2">
|
||||||
|
<i class="fa fa-window-restore text-blue-600 text-lg w-5 text-center"></i>
|
||||||
|
<span class="text-sm font-bold text-gray-800">告警弹窗</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- 能力 2：多端管理系统 -->
|
||||||
|
<article class="bg-white rounded-3xl border border-blue-100 shadow-sm p-5 md:p-8 mb-6">
|
||||||
|
<div class="flex flex-col gap-4 mb-6">
|
||||||
|
<p class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold tracking-wide w-fit">
|
||||||
|
<i class="fa fa-th-large"></i>
|
||||||
|
<span>能力二</span>
|
||||||
|
</p>
|
||||||
|
<div>
|
||||||
|
<h4 class="text-2xl font-black text-gray-900 mb-2">多端管理系统</h4>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed max-w-3xl">
|
||||||
|
适配街道 / 社区 / 物业 / 巡检员三级角色，按角色配置专属端侧与功能，分级授权、多端协同，打通任务下发-执行-反馈的全流程闭环。
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-5">
|
||||||
|
{roles.map((role) => (
|
||||||
|
<div class="rounded-2xl border border-slate-200 bg-slate-50 overflow-hidden hover:shadow-lg transition-all duration-300">
|
||||||
|
<div class="aspect-[16/10] bg-white overflow-hidden">
|
||||||
|
<img src={role.img} alt={role.title} class="w-full h-full object-cover" />
|
||||||
|
</div>
|
||||||
|
<div class="p-4">
|
||||||
|
<div class="flex items-center justify-between mb-2">
|
||||||
|
<p class="font-black text-gray-900">{role.title}</p>
|
||||||
|
<span class="text-[11px] font-bold text-blue-700 bg-blue-100 px-2 py-0.5 rounded-full">{role.channel}</span>
|
||||||
|
</div>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed">{role.desc}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- 能力 3：消息管理与实时告警 -->
|
||||||
|
<article class="bg-white rounded-3xl border border-blue-100 shadow-sm p-5 md:p-8">
|
||||||
|
<div class="flex flex-col md:flex-row md:items-end md:justify-between gap-4 mb-6">
|
||||||
|
<div>
|
||||||
|
<p class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold tracking-wide mb-3">
|
||||||
|
<i class="fa fa-bell"></i>
|
||||||
|
<span>能力三</span>
|
||||||
|
</p>
|
||||||
|
<h4 class="text-2xl font-black text-gray-900 mb-2">消息管理与实时告警</h4>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed md:max-w-2xl">
|
||||||
|
按严重程度划分一/二/三级告警，匹配街道应急响应流程，多渠道精准推送保障告警无漏接，未按时处置自动升级提醒。
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="hidden md:flex items-center gap-2 text-xs text-gray-500 shrink-0">
|
||||||
|
<i class="fa fa-arrow-right text-blue-500"></i>
|
||||||
|
<span>告警严重程度递减</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
|
{alerts.map((a) => (
|
||||||
|
<div class={`relative rounded-2xl bg-white border border-slate-200 ring-4 ${a.ring} overflow-hidden hover:shadow-lg transition-all duration-300`}>
|
||||||
|
<div class={`bg-gradient-to-br ${a.from} ${a.to} p-4 flex items-center gap-3`}>
|
||||||
|
<div class="w-12 h-12 rounded-xl bg-white/20 backdrop-blur flex items-center justify-center shrink-0 border border-white/30">
|
||||||
|
<span class="text-2xl font-black text-white leading-none">{a.num}</span>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<p class="text-white font-black text-base leading-tight">{a.name}</p>
|
||||||
|
<p class="text-white/85 text-[11px] font-bold mt-0.5 tracking-wide">
|
||||||
|
<i class="fa fa-clock-o mr-1"></i>{a.timing}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="p-4">
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed mb-3">{a.desc}</p>
|
||||||
|
<p class="text-[11px] font-bold text-gray-400 tracking-wider mb-2">推送渠道</p>
|
||||||
|
<div class="grid grid-cols-5 gap-1.5">
|
||||||
|
{channels.map((ch, i) => (
|
||||||
|
<div class={`flex flex-col items-center justify-center gap-1 rounded-lg border py-2 px-1 transition-all ${
|
||||||
|
a.active[i]
|
||||||
|
? `${a.bg} ${a.border} ${a.text}`
|
||||||
|
: 'bg-slate-50 border-dashed border-slate-200 text-slate-300'
|
||||||
|
}`}>
|
||||||
|
<i class={`fa ${ch.icon} text-sm`}></i>
|
||||||
|
<span class="text-[10px] font-bold leading-none whitespace-nowrap">{ch.name}</span>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
<section class="bg-slate-50 overflow-hidden">
|
||||||
|
<div class="max-w-7xl mx-auto px-4 lg:px-0 pt-4 md:pt-8">
|
||||||
|
<div class="bg-white rounded-3xl border border-blue-100 shadow-xl p-5 md:p-10">
|
||||||
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center">
|
||||||
|
<div class="space-y-5">
|
||||||
|
<div class="inline-flex items-center gap-2 bg-blue-50 text-blue-700 px-3 py-1.5 rounded-full text-xs font-bold tracking-wide">
|
||||||
|
<i class="fa fa-building-o"></i>
|
||||||
|
<span>物业楼宇智慧安防运营平台</span>
|
||||||
|
</div>
|
||||||
|
<h1 class="text-3xl md:text-5xl font-black tracking-tight leading-tight">
|
||||||
|
<span class="text-blue-600">物业楼宇</span>
|
||||||
|
</h1>
|
||||||
|
<p class="text-gray-700 text-base md:text-lg leading-relaxed">
|
||||||
|
面向街道、社区、物业三级管理场景，融合 AI 视频识别与全域物联感知，构建“全域可视、统一告警、闭环处置、三级协同”的物业安全治理底座，破解人工成本高、协同效率低、应急响应难等核心痛点。
|
||||||
|
</p>
|
||||||
|
<div class="grid grid-cols-2 md:grid-cols-4 gap-3">
|
||||||
|
<div class="bg-blue-600 text-white text-center py-2.5 rounded-xl font-bold text-sm">全域可视</div>
|
||||||
|
<div class="bg-blue-600 text-white text-center py-2.5 rounded-xl font-bold text-sm">统一告警</div>
|
||||||
|
<div class="bg-blue-600 text-white text-center py-2.5 rounded-xl font-bold text-sm">闭环处置</div>
|
||||||
|
<div class="bg-blue-600 text-white text-center py-2.5 rounded-xl font-bold text-sm">三级协同</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="relative">
|
||||||
|
<div class="absolute -inset-4 bg-blue-200/40 blur-3xl rounded-full -z-10"></div>
|
||||||
|
<div class="overflow-hidden rounded-3xl border border-slate-100 shadow-lg">
|
||||||
|
<img src="/img/property/hero.webp" alt="物业楼宇平台展示" class="w-full h-auto object-cover">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-8">
|
||||||
|
<div class="bg-blue-50 border border-blue-100 rounded-2xl p-5">
|
||||||
|
<p class="text-blue-900 font-bold text-lg mb-3">为街道社区赋能</p>
|
||||||
|
<p class="text-gray-700 leading-relaxed text-sm md:text-base">实现街道全域安全态势一屏掌控、辖区安全数据实时汇聚，支撑统一指挥调度与精细化考核，让街道统筹有抓手、社区管理有数据。</p>
|
||||||
|
</div>
|
||||||
|
<div class="bg-red-50 border border-red-100 rounded-2xl p-5">
|
||||||
|
<p class="text-red-900 font-bold text-lg mb-3">为物业巡检员赋能</p>
|
||||||
|
<p class="text-gray-700 leading-relaxed text-sm md:text-base">小程序接收任务、上传巡检记录、实时处置告警隐患，把繁杂的纸面流程变成口袋里的一站式工作台，降低重复劳动与隐性成本。</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,81 @@
|
|||||||
|
---
|
||||||
|
const painPoints = [
|
||||||
|
{
|
||||||
|
icon: 'fa-cny',
|
||||||
|
title: '人工成本高',
|
||||||
|
subtitle: '重复劳动，效率低下',
|
||||||
|
points: ['重复劳动严重', '巡检覆盖有限', '隐性成本攀升']
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: 'fa-users',
|
||||||
|
title: '人员管理分散',
|
||||||
|
subtitle: '档案不一，考核困难',
|
||||||
|
points: ['档案不统一', '状态难掌握', '考核无依据']
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: 'fa-wrench',
|
||||||
|
title: '老旧小区隐患',
|
||||||
|
subtitle: '设施老化，漏检率高',
|
||||||
|
points: ['基础设施老化', '人工巡检盲区', '风险难以防控']
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: 'fa-comments',
|
||||||
|
title: '物业协同低',
|
||||||
|
subtitle: '信息不畅，闭环难追',
|
||||||
|
points: ['沟通渠道单一', '指令传达滞后', '闭环管理缺失']
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: 'fa-bell',
|
||||||
|
title: '应急响应不及时',
|
||||||
|
subtitle: '调度困难，支撑不足',
|
||||||
|
points: ['社区分布分散', '数据支撑缺失', '联动机制不畅']
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: 'fa-cubes',
|
||||||
|
title: '街道统筹难',
|
||||||
|
subtitle: '标准不一，数据孤岛',
|
||||||
|
points: ['标准不统一', '数据分散割裂', '态势难掌握']
|
||||||
|
}
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<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 relative">
|
||||||
|
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-64 h-64 bg-blue-100/50 blur-3xl rounded-full -z-10"></div>
|
||||||
|
<h3 class="text-3xl md:text-5xl font-black tracking-tight leading-tight mt-5">
|
||||||
|
<span class="text-blue-600">物业楼宇</span>六大管理痛点
|
||||||
|
</h3>
|
||||||
|
<div class="w-24 h-1.5 bg-blue-600 mx-auto mt-8 rounded-full shadow-sm shadow-blue-200"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||||
|
{painPoints.map((item, idx) => (
|
||||||
|
<article class="group relative bg-white rounded-3xl border border-slate-200 p-6 md:p-7 hover:shadow-xl hover:border-blue-200 hover:-translate-y-0.5 transition-all duration-300 flex flex-col overflow-hidden">
|
||||||
|
<span class="pointer-events-none absolute -top-3 -right-2 text-[110px] font-black text-blue-100/80 leading-none select-none group-hover:text-blue-200/80 transition-colors duration-300">{String(idx + 1).padStart(2, '0')}</span>
|
||||||
|
|
||||||
|
<div class="relative flex items-center gap-4 mb-5">
|
||||||
|
<div class="shrink-0 w-14 h-14 rounded-2xl bg-blue-500 text-white flex items-center justify-center shadow-lg shadow-blue-200 group-hover:scale-105 transition-transform duration-300">
|
||||||
|
<i class={`fa ${item.icon} text-[30px] leading-none`}></i>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1 min-w-0">
|
||||||
|
<h4 class="text-2xl md:text-[26px] font-black text-gray-900 leading-tight">{item.title}</h4>
|
||||||
|
<p class="text-sm font-bold text-blue-700 tracking-wide mt-1">{item.subtitle}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="relative h-px bg-gradient-to-r from-blue-200 via-blue-100 to-transparent mb-5"></div>
|
||||||
|
|
||||||
|
<ul class="relative space-y-3 flex-1">
|
||||||
|
{item.points.map((p) => (
|
||||||
|
<li class="flex items-center gap-3 text-base">
|
||||||
|
<span class="shrink-0 w-1.5 h-1.5 rounded-full bg-blue-500"></span>
|
||||||
|
<span class="text-gray-700 font-medium">{p}</span>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</article>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -0,0 +1,224 @@
|
|||||||
|
---
|
||||||
|
const scenarios = [
|
||||||
|
{
|
||||||
|
title: '电气火灾监测',
|
||||||
|
icon: 'fa-bolt',
|
||||||
|
desc: '在老旧小区单元楼总配电房部署电气监测传感器，实时采集电流、温度、漏电值，超阈值自动告警。',
|
||||||
|
value: '从源头规避电气火灾，提升老旧小区电气安全防护能力'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '可燃气体监测',
|
||||||
|
icon: 'fa-fire',
|
||||||
|
desc: '部署可燃气体传感器，实时监测燃气浓度，超标时自动联动切断阀门并向社区与街道推送告警。',
|
||||||
|
value: '防控燃气泄漏风险，提升沿街商铺燃气安全管理'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '消防水监测',
|
||||||
|
icon: 'fa-tint',
|
||||||
|
desc: '消防栓末端安装无线压力表、水箱部署无线液位表，全程监测消防供水状态，异常即预警。',
|
||||||
|
value: '消除"无水可用"隐患，强化小区消防应急保障'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '吸气式感烟监测',
|
||||||
|
icon: 'fa-cloud',
|
||||||
|
desc: '面向高配房、仓库等重点区域部署吸气式感烟探测器，24 小时主动监测，火情秒级预警。',
|
||||||
|
value: '实现火灾早期精准预警，从源头遏制火情蔓延'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '可视化烟感监测',
|
||||||
|
icon: 'fa-camera',
|
||||||
|
desc: '公共区域、配套用房、地下区域部署可视化烟感，告警时同步联动视频抓拍与录像，可视化取证。',
|
||||||
|
value: '隐患早发现 + 可视化取证，提升消防管控精准度'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '高空抛物监测',
|
||||||
|
icon: 'fa-binoculars',
|
||||||
|
desc: '全域部署专用摄像机，AI 抛物检测算法精准识别行为，过滤飞鸟落叶干扰，记录抛物轨迹。',
|
||||||
|
value: '固定完整证据链助力溯源处置，守护小区高空安全'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '梯控管理',
|
||||||
|
icon: 'fa-arrows-v',
|
||||||
|
desc: 'AI 电动车精准识别算法实时监测电梯内车辆进入，触发语音警告并联动梯门管控、推送物业。',
|
||||||
|
value: '杜绝电动车入梯隐患，筑牢小区乘梯安全防线'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '电动车喷淋灭火',
|
||||||
|
icon: 'fa-shield',
|
||||||
|
desc: '专用停放区部署热成像 + 泡沫喷淋系统，秒级触发告警，10 秒内启动喷淋灭火并推送巡检员。',
|
||||||
|
value: '快速遏制车辆火情，规避火灾扩大风险'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const highaltitudeSteps = [
|
||||||
|
{
|
||||||
|
step: '01',
|
||||||
|
title: '认清危害',
|
||||||
|
desc: '小至易拉罐、鸡蛋，从 15 楼以上抛下足以致人重伤甚至死亡，传统物业难以追责。',
|
||||||
|
tag: '问题源头'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
step: '02',
|
||||||
|
title: 'AI 实时识别告警',
|
||||||
|
desc: '专用摄像机内置 AI 抛物检测算法，过滤飞鸟、落叶等干扰物，事件秒级告警推送。',
|
||||||
|
tag: '智能识别'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
step: '03',
|
||||||
|
title: '抛物轨迹自动还原',
|
||||||
|
desc: '画面叠加抛物轨迹，自动定位起始楼层与窗口，关键画面与全过程视频留痕取证。',
|
||||||
|
tag: '取证溯源'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const feature = [
|
||||||
|
{
|
||||||
|
title: '梯控管理',
|
||||||
|
subtitle: '电动车入梯精准识别',
|
||||||
|
img: '/img/property/scenario-elevator.webp',
|
||||||
|
icon: 'fa-arrows-v',
|
||||||
|
tag: 'AI 视觉',
|
||||||
|
bullets: [
|
||||||
|
'AI 算法实时识别电动车进入电梯',
|
||||||
|
'自动语音警告 + 联动梯门不关闭',
|
||||||
|
'告警同步推送物业端形成监管闭环'
|
||||||
|
],
|
||||||
|
value: '杜绝电动车入梯隐患'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '电动车喷淋灭火系统',
|
||||||
|
subtitle: '热成像 + 泡沫喷淋秒级响应',
|
||||||
|
img: '/img/property/scenario-ebike.webp',
|
||||||
|
icon: 'fa-shield',
|
||||||
|
tag: '主动灭火',
|
||||||
|
bullets: [
|
||||||
|
'热成像 24 小时不间断监测车辆温度',
|
||||||
|
'起火秒级触发告警 + 10 秒启动喷淋',
|
||||||
|
'告警同步推送巡检员形成闭环管控'
|
||||||
|
],
|
||||||
|
value: '快速遏制火情控制初期'
|
||||||
|
},
|
||||||
|
];
|
||||||
|
---
|
||||||
|
|
||||||
|
<section class="px-4 lg:px-0 py-16 bg-white overflow-hidden">
|
||||||
|
<div class="max-w-7xl mx-auto">
|
||||||
|
<div class="text-center mb-12 relative">
|
||||||
|
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-64 h-64 bg-blue-100/50 blur-3xl rounded-full -z-10"></div>
|
||||||
|
<h3 class="text-3xl md:text-5xl font-black tracking-tight leading-tight mt-5">
|
||||||
|
八大<span class="text-blue-600">场景应用</span>覆盖全周期安全
|
||||||
|
</h3>
|
||||||
|
<div class="w-24 h-1.5 bg-blue-600 mx-auto mt-8 rounded-full shadow-sm shadow-blue-200"></div>
|
||||||
|
<p class="text-gray-600 mt-6 max-w-2xl mx-auto">围绕老旧小区改造、公共区域监管、重点设施防护，构建覆盖事前预防、事中告警、事后取证的全周期场景能力。</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-5 mb-16">
|
||||||
|
{scenarios.map((item) => (
|
||||||
|
<article class="group bg-slate-50 rounded-3xl border border-blue-100 p-5 md:p-6 hover:shadow-lg hover:border-blue-200 transition-all duration-300 flex flex-col">
|
||||||
|
<div class="w-12 h-12 rounded-xl bg-blue-600 text-white flex items-center justify-center mb-4 shadow-sm group-hover:scale-105 transition-transform duration-300">
|
||||||
|
<i class={`fa ${item.icon} text-xl`}></i>
|
||||||
|
</div>
|
||||||
|
<h4 class="text-lg font-black text-gray-900 mb-2 leading-snug">{item.title}</h4>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed mb-4 flex-1">{item.desc}</p>
|
||||||
|
<div class="border-t border-blue-100 pt-3 mt-auto">
|
||||||
|
<p class="text-xs font-bold text-blue-700 leading-relaxed">{item.value}</p>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 重点场景实景：高空抛物 case study -->
|
||||||
|
<div class="text-center mb-10 relative">
|
||||||
|
<div class="absolute top-0 left-1/2 -translate-x-1/2 w-64 h-64 bg-blue-100/50 blur-3xl rounded-full -z-10"></div>
|
||||||
|
<h4 class="text-2xl md:text-4xl font-black tracking-tight leading-tight mt-4">
|
||||||
|
重点场景<span class="text-blue-600">实景展示</span>
|
||||||
|
</h4>
|
||||||
|
<div class="w-20 h-1.5 bg-blue-600 mx-auto mt-6 rounded-full shadow-sm shadow-blue-200"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 高空抛物：浅色主题，文字为主、图片为辅 -->
|
||||||
|
<article class="bg-slate-50 rounded-3xl border border-blue-100 p-5 md:p-8 mb-6">
|
||||||
|
<div class="flex flex-col md:flex-row md:items-end md:justify-between gap-4 mb-6">
|
||||||
|
<div>
|
||||||
|
<p class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold tracking-wide mb-3">
|
||||||
|
<i class="fa fa-binoculars"></i>
|
||||||
|
<span>专题方案 · 高空安全</span>
|
||||||
|
</p>
|
||||||
|
<h5 class="text-2xl md:text-3xl font-black text-gray-900 tracking-tight leading-tight mb-2">高空抛物全链路监测</h5>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed max-w-2xl">从隐患识别、智能告警到轨迹还原的三步闭环，AI 算法精准过滤干扰物，为物业及警方提供完整证据链。</p>
|
||||||
|
</div>
|
||||||
|
<div class="flex gap-5 md:gap-6 shrink-0">
|
||||||
|
<div class="text-center">
|
||||||
|
<p class="text-2xl md:text-3xl font-black text-blue-600">3 步</p>
|
||||||
|
<p class="text-[11px] text-gray-500 mt-0.5">完整证据链</p>
|
||||||
|
</div>
|
||||||
|
<div class="w-px bg-blue-100"></div>
|
||||||
|
<div class="text-center">
|
||||||
|
<p class="text-2xl md:text-3xl font-black text-blue-600">秒级</p>
|
||||||
|
<p class="text-[11px] text-gray-500 mt-0.5">事件告警</p>
|
||||||
|
</div>
|
||||||
|
<div class="w-px bg-blue-100"></div>
|
||||||
|
<div class="text-center">
|
||||||
|
<p class="text-2xl md:text-3xl font-black text-blue-600">AI</p>
|
||||||
|
<p class="text-[11px] text-gray-500 mt-0.5">智能过滤</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 md:gap-5">
|
||||||
|
{highaltitudeSteps.map((s, i) => (
|
||||||
|
<div class="relative bg-white rounded-2xl border border-slate-200 p-5 md:p-6 hover:shadow-lg hover:border-blue-200 transition-all duration-300">
|
||||||
|
<div class="flex items-center gap-2 mb-4">
|
||||||
|
<span class="inline-flex items-center justify-center w-9 h-9 rounded-lg bg-blue-600 text-white text-sm font-black tracking-wider">{s.step}</span>
|
||||||
|
<span class="inline-flex items-center px-2 py-0.5 rounded-md bg-blue-50 text-blue-700 text-[11px] font-bold border border-blue-100">{s.tag}</span>
|
||||||
|
</div>
|
||||||
|
<h6 class="text-lg font-black text-gray-900 mb-2">{s.title}</h6>
|
||||||
|
<p class="text-sm text-gray-600 leading-relaxed">{s.desc}</p>
|
||||||
|
{i < highaltitudeSteps.length - 1 && (
|
||||||
|
<div class="hidden md:flex absolute -right-3 top-1/2 -translate-y-1/2 w-6 h-6 rounded-full bg-blue-600 items-center justify-center text-white text-xs z-10 shadow">
|
||||||
|
<i class="fa fa-angle-right"></i>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- 梯控 / 电动车喷淋：横向 feature card，图片缩略 -->
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-5">
|
||||||
|
{feature.map((f) => (
|
||||||
|
<article class="group bg-white rounded-3xl border border-slate-200 p-5 hover:shadow-xl hover:border-blue-200 transition-all duration-300">
|
||||||
|
<div class="flex items-center gap-3 mb-4">
|
||||||
|
<div class="w-10 h-10 rounded-xl bg-blue-50 text-blue-600 flex items-center justify-center shrink-0">
|
||||||
|
<i class={`fa ${f.icon} text-lg`}></i>
|
||||||
|
</div>
|
||||||
|
<div class="flex-1">
|
||||||
|
<h5 class="text-lg font-black text-gray-900 leading-tight">{f.title}</h5>
|
||||||
|
<p class="text-xs font-bold text-blue-600 tracking-wide mt-0.5">{f.subtitle}</p>
|
||||||
|
</div>
|
||||||
|
<span class="bg-blue-50 text-blue-700 border border-blue-100 text-[11px] font-black px-2 py-1 rounded-md shrink-0">{f.tag}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex gap-4">
|
||||||
|
<div class="shrink-0 w-32 sm:w-36 rounded-xl overflow-hidden border border-slate-100 bg-slate-50 self-start">
|
||||||
|
<img src={f.img} alt={f.title} class="w-full h-auto block" />
|
||||||
|
</div>
|
||||||
|
<ul class="space-y-2 flex-1">
|
||||||
|
{f.bullets.map((b) => (
|
||||||
|
<li class="flex items-start gap-2">
|
||||||
|
<i class="fa fa-check text-blue-500 mt-1 text-xs shrink-0"></i>
|
||||||
|
<span class="text-sm text-gray-600 leading-relaxed">{b}</span>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="border-t border-slate-100 pt-3 mt-4 flex items-center gap-2">
|
||||||
|
<i class="fa fa-shield text-blue-500"></i>
|
||||||
|
<span class="text-xs font-bold text-blue-700">{f.value}</span>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
@@ -29,6 +29,7 @@ const navItems: NavItem[] = [
|
|||||||
{ id: 'construction', label: '智慧工地', href: '/construction', icon: 'fa-industry' },
|
{ id: 'construction', label: '智慧工地', href: '/construction', icon: 'fa-industry' },
|
||||||
{ id: 'kitchen', label: '明厨亮灶', href: '/kitchen', icon: 'fa-cutlery' },
|
{ id: 'kitchen', label: '明厨亮灶', href: '/kitchen', icon: 'fa-cutlery' },
|
||||||
{ id: 'education', label: '智慧学校', href: '/education', icon: 'fa-graduation-cap' },
|
{ id: 'education', label: '智慧学校', href: '/education', icon: 'fa-graduation-cap' },
|
||||||
|
{ id: 'property', label: '物业楼宇', href: '/property', icon: 'fa-building-o' },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{ id: 'customization', label: '本地化定制', href: '/customization', icon: 'fa-wrench' },
|
{ id: 'customization', label: '本地化定制', href: '/customization', icon: 'fa-wrench' },
|
||||||
@@ -153,7 +154,7 @@ function getMobileNavLinkClass(item: NavItem) {
|
|||||||
<div id="mobile-product-panel"
|
<div id="mobile-product-panel"
|
||||||
class="lg:hidden fixed left-0 right-0 z-30 bg-white shadow-xl border-b border-gray-200 transform -translate-y-full opacity-0 pointer-events-none transition-all duration-300"
|
class="lg:hidden fixed left-0 right-0 z-30 bg-white shadow-xl border-b border-gray-200 transform -translate-y-full opacity-0 pointer-events-none transition-all duration-300"
|
||||||
style="top: 108px;" role="menu">
|
style="top: 108px;" role="menu">
|
||||||
<div class="max-w-md mx-auto px-2 py-3 grid grid-cols-5 gap-1">
|
<div class="max-w-md mx-auto px-2 py-3 grid grid-cols-3 gap-1">
|
||||||
{navItems.find(item => item.children)?.children?.map(child => (
|
{navItems.find(item => item.children)?.children?.map(child => (
|
||||||
<a href={child.href} role="menuitem"
|
<a href={child.href} role="menuitem"
|
||||||
class={`flex flex-col items-center gap-1 py-2 px-1 rounded-lg transition-colors ${
|
class={`flex flex-col items-center gap-1 py-2 px-1 rounded-lg transition-colors ${
|
||||||
|
|||||||
@@ -0,0 +1,18 @@
|
|||||||
|
---
|
||||||
|
import Layout from '../../layouts/Layout.astro';
|
||||||
|
import PropertyHero from '../../components/sections/PropertyHero.astro';
|
||||||
|
import PropertyPainPoints from '../../components/sections/PropertyPainPoints.astro';
|
||||||
|
import PropertyArchitecture from '../../components/sections/PropertyArchitecture.astro';
|
||||||
|
import PropertyFoundation from '../../components/sections/PropertyFoundation.astro';
|
||||||
|
import PropertyScenarios from '../../components/sections/PropertyScenarios.astro';
|
||||||
|
---
|
||||||
|
|
||||||
|
<Layout title="物业楼宇 - 浙江贝凡网络科技" activeNav="property">
|
||||||
|
<main class="pt-20">
|
||||||
|
<PropertyHero />
|
||||||
|
<PropertyPainPoints />
|
||||||
|
<PropertyArchitecture />
|
||||||
|
<PropertyFoundation />
|
||||||
|
<PropertyScenarios />
|
||||||
|
</main>
|
||||||
|
</Layout>
|
||||||
Reference in New Issue
Block a user