添加出车分公公司查询

src/views/vehicle/vehicleDepartureLog/index.vue

@@ -30,20 +30,14 @@
         </el-row>
         <el-row>
           <el-col :span="5">
-            <el-form-item label="所属大区">
-              <el-select class="filter-item" v-model="listQuery.zoneId" placeholder="请选择" @change="getProvinceRegions">
-                <el-option :key="undefined" label="无" :value="undefined"></el-option>
-                <el-option v-for="val in getAllZoneList" :key="val.id" :label="val.name" :value="val.id"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="5">
-            <el-form-item label="出车分公司">
-              <el-select class="filter-item" v-model="listQuery.departureId" placeholder="请选择"
-                         @change="getAllBranchCompanyChange">
-                <el-option :key="undefined" label="无" :value="undefined"></el-option>
-                <el-option v-for="val in allBranchCompany" :key="val.id" :label="val.name" :value="val.id"></el-option>
-              </el-select>
+            <el-form-item label="分公司" prop="departureId">
+              <el-autocomplete
+                class="inline-input"
+                v-model="state1"
+                :fetch-suggestions="querySearch"
+                placeholder="请输入内容"
+                @select="handleSelect"
+              ></el-autocomplete>
             </el-form-item>
           </el-col>
           <el-col :span="5">
@@ -244,6 +238,8 @@
                     mileageStart: null,
                     mileageEnd: null,
                     state: null,
+                    allCompaniesArr:[],
+                    selectArry: [],
                 },
                 rules: {
                     name: [
@@ -262,11 +258,11 @@
                     zoneId:null
                 },
                 allZoneArr:[],//全部片区
+                state1:'',
                 listQuery: {
                     page: 1,
                     limit: 20,
                     time: "",
-                    zoneId:undefined,
                     numberPlate: undefined,
                     departureId:undefined,
                 },
@@ -291,6 +287,10 @@
                 this.listQuery.numberPlate = numberPlate;
             }
             this.handleFilter();
+            getAll()
+                .then(response => {
+                    this.allCompaniesArr = response.data;
+                })
         },
         computed: {
             ...mapGetters([
@@ -332,6 +332,9 @@
                 if (this.listQuery.time) {
                     this.listQuery.time = this.dateToString(this.listQuery.time);
                 }
+                if (!this.state1) {
+                    this.listQuery.departureId = undefined;
+                }
                 page(this.listQuery)
                     .then(response => {
                         this.list = response.data.list;
@@ -339,6 +342,34 @@
                         this.listLoading = false;
                     })
             },
+            querySearch(queryString, cb) {
+                let selectArry = [];
+                let iitem = {
+                    value: "全部",
+                    name: "全部"
+                };
+                selectArry.push(iitem);
+                this.allCompaniesArr.map(function (item) {
+                    item.value = item.name;
+                    selectArry.push(item);
+                });
+                this.selectArry = selectArry;
+                var results = queryString ? selectArry.filter(this.createFilter(queryString)) : selectArry;
+                // 调用 callback 返回建议列表的数据
+                cb(results);
+            },
+            createFilter(queryString) {
+                return (restaurant) => {
+                    return (restaurant.name.indexOf(queryString.toLowerCase()) != -1);
+                };
+            },
+            handleSelect(item) {
+                if (item.value == "全部") {
+                    this.listQuery.departureId = undefined;
+                } else {
+                    this.listQuery.departureId = item.id;
+                }
+            },
             handleSizeChange(val) {
                 this.listQuery.limit = val;
                 this.getList();
@@ -347,19 +378,6 @@
                 this.listQuery.page = val;
                 this.getList();
             },
-            //监听change事件
-            getProvinceRegions(item) {
-                this.listQuery.zoneId = item
-                this.baranchQuery.zoneId = item
-                this.listQuery.departureId = undefined;
-                getAllBranchCompanyByZoneId(this.baranchQuery)
-                    .then(response => {
-                        this.allBranchCompany = response.data;
-                    })
-            },
-            getAllBranchCompanyChange(item) {
-                this.listQuery.departureId = item
-            },
         }
     }
 </script>