特殊人群
This commit is contained in:
liuye
624
src/project/saas/AppSpecialGroups/Add.vue
Normal file
624
src/project/saas/AppSpecialGroups/Add.vue
Normal file
@@ -0,0 +1,624 @@
|
||||
<template>
|
||||
<div class="Add">
|
||||
<div class="pad-l32">
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>类型</span>
|
||||
<div class="value" @click="selectClick('appSpecialTypeFive', 'userType')">
|
||||
<span
|
||||
:class="form.userType === '' ? 'color-999' : ''">{{
|
||||
$dict.getLabel('appSpecialTypeFive', form.userType) || '请选择'
|
||||
}}</span>
|
||||
<u-icon name="arrow-right" color="#cccccc" size="24"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>姓名</span>
|
||||
<div class="value">
|
||||
|
||||
<u-input type="text" placeholder="请输入" v-model="form.name" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="15" :clearable="false"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>身份证号</span>
|
||||
<div class="value">
|
||||
<u-input type="text" placeholder="请输入" v-model="form.idNumber" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="18" :clearable="false"
|
||||
@input="changeIdNumber"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>性别</span>
|
||||
<div class="value">
|
||||
<u-input disabled placeholder="自动填充" v-model="form.gender" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="15" :clearable="false"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>出生日期</span>
|
||||
<div class="value">
|
||||
<u-input type="text" disabled placeholder="自动填充" v-model="form.birth" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="19" :clearable="false"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>联系电话</span>
|
||||
<div class="value">
|
||||
<u-input type="number" placeholder="请输入" v-model="form.phone" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="11" :clearable="false"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips">*</span>所属区域</span>
|
||||
<div class="value">
|
||||
<AiAreaPicker v-model="form.areaId" @select="areaSelect" :fullName.sync="form.areaName" mode="custom" all>
|
||||
<span class="label font" v-if="form.areaName" style="font-size: 16px">{{ form.areaName }}</span>
|
||||
<span v-else :class="form.areaName === '' ? 'color-999' : ''">请选择</span>
|
||||
<u-icon name="arrow-right" color="#cccccc" size="24" style="margin-left:4px;"/>
|
||||
</AiAreaPicker>
|
||||
</div>
|
||||
</div>
|
||||
<div class="address">
|
||||
<span class="label"><span class="tips"></span>详细地址</span>
|
||||
<div class="value">
|
||||
<u-input type="textarea" placeholder="请输入" v-model="form.address"
|
||||
placeholder-style="color:#999;font-size:16px;" :maxlength="20" auto-height/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item">
|
||||
<span class="label"><span class="tips"></span>所属网格</span>
|
||||
<div class="value">
|
||||
<AiPagePicker type="custom" v-model="form.girdId" @select="handleSelectGrid"
|
||||
:ops="{url:'../AppGridManagement/SelectGird',label: 'girdName'}">
|
||||
<AiMore v-model="form.girdName"/>
|
||||
</AiPagePicker>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="this.form.userType != ''">
|
||||
<div v-for="(item, index) in tableData[this.form.userType].list" :key="index">
|
||||
|
||||
<div class="item" v-if="item.type == 'input'">
|
||||
<span class="label"><span class="tips"></span>{{ item.label }}</span>
|
||||
<div class="value">
|
||||
<u-input type="text" placeholder="请输入" v-model="form[item.formDbName]" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="item.maxlength"
|
||||
:clearable="false"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item" v-if="item.type == 'number'">
|
||||
<span class="label"><span class="tips"></span>{{ item.label }}</span>
|
||||
<div class="value">
|
||||
<u-input type="number" placeholder="请输入" v-model="form[item.formDbName]" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="item.maxlength"
|
||||
:clearable="false"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item" v-if="item.type == 'money'">
|
||||
<span class="label"><span class="tips"></span>{{ item.label }}</span>
|
||||
<div class="value">
|
||||
<u-input type="number" placeholder="请输入" v-model="form[item.formDbName]" input-align="right"
|
||||
placeholder-style="color:#999;font-size:16px;" height="48" :maxlength="item.maxlength"
|
||||
:clearable="false" style="font-size: 16px"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item" v-if="item.type == 'select'">
|
||||
<span class="label"><span class="tips"></span>{{ item.label }}</span>
|
||||
<div class="value" @click="selectClick(item.dict, item.formDbName)">
|
||||
<span
|
||||
:class="form[item.formDbName] === '' ? 'color-999' : ''">{{
|
||||
$dict.getLabel(item.dict, form[item.formDbName]) || '请选择'
|
||||
}}</span>
|
||||
<u-icon name="arrow-right" color="#cccccc" size="24"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item" v-if="item.type == 'time'">
|
||||
<span class="label"><span class="tips"></span>{{ item.label }}</span>
|
||||
<div class="value" @click="selectTime(item.formDbName)">
|
||||
<span :class="form[item.formDbName] === '' ? 'color-999' : ''">{{
|
||||
$dateFormat(form[item.formDbName], 'YYYY-MM-DD') || '请选择'
|
||||
}}</span>
|
||||
<u-icon name="arrow-right" color="#cccccc" size="24"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer" @click="submit">
|
||||
<div class="btn">{{ isEdit ? '保存' : '提交' }}</div>
|
||||
</div>
|
||||
|
||||
<u-picker mode="time" v-model="dateShow" :params="deteParams" start-year="1900" @confirm="dateConfirm">请选择
|
||||
</u-picker>
|
||||
<u-select v-model="showSelect" :list="selectList" label-name="dictName" value-name="dictValue"
|
||||
@confirm="confirmSelect"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {mapState} from 'vuex'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
userType: '',
|
||||
name: '',
|
||||
idNumber: '',
|
||||
gender: '',
|
||||
birth: '',
|
||||
phone: '',
|
||||
areaName: '',
|
||||
address: '',
|
||||
girdName: '',
|
||||
areaId: '',
|
||||
sex: ''
|
||||
},
|
||||
dateShow: false,
|
||||
deteParams: {year: true, month: true, day: true, hour: false, minute: false, second: false},
|
||||
showSelect: false,
|
||||
selectDict: '',
|
||||
selectName: '',
|
||||
tableIndex: 0,
|
||||
tableData: [
|
||||
{
|
||||
list: [ // 残疾人
|
||||
{
|
||||
label: '家庭年收入（万）',
|
||||
type: 'money',
|
||||
formDbName: 'income',
|
||||
maxlength: 9
|
||||
},
|
||||
{
|
||||
label: '婚姻情况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialMarriage',
|
||||
formDbName: 'marriage'
|
||||
},
|
||||
{
|
||||
label: '身体状况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialHealth',
|
||||
formDbName: 'health'
|
||||
},
|
||||
{
|
||||
label: '残疾类型',
|
||||
type: 'select',
|
||||
dict: 'appSpecialDisableType',
|
||||
formDbName: 'type'
|
||||
},
|
||||
{
|
||||
label: '残疾级别',
|
||||
type: 'select',
|
||||
dict: 'appSpecialDisableLevel',
|
||||
formDbName: 'level'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
list: [ // 精神病人
|
||||
{
|
||||
label: '家庭年收入',
|
||||
type: 'money',
|
||||
formDbName: 'income',
|
||||
maxlength: 9
|
||||
},
|
||||
{
|
||||
label: '发病日期',
|
||||
type: 'time',
|
||||
formDbName: 'sickTime'
|
||||
},
|
||||
{
|
||||
label: '监护人姓名',
|
||||
type: 'input',
|
||||
formDbName: 'helpName',
|
||||
maxlength: 20
|
||||
},
|
||||
{
|
||||
label: '监护人联系方式',
|
||||
type: 'number',
|
||||
formDbName: 'helpPhone',
|
||||
maxlength: 11
|
||||
},
|
||||
{
|
||||
label: '目前危险等级',
|
||||
type: 'select',
|
||||
dict: 'appSpecialDengerLevel',
|
||||
formDbName: 'level',
|
||||
},
|
||||
{
|
||||
label: '治疗情况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialCure',
|
||||
formDbName: 'situation',
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
list: [ // 社区矫正人群
|
||||
{
|
||||
label: '具体罪名',
|
||||
type: 'input',
|
||||
formDbName: 'crime',
|
||||
maxlength: 20
|
||||
},
|
||||
{
|
||||
label: '矫正类别',
|
||||
type: 'select',
|
||||
dict: 'appSpecialChangeType',
|
||||
formDbName: 'type'
|
||||
},
|
||||
{
|
||||
label: '矫正开始日期',
|
||||
type: 'time',
|
||||
formDbName: 'startTime',
|
||||
},
|
||||
{
|
||||
label: '矫正结束日期',
|
||||
type: 'time',
|
||||
formDbName: 'endTime',
|
||||
},
|
||||
{
|
||||
label: '是否建立矫正小组',
|
||||
type: 'select',
|
||||
dict: 'yesOrNo',
|
||||
formDbName: 'isCreateGroup',
|
||||
},
|
||||
{
|
||||
label: '是否托管',
|
||||
type: 'select',
|
||||
dict: 'yesOrNo',
|
||||
formDbName: 'isRelease',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
list: [ // 戒毒人员
|
||||
{
|
||||
label: '初次发现日期',
|
||||
type: 'time',
|
||||
formDbName: 'firstTime',
|
||||
},
|
||||
{
|
||||
label: '吸毒状态',
|
||||
type: 'select',
|
||||
dict: 'appSpecialDrug',
|
||||
formDbName: 'status',
|
||||
},
|
||||
{
|
||||
label: '戒毒情况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialDebug',
|
||||
formDbName: 'debug',
|
||||
},
|
||||
{
|
||||
label: '管控情况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialControl',
|
||||
formDbName: 'control',
|
||||
},
|
||||
{
|
||||
label: '管控人姓名',
|
||||
type: 'input',
|
||||
formDbName: 'controlName',
|
||||
maxlength: 20
|
||||
},
|
||||
{
|
||||
label: '管控人联系方式',
|
||||
type: 'number',
|
||||
formDbName: 'controlPhone',
|
||||
maxlength: 11
|
||||
},
|
||||
{
|
||||
label: '有无犯罪史',
|
||||
type: 'select',
|
||||
dict: 'isReflection',
|
||||
formDbName: 'crime'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
list: [ // 刑满释放
|
||||
{
|
||||
label: '是否累犯',
|
||||
type: 'select',
|
||||
dict: 'yesOrNo',
|
||||
formDbName: 'isSecond'
|
||||
},
|
||||
{
|
||||
label: '原罪名',
|
||||
type: 'select',
|
||||
dict: 'appSpecialCrime',
|
||||
formDbName: 'crime'
|
||||
},
|
||||
{
|
||||
label: '服刑场所',
|
||||
type: 'input',
|
||||
formDbName: 'place',
|
||||
maxlength: 20
|
||||
},
|
||||
{
|
||||
label: '危险性评估',
|
||||
type: 'select',
|
||||
dict: 'appSpecialDenger',
|
||||
formDbName: 'denger'
|
||||
},
|
||||
{
|
||||
label: '安置情况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialPlacement',
|
||||
formDbName: 'placement'
|
||||
},
|
||||
{
|
||||
label: '安置时间',
|
||||
type: 'time',
|
||||
formDbName: 'placeTime'
|
||||
},
|
||||
{
|
||||
label: '衔接情况',
|
||||
type: 'select',
|
||||
dict: 'appSpecialSituation',
|
||||
formDbName: 'situation'
|
||||
},
|
||||
{
|
||||
label: '衔接时间',
|
||||
type: 'time',
|
||||
formDbName: 'situationTime'
|
||||
},
|
||||
{
|
||||
label: '是否重新犯罪',
|
||||
type: 'select',
|
||||
dict: 'yesOrNo',
|
||||
formDbName: 'isRepeat'
|
||||
},
|
||||
]
|
||||
}
|
||||
],
|
||||
selectList: [],
|
||||
id: "",
|
||||
index: "",
|
||||
isEdit: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
},
|
||||
onLoad(o) {
|
||||
this.$dict.load('appSpecialSituation', 'appSpecialPlacement', 'appSpecialDenger', 'appSpecialCrime',
|
||||
'appSpecialControl', 'appSpecialDebug', 'appSpecialDrug', 'appSpecialChangeType', 'appSpecialCure', 'appSpecialDengerLevel',
|
||||
'appSpecialDisableLevel', 'appSpecialDisableType', 'appSpecialHealth', 'appSpecialMarriage', 'appSpecialTypeFive', 'isReflection', 'yesOrNo').then(() => {
|
||||
})
|
||||
if (o) {
|
||||
this.isEdit = true
|
||||
this.id = o.id
|
||||
this.index = o.index
|
||||
this.getDetail()
|
||||
}
|
||||
if (!o.id) {
|
||||
this.isEdit = false
|
||||
this.getDetail()
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
document.title = '新增人员'
|
||||
},
|
||||
|
||||
methods: {
|
||||
getDetail() {
|
||||
if (!this.id) return
|
||||
var urlList = ['/app/appspecialdisabled/queryDetailById', '/app/appspecialmental/queryDetailById', '/app/appspecialadjustment/queryDetailById',
|
||||
'/app/appspecialdrug/queryDetailById', '/app/appspecialprison/queryDetailById']
|
||||
|
||||
this.$http.post(urlList[this.index], null, {
|
||||
params: {
|
||||
id: this.id
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$forceUpdate()
|
||||
this.form = res.data
|
||||
this.form.userType = this.index
|
||||
}
|
||||
})
|
||||
},
|
||||
changeIdNumber() {
|
||||
let people = this.$idCardNoUtil.getIdCardInfo(this.form.idNumber)
|
||||
this.form.birth = people.birthday
|
||||
this.form.gender = people.gender
|
||||
},
|
||||
|
||||
handleSelectGrid(v) {
|
||||
this.form.girdName = v?.girdName || ""
|
||||
},
|
||||
|
||||
submit() {
|
||||
if (this.form.userType === '') {
|
||||
return this.$u.toast('请选择类型')
|
||||
}
|
||||
if (!this.form.name) {
|
||||
return this.$u.toast('请输入姓名')
|
||||
}
|
||||
if (!this.form.idNumber) {
|
||||
return this.$u.toast('请输入身份证号')
|
||||
}
|
||||
if (
|
||||
!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(this.form.idNumber)
|
||||
) {
|
||||
return this.$u.toast("请输入正确的身份证账号");
|
||||
}
|
||||
if (!this.form.phone) {
|
||||
return this.$u.toast('请输入联系电话')
|
||||
}
|
||||
if (!this.form.areaName) {
|
||||
return this.$u.toast('请选择区域')
|
||||
}
|
||||
if (this.form.userType == 1) {
|
||||
if (!!this.form.income && !/^([0-9]{1,5})(\.[0-9]{1,3}){0,1}$/.test(this.form.income)) {
|
||||
return this.$u.toast('输入的数字不能超过10万')
|
||||
}
|
||||
}
|
||||
|
||||
var urlList = ['/app/appspecialdisabled/addOrUpdate', '/app/appspecialmental/addOrUpdate', '/app/appspecialadjustment/addOrUpdate',
|
||||
'/app/appspecialdrug/addOrUpdate', '/app/appspecialprison/addOrUpdate']
|
||||
|
||||
this.$http.post(urlList[this.form.userType], {
|
||||
...this.form,
|
||||
id: this.isEdit ? this.id : ''
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$u.toast(this.isEdit ? '信息保存成功' : '信息提交成功')
|
||||
uni.$emit('specialPeopleList')
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({})
|
||||
}, 600)
|
||||
this.isEdit = !this.isEdit
|
||||
} else if (res.code == 1) {
|
||||
this.$u.toast('保存失败,信息未填写')
|
||||
} else {
|
||||
this.$confirm('是否放弃编辑当前信息').then(() => {
|
||||
uni.navigateBack({})
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
areaSelect(e) {
|
||||
this.form.areaId = e
|
||||
},
|
||||
|
||||
selectClick(dictName, formName) {
|
||||
this.selectList = this.$dict.getDict(dictName)
|
||||
this.selectName = formName
|
||||
this.showSelect = true
|
||||
},
|
||||
confirmSelect(e) {
|
||||
this.form[this.selectName] = e[0].value
|
||||
|
||||
if (this.selectName == 'userType') {
|
||||
this.tableData[this.form.userType].list.map((item) => {
|
||||
this.form[item.formDbName] = ''
|
||||
})
|
||||
}
|
||||
},
|
||||
selectTime(formName) {
|
||||
this.selectName = formName
|
||||
this.dateShow = true
|
||||
},
|
||||
dateConfirm(e) {
|
||||
this.form[this.selectName] = `${e.year}-${e.month}-${e.day}`
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.Add {
|
||||
padding-bottom: 112px;
|
||||
font-size: 32px;
|
||||
|
||||
.item {
|
||||
width: 100%;
|
||||
padding: 34px 36px 34px 0;
|
||||
background: #FFFFFF;
|
||||
border-bottom: 1px solid #D8DDE6;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #333;
|
||||
line-height: 44px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.color-999 {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.value {
|
||||
width: 60%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
font-size: 32px;
|
||||
|
||||
.u-icon {
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.tips {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #F46;
|
||||
line-height: 44px;
|
||||
}
|
||||
}
|
||||
|
||||
.address {
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #333;
|
||||
background: #FFFFFF;
|
||||
border-bottom: 1px solid #D8DDE6;
|
||||
padding: 34px 36px 34px 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.tips {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #F46;
|
||||
line-height: 44px;
|
||||
}
|
||||
|
||||
.value {
|
||||
margin-left: 16px;
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
::v-deep .uni-input-form,
|
||||
::v-deep .uni-textarea-textarea,
|
||||
::v-deep .uni-input-input,
|
||||
::v-deep .uni-input-placeholder,
|
||||
::v-deep .uni-input-wrapper {
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
height: 112px;
|
||||
line-height: 112px;
|
||||
text-align: center;
|
||||
background: #1365DD;
|
||||
font-size: 32px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.line-bg {
|
||||
width: 100%;
|
||||
height: 16px;
|
||||
background: #F5F5F5;
|
||||
}
|
||||
|
||||
.pad-l32 {
|
||||
padding-left: 32px;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,25 +1,15 @@
|
||||
<template>
|
||||
<div class="AppSpecialGroups">
|
||||
<div class="title">特殊人群总计 : 60人</div>
|
||||
<div class="item" @click="toList">
|
||||
<div class="title">特殊人群总计 : {{ total }}人</div>
|
||||
<div class="item" @click="toList(item.label)" v-for="(item, index) in statisticsList" :key="index">
|
||||
<div class="left">
|
||||
<img src="./img/user-icon-mini.png" alt="">
|
||||
<span>残疾人残疾人残疾人残疾人残疾人残疾人残疾人残疾人残疾人残疾人</span>
|
||||
<span>{{ item.label }}</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
12<img src="./img/down-icon-666.png" alt="">
|
||||
{{ item.value }}<img src="./img/down-icon-666.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="left">
|
||||
<img src="./img/user-icon-mini.png" alt="">
|
||||
<span>残疾人</span>
|
||||
</div>
|
||||
<div class="right">
|
||||
12<img src="./img/down-icon-666.png" alt="">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -29,14 +19,34 @@ export default {
|
||||
appName: "特殊人群",
|
||||
data() {
|
||||
return {
|
||||
|
||||
statisticsList: [],
|
||||
total: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
toList() {
|
||||
uni.navigateTo({ url: './List'})
|
||||
getStatistic() {
|
||||
this.statisticsList = []
|
||||
this.total = 0
|
||||
this.$http.post(`/app/appspecialadjustment/statistic?type=0&range=0`).then((res) => {
|
||||
if (res?.data) {
|
||||
for (let i in res.data.map) {
|
||||
var obj = {
|
||||
label: i,
|
||||
value: res.data.map[i],
|
||||
}
|
||||
this.total = this.total + res.data.map[i]
|
||||
this.statisticsList.push(obj)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
toList(label) {
|
||||
uni.navigateTo({ url: `./List?label=${label}`})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getStatistic()
|
||||
},
|
||||
onShow() {
|
||||
document.title = "特殊人群"
|
||||
},
|
||||
|
||||
@@ -2,62 +2,121 @@
|
||||
<div class="List">
|
||||
<AiTopFixed>
|
||||
<div class="select-gird" flex>
|
||||
<AiPagePicker type="gird" v-model="handleSelectGird" valueObj nodeKey="id" formType="2">
|
||||
<AiPagePicker type="gird" v-model="girdInfo" valueObj nodeKey="id" formType="2">
|
||||
<img src="./img/gird-icon.png" alt="" class="grid-icon">
|
||||
<AiMore v-model="girdInfo.girdName" icon="arrow-down"/>
|
||||
</AiPagePicker>
|
||||
<u-search placeholder="姓名/联系方式/身份证号后6位" :show-action="false" search-icon-color="#ccc" v-model="search.title"
|
||||
@search="search.current = 1, getList()"/>
|
||||
<u-search placeholder="姓名/联系方式/身份证号后6位" :show-action="false" search-icon-color="#ccc" v-model="page.title"
|
||||
@search="page.current = 1, getList()"/>
|
||||
</div>
|
||||
</AiTopFixed>
|
||||
<div class="item">
|
||||
<div class="item" v-for="(item, index) in list" :key="index">
|
||||
<div class="user-img">
|
||||
<img src="./img/user-icon.png" alt="">
|
||||
</div>
|
||||
<div class="user-content">
|
||||
<div class="user-info">
|
||||
<h3>金宝彩</h3>
|
||||
<p>428008******8765</p>
|
||||
<h3>{{ item.name }}</h3>
|
||||
<p>{{ item.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</p>
|
||||
</div>
|
||||
<div class="btn">
|
||||
<div>
|
||||
<img src="./img/edit-icon.png" alt="">
|
||||
<img src="./img/del-icon.png" alt="">
|
||||
<img src="./img/edit-icon.png" alt="" @click="edit(item)">
|
||||
<img src="./img/del-icon.png" alt="" @click="del(item.id)">
|
||||
</div>
|
||||
<p>13890767891</p>
|
||||
<p>{{ item.phone }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AiEmpty v-if="!list.length"></AiEmpty>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'List',
|
||||
data() {
|
||||
return {
|
||||
search: {
|
||||
page: {
|
||||
current: 1,
|
||||
title: ''
|
||||
title: '',
|
||||
total: 1
|
||||
},
|
||||
girdInfo: {}
|
||||
girdInfo: {},
|
||||
navTitle: '',
|
||||
urlKey: {
|
||||
'社区矫正人群' : 'appspecialadjustment',
|
||||
'精神疾病患者' : 'appspecialmental',
|
||||
'残疾人' : 'appspecialdisabled',
|
||||
'刑满释放人员' : 'appspecialprison',
|
||||
'吸毒人员' : 'appspecialdrug'
|
||||
},
|
||||
typeList: [],
|
||||
list: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSelectGird(v) {
|
||||
this.girdInfo = v || {}
|
||||
// this.getGirdUserList()
|
||||
this.getList()
|
||||
},
|
||||
getGirdUserList() {
|
||||
// this.$http.post(`/app/appgirdmemberinfo/listGirdMemberByGirdId?girdId=${this.userGird.id}`).then((res) => {
|
||||
// if (res.code == 0) {
|
||||
// this.dataInfo = res.data
|
||||
getList() {
|
||||
this.$http.post(`/app/${this.urlKey[this.navTitle]}/list`, null, {
|
||||
params: {
|
||||
current: this.page.current,
|
||||
size: 10,
|
||||
name: this.page.title,
|
||||
girdId: this.girdInfo.id || ''
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
if (this.page.current > 1) {
|
||||
this.list = [...this.list, ...res.data.records]
|
||||
} else this.list = res.data.records
|
||||
this.page.total = res.data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
del(id) {
|
||||
this.$confirm('确定删除该人员?').then(() => {
|
||||
this.$http.post(`/app/${this.urlKey[this.navTitle]}/delete?ids=${id}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.$u.toast('删除成功！')
|
||||
this.page.current = 1
|
||||
this.list = []
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
edit(row) {
|
||||
var index = ['残疾人', '精神疾病患者', '社区矫正人群', '吸毒人员', '刑满释放人员'].indexOf(this.navTitle)
|
||||
console.log(index)
|
||||
// this.typeList.map((item) => {
|
||||
// console.log(this.navTitle, item.dictName)
|
||||
// if(this.navTitle == item.dictName) {
|
||||
// index = item.dictValue
|
||||
// }
|
||||
// })
|
||||
},
|
||||
uni.navigateTo({url : `./Add?id=${row.id}&index=${index}`})
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
this.$dict.load('appSpecialTypeFive').then(() => {
|
||||
this.typeList = this.$dict.getDict('appSpecialTypeFive')
|
||||
})
|
||||
this.navTitle = option.label
|
||||
this.getList()
|
||||
},
|
||||
onShow() {
|
||||
// document.title = "残疾人列表"
|
||||
document.title = this.navTitle
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.page.total > this.list.length) {
|
||||
this.page.current++
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,246 +0,0 @@
|
||||
<template>
|
||||
<div class="pickGrid">
|
||||
<div class="header-middle">
|
||||
<div class="hint">
|
||||
<span v-for="(item, index) in selectList" :key="index">
|
||||
<span v-if="index" style="margin:0 4px;" v-text="`/`"/>
|
||||
<span style="color:#3F8DF5" @click="girdNameClick(item, index)" v-text="item.girdName"/>
|
||||
</span>
|
||||
</div>
|
||||
<div class="showTypes">
|
||||
<div v-if="options.length > 0">
|
||||
<div class="cards" v-for="(item, index) in options" :key="index">
|
||||
<div class="imges">
|
||||
<img src="./img/gird--select-icon.png" alt="" class="avatras"/>
|
||||
</div>
|
||||
<div class="rightes fill">
|
||||
<div class="applicationNames fill" @click="itemClick(item)">{{ item.girdName }}</div>
|
||||
<u-icon class="more" name="arrow-right" @click="girdClick(item, index)"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AiEmpty :description="isGridMember?`暂无数据`:`当前人员不是网格员或网格长`" class="emptyWrap" v-else/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapState} from "vuex";
|
||||
|
||||
export default {
|
||||
name: 'pickGrid',
|
||||
appName: "网格选择",
|
||||
data() {
|
||||
return {
|
||||
SelectGird: {},
|
||||
allData: null,
|
||||
options: [],
|
||||
selectList: [],
|
||||
parentGirdId: '',
|
||||
isFormMap: 0, //1为网格地图 一级不允许选中
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
isMyGirds() {
|
||||
return this.$route?.query.self == true
|
||||
},
|
||||
isGridMember() {
|
||||
return this.user.girdCheckType > 0
|
||||
},
|
||||
//是否是网格员申报
|
||||
isApply: v => v.$route?.query.formType == 2,
|
||||
clearable: v => v.$route?.query.clearable,
|
||||
selected: v => [v.$route?.query.selected].flat()
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.isFormMap) {
|
||||
this.isFormMap = option.isFormMap
|
||||
}
|
||||
this.isGridMember || this.isApply ? this.getAllGrids() : this.$u.toast('当前人员不是网格员或网格长')
|
||||
},
|
||||
methods: {
|
||||
getAllGrids() {
|
||||
this.selectList = []
|
||||
let {girdMemberId} = this.user,
|
||||
url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser`,
|
||||
params = {girdMemberId}
|
||||
if (this.isApply) {
|
||||
url = `/app/appgirdinfo/listByInfo`
|
||||
params = {}
|
||||
}
|
||||
if (this.isMyGirds) {
|
||||
url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2`
|
||||
}
|
||||
this.$http.post(url, null, {params}).then((res) => {
|
||||
if (res?.data) {
|
||||
let parents = res.data.map(e => e.parentGirdId)
|
||||
this.allData = res.data.map(e => ({...e, hasChildren: parents.includes(e.id)}))
|
||||
this.treeInit()
|
||||
}
|
||||
})
|
||||
},
|
||||
treeInit(isClick) {
|
||||
let last = uni.getStorageSync("lastSelectedGrid")
|
||||
if (!isClick && last && !this.isApply) {
|
||||
this.$http.post("/app/appgirdinfo/listFatherGirdInfo", null, {
|
||||
params: {girdId: last}
|
||||
}).then(res => {
|
||||
if (res?.data) {
|
||||
this.selectList = [{girdName: '可选范围', id: ''}, res.data.filter(e => !!this.allData.find(a => a.id == e.id))].flat()
|
||||
this.getGridsByGridMemberAndParent({id: last})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.options = this.allData.filter((e, i, arr) => !arr.map(e => e.id).includes(e.parentGirdId) || this.isMyGirds)
|
||||
this.options.map((item) => item.isChecked = this.selected.includes(item.id))
|
||||
let obj = {girdName: '可选范围', id: ''}
|
||||
this.selectList.push(obj)
|
||||
}
|
||||
},
|
||||
itemClick(row) {
|
||||
if (row.hasChildren) {
|
||||
let obj = {
|
||||
girdName: row.girdName,
|
||||
id: row.id,
|
||||
}
|
||||
this.selectList.push(obj)
|
||||
this.getGridsByGridMemberAndParent(row)
|
||||
}
|
||||
},
|
||||
getGridsByGridMemberAndParent(row) {
|
||||
let {id: parentGirdId} = row
|
||||
this.options = this.allData.filter(e => e.parentGirdId == parentGirdId)
|
||||
this.options.map((item) => item.isChecked = this.selected.includes(item.id))
|
||||
},
|
||||
girdNameClick(row, index) {
|
||||
if (!index) { //第一级别
|
||||
this.selectList = []
|
||||
this.treeInit(true)
|
||||
} else {
|
||||
this.selectList.splice(index, 8)
|
||||
this.getGridsByGridMemberAndParent(row)
|
||||
}
|
||||
},
|
||||
girdClick(row) {
|
||||
this.SelectGird = row
|
||||
this.$forceUpdate()
|
||||
this.submit()
|
||||
},
|
||||
submit() {
|
||||
if (this.SelectGird.id != null) {
|
||||
if (!this.isApply && !this.isMyGirds) {
|
||||
uni.setStorageSync("lastSelectedGrid", this.SelectGird.parentGirdId)
|
||||
}
|
||||
uni.navigateBack({
|
||||
success: () => {
|
||||
uni.$emit("pagePicker:custom", this.SelectGird)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
return this.$u.toast('请选择网格')
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.pickGrid {
|
||||
min-height: 100vh;
|
||||
background: #fff;
|
||||
padding-bottom: 140px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.more {
|
||||
width: 80px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.header-middle {
|
||||
.hint {
|
||||
padding: 28px 20px 28px 32px;
|
||||
line-height: 56px;
|
||||
box-shadow: 0px 1px 0px 0px #e4e5e6;
|
||||
font-size: 30px;
|
||||
font-weight: 500;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.showTypes {
|
||||
.cards {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
// background: pink;
|
||||
padding: 0 0 0 32px;
|
||||
|
||||
.imges {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// width: 200px;
|
||||
.imgselect {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.avatras {
|
||||
width: 74px;
|
||||
height: 74px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 74px;
|
||||
height: 74px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.rightes {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #e4e5e6;
|
||||
padding: 0 16px;
|
||||
|
||||
.applicationNames {
|
||||
display: inline-block;
|
||||
font-size: 36px;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.subBtn {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 118px;
|
||||
background: #f4f8fb;
|
||||
justify-content: flex-end;
|
||||
|
||||
div {
|
||||
width: 192px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
text-align: center;
|
||||
border: 2px solid #1365dd;
|
||||
background: #1365dd;
|
||||
border-radius: 4px;
|
||||
font-size: 32px;
|
||||
color: #fff;
|
||||
margin-right: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user