发展党员

This commit is contained in:
liuye
2022-10-13 13:52:35 +08:00
parent 45b4c5ad24
commit f210317222
5 changed files with 2177 additions and 0 deletions

View File

@@ -0,0 +1,58 @@
<template>
<div class="AppRecruitPartyMembers">
<component ref="component" :is="currentPage" :selected.sync="selected" v-bind="$props"/>
</div>
</template>
<script>
import List from './components/List'
import Add from './components/Add'
import Detail from './components/Detail'
import {mapState} from "vuex";
import NeighbourSetting from "./components/neighbourSetting";
export default {
name: 'AppRecruitPartyMembers',
label: '发展党员',
components: {
NeighbourSetting,
Add,
List,
Detail
},
props: {
instance: Function,
dict: Object,
permissions:Function
},
data() {
return {
selected: {}
}
},
computed: {
...mapState(['user']),
currentPage() {
if (this.$route.hash == "#add") {
return Add
} else if (this.$route.hash == "#ns") {
return NeighbourSetting
} else if (this.$route.query.id) {
return Detail
} else return List
}
},
created() {
this.dict.load("yesOrNo")
let {organizationId: id, organizationName: name} = this.user.info
this.selected = {id, name}
},
}
</script>
<style lang="scss" scoped>
.AppRecruitPartyMembers {
height: 100%;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,507 @@
<template>
<ai-detail class="party-detail">
<template slot="title">
<ai-title title="党员信息详情" isShowBack isShowBottomBorder @onBackClick="cancel(true)"></ai-title>
</template>
<template slot="content">
<div>
<ai-card title="基本信息">
<template #content>
<ai-wrapper
label-width="72px">
<ai-avatar class="party-avatar" v-model="info.avatarUrl" :editable="false"></ai-avatar>
<ai-info-item label="姓名">{{ info.name }}</ai-info-item>
<ai-info-item label="性别" :value="dict.getLabel('sex', info.sex)"></ai-info-item>
<ai-info-item label="身份证号">
<ai-id mode="show" :value="info.idNumber" rightBtn/>
</ai-info-item>
<ai-info-item label="出生日期" :value="info.birthday"></ai-info-item>
<ai-info-item label="年龄">{{ info.age }}</ai-info-item>
<ai-info-item label="民族" :value="dict.getLabel('nation', info.nation)"></ai-info-item>
<ai-info-item label="籍贯" isLine :value="info.birthplaceAreaName"></ai-info-item>
<ai-info-item label="户籍地" isLine :value="info.householdAreaName"></ai-info-item>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="审核状态">
<template #content>
<ai-wrapper
label-width="72px">
<ai-info-item label="审核状态">
<span :class="'audit-' + info.auditStatus">{{ dict.getLabel('auditStatus', info.auditStatus) }}</span>
</ai-info-item>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="联络信息">
<template #content>
<ai-wrapper
label-width="72px">
<ai-info-item label="联系方式">{{ info.phone || '-' }}</ai-info-item>
<ai-info-item isLine label="现住址">{{
((info.currentAreaName || '') + (info.currentAddress || '')) || '-'
}}
</ai-info-item>
<ai-info-item label="所属党组织">{{ info.partyOrgName || '-' }}</ai-info-item>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="党籍信息">
<template #content>
<ai-wrapper
label-width="72px">
<ai-info-item label="党籍状态" :value="dict.getLabel('partyStatus',info.partyStatus)"/>
<ai-info-item label="转正日期"
:value="info.turnPositiveTime ? info.turnPositiveTime.split(' ')[0] : '-'"></ai-info-item>
<ai-info-item label="任职日期"
:value="info.partyStartDate ? info.partyStartDate.split(' ')[0] : '-'"></ai-info-item>
<ai-info-item label="党员类型" :value="dict.getLabel('partyType', info.partyType)"></ai-info-item>
<ai-info-item label="入党时间">{{
info.joinPartyTime ? info.joinPartyTime.split(' ')[0] : '-'
}}
</ai-info-item>
<ai-info-item label="党内兼职" :value="info.partyWork"></ai-info-item>
<ai-info-item label="党内职务" :value="dict.getLabel('partyPosition', info.partyPosition)"></ai-info-item>
<ai-info-item label="入党介绍人" :value="info.joinPartyIntroducer"></ai-info-item>
<ai-info-item label="优秀党员" :value="dict.getLabel('yesOrNo', info.isOutstandingParty)"></ai-info-item>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="党员简介">
<template #content>
<div v-text="info.personalProfile"/>
</template>
</ai-card>
<ai-card title="流动信息">
<template #content>
<ai-wrapper
label-width="72px">
<ai-info-item label="流动情况" :value="dict.getLabel('flowStatus', info.flowStatus)"></ai-info-item>
<ai-info-item label="流入组织" v-if="info.flowStatus == 1" :value="info.flowOrgId"></ai-info-item>
<ai-info-item label="流入时间" v-if="info.flowStatus == 1"
:value="info.flowTime ? info.flowTime.split(' ')[0] : '-'"></ai-info-item>
<ai-info-item label="流出组织" v-if="info.flowStatus == 0" :value="info.outFlow"></ai-info-item>
<ai-info-item label="流出时间" v-if="info.flowStatus == 0"
:value="info.inTime ? info.inTime.split(' ')[0] : '-'"></ai-info-item>
<ai-info-item label="失联时间" v-if="info.flowStatus == 2"
:value="info.lossTime ? info.lossTime.split(' ')[0] : '-'"></ai-info-item>
</ai-wrapper>
</template>
</ai-card>
<ai-card title="文化程度">
<template #content>
<ai-wrapper
label-width="72px">
<ai-info-item label="学历" :value="dict.getLabel('education', info.education)"></ai-info-item>
</ai-wrapper>
<el-tabs v-model="activeName">
<el-tab-pane label="五星党员" name="五星党员" lazy></el-tab-pane>
<el-tab-pane label="工作信息" name="工作信息" lazy></el-tab-pane>
<el-tab-pane label="违纪信息" name="违纪信息" lazy></el-tab-pane>
</el-tabs>
<div class="add-btn">
<span></span>
<!-- <div @click="addForm(activeName)">
<i class="iconfont iconAdd"></i>
<span>添加{{ activeName }}</span>
</div> -->
</div>
<ai-table
v-if="activeName === '五星党员'"
:border="true"
:tableData="info.starList"
:isShowPagination="false"
:col-configs="colConfigs1"
:stripe="false"
@getList="() => {}">
<el-table-column label="评定等级" slot="level" align="center">
<template slot-scope="{row}">
<el-rate v-model="row.level" disabled show-text :texts="textlist"></el-rate>
</template>
</el-table-column>
<el-table-column slot="options" width="120px" fixed="right" label="操作" align="center">
<template slot-scope="{ row }">
<div class="table-options">
<el-button type="text" @click="editStar(row)">编辑</el-button>
<el-button type="text" @click="remove(row.id, '/app/apppartyfivestar/delete')">删除</el-button>
</div>
</template>
</el-table-column>
</ai-table>
<ai-table
v-if="activeName === '工作信息'"
:border="true"
:tableData="info.workInfoList"
:isShowPagination="false"
:col-configs="colConfigs2"
:stripe="false"
@getList="() => {}">
<el-table-column label="工作时间" slot="date" align="center">
<template slot-scope="{row}">
<span v-if="row.starTime && row.endTime">{{
row.starTime.split(' ')[0]
}} {{ row.endTime.split(' ')[0] }}</span>
</template>
</el-table-column>
<el-table-column slot="options" width="120px" fixed="right" label="操作" align="center">
<template slot-scope="{ row }">
<div class="table-options">
<el-button type="text" @click="editJob(row)">编辑</el-button>
<el-button type="text" @click="remove(row.id, '/app/apppartyworkinfo/delete')">删除</el-button>
</div>
</template>
</el-table-column>
</ai-table>
<ai-table
v-if="activeName === '违纪信息'"
:border="true"
:tableData="info.disciplinaryInfoList"
:isShowPagination="false"
:col-configs="colConfigs3"
:stripe="false"
@getList="() => {}">
<el-table-column slot="options" width="120px" fixed="right" label="操作" align="center">
<template slot-scope="{ row }">
<div class="table-options">
<el-button type="text" @click="editDisciplinary(row)">编辑</el-button>
<el-button type="text" @click="remove(row.id, '/app/apppartydisciplinaryinfo/delete')">删除
</el-button>
</div>
</template>
</el-table-column>
</ai-table>
</template>
</ai-card>
<ai-dialog
:visible.sync="isShowStarForm"
width="690px"
:title="starId ? '修改五星党员' : '添加五星党员'"
@close="onClose"
@onConfirm="onStarForm">
<el-form ref="starForm" :model="starForm" label-width="110px" label-position="right">
<el-form-item label="评定时间" prop="starTime"
:rules="[{ required: true, message: '请选择评定时间', trigger: 'change' }]">
<el-date-picker
size="small"
v-model="starForm.starTime"
type="month"
placeholder="请选择评定时间"
style="width: 230px;" format="yyyy-MM"
:value-format="'yyyy-MM-dd'+ ' 00:00:00'">
</el-date-picker>
</el-form-item>
<el-form-item label="评定等级" prop="level"
:rules="[{ required: true, message: '请选择评定等级', trigger: 'change' }]">
<el-rate v-model="starForm.level" show-text :texts="textlist" style="line-height: 2.5;"></el-rate>
</el-form-item>
</el-form>
</ai-dialog>
<ai-dialog
:visible.sync="isShowJobForm"
width="690px"
:title="jobId ? '修改工作信息' : '添加工作信息'"
@close="onClose"
@onConfirm="onJobForm">
<el-form ref="jobForm" :model="jobForm" label-width="110px" label-position="right">
<el-form-item label="工作时间" prop="date" :rules="[{ required: true, message: '请选择工作时间', trigger: 'change' }]">
<el-date-picker
size="small"
v-model="jobForm.date"
type="monthrange"
range-separator=""
start-placeholder="开始月份" end-placeholder="结束月份" format="yyyy-MM"
:value-format="'yyyy-MM-dd'+ ' 00:00:00'">
</el-date-picker>
</el-form-item>
<el-form-item label="单位" prop="company" :rules="[{ required: true, message: '请输入工作单位', trigger: 'blur' }]">
<el-input size="small" :maxLength="30" v-model="jobForm.company" placeholder="请输入工作单位"></el-input>
</el-form-item>
<el-form-item label="职务" prop="position" :rules="[{ required: true, message: '请输入职务', trigger: 'blur' }]">
<el-input size="small" :maxLength="30" v-model="jobForm.position" placeholder="请输入职务"></el-input>
</el-form-item>
</el-form>
</ai-dialog>
<ai-dialog
:visible.sync="isShowDisciplinaryForm"
width="690px"
:title="disciplinaryId ? '修改违纪信息' : '添加违纪信息'"
@close="onClose"
@onConfirm="onDisciplinarForm">
<el-form ref="disciplinaryForm" :model="disciplinaryForm" label-width="110px" label-position="right">
<el-form-item label="时间" prop="starTime"
:rules="[{ required: true, message: '请选择违纪时间', trigger: 'change' }]">
<el-date-picker
size="small"
v-model="disciplinaryForm.starTime"
type="month"
placeholder="请选择违纪时间"
style="width: 230px;" format="yyyy-MM"
:value-format="'yyyy-MM-dd'+ ' 00:00:00'">
</el-date-picker>
</el-form-item>
<el-form-item label="违纪原因" prop="disciplinaryInfo"
:rules="[{ required: true, message: '请输入违纪原因', trigger: 'blur' }]">
<el-input size="small" v-model="disciplinaryForm.disciplinaryInfo" placeholder="请输入违纪原因"></el-input>
</el-form-item>
<el-form-item label="处理结果" prop="result" :rules="[{ required: true, message: '请输入处理结果', trigger: 'blur' }]">
<el-input size="small" v-model="disciplinaryForm.result" placeholder="请输入处理结果"></el-input>
</el-form-item>
</el-form>
</ai-dialog>
</div>
</template>
</ai-detail>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'detail',
props: {
instance: Function,
dict: Object,
params: Object
},
data() {
return {
info: {},
isShowStarForm: false,
isShowJobForm: false,
jobForm: {
date: [],
company: '',
position: ''
},
jobId: '',
starForm: {
starTime: '',
level: 1
},
disciplinaryId: '',
isShowDisciplinaryForm: false,
disciplinaryForm: {
starTime: '',
disciplinaryInfo: '',
result: ''
},
starId: '',
activeName: '五星党员',
textlist: ['一星党员', '二星党员', '三星党员', '四星党员', '五星党员'],
colConfigs1: [
{prop: 'starTime', label: '评定时间', align: 'center', formart: v => v ? v.split(' ')[0] : '-'},
{slot: 'level'}
],
colConfigs2: [
{slot: 'date'},
{prop: 'company', label: '单位', align: 'center'},
{prop: 'position', label: '职务', align: 'center'}
],
colConfigs3: [
{prop: 'starTime', label: '时间', align: 'center', formart: v => v ? v.split(' ')[0] : '-'},
{prop: 'disciplinaryInfo', label: '违纪原因', align: 'center'},
{prop: 'result', label: '处理结果', align: 'center'}
]
}
},
computed: {
...mapState(['user'])
},
created() {
this.getInfo()
},
methods: {
getInfo() {
let {id} = this.$route.query
id && this.instance.post(`/app/appparty/detail`, null, {
params: {id}
}).then(res => {
if (res?.data) {
this.info = res.data
if (this.info.birthday) {
this.info.birthday = this.info.birthday.substring(0, 10)
}
}
})
},
remove(id, apiUrl) {
this.$confirm('确定删除该数据?').then(() => {
this.instance.post(`${apiUrl}?ids=${id}`).then(res => {
if (res.code == 0) {
this.getInfo()
this.$message.success('删除成功!')
}
})
})
},
editJob(query) {
this.jobForm = {
...query,
date: [query.starTime, query.endTime]
}
this.jobId = query.id
this.isShowJobForm = true
},
editStar(query) {
this.starForm = {
...query
}
this.starId = query.id
this.isShowStarForm = true
},
editDisciplinary(query) {
this.disciplinaryForm = {
...query
}
this.disciplinaryId = query.id
this.isShowDisciplinaryForm = true
},
onDisciplinarForm() {
this.$refs.disciplinaryForm.validate((valid) => {
if (valid) {
this.instance.post(`/app/apppartydisciplinaryinfo/addOrUpdate`, {
...this.disciplinaryForm,
partyId: this.params.id
}).then(res => {
if (res.code == 0) {
this.isShowDisciplinaryForm = false
this.getInfo()
this.$message.success(this.jobId ? '编辑成功' : '新增成功')
}
})
}
})
},
onJobForm() {
this.$refs.jobForm.validate((valid) => {
if (valid) {
this.instance.post(`/app/apppartyworkinfo/addOrUpdate`, {
...this.jobForm,
starTime: this.jobForm.date[0],
endTime: this.jobForm.date[1],
partyId: this.params.id
}).then(res => {
if (res.code == 0) {
this.isShowJobForm = false
this.getInfo()
this.$message.success(this.jobId ? '编辑成功' : '新增成功')
}
})
}
})
},
onStarForm() {
this.$refs.starForm.validate((valid) => {
if (valid) {
this.instance.post(`/app/apppartyfivestar/addOrUpdate`, {
...this.starForm,
idNumber: this.info.idNumber,
partyId: this.params.id
}).then(res => {
if (res.code == 0) {
this.isShowStarForm = false
this.getInfo()
this.$message.success(this.starId ? '编辑成功' : '新增成功')
}
})
}
})
},
onClose() {
this.starId = ''
this.jobId = ''
this.disciplinaryId = ''
this.starForm.level = 0
this.starForm.id = ''
this.starForm.starTime = ''
this.jobForm.date = []
this.jobForm.company = ''
this.jobForm.id = ''
this.jobForm.position = ''
this.disciplinaryForm.starTime = ''
this.disciplinaryForm.id = ''
this.disciplinaryForm.disciplinaryInfo = ''
this.disciplinaryForm.result = ''
},
addForm(type) {
if (type === '五星党员') {
this.isShowStarForm = true
} else if (type === '工作信息') {
this.isShowJobForm = true
} else {
this.isShowDisciplinaryForm = true
}
},
cancel() {
this.$router.push({})
}
}
}
</script>
<style scoped lang="scss">
.party-detail {
::v-deep .AiID {
line-height: 1.4;
color: #222;
.el-button {
height: auto;
padding: 0 8px 0 0;
}
}
.party-avatar {
position: absolute;
right: 100px;
}
}
.audit-0 {
color: #FF8822 !important;
}
.audit-1 {
color: #2EA222 !important;
}
.add-btn {
display: flex;
align-items: center;
justify-content: space-between;
margin: 10px 0 20px;
div {
display: flex;
align-items: center;
color: #2266FF;
font-size: 14px;
&:hover {
opacity: 0.6;
cursor: pointer;
user-select: none;
}
i {
line-height: 1;
margin-right: 4px;
}
}
}
</style>

View File

@@ -0,0 +1,298 @@
<template>
<ai-list class="partyList">
<template slot="title">
<ai-title title="发展党员" isShowBottomBorder/>
</template>
<template #left>
<ai-tree-menu title="组织目录" searchPlaceholder="请输入党组织名称" @search="onSearch">
<ai-party-tree
:filter-node-method="filterNode"
ref="tree"
:instance="instance"
:root="user.info.organizationId"
:current-node-key="selected.id"
@select="onTreeChange"/>
</ai-tree-menu>
</template>
<template slot="content">
<ai-search-bar>
<template #left>
<ai-select v-model="search.sex" placeholder="请选择性别" :selectList="dict.getDict('sex')"
@change="search.current = 1, getList()"></ai-select>
<ai-search label="年龄">
<ai-range v-model="search.age" ref="resetagefoo" @change="search.current = 1, getList()"
@closeVal="search.age = []"/>
</ai-search>
<!-- <ai-select v-model="search.nation" placeholder="请选择民族" :selectList="dict.getDict('nation')"
@change="search.current = 1, getList()"></ai-select>
<ai-select v-model="search.partyStatus" placeholder="请选择党籍状态" :selectList="dict.getDict('partyStatus')"
@change="search.current = 1, getList()"></ai-select>
<ai-select v-model="search.flowStatus" placeholder="请选择流动状态" :selectList="dict.getDict('flowStatus')"
@change="search.current = 1, getList()"></ai-select>
<ai-select v-model="search.education" placeholder="请选择文化程度" :selectList="dict.getDict('education')"
@change="search.current = 1, getList()"></ai-select>
<ai-select v-model="search.partyPosition" placeholder="请选择党内职务" :selectList="dict.getDict('partyPosition')"
@change="search.current = 1, getList()"></ai-select>
<ai-select v-model="search.disciplinary" placeholder="请选择违纪情况" :selectList="dict.getDict('disciplinary')"
@change="search.current = 1, getList()"></ai-select>
<ai-search label="出生日期">
<el-date-picker
size="small"
v-model="search.birthStart"
type="date"
placeholder="开始日期"
format="yyyy-MM-dd"
style="width: 180px"
@change="search.current = 1, getList()"
clearable
:value-format="'yyyy-MM-dd'+' 00:00:00'"/>
<el-date-picker
size="small"
v-model="search.birthEnd"
type="date"
placeholder="结束日期"
format="yyyy-MM-dd"
style="width: 180px"
@change="search.current = 1, getList()"
clearable
:value-format="'yyyy-MM-dd'+' 23:59:59'"/>
</ai-search> -->
<ai-search label="入学时间">
<el-date-picker
size="small"
v-model="search.joinPartyStart"
type="date"
style="width: 180px"
placeholder="开始日期"
format="yyyy-MM-dd"
@change="search.current = 1, getList()"
clearable
:value-format="'yyyy-MM-dd'+' 00:00:00'">
</el-date-picker>
<el-date-picker
size="small"
v-model="search.joinPartyEnd"
type="date"
style="width: 180px"
placeholder="结束日期"
format="yyyy-MM-dd"
@change="search.current = 1, getList()"
clearable
:value-format="'yyyy-MM-dd'+' 23:59:59'">
</el-date-picker>
</ai-search>
</template>
<template slot="right">
<el-input
v-model="search.con"
size="small"
placeholder="请输入姓名或身份证"
clearable
@change="search.current=1,getList()"
suffix-icon="iconfont iconSearch"/>
</template>
</ai-search-bar>
<ai-search-bar>
<template #left>
<el-button size="small" :disabled="!isShowAddBtn" type="primary" icon="iconfont iconAdd" @click="toAdd()">添加</el-button>
<el-button size="small" :disabled="!ids.length" icon="iconfont iconDelete" @click="toAdd()">删除</el-button>
</template>
<!-- <template #right>
<ai-import :instance="instance" :dict="dict" type="appparty" name="发展党员" @success="getList()"></ai-import>
<ai-download :instance="instance" :params="exportQuery" url="/app/appparty/export2" fileName="党员明细"/>
</template> -->
</ai-search-bar>
<ai-table
:dict="dict"
:tableData="tableData"
:col-configs="colConfigs"
:total="total"
v-loading="loading"
style="margin-top: 6px;"
:current.sync="search.current"
:size.sync="search.size"
@handleSelectionChange="handleSelectionChange"
@getList="getList">
<el-table-column slot="options" width="220px" fixed="right" label="操作" align="center">
<template slot-scope="{ row }">
<div class="table-options">
<el-button type="text" @click="toDetail(row.id)">详情</el-button>
<el-button type="text" @click="remove(row.id)">删除</el-button>
<!-- <el-button type="text" @click="toAdd(row.id)">编辑</el-button>
<el-button type="text" @click="showNeighbourSetting(row.id)"
v-if="permissions('app_apppartyfourresident_detail')">四邻设置
</el-button> -->
</div>
</template>
</el-table-column>
<div slot="paginationBtns" class="party-table__btns">
<span style="margin-right: 8px;" @click="removeAll">批量删除</span>
</div>
</ai-table>
</template>
</ai-list>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: 'List',
props: {
instance: Function,
permissions: Function,
dict: Object,
selected: Object
},
data() {
return {
search: {
current: 1,
size: 10,
con: '',
age: [],
sex: '',
nation: '',
partyStatus: '',
flowStatus: '',
education: '',
partyPosition: '',
birthStart: '',
birthEnd: '',
turnPositiveStart: '',
turnPositiveEnd: '',
joinPartyStart: '',
joinPartyEnd: ''
},
orgName: '',
loading: false,
total: 0,
colConfigs: [
{type: 'selection', label: ''},
{prop: 'name', label: '姓名', align: 'center'},
{prop: 'sex', label: '性别', align: 'center', dict: 'sex'},
{prop: 'age', label: '年龄', align: 'center'},
{prop: 'joinPartyTime', label: '入学申请日期', align: 'center'},
{prop: 'flowStatus', label: '发展状态', align: 'center', dict: 'flowStatus'},
],
tableData: [],
ids: '',
}
},
computed: {
...mapState(['user']),
orgTree() {
return this.$refs.tree?.$refs?.partyTree
},
exportQuery() {
let {id: partyOrgId} = this.selected
return {
ids: this.ids ? this.ids.split(',') : [],
...this.search, partyOrgId
}
},
isShowAddBtn() {
return this.selected.isLeaf == 1
}
},
created() {
this.dict.load('disciplinary', 'partyType', 'sex', 'nation', 'education', 'partyStatus', 'partyPosition', 'flowStatus', 'auditStatus')
this.getList()
},
methods: {
showNeighbourSetting(id) {
this.$router.push({query: {id}, hash: "#ns"})
},
onTreeChange(e) {
this.$emit("update:selected", e)
this.getList(e.id)
},
onSearch(v) {
this.orgTree.filter(v)
},
getList(partyOrgId) {
if (!this.user.info.organizationId) return
this.loading = true
partyOrgId = partyOrgId || this.selected.id
this.instance.post(`/app/appparty/list`, null, {
params: {partyOrgId, ...this.search, age: this.search.age?.join(',')}
}).then(res => {
this.loading = false
if (res?.data) {
this.tableData = res.data.records
this.total = res.data.total
}
}).catch(() => {
this.loading = false
})
},
removeAll() {
if (!this.ids) {
return this.$message.error('请选择党员')
}
this.remove(this.ids)
},
handleSelectionChange(e) {
this.ids = e.map(v => v.id).join(',')
},
filterNode(value, data) {
if (!value) return true
return data.name.indexOf(value) !== -1
},
remove(id) {
this.$confirm('确定删除该数据?').then(() => {
this.instance.post(`/app/appparty/delete?ids=${id}`).then(res => {
if (res.code == 0) {
this.$message.success('删除成功!')
this.getList()
}
})
})
},
toDetail(id) {
this.$router.push({query: {id}})
},
toAdd(id) {
this.$router.push({query: {id}, hash: "#add"})
}
}
}
</script>
<style lang="scss" scoped>
.partyList {
.party-table__btns {
display: flex;
align-items: center;
}
::v-deep .audit-0 {
color: #FF8822 !important;
}
::v-deep .audit-1 {
color: #2EA222 !important;
}
::v-deep .ai-list__content--right {
flex: 1;
min-width: 0;
margin-left: 1px;
box-shadow: none;
.ai-list__content--right-wrapper {
width: 100%;
}
}
::v-deep .is-current>.el-tree-node__content{
width: 100%!important;
padding-right: 16px!important;
}
}
</style>

View File

@@ -0,0 +1,228 @@
<template>
<section class="neighbourSetting">
<ai-list>
<ai-title slot="title" title="四邻设置" isShowBottomBorder isShowBack @onBackClick="back"/>
<template #content>
<ai-search-bar>
<template #left>
<el-button type="primary" icon="iconfont iconAdd" @click="dialog=true">添加</el-button>
<el-button icon="iconfont iconDelete" :disabled="!search.ids" @click="handleDelete(search.ids)">删除
</el-button>
</template>
<template #right>
<el-input size="small" placeholder="搜索户主姓名" v-model="search.residentName" clearable
@change="page.current=1,getTableData()" suffix-icon="iconfont iconSearch"/>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
@getList="getTableData" :col-configs="colConfigs" :dict="dict"
@selection-change="v=>search.ids=v.map(e=>e.pfrId).toString()">
<el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{row}">
<el-button type="text" @click="handleDelete(row.pfrId)">删除</el-button>
</template>
</el-table-column>
</ai-table>
</template>
</ai-list>
<ai-dialog title="添加户主" :visible.sync="dialog" @closed="clearDialog" @onConfirm="submit"
width="1200px">
<ai-area-get v-model="form.areaId" :instance="instance" :root="user.info.areaId"
@change="list.current=1,getResident()"/>
<el-row type="flex" class="mar-t16">
<ai-table ref="Residents" :tableData="residents" :total="list.total" :current.sync="list.current"
:size.sync="list.size" class="fill" border height="360px" @getList="getResident"
:col-configs="[{slot: 'resident'}]" layout="slot,->, prev, pager, next, jumper" :pagerCount="5">
<el-table-column slot="resident">
<template #header>
<b v-text="`户主信息列表`"/>
<el-input class="fill searchbar" v-model="list.con" size="small" placeholder="搜索姓名/身份证号" clearable
@change="list.current=1,getResident()"/>
</template>
<template slot-scope="{row}">
<el-row type="flex" justify="space-between" @click.native="handleSelectResident(row)" class="toggle"
:class="{selected:findResident(row.id)>-1}">
<span v-text="row.name"/>
<span v-text="idCardNoUtil.hideId(row.idNumber)"/>
</el-row>
</template>
</el-table-column>
</ai-table>
<ai-table :tableData="form.residentList" :col-configs="[{slot:'resident'}]" :isShowPagination="false" border
height="360px">
<el-table-column slot="resident">
<template #header>
<b v-text="`已选择`"/>
<el-button type="text" @click="form.residentList=[]">清空</el-button>
</template>
<template slot-scope="{row,$index}">
<el-row type="flex" align="middle" justify="space-between">
<div v-text="[row.residentName, idCardNoUtil.hideId(row.idNumber)].join(' ')"/>
<el-button type="text" @click="form.residentList.splice($index,1)">删除</el-button>
</el-row>
</template>
</el-table-column>
</ai-table>
</el-row>
</ai-dialog>
</section>
</template>
<script>
import {mapState} from "vuex";
export default {
name: "neighbourSetting",
props: {
instance: Function,
dict: Object,
},
computed: {
...mapState(['user']),
colConfigs() {
return [
{type: 'selection'},
{label: "户主姓名", prop: "name"},
{label: "身份证号", prop: "idNumber"},
{label: "联系方式", prop: "phone"},
{label: "添加时间", prop: "createTime"},
{slot: "options"}
]
},
},
data() {
return {
search: {residentName: "", ids: ""},
page: {current: 1, size: 10, total: 0},
tableData: [],
dialog: false,
form: {areaId: "", residentList: []},
residents: [],
list: {current: 1, size: 10, total: 0},
}
},
methods: {
back() {
this.$router.push({})
},
getTableData() {
this.instance.post("/app/apppartyfourresident/listFourResident", null, {
params: {...this.page, ...this.search}
}).then(res => {
if (res?.data) {
this.tableData = res.data?.records
this.page.total = res.data.total
}
})
},
handleDelete(ids) {
this.$confirm("是否要删除户主?").then(() => {
this.instance.post("/app/apppartyfourresident/delete", null, {
params: {ids}
}).then(res => {
if (res?.code == 0) {
this.$message.success("删除成功!")
this.getTableData()
}
})
}).catch(() => 0)
},
submit() {
this.instance.post("/app/apppartyfourresident/add", this.form).then(res => {
if (res?.code == 0) {
this.$message.success("提交成功!")
this.dialog = false
this.getTableData()
}
})
},
getResident() {
let {areaId} = this.form
areaId = areaId || this.user.info.areaId
this.instance.post("/app/appresident/list", null, {
params: {householdName: 1, areaId, ...this.list, auditStatus: 1}
}).then(res => {
if (res?.data) {
// this.residents = res.data.records?.map(e => ({dictValue: e.id, dictName: e.name}))
this.residents = res.data.records
this.list.total = res.data.total
this.$refs.Residents.doLayout()
}
})
},
handleSelectResident(row) {
let {id: partyId} = this.$route.query
let index = this.findResident(row.id)
if (index > -1) {
this.form.residentList.splice(index, 1)
} else {
let {id: residentId, name: residentName, idNumber} = row
this.form.residentList.push({residentId, residentName, idNumber, partyId})
}
this.$forceUpdate()
},
findResident(id) {
return this.form.residentList?.findIndex(e => e.residentId == id)
},
clearDialog() {
this.form = {residentList: []}
this.residents = []
this.list = {current: 1, size: 10, total: 0}
}
},
created() {
this.search.partyId = this.$route.query.id
this.getTableData()
}
}
</script>
<style lang="scss" scoped>
.neighbourSetting {
height: 100%;
.mar-t16 {
margin-top: 16px;
}
::v-deep.ai-dialog__content {
.ai-dialog__content--wrapper {
padding-right: 0;
display: flex;
flex-direction: column;
.el-row {
width: 100%;
.ai-table + .ai-table {
margin-left: 16px;
width: 400px;
.ai-table__header > .cell {
line-height: 40px;
}
}
}
.toggle {
cursor: pointer;
&.selected {
color: #26f;
}
}
.ai-table__header > .cell {
display: flex;
align-items: center;
justify-content: space-between;
}
}
}
::v-deep.searchbar {
padding-right: 0;
}
}
</style>