ewide/zsxt_nbzs_h5
22
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update:样式更新

Browse Source
This commit is contained in:
lisl
2021-10-12 13:26:36 +08:00
parent b767a81f09
commit 30892a757e
6 changed files with 148 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
FrontCode2/sunshine_levy/src/views/index.vue
View File

@@ -7,36 +7,38 @@
element-loading-background=" rgba(118,118,118)"
>
<div class="topBox">
<div class="titleBox">
被征收人信息查询
<div style="padding:15px 0">
<div class="titleBox">
被征收人信息查询
</div>
</div>
<div class="baseInfo">
<van-image :src="require('@/assets/img/renyuanliebiao.png')" />
<img src="@/assets/img/renyuanliebiao.png" />
<span>被征收人姓名：{{ data.userName }}</span>
</div>
<div class="baseInfo">
<van-image :src="require('@/assets/img/credentials_icon.png')" />
<img src="@/assets/img/credentials_icon.png" />
<span>身份证号码：{{ setIdCard(data.idCard) }}</span>
</div>
<!-- 三张背景图 -->
<div class="gridBg ">
<div style="background:#1897FB;">
<van-image :src="require('@/assets/img/scan.png')" />
<img src="@/assets/img/scan.png" />
<span>扫一扫</span>
</div>
<div @click="gotoProject('pg')" style="background:#F1AE4B;">
<van-image :src="require('@/assets/img/evaluation.png')" />
<img src="@/assets/img/evaluation.png" />
<span>查评估结果</span>
</div>
<div @click="gotoProject('xy')" style="background:#16D7ED;">
<van-image :src="require('@/assets/img/compensation.png')" />
<img src="@/assets/img/compensation.png" />
<span>查补偿协议</span>
</div>
</div>
</div>
<!-- 大背景图 -->
<div>
<van-image :src="require('@/assets/img/government.png')" />
<div class="bigImage">
<img src="@/assets/img/government.png" />
</div>
<!-- 项目内容 -->
<div :key="item.prjId" v-for="item in data.prjList">
@@ -61,26 +63,33 @@
<!-- 项目内容 -->
<div class="projectCenterBox">
<div>
<img src="@/assets/img/project_area.png" />
<span>项目所在区域：</span>
<div>
<img src="@/assets/img/project_area.png" />
<span>项目所在区域：</span>
</div>
<div>{{ item.area }}</div>
</div>
<div>
<img src="@/assets/img/project_dep.png" />
<span>征收部门：</span>
<div>
<img src="@/assets/img/project_dep.png" />
<span>征收部门：</span>
</div>
<div>{{ item.zsbm }}</div>
</div>
<div>
<img src="@/assets/img/project_year.png" />
<span>所属年份：</span>
<div>
<img src="@/assets/img/project_year.png" />
<span>所属年份：</span>
</div>
<div>{{ item.year }}</div>
</div>
<div>
<img src="@/assets/img/project_no.png" />
<span>征收决定号：</span>
<span style="color: #3883f1">
{{ item.zsjdh }}
</span>
<div>
<img src="@/assets/img/project_no.png" />
<span>征收决定号：</span>
</div>
<div class="blue">{{ item.zsjdh }}</div>
</div>
</div>
<!-- 分户评估结果部分 -->
@@ -212,7 +221,7 @@ export default {
{
name: "请求出错暂时没有可用数据",
currentState: "无数据",
area: "宁波市房屋建设和建筑管理局办公室",
area: "宁波市房屋建设管理办公室九号楼",
zsbm: "无数据",
year: "无数据",
zsjdh: "无数据",
@@ -459,25 +468,21 @@ export default {
background: #f6f7f8;
padding-bottom: 20px;
> div:nth-child(n + 2) {
margin-top: 10px;
margin-right: 12px;
margin-left: 10px;
margin: 10px 12px 0 10px;
}
}
// 最上面盒子
.topBox {
overflow: hidden;
width: 100%;
height: 225px;
background: url(../assets/img/bg.png);
background-size: 100% 225px;
background-size: 100% auto;
background-repeat: no-repeat;
.titleBox {
display: flex;
align-items: center;
justify-content: center;
width: 173px;
height: 36px;
margin: 15px 0 15px 0;
border-radius: 0 22px 22px 0;
background: rgba(6, 63, 142, 0.66);
font-size: 16px;
@@ -487,7 +492,8 @@ export default {
.baseInfo {
display: flex;
margin: 5px 0;
.van-image {
align-items: center;
img {
height: 21px;
padding-right: 10px;
padding-left: 31px;
@@ -498,11 +504,11 @@ export default {
}
.gridBg {
display: flex;
overflow: hidden;
align-items: center;
justify-content: space-around;
margin: 10px 12px 0 10px;
height: 120px;
border-radius: 3px;
background: rgba(255, 255, 255, 0.28);
> div {
@@ -512,24 +518,25 @@ export default {
justify-content: center;
width: 90px;
height: 80px;
margin: 12px 6px;
padding-top: 5px;
margin: 20px 0 10px;
border-radius: 10px;
.van-image {
width: 38px;
img {
height: 35px;
}
span {
padding-top: 5px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
line-height: 20px;
height: 20px;
color: #fff;
}
}
}
}
// 大背景图
.bigImage {
img {
width: 100%;
}
}
// 项目部分
.project {
display: flex;
@@ -597,22 +604,30 @@ export default {
.projectCenterBox {
> div {
display: flex;
align-items: center;
align-items: flex-start;
padding-top: 15px;
img {
height: 15px;
padding: 0 10px;
> :nth-child(1) {
display: flex;
align-items: center;
img {
height: 15px;
padding: 0 10px;
}
:nth-child(2) {
font-weight: 400;
color: #b3b5b9;
width: 106px;
}
}
span {
font-weight: 400;
color: #b3b5b9;
white-space: nowrap;
}
div {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
> :last-child {
color: #363a44;
width: 55%;
}
.blue {
color: #3883f1;
}
}
}
@@ -640,20 +655,20 @@ export default {
font-weight: 400;
> div {
display: flex;
align-items: center;
align-items: flex-start;
justify-content: space-between;
padding-left: 12px;
span {
:nth-child(1) {
white-space: nowrap;
color: #b3b5b9;
}
> span:nth-child(2) {
:nth-child(2) {
overflow: hidden;
text-overflow: ellipsis;
color: #363a44;
}
}
> div:nth-child(2) {
> :nth-child(2) {
margin: 15px 0;
}
}
@@ -669,7 +684,6 @@ export default {
background: #2468f2;
}
span {
font-family: PingFangSC-Regular, PingFang SC;
font-size: 16px;
font-weight: 400;
color: #2468f2;
@@ -681,14 +695,14 @@ export default {
font-weight: 400;
> div {
display: flex;
align-items: center;
align-items: flex-start;
justify-content: space-between;
padding-left: 12px;
span {
:nth-child(1) {
white-space: nowrap;
color: #b3b5b9;
}
> span:nth-child(2) {
:nth-child(2) {
overflow: hidden;
text-overflow: ellipsis;
color: #363a44;