This commit is contained in:
张成
2026-04-28 16:05:41 +08:00
parent 6e394297b3
commit 335a513571
4 changed files with 73 additions and 50 deletions

View File

@@ -1,6 +1,17 @@
// 通用样式 - LESS版本 // 通用样式 - LESS版本
@import './variables.less'; @import './variables.less';
/* 为固定头部预留统一顶部空间 */
body {
padding-top: 120px;
}
@media (max-width: 768px) {
body {
padding-top: 100px;
}
}
.scrollToContentWrapper { .scrollToContentWrapper {
height: 6em; height: 6em;
text-align: center; text-align: center;

View File

@@ -244,6 +244,13 @@ export default {
height: auto; height: auto;
} }
.header .content {
max-width: 1180px;
margin: 0 auto;
padding: 0 24px;
box-sizing: border-box;
}
.nav-container { .nav-container {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
@@ -253,7 +260,7 @@ export default {
.logoCell { .logoCell {
flex-shrink: 0; flex-shrink: 0;
margin: 0px 40px; margin: 0 32px 0 0;
} }
.logoCell .logo { .logoCell .logo {
@@ -509,11 +516,7 @@ export default {
} }
.header .content { .header .content {
padding: 0 1em; padding: 0 16px;
}
body {
padding-top: 100px;
} }
.nav-container { .nav-container {
@@ -557,11 +560,6 @@ export default {
} }
} }
/* 确保内容不被遮挡 */
body {
padding-top: 120px;
}
/* 使用逻辑属性实现更好的间距 */ /* 使用逻辑属性实现更好的间距 */
.nav-container { .nav-container {
gap: 2rem; gap: 2rem;

View File

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

View File

@@ -130,10 +130,12 @@ export default {
.page-banner { .page-banner {
position: relative; position: relative;
padding: 160px 0 86px; height: 440px;
color: #fff; color: #fff;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
display: flex;
align-items: center;
} }
.banner-content { .banner-content {
@@ -259,6 +261,10 @@ export default {
} }
@media (max-width: 992px) { @media (max-width: 992px) {
.page-banner {
height: 360px;
}
.services-grid, .services-grid,
.features { .features {
grid-template-columns: 1fr; grid-template-columns: 1fr;