refactor(home): 重构首页生态服务布局

- 调整生态服务板块的 HTML 结构,优化布局
- 修改相关 CSS样式,提升视觉效果
- 优化 getUrl 函数,使用环境变量动态生成域名
This commit is contained in:
陈昱达
2025-07-14 17:14:21 +08:00
parent df0f900140
commit 4cd94baea0
2 changed files with 54 additions and 27 deletions

View File

@@ -3,7 +3,7 @@ import config from '@/config'
export default function getUrl(url, domainType = 'admin') {
let domain = process.env.VUE_APP_ADMIN || ''
return 'https://ecotest.happyinsurance.com.cn:4443/api/' + url
return domain + url
}
export function getParamsFromUrl(url) {

View File

@@ -116,26 +116,35 @@ export default {
<img :src="require('@/assets/images/sunful/sunful-eco.svg')" alt="生态服务">
<div>生态服务</div>
</h3>
<div class="flex">
<div class="service-item health">
<h4>健康管理</h4>
<p>&nbsp;</p>
<button class="go-btn" @click="goEcosystem(1, true)">去看看</button>
</div>
<div class="flex flex-column">
<div class="service-item children">
<h4>子女教育</h4>
<p>&nbsp;</p>
<button class="go-btn-v" @click="goEcosystem(38)">去看看</button>
</div>
<div class="service-item wealth">
<h4>财务管理</h4>
<p>&nbsp;</p>
<button class="go-btn-v" @click="goEcosystem(48)">去看看</button>
</div>
</div>
<div class='ecosy-container flex'>
<div class='health'>
<div class='health-box'>
<h4 class='mt85'>健康管理</h4>
<p>&nbsp;</p>
<button class="go-btn" @click="goEcosystem(1, true)">去看看</button>
</div>
</div>
<div class=''>
<div class='children'>
<div class="box">
<h4>子女教育</h4>
<p>&nbsp;</p>
<button class="go-btn-v" @click="goEcosystem(38)">去看看</button>
</div>
</div>
<div class='wealth mt10'>
<div class='box'>
<h4>财务管理</h4>
<p>&nbsp;</p>
<button class="go-btn-v" @click="goEcosystem(48)">去看看</button>
</div>
</div>
</div>
</div>
</div>
<div class="flex service-row">
@@ -363,7 +372,7 @@ $bg-color: #f5f5f5;
}
}
.health {
.health {
// border-radius: 15px;
// border-right: 2px solid #fce4e4;
// // border-bottom: 2px solid #fce4e4;
@@ -373,11 +382,16 @@ $bg-color: #f5f5f5;
background-repeat: no-repeat;
background-position: left top;
padding: 86px 0 0 11px;
width: 37%;
//padding: 86px 0 0 11px;
width:133px;
height: 175px;
margin-right: 10px;
}
}
.health-box{
margin-top: 85px;
margin-left: 20px;
}
.children,
.wealth {
background-image: url("../../assets/images/sunful/hat.webp");
@@ -388,7 +402,15 @@ $bg-color: #f5f5f5;
display: flex;
flex-flow: column;
align-items: flex-start;
padding: 18px 0 0 77px;
//padding: 18px 0 0 77px;
width: 211px;
height: 82px;
.box{
margin-top: 17px;
margin-left: 76px;
}
h4 {
text-align: center;
@@ -396,7 +418,7 @@ $bg-color: #f5f5f5;
p {
margin-top: 8px;
margin-bottom: 7px;
margin-bottom: 2px;
}
button {
@@ -408,7 +430,7 @@ $bg-color: #f5f5f5;
}
.wealth {
transform: translateY(-18px);
//transform: translateY(-18px);
background-image: url("../../assets/images/sunful/treasure.webp");
@@ -461,9 +483,14 @@ $bg-color: #f5f5f5;
&.service-row {
gap: 10px;
margin-top: -20px;
margin-top: 12px;
justify-content: center;
align-items: center;
}
}
.ecosy-container{
}
</style>