特殊人群
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>
|
<template>
|
||||||
<div class="AppSpecialGroups">
|
<div class="AppSpecialGroups">
|
||||||
<div class="title">特殊人群总计 : 60人</div>
|
<div class="title">特殊人群总计 : {{ total }}人</div>
|
||||||
<div class="item" @click="toList">
|
<div class="item" @click="toList(item.label)" v-for="(item, index) in statisticsList" :key="index">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<img src="./img/user-icon-mini.png" alt="">
|
<img src="./img/user-icon-mini.png" alt="">
|
||||||
<span>残疾人残疾人残疾人残疾人残疾人残疾人残疾人残疾人残疾人残疾人</span>
|
<span>{{ item.label }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<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>
|
</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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -29,14 +19,34 @@ export default {
|
|||||||
appName: "特殊人群",
|
appName: "特殊人群",
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
statisticsList: [],
|
||||||
|
total: 0
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
toList() {
|
getStatistic() {
|
||||||
uni.navigateTo({ url: './List'})
|
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() {
|
onShow() {
|
||||||
document.title = "特殊人群"
|
document.title = "特殊人群"
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -2,62 +2,121 @@
|
|||||||
<div class="List">
|
<div class="List">
|
||||||
<AiTopFixed>
|
<AiTopFixed>
|
||||||
<div class="select-gird" flex>
|
<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">
|
<img src="./img/gird-icon.png" alt="" class="grid-icon">
|
||||||
<AiMore v-model="girdInfo.girdName" icon="arrow-down"/>
|
<AiMore v-model="girdInfo.girdName" icon="arrow-down"/>
|
||||||
</AiPagePicker>
|
</AiPagePicker>
|
||||||
<u-search placeholder="姓名/联系方式/身份证号后6位" :show-action="false" search-icon-color="#ccc" v-model="search.title"
|
<u-search placeholder="姓名/联系方式/身份证号后6位" :show-action="false" search-icon-color="#ccc" v-model="page.title"
|
||||||
@search="search.current = 1, getList()"/>
|
@search="page.current = 1, getList()"/>
|
||||||
</div>
|
</div>
|
||||||
</AiTopFixed>
|
</AiTopFixed>
|
||||||
<div class="item">
|
<div class="item" v-for="(item, index) in list" :key="index">
|
||||||
<div class="user-img">
|
<div class="user-img">
|
||||||
<img src="./img/user-icon.png" alt="">
|
<img src="./img/user-icon.png" alt="">
|
||||||
</div>
|
</div>
|
||||||
<div class="user-content">
|
<div class="user-content">
|
||||||
<div class="user-info">
|
<div class="user-info">
|
||||||
<h3>金宝彩</h3>
|
<h3>{{ item.name }}</h3>
|
||||||
<p>428008******8765</p>
|
<p>{{ item.idNumber.replace(/^(\w{6})\w{8}(.*)$/, '$1********$2') }}</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn">
|
<div class="btn">
|
||||||
<div>
|
<div>
|
||||||
<img src="./img/edit-icon.png" alt="">
|
<img src="./img/edit-icon.png" alt="" @click="edit(item)">
|
||||||
<img src="./img/del-icon.png" alt="">
|
<img src="./img/del-icon.png" alt="" @click="del(item.id)">
|
||||||
</div>
|
</div>
|
||||||
<p>13890767891</p>
|
<p>{{ item.phone }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<AiEmpty v-if="!list.length"></AiEmpty>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
name: 'List',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
search: {
|
page: {
|
||||||
current: 1,
|
current: 1,
|
||||||
title: ''
|
title: '',
|
||||||
|
total: 1
|
||||||
},
|
},
|
||||||
girdInfo: {}
|
girdInfo: {},
|
||||||
|
navTitle: '',
|
||||||
|
urlKey: {
|
||||||
|
'社区矫正人群' : 'appspecialadjustment',
|
||||||
|
'精神疾病患者' : 'appspecialmental',
|
||||||
|
'残疾人' : 'appspecialdisabled',
|
||||||
|
'刑满释放人员' : 'appspecialprison',
|
||||||
|
'吸毒人员' : 'appspecialdrug'
|
||||||
|
},
|
||||||
|
typeList: [],
|
||||||
|
list: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleSelectGird(v) {
|
handleSelectGird(v) {
|
||||||
this.girdInfo = v || {}
|
this.girdInfo = v || {}
|
||||||
// this.getGirdUserList()
|
this.getList()
|
||||||
},
|
},
|
||||||
getGirdUserList() {
|
getList() {
|
||||||
// this.$http.post(`/app/appgirdmemberinfo/listGirdMemberByGirdId?girdId=${this.userGird.id}`).then((res) => {
|
this.$http.post(`/app/${this.urlKey[this.navTitle]}/list`, null, {
|
||||||
// if (res.code == 0) {
|
params: {
|
||||||
// this.dataInfo = res.data
|
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() {
|
onShow() {
|
||||||
// document.title = "残疾人列表"
|
document.title = this.navTitle
|
||||||
},
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
if (this.page.total > this.list.length) {
|
||||||
|
this.page.current++
|
||||||
|
this.getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</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