zhgdyun/src/views/projectFront/smartPartyBuilding/partyMemberManagementSyhy.vue

614 lines
17 KiB
Vue
Raw Normal View History

<template>
<div class="fullHeight whiteBlock">
<div style="padding: 15px 15px 0">
<!-- 党员管理沈阳和盈 -->
<el-form
:inline="true"
ref="searchForm"
:model="searchForm"
size="medium"
>
<el-form-item label="姓名">
<el-input
v-model="searchForm.userName"
placeholder="请输入"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="getList">{{
$t('message.energyManage.waybill.query')
}}</el-button>
<el-button type="warning" plain @click="refresh">{{
$t('message.deviceManage.refresh')
}}</el-button>
<el-button type="primary" size="medium" @click="add">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table class="tables" :data="List">
<el-table-column prop="image" label="照片" align="center">
<template slot-scope="scope">
<img
:preview="scope.row.image[0] ? scope.row.image[0].url : []"
:src="scope.row.image[0] ? scope.row.image[0].url : []"
alt=""
width="50px"
/>
</template>
</el-table-column>
<el-table-column
prop="userName"
align="center"
label="姓名"
></el-table-column>
<el-table-column
prop="contactNumber"
align="center"
label="联系电话"
></el-table-column>
<el-table-column
prop="genderName"
align="center"
label="性别"
2024-02-03 17:55:26 +08:00
width="50"
></el-table-column>
<el-table-column
prop="nationName"
align="center"
label="民族"
></el-table-column>
<el-table-column
prop="birthDate"
align="center"
label="出生日期"
></el-table-column>
<el-table-column
prop="positionTypeName"
align="center"
label="岗位类型"
></el-table-column>
<el-table-column
prop="politicalStatusName"
align="center"
label="政治面貌"
>
<!-- <template slot-scope="scope">{{scope.row.politicalStatus==2?'中共预备党员':'.'}}</template> -->
</el-table-column>
<el-table-column
prop="educationLevelName"
align="center"
label="文化程度"
></el-table-column>
<el-table-column
prop="joinPartyTime"
align="center"
label="入党时间"
></el-table-column>
<el-table-column
prop="joinPartyDeclaration"
align="center"
label="入党誓言"
>
<template slot-scope="scope"
><div class="textStyle" :title="scope.row.joinPartyDeclaration">
{{ scope.row.joinPartyDeclaration }}
</div></template
>
</el-table-column>
<el-table-column label="操作" align="center" width="180px">
<template slot-scope="scope">
<div class="tableBtns" style="margin-left: 20px !important">
<div @click="edit(scope.row)" class="operationText">
<img
src="@/assets/images/icon-edit.png"
width="15px"
height="15px"
/>
<span>编辑</span>
</div>
<div @click="deleteDev(scope.row)" class="operationText">
<img
src="@/assets/images/icon-delete.png"
width="15px"
height="15px"
/>
<span>删除</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
</div>
<el-dialog
:modal-append-to-body="false"
@close="close"
:title="title"
:visible.sync="dialogShow"
width="667px"
>
<div class="dialog_content">
<el-form
size="medium"
ref="addEditForm"
:model="addEditForm"
:rules="addEditRules"
label-width="120px"
class="dialogFormBox"
>
<el-form-item label="照片">
<el-upload
:action="$store.state.UPLOADURL"
list-type="picture-card"
multiple
name="files"
:limit="1"
accept=".png, .jpg, .jpeg"
:file-list="fileUplodList"
:on-success="(res, file) => handleSuccess(res, file)"
:on-remove="(file, fileList) => handleRemove(file, fileList)"
>
<i class="el-icon-plus"></i>
</el-upload>
</el-form-item>
<el-form-item label="姓名" prop="userName">
<el-input
v-model="addEditForm.userName"
placeholder="请输入"
></el-input>
</el-form-item>
<el-form-item label="联系电话" prop="contactNumber">
<el-input
v-model="addEditForm.contactNumber"
placeholder="请输入"
></el-input>
</el-form-item>
<el-form-item label="性别" prop="gender">
<el-select
v-model="addEditForm.gender"
placeholder="请选择"
>
<el-option
v-for="(item, index) in genderList"
:key="index"
:label="item.desc"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="民族" prop="nation">
<el-select
v-model="addEditForm.nation"
placeholder="请选择"
>
<el-option
v-for="(item, index) in nationList"
:key="index"
:label="item.desc"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="出生日期" prop="birthDate">
<el-date-picker
value-format="yyyy-MM-dd"
v-model="addEditForm.birthDate"
type="date"
placeholder="选择日期"
>
</el-date-picker>
</el-form-item>
<el-form-item label="岗位类型" prop="positionType">
<el-select v-model="addEditForm.positionType" placeholder="请选择">
<el-option
v-for="(item, index) in positionList"
:key="index"
:label="item.desc"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="入党时间" prop="joinPartyTime">
<el-date-picker
value-format="yyyy-MM-dd"
v-model="addEditForm.joinPartyTime"
type="date"
placeholder="选择日期"
>
</el-date-picker>
</el-form-item>
<el-form-item label="政治面貌" prop="politicalStatus">
<el-select
v-model="addEditForm.politicalStatus"
placeholder="请选择"
>
<el-option
v-for="(item, index) in politicalList"
:key="index"
:label="item.desc"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="文化程度" prop="educationLevel">
<el-select
v-model="addEditForm.educationLevel"
placeholder="请选择"
>
<el-option
v-for="(item, index) in educationList"
:key="index"
:label="item.desc"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="入党誓言" prop="joinPartyDeclaration">
<el-input
v-model="addEditForm.joinPartyDeclaration"
placeholder="请输入"
type="textarea"
></el-input>
</el-form-item>
<div class="dialog-footer">
<el-button
class="cancleBtn"
@click="dialogShow = false"
icon="el-icon-circle-close"
size="medium"
>{{ $t('message.deviceManage.cancel') }}
</el-button>
<el-button
type="primary"
icon="el-icon-circle-check"
@click="submit"
size="medium"
>{{ $t('message.deviceManage.save') }}
</el-button>
</div>
</el-form>
</div>
</el-dialog>
</div>
</template>
<script>
import {
addPartyMemberManageApi,
deletePartyMemberManageApi,
editPartyMemberManageApi,
getPartyMemberManagePageApi,
getPartyMemberManagePoliticalApi,//获取政治面貌枚举信息
getPartyMemberManagePositionApi,//获取岗位类型枚举信息
getPartyMemberManageEducationApi,//获取文化程度枚举信息
getPartyMemberManageGenderApi,//获取性别枚举信息
getPartyMemberManageNationApi,//获取民族枚举信息
} from '@/assets/js/api/materialManagement.js'
import {
checkPhone
} from '@/assets/js/util.js'
export default {
mounted() {
this.getList()
this.getPoliticalData()
this.getPositionData()
this.getEducationData()
this.getGenderData()
this.getNationData()
},
data() {
return {
politicalList: [],//政治面貌
positionList: [],//岗位类型
educationList: [],//文化程度
genderList: [],//性别
nationList: [],//民族
fileUplodList: [],
title: "",
dialogShow: false,
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0 //总条数
},
List: [],
addEditForm: {
image: '',
userName: '',
contactNumber: '',
gender: '',
nation: '',
birthDate: '',
positionType: '',
joinPartyTime: '',
politicalStatus: '',
educationLevel: '',
joinPartyDeclaration: '',
},
addEditRules: {
userName: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
contactNumber: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
gender: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
nation: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
birthDate: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
positionType: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
joinPartyTime: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
politicalStatus: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
educationLevel: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
joinPartyDeclaration: [
{
required: true,
message: '必填',
trigger: 'blur'
},
],
},
searchForm: {
userName: '',
},
}
},
methods: {
//查询性别类型
getGenderData() {
getPartyMemberManageGenderApi().then(res => {
this.genderList = res.result
})
},
//查询民族类型
getNationData() {
getPartyMemberManageNationApi().then(res => {
this.nationList = res.result
})
},
//查询岗位类型
getPoliticalData() {
getPartyMemberManagePositionApi().then(res => {
this.positionList = res.result
})
},
//查询政治面貌
getPositionData() {
getPartyMemberManagePoliticalApi().then(res => {
this.politicalList = res.result
})
},
//查询文化程度
getEducationData() {
getPartyMemberManageEducationApi().then(res => {
this.educationList = res.result
})
},
//查询列表
getList() {
getPartyMemberManagePageApi({
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
projectSn: this.$store.state.projectSn,
userName: this.searchForm.userName,
}).then((result) => {
if (result.success) {
result.result.records.map((item) => {
if (item.image.includes("[")) {
item.image = JSON.parse(item.image);
if (item.image.length !== 0 && !item.image[0].url.includes(this.$store.state.FILEURL)) {
item.image[0].url =
this.$store.state.FILEURL + item.image[0].url;
}
} else {
let url = item.image
if (url.length !== 0 && !url.includes(this.$store.state.FILEURL)) {
item.image = [{}]
item.image[0].url =
this.$store.state.FILEURL + url;
}
}
})
this.List = result.result.records
this.pagInfo.total = result.result.total
}
})
},
add() {
this.title = '新增'
this.dialogShow = true
this.fileUplodList = []
this.close()
},
edit(obj) {
this.title = '编辑'
this.dialogShow = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
this.fileUplodList = obj.image
},
submit() {
if (this.addEditForm.contactNumber) {
if (!checkPhone(this.addEditForm.contactNumber)) {
this.$message.error('请输入正确的手机号码')
return
}
}
let params = JSON.parse(JSON.stringify(this.addEditForm))
params.projectSn = this.$store.state.projectSn
params.image = JSON.stringify(this.fileUplodList)
2024-01-19 10:36:41 +08:00
// if (this.fileUplodList.length == 0) {
// this.$message.error('请上传照片')
// return false
// }
this.$refs.addEditForm.validate((valid) => {
if (valid) {
if (this.title == '新增') {
addPartyMemberManageApi(params).then((result) => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
} else if (this.title == '编辑') {
editPartyMemberManageApi(params).then((result) => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
}
this.dialogShow = false
} else {
return false
}
})
},
deleteDev(obj) {
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
deletePartyMemberManageApi({ id: obj.id }).then((res) => {
if (res.success) {
this.getList()
this.$message({
type: "success",
message: "删除成功!",
});
} else {
this.$message({
type: "error",
message: res.message,
});
}
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
},
// 删除
handleRemove(file, fileList) {
this.fileUplodList = fileList
},
handleSuccess(res, file, type) {
if (res.status == 'SUCCESS') {
this.fileUplodList.push({
name: file.name,
url: this.$store.state.FILEURL + file.response.data[0].imageUrl
})
}
},
close() {
this.addEditForm = {}
this.$nextTick(() => {
this.$refs.addEditForm.clearValidate()
})
},
SizeChange(val) {
this.pagInfo.pageSize = val
this.getList()
},
CurrentChange(val) {
this.pagInfo.pageNo = val
this.getList()
},
refresh() {
this.searchForm = {}
this.pagInfo.pageNo = 1 //页数
this.pagInfo.pageSize = 10 //条数
this.getList()
},
}
}
</script>
<style lang="less" scoped>
.tables2 {
min-height: auto;
}
.textStyle {
width: 140px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>