diff --git a/src/assets/css/common.less b/src/assets/css/common.less index 4fb717a..b7ac880 100644 --- a/src/assets/css/common.less +++ b/src/assets/css/common.less @@ -1,6 +1,17 @@ // 通用样式 - LESS版本 @import './variables.less'; +/* 为固定头部预留统一顶部空间 */ +body { + padding-top: 120px; +} + +@media (max-width: 768px) { + body { + padding-top: 100px; + } +} + .scrollToContentWrapper { height: 6em; text-align: center; diff --git a/src/components/ihead.vue b/src/components/ihead.vue index 2619b8e..b2f35c0 100644 --- a/src/components/ihead.vue +++ b/src/components/ihead.vue @@ -244,6 +244,13 @@ export default { height: auto; } +.header .content { + max-width: 1180px; + margin: 0 auto; + padding: 0 24px; + box-sizing: border-box; +} + .nav-container { display: flex; justify-content: flex-start; @@ -253,7 +260,7 @@ export default { .logoCell { flex-shrink: 0; - margin: 0px 40px; + margin: 0 32px 0 0; } .logoCell .logo { @@ -509,11 +516,7 @@ export default { } .header .content { - padding: 0 1em; - } - - body { - padding-top: 100px; + padding: 0 16px; } .nav-container { @@ -557,11 +560,6 @@ export default { } } -/* 确保内容不被遮挡 */ -body { - padding-top: 120px; -} - /* 使用逻辑属性实现更好的间距 */ .nav-container { gap: 2rem; diff --git a/src/views/index.vue b/src/views/index.vue index e18ff79..b46d4c8 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -123,7 +123,7 @@

案例成果

-

结合本地项目经验整理，以下案例已做脱敏处理，方便快速了解场景、交付内容与结果。

+

以下案例已脱敏展示，快速查看场景、交付与结果。

@@ -138,10 +138,8 @@

{{item.title}}

-

{{item.intro}}

项目问题{{item.problem}}
-
交付内容{{item.solution}}
{{item.result}}
@@ -393,9 +391,9 @@ export default { industry: '制造业', image: boxbg_cleaning, url: '/ourPlan/aiSolutions', - intro: '面向设备运维团队，沉淀故障经验、处理记录与备件信息，减少重复排查成本。', - problem: '故障定位依赖人工经验，跨班组复盘难。', - solution: '设备知识库、工单归因看板、相似问题检索。', + intro: '沉淀故障经验与工单数据，降低重复排查成本。', + problem: '故障定位依赖经验，跨班组复盘困难。', + solution: '建设知识库、归因看板与相似问题检索。', result: '故障定位平均耗时下降38%，重复问题处理时间下降42%。' }, { @@ -403,9 +401,9 @@ export default { industry: '商业园区', image: boxbg_smartbuildings, url: '/ourPlan/estateManagement', - intro: '将空间、设备、巡检和报修数据统一呈现，帮助管理方掌握现场运行状态。', - problem: '巡检、报修和供应商协同分散，缺少实时视图。', - solution: '设备台账、巡检计划、异常告警与运营看板。', + intro: '统一空间、设备和工单数据，提升运营可视化。', + problem: '巡检与报修协同分散，缺少实时视图。', + solution: '搭建设备台账、巡检计划与告警看板。', result: '工单闭环效率提升35%，月度人工汇总工作量减少60%。' }, { @@ -413,9 +411,9 @@ export default { industry: '零售连锁', image: boxbg_iot, url: '/ourPlan/iot', - intro: '接入门店关键设备状态，形成区域维度的运行统计、异常提醒和巡检闭环。', - problem: '设备状态不可视，能耗和异常处理依赖人工反馈。', - solution: '设备接入、阈值告警、区域统计与移动端巡检。', + intro: '接入门店关键设备，形成区域运行统计与预警。', + problem: '设备状态不可视，异常依赖人工反馈。', + solution: '实现设备接入、阈值告警和移动巡检。', result: '异常发现时间缩短70%，单店巡检记录完整率提升至96%。' }, { @@ -423,9 +421,9 @@ export default { industry: '物业与设施运营', image: boxbg_facilitiesmanagement, url: '/ourPlan/facilityManagement', - intro: '围绕报修、保养、派单和验收搭建统一流程，提升设施团队跨角色协作效率。', - problem: '报修入口分散，保养计划和执行记录难追踪。', - solution: '统一工单入口、保养计划、移动处理与验收报表。', + intro: '统一报修、保养与验收流程，提升协同效率。', + problem: '报修入口分散，保养执行难追踪。', + solution: '统一工单入口并联动移动处理与验收报表。', result: '平均响应效率提升32%，计划保养覆盖率提升至91%。' } ], @@ -1016,8 +1014,8 @@ export default { .case-card { display: grid; - grid-template-columns: 42% 1fr; - min-height: 360px; + grid-template-columns: 48% 1fr; + min-height: 280px; overflow: hidden; padding: 0; } @@ -1052,7 +1050,7 @@ export default { .case-body { display: flex; flex-direction: column; - padding: 28px; + padding: 18px 18px 16px; } .case-topline { @@ -1060,7 +1058,7 @@ export default { align-items: center; justify-content: space-between; gap: 12px; - margin-bottom: 18px; + margin-bottom: 8px; } .case-industry { @@ -1097,30 +1095,22 @@ export default { } .case-card h3 { - margin: 0 0 12px; + margin: 0 0 6px; color: #101828; - font-size: 20px; - line-height: 1.4; -} - -.case-intro { - min-height: 78px; - margin: 0 0 18px; - color: #667085; - font-size: 15px; - line-height: 1.75; + font-size: 17px; + line-height: 1.35; } .case-meta { display: grid; - gap: 12px; - margin-bottom: 20px; + gap: 6px; + margin-bottom: 8px; } .case-meta div { display: grid; gap: 4px; - padding-top: 12px; + padding-top: 6px; border-top: 1px solid #eef2f7; } @@ -1132,18 +1122,26 @@ export default { .case-meta span { color: #667085; - font-size: 14px; - line-height: 1.65; + font-size: 13px; + line-height: 1.55; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; } .case-result { margin-top: auto; - padding-top: 18px; + padding-top: 8px; border-top: 1px solid #eef2f7; color: #101828; - font-size: 16px; + font-size: 13px; font-weight: 700; - line-height: 1.6; + line-height: 1.45; + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; + overflow: hidden; } .compact-about { @@ -1296,6 +1294,16 @@ export default { .advantage-item { padding: 26px 0; } + + .case-card { + grid-template-columns: 1fr; + min-height: auto; + } + + .case-image { + height: 210px; + min-height: 210px; + } } @media (max-width: 768px) { diff --git a/src/views/ourPlan/ourPlan.vue b/src/views/ourPlan/ourPlan.vue index 6d51861..0afa898 100644 --- a/src/views/ourPlan/ourPlan.vue +++ b/src/views/ourPlan/ourPlan.vue @@ -130,10 +130,12 @@ export default { .page-banner { position: relative; - padding: 160px 0 86px; + height: 440px; color: #fff; text-align: center; overflow: hidden; + display: flex; + align-items: center; } .banner-content { @@ -259,6 +261,10 @@ export default { } @media (max-width: 992px) { + .page-banner { + height: 360px; + } + .services-grid, .features { grid-template-columns: 1fr;