fix

src/components/market/FilterLeft.vue

@@ -26,6 +26,7 @@
       @searchClear="searchClear"
       :value="value"
       :chipOptions="chipOptions"
+      @chipStatus="chipStatus"
       :chipList="chipList"
       :isType="isType"
     ></Chipfilter>
@@ -33,6 +34,7 @@
       v-else-if="nftType - 1 == 3"
       @searchClear="searchClear"
       :pieceList="pieceList"
+      @pieceStatus="pieceStatus"
       :pieceOptions="pieceOptions"
       :value="value"
       :isType="isType"
@@ -57,8 +59,8 @@ export default {
     "chipList",
     "pieceList",
     "pieceOptions",
-    'chipOptions',
-    'weaponOptions'
+    "chipOptions",
+    "weaponOptions",
   ],
   components: {
     Herofilter,
@@ -81,6 +83,12 @@ export default {
     jobStatus(item) {
       this.$emit("jobStatus", item);
     },
+    chipStatus(item) {
+      this.$emit("chipStatus", item);
+    },
+    pieceStatus(item) {
+      this.$emit("chipStatus", item);
+    },
     heroLevelChange(levelSlider) {
       console.log(levelSlider, "levelSlider2");
       this.$emit("heroLevelChange", levelSlider);

src/components/market/MessageBox.vue

@@ -25,7 +25,7 @@ import Close from "./Close.vue";
 
 export default {
   components: { Close },
-  props: ["dialogVisible", "data", "isType"],
+  props: [ "data", "isType"],
   data() {
     return {
       dialogVisible: false,

src/components/market/NftTypeBar.vue

@@ -17,12 +17,12 @@
         class="se"
         v-model="value"
         :popper-append-to-body="false"
-        @change="handSelect"
+        @change="handSortSelect"
         placeholder="请选择"
         popper-class="select-popper"
       >
         <el-option
-          v-for="item in options"
+          v-for="item in sortOptions"
           :key="item.value"
           :label="item.label"
           :value="item.value"
@@ -38,9 +38,10 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 @Component({
   name: "NftTypeBar",
   components: {},
+  props:['sortOptions','selectIdx']
 })
 export default class NftTypeBar extends Vue {
-  @Prop() private selectIdx: number;
+  // @Prop() private selectIdx: number;
   private types = [
     { Image: require("../../assets/market/hero.png") },
     { Image: require("../../assets/market/weapon.png") },
@@ -48,35 +49,14 @@ export default class NftTypeBar extends Vue {
     { Image: require("../../assets/market/piece.png") },
     // { Image: require("../../assets/market/voucher.png") },
   ];
-  options = [
-    {
-      value: "1",
-      label: "Recently",
-    },
-    {
-      value: "2",
-      label: "Highest Price",
-    },
-    {
-      value: "3",
-      label: "Maximum Quality ",
-    },
-    {
-      value: "4",
-      label: "Maximun Level ",
-    },
-    {
-      value: "5",
-      label: "Maximum Energy",
-    },
-  ];
+  
   value = "";
   private onClickItem(idx: number) {
     this.$emit("nft-type-changed", idx + 1);
   }
-  public handSelect(value: any) {
+ handSortSelect(value: any) {
     console.log(value);
-    this.$emit("handSelect", value);
+    this.$emit("handSortSelect", value);
   }
 }
 </script>

src/components/market/PropertySelect.vue

@@ -6,7 +6,7 @@
         v-model="value"
         :popper-append-to-body="false"
         @change="handSelect"
-        placeholder="请选择"
+        placeholder="all"
         popper-class="select-popper"
       >
         <el-option

src/components/market/SearchInput.vue

@@ -33,17 +33,13 @@ export default {
   // },
   methods: {
     searchClear() {
-      this.$emit("searchClear", this.value);
+      // this.$emit("searchClear", this.value); 
+      console.log(this.value,'this.value ');
+      this.value =''
+     
     },
     search() {
-
-      this.$emit("heroSearch",this.value);
-      console.log(this.value,'dsfsdfs1');
-      // clearTimeout(this.timer);
-      // this.timer = setTimeout(() => {
-      //   // 执行搜索请求
-      //   console.log(this.value);
-      // }, 1000); // 设置时间
+      this.$emit("Search",this.value);
     },
     disable(fn, delay) {
       let timer = null;

src/components/market/filters/Chipfilter.vue

@@ -18,7 +18,7 @@
       </div>
       <div class="job-options">
         <div class="job-item" v-for="(item, i) in chipList" :key="i">
-          <div @click="jobStatus(item)">
+          <div @click="chipStatus(item)">
             <img
               width="66px"
               v-if="item.jobType === true"
@@ -134,8 +134,9 @@ export default {
   },
 
   methods: {
-    jobStatus(item) {
-      this.jobList[item.id].jobType = !this.jobList[item.id].jobType;
+    chipStatus(item) {
+      console.log(item,'chipStatus')
+       this.$emit("chipStatus",item);
     },
     searchClear() {
       // this.hero = "";

src/components/market/filters/Herofilter.vue

@@ -5,7 +5,7 @@
       <SearchInput
         :heroValue="heroValue"
         @searchClear="searchClear"
-        @heroSearch="heroSearch"
+        @Search="heroSearch"
       />
       <PropertySelect
         :options="options"
@@ -134,11 +134,10 @@ export default {
       this.priceMax = "";
     },
     handSelect(value) {
-      console.log(value, "1");
       this.$emit("handSelect", value);
     },
     heroLevelChange(levelSlider) {
-      console.log(levelSlider, "levelSlider");
+  
       this.$emit("heroLevelChange", levelSlider);
     },
     levelonChange(newVal2) {

src/components/market/filters/Piecefilter.vue

@@ -18,7 +18,7 @@
         </div>
         <div class="job-options">
           <div class="job-item" v-for="(item, i) in pieceList" :key="i">
-            <div @click="jobStatus(item)">
+            <div @click="pieceStatus(item)">
               <img
                 width="66px"
                 v-if="item.jobType === true"
@@ -135,8 +135,8 @@ export default {
   },
 
   methods: {
-    jobStatus(item) {
-      this.jobList[item.id].jobType = !this.jobList[item.id].jobType;
+   pieceStatus(item) {
+      this.$emit("pieceStatus", item);
     },
     searchClear() {
       // this.hero = "";

src/views/desktop/MyNft.vue

@@ -16,6 +16,8 @@
           :heroValue="heroValue"
           :jobList="jobList"
           @jobStatus="jobStatus"
+          @chipStatus="chipStatus"
+          @pieceStatus="pieceStatus"
           :chipList="chipList"
           :pieceList="pieceList"
           :selectValue="selectValue"
@@ -27,6 +29,8 @@
         <div class="right-part">
           <nft-type-bar
             :select-idx="nftType"
+            :sortOptions="sortOptions"
+            @handSortSelect="handSortSelect"
             @nft-type-changed="onNftTypeClicked"
             class="left-bar"
           ></nft-type-bar>
@@ -348,27 +352,47 @@ export default class MyNft extends Vue {
       label: "Trigger",
     },
     {
-      value: 110240 ,
+      value: 110240,
       label: "Ammo",
     },
     {
-      value: 110250 ,
+      value: 110250,
       label: "Bolt",
     },
-     {
-      value: 110260 ,
+    {
+      value: 110260,
       label: "Barrel",
     },
-     {
-      value: 110270 ,
+    {
+      value: 110270,
       label: "Grip",
     },
-     {
-      value: 110280 ,
+    {
+      value: 110280,
       label: "Clip",
     },
-    
-
+  ];
+  sortOptions = [
+    {
+      value: "1",
+      label: "Recently",
+    },
+    {
+      value: "2",
+      label: "Highest Price",
+    },
+    {
+      value: "3",
+      label: "Maximum Quality ",
+    },
+    {
+      value: "4",
+      label: "Maximun Level ",
+    },
+    {
+      value: "5",
+      label: "Maximum Energy",
+    },
   ];
   jobList = [
     {
@@ -462,12 +486,6 @@ export default class MyNft extends Vue {
   heroSearch(value: string) {
     this.searchFilters = value;
     debounce(this.getHeroNftList(this.currentPage), 2000);
-    // clearTimeout(this.timer);
-    // this.timer = setTimeout(() => {
-    //   // 执行搜索请求
-    //   console.log(value, "-==-=");
-
-    // }, 1000); // 设置时间
   }
   searchClear(hero: string) {
     console.log(hero, "herio2020");
@@ -476,6 +494,10 @@ export default class MyNft extends Vue {
     this.searchFilters = value;
     this.getHeroNftList(this.currentPage);
   }
+  handSortSelect(value: string | number) {
+    this.orderMethod = value;
+    this.getHeroNftList(this.currentPage);
+  }
   jobStatus(item: any) {
     this.jobList[item.id].jobType = !this.jobList[item.id].jobType;
 
@@ -485,13 +507,43 @@ export default class MyNft extends Vue {
     let arry = list.map((item) => {
       return item.id;
     });
-    console.log(arry.join("|"), "list");
     let newArray = arry.map(function (index) {
       return index + 1;
     });
     this.jobFilters = newArray.join("|");
     this.getHeroNftList(this.currentPage);
   }
+  pieceStatus(item: any) {
+    this.pieceList[item.id].jobType = !this.pieceList[item.id].jobType;
+
+    let list = this.pieceList.filter((item) => {
+      return item.jobType == true;
+    });
+    let arry = list.map((item) => {
+      return item.id;
+    });
+    let newArray = arry.map(function (index) {
+      return index + 1;
+    });
+    // this.jobFilters = newArray.join("|");
+    // this.getHeroNftList(this.currentPage);
+  }
+  chipStatus(item: any) {
+    this.chipList[item.id].jobType = !this.chipList[item.id].jobType;
+
+    let list = this.chipList.filter((item) => {
+      return item.jobType == true;
+    });
+    let arry = list.map((item) => {
+      return item.id;
+    });
+    let newArray = arry.map(function (index) {
+      return index + 1;
+    });
+    // this.jobFilters = newArray.join("|");
+    // this.getHeroNftList(this.currentPage);
+  }
+
   heroLevelChange(levelSlider: any) {
     this.lvFilter = levelSlider;
     this.getHeroNftList(this.currentPage);
@@ -512,7 +564,6 @@ export default class MyNft extends Vue {
       order_method: this.orderMethod,
     };
     const res: any = await queryNftList(reqData);
-    console.log(res, "hero");
     if (res.nfts) {
       let list = res.nfts;
       this.nftList = list.filter((item: any) => {
@@ -533,7 +584,6 @@ export default class MyNft extends Vue {
       this.nftType = typeId;
       // this.fetchDatas(1);
       this.getHeroNftList(this.currentPage);
-      console.log("2222222222222");
     }
   }
   sliderChange() {}
@@ -558,9 +608,7 @@ export default class MyNft extends Vue {
     if (this.isLogin) {
       // this.fetchDatas(this.currentPage);
       this.checkOrderHistory();
-      console.log("-----------------");
       this.getHeroNftList(this.currentPage);
-      console.log("2222222222222");
     } else {
       this.resetData();
     }