<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>
|
