This commit is contained in:
路 范
2021-09-10 15:12:38 +08:00
52 changed files with 2232 additions and 265 deletions

View File

@@ -1,103 +0,0 @@
<template>
<div class="container">
<div class="image"><img src="@/assets/image/agreement.png" alt="" /></div>
<div class="text">为您查询到{{ this.result }}条结果</div>
<div v-for="(item, index) in info" :key="index">
<el-card>
<div>
<img src="@/assets/image/bianhao.png" alt="" />
评估报告编号<b>{{ item.number }}</b>
</div>
<div>
<img src="@/assets/image/name.png" alt="" />
被征收人姓名<b>{{ item.name }}</b>
</div>
<div>
<img src="@/assets/image/address.png" alt="" />
被征收人房屋地址<b>{{ item.address }}</b>
</div>
<div>
<img src="@/assets/image/money.png" alt="" />
评估总金额<b style="color: red">{{ item.money }}</b>
</div>
<div>
<img src="@/assets/image/money.png" alt="" />
合计补偿金额<b style="color: red">{{ item.money }}</b>
</div>
<div>
<img src="@/assets/image/hengxian.png" alt="" />
</div>
<div class="date">
<div class="flex backgroundColor">
<img src="@/assets/image/shijian.png" alt="" />
签订日期{{ item.time }}
</div>
</div>
</el-card>
</div>
</div>
</template>
<script>
export default {
data() {
return {
result: "2",
info: [
{
number: "044",
name: "胡守钧",
address: "宁波市江北区四洲街16号404",
money: "180234元",
person: "王勇",
time: "2021-9-1",
},
{
number: "044",
name: "胡守钧",
address: "宁波市江北区四洲街16号404",
money: "180234元",
person: "王勇",
time: "2021-9-1",
},
],
};
},
created() {
console.log(1234);
},
};
</script>
<style lang="less" scoped>
.container {
.image {
text-align: center;
margin-top: 20px;
}
.text {
text-align: center;
margin: 10px 0;
color: #2d6df2;
font-weight: bolder;
}
.el-card {
margin: 0 10px 10px;
::v-deep.el-card__body {
padding: 0 10px;
> div {
margin: 10px 0;
}
.date {
display: flex;
justify-content: center;
.backgroundColor {
background-color: #e3ebfd;
img {
margin-right: 10px;
}
}
}
}
}
}
</style>

View File

@@ -1,96 +0,0 @@
<template>
<div class="container">
<div class="image"><img src="@/assets/image/evalute.png" alt="" /></div>
<div class="text">为您查询到{{ this.result }}条结果</div>
<div v-for="(item, index) in info" :key="index">
<el-card>
<div>
<img src="@/assets/image/bianhao.png" alt="" />
评估报告编号<b>{{ item.number }}</b>
</div>
<div>
<img src="@/assets/image/name.png" alt="" />
被征收人姓名<b>{{ item.name }}</b>
</div>
<div>
<img src="@/assets/image/address.png" alt="" />
被征收人房屋地址<b>{{ item.address }}</b>
</div>
<div>
<img src="@/assets/image/money.png" alt="" />
评估总金额<b style="color: red">{{ item.money }}</b>
</div>
<div class="flex">
<div class="flex backgroundColor">
<img src="@/assets/image/renyuan.png" alt="" />
评估人员{{ item.person }}
</div>
<div class="flex backgroundColor">
<img src="@/assets/image/shijian.png" alt="" />
评估时间{{ item.time }}
</div>
</div>
</el-card>
</div>
</div>
</template>
<script>
export default {
data() {
return {
result: "2",
info: [
{
number: "044",
name: "胡守钧",
address: "宁波市江北区四洲街16号404",
money: "180234元",
person: "王勇",
time: "2021-9-1",
},
{
number: "044",
name: "胡守钧",
address: "宁波市江北区四洲街16号404",
money: "180234元",
person: "王勇",
time: "2021-9-1",
},
],
};
},
created() {
console.log(1234);
},
};
</script>
<style lang="less" scoped>
.container {
.image {
text-align: center;
margin-top: 20px;
}
.text {
text-align: center;
margin: 10px 0;
color: #2d6df2;
font-weight: bolder;
}
.el-card {
margin: 0 10px 10px;
::v-deep.el-card__body {
padding: 0 10px;
> div {
margin: 10px 0;
}
.backgroundColor {
background-color: #e3ebfd;
img {
margin-right: 10px;
}
}
}
}
}
</style>

View File

@@ -0,0 +1,276 @@
.page {
border-radius: 6px;
background: #f2fbfd;
}
.topBox {
overflow: hidden;
width: 100%;
height: 225px;
background: url(../assets/img/bg.png);
background-size: 100% 225px;
}
.titleBox {
display: flex;
align-items: center;
justify-content: center;
width: 173px;
height: 36px;
margin: 15px 0 15px 2px;
border-radius: 0 22px 22px 0;
background: rgba(6, 63, 142, .66);
}
.font {
font-family: PingFangSC-Semibold, PingFang SC;
font-size: 16px;
font-weight: 600;
line-height: 22px;
width: 167px;
height: 22px;
padding: 3px 7px 3px 7px;
text-align: center;
vertical-align: middle;
color: #fff;
}
.baseInfo {
display: flex;
}
.baseImg {
width: 22px;
height: 21px;
padding-right: 10px;
padding-left: 31px;
}
.baseFont {
font-family: PingFangSC-Medium, PingFang SC;
font-size: 14px;
font-weight: 500;
line-height: 20px;
height: 20px;
color: #fff;
}
.centerMagin {
margin-top: 10px;
margin-right: 12px;
margin-left: 16px;
}
.gridBg {
display: flex;
overflow: hidden;
justify-content: space-around;
height: 114px;
border-radius: 3px;
background: rgba(255, 255, 255, .28);
}
.gridImg {
width: 90px;
height: 80px;
margin: 12px 6px;
opacity: .9;
}
.gridImg:hover {
opacity: 1;
}
.bigImg {
width: 100%;
height: 91px;
}
.project {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
height: 41px;
padding-right: 0;
padding-left: 0;
background: url(../assets/img/project_bg.png);
background-size: 100% 41px;
}
.projectIcon {
width: 40px;
height: 39px;
vertical-align: middle;
border-radius: 5px 0 0 0;
background: #3284cd;
}
.projectTitle {
font-family: PingFangSC-Semibold,
PingFang SC;
font-size: 16px;
font-weight: 600;
line-height: 20px;
height: 20px;
vertical-align: middle;
color: #fff;
}
.projectRight {
display: flex;
align-items: center;
width: 95px;
height: 27px;
opacity: .82;
border-radius: 13px 0 0 17px;
background: #24bca3;
}
.projectRightFont {
font-family: PingFangSC-Semibold,
PingFang SC;
font-size: 10px;
font-weight: 600;
line-height: 14px;
height: 17px;
color: #fff;
}
.projectRightIcon {
width: 17px;
height: 17px;
margin-right: 3px;
margin-left: 8px;
}
.projectCenter {
height: 440px;
padding-bottom: 35px;
background: #fff;
box-shadow: 0 2px 6px 1px rgba(212, 212, 212, .5);
}
.projectCenterInfo {
display: flex;
align-items: center;
padding-top: 5px;
}
.projectCenterImg {
width: 15px;
height: 15px;
padding: 0 13px;
}
.projectCenterFont {
font-family: PingFangSC-Regular,
PingFang SC;
font-size: 12px;
font-weight: 400;
line-height: 12px;
height: 12px;
color: #2c2b2b;
}
.assess {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
height: 25px;
padding-right: 0;
padding-left: 0;
}
.assessIcon {
width: 24px;
height: 24px;
margin-right: 10px;
vertical-align: middle;
background: #2468f2;
}
.assessTitle {
font-family: PingFangSC-Regular,
PingFang SC;
font-size: 14px;
font-weight: 400;
line-height: 20px;
height: 20px;
color: #2468f2;
}
.assessRightIcon {
width: 24px;
height: 24px;
background: #2468f2;
}
.assessBox {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 12px;
}
.assessCenter1 {
margin: 15px;
border-left: 2px solid #24bca3;
}
.assessCenter2 {
margin: 15px;
border-left: 2px solid #ff5959;
}
.protocolTitle {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.font11 {
font-family: PingFangSC-Regular,
PingFang SC;
font-size: 11px;
font-weight: 400;
line-height: 11px;
height: 11px;
color: #9da2a3;
}
.protocolBox {
border-radius: 4px;
background: #fff;
box-shadow: 0 2px 5px 0 rgba(168, 168, 168, .5);
}
.font14 {
font-family: PingFangSC-Regular,
PingFang SC;
font-size: 14px;
font-weight: 400;
line-height: 20px;
height: 20px;
color: #202020;
}
.protocolList {
padding: 20px 21px 0 20px;
}
.protocolLine {
padding-bottom: 10px;
border-bottom: 1px dashed rgba(168, 168, 168, .5);
}

View File

@@ -0,0 +1,398 @@
<template>
<div>
<div class="page">
<div class="topBox">
<div class="titleBox">
<div class="font">被征收人信息查询</div>
</div>
<div>
<div class="baseInfo">
<van-image
:src="require('@/assets/img/renyuanliebiao.png')"
class="baseImg"
/>
<span class="baseFont">被征收人姓名</span>
<span class="baseFont">{{ user.name }}</span>
</div>
<div class="baseInfo">
<van-image
:src="require('@/assets/img/credentials_icon.png')"
class="baseImg"
/>
<span class="baseFont">身份证号码</span>
<span class="baseFont">{{ user.identityId }}</span>
</div>
</div>
<div>
<div class="gridBg centerMagin">
<van-image :src="require('@/assets/img/scan.png')" class="gridImg" />
<van-image
:src="require('@/assets/img/evaluation .png')"
@click="gotoProject('pg')"
class="gridImg"
/>
<van-image
:src="require('@/assets/img/compensation.png')"
@click="gotoProject('xy')"
class="gridImg"
/>
</div>
</div>
</div>
<div class="centerMagin">
<van-image
:src="require('@/assets/img/government.png')"
class="bigImg"
/>
</div>
<div class="centerMagin">
<div class="project">
<div>
<van-image
:src="require('@/assets/img/project.png')"
class="projectIcon"
/>
<span class="projectTitle">{{ project.name }}</span>
</div>
<div class="projectRight">
<van-image
:src="require('@/assets/img/menu_yhxy.png')"
class="projectRightIcon"
/>
<span class="projectRightFont">协议签订阶段</span>
</div>
</div>
</div>
<div class="projectCenter centerMagin">
<div class="projectCenterInfo">
<div class="projectCenterInfo">
<van-image
:src="require('@/assets/img/project_area.png')"
class="projectCenterImg"
/>
<span class="projectCenterFont">项目所在区域</span>
<span class="projectCenterFont">{{ project.area }}</span>
</div>
</div>
<div class="projectCenterInfo">
<div class="projectCenterInfo">
<van-image
:src="require('@/assets/img/project_dep.png')"
class="projectCenterImg"
/>
<span class="projectCenterFont">征收部门</span>
<span class="projectCenterFont">{{ project.department }}</span>
</div>
</div>
<div class="projectCenterInfo">
<div class="projectCenterInfo">
<van-image
:src="require('@/assets/img/project_year.png')"
class="projectCenterImg"
/>
<span class="projectCenterFont">所属年份</span>
<span class="projectCenterFont">{{ project.year }}</span>
</div>
</div>
<div class="projectCenterInfo">
<div class="projectCenterInfo">
<van-image
:src="require('@/assets/img/project_no.png')"
class="projectCenterImg"
/>
<span class="projectCenterFont">征收决定号</span>
<span class="projectCenterFont" style="color: #3883f1">{{
project.num
}}</span>
</div>
</div>
<div class="centerMagin">
<div class="assess">
<div>
<van-image
:src="require('@/assets/img/assess_1.png')"
class="assessIcon"
/>
<span class="assessTitle">分户评估结果</span>
</div>
<!-- <div>
<van-image :src="require('@/assets/img/skip.png')" class="assessRightIcon" round />
</div>-->
</div>
<div class="assessCenter1">
<div class="assessBox">
<span class="projectCenterFont">评估报告编号</span>
<span class="projectCenterFont">{{ assess.num }}</span>
</div>
<div class="assessBox">
<span class="projectCenterFont" style="width: 40%"
>被征收房屋地址</span
>
<span class="projectCenterFont protocolTitle">{{
assess.address
}}</span>
</div>
<div class="assessBox">
<span class="projectCenterFont">评估总金额</span>
<span class="projectTitle" style="color: red"
>¥{{ assess.amount }}</span
>
</div>
</div>
<div class="assess">
<div>
<van-image
:src="require('@/assets/img/assess_2.png')"
class="assessIcon"
/>
<span class="assessTitle">补偿协议</span>
</div>
<!-- <div>
<van-image :src="require('@/assets/img/skip.png')" class="assessRightIcon" round />
</div>-->
</div>
<div class="assessCenter2">
<div class="assessBox">
<span class="projectCenterFont">协议编号</span>
<span class="projectCenterFont">{{ retrievalProtocol.num }}</span>
</div>
<div class="assessBox">
<span class="projectCenterFont" style="width: 40%"
>被征收房屋地址</span
>
<span class="projectCenterFont protocolTitle">{{
retrievalProtocol.address
}}</span>
</div>
<div class="assessBox">
<span class="projectCenterFont">补偿方式</span>
<span class="projectCenterFont">{{
retrievalProtocol.compensation
}}</span>
</div>
<div class="assessBox">
<span class="projectCenterFont">合计补偿资金</span>
<span class="projectTitle" style="color: red"
>¥{{ retrievalProtocol.amount }}</span
>
</div>
</div>
</div>
</div>
<div class="centerMagin">
<van-image
:src="require('@/assets/img/expropriationPolicy.png')"
class="bigImg"
/>
</div>
<div class="centerMagin">
<span class="projectTitle" style="color:#202020">征收政策</span>
<div class="assessBox" style="padding-left: 5px;padding-right: 5px;">
<span class="font11" style="color:#2c2b2b">{{total}}</span>
<!-- <div>
<span class="font11">查看全部</span>
<van-icon color="#1989fa" name="arrow" />
</div>-->
</div>
</div>
<div class="centerMagin" style="padding-bottom: 20px">
<div class="protocolBox">
<van-list :finished="finished" @load="onLoad" v-model="loading">
<div :key="item.id" class="protocolList" v-for="(item, i) in list">
<div class="protocolLine" v-if="i != list.length - 1">
<div class="font14 protocolTitle">{{ item.title }}</div>
<div
class="assessBox"
style="padding-left: 5px; padding-right: 5px"
>
<div>
<span class="font11">发布时间</span>
<span class="font11">{{ item.publish_date }}</span>
</div>
<div>
<span class="font11">区域</span>
<span class="font11">{{ item.area }}</span>
</div>
</div>
</div>
<div style="padding-bottom: 10px" v-else>
<div class="font14 protocolTitle">{{ item.title }}</div>
<div
class="assessBox"
style="padding-left: 5px; padding-right: 5px"
>
<div>
<span class="font11">发布时间</span>
<span class="font11">{{ item.publish_date }}</span>
</div>
<div>
<span class="font11">区域</span>
<span class="font11">{{ item.area }}</span>
</div>
</div>
</div>
</div>
</van-list>
</div>
</div>
</div>
</div>
</template>
<script>
import "./home.css";
import { apis } from "@/common/apis";
import { token } from "@/common/token";
import request from "@/common/util";
export default {
name: "home",
data() {
return {
apidata: {
success: true,
code: 200,
message: "请求成功",
data: {
prjList: [
{
prjId: "936d98a8-2c8f-410f-b126-68a7568f60c4",
area: "海曙区",
zsbm: "宁波市海曙区房屋征收管理服务中心",
year: 2021.0,
zsjdh: "海政发[2021]513号",
currentState: "项目报结",
fhpgList: [
{
prjId: "936d98a8-2c8f-410f-b126-68a7568f60c4",
assessmentNo: "0513",
houseAddress: "高桥镇",
countValue: "137654.00",
},
],
bcxyList: [
{
prjId: "936d98a8-2c8f-410f-b126-68a7568f60c4",
xyNo: "海政发2021513-0513-1",
houseAddress: "高桥镇",
summationShouldCompensateMoney: "137654.00",
},
],
},
],
},
extras: null,
timestamp: 1631256680049,
},
// user: {
// name: "加载中...",
// identityId: "加载中...",
// },
// project: {
// name: "加载中...",
// area: "加载中...",
// department: "加载中...",
// year: "加载中...",
// num: "加载中...",
// },
// assess: {
// num: "",
// address: "加载中...",
// amount: "加载中...",
// },
// retrievalProtocol: {
// num: "",
// address: "加载中...",
// compensation: "加载中...",
// amount: "0",
// },
total: "8",
list: [
{
id: 11,
area: "全大市",
title: "宁波市住房和城乡建设委员会开展关于住房的政策",
publish_date: "2021年09月05日",
},
{
id: 22,
area: "全大市",
title: "宁波市住房和城乡建设委员会开展关于住房的政策",
publish_date: "2021年09月05日",
},
{
id: 33,
area: "全大市",
title: "宁波市住房和城乡建设委员会开展关于住房的政策",
publish_date: "2021年09月05日",
},
],
loading: false,
finished: true,
};
},
created() {
this.onInit();
},
methods: {
onLoad() {},
onInit() {
debugger;
// this.onLogin();
//获取当前数据
// apis.getprjdata({ ticket: this.$route.query.ticket }).then((prjdata) => {
// debugger;
// console.log(prjdata);
// this.user.name = prjdata.data.UserName;
// this.user.identityId = prjdata.data.IdCard;
// });
},
gotoProject(type) {
this.$router.push({ name: 'projectSelect', params: { type: type } });
},
onLogin() {
// this.loading = true;
let form = { account: "zgbqc", password: "111qqqqq" };
apis
.login(form)
.finally(() => {
debugger;
// this.loading = false;
})
.then(({ result }) => {
token.value = result.token;
// this.$root.replace('/');
debugger;
this.onLoadUserInfo();
this.onLoadStatistic();
})
.catch((err) => {
debugger;
// this.$toast(err);
});
},
onLoadUserInfo() {
apis.account().then(({ result }) => {
for (let key in result) {
if (this.user.hasOwnProperty(key)) {
this.user[key] = result[key];
}
}
});
},
onLoadStatistic() {
apis.projectStatistics().then(({ result }) => {
this.statistics = result;
});
},
padStart(num, n) {
var tbl = [];
var len = n - num.toString().length;
if (len <= 0) return num;
if (!tbl[len]) tbl[len] = new Array(len + 1).join("0");
return tbl[len] + num;
},
},
};
</script>

View File

@@ -0,0 +1,132 @@
<template>
<div>
<div style="height: 240px;">
<div class="proTopBox">
<div :class="type == 'pg' ? 'proTopBoxpg': 'proTopBoxxy' "></div>
<div class="proCenterBox">
<div class="proCenterInfo">
<van-image :src="require('@/assets/img/expropriated_person.png')" class="proCenterImg" />
<div>
<div>
<span class="proCenterFont">被征收人姓名</span>
<span class="proCenterFont" style="color:#626262;">{{user.name}}</span>
</div>
<div>
<span class="proCenterFont">身份证号</span>
<span class="proCenterFont" style="color:#626262;">{{user.identityId}}</span>
</div>
</div>
</div>
<div class="proCenterFlex">
<div class="proCenterFlexFont">请选择您的征收项目</div>
<van-image
:src="require('@/assets/img/expropriated_select.png')"
class="proCenterFlexImg"
/>
</div>
</div>
</div>
</div>
<div>
<van-list>
<div
:key="item.id"
@click="gotoDetail(item.id)"
class="proListBox shadow"
v-for="(item,i) in list"
>
<div class="proAreaBox">
<div class="proArea">{{item.area}}</div>
<div class="proCenterFont" v-if="item.state_cd == 1">· {{item.state}}</div>
<div
class="proCenterFont"
style="color:#179D5C"
v-else-if="item.state_cd == 2"
>· {{item.state}}</div>
</div>
<div class="proAreaBox">
<div class="proTitleBox">{{item.title}}</div>
</div>
<van-divider style="margin:8px 0;" />
<div class="proDateBox">
<div>{{item.date}}</div>
</div>
</div>
</van-list>
</div>
</div>
</template>
<script>
import './project.css';
import { apis } from '@/common/apis';
export default {
data() {
return {
loading: true,
type: '',
data: new Object(),
user: {
name: '胡伯钧',
identityId: '3302041982893743782',
},
list: [
{
id: 11,
area: '镇海区',
title: '郁金花园北块地',
date: '2021-09-08',
state_cd: '1',
state: '协议签订阶段',
},
{
id: 22,
area: '象山县',
title: '象山县人民广场周边区块改造项目',
date: '2021-09-08',
state_cd: '2',
state: '项目已报结',
},
// {
// id: 33,
// area: '全大市',
// title: '宁波市住房和城乡建设委员会开展关于住房的政策',
// date: '2021年09月05日',
// state_cd: '0',
// state: '测试',
// },
],
loading: false,
finished: true,
};
},
created() {
this.onInit();
},
methods: {
onInit() {
this.onLoadData();
},
onLoadData() {
// apis.mailDetail({ id: this.$route.query.id }).then(({ result }) => {
// this.loading = false;
// this.data = result;
// });
this.type = this.$route.params.type;
},
gotoDetail(id) {
if (this.type == 'pg') {
// 评估结果页面
this.$router.push({ name: 'reportCompensate', params: { projectid: id, type: this.type } });
} else if (this.type == 'xy') {
// 协议结果页面
this.$router.push({ name: 'reportAgreement', params: { projectid: id, type: this.type } });
}
},
},
};
</script>
<style>
</style>

View File

@@ -0,0 +1,146 @@
.proTopBox {
position: relative;
margin: 15px 12px;
}
.proTopBoxpg {
position: absolute;
overflow: hidden;
width: 100%;
height: 90px;
background: url(../../assets/img/zspg.jpg);
background-size: 100% 90px;
}
.proTopBoxxy {
position: absolute;
overflow: hidden;
width: 100%;
height: 90px;
background: url(../../assets/img/zsxy.jpg);
background-size: 100% 90px;
}
.proCenterBox {
position: absolute;
top: 50%;
left: 50% ;
width: 95%;
height: 140px;
transform: translate(-50%, 50%);
/* margin: 70px 0 15px 10px; */
border-radius: 6px;
background: rgba(248, 253, 255, 1);
box-shadow: 1px 1px 3px rgb(202, 201, 201);
}
.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: #09a4fa;
}
.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 {
height: 127px;
margin: 15px 20px;
border-radius: 3px;
}
.proAreaBox {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px;
}
.proArea {
font-family: PingFangSC-Regular;
font-size: 16px;
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;
}

View File

@@ -0,0 +1,125 @@
<template>
<div class="container">
<div class="image">
<img alt src="@/assets/img/agreement.png" />
</div>
<div class="text">为您查询到{{ this.result }}条结果</div>
<div :key="index" v-for="(item, index) in info">
<el-card>
<div>
<img alt src="@/assets/img/bianhao.png" />
评估报告编号
<b>{{ item.number }}</b>
</div>
<div>
<img alt src="@/assets/img/name.png" />
被征收人姓名
<b>{{ item.name }}</b>
</div>
<div>
<img alt src="@/assets/img/address.png" />
被征收人房屋地址
<b>{{ item.address }}</b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
评估总金额
<b style="color: red">{{ item.money }}</b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
合计补偿金额
<b style="color: red">{{ item.money }}</b>
</div>
<div>
<img alt src="@/assets/img/hengxian.png" />
</div>
<div class="date">
<div class="flex backgroundColor">
<img alt src="@/assets/img/shijian.png" />
签订日期{{ item.time }}
</div>
</div>
</el-card>
</div>
</div>
</template>
<script>
export default {
data() {
return {
result: '2',
info: [
{
number: '044',
name: '胡守钧',
address: '宁波市江北区四洲街16号404',
money: '180234元',
person: '王勇',
time: '2021-9-1',
},
{
number: '044',
name: '胡守钧',
address: '宁波市江北区四洲街16号404',
money: '180234元',
person: '王勇',
time: '2021-9-1',
},
],
};
},
created() {
this.onInit();
console.log(1234);
},
methods: {
onInit() {
this.onLoadData();
},
onLoadData() {
console.log(this.$route.params);
this.type = this.$route.params.type;
},
},
};
</script>
<style lang="less" scoped>
.container {
.image {
margin-top: 20px;
text-align: center;
}
.text {
font-weight: bolder;
margin: 10px 0;
text-align: center;
color: #2d6df2;
}
.el-card {
margin: 0 10px 10px;
::v-deep.el-card__body {
padding: 0 10px;
>div {
margin: 10px 0;
}
.date {
display: flex;
justify-content: center;
.backgroundColor {
background-color: #e3ebfd;
img {
margin-right: 10px;
}
}
}
}
}
}
</style>

View File

@@ -0,0 +1,117 @@
<template>
<div class="container">
<div class="image">
<img alt src="@/assets/img/evalute.png" />
</div>
<div class="text">为您查询到{{ this.result }}条结果</div>
<div :key="index" v-for="(item, index) in info">
<el-card>
<div>
<img alt src="@/assets/img/bianhao.png" />
评估报告编号
<b>{{ item.number }}</b>
</div>
<div>
<img alt src="@/assets/img/name.png" />
被征收人姓名
<b>{{ item.name }}</b>
</div>
<div>
<img alt src="@/assets/img/address.png" />
被征收人房屋地址
<b>{{ item.address }}</b>
</div>
<div>
<img alt src="@/assets/img/money.png" />
评估总金额
<b style="color: red">{{ item.money }}</b>
</div>
<div class="flex">
<div class="flex backgroundColor">
<img alt src="@/assets/img/renyuan.png" />
评估人员{{ item.person }}
</div>
<div class="flex backgroundColor">
<img alt src="@/assets/img/shijian.png" />
评估时间{{ item.time }}
</div>
</div>
</el-card>
</div>
</div>
</template>
<script>
export default {
data() {
return {
result: '2',
info: [
{
number: '044',
name: '胡守钧',
address: '宁波市江北区四洲街16号404',
money: '180234元',
person: '王勇',
time: '2021-9-1',
},
{
number: '044',
name: '胡守钧',
address: '宁波市江北区四洲街16号404',
money: '180234元',
person: '王勇',
time: '2021-9-1',
},
],
};
},
created() {
this.onInit();
console.log(1234);
},
methods: {
onInit() {
this.onLoadData();
},
onLoadData() {
console.log(this.$route.params);
this.type = this.$route.params.type;
},
},
};
</script>
<style lang="less" scoped>
.container {
.image {
margin-top: 20px;
text-align: center;
}
.text {
font-weight: bolder;
margin: 10px 0;
text-align: center;
color: #2d6df2;
}
.el-card {
margin: 0 10px 10px;
::v-deep.el-card__body {
padding: 0 10px;
>div {
margin: 10px 0;
}
.backgroundColor {
background-color: #e3ebfd;
img {
margin-right: 10px;
}
}
}
}
}
</style>