wxz
2 years ago
37 changed files with 1180 additions and 823 deletions
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 575 B |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 9.4 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
@ -0,0 +1,86 @@ |
|||
.g-main{ |
|||
width: 100%; |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
padding:25px 16px; |
|||
box-sizing: border-box; |
|||
.top{ |
|||
display: flex; |
|||
height: calc(50vh - 104px); |
|||
.left{ |
|||
width: 320px; |
|||
height: 100%; |
|||
margin-right:16px; |
|||
overflow-y: scroll; |
|||
} |
|||
.right{ |
|||
flex: 1; |
|||
overflow-y: scroll; |
|||
|
|||
} |
|||
} |
|||
.bottom{ |
|||
height: calc(50vh - 104px); |
|||
margin-top: 16px; |
|||
display: flex; |
|||
.left{ |
|||
width: 320px; |
|||
height: 100%; |
|||
margin-right:16px; |
|||
overflow-y: scroll; |
|||
|
|||
} |
|||
.right{ |
|||
flex: 1; |
|||
overflow-y: scroll; |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
.card{ |
|||
background-color: #fff; |
|||
padding: 10px 16px 16px; |
|||
overflow: hidden; |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
.title{ |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #333333; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
img{ |
|||
width: 24px; |
|||
height: 24px; |
|||
} |
|||
} |
|||
.bgC{ |
|||
flex: 1; |
|||
background-color: #f5f7fa; |
|||
border-radius: 2px; |
|||
overflow-y: scroll; |
|||
display: flex; |
|||
flex-direction: column; |
|||
padding: 0 16px; |
|||
.item{ |
|||
margin-top: 19px; |
|||
.value{ |
|||
color: #333333; |
|||
font-family: PingFang SC; |
|||
font-weight: 400; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.gray{ |
|||
color: #000000; |
|||
opacity: 0.65; |
|||
} |
|||
.bgf{ |
|||
background-color: #fff ; |
|||
margin-top: 0 !important; |
|||
} |
|||
@ -0,0 +1,20 @@ |
|||
|
|||
const huaXiang ={ |
|||
state: { |
|||
userInfo:null || JSON.parse(localStorage.getItem('huaX')) |
|||
}, |
|||
mutations: { |
|||
setData(state, payload) { |
|||
state.userInfo = payload; |
|||
} |
|||
}, |
|||
actions: { |
|||
saveData({ commit }, payload) { |
|||
console.log(payload,'vueX接参'); |
|||
commit('setData', payload); |
|||
localStorage.setItem('huaX', JSON.stringify(payload)); |
|||
} |
|||
} |
|||
}; |
|||
|
|||
export default huaXiang; |
|||
@ -0,0 +1,99 @@ |
|||
<template> |
|||
<div class=""> |
|||
<div v-for="(item, index) in familyList" :key="index" class="familylist"> |
|||
<div :class="['item', {'bgf':index== 0 }] "> |
|||
<div> |
|||
<img v-if="index == 0 && userInfo.gender == '1'" src="../../../../assets/images/index/nan.png" alt="" |
|||
width="56px"> |
|||
<img v-if="index == 0 && userInfo.gender == '2'" src="../../../../assets/images/index/nv.png" alt="" |
|||
width="56px"> |
|||
<span class="name">{{ item.name }}</span>（{{ item.houseHolderRel == "本人" ? "户主" : item.houseHolderRel ? item.houseHolderRel : '--' |
|||
}}） |
|||
</div> |
|||
<div> |
|||
<span>人户状况：</span>{{item.householdSituation||'--'}} |
|||
</div> |
|||
<div> |
|||
<span>居民分类：</span>{{item.resiCategory||'--'}} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
export default { |
|||
//数据 |
|||
data() { |
|||
return { |
|||
familyList: [] |
|||
}; |
|||
}, |
|||
//创建前 |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
console.log(this.userInfo); |
|||
this.getFamilyRelationshipList() |
|||
}, |
|||
props: { |
|||
userInfo: { |
|||
type: Object, |
|||
default: () => { } |
|||
} |
|||
}, |
|||
//方法 |
|||
methods: { |
|||
async getFamilyRelationshipList() { |
|||
let url = `/actual/base/peopleRoomOverview/getFamilyRelationshipList?type=0&resid=` + this.userInfo.resiId |
|||
let { code, data, msg } = await requestPost(url) |
|||
if (code == 0) { |
|||
// 找到符合条件的对象的索引 |
|||
const index = data.findIndex(item => item.name == this.userInfo.name); |
|||
// 如果找到符合条件的对象 |
|||
if (index !== -1) { |
|||
// 移除这个对象并将其放到数组的第一个位置 |
|||
const [item] = data.splice(index, 1); |
|||
data.unshift(item); |
|||
} |
|||
for(let i in data){ |
|||
if(data[i].classificationOfInhabitantsList){ |
|||
data[i].resiCategory = data[i].classificationOfInhabitantsList.join(',') |
|||
} |
|||
} |
|||
this.familyList = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
} |
|||
}, |
|||
//子组件注册 |
|||
components: {}, |
|||
//计算 |
|||
computed: {}, |
|||
//监听 |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/pages/huaxiang"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
.item{ |
|||
padding: 0 15px; |
|||
&>div{ |
|||
margin-top: 18px; |
|||
.name{ |
|||
font-family: PingFang SC; |
|||
font-weight: bold; |
|||
color: #000000; |
|||
} |
|||
} |
|||
} |
|||
.bgf>:nth-child(1){ |
|||
margin: 0!important; |
|||
padding-top: 16px; |
|||
box-sizing: border-box; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,71 @@ |
|||
<template> |
|||
<div class=''> |
|||
<div class="item f-font14"> |
|||
<span class="label gray">居住地址：</span><span class="value">{{ resiInfo.fullName||"--" }}</span> |
|||
</div> |
|||
<div class="item f-font14"> |
|||
<span class="label gray">联系电话：</span><span class="value">{{ resiInfo.mobile||"--" }}</span> |
|||
</div> |
|||
<div class="item f-font14"> |
|||
<span class="label gray">所属网格：</span><span class="value">{{ resiInfo.gridName||"--" }}</span> |
|||
</div> |
|||
<div class="item f-font14"> |
|||
<span class="label gray">入户状况：</span><span class="value">{{ resiInfo.householdSituation||"--" }}</span> |
|||
</div> |
|||
<div class="item f-font14"> |
|||
<!-- 居住类型,与子女同住,空巢,独居,其他 字段没有返回--> |
|||
<span class="label gray">居住类型：</span><span class="value">{{ resiInfo.resideSituation || "--" }}</span> |
|||
</div> |
|||
<div class="item f-font14"> |
|||
<span class="label gray">家庭预警：</span> |
|||
<span class="value">{{resiInfo.riskyFlag === '1' ? '满意度风险家庭' : '--'}}</span> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
export default { |
|||
//数据 |
|||
data() { |
|||
return { |
|||
resiInfo: {} |
|||
}; |
|||
}, |
|||
//创建前 |
|||
created() { |
|||
}, |
|||
mounted() { |
|||
this.getPersonalFile() |
|||
}, |
|||
props: { |
|||
resiId: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
}, |
|||
//方法 |
|||
methods: { |
|||
async getPersonalFile() { |
|||
let url = `/actual/base/peopleRoomOverview/getPersonalFile?resid=` + this.resiId |
|||
let { code, data, msg } = await requestPost(url) |
|||
if (code == 0) { |
|||
this.resiInfo = data |
|||
} else { |
|||
this.$message.error(msg) |
|||
} |
|||
} |
|||
}, |
|||
//子组件注册 |
|||
components: {}, |
|||
//计算 |
|||
computed: {}, |
|||
//监听 |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/pages/huaxiang"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
</style> |
|||
@ -0,0 +1,96 @@ |
|||
<template> |
|||
<div class='g-main'> |
|||
<div class="top"> |
|||
<div class="left"> |
|||
<div class="card"> |
|||
<div class="title"> |
|||
<div><img src="../../../assets/images/index/title-icon-sqzl.png" alt="">居民档案</div> |
|||
<span class="title f-font14 gray" style="cursor: pointer;" @click="handlerUserInfo">详情 ></span> |
|||
</div> |
|||
<div class="f-top12"> |
|||
<img src="../../../assets/images/index/resi.png" alt="" width="56px"> {{userInfo.name}} |
|||
</div> |
|||
<section class="bgC"> |
|||
<left-top :resiId="userInfo.resiId"></left-top> |
|||
</section> |
|||
</div> |
|||
</div> |
|||
<div class="right"> |
|||
<div class="card"> |
|||
<div class="title"></div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="bottom"> |
|||
<div class="left"> |
|||
<div class="card"> |
|||
<div class="title"> |
|||
<div><img src="../../../assets/images/index/title-icon-jtgx.png" alt="">家庭关系</div> |
|||
</div> |
|||
<section class="bgC" style="padding: 0;"> |
|||
<left-bto :userInfo="userInfo" ></left-bto> |
|||
</section> |
|||
</div> |
|||
</div> |
|||
<div class="right"> |
|||
<div class="card"> |
|||
<div class="title"></div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<resi-info |
|||
v-if="showedResiInfo && userInfo.resiId" |
|||
:resi-id="userInfo.resiId" |
|||
@close="showedResiInfo = false" |
|||
/> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import { requestPost, requestGet } from '@/js/dai/request' |
|||
import leftTop from "./cpts/leftTop"; |
|||
import leftBto from "./cpts/leftBto"; |
|||
import resiInfo from "@/views/modules/cpts/resi/info"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
export default { |
|||
//数据 |
|||
data() { |
|||
return { |
|||
userInfo:{}, |
|||
showedResiInfo: false, |
|||
}; |
|||
}, |
|||
//创建前 |
|||
created() { |
|||
this.getFamilyRelationshipList() |
|||
this.userInfo = this.$store.state.huaXiang.userInfo |
|||
}, |
|||
//方法 |
|||
methods: { |
|||
async getFamilyRelationshipList() { |
|||
let url = `/actual/base/peopleRoomOverview/getFamilyRelationshipList?type=0&resid=` + this.userInfo.resiId |
|||
let {code,data,msg} = await requestPost(url) |
|||
if(code == 0){ |
|||
this.familyList = data |
|||
}else{ |
|||
this.$message.error(msg) |
|||
} |
|||
}, |
|||
async handlerUserInfo(){ |
|||
await nextTick(); |
|||
this.showedResiInfo = true; |
|||
}, |
|||
|
|||
}, |
|||
//子组件注册 |
|||
components: {leftTop,leftBto,resiInfo}, |
|||
//计算 |
|||
computed: {}, |
|||
//监听 |
|||
watch: {}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/pages/huaxiang"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
</style> |
|||
Loading…
Reference in new issue