This commit is contained in:
花有清香月有阴
2022-01-17 17:47:54 +08:00
3 changed files with 62 additions and 6 deletions

View File

@@ -117,7 +117,6 @@ export default {
this.userId = option.id this.userId = option.id
this.areaId = this.user.areaId this.areaId = this.user.areaId
this.areaName = this.user.areaName this.areaName = this.user.areaName
console.log(this.userId)
}, },
onShow() { onShow() {
document.title = '新增责任家庭' document.title = '新增责任家庭'

View File

@@ -1,10 +1,14 @@
<template> <template>
<div class="FamilyList"> <div class="FamilyList">
<div class="title">户主列表</div> <div class="title">户主列表<span style="font-size: 14px; color: #2979ff;" @click="changeType" v-if="edit">修改</span><span style="font-size: 14px; color: #2979ff;" @click="edit = true" v-else>取消</span></div>
<div class="main" v-if="list.length"> <div class="main" v-if="list.length">
<ul v-for="item in list" :key="item.id"> <ul v-for="(item,index) in list" :key="index">
<li> <li>
<div class="user"> <div class="user">
<div v-if="!edit">
<img src="./components/img/xz.png" alt="" class="checkbox" v-if="!item.checked" @click="userClick(index)">
<img src="./components/img/xzh.png" alt="" class="checkbox" v-else @click="userClick(index)">
</div>
<div> <div>
<img :src="item.photo" class="userImg" v-if="item.photo"> <img :src="item.photo" class="userImg" v-if="item.photo">
<img src="./components/img/user-img.png" alt="" class="userImg" v-else> <img src="./components/img/user-img.png" alt="" class="userImg" v-else>
@@ -23,7 +27,9 @@
</div> </div>
<AiEmpty description="暂无数据" class="emptyWrap" v-if="!list.length"></AiEmpty> <AiEmpty description="暂无数据" class="emptyWrap" v-if="!list.length"></AiEmpty>
<div style="height:70px;"></div> <div style="height:70px;"></div>
<div class="footer" @click="toAddFamily()">新增责任家庭</div> <div class="footer" @click="toAddFamily()" v-if="edit">新增责任家庭</div>
<div class="footer" @click="delFamily()" v-else>删除</div>
</div> </div>
</template> </template>
@@ -34,6 +40,8 @@ export default {
list:[], list:[],
current:1, current:1,
userId: '', userId: '',
edit: true,
checked: true
} }
}, },
methods: { methods: {
@@ -47,6 +55,39 @@ export default {
toAddFamily(){ toAddFamily(){
uni.navigateTo({url: `./AddFamily?id=${this.userId}`}) uni.navigateTo({url: `./AddFamily?id=${this.userId}`})
}, },
userClick(index) {
this.list[index].checked = !this.list[index].checked
this.$forceUpdate()
},
// 点击删除
delFamily(){
var ids = []
this.list.map((item) => {
if(item.checked) {
ids.push(item.gmrId)
}
})
if(!ids.length) {
return this.$u.toast('请选中需要删除的家庭户主')
}
this.$confirm(`是否删除这些关联家庭信息?`).then(() => {
this.$http.post(`/app/appgirdmemberresident/delete?ids=${ids.join(',')}`).then((res) => {
if (res.code == 0) {
this.$u.toast('删除成功')
uni.$emit('updateList')
this.$forceUpdate()
this.edit = true
}
})
})
},
changeType() {
this.edit = false
this.list.map((item) => {
item.checked = false
})
}
}, },
onLoad(option) { onLoad(option) {
this.userId = option.id this.userId = option.id
@@ -70,6 +111,8 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.FamilyList { .FamilyList {
.title { .title {
display: flex;
justify-content: space-between;
padding: 24px 32px; padding: 24px 32px;
background-color: #F3F6F9; background-color: #F3F6F9;
font-size: 34px; font-size: 34px;
@@ -86,6 +129,12 @@ export default {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
padding-top: 24px; padding-top: 24px;
.checkbox{
margin-top: 20px;
margin-right: 32px;
width: 48px;
height: 48px;
}
.userImg { .userImg {
padding-right: 32px; padding-right: 32px;
width: 80px; width: 80px;

View File

@@ -18,7 +18,9 @@
</div> </div>
<div class="rightes"> <div class="rightes">
<div class="applicationNames" @click="showGirdInfo(item)">{{ item.girdName }}</div> <div class="applicationNames" @click="showGirdInfo(item)">{{ item.girdName }}</div>
<img src="./components/img/right-icon.png" alt="" class="imgs" v-if="item.girdLevel != 2" @click="itemClick(item)" /> <div class="right-icon" v-if="item.girdLevel != 2" @click="itemClick(item)" >
<img src="./components/img/right-icon.png" alt="" class="imgs" />
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -289,7 +291,7 @@ export default {
margin-left: 32px; margin-left: 32px;
border-bottom: 1px solid #e4e5e6; border-bottom: 1px solid #e4e5e6;
.applicationNames { .applicationNames {
width: calc(100% - 56px); width: calc(100% - 100px);
font-size: 36px; font-size: 36px;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
@@ -297,6 +299,12 @@ export default {
text-overflow:ellipsis; text-overflow:ellipsis;
white-space:nowrap; white-space:nowrap;
} }
.right-icon{
width: 100px;
padding-right: 32px;
box-sizing: border-box;
text-align: right;
}
.imgs { .imgs {
width: 40px; width: 40px;
height: 40px; height: 40px;