kubbo/dvcp_v2_wxcp_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

区域选择和搜索框

Browse Source
This commit is contained in:
shijingjing
2022-01-14 16:40:35 +08:00
parent a67ad4c44c
commit e7535c2dc0
1 changed files with 31 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
src/apps/AppGridManagement/AddFamily.vue
View File

@@ -1,9 +1,15 @@
<template>
<div class="AddFamily">
<div class="search">
<div class="searchBox">
<u-search v-model="value" placeholder:clearabled="true" placeholder="搜索" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="getListInit" @clear="value='',getListInit"></u-search>
<div class="left">
<AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666">
<u-icon name="map-fill" color="#3192F4" size="20px" style="vertical-align: text-bottom"></u-icon>
<span style="margin-left: 4px" v-if="areaName">{{ areaName }}</span>
<span v-else>请选择</span>
<u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" />
</AiAreaPicker>
</div>
<u-search v-model="value" placeholder:clearabled="true" placeholder="搜索" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="getListInit" @clear="value='',getListInit"></u-search>
</div>
<div class="userList">
<ul v-for="(item,index) in list" :key="index">
@@ -22,7 +28,7 @@
<span class="user-name">{{item.name}}</span>
<span class="user-tel">{{item.phone}}</span>
</div>
<div class="idCard">{{item.idNumber && item.idNumber.replace(/(.{6}).*(.{4})/,"$1********$2")}}</div>
<div class="idCard">{{item.idNumber && item.idNumber.replace(/^(\d{6})\d{8}(.{4}$)/g, `$1${Array(9).join('*')}$2`)}}</div>
<div class="address">{{item.currentAreaName || '' + item.currentAddress}}</div>
</div>
</div>
@@ -46,13 +52,15 @@ export default {
value: '',
checked: true,
userList: {},
userId: ''
userId: '',
areaId: '',
areaName:''
}
},
computed: { ...mapState(['user']) },
methods: {
getList(){
this.$http.post(`/app/appresident/list?residentType=0&areaId=${this.user.areaId}&householdName=1&current=${this.current}&con=${this.value}`).then((res) => {
this.$http.post(`/app/appresident/list?residentType=0&areaId=${this.areaId}&householdName=1&current=${this.current}&con=${this.value}`).then((res) => {
if (res.code == 0) {
res.data.records.map((item) => {
item.checked = false
@@ -84,7 +92,7 @@ export default {
}
})
if(!checkUserList.length) {
this.$u.toast('请选择家庭')
return this.$u.toast('请选择家庭')
}
this.$http.post(`/app/appgirdmemberresident/add`, {residentList:checkUserList}).then((res) => {
if (res.code == 0) {
@@ -97,10 +105,16 @@ export default {
}).catch((err) => {
this.$u.toast(err)
})
}
},
areaSelect(e) {
this.areaId =e
this.getListInit()
},
},
onLoad(option) {
this.userId = option.id
this.areaId = this.user.areaId
this.areaName = this.user.areaName
console.log(this.userId)
},
onShow() {
@@ -117,27 +131,17 @@ export default {
<style lang="scss" scoped>
.AddFamily {
background-color: #FFFFFF;
.search{
padding: 20px 32px;
height: 64px;
.searchBox {
display: flex;
justify-content: flex-start;
width: 100%;
height: 64px;
border-radius: 32px;
background-color: #F5F5F5;
.searchIcon {
width: 32px;
height: 32px;
padding: 16px 6px 16px 32px;
}
.input {
width: 540px;
padding: 14px 6px 14px 6px;
}
.search{
width: 100%;
height: 112px;
padding: 32px;
box-sizing: border-box;
background: #FFF;
display: flex;
margin-bottom: 8px;
.left{
width: calc(100% - 402px);
}
;
}
.userList {
width: 100%;