修改所属部门模糊查询

.eslintrc.js

@@ -5,7 +5,7 @@ module.exports = {
   },
   extends: [
     'plugin:vue/essential',
-    '@vue/standard'
+    // '@vue/standard'
   ],
   parserOptions: {
     parser: 'babel-eslint'

src/views/Admin/receiveAdmin.vue

@@ -8,8 +8,12 @@
         </van-col>
         <van-col span="16" class="menu-dropdown">
           <van-dropdown-menu>
+
             <van-dropdown-item :title="departTitle" v-model="params.departId" :options="departOptions"
-                               @change="changeDepart"/>
+                               @change="changeDepart" @open="openMenu" @close	="closeMenu" style="top:30px"/>
+                <van-cell-group v-if="inputStatus" class="seachInput">
+                 <van-field v-model="search" label="部门查询" placeholder="请输入部门名称"  @input="searchInputChange"/>
+             </van-cell-group>
             <van-dropdown-item :title="timeTitle" ref="myPicker">
               <van-datetime-picker
                 v-model="currentDate"
@@ -18,6 +22,7 @@
                 @confirm="confirmDate"
               />
             </van-dropdown-item>
+
           </van-dropdown-menu>
         </van-col>
       </van-row>
@@ -77,10 +82,12 @@ export default {
         pageNum: 1,
         pageSize: 10,
         departId: null,
-        queryTime: null
+        queryTime: null,
       },
       departTitle: '所属部门',
-      timeTitle: '领用时间'
+      timeTitle: '领用时间',
+      inputStatus:false,
+      search:''
     }
   },
   mounted () {
@@ -151,6 +158,37 @@ export default {
       this.params.pageNum = 1
       this.getList()
     },
+    // 打开菜单
+    openMenu () {
+       this.inputStatus=true
+       console.log(this.inputStatus)
+    },
+    // 关闭菜单
+    closeMenu () {
+      this.inputStatus=false
+      console.log(this.inputStatus)
+      this.search=''
+      getDepartList().then(res => {
+        res.data.list.forEach(item => {
+          item.text = item.name
+          item.value = item.id
+        })
+        this.departOptions = res.data.list
+        console.log('this.departOptions', this.departOptions, res.data.list)
+      })
+
+    },
+    searchInputChange(){
+
+        getDepartList({name:this.search}).then(res => {
+        res.data.list.forEach(item => {
+          item.text = item.name
+          item.value = item.id
+        })
+        this.departOptions = res.data.list
+        console.log('this.departOptions', this.departOptions, res.data.list)
+      })
+    },
     // 日期
     confirmDate (data) {
       const d = new Date(data)
@@ -233,4 +271,13 @@ export default {
   .width_100 {
     width: 100%;
   }
+  .seachInput{
+    width: 100%;
+    z-index: 9999;
+    position: fixed;
+    left: 0;
+    width: 100%;
+    top: 80%;
+    box-shadow: 0 -2px 3px -1px #cccccc;
+  }
 </style>