fix

src/components/market/FilterLeft.vue

@@ -5,7 +5,9 @@
       @searchClear="searchClear"
       @heroLevelChange="heroLevelChange"
       @handSelect="handSelect"
+      @heroSearch="heroSearch"
       :value="value"
+      :heroValue="heroValue"
       :jobList="jobList"
       @jobStatus="jobStatus"
       :selectValue="selectValue"
@@ -39,7 +41,7 @@ import Weaponfilter from "@/components/market/filters/Weaponfilter";
 import Chipfilter from "@/components/market/filters/Chipfilter";
 import Piecefilter from "@/components/market/filters/Piecefilter";
 export default {
-  props: ["nftType", "value", "isType", "options", "selectValue", "jobList"],
+  props: ["nftType", "value", "isType", "options", "selectValue", "jobList",'heroValue'],
   components: {
     Herofilter,
     Chipfilter,
@@ -65,6 +67,10 @@ export default {
       console.log(levelSlider, "levelSlider2");
       this.$emit("heroLevelChange", levelSlider);
     },
+     heroSearch(value) {
+        console.log(value,'-==-=0');
+     this.$emit("heroSearch",value);
+    },
   },
 };
 </script>

src/components/market/SearchInput.vue

@@ -4,9 +4,10 @@
       <div class="search-input">
         <el-input
           prefix-icon="el-icon-search"
-          v-model="hero"
+          v-model="value"
           :maxlength="24"
           :autofocus="true"
+          @input="search"
           placeholder="Search Name or Tokenid"
         ></el-input>
       </div>
@@ -18,10 +19,42 @@
 <script>
 export default {
   name: "SearchInput",
-  props: ["hero"],
+  props: ["heroValue"],
+  data() {
+    return {
+      time: null,
+      value: '',
+    };
+  },
+  // watch: {
+  //   heroValue(val) {
+  //     this.value = val;
+  //   },
+  // },
   methods: {
     searchClear() {
-      this.$emit("searchClear", this.hero);
+      this.$emit("searchClear", this.value);
+    },
+    search() {
+
+      this.$emit("heroSearch",this.value);
+      console.log(this.value,'dsfsdfs1');
+      // clearTimeout(this.timer);
+      // this.timer = setTimeout(() => {
+      //   // 执行搜索请求
+      //   console.log(this.value);
+      // }, 1000); // 设置时间
+    },
+    disable(fn, delay) {
+      let timer = null;
+      return function () {
+        if (timer) {
+          clearTimeout(timer);
+          timer = setTimeout(fn, delay);
+        } else {
+          timer = setTimeout(fn, delay);
+        }
+      };
     },
   },
 };

src/components/market/filters/Herofilter.vue

@@ -2,7 +2,11 @@
   <div class="container">
     <div class="filtertop">
       <div class="filter"></div>
-      <SearchInput :hero="hero" @searchClear="searchClear" />
+      <SearchInput
+        :heroValue="heroValue"
+        @searchClear="searchClear"
+        @heroSearch="heroSearch"
+      />
       <PropertySelect
         :options="options"
         :selectValue="selectValue"
@@ -95,7 +99,7 @@ import SearchInput from "../SearchInput";
 import PriceFilter from "../PriceFilter.vue";
 import PropertySelect from "../PropertySelect.vue";
 export default {
-  props: ["value", "isType", "options", "selectValue",'jobList'],
+  props: ["value", "isType", "options", "selectValue", "jobList", "heroValue"],
   components: {
     Slider,
     PriceFilter,
@@ -111,10 +115,14 @@ export default {
   },
 
   methods: {
-    jobStatus(item){
+    jobStatus(item) {
       this.$emit("jobStatus", item);
     },
-  
+    heroSearch(value) {
+       console.log(value,'-==-=3');
+      this.$emit("heroSearch",value);
+    
+    },
     searchClear(hero) {
       // this.hero = "";
     },
@@ -130,8 +138,8 @@ export default {
       this.$emit("handSelect", value);
     },
     heroLevelChange(levelSlider) {
-       console.log(levelSlider, "levelSlider");
-       this.$emit("heroLevelChange", levelSlider);
+      console.log(levelSlider, "levelSlider");
+      this.$emit("heroLevelChange", levelSlider);
     },
     levelonChange(newVal2) {
       console.log(newVal2, "scale2");

src/utils/formatAddress.js

@@ -1,13 +1,22 @@
-export const formatAddress = function(address) {
-    if (address.length >= 10) {
-      return (
-        address.substring(0, 6) +
-        "......" +
-        address.substring(address.length - 4)
-      );
-    } else if (address.length > 0 && address.length < 10) {
-      return address;
-    } else {
-      return "-";
-    }
-  }
+export const formatAddress = function (address) {
+  if (address.length >= 10) {
+    return (
+      address.substring(0, 6) + "......" + address.substring(address.length - 4)
+    );
+  } else if (address.length > 0 && address.length < 10) {
+    return address;
+  } else {
+    return "-";
+  }
+};
+export const debounce = function (foo, delay) {
+  let timer;
+  return function () {
+    if (timer) clearTimeout(timer);
+    timer = setTimeout(() => {
+      // 暂时理解不了（this，arguments）指向改变的问题
+      foo.call(this, arguments);
+      // 不输入延迟 则默认 1000 ms
+    }, delay || 1000);
+  };
+};

src/views/desktop/MyNft.vue

@@ -6,12 +6,14 @@
         <FilterLeft
           @filter-show="showFilter"
           @searchClear="searchClear"
+          @heroSearch="heroSearch"
           @handSelect="handSelect"
           @sliderChange="sliderChange"
           @heroLevelChange="heroLevelChange"
           :nft-type="nftType"
           :isType="currentTab"
           :value="value"
+          :heroValue="heroValue"
           :jobList="jobList"
           @jobStatus="jobStatus"
           :selectValue="selectValue"
@@ -122,6 +124,8 @@ export default class MyNft extends Vue {
   nftType = 1;
   nftState = 0;
   value = 7;
+  timer: any = null;
+  heroValue = "";
   selectValue = "all";
   showOrderStatus = false;
   private filters = ["All Items", "Normal", "Selling", "Renting"];
@@ -215,6 +219,15 @@ export default class MyNft extends Vue {
   get boxProxyAddress() {
     return CONTRACT_ADDRESS[AppModule.chainId].nftProxy;
   }
+  heroSearch(value: string) {
+    clearTimeout(this.timer);
+    this.timer = setTimeout(() => {
+      // 执行搜索请求
+      console.log(value, "-==-=");
+      this.searchFilters = value;
+      this.getHeroNftList(this.currentPage);
+    }, 1000); // 设置时间
+  }
   searchClear(hero: string) {
     console.log(hero, "herio2020");
   }
@@ -239,7 +252,6 @@ export default class MyNft extends Vue {
     this.getHeroNftList(this.currentPage);
   }
   heroLevelChange(levelSlider: any) {
-  
     this.lvFilter = levelSlider;
     this.getHeroNftList(this.currentPage);
     // this.$emit("heroLevelChange", levelSlider);