更新

src/views/oilFinalStatement/oilFinalStatementAddList.vue

@@ -27,20 +27,8 @@
           <!-- 搜索部分开始 -->
           <el-form label-width="90px" :inline="true" :model="page" :size="$store.getters.size">
             <el-col :span="18">
-              <el-form-item>
-                <el-select
-                  v-model="page.params.customerId"
-                  remote
-                  filterable
-                  :remote-method="companyOrginQuery"
-                  clearable
-                  placeholder="请输入企业名称"
-                  @keyup.enter.native="getByPage"
-                  ref="changeName"
-                >
-                  <el-option v-for="item in queryCompanyList" :key="item.id" :label="item.name" :value="item.id" />
-                </el-select>
-              </el-form-item>
+              <autocomplete class="mr20" :params="page.params" :config="configAutocomplete" />
+
               <el-form-item prop="createTimeRange">
                 <el-date-picker
                   v-model="page.params.createTimeRange"
@@ -219,13 +207,23 @@
 
 <script>
 import internalCompanyApi from '@/api/user/internalCompany'
+import autocomplete from 'components/autocomplete/index.vue'
 export default {
+  components: {
+    autocomplete
+  },
   data() {
     return {
+      configAutocomplete: {
+        serveTarget: internalCompanyApi.getLikeByCompanyType,
+        autocompleteKey: 'name',
+        labelKey: 'name',
+        valueKey: 'id',
+        placeholder: '企业名称',
+        querykey: 'customerId'
+      },
       changeCompanyId: '',
-
       oliList: ['0#柴', '-10#柴', '92#汽', '95#汽'],
-
       baocunList: [],
       daixuanList: [],
       baocunDaixuanList: [],
@@ -244,7 +242,6 @@ export default {
       tableHeight: document.documentElement.clientHeight - 495,
       selectedStaffList: [],
       setWait: true,
-      queryCompanyList: [], // 企业列表
       staffData: [],
       selectedStaffData: [],
       submitDialog: false,
@@ -451,14 +448,6 @@ export default {
       }
       this.submitDialog = true
     },
-    companyOrginQuery(value) {
-      // 远程搜索
-      if (value) {
-        internalCompanyApi.getLikeByCompanyType({ name: value }).then(res => {
-          this.queryCompanyList = res.data
-        })
-      }
-    },
     search() {
       // 搜索
       if (!this.page.params.customerId) {

src/views/oilFinalStatement/oilFinalStatementList.vue

@@ -14,19 +14,8 @@
               <el-option label="炼厂" value="2" />
             </el-select>
           </el-form-item>
-          <el-form-item>
-            <el-select
-              v-model="page.params.settlementId"
-              remote
-              filterable
-              :remote-method="companyOrginQuery"
-              clearable
-              placeholder="客户名称"
-              @keyup.enter.native="getByPage"
-            >
-              <el-option v-for="item in queryCompanyList" :key="item.id" :label="item.name" :value="item.id" />
-            </el-select>
-          </el-form-item>
+
+          <autocomplete class="mr20" :params="page.params" :config="configAutocomplete" />
 
           <el-form-item>
             <el-select v-model="page.params.auditState" clearable placeholder="审核状态">
@@ -133,14 +122,24 @@
 import oilFinalStatementListInfo from './oilFinalStatementListInfo'
 import internalCompanyApi from '@/api/user/internalCompany'
 import sysCustomerInfoApi from '@/api/user/sysCustomerInfo'
+import autocomplete from 'components/autocomplete/index.vue'
 import { mapGetters } from 'vuex'
 
 export default {
   components: {
-    oilFinalStatementListInfo
+    oilFinalStatementListInfo,
+    autocomplete
   },
   data() {
     return {
+      configAutocomplete: {
+        serveTarget: internalCompanyApi.getLikeByCompanyType,
+        autocompleteKey: 'name',
+        labelKey: 'name',
+        valueKey: 'id',
+        placeholder: '客户名称',
+        querykey: 'settlementId'
+      },
       detailDrawer: false,
       thisloding: true,
       page: {
@@ -151,7 +150,6 @@ export default {
         columns: []
       },
       userList: '',
-      queryCompanyList: [],
       tableHeight: document.documentElement.clientHeight - 300 - 50,
       filters: this.$options.filters,
       dataPage: [],
@@ -314,14 +312,6 @@ export default {
       this.page.params = {}
       this.getByPage()
     },
-    companyOrginQuery(value) {
-      // 远程搜索
-      if (value) {
-        internalCompanyApi.getLikeByCompanyType({ name: value }).then(res => {
-          this.queryCompanyList = res.data
-        })
-      }
-    },
     getByPage() {
       // 分页查询