<template>
|
<div class="box-card">
|
<div class="details-center">
|
<h3 class="fz-10 fw-bold mr-b-10" style="padding-top: 20px">{{ info_id ? '编辑' : '新增' }}报到党员</h3>
|
<el-form :model="paramData" :rules="paramRules" ref="paramForm" label-width="250px">
|
<div class="fl-fw">
|
<el-form-item label="党员姓名" prop="name">
|
<el-input class="iw-220" clearable placeholder="请输入党员姓名" v-model.trim="paramData.name"></el-input>
|
</el-form-item>
|
<el-form-item label="手机号" prop="phone">
|
<el-input
|
class="iw-220"
|
clearable
|
maxlength="11"
|
placeholder="请输入手机号"
|
v-model.trim="paramData.phone"
|
></el-input>
|
</el-form-item>
|
</div>
|
<div class="fl-fw">
|
<el-form-item label="常住社区" prop="communityId">
|
<el-select
|
filterable
|
clearable
|
v-if="backstageType != 1 || areaType"
|
class="iw-220"
|
v-model="paramData.communityId"
|
placeholder="请选择常住社区"
|
@change="checkCommunityHandle"
|
>
|
<el-option
|
v-for="item in communityList"
|
:key="item.communityId"
|
:label="item.name"
|
:value="item.communityId"
|
>
|
</el-option>
|
</el-select>
|
<!-- <el-cascader
|
v-model="communityListValue"
|
:options="cityChooseList"
|
:props="propsCityTourst"
|
filterable
|
class="iw-220"
|
placeholder="选择常住社区"
|
/> -->
|
<el-input
|
class="iw-220"
|
clearable
|
v-else
|
disabled
|
placeholder="请输入"
|
v-model.trim="paramData.communityName"
|
></el-input>
|
</el-form-item>
|
<el-form-item label="小区院落" v-if="paramData.communityId">
|
<el-select
|
filterable
|
class="iw-220"
|
v-model="paramData.villageId"
|
placeholder="请选择小区院落"
|
@change="villageChange"
|
>
|
<el-option v-for="item in villageList" :key="item.villageId" :label="item.name" :value="item.villageId">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</div>
|
<div class="fl-fw">
|
<el-form-item label="职能特长及服务意愿" prop="specialtyName">
|
<el-select
|
filterable
|
multiple
|
collapse-tags
|
class="iw-220"
|
@change="skillChange"
|
v-model="specialtyNameValue"
|
placeholder="请选择职能特长及服务意愿"
|
>
|
<el-option v-for="item in skillList" :key="item.value" :label="item.label" :value="item.label">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="其他职能特长及服务意愿" prop="idCard" v-if="skillOtherType">
|
<el-input
|
class="iw-220"
|
clearable
|
placeholder="请输入其他职能特长及服务意愿"
|
v-model.trim="paramData.otherRemark"
|
></el-input>
|
</el-form-item>
|
</div>
|
<el-form-item label="所属党组织" prop="orgName">
|
<el-select filterable class="iw-220" v-model="paramData.orgName" placeholder="请选择所属党组织">
|
<el-option v-for="item in orgNameList" :key="item.label" :label="item.label" :value="item.label">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="单位归属" prop="belongTo" v-if="backstageType != 1 || !areaType">
|
<el-select
|
filterable
|
class="iw-220"
|
v-model="paramData.belongTo"
|
placeholder="请选择单位归属"
|
@change="belongToChange"
|
>
|
<el-option v-for="item in belongToList" :key="item.label" :label="item.label" :value="item.label">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="工作单位" prop="checkUnitId" v-if="paramData.belongTo">
|
<el-select
|
filterable
|
class="iw-220"
|
@change="unitChange"
|
v-model="paramData.checkUnitId"
|
placeholder="请选择工作单位"
|
>
|
<el-option v-for="item in unitList" :key="item.id" :label="item.name" :value="item.id"> </el-option>
|
</el-select>
|
</el-form-item>
|
<div v-if="paramData.checkUnitId">
|
<div class="fl-fw">
|
<el-form-item label="服务社区">
|
<span>{{ paramData.helpCommunityName }}</span>
|
</el-form-item>
|
<el-form-item label="社区联系人">
|
<span>{{ paramData.helpCommunityContactsName }}</span>
|
</el-form-item>
|
<el-form-item label="社区联系人电话">
|
<span>{{ paramData.helpCommunityContacts }}</span>
|
</el-form-item>
|
</div>
|
<div class="fl-fw">
|
<el-form-item label="单位性质">
|
<span>{{ paramData.natureName }}</span>
|
</el-form-item>
|
<el-form-item label="下沉服务小区（网格）院落">
|
<span>{{ paramData.unitVillageName }}</span>
|
</el-form-item>
|
</div>
|
</div>
|
<el-form-item prop="password" label="">
|
<el-button @click="handleAction('close')">取 消</el-button>
|
<el-button type="primary" :loading="btnType" @click="handleAction('submit')">提 交</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
</div>
|
</template>
|
<script>
|
import { objCopyPro, areaAccountReturn } from '../../../utils/common';
|
import { PHONE } from '@/utils/validation';
|
import UploadImg from '../../../components/upload/uploadImg.vue';
|
export default {
|
components: {
|
UploadImg,
|
},
|
data() {
|
return {
|
info_id: '',
|
btnType: false,
|
paramData: {
|
type: 1,
|
address: '',
|
villageId: '',
|
villageName: '',
|
name: '', // 姓名
|
phone: '', // 手机号
|
communityName: '', // 社区名称
|
communityId: null, // 社区名称
|
orgName: '', // 所属组织名称
|
checkUnitId: '', // 报到单位
|
checkUnitName: '', // 报到单位名称
|
// specialtyCategory: "", // 技能特长
|
specialtyName: '', // 技能特长名称
|
helpCommunityId: '',
|
helpCommunityName: '',
|
helpCommunityContacts: '',
|
helpCommunityContactsName: '',
|
natureName: '',
|
natureId: '',
|
otherRemark: '',
|
unitVillageName: '',
|
belongTo: '',
|
},
|
paramRules: {
|
communityId: [{ required: true, message: '请选择常住社区', trigger: 'change' }],
|
villageId: [{ required: true, message: '请选择小区院落', trigger: 'change' }],
|
orgName: [{ required: true, message: '请输入所属党组织', trigger: 'change' }],
|
belongTo: [{ required: true, message: '请选择单位归属', trigger: 'change' }],
|
checkUnitId: [{ required: true, message: '请选择工作单位', trigger: 'change' }],
|
specialtyName: [
|
{
|
required: true,
|
message: '请选择职能特长及服务意愿',
|
trigger: 'change',
|
},
|
],
|
name: [{ required: true, message: '请输入党员姓名', trigger: 'blur' }],
|
phone: [{ required: true, validator: PHONE, trigger: 'blur' }],
|
}, // 表单验证
|
cityChooseList: [],
|
propsCityTourst: {
|
label: 'label',
|
value: 'label',
|
},
|
communityListValue: [],
|
villageList: [],
|
specialtyNameValue: [],
|
skillList: [
|
{ label: '党建指导', value: 1, checkType: false },
|
{ label: '政策宣讲', value: 2, checkType: false },
|
{ label: '教育培训', value: 3, checkType: false },
|
{ label: '就业服务', value: 4, checkType: false },
|
{ label: '志愿服务', value: 5, checkType: false },
|
{ label: '维修服务', value: 6, checkType: false },
|
{ label: '家政服务', value: 7, checkType: false },
|
{ label: '其他', value: 8, checkType: false },
|
],
|
skillOtherType: false,
|
unitList: [],
|
communityList: [],
|
isZuZhibuUser: false,
|
belongToList: [
|
{
|
label: '市直属',
|
},
|
{
|
label: '西区',
|
},
|
{
|
label: '东区',
|
},
|
{
|
label: '仁和区',
|
},
|
{
|
label: '盐边县',
|
},
|
{
|
label: '米易县',
|
},
|
{
|
label: '钒钛高新区',
|
},
|
],
|
areaType: false,
|
backstageType: '',
|
orgNameList: [],
|
};
|
},
|
created() {
|
let managenerName = demo.$session.get('user').name;
|
this.backstageType = demo.$session.get('user').backstageType;
|
this.belongToList.forEach((it, ix) => {
|
if (it.label === managenerName) {
|
// this.belongToList.splice(ix, 1);
|
this.belongToList = [
|
{
|
label: it.label,
|
},
|
];
|
}
|
});
|
this.isZuZhibuUser = demo.$session.get('user').account == 'zuzhibu';
|
},
|
mounted() {
|
this.areaType = areaAccountReturn(demo.$session.get('user').name);
|
if (!this.isZuZhibuUser || this.areaType) {
|
let userInfo = demo.$session.get('user');
|
this.paramData.communityName = userInfo.title;
|
userInfo.communityId = userInfo.communityId == 0 ? '' : userInfo.communityId;
|
this.paramData.communityId = userInfo.communityId || '';
|
this.getAreaRequestList(userInfo.communityId);
|
}
|
this.info_id = this.$route.query.id;
|
if (this.info_id) {
|
this.getDataInfo();
|
}
|
this.getUnitList();
|
this.getCommunityList();
|
this.getOrgnameList();
|
},
|
methods: {
|
// 所属党组织列表
|
getOrgnameList() {
|
// comPbCheckUnit/orgList
|
this.$api.get(
|
'checkUnit/orgList',
|
{},
|
(res) => {
|
const data = res.map((i) => {
|
return { label: i.orgName, value: i.orgName };
|
});
|
this.orgNameList = data
|
},
|
(err) => {
|
console.log(err);
|
}
|
);
|
},
|
belongToChange(val) {
|
this.paramData.checkUnitId = '';
|
if (val) {
|
this.getUnitList(val);
|
}
|
},
|
getCommunityList() {
|
this.$api.get('communityactivity/community/list', {}, (e) => {
|
this.communityList = e;
|
});
|
},
|
villageChange(val) {
|
this.villageList.forEach((it) => {
|
if (it.villageId === val) {
|
this.paramData.villageName = it.name;
|
}
|
});
|
},
|
unitChange(val) {
|
this.unitList.forEach((it) => {
|
if (it.id === val) {
|
this.paramData.helpCommunityId = it.helpCommunityId;
|
this.paramData.checkUnitName = it.name;
|
this.paramData.helpCommunityName = it.helpCommunityName;
|
this.paramData.helpCommunityContactsName = it.helpCommunityContactsName;
|
this.paramData.helpCommunityContacts = it.helpCommunityContacts;
|
this.paramData.natureName = it.natureName;
|
this.paramData.unitVillageName = it.villageName;
|
}
|
});
|
},
|
// 获取区域列表
|
getAreaRequestList(id) {
|
this.$api.post(
|
'villagemanager/listvillage',
|
{
|
communityId: id,
|
},
|
(res) => {
|
this.villageList = res.data;
|
}
|
);
|
},
|
getUnitList(val) {
|
this.$api.post(
|
'checkUnit/page',
|
{
|
pageNum: 1,
|
pageSize: 999,
|
belongTo: val,
|
},
|
(res) => {
|
this.unitList = res.records;
|
}
|
);
|
},
|
checkCommunityHandle(val) {
|
this.paramData.villageId = '';
|
if (val) {
|
this.getAreaRequestList(val);
|
}
|
},
|
getDataInfo() {
|
this.$api.get(`communitypartybuilding/memberDetail`, { id: this.info_id }, (res) => {
|
const BACK_DATA_INFO = res;
|
this.paramData = objCopyPro(this.paramData, BACK_DATA_INFO);
|
if (BACK_DATA_INFO.villageId) {
|
this.paramData.villageId += '';
|
}
|
this.paramData.communityId += '';
|
this.paramData.villageId = this.paramData.villageId ? this.paramData.villageId : '';
|
this.getAreaRequestList(this.paramData.communityId);
|
this.specialtyNameValue = res.specialtyName.split(',');
|
this.skillOtherType = this.specialtyNameValue.some((item) => {
|
return item === '其他';
|
});
|
});
|
},
|
// 页面操作
|
async handleAction(type, row) {
|
switch (type) {
|
case 'close': {
|
this.$router.back();
|
break;
|
}
|
case 'submit': {
|
this.$refs.paramForm.validate((val) => {
|
if (val) {
|
this.btnType = true;
|
if (this.info_id) {
|
this.$api.put('communitypartybuilding/updatepartybuildingmember', this.paramData, () => {
|
this.btnType = false;
|
demo.toast('提交成功');
|
this.$router.back();
|
});
|
} else {
|
this.$api.post('communitypartybuilding/addpartybuildingmember', this.paramData, () => {
|
this.btnType = false;
|
demo.toast('提交成功');
|
this.$router.back();
|
});
|
}
|
}
|
});
|
break;
|
}
|
default: {
|
break;
|
}
|
}
|
},
|
skillChange(arr) {
|
this.skillOtherType = arr.some((item) => {
|
return item === '其他';
|
});
|
this.paramData.specialtyName = arr.join(',');
|
},
|
},
|
};
|
</script>
|
<style scoped>
|
.textarea-width {
|
width: 400px;
|
}
|
</style>
|
