update:协议图片更新

This commit is contained in:
2021-10-18 00:19:18 +08:00
parent a1edd19cf0
commit bace5b529b
8 changed files with 234 additions and 248 deletions

View File

@@ -2,6 +2,7 @@
<div id="app">
<van-pull-refresh
v-model="isLoading"
loosing-text="释放完成刷新"
loading-text="正在刷新"
@refresh="onRefresh"
>
@@ -26,10 +27,7 @@ export default {
name: "App",
data() {
return {
startValue: "",
endValue: "",
mode: false,
count: 0,
isLoading: true
};
},
@@ -40,24 +38,11 @@ export default {
this.mode = false;
}
},
mounted() {
document.body.ontouchstart = e => {
this.startValue = e.changedTouches[0].pageY;
};
document.body.ontouchend = e => {
this.endValue = e.changedTouches[0].pageY;
if (
this.endValue - this.startValue > 50 &&
e.changedTouches[0].pageY === e.changedTouches[0].clientY
) {
}
};
},
mounted() {},
methods: {
logout() {
sessionStorage.setItem("mode", "normal");
$(".container").removeClass("old_container");
// $(".logout").css("display", "none");
this.mode = false;
$(".bottomContent").removeClass("old_bottomContent");
$("#app").removeClass("old_app2");
@@ -66,18 +51,15 @@ export default {
toOlderMode() {
sessionStorage.setItem("mode", "older");
$(".container").addClass("old_container");
// $(".logout").css("display", "none");
this.mode = true;
$(".bottomContent").addClass("old_bottomContent");
$("#app").addClass("old_app2");
// $("#app").removeClass("old_app");
},
onRefresh() {
setTimeout(() => {
this.$toast("刷新成功");
this.isLoading = false;
this.$children[0].$children[0].onInit();
}, 2000);
setTimeout(() => {
this.isLoading = false;
}, 1000);
}
}
};

Binary file not shown.

Before

Width:  |  Height:  |  Size: 207 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 894 B

View File

@@ -45,17 +45,14 @@
<!-- window图标 -->
<div>
<div class="projectIcon">
<img
src="@/assets/img/project.png"
style="width: 25px;height: 25px;"
/>
<img src="@/assets/img/project.png" />
</div>
<span class="projectTitle">{{ item.name }}</span>
</div>
<!-- 补偿协议图标 -->
<div class="projectRight">
<div>
<img src="@/assets/img/menu_yhxy.png" />
<img src="@/assets/img/yhxy.png" />
</div>
<span>{{ item.currentState }}</span>
</div>
@@ -89,7 +86,6 @@
<img src="@/assets/img/project_no.png" />
<span>征收决定号</span>
</div>
<div class="blue">{{ item.zsjdh }}</div>
</div>
</div>
@@ -185,7 +181,7 @@
</div>
</div>
<!-- 最后一行无边框 -->
<div style="padding-bottom: 10px" v-else>
<div v-else style="padding-bottom: 10px">
<div>{{ item.title }}</div>
<div>
<span>发布时间{{ item.publicTime }}</span>
@@ -209,7 +205,7 @@ export default {
return {
mode: false,
data: {
idCard: "52212112345678910",
idCard: "522121123456789102223",
userName: "加载中...",
policiesRegulationsLists: {
totalCount: 0,
@@ -226,8 +222,8 @@ export default {
prjList: [
{
name: "请求出错暂时没有可用数据",
currentState: "无数据",
area: "宁波市房屋建设管理办公室九号楼",
currentState: "处于什么阶段",
area: "宁波市房屋建设管理办公室九号楼项目办公室",
zsbm: "无数据",
year: "无数据",
zsjdh: "无数据",
@@ -505,40 +501,37 @@ export default {
}
// 最上面盒子
.topBox {
background: url(../assets/img/bg.png);
background-size: 100% auto;
background-repeat: no-repeat;
background: url(../assets/img/bg.png) no-repeat;
background-size: 100% 96%;
.olderVersion {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 0;
.titleBox {
width: 173px;
height: 36px;
line-height: 36px;
text-align: center;
border-radius: 0 22px 22px 0;
background: #2576ca;
font-size: 16px;
font-weight: 600;
color: #ffffff;
}
:nth-child(2) {
margin-right: 5px;
background: #f82b36;
width: 124px;
height: 33px;
height: 25px;
text-align: center;
vertical-align: middle;
line-height: 33px;
line-height: 25px;
border-radius: 2px;
font-size: 18px;
font-weight: 600;
color: #ffffff;
}
}
.titleBox {
display: flex;
align-items: center;
justify-content: center;
width: 173px;
height: 36px;
border-radius: 0 22px 22px 0;
background: rgba(6, 63, 142, 0.66);
font-size: 16px;
font-weight: 600;
color: #ffffff;
}
.baseInfo {
display: flex;
margin: 5px 0;
@@ -549,17 +542,15 @@ export default {
padding-right: 10px;
padding-left: 31px;
}
> span:nth-child(2) {
span:nth-child(2) {
white-space: nowrap;
}
}
.gridBg {
display: flex;
align-items: center;
justify-content: space-around;
margin: 10px 12px 0 10px;
border-radius: 3px;
background: rgba(255, 255, 255, 0.28);
> div {
@@ -594,11 +585,8 @@ export default {
align-items: center;
justify-content: space-between;
height: 41px;
padding: unset 0;
background: url(../assets/img/project_bg.png) no-repeat;
background-position: 0 -2px;
background-size: 100% 120%;
> div:nth-child(1) {
background: url(../assets/img/project_bg.png) no-repeat 0 -2px/101% 120%;
> :nth-child(1) {
display: flex;
align-items: center;
width: 50%;
@@ -612,6 +600,10 @@ export default {
margin-right: 10px;
border-radius: 5px 0 0;
background: #3284cd;
img {
width: 25px;
height: 25px;
}
}
span {
white-space: nowrap;
@@ -628,13 +620,12 @@ export default {
height: 27px;
display: flex;
align-items: center;
border-radius: 13px 0 0 17px;
}
border-radius: 13px 0 0 13px;
img {
width: 17px;
height: 17px;
margin-right: 3px;
margin-left: 8px;
margin-left: 10px;
}
}
span {
font-size: 12px;
@@ -662,6 +653,7 @@ export default {
display: flex;
align-items: flex-start;
padding-top: 15px;
line-height: 20px;
> :nth-child(1) {
display: flex;
align-items: center;
@@ -677,7 +669,7 @@ export default {
}
> :last-child {
color: #363a44;
width: 55%;
// width: 55%;
}
.blue {
color: #3883f1;
@@ -711,6 +703,7 @@ export default {
align-items: flex-start;
justify-content: space-between;
padding-left: 12px;
line-height: 20px;
:nth-child(1) {
white-space: nowrap;
color: #b3b5b9;
@@ -727,7 +720,7 @@ export default {
display: flex;
align-items: center;
height: 25px;
padding: 0px 10px 0px;
padding: 0 10px;
.van-image {
width: 24px;
height: 24px;
@@ -749,6 +742,7 @@ export default {
align-items: flex-start;
justify-content: space-between;
padding-left: 12px;
line-height: 20px;
:nth-child(1) {
white-space: nowrap;
color: #b3b5b9;
@@ -771,7 +765,7 @@ export default {
color: #202020;
display: block;
}
> span:nth-child(2) {
:nth-child(2) {
margin: 10px 0;
color: #2c2b2b;
font-size: 12px;
@@ -785,29 +779,24 @@ export default {
.protocolList {
padding: 0 20px;
> div {
> div:nth-child(1) {
> :nth-child(1) {
font-size: 14px;
font-weight: 400;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
// width: 294px;
font-family: PingFangSC-Regular, PingFang SC;
color: #202020;
padding-top: 20px;
}
> div:nth-child(2) {
padding: unset 5px;
> :nth-child(2) {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px 0;
padding: 18px 0;
span {
font-size: 12px;
color: #9da2a3;
font-weight: 400;
line-height: 11px;
height: 11px;
}
}
}
@@ -815,23 +804,28 @@ export default {
}
// 老年化
.old_container {
.olderVersion {
.titleBox {
font-size: 24px;
width: 228px;
height: 41px;
line-height: 41px;
}
}
.baseInfo {
align-items: flex-start;
font-size: 22px;
img {
height: 30px;
padding-left: 15px;
}
> div:nth-child(3) {
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
}
}
.gridBg {
margin-left: 4px;
margin-right: 4px;
font-size: 20px;
> div {
width: 110px;
@@ -846,21 +840,21 @@ export default {
.projectTitle {
font-size: 24px;
}
> div:nth-child(1) {
> :nth-child(1) {
display: flex;
align-items: center;
height: 41px;
padding: unset 0;
width: 100%;
background: url(../assets/img/project_bg.png);
background-position: 0 -2px;
background-size: 100% 120%;
}
> div:nth-child(2) {
> :nth-child(2) {
margin-top: 10px;
> :nth-child(1) {
border-radius: unset !important;
padding-right: 5px;
}
> span {
font-size: 20px;
@@ -871,6 +865,7 @@ export default {
.projectCenterBox {
font-size: 20px;
> div {
line-height: 28px;
> :nth-child(1) {
:nth-child(2) {
width: unset !important;
@@ -882,24 +877,18 @@ export default {
}
}
}
.assess {
span {
font-size: 22px;
}
}
.assessCenter1 {
font-size: 20px;
.projectTitle {
font-size: 20px;
}
}
.assess,
.assess2 {
span {
font-size: 22px;
}
}
.assessCenter1,
.assessCenter2 {
font-size: 20px;
> div {
line-height: 28px;
}
.projectTitle {
font-size: 20px;
}
@@ -919,6 +908,7 @@ export default {
> div {
> :nth-child(1) {
font-size: 20px !important;
line-height: 28px;
padding-top: 15px !important;
white-space: unset !important;
}
@@ -929,7 +919,6 @@ export default {
font-size: 18px !important;
display: block;
height: unset !important;
line-height: 25px !important;
}
> span:nth-child(2) {
padding-top: 5px;

View File

@@ -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,79 +224,23 @@ 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;
> :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;
@@ -286,7 +252,6 @@ export default {
border-radius: 4px;
background: #09a4fa;
}
.proTitleBox {
font-family: PingFangSC-Regular, PingFang SC;
font-size: 15px;
@@ -301,41 +266,60 @@ export default {
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 {
.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>

View File

@@ -13,28 +13,28 @@
<el-card body-style="padding:0 4px 0">
<div>
<img alt src="@/assets/img/bianhao.png" />
<span>协议编号</span>
<span>协议编号</span>
<b>{{ item.xyNo }}</b>
</div>
<div>
<img alt src="@/assets/img/name.png" />
<span> 被征收人姓名</span>
<span> 被征收人姓名</span>
<b>{{ info.userName }}</b>
</div>
<div>
<img alt src="@/assets/img/address.png" />
<span> 协议类型</span>
<span> 协议类型</span>
<b>{{ item.switchProductionWay }}</b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
<span> 评估总金额</span>
<span> 评估总金额</span>
<b class="blue">{{ item.countValue }}</b>
<b></b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
<span>合计补偿金额</span>
<span>合计补偿金额</span>
<b class="red">{{ item.summationShouldCompensateMoney }}</b>
<b></b>
</div>
@@ -139,7 +139,6 @@ export default {
.image {
padding-top: 10px;
text-align: center;
// height: 500px;
img {
width: 95%;
}
@@ -221,7 +220,8 @@ export default {
}
> div {
> span {
width: unset !important;
width: 109px !important;
margin-right: 20px;
}
}
}

View File

@@ -240,8 +240,20 @@ export default {
}
.old_container {
font-size: 20px;
.top {
padding: 10px 15px 10px 10px;
> div {
line-height: 34px;
> div {
img {
margin-right: 5px;
}
}
}
}
.el-card__body {
> div {
line-height: 34px;
> span:nth-child(2) {
font-size: 20px !important;
}

View File

@@ -31,13 +31,13 @@
</div>
<div>
<img alt src="@/assets/img/address.png" />
<span>被征收房屋地址</span>
<span>被征收房屋坐落</span>
<b>{{ item.houseAddress }}</b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
<span> 评估总金额</span>
<b style="color: red;font-size:18px">{{ item.countValue }}</b
<b class="red">{{ item.countValue }}</b
><b></b>
</div>
<div class="line">
@@ -83,13 +83,13 @@
</div>
<div>
<img alt src="@/assets/img/address.png" />
<span>被征收房屋地址</span>
<span>被征收房屋坐落</span>
<b>{{ item.houseAddress }}</b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
<span> 评估总金额</span>
<b style="color: red;font-size:18px">{{ item.countValue }}</b
<b class="red">{{ item.countValue }}</b
><b></b>
</div>
<div class="line">
@@ -257,8 +257,11 @@ export default {
color: #363a44;
max-width: 57%;
}
.red {
color: red;
font-size: 18px;
}
}
.absolute {
background-color: #f7be24;
position: absolute;
@@ -304,9 +307,25 @@ export default {
}
.old_container {
font-size: 18px;
.title {
span {
font-size: 20px;
}
}
.el-card__body {
> div {
font-size: 18px !important;
line-height: 25px !important;
> img:nth-child(1) {
padding-top: 3px;
}
> span:nth-child(2) {
width: unset !important;
white-space: nowrap;
}
> :nth-child(3) {
max-width: unset !important;
}
}
.content {
display: block !important;