修改bug

yz

2021-03-05 eb897b781bfc18df4f87a8c78babd3834b2d269f

 src/views/user/selectuser.vue

@@ -1,232 +1,95 @@
<template>
  <div id="mainDiv">
    <el-container>
      <el-header :height="headerHeight">
    <el-header :height="headerHeight">
      <el-form>
        <el-row>
          <el-col :span="16">
            <h3 class="bu-tian-jia-title" />
          <el-col :span="10">
            <el-form-item label="关键字">
              <el-input v-model="queryParams.empNumb" placeholder="请输入内容" style="width:200px" />
            </el-form-item>
          </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 :span="10">
            <el-form-item label="员工状态">
              <el-checkbox-group v-model="queryParams.empStatus">
                <el-checkbox :label="0">在职</el-checkbox>
                <el-checkbox :label="1">离职</el-checkbox>
                <el-checkbox :label="2">退休</el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-button size="mini" class="hr-but-all" type="primary" @click="vagueSearch">查询</el-button>
            <el-button size="mini" class="hr-but" type="danger" @click="resetSearch">重置</el-button>
          </el-col>
        </el-row>
        <el-row>
          <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
            ref="tree"
            :data="deptTree"
            :check-strictly="true"
            show-checkbox
            accordion
            node-key="id"
            highlight-current
            default-expand-all
            :filter-node-method="filterNode"
            @node-click="nodeClick"
          />
        </el-aside>
        <el-main>
          <el-table
            ref="multipleTable"
            :data="list"
            style="width: 100%;height: 80%;"
            row-key="prop1"
            @selection-change="handleSelectionChange"
          >
            <el-table-column type="selection" :reserve-selection="true" width="55" />
            <el-table-column v-if="show" prop="empId" label="员工Id" width="100" />
            <el-table-column prop="empNumb" label="员工编号" width="100" />
            <el-table-column prop="empName" label="姓名" width="100" />
            <el-table-column prop="certificateNumb" label="身份证号码" width="180" />
            <el-table-column v-if="show" prop="deptId" label="部门Id" width="100" />
            <el-table-column prop="deptName" label="护卫点" width="100" />
            <el-table-column v-if="show" prop="jobId" label="岗位Id" width="100" />
            <el-table-column prop="jobName" label="岗位" width="100" />
            <el-table-column prop="empTypeName" label="员工类别" width="100" />
            <el-table-column prop="sexName" label="性别" width="50" />
          </el-table>
          <!--
      </el-form>
    </el-header>
    <el-main>
      <el-table
        ref="multipleTable"
        :data="list"
        row-key="prop1"
        width="80%"
        @selection-change="handleSelectionChange"
        @row-dblclick="rowDblclick"
      >
        <el-table-column type="selection" :reserve-selection="false" width="50" />
        <el-table-column v-if="show" prop="empId" label="员工Id" />
        <el-table-column prop="empNumb" label="员工编号" />
        <el-table-column prop="empName" label="姓名" />
        <el-table-column prop="certificateNumb" label="身份证号码" width="180" />
        <el-table-column v-if="show" prop="deptId" label="部门Id" />
        <el-table-column prop="deptName" label="护卫点" width="180" />
        <el-table-column v-if="show" prop="jobId" label="岗位Id" />
        <el-table-column prop="jobName" label="岗位" />
        <el-table-column prop="empTypeName" label="员工类别" />
        <el-table-column prop="sexName" label="性别" width="50" />
      </el-table>
      <!--
          page.sync 当前页
          limit.sync 每页显示数量 只能是5，10，20，30，50
          pagination 翻页的事件
           -->
          <pagination v-show="total>0" :total="total" :page.sync="pagination.num" :limit.sync="pagination.size" @pagination="search" />
          <el-button type="primary" @click="sureChoose">确定</el-button>
          <el-button type="danger" @click="cancleChoose">取消</el-button>
        </el-main>
      </el-container>
    </el-container>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="pagination.num"
        :limit.sync="pagination.size"
        @pagination="search"
      />
      <el-button type="primary" @click="sureChoose">确定</el-button>
      <el-button type="danger" @click="cancleChoose">取消</el-button>
    </el-main>
  </div>
</template>
<script>
// 引用翻页组件
import Pagination from '@/components/Pagination'
export default {
  components: { Pagination },
  components: {
    Pagination
  },
  props: {
    multipleselect: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      show: false,
      headerHeight: '70px',
      deptTree: [],
      advancedQueryShow: false,
      selection: [],
      multipleSelection: [],
      total: 0, // 总数量
      queryParams: {}, // 查询参数
      queryParams: {
        empNumb: '',
        empStatus: []
      }, // 查询参数
      sort: {}, // 排序
      pagination: { // 分页参数
        size: 5,
        size: 10,
        num: 1
      },
      list: [], // 给table显示的数据
@@ -237,32 +100,9 @@
    }
  },
  mounted() {
    this.initDeptTree()
    // 初始加载
    this.fetch()
    this.search()
  },
  methods: {
    initDept() {
      return {
        deptId: '',
        deptName: '',
        parentId: null,
        orderNum: 0
      }
    },
    transSex(sex) {
      switch (sex) {
        case '0':
          return this.$t('common.sex.male')
        case '1':
          return this.$t('common.sex.female')
        default:
          return this.$t('common.sex.secret')
      }
    },
    filterSex(value, row) {
      return row.sex === value
    },
    // 翻页方法
    search() {
      this.fetch({
@@ -270,10 +110,34 @@
        ...this.sort
      })
    },
    vagueSearch() {
      this.fetch({
        empNumb: this.queryParams.empNumb,
        empName: this.queryParams.empNumb,
        deptName: this.queryParams.empNumb,
        certificateNumb: this.queryParams.empNumb,
        nativePlaceName: this.queryParams.empNumb,
        censusAddress: this.queryParams.empNumb,
        empStatus: this.queryParams.empStatus
      })
    },
    resetSearch() {
      this.queryParams = {
        empNumb: '',
        empName: '',
        deptName: '',
        certificateNumb: '',
        nativePlaceName: '',
        censusAddress: '',
        empStatus: []
      }
      this.search()
    },
    fetch(params = {}) {
      var that = this
      params.pageSize = this.pagination.size
      params.pageNum = this.pagination.num
      params.delFlag = 0
      this.$get('hr/empBaseInfo/list', {
        ...params
      }).then((r) => {
@@ -282,114 +146,31 @@
        that.list = data.rows
      })
    },

    initDeptTree() {
      this.$get('system/dept').then((r) => {
        this.deptTree = r.data.data.rows
      })
    },
    filterNode(value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    nodeClick(data) {
      this.dept.parentId = data.parentId
      if (this.dept.parentId === '0') {
        this.dept.parentId = null
    handleSelectionChange(selection) {
      if (!this.multipleselect) {
        if (selection.length > 1) {
          this.$refs.multipleTable.clearSelection()
          this.$refs.multipleTable.toggleRowSelection(selection.pop())
        }
      }
      this.dept.orderNum = data.orderNum
      this.dept.deptName = data.label
      this.dept.deptId = data.id
    },
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    advancedQueryShowMethods() {
      if (this.advancedQueryShow) {
        this.headerHeight = '70px'
        this.advancedQueryShow = false
      } else {
        this.headerHeight = '410px'
        this.advancedQueryShow = true
      }
      this.multipleSelection = selection
    },
    sureChoose() {
      this.$emit('selectedUser', this.multipleSelection)
      this.$refs.multipleTable.clearSelection()
    },
    cancleChoose() {
      this.$emit('cancleChooseUser')
      this.$refs.multipleTable.clearSelection()
    },
    rowDblclick(row, column, event) {
      this.$refs.multipleTable.toggleRowSelection(row, true)
      this.sureChoose()
    }
  }
}
</script>
<style lang="scss" scoped>

  .el-main {
    height: 600px;
  }
</style>
<style lang="scss">
  .el-aside {
    padding: 20px;
    background: #f3f5f8;
    height: 600px;

    .el-tree {
      height: 100%;
    }
  }

  #mainDiv{
    height: 350px;
  }

  #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;
  }