页面搜索修改

ruoyi-ui/src/views/pay/requireAttendanceReport/index.vue

@@ -37,21 +37,18 @@
             value-format="MM">
           </el-date-picker>
         </el-form-item>
-        <el-form-item label="员工姓名" prop="empName">
-          <el-input
-            v-model="queryParams.empName"
-            placeholder="请输入员工姓名"
-            clearable
-            @keyup.enter.native="handleQuery"
-          />
+        <el-form-item label="员工姓名" prop="employeeId">
+          <el-select v-model="queryParams.employeeId" filterable clearable placeholder="请选择员工姓名">
+            <el-option
+              v-for="item in employeeList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id">
+            </el-option>
+          </el-select>
         </el-form-item>
-        <el-form-item label="部门名称" prop="deptName">
-          <el-input
-            v-model="queryParams.deptName"
-            placeholder="请输入部门名称"
-            clearable
-            @keyup.enter.native="handleQuery"
-          />
+        <el-form-item label="部门名称" prop="deptId">
+          <treeselect v-model="queryParams.deptId" :options="deptOptions" :show-count="true" placeholder="请选择部门名称" style="width: 220px"/>
         </el-form-item>
         <el-form-item>
           <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -351,10 +348,14 @@ import { listRequireAttendanceReport, getRequireAttendanceReport, delRequireAtte
 import { listEmployeeInfo } from "@/api/pay/employeeInfo";
 import { getToken } from "@/utils/auth";
 import { listTenant } from "@/api/pay/tenant";
+import { deptTreeSelect } from "@/api/system/user";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
 export default {
   name: "RequireAttendanceReport",
   dicts: ['sys_user_sex', 'pay_del_status', 'pay_work_rest_type'],
+  components: { Treeselect },
   data() {
     return {
       // 公司信息
@@ -383,6 +384,10 @@ export default {
       title: "",
       // 是否显示弹出层
       open: false,
+      // 员工列表
+      employeeList: [],
+      // 部门树选项
+      deptOptions: undefined,
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -467,6 +472,8 @@ export default {
     }else {
       this.gsInfo.active_id = this.$store.state.user.tenantId
       this.getList();
+      this.getDeptTree();
+      this.getlistEmployee();
     }
   },
   methods: {
@@ -476,7 +483,9 @@ export default {
         if(response.rows.length>0){
           this.gsInfo.list = response.rows;
           this.gsInfo.active_id = this.gsInfo.list[0].id
-          this.getList()
+          this.getList();
+          this.getDeptTree();
+          this.getlistEmployee();
         }else{
           this.$alert(`没有查到相关公司，暂无数据！`, `提示`, {
             type: 'warning'
@@ -487,7 +496,21 @@ export default {
     // 选择公司
     changCompany(id){
       this.gsInfo.active_id = id
-      this.getList()
+      this.getList();
+      this.getDeptTree();
+      this.getlistEmployee();
+    },
+    /** 查询时员工 */
+    getlistEmployee() {
+      listEmployeeInfo({ pageSize: 1000000000, tenantId: this.gsInfo.active_id }).then(response => {
+        this.employeeList = response.rows
+      });
+    },
+    /** 查询部门下拉树结构 */
+    getDeptTree() {
+      deptTreeSelect({tenantId: this.gsInfo.active_id}).then(response => {
+        this.deptOptions = response.data;
+      });
     },
     /** 查询应出勤报列表 */
     getList() {