From 40f5cf2a8c324bf08fd5f0aec2e9da00e5f59f76 Mon Sep 17 00:00:00 2001
From: yubo <autumnal_wind@yeah.net>
Date: 星期六, 11 四月 2026 20:29:40 +0800
Subject: [PATCH] fix(user): 在职员工界面优化
---
src/views/user/inemployees.vue | 608 +++---------------------------------------------------
1 files changed, 38 insertions(+), 570 deletions(-)
diff --git a/src/views/user/inemployees.vue b/src/views/user/inemployees.vue
index cfdb0cb..9f35912 100644
--- a/src/views/user/inemployees.vue
+++ b/src/views/user/inemployees.vue
@@ -9,217 +9,15 @@
<el-col :span="9" style="margin-top: 15px;">
<el-input v-model="queryParams.baseKey" placeholder="请输入内容" style="width:300px" />
<span class="search-btn" @click="vagueSearch">查询</span>
- <span class="sup-search-btn" @click="advancedQueryShowMethods">高级查询</span>
+ <span class="sup-search-btn" @click="advancedQueryShow = !advancedQueryShow">高级查询</span>
</el-col>
</el-row>
- <div v-show="advancedQueryShow">
- <el-row>
- <el-col :span="3">员工编号：
- <el-input v-model="queryParams.empNumb" size="small" maxlength="20" style="width:85px" />
- </el-col>
- <el-col :span="3">姓名：
- <el-input v-model="queryParams.empName" size="small" maxlength="10" style="width:110px" />
- </el-col>
- <el-col :span="4">身份证号：
- <el-input v-model="queryParams.certificateNumb" size="small" maxlength="18" style="width:140px" />
- </el-col>
- <el-col :span="4">部门（护卫点）：
- <el-input v-model="queryParams.deptName" size="small" maxlength="20" style="width:100px" />
- </el-col>
- <el-col :span="7">入职日期：
- <el-date-picker
- v-model="queryParams.entryDateStr"
- size="small"
- type="daterange"
- align="right"
- unlink-panels
- range-separator="~"
- value-format="yyyy-MM-dd"
- start-placeholder="开始日期"
- end-placeholder="结束日期"
- style="width: 300px;"
- />
- </el-col>
- <el-col :span="3">
- <el-button size="mini" class="hr-but-all" type="primary" @click="search">查询</el-button>
- <el-button size="mini" class="hr-but" type="danger" @click="resetSearch">重置</el-button>
- </el-col>
- </el-row>
- <el-row>
- <el-col :span="24">
- <table class="searchTable">
- <tr>
- <td class="td">性别：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.sex" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllSex">全部</el-checkbox>
- <el-checkbox
- v-for="data in sexOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">学历：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.education" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllEducation">全部</el-checkbox>
- <el-checkbox
- v-for="data in educationOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">政治面貌：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.politics" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllPolitics">全部</el-checkbox>
- <el-checkbox
- v-for="data in statusOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">年龄：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.ageStr" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllAgeStr">全部</el-checkbox>
- <el-checkbox
- v-for="data in ageStrOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">档案情况：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.archivesStatus" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllArchivesStatus">全部</el-checkbox>
- <el-checkbox
- v-for="data in archivesStatusOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">社保档位：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.insuranceType" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllInsuranceType">全部</el-checkbox>
- <el-checkbox
- v-for="data in insuranceTypeOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">工作证：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.empCardStatus" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllEmpCardStatus">全部</el-checkbox>
- <el-checkbox
- v-for="data in empCardStatusOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">员工手册：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.handbookStatus" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllHandbookStatus">全部</el-checkbox>
- <el-checkbox
- v-for="data in handbookStatusOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">员工类型：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.empType" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllEmpType">全部</el-checkbox>
- <el-checkbox
- v-for="data in empTypeOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">入职类型：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.entryType" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllEntryType">全部</el-checkbox>
- <el-checkbox :label="20">新入职</el-checkbox>
- <el-checkbox :label="21">重新入职</el-checkbox>
- <el-checkbox :label="22">返聘入职</el-checkbox>
- <!-- <el-checkbox-->
- <!-- v-for="data in dimissionTypeOptions"-->
- <!-- :key="data.dicItemName"-->
- <!-- :label="data.dicItemCode"-->
- <!-- >-->
- <!-- {{ data.dicItemName }}-->
- <!-- </el-checkbox>-->
- </el-checkbox-group>
- </td>
- </tr>
- <tr>
- <td class="td">相关证件：</td>
- <td class="td-group">
- <el-checkbox-group v-model="queryParams.certificateList" class="fj-checkbox">
- <el-checkbox label="" @change="selectAllCertificateList">全部</el-checkbox>
- <el-checkbox
- v-for="data in certificateListOptions"
- :key="data.dicItemName"
- :label="data.dicItemCode"
- >
- {{ data.dicItemName }}
- </el-checkbox>
- </el-checkbox-group>
- </td>
- </tr>
- </table>
- </el-col>
- </el-row>
- </div>
+ <advanced-query
+ v-show="advancedQueryShow"
+ :query-params.sync="queryParams"
+ @search="search"
+ @reset="resetSearch"
+ />
</el-header>
<el-main style="height: 85%;">
<el-row style="margin: 10px 0 10px 0;">
@@ -228,7 +26,7 @@
<el-button type="primary" style="background-color: #409EFF" @click="delEmp">删除员工</el-button>
<el-button type="danger" class="hr-but-all" @click="showYgdg(0)">员工调岗</el-button>
<!-- <el-button type="danger" class="hr-but-all" @click="showDryg(0)">导入员工</el-button> -->
- <el-button type="danger" class="hr-but-all" @click="showDcyg(0)">导出EXCEL</el-button>
+ <el-button type="danger" class="hr-but-all" @click="dialogShowDcyg = true">导出EXCEL</el-button>
<el-button type="primary" style="background-color: #409EFF" @click="showGbda(0)">关闭档案</el-button>
</el-col>
</el-row>
@@ -398,217 +196,10 @@
@success="handleCloseArchivesSuccess"
@close="handleCloseArchivesClose"
/>
- <el-dialog title="导出员工" :visible.sync="dialogShowDcyg" width="40%">
- <div style="font-size: 16px;font-weight: 400;height: 35px;margin-top: -30px;color: #409EFF;">
- 请勾选需要导出的字段
- </div>
- <table id="dcygTable" width="100%">
- <tr>
- <td colspan="6" style="text-align: left;">
- <el-checkbox v-model="checkAll" :indeterminate="isIndeterminate" @change="handleCheckAllChange" />
- 全部字段
- </td>
- </tr>
- <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
- <tr>
- <td>档案号</td>
- <td>
- <el-checkbox label="archivesNumb"><span /></el-checkbox>
- </td>
- <td>姓名</td>
- <td>
- <el-checkbox label="empName"><span /></el-checkbox>
- </td>
- <td>性别</td>
- <td>
- <el-checkbox label="sexName"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>部门(护卫点)</td>
- <td>
- <el-checkbox label="allDeptName"><span /></el-checkbox>
- </td>
- <td>所属岗位</td>
- <td>
- <el-checkbox label="jobName"><span /></el-checkbox>
- </td>
- <td>员工类别</td>
- <td>
- <el-checkbox label="empTypeName"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>民族</td>
- <td>
- <el-checkbox label="nationName"><span /></el-checkbox>
- </td>
- <td>身份证号码</td>
- <td>
- <el-checkbox label="certificateNumb"><span /></el-checkbox>
- </td>
- <td>年龄</td>
- <td>
- <el-checkbox label="age"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>婚姻状况</td>
- <td>
- <el-checkbox label="marriageName"><span /></el-checkbox>
- </td>
- <td>身份证有效期</td>
- <td>
- <el-checkbox label="certificateValidity"><span /></el-checkbox>
- </td>
- <td>身高</td>
- <td>
- <el-checkbox label="stature"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>政治面貌</td>
- <td>
- <el-checkbox label="politicsName"><span /></el-checkbox>
- </td>
- <td>出生日期</td>
- <td>
- <el-checkbox label="birthdate"><span /></el-checkbox>
- </td>
- <td>学历</td>
- <td>
- <el-checkbox label="educationName"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>籍贯</td>
- <td>
- <el-checkbox label="nativePlaceName"><span /></el-checkbox>
- </td>
- <td>户籍地址</td>
- <td>
- <el-checkbox label="censusAddress"><span /></el-checkbox>
- </td>
- <td>现住址</td>
- <td>
- <el-checkbox label="currentAddress"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>保安员证号</td>
- <td>
- <el-checkbox label="guardNumb"><span /></el-checkbox>
- </td>
- <td>保安员回执</td>
- <td>
- <el-checkbox label="returnReceipt"><span /></el-checkbox>
- </td>
- <td>档案情况</td>
- <td>
- <el-checkbox label="archivesStatusName"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>银行名称</td>
- <td>
- <el-checkbox label="bankName"><span /></el-checkbox>
- </td>
- <td>银行账号</td>
- <td>
- <el-checkbox label="bankNumb"><span /></el-checkbox>
- </td>
- <td>电话号码</td>
- <td>
- <el-checkbox label="telePhone"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>家庭成员及关系1</td>
- <td>
- <el-checkbox label="family"><span /></el-checkbox>
- </td>
- <td>员工状态</td>
- <td>
- <el-checkbox label="empStatusName"><span /></el-checkbox>
- </td>
- <td>离职日期</td>
- <td>
- <el-checkbox label="dimissionDate"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>入职日期</td>
- <td>
- <el-checkbox label="entryDate"><span /></el-checkbox>
- </td>
- <td>社保档位</td>
- <td>
- <el-checkbox label="insuranceTypeName"><span /></el-checkbox>
- </td>
- <td>社保电脑号</td>
- <td>
- <el-checkbox label="socialNumb"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>招聘介绍人</td>
- <td>
- <el-checkbox label="introducer"><span /></el-checkbox>
- </td>
- <td>入司工龄</td>
- <td>
- <el-checkbox label="seniority"><span /></el-checkbox>
- </td>
- <td>工作证</td>
- <td>
- <el-checkbox label="empCardStatusName"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>相关证件</td>
- <td>
- <el-checkbox label="certificateListName"><span /></el-checkbox>
- </td>
- <td>家庭成员及关系2</td>
- <td>
- <el-checkbox label="urgencyPhone"><span /></el-checkbox>
- </td>
- <td>员工手册</td>
- <td>
- <el-checkbox label="handbookStatusName"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>入职类型</td>
- <td>
- <el-checkbox label="entryTypeName"><span /></el-checkbox>
- </td>
- <td>离职类型</td>
- <td>
- <el-checkbox label="dimissionTypeName"><span /></el-checkbox>
- </td>
- <td>编号</td>
- <td>
- <el-checkbox label="empNumb"><span /></el-checkbox>
- </td>
- </tr>
- <tr>
- <td>年假天数</td>
- <td>
- <el-checkbox label="annualLeave"><span /></el-checkbox>
- </td>
- <td />
- <td />
- <td />
- <td />
- </tr>
- </el-checkbox-group>
- </table>
- <div slot="footer" class="dialog-footer">
- <el-button @click="showDcyg(1)">取 消</el-button>
- <el-button type="primary" @click="showDcyg(2)">确 定</el-button>
- </div>
- </el-dialog>
+ <export-dialog
+ :visible.sync="dialogShowDcyg"
+ @confirm="handleExportConfirm"
+ />
<archives-edit
ref="article"
:dialog-visible="dialog.isVisible"
@@ -738,6 +329,8 @@
import EmpBaseEdit from './components/EmpBaseEdit'
import JobChangeDialog from './components/JobChangeDialog.vue'
import CloseArchivesDialog from './components/CloseArchivesDialog.vue'
+import AdvancedQuery from './components/AdvancedQuery.vue'
+import ExportDialog from '@/components/ExportEmpBase.vue'
import dictMixin from '../../utils/dictMixin'
export default {
@@ -747,7 +340,9 @@
Pagination,
Treeselect,
JobChangeDialog,
- CloseArchivesDialog
+ CloseArchivesDialog,
+ AdvancedQuery,
+ ExportDialog
},
mixins: [dictMixin],
data() {
@@ -797,11 +392,6 @@
dialogShowDryg: false,
dialogShowGbda: false,
dialogShowDkda: false,
- exportUrl: '',
- checkAll: false,
- isIndeterminate: false,
- cityOptions: ['archivesNumb', 'allDeptName', 'jobName', 'empName', 'certificateNumb', 'certificateValidity', 'sexName', 'nationName', 'age', 'marriageName', 'stature', 'birthdate', 'politicsName', 'empTypeName', 'educationName', 'nativePlaceName', 'censusAddress', 'currentAddress', 'guardNumb', 'returnReceipt', 'archivesStatusName', 'bankName', 'bankNumb', 'telePhone', 'entryDate', 'insuranceTypeName', 'socialNumb', 'introducer', 'seniority', 'empCardStatusName', 'certificateListName', 'urgencyPhone', 'handbookStatusName', 'family', 'empStatusName', 'dimissionDate', 'entryTypeName', 'dimissionTypeName', 'empNumb', 'annualLeave'],
- checkedCities: [],
tableData: [],
inTypeOptions: [],
openArchivesForm: {}
@@ -812,9 +402,7 @@
statusOptions() {
return this.getDictOptions('PLITICAL')
},
- empTypeOptions() {
- return this.getDictOptions('EMPTYPE')
- },
+
nationOptions() {
return this.getDictOptions('NATION')
},
@@ -827,21 +415,11 @@
nativePlaceOptions() {
return this.getDictOptions('NATIVEPLACE')
},
- archivesStatusOptions() {
- return this.getDictOptions('archivesStatus')
- },
+
insuranceTypeOptions() {
return this.getDictOptions('INSURANCETYPE')
},
- empCardStatusOptions() {
- return this.getDictOptions('empCardStatus')
- },
- handbookStatusOptions() {
- return this.getDictOptions('handbookStatus')
- },
- certificateListOptions() {
- return this.getDictOptions('certificateList')
- },
+
physicalExamTypeOptions() {
return this.getDictOptions('PHYSICALEXAMTYPE')
},
@@ -878,18 +456,20 @@
dimissionTypeOptions() {
return this.getDictOptions('LZTYPE')
},
- ageStrOptions() {
- return this.getDictOptions('ageStr')
- },
sexOptions() {
return this.getDictOptions('sex')
+ }
+ },
+ watch: {
+ advancedQueryShow(val) {
+ this.headerHeight = val ? 'auto' : '30px'
}
},
mounted() {
this.fetch()
this.initDept()
// 字典数据已在登录时预加载，直接从 Vuex 获取
- this.initDictTypes(['ageStr', 'PLITICAL', 'sex', 'EMPTYPE', 'NATION', 'MARRIAGE', 'EDUCATION', 'NATIVEPLACE', 'archivesStatus', 'INSURANCETYPE', 'empCardStatus', 'handbookStatus', 'certificateList', 'PHYSICALEXAMTYPE', 'ECG', 'CONTRACTSTATUS', 'LEAVETYPE', 'applayStatus', 'reportStatus', 'hospitalizatioFlag', 'settleStatus', 'ZCTYPE', 'changeType', 'LZTYPE'])
+ this.initDictTypes(['PLITICAL', 'sex', 'NATION', 'MARRIAGE', 'EDUCATION', 'NATIVEPLACE', 'INSURANCETYPE', 'PHYSICALEXAMTYPE', 'ECG', 'CONTRACTSTATUS', 'LEAVETYPE', 'applayStatus', 'reportStatus', 'hospitalizatioFlag', 'settleStatus', 'ZCTYPE', 'changeType', 'LZTYPE'])
this.initJob()
},
methods: {
@@ -1057,15 +637,7 @@
})
})
},
- advancedQueryShowMethods() {
- if (this.advancedQueryShow) {
- this.headerHeight = '30px'
- this.advancedQueryShow = false
- } else {
- this.headerHeight = 'auto'
- this.advancedQueryShow = true
- }
- },
+
editEmpBase(row) {
console.log(row)
this.isAdd = false
@@ -1151,35 +723,16 @@
this.dialogShowDkda = true
})
},
- handleCheckAllChange(val) {
- this.checkedCities = val ? this.cityOptions : []
- this.isIndeterminate = false
- },
- handleCheckedCitiesChange(value) {
- const checkedCount = value.length
- this.checkAll = checkedCount === this.cityOptions.length
- this.isIndeterminate = checkedCount > 0 && checkedCount < this.cityOptions.length
- },
- showDcyg(operate) {
- switch (operate) {
- case 0:
- this.dialogShowDcyg = true
- break
- case 1:
- this.dialogShowDcyg = false
- break
- case 2:
- var params = this.queryParams
- params.empStatus = '0'
- params.exportField = this.checkedCities.join(',')
- this.$download('hr/empBaseInfo/exportWithField', { ...params }, '在职员工列表.xls').then(() => {
- this.$message({
- message: '下载成功!',
- type: 'success'
- })
- })
- break
- }
+ handleExportConfirm(selectedFields) {
+ var params = { ...this.queryParams }
+ params.empStatus = '0'
+ params.exportField = selectedFields.join(',')
+ this.$download('hr/empBaseInfo/exportWithField', { ...params }, '在职员工列表.xls').then(() => {
+ this.$message({
+ message: '下载成功!',
+ type: 'success'
+ })
+ })
},
editSuccess() {
this.search()
@@ -1261,92 +814,7 @@
})
})
},
- // dic列表转为数组
- dicListToArr(dicList) {
- var arr = []
- for (var i = 0; i < dicList.length; i++) {
- var dic = dicList[i]
- arr.push(dic.dicItemCode)
- }
- return arr
- },
- selectAllSex(val) {
- if (val) {
- this.queryParams.sex = this.dicListToArr(this.sexOptions)
- } else {
- this.queryParams.sex = []
- }
- },
- selectAllEducation(val) {
- if (val) {
- this.queryParams.education = this.dicListToArr(this.educationOptions)
- } else {
- this.queryParams.education = []
- }
- },
- selectAllPolitics(val) {
- if (val) {
- this.queryParams.politics = this.dicListToArr(this.statusOptions)
- } else {
- this.queryParams.politics = []
- }
- },
- selectAllAgeStr(val) {
- if (val) {
- this.queryParams.ageStr = this.dicListToArr(this.ageStrOptions)
- } else {
- this.queryParams.ageStr = []
- }
- },
- selectAllArchivesStatus(val) {
- if (val) {
- this.queryParams.archivesStatus = this.dicListToArr(this.archivesStatusOptions)
- } else {
- this.queryParams.archivesStatus = []
- }
- },
- selectAllInsuranceType(val) {
- if (val) {
- this.queryParams.insuranceType = this.dicListToArr(this.insuranceTypeOptions)
- } else {
- this.queryParams.insuranceType = []
- }
- },
- selectAllEmpCardStatus(val) {
- if (val) {
- this.queryParams.empCardStatus = this.dicListToArr(this.empCardStatusOptions)
- } else {
- this.queryParams.empCardStatus = []
- }
- },
- selectAllHandbookStatus(val) {
- if (val) {
- this.queryParams.handbookStatus = this.dicListToArr(this.handbookStatusOptions)
- } else {
- this.queryParams.handbookStatus = []
- }
- },
- selectAllEmpType(val) {
- if (val) {
- this.queryParams.empType = this.dicListToArr(this.empTypeOptions)
- } else {
- this.queryParams.empType = []
- }
- },
- selectAllEntryType(val) {
- if (val) {
- this.queryParams.entryType = [20, 21, 22]
- } else {
- this.queryParams.entryType = []
- }
- },
- selectAllCertificateList(val) {
- if (val) {
- this.queryParams.certificateList = this.dicListToArr(this.certificateListOptions)
- } else {
- this.queryParams.certificateList = []
- }
- },
+
headers() {
const token = getToken()
if (token) {
--
Gitblit v1.8.0