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:
花有清香月有阴
2021-12-23 15:32:46 +08:00
parent 6cd28ae85f
commit 52ade08a1f
4 changed files with 851 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
src/apps/AppResidentFile/components/document.vue Normal file
View File

@@ -0,0 +1,129 @@
<template>
<section class="document">
<div class="card">
<div class="info">
<u-image border-radius="4" :src="top.detail.avatar" width="118" height="118"/>
<div class="fill">
<b>{{ top.detail.realName || top.detail.name }}</b>
<u-row>
<span class="idNumber" v-html="IDObj.id"/>
<a @tap="showID=!showID">{{ IDObj.btn }}</a>
</u-row>
</div>
</div>
<AiCell label="性别">{{ $dict.getLabel("sex", resident.sex) || "-" }}</AiCell>
<AiCell label="出生日期">{{ resident.birthDate }}</AiCell>
<AiCell label="年龄">{{ resident.age }}</AiCell>
<AiCell label="籍贯">{{ resident.birthplaceAreaName }}</AiCell>
<AiCell label="民族">{{ $dict.getLabel("nation", resident.nation) || "-" }}</AiCell>
<AiCell label="文化程度">{{ $dict.getLabel("education", resident.education) || "-" }}</AiCell>
<AiCell label="兵役状况">{{ $dict.getLabel("militaryStatus", resident.militaryStatus) || "-" }}</AiCell>
<AiCell label="政治面貌">{{ $dict.getLabel("politicsStatus", resident.politicsStatus) || "-" }}</AiCell>
<AiCell label="职业">{{ $dict.getLabel("job", resident.job) || "-" }}</AiCell>
<AiCell label="宗教信仰">{{ $dict.getLabel("faithType", resident.faithType) || "-" }}</AiCell>
</div>
<div class="card">
<AiCell title label="联络信息"/>
<AiCell label="联系方式">{{ resident.phone }}</AiCell>
<AiCell label="现住址">{{ resident.currentAreaName + resident.currentAddress }}</AiCell>
</div>
<div class="card">
<AiCell title label="家庭信息"/>
<AiCell label="是否户主">{{ $dict.getLabel("householdName", resident.householdName) || "-" }}</AiCell>
<AiCell label="与户主关系">{{ $dict.getLabel("householdRelation", resident.householdRelation) || "-" }}</AiCell>
<AiCell label="现住址">{{ resident.householdAreaName + resident.householdAddress }}</AiCell>
</div>
<div class="card">
<AiCell title label="家庭成员"/>
<AiTable :data="family" :colConfigs="colConfigs"/>
</div>
</section>
</template>
<script>
export default {
name: "document",
inject: ['top'],
computed: {
IDObj() {
return this.showID ? {
id: this.resident?.idNumber,
btn: '隐藏'
} : {
id: this.resident?.idNumber?.replace(/(\d{10}).+/g, '$1******'),
btn: '显示'
}
},
colConfigs() {
return [
{label: "与户主关系", prop: "householdRelation", width: '160rpx', dict: "householdRelation"},
{label: "姓名", prop: "name", width: '120rpx'},
{label: "性别", prop: "sex", dict: "sex"},
{label: "年龄", prop: "age"},
{label: "身份证号", prop: "idNumber", width: '320rpx'},
]
},
resident() {
let obj = {}
Object.keys(this.top.detail?.residentInfo?.resident || {}).map(e => {
obj[e] = this.top.detail?.residentInfo?.resident[e] || ""
})
return obj
},
family() {
return this.top.detail?.residentInfo?.family?.map(e => ({...e, householdRelation: e.householdRelation || "户主"}))
}
},
data() {
return {
showID: false,
familyList: []
}
},
created() {
this.$dict.load("sex", "nation", "education", "job",
"faithType", "politicsStatus", "militaryStatus", "householdRelation",
"householdName")
}
}
</script>
<style lang="scss" scoped>
.document {
overflow-y: auto;
background: #F5F5F5;
.info {
height: 186px;
width: 100%;
display: flex;
align-items: center;
.fill {
color: #3C7FC8;
margin-left: 24px;
font-size: 28px;
line-height: 40px;
display: flex;
flex-direction: column;
b {
font-size: 36px;
color: #333;
margin-bottom: 8px;
line-height: 50px;
}
a {
cursor: pointer;
}
.idNumber {
margin-right: 16px;
color: #999;
}
}
}
}
</style>

353
src/apps/AppResidentFile/components/info.vue Normal file
View File

@@ -0,0 +1,353 @@
<template>
<section class="info">
<div class="card">
<div class="baseInfo">
<u-image border-radius="4" :src="top.detail.avatar" width="118" height="118"/>
<div class="fill">
<b>{{ top.detail.name }}</b>
<div v-if="top.detail.type==1" class="wx">@微信</div>
<div v-if="top.detail.type==2">@企业微信</div>
</div>
<div class="certBtn" @tap="handleCert">{{ !isCert ? "实名认证" : "解绑" }}</div>
</div>
<u-row>
<AiCell class="half" top-label label="来源">{{ $dict.getLabel("wxCustomerAddWay", top.detail.addWay) }}</AiCell>
<AiCell class="half" top-label label="添加时间">{{ top.detail.createTime }}</AiCell>
<AiCell class="half" top-label label="真实姓名">{{ top.detail.realName }}</AiCell>
<AiCell class="half" top-label label="手机号码">{{ resident.phone || "-" }}</AiCell>
<AiCell class="half" top-label label="家庭积分">{{ resident.familyIntegral }}</AiCell>
<AiCell class="half" top-label label="个人积分">{{ resident.personalIntegral }}</AiCell>
</u-row>
</div>
<div class="card">
<AiCell title label="公共标签">
<u-icon label="添加" size="38" name="iconAdd" custom-prefix="iconfont" color="#1365DD"
label-color="#1365DD" @tap="top.showTagManage=true"/>
</AiCell>
<AiCell top-label v-for="(op,name) in tagsList" :label="name" :key="name">
<u-row>
<div class="tag" v-for="(tag,j) in op" :key="j">{{ tag }}</div>
</u-row>
</AiCell>
</div>
<div class="card">
<AiCell title label="动态"/>
<AiCell top-label>
<div class="logItem" v-for="item in customLogs" :key="item.id">
<div flex class="column" shrink>
<div class="dot"/>
<div class="line fill"/>
</div>
<div flex class="start column">
<b>{{ $dict.getLabel('wxCustomerLogType', item.type) }}</b>
<span>{{ item.createTime }}</span>
<div v-html="item.content"/>
</div>
</div>
</AiCell>
</div>
<u-mask :show="dialog" @tap="dialog=false">
<div class="bindCert" @tap.stop>
<b class="title">实名认证</b>
<u-input class="searchInput" v-model="search" clearable placeholder="请输入姓名或身份证号" @input="handleSearch"/>
<div class="residents">
<div flex class="spb" v-for="(op,i) in result" :key="i" @tap="bindCert(op.id)">
<div v-html="op.name"/>
<div v-html="op.idNumber"/>
</div>
</div>
</div>
</u-mask>
<div bottom>
<u-button type="primary" @tap="handleWechat">微信联系</u-button>
<u-button v-if="isMobile" :disabled="!resident.phone" @tap="handleTel">电话联系</u-button>
</div>
</section>
</template>
<script>
import {mapActions} from "vuex";
export default {
name: "info",
inject: ['top'],
computed: {
resident() {
return this.top.detail?.residentInfo?.resident || {}
},
tagsList() {
let obj = {}
this.top.detail?.tags?.map(e => {
if (e.type == 1 && e?.groupName) {
if (obj?.[e.groupName]) {
obj[e.groupName].push(e.tagName)
} else {
obj[e.groupName] = [e.tagName]
}
}
})
return obj
},
isCert() {
return !!this.top?.detail?.residentInfo
},
isMobile() {
return ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"]
.some(e => navigator.userAgent.indexOf(e) > -1)
}
},
data() {
return {
dialog: false,
search: "",
result: [],
customLogs: []
}
},
methods: {
...mapActions(['injectJWeixin', 'wxInvoke']),
searchResident() {
this.$http.post("/app/appresident/check-name", null, {
params: {name: this.search}
}).then(res => {
if (res?.data) {
let reg = new RegExp(this.search, 'g')
this.result = res.data?.map(e => ({
...e,
name: e.name.replace(reg, `<b>${this.search}</b>`),
idNumber: e.idNumber.replace(reg, `<b>${this.search}</b>`),
}))
}
})
},
handleSearch() {
if (this.search?.length >= 2) {
this.searchResident()
} else {
this.result = []
}
},
handleCert() {
if (this.isCert) {
this.$confirm("是否要解绑当前实名认证?").then(() => {
this.$http.post("/app/wxcp/wxcustomer/unBindCustomer2Resident", null, {
params: {residentId: this.resident.id, customerId: this.top.custom}
}).then(res => {
if (res?.code == 0) {
this.$u.toast("解除绑定成功!")
this.top.getContact()
}
})
})
} else this.dialog = true
},
bindCert(residentId) {
this.dialog = false
this.$confirm("是否要绑定该居民?").then(() => {
this.$http.post("/app/wxcp/wxcustomer/bindCustomer2Resident", null, {
params: {residentId, customerId: this.top.custom}
}).then(res => {
if (res?.code == 0) {
this.$u.toast("绑定成功!")
this.top.getContact()
}
}).catch(err => {
this.$u.toast(err)
setTimeout(() => this.dialog = true, 1000)
})
}).catch(() => this.dialog = true)
},
getCustomLog(customerId) {
customerId && this.$http.post("/app/wxcp/wxcustomerlog/listAll", null, {
params: {customerId}
}).then(res => {
if (res?.data) {
this.customLogs = res.data
}
})
},
handleTel() {
location.href = "tel:" + this.resident.phone
},
handleWechat() {
this.wxInvoke(['openUserProfile', {
type: 2,
userid: this.top.custom
}, () => 0])
}
},
created() {
this.$dict.load("wxCustomerAddWay", 'wxCustomerLogType')
this.getCustomLog(this.top.custom)
this.injectJWeixin('openUserProfile')
}
}
</script>
<style lang="scss" scoped>
.info {
padding-bottom: 130px;
.certBtn {
cursor: pointer;
background: $uni-color-primary;
color: #fff;
padding: 8px 16px;
border-radius: 4px;
}
.baseInfo {
height: 186px;
width: 100%;
display: flex;
align-items: center;
.fill {
color: #3C7FC8;
margin-left: 24px;
font-size: 28px;
line-height: 40px;
b {
font-size: 36px;
color: #333;
margin-bottom: 8px;
line-height: 50px;
}
.wx {
color: #2EA222;
}
}
}
::v-deep .AiCell {
&.half {
width: 50%;
}
}
::v-deep .u-form-item {
width: 50%;
min-height: 124px;
.u-form-item--left {
color: #999;
min-height: 40px;
}
.u-form-item--right {
min-height: 0;
margin-top: 16px;
}
}
::v-deep .u-mask {
display: flex;
align-items: center;
justify-content: center;
.bindCert {
width: 600px;
padding: 32px;
min-height: 400px;
background-color: #fff;
display: flex;
flex-direction: column;
color: #333;
}
.residents {
max-height: 780px;
overflow-y: auto;
}
.title {
text-align: center;
font-size: 36px;
}
.searchInput {
margin: 16px 0;
border: 1px solid #D0D4DC;
border-radius: 8px;
padding: 0 16px !important;
flex: 0;
}
.spb {
height: 60px;
cursor: pointer;
padding: 0 16px;
b {
font-size: 32px;
}
&:nth-of-type(2n) {
background: #eee;
}
}
}
::v-deep .logItem {
display: flex;
min-height: 220px;
&:last-of-type {
.line {
display: none;
}
}
& > .column + .column {
margin-left: 16px;
}
.dot {
flex-shrink: 0;
width: 16px;
height: 16px;
background: $uni-color-primary;
border: 8px solid #FFFFFF;
border-radius: 50%;
margin: 8px 0;
}
.line {
width: 4px;
background: #eee;
}
.start {
font-size: 26px;
font-weight: 400;
color: #666;
b {
color: #333;
}
i {
color: $uni-color-primary;
font-style: normal;
}
& > b {
font-size: 32px;
font-weight: bold;
margin-bottom: 8px;
}
& > span {
color: #999;
}
& > div {
margin-top: 16px;
}
}
}
}
</style>