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