fix

src/components/mobile/main/ChipFilter.vue

@@ -23,8 +23,6 @@
         <div class="btn-bg">Quility</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider :min="0" height="190" :max="15" v-model="value2">
-            </el-slider> -->
             <Slider :min="0" :max="15" v-model="value"></Slider>
           </div>
           <div class="slider-number">
@@ -33,32 +31,7 @@
           </div>
         </div>
       </div>
-      <!-- <div class="level-item">
-        <div class="btn-bg">2</div>
-        <div class="level-slider">
-          <div class="slider">
      
-            <Slider :min="0" :max="15" v-model="value2"></Slider>
-          </div>
-          <div class="slider-number">
-            <div>0</div>
-            <div>15</div>
-          </div>
-        </div>
-      </div> -->
-      <!-- <div class="level-item">
-        <div class="btn-bg">3</div>
-        <div class="level-slider">
-          <div class="slider">
-           
-            <Slider :min="0" :max="15" v-model="value3"></Slider>
-          </div>
-          <div class="slider-number">
-            <div>0</div>
-            <div>15</div>
-          </div>
-        </div>
-      </div> -->
     </div>
     <div class="price">
       <div class="price-btn" @click="priceFilter">Price</div>

src/components/mobile/main/FilterTop.vue

@@ -6,6 +6,7 @@
         prefix-icon="el-icon-search"
         v-model="value"
         :maxlength="24"
+        @input="search"
         placeholder="Search Name or Tokenid"
       ></el-input>
     </div>
@@ -57,6 +58,10 @@ export default {
     };
   },
   methods: {
+    search() {
+      this.$emit("handSearch",this.value);
+      console.log('handSearch');
+    },
     handClear() {},
     handFilter() {
       this.nftNumber = !this.nftNumber;

src/components/mobile/main/Herofilter.vue

@@ -23,8 +23,6 @@
         <div class="btn-bg">Quility</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider :min="0" height="190" :max="15" v-model="value2">
-            </el-slider> -->
             <Slider :min="0" :max="15" v-model="value"></Slider>
           </div>
           <div class="slider-number">
@@ -37,7 +35,6 @@
         <div class="btn-bg">Level</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider height="190" :min="0" :max="15" v-model="value" /> -->
             <Slider :min="0" :max="15" v-model="value2"></Slider>
           </div>
           <div class="slider-number">
@@ -50,7 +47,6 @@
         <div class="btn-bg">durability</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider height="190" :min="0" :max="15" v-model="value3" /> -->
             <Slider :min="0" :max="15" v-model="value3"></Slider>
           </div>
           <div class="slider-number">
@@ -89,7 +85,7 @@ import PropertySelect from "./PropertySelect.vue";
 export default {
   components: {
     Slider,
-    PropertySelect
+    PropertySelect,
   },
   data() {
     return {

src/components/mobile/main/PieceFilter.vue

@@ -18,47 +18,7 @@
         @handSelect="handHeroSelect"
       ></PropertySelect>
     </div>
-    <div class="level-filter">
+    <div class="level-filter"></div>
-      <!-- <div class="level-item">
-        <div class="btn-bg">Quility</div>
-        <div class="level-slider">
-          <div class="slider">
-           
-            <Slider :min="0" :max="15" v-model="value"></Slider>
-          </div>
-          <div class="slider-number">
-            <div>0</div>
-            <div>15</div>
-          </div>
-        </div>
-      </div> -->
-      <!-- <div class="level-item">
-        <div class="btn-bg">2</div>
-        <div class="level-slider">
-          <div class="slider">
-          
-            <Slider :min="0" :max="15" v-model="value2"></Slider>
-          </div>
-          <div class="slider-number">
-            <div>0</div>
-            <div>15</div>
-          </div>
-        </div>
-      </div> -->
-      <!-- <div class="level-item">
-        <div class="btn-bg">3</div>
-        <div class="level-slider">
-          <div class="slider">
-          
-            <Slider :min="0" :max="15" v-model="value3"></Slider>
-          </div>
-          <div class="slider-number">
-            <div>0</div>
-            <div>15</div>
-          </div>
-        </div>
-      </div> -->
-    </div>
     <div class="price">
       <div class="price-btn" @click="priceFilter">Price</div>
       <div class="price-bottom">
@@ -88,7 +48,7 @@ import PropertySelect from "./PropertySelect.vue";
 export default {
   components: {
     Slider,
-    PropertySelect
+    PropertySelect,
   },
   data() {
     return {
@@ -113,7 +73,6 @@ export default {
           jobImg: require("../../../assets/market/filter-left/guardian.png"),
           disImg: require("../../../assets/market/filter-left/guardian-disabled.png"),
         },
-      
       ],
     };
   },
@@ -347,4 +306,3 @@ export default {
   background-size: contain;
 }
 </style>
-

src/components/mobile/main/WeaponFilter.vue

@@ -1,17 +1,6 @@
 <template>
   <div class="containers">
     <div class="job-content">
-      <!-- <div class="job">
-        <img src="../../../assets/market/filter-left/job.png" alt="" />
-      </div> -->
-      <!-- <div class="job-options">
-        <div class="job-item" v-for="(item, i) in jobList" :key="i">
-          <div class="job-status" @click="jobStatus(item)">
-            <img v-if="item.jobType === true" :src="item.jobImg" alt="" />
-            <img v-else :src="item.disImg" alt="" />
-          </div>
-        </div>
-      </div> -->
       <PropertySelect
         :options="options"
         :selectValue="selectValue"
@@ -23,8 +12,6 @@
         <div class="btn-bg">Quility</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider :min="0" height="190" :max="15" v-model="value2">
-            </el-slider> -->
             <Slider :min="0" :max="15" v-model="value"></Slider>
           </div>
           <div class="slider-number">
@@ -37,7 +24,6 @@
         <div class="btn-bg">2</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider height="190" :min="0" :max="15" v-model="value" /> -->
             <Slider :min="0" :max="15" v-model="value2"></Slider>
           </div>
           <div class="slider-number">
@@ -50,7 +36,6 @@
         <div class="btn-bg">3</div>
         <div class="level-slider">
           <div class="slider">
-            <!-- <el-slider height="190" :min="0" :max="15" v-model="value3" /> -->
             <Slider :min="0" :max="15" v-model="value3"></Slider>
           </div>
           <div class="slider-number">

src/views/mobile/Market.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="container">
     <mobile-header current-section="market"></mobile-header>
-    <FilterTop :nftType="nftType"></FilterTop>
+    <FilterTop :nftType="nftType" @handSearch="handSearch"></FilterTop>
     <NftTypeBar
       :nftType="nftType"
       :sortOptions="sortOptions"
@@ -23,6 +23,7 @@ import mobileHeader from "@/components/mobile/main/MobileHeader.vue";
 import { queryShellNftList } from "@/api/Market";
 import { AppModule } from "@/store/modules/app";
 import { UserModule } from "@/store/modules/user";
+import { debounce } from "@/utils/formatAddress";
 import NftTypeBar from "@/components/mobile/main/NftTypeBar.vue";
 import MobileFooter from "@/components/mobile/main/MobileFooter.vue";
 import HeroList from "@/components/mobile/main/HeroList.vue";
@@ -48,6 +49,7 @@ export default {
       hero: "",
       isType: "market",
       nftList: [],
+      debounce: null,
       priceFilter: "0|10000",
       isFiters: false,
       totalPage: 1,
@@ -109,6 +111,11 @@ export default {
       }
     },
   },
+  created() {
+    this.debounce = debounce(() => {
+      this.getHeroNftList();
+    }, 1500);
+  },
   methods: {
     onClickItem(s) {
       this.nftType = s.id;
@@ -122,6 +129,10 @@ export default {
     handFilter(s) {
       this.isFiters = !this.isFiters;
     },
+    handSearch(value) {
+      this.searchFilters =value;
+       this.debounce()
+    },
     handClear() {
       this.hero = "";
     },
@@ -167,11 +178,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-
 .container {
   width: 100vw;
   // height: 100vh;
   background: url("../../assets/mobile/market/bg.png") no-repeat;
-  
 }
 </style>