LL
4 months ago
8 changed files with 5226 additions and 0 deletions
@ -0,0 +1,162 @@ |
|||||
|
/** 固定值 */ |
||||
|
export const categoryAllList = [ |
||||
|
{ |
||||
|
label: "群众", |
||||
|
value: "partyFlag0", |
||||
|
}, |
||||
|
{ |
||||
|
label: "流动人员", |
||||
|
value: "FLOATING_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "党员", |
||||
|
value: "partyFlag1", |
||||
|
}, |
||||
|
{ |
||||
|
label: "共青团员", |
||||
|
value: "partyFlag2", |
||||
|
}, |
||||
|
{ |
||||
|
label: "残疾人", |
||||
|
value: "DISABILITY_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "大病", |
||||
|
value: "SERIOUS_ILLNESS_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "慢病", |
||||
|
value: "CHRONIC_DISEASE_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "老年人", |
||||
|
value: "OLD_PEOPLE_FLAG", |
||||
|
children: [ |
||||
|
{ |
||||
|
label: "失能老人", |
||||
|
value: "DISABLED_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "空巢老人", |
||||
|
value: "EMPTY_NESTER_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "失智老人", |
||||
|
value: "DEMENTED_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "独居老人", |
||||
|
value: "LIVE_ALONE_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "普通老年人", |
||||
|
value: "OLD_PEOPLE_FLAG", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
label: "低保人员", |
||||
|
value: "SUBSISTENCE_ALLOWANCE_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "退役军人", |
||||
|
value: "VETERAN_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "保障房人员", |
||||
|
value: "ENSURE_HOUSE_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "育龄妇女", |
||||
|
value: "FERTILE_WOMAN_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "特扶人员", |
||||
|
value: "SPECIAL_SUPPORT_FLAG", |
||||
|
children: [ |
||||
|
{ |
||||
|
label: "子女伤残", |
||||
|
value: "CHILDREN_DISABILITY_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "子女死亡", |
||||
|
value: "CHILDREN_DEATH", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ |
||||
|
label: "留守儿童", |
||||
|
value: "LBC_FLAG", |
||||
|
children: null, |
||||
|
}, |
||||
|
{ |
||||
|
label: "艾滋病人员", |
||||
|
value: "AIDS_FLAG", |
||||
|
children: null, |
||||
|
}, |
||||
|
{ |
||||
|
label: "失业人员", |
||||
|
value: "UNEMPLOYED_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "新阶层人士", |
||||
|
value: "NEW_STRATUM_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "新就业群体", |
||||
|
value: "NEG_FLAG", |
||||
|
children: null, |
||||
|
}, |
||||
|
{ |
||||
|
label: "安置帮教人员", |
||||
|
value: "anzhibangjiao", |
||||
|
}, |
||||
|
{ |
||||
|
label: "吸毒人员", |
||||
|
value: "xidurenyuan", |
||||
|
}, |
||||
|
{ |
||||
|
label: "社区矫正人员", |
||||
|
value: "shequjiaozheng", |
||||
|
}, |
||||
|
{ |
||||
|
label: "不良青少年", |
||||
|
value: "buliangqingshaonian", |
||||
|
}, |
||||
|
{ |
||||
|
label: "肇事肇祸精神障碍患者", |
||||
|
value: "zhaoshizhaohuojingshenbing", |
||||
|
}, |
||||
|
{ |
||||
|
label: "邪教人员", |
||||
|
value: "xiejiaorenyuan", |
||||
|
}, |
||||
|
{ |
||||
|
label: "信访人员", |
||||
|
value: "xinfang", |
||||
|
}, |
||||
|
{ |
||||
|
label: "统战人员", |
||||
|
value: "tongzhan", |
||||
|
}, |
||||
|
{ |
||||
|
label: "志愿者", |
||||
|
value: "VOLUNTEER_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "网格员", |
||||
|
value: "GRID_MEMBER_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "楼长", |
||||
|
value: "BUILDING_CHIEF_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "单元长", |
||||
|
value: "UNIT_CHIEF_FLAG", |
||||
|
}, |
||||
|
{ |
||||
|
label: "公益岗", |
||||
|
value: "PUBLIC_WELFARE_FLAG", |
||||
|
}, |
||||
|
]; |
||||
@ -0,0 +1,471 @@ |
|||||
|
<template> |
||||
|
<el-dialog :visible.sync="visible" :title="title" :close-on-click-modal="false" :close-on-press-escape="false" |
||||
|
width="950px" top="5vh" class="dialog-h" :before-close="handleCancel"> |
||||
|
<div class="dialog-h-content scroll-h"> |
||||
|
<el-form ref="ref_form" :inline="true" :model="formData" :disabled="title == '查看'" :rules="dataRule" class="form"> |
||||
|
<!-- <el-form-item label="居民分类" label-width="150px" prop="categoryList"> |
||||
|
<el-cascader ref="categoryAll" size="small" class="item_width_1 custom-cascader" |
||||
|
v-model.trim="formData.categoryList" :options="categoryAllList" |
||||
|
:props="{ multiple: true, checkStrictly: true, emitPath: false }" clearable></el-cascader> |
||||
|
</el-form-item> --> |
||||
|
|
||||
|
<el-form-item label="类别名称" prop="importantName" label-width="150px"> |
||||
|
<el-input v-model.trim="formData.importantName" size="small" clearable placeholder="请输入" |
||||
|
class="item_width_1"></el-input> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item class="full" label="居民分类" label-width="150px" prop="categoryList"> |
||||
|
<el-table border ref="tableBox" :data="tableData" :row-style="{ height: '50px' }" |
||||
|
:cell-style="{ padding: '0px' }" style="width: 100%"> |
||||
|
<el-table-column prop="province" label="标签" width="120" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="city" label="内容" align="left" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<div v-if="scope.row.type == 'radio'" style="white-space: normal; word-break: break-all;"> |
||||
|
<el-radio-group v-model.trim="scope.row.value" v-for="(item, index) in scope.row.option" :key="index" |
||||
|
@change="handleClickRadio(index, scope.$index)"> |
||||
|
<el-radio :label="item.value" :disabled="item.disabled"><span |
||||
|
style="margin-right: 50px;" :value="item.value">{{ item.label |
||||
|
}}</span></el-radio> |
||||
|
</el-radio-group> |
||||
|
</div> |
||||
|
<div v-if="scope.row.type == 'checkbox'" :prop="'tableData.' + scope.$index + '.value'" |
||||
|
style="white-space: normal; word-break: break-all;"> |
||||
|
<el-checkbox-group v-model.trim="scope.row.value"> |
||||
|
<el-checkbox @change="(val) => handleClickCheckbox(val, item)" |
||||
|
:disabled="item.disabled" v-for="(item, index) in scope.row.option" |
||||
|
:key="index" :label="item.value">{{ item.label |
||||
|
}}</el-checkbox> |
||||
|
</el-checkbox-group> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
|
||||
|
<div class="div_btn"> |
||||
|
<el-button size="small" @click="handleCancel" :loading="btnDisable">取 消</el-button> |
||||
|
<el-button size="small" type="primary" :loading="btnDisable" @click="handleConfirm">确 定</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import _ from 'lodash' |
||||
|
import { Loading } from 'element-ui' // 引入Loading服务 |
||||
|
import { requestPost } from '@/js/dai/request' |
||||
|
import { categoryAllList } from '@/utils/enum.js'; |
||||
|
import { requestGet } from "@/js/dai/request"; |
||||
|
|
||||
|
const defaultFormData = { |
||||
|
id: undefined, |
||||
|
importType: 'normal', |
||||
|
importantName: '', |
||||
|
categoryList: [] |
||||
|
} |
||||
|
|
||||
|
const defaultTableData = [ |
||||
|
{ |
||||
|
index: 0, |
||||
|
province: '政治面貌', |
||||
|
value: 0, |
||||
|
type: 'radio', |
||||
|
option: [ |
||||
|
{ label: '群众', value: 'partyFlag0' }, |
||||
|
{ label: '党员', value: 'partyFlag1' }, |
||||
|
{ label: '共青团员', value: 'partyFlag2' }, |
||||
|
] |
||||
|
}, |
||||
|
{ |
||||
|
index: 1, |
||||
|
province: '健康状态', |
||||
|
value: [], |
||||
|
type: 'checkbox', |
||||
|
option: [ |
||||
|
{ |
||||
|
label: '残疾', |
||||
|
value: 'DISABILITY_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '大病', |
||||
|
value: 'SERIOUS_ILLNESS_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '慢病', |
||||
|
value: 'CHRONIC_DISEASE_FLAG' |
||||
|
} |
||||
|
] |
||||
|
}, |
||||
|
{ |
||||
|
index: 2, |
||||
|
province: '关注人群', |
||||
|
value: [], |
||||
|
type: 'checkbox', |
||||
|
option: [ |
||||
|
{ |
||||
|
label: '老年人', |
||||
|
value: 'OLD_PEOPLE_FLAG', |
||||
|
}, |
||||
|
// { |
||||
|
// label: "失能老人", |
||||
|
// value: "DISABLED_FLAG", |
||||
|
// }, |
||||
|
// { |
||||
|
// label: "空巢老人", |
||||
|
// value: "EMPTY_NESTER_FLAG", |
||||
|
// }, |
||||
|
// { |
||||
|
// label: "失智老人", |
||||
|
// value: "DEMENTED_FLAG", |
||||
|
// }, |
||||
|
// { |
||||
|
// label: "独居老人", |
||||
|
// value: "LIVE_ALONE_FLAG", |
||||
|
// }, |
||||
|
// { |
||||
|
// label: "普通老年人", |
||||
|
// value: "OLD_PEOPLE_FLAG", |
||||
|
// }, |
||||
|
{ |
||||
|
label: '低保', |
||||
|
value: 'SUBSISTENCE_ALLOWANCE_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '退役军人', |
||||
|
value: 'VETERAN_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '保障房人员', |
||||
|
value: 'ENSURE_HOUSE_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '育龄妇女', |
||||
|
value: 'FERTILE_WOMAN_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '特扶人员', |
||||
|
value: 'SPECIAL_SUPPORT_FLAG' |
||||
|
}, { |
||||
|
label: '留守儿童', |
||||
|
value: 'LBC_FLAG' |
||||
|
}, { |
||||
|
label: '艾滋病人员', |
||||
|
value: 'AIDS_FLAG' |
||||
|
}, { |
||||
|
label: '流动人员', |
||||
|
value: 'FLOATING_FLAG' |
||||
|
}, { |
||||
|
label: '新阶层人士', |
||||
|
value: 'NEW_STRATUM_FLAG' |
||||
|
}, { |
||||
|
label: '新就业群体', |
||||
|
value: 'NEG_FLAG' |
||||
|
}, { |
||||
|
label: '失业人员', |
||||
|
value: 'UNEMPLOYED_FLAG' |
||||
|
} |
||||
|
] |
||||
|
}, |
||||
|
{ |
||||
|
index: 3, |
||||
|
province: '特殊人群', |
||||
|
value: [], |
||||
|
type: 'checkbox', |
||||
|
option: [] |
||||
|
}, |
||||
|
{ |
||||
|
index: 4, |
||||
|
province: '身份', |
||||
|
value: [], |
||||
|
type: 'checkbox', |
||||
|
option: [ |
||||
|
{ |
||||
|
label: '志愿者', |
||||
|
value: 'VOLUNTEER_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '网格员', |
||||
|
value: 'GRID_MEMBER_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '楼长', |
||||
|
value: 'BUILDING_CHIEF_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '单元长', |
||||
|
value: 'UNIT_CHIEF_FLAG' |
||||
|
}, |
||||
|
{ |
||||
|
label: '公益岗', |
||||
|
value: 'PUBLIC_WELFARE_FLAG' |
||||
|
} |
||||
|
] |
||||
|
}, |
||||
|
]; |
||||
|
|
||||
|
let loading // 加载动画 |
||||
|
export default { |
||||
|
name: 'revitalizeDialog', |
||||
|
components: {}, |
||||
|
props: { |
||||
|
visible: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
}, |
||||
|
title: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
categoryAllList: _.cloneDeep(categoryAllList), |
||||
|
formData: _.cloneDeep(defaultFormData), |
||||
|
btnDisable: false, |
||||
|
tableData: _.cloneDeep(defaultTableData), |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
mounted() { |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
async initForm(row) { |
||||
|
const { data } = await requestPost('/sys/dict/data/dictlist', { dictType: 'special_resident_category' }); |
||||
|
this.tableData[3].option = data; |
||||
|
if (row && row.id) { |
||||
|
this.startLoading() |
||||
|
let url = `/actual/base/residentCategoryImportant/detail/${row.id}` |
||||
|
const { data, code, msg } = await requestGet(url) |
||||
|
this.formData = data ? data : _.cloneDeep(defaultFormData) |
||||
|
// 根据categoryCodeList设置option.selected为true并赋值给radio/checkbox |
||||
|
if (data && data.categoryCodeList) { |
||||
|
this.tableData.forEach(row => { |
||||
|
// 处理单选框 |
||||
|
if (row.type === 'radio') { |
||||
|
const matchedItem = row.option.find(item => data.categoryCodeList.includes(item.value)); |
||||
|
if (matchedItem) { |
||||
|
row.value = matchedItem.value; |
||||
|
matchedItem.selected = true; |
||||
|
} |
||||
|
} |
||||
|
// 处理复选框 |
||||
|
else if (row.type === 'checkbox') { |
||||
|
row.value = row.option |
||||
|
.filter(item => data.categoryCodeList.includes(item.value)) |
||||
|
.map(item => item.value); |
||||
|
} |
||||
|
|
||||
|
// 设置selected状态 |
||||
|
row.option.forEach(item => { |
||||
|
item.selected = data.categoryCodeList.includes(item.value); |
||||
|
}); |
||||
|
}); |
||||
|
this.handleCategoryList(); |
||||
|
} |
||||
|
this.endLoading() |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
handleClickRadio(index, rowIndex) { |
||||
|
this.tableData[rowIndex].option.forEach((item, i) => { |
||||
|
if (i === index) item.selected = true |
||||
|
else item.selected = false |
||||
|
}) |
||||
|
this.handleCategoryList(); |
||||
|
}, |
||||
|
handleClickCheckbox(val, item) { |
||||
|
item.selected = val; |
||||
|
this.handleCategoryList(); |
||||
|
// item.index = index; |
||||
|
// if (event) { |
||||
|
// this.$emit('showDialog', item, event) |
||||
|
// } else { |
||||
|
// this.$confirm(`确认取消${item.label}标签`, '确认信息', { |
||||
|
// confirmButtonText: '确认取消', |
||||
|
// cancelButtonText: '暂不取消', |
||||
|
// type: 'warning' |
||||
|
// }).then(() => { |
||||
|
// this.$emit('showDialog', item, event) |
||||
|
// }).catch(() => { |
||||
|
// this.formData.tableData[index].value.push(item.value) |
||||
|
// }); |
||||
|
// } |
||||
|
}, |
||||
|
|
||||
|
// 添加类别 |
||||
|
handleCategoryList() { |
||||
|
this.formData.categoryList = this.tableData.flatMap(row => |
||||
|
row.option.filter(item => item.selected).map(item => item.value) |
||||
|
); |
||||
|
console.log('this.formData.categoryList===', this.formData.categoryList) |
||||
|
this.$refs.ref_form.validateField('categoryList') |
||||
|
}, |
||||
|
async handleConfirm() { |
||||
|
this.$refs['ref_form'].validate(async valid => { |
||||
|
if (valid) { |
||||
|
this.btnDisable = true |
||||
|
let url = this.formData.id ? '/actual/base/residentCategoryImportant/update' : '/actual/base/residentCategoryImportant/create' |
||||
|
const { data, code, internalMsg } = await requestPost(url, this.formData) |
||||
|
if (code === 0) { |
||||
|
this.$message.success(this.formData.id ? '更新成功' : '新增成功') |
||||
|
this.resetData() |
||||
|
this.$emit('update:visible', false) |
||||
|
this.$emit('success') |
||||
|
} else { |
||||
|
this.$message.error(internalMsg) |
||||
|
} |
||||
|
this.btnDisable = false |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
// 取消 |
||||
|
handleCancel() { |
||||
|
this.resetData() |
||||
|
this.$emit('update:visible', false) |
||||
|
}, |
||||
|
|
||||
|
resetData() { |
||||
|
this.formData = _.cloneDeep(defaultFormData); |
||||
|
this.tableData = _.cloneDeep(defaultTableData); |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['ref_form'].resetFields(); |
||||
|
}) |
||||
|
}, |
||||
|
// 开启加载动画 |
||||
|
startLoading() { |
||||
|
loading = Loading.service({ |
||||
|
lock: true, // 是否锁定 |
||||
|
text: '正在加载……', // 加载中需要显示的文字 |
||||
|
background: 'rgba(0,0,0,.7)' // 背景颜色 |
||||
|
}) |
||||
|
}, |
||||
|
// 结束加载动画 |
||||
|
endLoading() { |
||||
|
// clearTimeout(timer); |
||||
|
if (loading) { |
||||
|
loading.close() |
||||
|
} |
||||
|
}, |
||||
|
// 更新分类标签 |
||||
|
updateCategoryTags() { |
||||
|
this.$nextTick(() => { |
||||
|
const cascaderEl = this.$refs.categoryAll.$el; |
||||
|
const tagsContainer = cascaderEl.querySelector('.el-cascader__tags'); |
||||
|
const tags = tagsContainer.querySelectorAll('.el-tag'); |
||||
|
|
||||
|
// 移除已存在的+n标签 |
||||
|
const moreTag = tagsContainer.querySelector('.el-tag-more'); |
||||
|
if (moreTag) { |
||||
|
moreTag.remove(); |
||||
|
} |
||||
|
|
||||
|
// 恢复所有标签显示 |
||||
|
tags.forEach(tag => { |
||||
|
tag.style.display = 'inline-block'; |
||||
|
}); |
||||
|
|
||||
|
// 计算可见标签数量 |
||||
|
let visibleCount = 0; |
||||
|
let containerWidth = tagsContainer.offsetWidth; |
||||
|
let totalWidth = 0; |
||||
|
const tagMargin = 7; |
||||
|
|
||||
|
for (let i = 0; i < tags.length; i++) { |
||||
|
const tag = tags[i]; |
||||
|
const tagWidth = tag.offsetWidth; |
||||
|
|
||||
|
// 第一个标签没有左边距 |
||||
|
const margin = i > 0 ? tagMargin : 0; |
||||
|
|
||||
|
if (totalWidth + tagWidth + margin > containerWidth && visibleCount > 0) { |
||||
|
break; |
||||
|
} |
||||
|
|
||||
|
totalWidth += tagWidth + margin; |
||||
|
visibleCount++; |
||||
|
} |
||||
|
|
||||
|
// 隐藏超出的标签并显示+n标签 |
||||
|
if (visibleCount < tags.length) { |
||||
|
const hiddenCount = tags.length - visibleCount; |
||||
|
|
||||
|
// 隐藏超出的标签（包括前面一个标签） |
||||
|
const startHideIndex = visibleCount > 0 ? visibleCount - 1 : 0; |
||||
|
for (let i = startHideIndex; i < tags.length; i++) { |
||||
|
tags[i].style.display = 'none'; |
||||
|
} |
||||
|
|
||||
|
// 创建+n标签 |
||||
|
const moreTag = document.createElement('span'); |
||||
|
moreTag.className = 'el-tag el-tag--info el-tag--mini el-tag--light el-tag-more'; |
||||
|
moreTag.textContent = `+${hiddenCount + (startHideIndex > 0 ? 1 : 0)}`; |
||||
|
moreTag.style.marginLeft = '8px'; |
||||
|
tagsContainer.appendChild(moreTag); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule() { |
||||
|
return { |
||||
|
categoryList: [ |
||||
|
{ required: true, message: '请选择分类', trigger: 'change' } |
||||
|
], |
||||
|
importantName: [ |
||||
|
{ required: true, message: '请输入类别名称', trigger: 'blur' } |
||||
|
], |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
watch: { |
||||
|
// 'formData.categoryList': { |
||||
|
// handler(newVal) { |
||||
|
// this.$nextTick(() => { |
||||
|
// this.updateCategoryTags() |
||||
|
// }) |
||||
|
// }, |
||||
|
// deep: true |
||||
|
// } |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.form { |
||||
|
margin-top: 16px; |
||||
|
} |
||||
|
|
||||
|
.item_width_1 { |
||||
|
width: 560px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.custom-cascader { |
||||
|
::v-deep .el-cascader__tags { |
||||
|
flex-wrap: nowrap; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.full { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
|
||||
|
::v-deep .el-form-item__content { |
||||
|
flex: 1; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.div_btn { |
||||
|
width: 100%; |
||||
|
text-align: right; |
||||
|
padding-right: 20px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,235 @@ |
|||||
|
<template> |
||||
|
<div class="g-main"> |
||||
|
<!-- 重点类别 --> |
||||
|
<div class="m-search"> |
||||
|
<el-form :inline="true" :model="queryParams" ref="ref_searchform" :label-width="'100px'"> |
||||
|
<div> |
||||
|
<el-form-item label="类别名称" prop="title"> |
||||
|
<el-input v-model.trim="queryParams.title" size="small" class="item_width_1" clearable placeholder="请输入"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
<div> |
||||
|
<div style="display: flex; justify-content: flex-end;"> |
||||
|
<el-button style="margin-left:10px" class="diy-button--blue" size="small" |
||||
|
@click="handleSearch">查询</el-button> |
||||
|
<el-button style="margin-left:10px" class="diy-button--white" size="small" |
||||
|
@click="resetSearch">重置</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
<div class="m-table"> |
||||
|
<div class="div_btn"> |
||||
|
<el-button style="" class="diy-button--add" size="small" @click="handleAdd">新增</el-button> |
||||
|
</div> |
||||
|
|
||||
|
<el-table class="table" :data="tableData" border :height="tableHeight" v-loading="tableLoading" |
||||
|
style="width: 100%;margin-top:16px"> |
||||
|
|
||||
|
<el-table-column label="序号" header-align="center" align="center" type="index" width="50" /> |
||||
|
<el-table-column prop="importantName" header-align="center" align="center" label="类型名称" /> |
||||
|
<el-table-column prop="categoryCodeList" header-align="center" align="center" label="居民分类" show-overflow-tooltip :formatter="formatterCategory" /> |
||||
|
<el-table-column label="操作" fixed="right" header-align="center" align="center" width="160" class="operate"> |
||||
|
<template slot-scope="scope"> |
||||
|
|
||||
|
<el-button type="text" style="color:#1C6AFD;" size="small" @click="handleDetail(scope.row)">查看</el-button> |
||||
|
|
||||
|
<el-button type="text" style="color:#1C6AFD;" size="small" |
||||
|
@click="handleEdit(scope.row)">编辑</el-button> |
||||
|
|
||||
|
<el-button type="text" style="color:#1C6AFD;" size="small" |
||||
|
@click="handleDelete(scope.row)">删除</el-button> |
||||
|
|
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<div> |
||||
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="pageNo" |
||||
|
:page-sizes="[10, 20, 50]" :page-size="pageSize" layout="sizes, prev, pager, next, total" :total="total"> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
<!-- 新增 || 修改 || 查看弹出框 --> |
||||
|
<key-category-dialog ref="keyCategoryDialog" :visible.sync="dialogVisible" :title="dialogTitle" |
||||
|
@success="getTableData"></key-category-dialog> |
||||
|
|
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { mapGetters } from 'vuex'; |
||||
|
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
import { categoryAllList } from '@/utils/enum.js'; |
||||
|
import keyCategoryDialog from './components/keyCategoryDialog.vue'; |
||||
|
|
||||
|
export default { |
||||
|
name: 'keyCategoryIndex', |
||||
|
components: { |
||||
|
keyCategoryDialog, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
loading: false, |
||||
|
total: 0, |
||||
|
pageSize: 10, |
||||
|
pageNo: 1, |
||||
|
tableLoading: false, |
||||
|
agencyId: '', |
||||
|
typeList: [], |
||||
|
categoryAllList: _.cloneDeep(categoryAllList), |
||||
|
queryParams: { |
||||
|
// title: "", |
||||
|
}, |
||||
|
tableData: [], |
||||
|
dialogVisible: false, |
||||
|
dialogTitle: '', |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
this.getTableData() |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
|
||||
|
// 获取列表 |
||||
|
async getTableData() { |
||||
|
const url = "/actual/base/residentCategoryImportant/page"; |
||||
|
let params = { |
||||
|
pageSize: this.pageSize, |
||||
|
pageNo: this.pageNo, |
||||
|
...this.queryParams, |
||||
|
}; |
||||
|
let { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
console.log('data===', data) |
||||
|
this.total = data.total |
||||
|
this.tableData = data.list |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 搜索 |
||||
|
handleSearch() { |
||||
|
this.pageNo = 1; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
// 重置 |
||||
|
resetSearch() { |
||||
|
this.queryParams = {}; |
||||
|
this.pageSize = 10; |
||||
|
this.pageNo = 1; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
handleSizeChange(val) { |
||||
|
this.pageSize = val; |
||||
|
this.pageNo = 1; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
handleCurrentChange(val) { |
||||
|
this.pageNo = val; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
// 新增 |
||||
|
handleAdd() { |
||||
|
this.dialogVisible = true; |
||||
|
this.dialogTitle = '新增'; |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.keyCategoryDialog.initForm(); |
||||
|
}); |
||||
|
}, |
||||
|
// 编辑 |
||||
|
handleEdit(row) { |
||||
|
this.dialogVisible = true; |
||||
|
this.dialogTitle = '编辑'; |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.keyCategoryDialog.initForm(row); |
||||
|
}); |
||||
|
}, |
||||
|
// 查看 |
||||
|
handleDetail(row) { |
||||
|
this.dialogVisible = true; |
||||
|
this.dialogTitle = '查看'; |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.keyCategoryDialog.initForm(row); |
||||
|
}); |
||||
|
}, |
||||
|
// 删除 |
||||
|
async handleDelete(row) { |
||||
|
this.$confirm("确认删除?", "提示", { |
||||
|
confirmButtonText: "确定", |
||||
|
cancelButtonText: "取消", |
||||
|
type: "warning" |
||||
|
}) |
||||
|
.then(async () => { |
||||
|
const url = "/actual/base/residentCategoryImportant/delete" |
||||
|
let obj = { |
||||
|
id: row.id |
||||
|
} |
||||
|
const { data, code, internalMsg } = await requestGet(url, obj) |
||||
|
if (code === 0) { |
||||
|
this.$message({ |
||||
|
type: "success", |
||||
|
message: "删除成功" |
||||
|
}); |
||||
|
this.getTableData() |
||||
|
} else { |
||||
|
this.$message.error(internalMsg) |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
|
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 格式化类别 |
||||
|
formatterCategory(row) { |
||||
|
if (row.categoryCodeList) { |
||||
|
const labels = row.categoryCodeList.map(item => { |
||||
|
const matchedItem = this.categoryAllList.find(cat => cat.value.toUpperCase() === item.toUpperCase()); |
||||
|
console.log('matchedItem--', matchedItem) |
||||
|
return matchedItem.label; |
||||
|
}).filter(label => label); |
||||
|
return labels.join(","); |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
computed: { |
||||
|
tableHeight() { |
||||
|
return this.$store.state.inIframe ? this.clientHeight - 430 + this.iframeHeight : this.clientHeight - 430 |
||||
|
}, |
||||
|
...mapGetters(['clientHeight', 'iframeHeight']) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.g-main { |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
.m-search { |
||||
|
background: #ffffff; |
||||
|
border-radius: 4px; |
||||
|
padding: 24px 10px 10px; |
||||
|
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1); |
||||
|
margin: 20px 7px 7px; |
||||
|
} |
||||
|
|
||||
|
.m-table { |
||||
|
background: #ffffff; |
||||
|
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1); |
||||
|
border-radius: 4px; |
||||
|
margin-top: 15px; |
||||
|
padding: 24px 16px 10px; |
||||
|
margin: 16px 7px 7px; |
||||
|
|
||||
|
} |
||||
|
</style> |
||||
File diff suppressed because it is too large
@ -0,0 +1,66 @@ |
|||||
|
<template> |
||||
|
<el-dialog :title="title" :visible.sync="visible" append-to-body :before-close="handleClose"> |
||||
|
<el-form :model="form" :rules="rules" ref="checkPasswordFrom" label-width="60px"> |
||||
|
<el-form-item label="密码" prop="password"> |
||||
|
<el-input v-model.trim="form.password" autocomplete="off" type="password" placeholder="请输入当前账号密码" |
||||
|
@keydown.native.enter="handelClickCheckPassword"></el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button @click="handleClose">取 消</el-button> |
||||
|
<el-button type="primary" @click="handelClickCheckPassword">确 定</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: "keyPerCheckPassword", |
||||
|
props: { |
||||
|
title: { |
||||
|
type: String, |
||||
|
default: "密码验证" |
||||
|
}, |
||||
|
visible: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
form: { |
||||
|
password: '' |
||||
|
}, |
||||
|
rules: { |
||||
|
password: [ |
||||
|
{ required: true, message: "请输入密码", trigger: "blur" }, |
||||
|
{ |
||||
|
min: 6, |
||||
|
max: 18, |
||||
|
message: "长度在 6 到 18 个字符", |
||||
|
trigger: "blur", |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
handelClickCheckPassword() { |
||||
|
this.$refs.checkPasswordFrom.validate(valid => { |
||||
|
if (valid) { |
||||
|
this.$emit("success", this.form.password); |
||||
|
this.handleClose(); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
handleClose() { |
||||
|
this.form.password = ""; |
||||
|
this.$emit("update:visible", false); |
||||
|
}, |
||||
|
} |
||||
|
|
||||
|
|
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped></style> |
||||
File diff suppressed because it is too large
@ -0,0 +1,605 @@ |
|||||
|
<template> |
||||
|
<!-- 重点人员 --> |
||||
|
<div class="g-main"> |
||||
|
<section style="width: 100%"> |
||||
|
<div class="m-search"> |
||||
|
<el-form ref="queryForm" class="header_form_box" :model="queryParams" :label-width="'105px'"> |
||||
|
<!-- <el-form-item label="居民分类"> |
||||
|
<el-cascader ref="categoryAll" size="small" class="u-item-width-normal" v-model.trim="categoryAll" |
||||
|
:options="categoryAllList" :props="{ multiple: true, checkStrictly: true, emitPath: false }" collapse-tags |
||||
|
clearable></el-cascader> |
||||
|
</el-form-item> --> |
||||
|
<el-form-item label="所属组织" prop="agencyId"> |
||||
|
<el-cascader style="width: 100%;" size="small" v-model="cascaderAgencyId" :options="organizeOptions" |
||||
|
:props="{ checkStrictly: true, multiple: false, value: 'value', label: 'label', children: 'children' }" |
||||
|
:show-all-levels="false" @change="handleOrgChange" clearable></el-cascader> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="重点人员类型" prop="keyCategory"> |
||||
|
<el-select v-model.trim="keyCategory" clearable size="small" style="width: 100%;" |
||||
|
@change="handleKeyCategory"> |
||||
|
<el-option v-for="item in categoryList" :key="item.id" :label="item.importantName" |
||||
|
:value="item.categoryCodeList"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="姓名" prop="name"> |
||||
|
<el-input v-model.trim="queryParams.name" placeholder="请输入" clearable size="small"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="手机号" prop="mobile"> |
||||
|
<el-input v-model.trim="queryParams.mobile" placeholder="请输入" clearable size="small"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
<!-- <el-form-item label="证件类型"> |
||||
|
<el-select v-model.trim="queryParams.idType" placeholder="请选择" size="small" class="list_item_width_1" |
||||
|
clearable> |
||||
|
<el-option v-for="(item, index) in idTypeList" :key="index" :label="item.label" :value="item.value" |
||||
|
@click.native="handelCLickIdType(item.value)"></el-option> |
||||
|
</el-select> |
||||
|
|
||||
|
<el-select v-model.trim="queryParams.careerStatus" class="u-item-width-normal" clearable size="small"> |
||||
|
<el-option v-for="item in careerStatusList" :label="item.label" :value="item.value" :key="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> --> |
||||
|
<el-form-item label="证件号" prop="idNum"> |
||||
|
<el-input v-model.trim="queryParams.idNum" class="u-item-width-daterange" placeholder="请输入" clearable |
||||
|
size="small"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
|
||||
|
<div> |
||||
|
<div style="display: flex; justify-content: flex-end;"> |
||||
|
<el-button style="margin-left:10px" class="diy-button--blue" size="small" |
||||
|
@click="handleSearchFrom">查询</el-button> |
||||
|
<el-button style="margin-left:10px" class="diy-button--white" size="small" |
||||
|
@click="resetSearchForm">重置</el-button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="m-table"> |
||||
|
<div class="div_btn"> |
||||
|
<el-button class="diy-button--add" v-if="btnAuths.ic_keyPersonnel_add" size="small" @click="handleAdd" |
||||
|
type="primary" icon="el-icon-plus"> |
||||
|
新增</el-button> |
||||
|
<!-- <el-button v-if="btnAuths.ic_resi_export" style="margin-left: 10px" size="small" class="diy-button--white" |
||||
|
@click="diyExport" :loading="exportLoading" plain>{{ exportBtnTitle }}</el-button> |
||||
|
<el-button style="margin-left: 10px" v-if="btnAuths.ic_resi_batch_del" size="small" class="diy-button--add" |
||||
|
type="primary" @click="deleteBatch">批量删除</el-button> --> |
||||
|
</div> |
||||
|
<el-table class="table" :data="tableData" border :height="tableHeight" v-loading="tableLoading" |
||||
|
style="width: 100%;margin-top:16px"> |
||||
|
<!-- <el-table-column type="selection" fixed="left" align="center" width="50" /> --> |
||||
|
<el-table-column label="序号" type="index" fixed="left" align="left" width="50"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="所属组织" prop="agencyName" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="重点人员类型" prop="gridName" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="姓名" prop="name" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="手机号" prop="mobile" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="证件类型" prop="idTypeName" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="证件号" prop="idNum" align="center"> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="住址" prop="homeName" align="center" show-overflow-tooltip> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column fixed="right" label="操作" align="center" width="200"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button v-if="btnAuths.ic_keyPersonnel_detail" type="text" size="small" |
||||
|
@click="handleLook(scope.row)">查看</el-button> |
||||
|
<el-button v-if="btnAuths.ic_keyPersonnel_edit" style="margin-right: 10px" |
||||
|
@click="handelCLickShowCheckPassword(scope.row)" size="small" type="text">编辑</el-button> |
||||
|
<el-popconfirm v-if="btnAuths.ic_keyPersonnel_delete" title="删除之后无法回复，确认删除？" |
||||
|
@onConfirm="handleDel(scope.row)"> |
||||
|
<el-button size="small" type="text" slot="reference">删除</el-button> |
||||
|
</el-popconfirm> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<div class="div-flex"> |
||||
|
<div class="m-page"> |
||||
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" |
||||
|
:current-page.sync="pageNo" :page-sizes="[20, 50, 100, 200]" :page-size="pageSize" |
||||
|
layout="sizes, prev, pager, next, total" :total="total"> |
||||
|
</el-pagination> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</section> |
||||
|
|
||||
|
<!-- 密码验证 --> |
||||
|
<check-password :visible.sync="showCheckPassword" ref="checkPassword" @success="saveCheckPassword"></check-password> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
import _ from "lodash"; |
||||
|
import { mapGetters } from "vuex"; |
||||
|
import { requestPost, requestGet } from "@/js/dai/request"; |
||||
|
import checkPassword from "./components/checkPassword.vue"; |
||||
|
import { idTypeList } from "@/js/columns/constants"; |
||||
|
// import { Loading } from "element-ui"; // 引入Loading服务 |
||||
|
// import resideathAdd from "../plugins/change/resideathAdd.vue"; |
||||
|
// import diyInfo from "./diyInfo.vue"; |
||||
|
let loading; |
||||
|
export default { |
||||
|
name: "keyPersonnelIndex", |
||||
|
components: { |
||||
|
checkPassword, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
queryParams: { |
||||
|
name: '', |
||||
|
mobile: '', |
||||
|
updateCategory: null, |
||||
|
satisfactionNum: null, |
||||
|
idNum: '', |
||||
|
birthdayStart: '', |
||||
|
birthdayEnd: '', |
||||
|
ageStart: '', |
||||
|
ageEnd: '', |
||||
|
integrityScoreFrom: null,//居民信息完整度 |
||||
|
integrityScoreTo: null,//居民信息完整度 |
||||
|
identity: null, |
||||
|
gender: '', |
||||
|
cultureLevel: '', |
||||
|
localResidenceFlag: '', |
||||
|
householdSituation: '', |
||||
|
nation: '', |
||||
|
agencyId: '', |
||||
|
buildId: '', |
||||
|
homeId: '', |
||||
|
unitId: '', |
||||
|
gridId: '', |
||||
|
villageId: '', |
||||
|
attentionCrowds: [], |
||||
|
healthStatus: [], |
||||
|
nationality: '', |
||||
|
resiHouseRel: '', |
||||
|
partyFlag: '', |
||||
|
updateTimeStart: '', |
||||
|
updateTimeEnd: '', |
||||
|
specialCategoryCodes: [], |
||||
|
remark: '', |
||||
|
level: '', |
||||
|
orgType: '', |
||||
|
idType: '' |
||||
|
}, |
||||
|
keyCategory: '', |
||||
|
tableData: [], |
||||
|
cascaderAgencyId: [], |
||||
|
idTypeList, |
||||
|
pageSize: 20, |
||||
|
pageNo: 1, |
||||
|
total: 0, |
||||
|
organizeOptions: [], |
||||
|
categoryAllList: [], |
||||
|
defaultCategoryAllList: [], |
||||
|
categoryList: [], |
||||
|
careerStatusList: [], |
||||
|
btnAuths: { |
||||
|
ic_keyPersonnel_add: true, |
||||
|
ic_keyPersonnel_edit: true, |
||||
|
ic_keyPersonnel_detail: true, |
||||
|
ic_keyPersonnel_delete: true |
||||
|
}, |
||||
|
showCheckPassword: false, |
||||
|
exportLoading: false, |
||||
|
exportBtn: false, |
||||
|
exportBtnTitle: "导出", |
||||
|
importBtnTitle: "导入", |
||||
|
importLoading: false, |
||||
|
tableLoading: false, |
||||
|
btnLoading: false, |
||||
|
disabled: false, |
||||
|
selAllFlag: false, |
||||
|
selAllFlagDisabled: false, |
||||
|
isIndeterminate: false, |
||||
|
dialogEditVisible: false, |
||||
|
|
||||
|
formType: "add", |
||||
|
// 显示人员详情 |
||||
|
lookResiId: "", |
||||
|
exportList: [], |
||||
|
diyDialog: false, |
||||
|
autoOpenArr: [], |
||||
|
filterText: "", |
||||
|
|
||||
|
defaultProps: { |
||||
|
children: "children", |
||||
|
label: "showName", |
||||
|
isLeaf: "isLeaf", |
||||
|
}, |
||||
|
selection: [], |
||||
|
editUserId: "", |
||||
|
}; |
||||
|
}, |
||||
|
props: {}, |
||||
|
computed: { |
||||
|
...mapGetters(["clientHeight"]), |
||||
|
tableHeight() { |
||||
|
return this.$store.state.inIframe |
||||
|
? this.clientHeight - 450 + this.iframeHeigh |
||||
|
: this.clientHeight - 450; |
||||
|
}, |
||||
|
}, |
||||
|
created() { |
||||
|
this.getKeyCategory(); |
||||
|
this.getOptions(); |
||||
|
}, |
||||
|
async mounted() { |
||||
|
}, |
||||
|
methods: { |
||||
|
// 获取所属组织 |
||||
|
async getOptions() { |
||||
|
const { data } = await requestPost("/gov/org/customeragency/orgtree", {}); |
||||
|
this.organizeOptions = data ? [this.computeOption(data)] : [] |
||||
|
}, |
||||
|
// 获取重点类型 |
||||
|
async getKeyCategory() { |
||||
|
const url = "/actual/base/residentCategoryImportant/page"; |
||||
|
let params = { |
||||
|
pageSize: 1000, |
||||
|
pageNo: 1, |
||||
|
}; |
||||
|
let { data, code, msg } = await requestPost(url, params); |
||||
|
if (code === 0) { |
||||
|
this.categoryList = data.list || []; |
||||
|
this.categoryAllList = [...new Set(data.list.flatMap(item => item.categoryCodeList))]; |
||||
|
this.defaultCategoryAllList = _.cloneDeep(this.categoryAllList); |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
// 格式化数据 |
||||
|
computeOption(opt) { |
||||
|
return { |
||||
|
label: opt.agencyName, |
||||
|
value: opt.agencyId, |
||||
|
type: "agency", |
||||
|
children: [ |
||||
|
...this.processDepartmentList(opt.departmentList), |
||||
|
...this.processGridList(opt.gridList), |
||||
|
...this.processSubAgencyList(opt.subAgencyList), |
||||
|
], |
||||
|
}; |
||||
|
}, |
||||
|
// 处理部门列表 |
||||
|
processDepartmentList(departmentList) { |
||||
|
return (departmentList || []).map((item) => ({ |
||||
|
label: item.deptName, |
||||
|
value: item.deptId, |
||||
|
type: "dept", |
||||
|
typeName: "部门", |
||||
|
})) |
||||
|
}, |
||||
|
// 处理网格列表 |
||||
|
processGridList(gridList) { |
||||
|
return (gridList || []).map((item) => ({ |
||||
|
label: item.gridName, |
||||
|
value: item.gridId, |
||||
|
type: "grid", |
||||
|
typeName: "网格", |
||||
|
})) |
||||
|
}, |
||||
|
// 处理子机构列表 |
||||
|
processSubAgencyList(subAgencyList) { |
||||
|
return (subAgencyList || []).map((item) => this.computeOption(item)) |
||||
|
}, |
||||
|
// 获取列表数据 |
||||
|
async getTableData() { |
||||
|
let params = { |
||||
|
pageNo: this.pageNo, |
||||
|
pageSize: this.pageSize, |
||||
|
...this.queryParams, |
||||
|
}; |
||||
|
this.tableLoading = true; |
||||
|
const { data, code, internalMsg } = await requestPost("/actual/base/residentBaseInfo/page", params); |
||||
|
this.tableLoading = false; |
||||
|
if (code === 0) { |
||||
|
this.total = data.total; |
||||
|
this.tableData = data.list; |
||||
|
} else { |
||||
|
this.$message.error(internalMsg); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 修改组织级联选择器值 |
||||
|
handleOrgChange(val) { |
||||
|
this.queryParams.agencyId = val[val.length - 1]; |
||||
|
}, |
||||
|
|
||||
|
// 搜索 |
||||
|
handleSearchFrom() { |
||||
|
this.pageNo = 1; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
resetSearchForm() { |
||||
|
this.keyCategory = []; |
||||
|
this.cascaderAgencyId = []; |
||||
|
this.categoryAllList = _.cloneDeep(this.defaultCategoryAllList); |
||||
|
this.$refs.queryForm.resetFields(); |
||||
|
}, |
||||
|
handleSizeChange(val) { |
||||
|
this.pageSize = val; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
handleCurrentChange(val) { |
||||
|
console.log(val); |
||||
|
this.pageNo = val; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
|
||||
|
// 修改类别 |
||||
|
handleKeyCategory(value) { |
||||
|
this.categoryAllList = value ? value : _.cloneDeep(this.defaultCategoryAllList); |
||||
|
}, |
||||
|
|
||||
|
handleCategoryChange(newVal, oldVal) { |
||||
|
let formCopy = JSON.parse(JSON.stringify(this.queryParams)); |
||||
|
|
||||
|
// 找出被取消选中的值 |
||||
|
if (oldVal && oldVal.length) { |
||||
|
let cancelledValues = oldVal.filter(val => !newVal.includes(val)); |
||||
|
// 处理取消选中的值 |
||||
|
cancelledValues.forEach(val => { |
||||
|
if (['partyFlag0', 'partyFlag1', 'partyFlag2'].includes(val)) { |
||||
|
formCopy.partyFlag = null; |
||||
|
} else if (['FLOATING_FLAG', 'OLD_PEOPLE_FLAG', 'OLD_PEOPLE_FLAG', 'LIVE_ALONE_FLAG', 'DEMENTED_FLAG', 'EMPTY_NESTER_FLAG', 'DISABLED_FLAG', 'SUBSISTENCE_ALLOWANCE_FLAG', 'ENSURE_HOUSE_FLAG', 'VETERAN_FLAG', 'FERTILE_WOMAN_FLAG', 'SPECIAL_SUPPORT_FLAG', 'NEW_STRATUM_FLAG', 'NEG_FLAG', 'LBC_FLAG', 'AIDS_FLAG'].includes(val)) { |
||||
|
formCopy.attentionCrowds = formCopy.attentionCrowds.filter(item => item !== val); |
||||
|
} else if (['DISABILITY_FLAG', 'SERIOUS_ILLNESS_FLAG', 'CHRONIC_DISEASE_FLAG'].includes(val)) { |
||||
|
formCopy.healthStatus = formCopy.healthStatus.filter(item => item !== val); |
||||
|
} else if (['anzhibangjiao', 'xidurenyuan', 'shequjiaozheng', 'buliangqingshaonian', 'zhaoshizhaohuojingshenbing', 'xiejiaorenyuan', 'tongzhanrenyuan', 'xinfangrenyaun'].includes(val)) { |
||||
|
formCopy.specialCategoryCodes = formCopy.specialCategoryCodes.filter(item => item !== val); |
||||
|
} else if (['VOLUNTEER_FLAG', 'BUILDING_CHIEF_FLAG', 'UNIT_CHIEF_FLAG', 'PUBLIC_WELFARE_FLAG', 'GRID_MEMBER_FLAG'].includes(val)) { |
||||
|
formCopy.identity = null; |
||||
|
} else if (val === 'UNEMPLOYED_FLAG') { |
||||
|
formCopy.careerStatus = null; |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
// 处理新选中的值 |
||||
|
newVal.forEach(val => { |
||||
|
if (val === 'partyFlag0' || val === 'partyFlag1' || val === 'partyFlag2') { |
||||
|
formCopy.partyFlag = val === 'partyFlag0' ? 0 : val === 'partyFlag1' ? 1 : 2; |
||||
|
} else if (['FLOATING_FLAG', 'OLD_PEOPLE_FLAG', 'OLD_PEOPLE_FLAG', 'CHILDREN_DISABILITY_FLAG', 'CHILDREN_DEATH', 'LIVE_ALONE_FLAG', 'DEMENTED_FLAG', 'EMPTY_NESTER_FLAG', 'DISABLED_FLAG', 'SUBSISTENCE_ALLOWANCE_FLAG', 'ENSURE_HOUSE_FLAG', 'VETERAN_FLAG', 'FERTILE_WOMAN_FLAG', 'SPECIAL_SUPPORT_FLAG', 'NEW_STRATUM_FLAG', 'NEG_FLAG', 'LBC_FLAG', 'AIDS_FLAG'].includes(val)) { |
||||
|
if (!formCopy.attentionCrowds.includes(val)) { |
||||
|
formCopy.attentionCrowds.push(val); |
||||
|
} |
||||
|
} else if (['DISABILITY_FLAG', 'SERIOUS_ILLNESS_FLAG', 'CHRONIC_DISEASE_FLAG'].includes(val)) { |
||||
|
if (!formCopy.healthStatus.includes(val)) { |
||||
|
formCopy.healthStatus.push(val); |
||||
|
} |
||||
|
} else if (['anzhibangjiao', 'xidurenyuan', 'shequjiaozheng', 'buliangqingshaonian', 'zhaoshizhaohuojingshenbing', 'xiejiaorenyuan', 'tongzhanrenyuan', 'xinfangrenyaun'].includes(val)) { |
||||
|
if (!formCopy.specialCategoryCodes.includes(val)) { |
||||
|
formCopy.specialCategoryCodes.push(val); |
||||
|
} |
||||
|
} else if (['VOLUNTEER_FLAG', 'BUILDING_CHIEF_FLAG', 'UNIT_CHIEF_FLAG', 'PUBLIC_WELFARE_FLAG', 'GRID_MEMBER_FLAG'].includes(val)) { |
||||
|
formCopy.identity = val; |
||||
|
} else if (val === 'UNEMPLOYED_FLAG') { |
||||
|
formCopy.careerStatus = '0'; |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
// 更新表单数据 |
||||
|
this.queryParams = formCopy; |
||||
|
this.getTableData(); |
||||
|
}, |
||||
|
// 查看 |
||||
|
async handleLook(row) { |
||||
|
this.lookResiId = row.resiId; |
||||
|
let { |
||||
|
agencyId, |
||||
|
gridId, |
||||
|
gridName, |
||||
|
gender, |
||||
|
homeId, |
||||
|
homeName, |
||||
|
name, |
||||
|
resiId, |
||||
|
} = row; |
||||
|
this.$store.dispatch("saveData", { |
||||
|
agencyId, |
||||
|
gridId, |
||||
|
gridName, |
||||
|
gender, |
||||
|
homeId, |
||||
|
homeName, |
||||
|
name, |
||||
|
resiId, |
||||
|
}); |
||||
|
this.$router.push({ name: "jumin-huaxiang" }); |
||||
|
this.$store.state.contentTabs = this.$store.state.contentTabs.map( |
||||
|
(item) => { |
||||
|
if (item.name === "jumin-huaxiang") { |
||||
|
return { ...item, title: name }; |
||||
|
} |
||||
|
return item; |
||||
|
} |
||||
|
); |
||||
|
}, |
||||
|
async handelCLickShowCheckPassword(row) { |
||||
|
const url = `/actual/base/residentCategoryUpdateInfo/isUpdater/${row.resiId}`; |
||||
|
const { data, code, msg } = await requestPost(url); |
||||
|
console.log(data); |
||||
|
console.log(code); |
||||
|
if (code == 0) { |
||||
|
if (data == true) { |
||||
|
this.editUserId = row.resiId; |
||||
|
this.saveCheckPassword() |
||||
|
} |
||||
|
else { |
||||
|
this.editUserId = row.resiId; |
||||
|
this.showCheckPassword = true; |
||||
|
} |
||||
|
} |
||||
|
else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
async saveCheckPassword(password) { |
||||
|
const url = `/actual/base/residentBaseInfo/getResiUserInfo/${this.editUserId}`; |
||||
|
let parm = { |
||||
|
password, |
||||
|
}; |
||||
|
const { data, code, msg } = await requestPost(url, parm); |
||||
|
console.log(data, code, msg); |
||||
|
if (code === 0) { |
||||
|
this.showCheckPassword = false; |
||||
|
this.$router.push({ |
||||
|
name: "edit-key-personnel", |
||||
|
query: { id: this.editUserId }, |
||||
|
params: { idNum: data.idNum, mobile: data.mobile, name: data.name, nationality: data.nationality }, |
||||
|
}); |
||||
|
} else { |
||||
|
this.$message.error(msg); |
||||
|
} |
||||
|
}, |
||||
|
handleAdd() { |
||||
|
this.$router.push({ name: "add-key-personnel" }); |
||||
|
}, |
||||
|
handleDel(row) { |
||||
|
this.$http |
||||
|
.post("/actual/base/residentBaseInfo/batchdel", [row.resiId]) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg); |
||||
|
} else { |
||||
|
this.$message.success("删除成功"); |
||||
|
this.getTableData(); |
||||
|
} |
||||
|
}) |
||||
|
.catch((err) => { |
||||
|
return this.$message.error("网络错误"); |
||||
|
}); |
||||
|
}, |
||||
|
startLoading() { |
||||
|
loading = Loading.service({ |
||||
|
lock: true, // 是否锁定 |
||||
|
text: "正在加载……", // 加载中需要显示的文字 |
||||
|
background: "rgba(0,0,0,.7)", // 背景颜色 |
||||
|
}); |
||||
|
}, |
||||
|
endLoading() { |
||||
|
if (loading) { |
||||
|
loading.close(); |
||||
|
} |
||||
|
}, |
||||
|
}, |
||||
|
watch: { |
||||
|
categoryAllList: { |
||||
|
handler(newValue, oldValue) { |
||||
|
this.handleCategoryChange(newValue, oldValue) |
||||
|
}, |
||||
|
deep: true |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
<style lang="scss" scoped> |
||||
|
// @import "@/assets/scss/modules/management/list-main.scss"; |
||||
|
|
||||
|
.header_form_box { |
||||
|
display: flex; |
||||
|
flex-wrap: wrap; |
||||
|
|
||||
|
.el-form-item { |
||||
|
width: 20%; |
||||
|
|
||||
|
.el-input { |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.m-search { |
||||
|
background: #ffffff; |
||||
|
border-radius: 4px; |
||||
|
padding: 24px 10px 10px; |
||||
|
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1); |
||||
|
margin: 20px 7px 7px; |
||||
|
} |
||||
|
|
||||
|
.m-table { |
||||
|
background: #ffffff; |
||||
|
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1); |
||||
|
border-radius: 4px; |
||||
|
margin-top: 15px; |
||||
|
padding: 24px 16px 10px; |
||||
|
margin: 16px 7px 7px; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
::v-deep .el-button--primary.is-plain { |
||||
|
color: #0055d7; |
||||
|
background: #ffffff; |
||||
|
border-color: #0055d7; |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.resi-table { |
||||
|
::v-deep .el-button--text { |
||||
|
text-decoration: underline; |
||||
|
} |
||||
|
|
||||
|
::v-deep .btn-color-del { |
||||
|
margin-left: 10px; |
||||
|
color: rgba(213, 16, 16, 1); |
||||
|
} |
||||
|
|
||||
|
::v-deep .btn-color-edit { |
||||
|
color: rgba(0, 167, 169, 1); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.resi-down { |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
bottom: -10px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 46px; |
||||
|
height: 12px; |
||||
|
box-sizing: border-box; |
||||
|
margin-left: -23rpx; |
||||
|
cursor: pointer; |
||||
|
background: #ffffff; |
||||
|
border-radius: 0 0 10px 10px; |
||||
|
|
||||
|
img { |
||||
|
display: block; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
.div-flex { |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
|
||||
|
.div_del { |
||||
|
margin-top: 15px; |
||||
|
} |
||||
|
|
||||
|
.m-page { |
||||
|
margin-left: auto; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.resiCategoryInfoBox { |
||||
|
overflow: hidden; |
||||
|
white-space: nowrap; |
||||
|
text-overflow: ellipsis; |
||||
|
word-wrap: normal; |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue