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/components/ExportEmpBase.vue | 7
src/styles/inemployees-scoped.scss | 206 ++++++++
src/views/user/components/AdvancedQuery.vue | 213 +++++++++
src/views/user/inemployees.vue | 608 +------------------------
src/styles/inemployees-global.scss | 17
src/views/user/components/JobChangeDialog.vue | 285 ++++++++++++
6 files changed, 766 insertions(+), 570 deletions(-)
diff --git a/src/components/ExportEmpBase.vue b/src/components/ExportEmpBase.vue
index 791ab48..b107e56 100644
--- a/src/components/ExportEmpBase.vue
+++ b/src/components/ExportEmpBase.vue
@@ -39,6 +39,7 @@
{ label: '姓名', value: 'empName' },
{ label: '性别', value: 'sexName' },
{ label: '身份证号码', value: 'certificateNumb' },
+ { label: '身份证有效期', value: 'certificateValidity' },
{ label: '出生日期', value: 'birthdate' },
{ label: '年龄', value: 'age' },
{ label: '民族', value: 'nationName' },
@@ -50,6 +51,8 @@
{ label: '部门 (护卫点)', value: 'allDeptName' },
{ label: '岗位', value: 'jobName' },
{ label: '员工类别', value: 'empTypeName' },
+ { label: '员工状态', value: 'empStatusName' },
+ { label: '入职类型', value: 'entryTypeName' },
{ label: '联系电话', value: 'telePhone' },
{ label: '现住址', value: 'currentAddress' },
{ label: '户籍地址', value: 'censusAddress' },
@@ -59,7 +62,9 @@
{ label: '银行名称', value: 'bankName' },
{ label: '银行账号', value: 'bankNumb' },
{ label: '保安员证号', value: 'guardNumb' },
+ { label: '保安员回执', value: 'returnReceipt' },
{ label: '档案状态', value: 'archivesStatusName' },
+ { label: '招聘介绍人', value: 'introducer' },
{ label: '合同状态', value: 'contractStatusName' },
{ label: '转正日期', value: 'probationDate' },
{ label: '转正状态', value: 'probationStatusName' },
@@ -69,6 +74,8 @@
{ label: '家庭成员及关系 1', value: 'family' },
{ label: '家庭成员及关系 2', value: 'urgencyPhone' },
{ label: '入司工龄', value: 'seniority' },
+ { label: '离职日期', value: 'dimissionDate' },
+ { label: '离职类型', value: 'dimissionTypeName' },
{ label: '年假天数', value: 'annualLeave' },
{ label: '备注', value: 'remark' }
]
diff --git a/src/styles/inemployees-global.scss b/src/styles/inemployees-global.scss
new file mode 100644
index 0000000..2ac9965
--- /dev/null
+++ b/src/styles/inemployees-global.scss
@@ -0,0 +1,17 @@
+// 全局样式（非scoped）
+.zzyg-table {
+ .el-table th, .el-table td {
+ padding: 7px 0;
+ }
+}
+
+.fj-checkbox {
+ .el-checkbox__input.is-checked .el-checkbox__inner {
+ border-color: #a32c30;
+ background: #a32c30;
+ }
+
+ .el-checkbox__label {
+ color: #000 !important;
+ }
+}
diff --git a/src/styles/inemployees-scoped.scss b/src/styles/inemployees-scoped.scss
new file mode 100644
index 0000000..f08731d
--- /dev/null
+++ b/src/styles/inemployees-scoped.scss
@@ -0,0 +1,206 @@
+.el-main {
+ height: 600px;
+}
+
+.searchTable {
+ margin-top: 10px;
+ border-collapse: collapse;
+ width: 100%;
+
+ tr {
+ border-bottom: 1px dashed #d9dadb;
+ }
+
+ .td {
+ width: 90px;
+ text-align: right;
+ }
+
+ .td-group {
+ padding-left: 20px;
+ }
+}
+
+.searchTable td,
+.searchTable th {
+ color: #000;
+ height: 50px;
+ background-color: #fff;
+}
+
+#ygxq table {
+ border-collapse: collapse;
+ margin: 0 auto;
+ text-align: center;
+ width: 100%;
+ margin-top: 20px;
+}
+
+#ygxq table td,
+#ygxq table th {
+ border: 1px solid #DDDCDC;
+ color: #666;
+ height: 30px;
+}
+
+#ygxq table thead th {
+ background-color: #CCE8EB;
+ width: 100px;
+}
+
+#ygxq table tr:nth-child(odd) {
+ background: #fff;
+}
+
+#ygxq table tr:nth-child(even) {
+ background: #F5FAFA;
+}
+
+.tdTitle {
+ font-size: 14px;
+ font-weight: 700;
+ text-align: left;
+}
+
+.link_button {
+ color: #169BD5;
+}
+
+.del_button {
+ color: #D9001B;
+}
+
+.search-btn {
+ display: inline-block;
+ width: 3.64vw;
+ height: 3.2vh;
+ line-height: 3.2vh;
+ text-align: center;
+ background-color: #a00515;
+ color: #fff;
+ margin-left: 1vw;
+ box-sizing: border-box;
+ cursor: pointer;
+ vertical-align: middle;
+}
+
+.sup-search-btn {
+ display: inline-block;
+ width: 5.2vw;
+ height: 3.2vh;
+ line-height: 3.2vh;
+ text-align: center;
+ margin-left: 1vw;
+ color: #a00515;
+ border: 1px solid #a00515;
+ box-sizing: border-box;
+ cursor: pointer;
+ vertical-align: middle;
+}
+
+// 头像包装器
+.avatar-wrapper {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-bottom: 10px;
+
+ .avatar {
+ width: 150px;
+ height: 150px;
+ border-radius: 4px;
+ cursor: pointer;
+ object-fit: cover;
+ border: 1px dashed #d9d9d9;
+
+ &:hover {
+ border-color: #409eff;
+ }
+ }
+
+ .avatar-uploader-placeholder {
+ width: 150px;
+ height: 150px;
+ border: 1px dashed #d9d9d9;
+ border-radius: 4px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ background-color: #fafafa;
+
+ &:hover {
+ border-color: #409eff;
+ background-color: #f0f9ff;
+ }
+
+ .avatar-uploader-icon {
+ font-size: 28px;
+ color: #8c939d;
+ line-height: 1;
+ margin-bottom: 8px;
+ }
+
+ .upload-tip {
+ font-size: 12px;
+ color: #8c939d;
+ }
+ }
+}
+
+// 上传方式选择容器
+.upload-choice-container {
+ display: flex;
+ justify-content: space-around;
+ padding: 20px 0;
+
+ .upload-choice-item {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 120px;
+ height: 120px;
+ border: 2px dashed #d9d9d9;
+ border-radius: 8px;
+ cursor: pointer;
+ transition: all 0.3s;
+
+ &:hover {
+ border-color: #409eff;
+ background-color: #f5f7fa;
+ }
+
+ i {
+ font-size: 40px;
+ color: #409eff;
+ margin-bottom: 10px;
+ }
+
+ span {
+ font-size: 14px;
+ color: #606266;
+ }
+ }
+}
+
+// 摄像头容器
+.camera-container {
+ text-align: center;
+
+ .camera-video {
+ width: 100%;
+ max-width: 600px;
+ height: auto;
+ border-radius: 4px;
+ background: #000;
+ }
+
+ .captured-image {
+ width: 100%;
+ max-width: 600px;
+ height: auto;
+ border-radius: 4px;
+ }
+}
diff --git a/src/views/user/components/AdvancedQuery.vue b/src/views/user/components/AdvancedQuery.vue
new file mode 100644
index 0000000..b33c555
--- /dev/null
+++ b/src/views/user/components/AdvancedQuery.vue
@@ -0,0 +1,213 @@
+<template>
+ <div>
+ <el-row>
+ <el-col :span="3">员工编号：
+ <el-input v-model="localParams.empNumb" size="small" maxlength="20" style="width:85px" />
+ </el-col>
+ <el-col :span="3">姓名：
+ <el-input v-model="localParams.empName" size="small" maxlength="10" style="width:110px" />
+ </el-col>
+ <el-col :span="4">身份证号：
+ <el-input v-model="localParams.certificateNumb" size="small" maxlength="18" style="width:140px" />
+ </el-col>
+ <el-col :span="4">部门（护卫点）：
+ <el-input v-model="localParams.deptName" size="small" maxlength="20" style="width:100px" />
+ </el-col>
+ <el-col :span="7">入职日期：
+ <el-date-picker
+ v-model="localParams.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="handleSearch">查询</el-button>
+ <el-button size="mini" class="hr-but" type="danger" @click="handleReset">重置</el-button>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-col :span="24">
+ <table class="searchTable">
+ <tr v-for="field in dictFilterFields" :key="field.paramKey">
+ <td class="td">{{ field.label }}：</td>
+ <td class="td-group">
+ <el-checkbox-group v-model="localParams[field.paramKey]" class="fj-checkbox">
+ <el-checkbox label="" @change="(val) => handleSelectAll(field, val)">全部</el-checkbox>
+ <el-checkbox
+ v-for="data in getDictOptions(field.dictType)"
+ :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="localParams.entryType" class="fj-checkbox">
+ <el-checkbox label="" @change="handleSelectAllEntryType">全部</el-checkbox>
+ <el-checkbox
+ v-for="item in entryTypeOptions"
+ :key="item.dicItemCode"
+ :label="item.dicItemCode"
+ >
+ {{ item.dicItemName }}
+ </el-checkbox>
+ </el-checkbox-group>
+ </td>
+ </tr>
+ </table>
+ </el-col>
+ </el-row>
+ </div>
+</template>
+
+<script>
+import dictMixin from '@/utils/dictMixin'
+
+export default {
+ name: 'AdvancedQuery',
+ mixins: [dictMixin],
+ props: {
+ queryParams: {
+ type: Object,
+ required: true
+ }
+ },
+ data() {
+ return {
+ // 字典筛选配置
+ dictFilterFields: [
+ { label: '性别', paramKey: 'sex', dictType: 'sex' },
+ { label: '学历', paramKey: 'education', dictType: 'EDUCATION' },
+ { label: '政治面貌', paramKey: 'politics', dictType: 'PLITICAL' },
+ { label: '年龄', paramKey: 'ageStr', dictType: 'ageStr' },
+ { label: '档案情况', paramKey: 'archivesStatus', dictType: 'archivesStatus' },
+ { label: '社保档位', paramKey: 'insuranceType', dictType: 'INSURANCETYPE' },
+ { label: '工作证', paramKey: 'empCardStatus', dictType: 'empCardStatus' },
+ { label: '员工手册', paramKey: 'handbookStatus', dictType: 'handbookStatus' },
+ { label: '员工类型', paramKey: 'empType', dictType: 'EMPTYPE' },
+ { label: '相关证件', paramKey: 'certificateList', dictType: 'certificateList' }
+ ],
+ // 入职类型特殊选项（硬编码）
+ entryTypeOptions: [
+ { dicItemCode: 20, dicItemName: '新入职' },
+ { dicItemCode: 21, dicItemName: '重新入职' },
+ { dicItemCode: 22, dicItemName: '返聘入职' }
+ ],
+ // 本地查询参数（从 props 复制，避免直接修改）
+ localParams: {},
+ // 防止 watch 循环更新标志
+ isUpdating: false
+ }
+ },
+ watch: {
+ queryParams: {
+ handler(val) {
+ if (!this.isUpdating) {
+ this.localParams = { ...val }
+ }
+ },
+ immediate: true,
+ deep: true
+ },
+ localParams: {
+ handler(val) {
+ this.isUpdating = true
+ this.$emit('update:queryParams', val)
+ this.$nextTick(() => {
+ this.isUpdating = false
+ })
+ },
+ deep: true
+ }
+ },
+ mounted() {
+ this.initDictTypes([
+ 'sex', 'EDUCATION', 'PLITICAL', 'ageStr', 'archivesStatus',
+ 'INSURANCETYPE', 'empCardStatus', 'handbookStatus', 'EMPTYPE', 'certificateList'
+ ])
+ },
+ methods: {
+ // 通用全选/取消全选
+ handleSelectAll(field, val) {
+ if (val) {
+ const options = this.getDictOptions(field.dictType)
+ this.$set(this.localParams, field.paramKey, options.map(item => item.dicItemCode))
+ } else {
+ this.$set(this.localParams, field.paramKey, [])
+ }
+ },
+ // 入职类型全选/取消全选
+ handleSelectAllEntryType(val) {
+ if (val) {
+ this.$set(this.localParams, 'entryType', [20, 21, 22])
+ } else {
+ this.$set(this.localParams, 'entryType', [])
+ }
+ },
+ // 查询
+ handleSearch() {
+ this.$emit('search')
+ },
+ // 重置
+ handleReset() {
+ this.localParams = {
+ empNumb: '',
+ vague: '',
+ sex: [],
+ education: [],
+ politics: [],
+ ageStr: [],
+ archivesStatus: [],
+ insuranceType: [],
+ empStatus: [],
+ empCardStatus: [],
+ handbookStatus: [],
+ baseKey: '',
+ empType: [],
+ entryType: [],
+ certificateList: []
+ }
+ this.$emit('reset')
+ }
+ }
+}
+</script>
+
+<style lang="scss" scoped>
+.searchTable {
+ margin-top: 10px;
+ border-collapse: collapse;
+ width: 100%;
+
+ tr {
+ border-bottom: 1px dashed #d9dadb;
+ }
+
+ .td {
+ width: 90px;
+ text-align: right;
+ }
+
+ .td-group {
+ padding-left: 20px;
+ }
+}
+
+.searchTable td,
+.searchTable th {
+ color: #000;
+ height: 50px;
+ background-color: #fff;
+}
+</style>
diff --git a/src/views/user/components/JobChangeDialog.vue b/src/views/user/components/JobChangeDialog.vue
new file mode 100644
index 0000000..060023c
--- /dev/null
+++ b/src/views/user/components/JobChangeDialog.vue
@@ -0,0 +1,285 @@
+<template>
+ <el-dialog
+ title="员工调岗"
+ :visible.sync="dialogVisible"
+ width="50%"
+ @close="handleClose"
+ >
+ <el-form
+ ref="ygdgForm"
+ :model="formData"
+ :rules="rules"
+ label-position="right"
+ label-width="120px"
+ >
+ <el-row>
+ <el-col span="24">
+ <el-form-item label="调岗人员">
+ <input v-model="formData.empIds" type="hidden">
+ <el-input
+ v-model="formData.empNames"
+ type="textarea"
+ :rows="2"
+ readonly
+ />
+ </el-form-item>
+ <el-form-item label="现部门(护卫点)" prop="deptId">
+ <treeselect
+ v-model="formData.deptId"
+ :multiple="false"
+ :options="depts"
+ :clear-value-text="$t('common.clear')"
+ placeholder="请选择部门(护卫点)"
+ style="width:100%"
+ @select="handleDeptSelect"
+ />
+ </el-form-item>
+ <el-form-item label="现岗位" prop="jobId">
+ <el-select
+ v-model="formData.jobId"
+ placeholder="请选择岗位"
+ filterable
+ clearable
+ style="width: 100%"
+ @change="handleJobSelect"
+ >
+ <el-option
+ v-for="item in jobOptions"
+ :key="item.code"
+ :label="item.value"
+ :value="item.code"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="调岗类型" prop="changeType">
+ <el-select
+ v-model="formData.changeType"
+ placeholder="请选择调岗类型"
+ style="width: 100%"
+ >
+ <el-option
+ v-for="dict in changeTypeOptions"
+ :key="dict.dicItemCode"
+ :label="dict.dicItemName"
+ :value="dict.dicItemCode"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="调岗日期" prop="changeDate">
+ <el-date-picker
+ v-model="formData.changeDate"
+ type="date"
+ value-format="yyyy-MM-dd"
+ placeholder="选择日期"
+ style="width: 100%"
+ />
+ </el-form-item>
+ <el-form-item label="理由描述" prop="changeReason">
+ <el-input
+ v-model="formData.changeReason"
+ type="textarea"
+ :rows="3"
+ />
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ <div slot="footer" class="dialog-footer">
+ <el-button @click="handleCancel">取 消</el-button>
+ <el-button type="primary" @click="handleConfirm">确 定</el-button>
+ </div>
+ </el-dialog>
+</template>
+
+<script>
+import Treeselect from '@riophae/vue-treeselect'
+import '@riophae/vue-treeselect/dist/vue-treeselect.css'
+import { getDicJob } from '@/api/position'
+
+export default {
+ name: 'JobChangeDialog',
+ components: {
+ Treeselect
+ },
+ props: {
+ visible: {
+ type: Boolean,
+ default: false
+ },
+ employees: {
+ type: Array,
+ default: () => []
+ },
+ depts: {
+ type: Array,
+ default: () => []
+ },
+ changeTypeOptions: {
+ type: Array,
+ default: () => []
+ }
+ },
+ data() {
+ return {
+ formData: {
+ empIds: '',
+ empNames: '',
+ oldDeptNames: '',
+ oldJobNames: '',
+ changeType: '',
+ changeDate: '',
+ changeReason: '',
+ jobId: '',
+ newJobName: '',
+ deptId: '',
+ newDeptName: '',
+ allDeptName: ''
+ },
+ rules: {
+ changeType: [
+ { required: true, message: '请选择调岗类型', trigger: 'change' }
+ ],
+ changeDate: [
+ { required: true, message: '请选择调岗日期', trigger: 'change' }
+ ],
+ jobId: [
+ { required: true, message: '请选择现岗位', trigger: 'change' }
+ ],
+ deptId: [
+ { required: true, message: '请选择现部门', trigger: 'change' }
+ ],
+ changeReason: [
+ { max: 500, message: '长度不超过500个字符', trigger: 'blur' }
+ ]
+ },
+ jobOptions: []
+ }
+ },
+ computed: {
+ dialogVisible: {
+ get() {
+ return this.visible
+ },
+ set(val) {
+ this.$emit('update:visible', val)
+ }
+ }
+ },
+ watch: {
+ employees: {
+ handler(val) {
+ if (val && val.length > 0) {
+ this.initFormData(val)
+ }
+ },
+ immediate: false
+ }
+ },
+ mounted() {
+ this.loadJobOptions()
+ },
+ methods: {
+ // 加载岗位选项
+ loadJobOptions() {
+ getDicJob().then((r) => {
+ this.jobOptions = r.data || []
+ }).catch((error) => {
+ console.error('获取岗位列表失败:', error)
+ this.$message.error('获取岗位列表失败')
+ })
+ },
+
+ // 初始化表单数据
+ initFormData(employees) {
+ const ids = []
+ const names = []
+ const deptNames = []
+ const jobNames = []
+
+ employees.forEach(emp => {
+ ids.push(emp.empId)
+ names.push(emp.empName)
+ deptNames.push(emp.allDeptName)
+ jobNames.push(emp.jobName)
+ })
+
+ // 默认调岗日期为当天
+ const now = new Date()
+ const year = now.getFullYear()
+ const month = String(now.getMonth() + 1).padStart(2, '0')
+ const day = String(now.getDate()).padStart(2, '0')
+ const today = year + '-' + month + '-' + day
+
+ // 默认部门为根部门
+ const rootDept = this.depts && this.depts.length > 0 ? this.depts[0] : null
+ const defaultDeptId = rootDept ? rootDept.deptId : ''
+ const defaultDeptName = rootDept ? rootDept.label : ''
+ const defaultAllDeptName = rootDept ? rootDept.allDeptName : ''
+
+ this.formData = {
+ empIds: ids.join(','),
+ empNames: names.join(','),
+ oldDeptNames: deptNames.join(','),
+ oldJobNames: jobNames.join(','),
+ changeType: '',
+ changeDate: today,
+ changeReason: '',
+ jobId: '',
+ newJobName: '',
+ deptId: defaultDeptId,
+ newDeptName: defaultDeptName,
+ allDeptName: defaultAllDeptName
+ }
+ },
+
+ // 部门选择
+ handleDeptSelect(node) {
+ this.formData.deptId = node.deptId
+ this.formData.newDeptName = node.label
+ this.formData.allDeptName = node.allDeptName
+ },
+
+ // 岗位选择
+ handleJobSelect(val) {
+ const selected = this.jobOptions.find(item => item.code === val)
+ if (selected) {
+ this.formData.newJobName = selected.value
+ this.formData.jobId = selected.code
+ }
+ },
+
+ // 确认提交
+ handleConfirm() {
+ this.$refs.ygdgForm.validate((valid) => {
+ if (valid) {
+ this.$post('hr/empBaseInfo/jobChange', { ...this.formData }).then(() => {
+ this.$message({
+ message: '员工调岗成功',
+ type: 'success'
+ })
+ this.dialogVisible = false
+ this.$emit('success')
+ })
+ }
+ })
+ },
+
+ // 取消
+ handleCancel() {
+ this.dialogVisible = false
+ this.$emit('close')
+ },
+
+ // 关闭对话框
+ handleClose() {
+ if (this.$refs.ygdgForm) {
+ this.$refs.ygdgForm.resetFields()
+ }
+ this.$emit('close')
+ }
+ }
+}
+</script>
+
+<style scoped>
+</style>
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