update:协议图片更新
This commit is contained in:
@@ -10,20 +10,16 @@
|
||||
/>
|
||||
<div>
|
||||
<div>
|
||||
<span class="proCenterFont">被征收人姓名：</span>
|
||||
<span class="proCenterFont" style="color:#626262;">{{
|
||||
info.userName
|
||||
}}</span>
|
||||
<span>被征收人姓名：</span>
|
||||
<span style="color:#626262;">{{ info.userName }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="proCenterFont">身份证号：</span>
|
||||
<span class="proCenterFont" style="color:#626262;">{{
|
||||
setIdCard(info.idCard)
|
||||
}}</span>
|
||||
<span>身份证号：</span>
|
||||
<span style="color:#626262;">{{ setIdCard(info.idCard) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="proCenterFlex" style="margin-bottom: 15px;">
|
||||
<div class="proCenterFlex">
|
||||
<div class="proCenterFlexFont">请选择您的征收项目</div>
|
||||
<van-icon color="#9da2a3" name="arrow-down" />
|
||||
</div>
|
||||
@@ -41,15 +37,10 @@
|
||||
>
|
||||
<div class="proAreaBox">
|
||||
<div class="proArea">{{ item.area }}</div>
|
||||
<div
|
||||
class="proCenterFont"
|
||||
v-if="item.currentState == '补偿协议签订阶段'"
|
||||
>
|
||||
· {{ item.currentState }}
|
||||
</div>
|
||||
<div class="proCenterFont" style="color:#179D5C" v-else>
|
||||
<div v-if="item.currentState == '补偿协议签订阶段'">
|
||||
· {{ item.currentState }}
|
||||
</div>
|
||||
<div style="color:#179D5C" v-else>· {{ item.currentState }}</div>
|
||||
</div>
|
||||
<div class="proAreaBox">
|
||||
<div class="proTitleBox">{{ item.name }}</div>
|
||||
@@ -76,7 +67,7 @@ export default {
|
||||
// 初始数据
|
||||
info: {
|
||||
userName: "无数据",
|
||||
idCard: "无数据",
|
||||
idCard: "522121123456789102223",
|
||||
prjList: [
|
||||
{
|
||||
area: "无数据",
|
||||
@@ -168,25 +159,19 @@ export default {
|
||||
<style lang="less" scoped>
|
||||
.container {
|
||||
.proTopBoxpg {
|
||||
/* position: absolute; */
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
height: 220px;
|
||||
background: url(../../assets/img/zspg.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 90px;
|
||||
}
|
||||
|
||||
.proTopBoxxy {
|
||||
/* position: absolute; */
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
height: 220px;
|
||||
background: url(../../assets/img/zsxy.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 90px;
|
||||
}
|
||||
|
||||
.proCenterBox {
|
||||
overflow: hidden;
|
||||
width: 95%;
|
||||
@@ -194,6 +179,43 @@ export default {
|
||||
border-radius: 6px;
|
||||
background: rgba(248, 253, 255, 1);
|
||||
box-shadow: 1px 1px 3px rgb(202, 201, 201);
|
||||
.proCenterInfo {
|
||||
display: flex;
|
||||
padding-top: 20px;
|
||||
// align-items: center;
|
||||
> :nth-child(2) {
|
||||
> div:nth-child(2) {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
.proCenterImg {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
padding-right: 10px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
span {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #09a4fa;
|
||||
}
|
||||
}
|
||||
.proCenterFlex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding-top: 15px;
|
||||
margin-bottom: 15px;
|
||||
div {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
color: #9da2a3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.proList {
|
||||
@@ -202,140 +224,102 @@ export default {
|
||||
bottom: 0;
|
||||
overflow-y: scroll;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.proCenterInfo {
|
||||
display: flex;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.proCenterImg {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
padding-right: 10px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
/* 协议签订阶段 */
|
||||
|
||||
.proCenterFont {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
color: #09a4fa;
|
||||
}
|
||||
|
||||
.proCenterFlex {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
.proCenterFlexImg {
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
padding-top: 3px;
|
||||
padding-right: 10px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
.proCenterFlexFont {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
color: #9da2a3;
|
||||
}
|
||||
|
||||
.shadow {
|
||||
-webkit-box-shadow: rgb(189, 189, 189) 0 0 3px;
|
||||
-moz-box-shadow: rgb(189, 189, 189) 0 0 3px;
|
||||
box-shadow: rgb(189, 189, 189) 0 0 3px;
|
||||
}
|
||||
|
||||
.proListBox {
|
||||
margin: 15px 20px;
|
||||
border-radius: 3px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
/* 项目名字 */
|
||||
|
||||
.proAreaBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* 项目地区 */
|
||||
|
||||
.proArea {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
padding: 3px 17px;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
background: #09a4fa;
|
||||
}
|
||||
|
||||
.proTitleBox {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
line-height: 20px;
|
||||
overflow: hidden;
|
||||
height: 20px;
|
||||
margin-left: 10px;
|
||||
padding-left: 7px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #252525;
|
||||
border-left: 3px solid #09a4fa;
|
||||
}
|
||||
|
||||
/* 底部日期 */
|
||||
|
||||
.proDateBox {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
padding-right: 10px;
|
||||
font-size: 12px;
|
||||
.proListBox {
|
||||
margin: 15px 20px;
|
||||
border-radius: 3px;
|
||||
background-color: #fff;
|
||||
.proAreaBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px;
|
||||
font-size: 16px;
|
||||
> :nth-child(n + 2) {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
color: #09a4fa;
|
||||
}
|
||||
.proArea {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
padding: 3px 17px;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
background: #09a4fa;
|
||||
}
|
||||
.proTitleBox {
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
line-height: 20px;
|
||||
overflow: hidden;
|
||||
height: 20px;
|
||||
margin-left: 10px;
|
||||
padding-left: 7px;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #252525;
|
||||
border-left: 3px solid #09a4fa;
|
||||
}
|
||||
}
|
||||
.proDateBox {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
padding-right: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
.shadow {
|
||||
-webkit-box-shadow: rgb(189, 189, 189) 0 0 3px;
|
||||
-moz-box-shadow: rgb(189, 189, 189) 0 0 3px;
|
||||
box-shadow: rgb(189, 189, 189) 0 0 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.old_container {
|
||||
.proCenterFont {
|
||||
font-size: 20px !important;
|
||||
.proCenterInfo {
|
||||
.proCenterImg {
|
||||
margin-top: 10px;
|
||||
}
|
||||
span {
|
||||
font-size: 20px !important;
|
||||
}
|
||||
> div:nth-child(2) {
|
||||
> :nth-child(2) {
|
||||
display: flex;
|
||||
span:nth-child(1) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
span:nth-child(2) {
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.proCenterFlexFont {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
|
||||
.proArea,
|
||||
.proTitleBox {
|
||||
font-size: 22px !important;
|
||||
}
|
||||
.proTitleBox {
|
||||
height: unset !important;
|
||||
line-height: unset;
|
||||
line-height: unset !important;
|
||||
}
|
||||
.proAreaBox {
|
||||
> :nth-child(2) {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
> :nth-child(3) {
|
||||
> :nth-child(n + 2) {
|
||||
font-size: 18px !important;
|
||||
}
|
||||
}
|
||||
.proDateBox {
|
||||
font-size: 18px;
|
||||
font-size: 18px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user