增加台桌搜索功能

src/views/tool/Instead/index.vue

@@ -46,7 +46,13 @@
             trigger="click"
             v-model="tableShow"
           >
-            <div style="max-height: 398px; overflow-y: scroll">
+          <el-input
+              placeholder="请输入内容"
+              prefix-icon="el-icon-search"
+              v-model="tableSearchText"
+              @input="searchInput">
+            </el-input>
+            <div style="max-height: 398px; overflow-y: scroll" class="u-m-t-12">
               <div
                 class="u-flex u-row-between u-p-t-8 table-item u-p-b-8 u-p-r-30"
                 v-for="(item, index) in tableList"
@@ -1277,10 +1283,12 @@ import {
   isCanBuy,
   arrayContainsAll,
   generateCombinations,
-  returnReverseVal,
+  returnReverseVal,$strMatch,
   returnGiftArr,
 } from "./util.js";
 import { $status } from "@/utils/table.js";
+
+let $originTableList=[]
 export default {
   components: {
     returnCart,
@@ -1296,6 +1304,8 @@ export default {
   },
   data() {
     return {
+      //台桌搜索文字
+      tableSearchText:"",
       //是否允许收款
       canShoukuan: false,
       //是否允许下单
@@ -1326,7 +1336,7 @@ export default {
       //台桌参数
       tableQuery: {
         page: 1,
-        size: 20,
+        size: 999,
       },
       tableShow: false,
       status: $status,
@@ -1820,6 +1830,10 @@ export default {
     this.open(this.$route.query.tableId ? this.$route.query : "");
   },
   methods: {
+    searchInput(e){
+      console.log(e)
+      this.tableList=$originTableList.filter(v=>$strMatch(v.name,e.trim()))
+    },
     returnTableColor(key) {
       const item = $status[key];
       return item ? item.type : "";
@@ -2106,6 +2120,7 @@ export default {
         this.tableList = content.filter(
           (v) => v.status != "closed" && v.status != "cleaning"
         );
+        $originTableList=this.tableList
       } catch (error) {
         console.log(error);
       }

src/views/tool/Instead/util.js

@@ -9,6 +9,10 @@ export function isCanBuy(skuGoods,goods) {
 
     }
 }
+//字符匹配
+export function $strMatch(matchStr,str){
+    return matchStr.toLowerCase().includes(str.toLowerCase())
+}
 
 // 一个数组是否包含另外一个数组全部元素
 export function arrayContainsAll(arr1, arr2) {