<template>
|
<div>
|
<el-container>
|
<el-header :height="headerHeight">
|
<el-row>
|
<el-col :span="16">
|
<h3 class="bu-tian-jia-title">员工智搜</h3>
|
</el-col>
|
<el-col :span="8">
|
<el-input v-model="input" placeholder="请输入内容" style="width:200px" />
|
<el-button type="primary">查询</el-button>
|
<el-button type="danger" @click.native="advancedQueryShowMethods">高级查询</el-button>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="7">
|
<h3 class="bu-tian-jia-title">已为您搜索出 6 条符合条件的记录</h3>
|
</el-col>
|
<el-col :span="8">
|
<!-- <el-button type="danger">导出EXCEL</el-button> -->
|
</el-col>
|
</el-row>
|
<div v-show="advancedQueryShow">
|
<form>
|
<el-row>
|
<el-col :span="3">员工编号：
|
<el-input v-model="input" placeholder="请输入内容" style="width:80px" />
|
</el-col>
|
<el-col :span="3">姓名：
|
<el-input v-model="input" placeholder="请输入内容" style="width:80px" />
|
</el-col>
|
<el-col :span="3">身份证号：
|
<el-input v-model="input" placeholder="请输入内容" style="width:80px" />
|
</el-col>
|
<el-col :span="3">所属部门：
|
<el-input v-model="input" placeholder="请输入内容" style="width:80px" />
|
</el-col>
|
<el-col :span="3">岗位：
|
<el-input v-model="input" placeholder="请输入内容" style="width:80px" />
|
</el-col>
|
<el-col :span="3">保安证号：
|
<el-input v-model="input" placeholder="请输入内容" style="width:80px" />
|
</el-col>
|
<el-col :span="6">
|
<el-button type="primary">查询</el-button>
|
<el-button type="danger">重置</el-button>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="24">
|
<table id="searchTable">
|
<tr>
|
<td>搜索项：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">基本信息</el-radio>
|
<el-radio :label="6">工作信息</el-radio>
|
<el-radio :label="9">工作经历</el-radio>
|
<el-radio :label="9">体检信息</el-radio>
|
<el-radio :label="9">合同信息</el-radio>
|
<el-radio :label="9">考勤情况</el-radio>
|
<el-radio :label="9">员工请假</el-radio>
|
<el-radio :label="9">员工调岗</el-radio>
|
<el-radio :label="9">备注信息</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>性别：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">男性</el-radio>
|
<el-radio :label="9">女性</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>最高学历：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">初中</el-radio>
|
<el-radio :label="9">高中</el-radio>
|
<el-radio :label="9">大专</el-radio>
|
<el-radio :label="9">本科</el-radio>
|
<el-radio :label="9">硕士</el-radio>
|
<el-radio :label="9">博士</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>政治面貌：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">党员</el-radio>
|
<el-radio :label="9">团员</el-radio>
|
<el-radio :label="9">群众</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>入职日期：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>身高：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">150-159</el-radio>
|
<el-radio :label="9">160-169</el-radio>
|
<el-radio :label="9">170-179</el-radio>
|
<el-radio :label="9">180-189</el-radio>
|
<el-radio :label="9">190-199</el-radio>
|
<el-radio :label="9">200及以上</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>年龄：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">18-29</el-radio>
|
<el-radio :label="9">30-39</el-radio>
|
<el-radio :label="9">40-49</el-radio>
|
<el-radio :label="9">50-59</el-radio>
|
<el-radio :label="9">60-69</el-radio>
|
<el-radio :label="9">69及以上</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>档案情况：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">已移交</el-radio>
|
<el-radio :label="9">未移交</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
<tr>
|
<td>员工状态：</td>
|
<td>
|
<el-radio-group v-model="radio">
|
<el-radio :label="3">全部</el-radio>
|
<el-radio :label="6">在职</el-radio>
|
<el-radio :label="6">正常离职</el-radio>
|
<el-radio :label="6">自动离职</el-radio>
|
<el-radio :label="6">公司辞退</el-radio>
|
</el-radio-group>
|
</td>
|
</tr>
|
</table>
|
</el-col>
|
</el-row>
|
</form>
|
</div>
|
</el-header>
|
<el-container>
|
<el-aside width="400px">
|
<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" />
|
</el-aside>
|
<el-main>
|
<el-table :data="tableData" style="width: 100%">
|
<el-table-column prop="prop0" label="序号" width="180" />
|
<el-table-column prop="prop1" label="员工编号" width="180" />
|
<el-table-column prop="prop2" label="姓名" width="180" />
|
<el-table-column prop="prop3" label="性别" width="180" />
|
<el-table-column prop="prop4" label="身份证号码" width="180" />
|
<el-table-column prop="prop5" label="有效期" width="180" />
|
<el-table-column prop="prop6" label="民族" width="180" />
|
<el-table-column prop="prop7" label="身高" width="180" />
|
<el-table-column prop="prop8" label="年龄" width="180" />
|
<el-table-column prop="prop9" label="政治面貌" width="180" />
|
<el-table-column prop="prop10" label="最高学历" width="180" />
|
<el-table-column prop="prop11" label="籍贯" width="180" />
|
<el-table-column prop="prop12" label="保安员证号" width="180" />
|
<el-table-column prop="prop13" label="保安员回执" width="180" />
|
<el-table-column prop="prop14" label="档案情况" width="180" />
|
<el-table-column prop="prop15" label="员工状态" width="180" />
|
<el-table-column prop="prop16" label="电话号码" width="180" />
|
</el-table>
|
</el-main>
|
</el-container>
|
</el-container>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
headerHeight: '70px',
|
advancedQueryShow: false,
|
dialogTableVisible: false,
|
tableData: [{
|
'prop0': '1',
|
'prop1': '2100452312',
|
'prop2': '赵建国',
|
'prop3': '男',
|
'prop4': '510304197402225813',
|
'prop5': '10',
|
'prop6': '汉族',
|
'prop7': '170',
|
'prop8': '46',
|
'prop9': '党员',
|
'prop10': '大专',
|
'prop11': '广东省番禺市',
|
'prop12': '',
|
'prop13': '',
|
'prop14': '已移交',
|
'prop15': '在职',
|
'prop16': '133023187889'
|
}, {
|
'prop0': '2',
|
'prop1': '2101620946',
|
'prop2': '罗启艳',
|
'prop3': '女',
|
'prop4': '41272619740120543X',
|
'prop5': '10',
|
'prop6': '汉族',
|
'prop7': '175',
|
'prop8': '46',
|
'prop9': '团员',
|
'prop10': '高中',
|
'prop11': '广东省番禺市',
|
'prop12': '',
|
'prop13': '',
|
'prop14': '已移交',
|
'prop15': '在职',
|
'prop16': '189135789889'
|
}, {
|
'prop0': '3',
|
'prop1': '2100629950',
|
'prop2': '毛玉平',
|
'prop3': '男',
|
'prop4': '522528198202071629',
|
'prop5': '10',
|
'prop6': '汉族',
|
'prop7': '170',
|
'prop8': '39',
|
'prop9': '非党员',
|
'prop10': '高中',
|
'prop11': '广东省番禺市',
|
'prop12': '',
|
'prop13': '',
|
'prop14': '已移交',
|
'prop15': '在职',
|
'prop16': '135098784561'
|
}, {
|
'prop0': '4',
|
'prop1': '2100882835',
|
'prop2': '梅均均',
|
'prop3': '女',
|
'prop4': '510504198704260927',
|
'prop5': '10',
|
'prop6': '汉族',
|
'prop7': '175',
|
'prop8': '34',
|
'prop9': '党员',
|
'prop10': '高中',
|
'prop11': '广东省番禺市',
|
'prop12': '',
|
'prop13': '',
|
'prop14': '未移交',
|
'prop15': '在职',
|
'prop16': '133023187889'
|
}, {
|
'prop0': '5',
|
'prop1': '2101356718',
|
'prop2': '王香妮',
|
'prop3': '女',
|
'prop4': '433122199508091511',
|
'prop5': '10',
|
'prop6': '汉族',
|
'prop7': '175',
|
'prop8': '26',
|
'prop9': '团员',
|
'prop10': '高中',
|
'prop11': '广东省番禺市',
|
'prop12': '',
|
'prop13': '',
|
'prop14': '未移交',
|
'prop15': '在职',
|
'prop16': '189135789889'
|
}, {
|
'prop0': '6',
|
'prop1': '2100900981',
|
'prop2': '易金洪',
|
'prop3': '男',
|
'prop4': '610424198306152860',
|
'prop5': '10',
|
'prop6': '苗族',
|
'prop7': '169',
|
'prop8': '38',
|
'prop9': '非党员',
|
'prop10': '',
|
'prop11': '广东省番禺市',
|
'prop12': '',
|
'prop13': '',
|
'prop14': '已移交',
|
'prop15': '正常离职',
|
'prop16': '135098784561'
|
}],
|
data: [{
|
label: '一级 1',
|
children: [{
|
label: '二级 1-1',
|
children: [{
|
label: '三级 1-1-1'
|
}]
|
}]
|
},
|
{
|
label: '一级 2',
|
children: [{
|
label: '二级 2-1',
|
children: [{
|
label: '三级 2-1-1'
|
}]
|
},
|
{
|
label: '二级 2-2',
|
children: [{
|
label: '三级 2-2-1'
|
}]
|
}
|
]
|
},
|
{
|
label: '一级 3',
|
children: [{
|
label: '二级 3-1',
|
children: [{
|
label: '三级 3-1-1'
|
}]
|
},
|
{
|
label: '二级 3-2',
|
children: [{
|
label: '三级 3-2-1'
|
}]
|
}
|
]
|
}
|
],
|
defaultProps: {
|
children: 'children',
|
label: 'label'
|
}
|
}
|
},
|
methods: {
|
handleNodeClick(data) {
|
console.log(data)
|
},
|
advancedQueryShowMethods() {
|
if (this.advancedQueryShow) {
|
this.headerHeight = '70px'
|
this.advancedQueryShow = false
|
} else {
|
this.headerHeight = '410px'
|
this.advancedQueryShow = true
|
}
|
},
|
showEmpInfo() {
|
this.dialogTableVisible = true
|
}
|
}
|
}
|
</script>
|
<style lang="scss">
|
.el-aside {
|
padding: 20px;
|
background: #f3f5f8;
|
height: 600px;
|
|
.el-tree {
|
height: 100%;
|
}
|
}
|
|
.el-main {
|
height: 600px;
|
}
|
|
#searchTable {
|
margin-top: 10px;
|
border-collapse: collapse;
|
width: 100%;
|
}
|
|
#searchTable td,
|
#searchTable th {
|
border: 1px solid #cad9ea;
|
color: #666;
|
height: 30px;
|
}
|
|
#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;
|
}
|
</style>
|
