Browse Source

存储列表 增加搜索和排序

xiaomei 4 months ago
parent
commit
557b4f60c6
3 changed files with 148 additions and 30 deletions
  1. 4 1
      src/language/en.json
  2. 3 3
      src/language/zh.json
  3. 141 26
      src/views/storage/list.vue

+ 4 - 1
src/language/en.json

@@ -491,5 +491,8 @@
   "lang490": "Remittance",
   "lang491": "Upgrading",
   "lang492": "Current TeaC balance",
-  "lang493": "Are you sure you want to transfer TeaC?"
+  "lang493": "Are you sure you want to transfer TeaC?",
+  "lang494": "Daily output",
+  "lang495": "Storage of tea rights",
+  "lang496": "Please enter the name of the tea rights"
 }

+ 3 - 3
src/language/zh.json

@@ -492,9 +492,9 @@
   "lang491": "正在升级",
   "lang492": "当前TeaC余额",
   "lang493": "是否确定转账TeaC?",
-  "lang494": "",
-  "lang495": "",
-  "lang496": "",
+  "lang494": "日产出量",
+  "lang495": "存储茶权",
+  "lang496": "请输入茶权名称",
   "lang497": "",
   "lang498": "",
   "lang499": "",

+ 141 - 26
src/views/storage/list.vue

@@ -4,23 +4,62 @@
       <img @click="back" src="@/assets/images/back.png" class="arrow_img" />
       <span>{{ $t('lang217') }}</span>
     </div> -->
-    <div class="btn_box">
-      <van-button
-        :class="[typeIndex == 2 ? 'cc_btn cc_active' : 'cc_btn']"
-        :icon="typeIndex == 2 ? 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/mul_1.png' : 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/mul.png'"
-        @click="changeType(2)"
-      >
-        <!-- <img src="@/assets/images/index/mul.png" class="icon" /> -->
-        {{ $t('lang319') }}</van-button
-      >
-      <van-button
-        :class="[typeIndex == 1 ? 'cc_btn cc_active' : 'cc_btn']"
-        :icon="typeIndex == 1 ? 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/single_1.png' : 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/single.png'"
-        @click="changeType(1)"
-        >{{ $t('lang320') }}</van-button
-      >
-      <van-button class="cc_btn" icon="https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/teamine.png" @click="navigatorToPage('storing')">{{ $t('lang38') }}</van-button>
+    <div class="header">
+      <div class="btn_box">
+        <van-button
+          :class="[typeIndex == 2 ? 'cc_btn cc_active' : 'cc_btn']"
+          :icon="typeIndex == 2 ? 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/mul_1.png' : 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/mul.png'"
+          @click="changeType(2)"
+        >
+          <!-- <img src="@/assets/images/index/mul.png" class="icon" /> -->
+          {{ $t('lang319') }}</van-button
+        >
+        <van-button
+          :class="[typeIndex == 1 ? 'cc_btn cc_active' : 'cc_btn']"
+          :icon="typeIndex == 1 ? 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/single_1.png' : 'https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/single.png'"
+          @click="changeType(1)"
+          >{{ $t('lang320') }}</van-button
+        >
+        <van-button class="cc_btn" icon="https://teaclub.oss-cn-chengdu.aliyuncs.com/mall/teamine.png" @click="navigatorToPage('storing')">{{ $t('lang38') }}</van-button>
+      </div>
+      <van-field v-model="title" :placeholder="$t('lang496')" class="input" right-icon="search" @click-right-icon="search" />
+
+      <div class="sort flex jsb">
+        <span class="w1">{{ $t('lang495') }}</span>
+
+        <div class="flex jsb">
+          <div class="flex w2" @click="handlePriceSort">
+            <span>{{ $t('lang494') }}</span>
+            <img src="@/assets/images/index/j0.png" alt="" style="width: 14px" v-if="day_num == 0" />
+            <img src="@/assets/images/index/j2.png" alt="" style="width: 14px" v-else-if="day_num == 1" />
+            <img src="@/assets/images/index/j1.png" alt="" style="width: 14px" v-else-if="day_num == 2" />
+          </div>
+          <div class="flex w3" @click="handleVolumeSort">
+            <span>APY</span>
+            <img src="@/assets/images/index/j0.png" alt="" style="width: 14px" v-if="income_reta == 0" />
+            <img src="@/assets/images/index/j2.png" alt="" style="width: 14px" v-else-if="income_reta == 1" />
+            <img src="@/assets/images/index/j1.png" alt="" style="width: 14px" v-else-if="income_reta == 2" />
+          </div>
+          <!-- <van-dropdown-menu active-color="#3d3d3d">
+              <van-dropdown-item v-model="type_id" :options="indexinfo.type_list" @change="search" />
+            </van-dropdown-menu> -->
+          <!-- <svg width="30" height="30" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+              <path
+                d="M70,35
+           C56,28 38,40 40,54
+           C40,64 50,74 70,66"
+                fill="none"
+                stroke="black"
+                stroke-width="6"
+                stroke-linecap="round"
+              />
+              <line x1="52" y1="29" x2="52" y2="73" stroke="black" stroke-width="5.2" stroke-linecap="round" />
+              <line x1="63" y1="29" x2="63" y2="73" stroke="black" stroke-width="5.2" stroke-linecap="round" />
+            </svg> -->
+        </div>
+      </div>
     </div>
+
     <div class="home_page" @scroll="handleScroll">
       <div class="pd goods_box" v-if="list.length > 0">
         <div class="goods_list jsb" v-for="(item, index) in list" :key="index">
@@ -86,6 +125,9 @@ export default {
       list: [],
       page: 1,
       current: parseInt(new Date().getTime() / 1000), //1743648326
+      title: '',
+      day_num: 0, //1倒序2正序
+      income_reta: 0, //1倒序2正序
     };
   },
   components: {
@@ -119,9 +161,35 @@ export default {
         }
       }
     },
-
+    handlePriceSort() {
+      this.income_reta = 0
+      if (this.day_num == 0) {
+        this.day_num = 1;
+      } else if (this.day_num == 1) {
+        this.day_num = 2;
+      } else if (this.day_num == 2) {
+        this.day_num = 1;
+      }
+      this.search();
+    },
+    handleVolumeSort() {
+      this.day_num = 0
+      if (this.income_reta == 0) {
+        this.income_reta = 1;
+      } else if (this.income_reta == 1) {
+        this.income_reta = 2;
+      } else if (this.income_reta == 2) {
+        this.income_reta = 1;
+      }
+      this.search();
+    },
+    search() {
+      this.page = 1;
+      this.list = []; // 重置列表数据
+      this.pledgeList(); // 触发重新获取列表数据
+    },
     pledgeList() {
-      homeApi.pledgeList({ type_id: this.typeIndex, page: this.page }).then(res => {
+      homeApi.pledgeList({ type_id: this.typeIndex, page: this.page, title: this.title, day_num: this.day_num, income_reta: this.income_reta }).then(res => {
         if (res.code == 200) {
           if (this.list.length >= res.data.total) {
             this.page = -1; // 重置为 -1,表示没有更多数据
@@ -182,17 +250,62 @@ export default {
     // transform: translate(0, -50%);
   }
 }
-.btn_box {
+.header {
   width: 100%;
-  box-sizing: border-box;
   position: fixed;
   top: 0;
   z-index: 99;
+  box-sizing: border-box;
+  padding: 10px 16px 0;
+  background-color: #fff;
+
+  .input {
+    width: 100%;
+    // height: 35px;
+    // line-height: 35px;
+    border: 1px solid #29b286;
+    border-radius: 20px;
+    margin: 10px 0 0px;
+    ::v-deep .van-field__control {
+      letter-spacing: 1px;
+      font-size: 13px;
+      padding: 6px 13px;
+    }
+    ::v-deep .van-icon-search {
+      font-size: 22px;
+      color: #29b286;
+      font-weight: bold;
+      margin-right: 10px;
+    }
+  }
+  .sort {
+    color: #9d9d9d;
+    width: 100%;
+    font-size: 12px;
+    letter-spacing: 1px;
+    font-weight: 600;
+    padding: 14px 0;
+    .w1 {
+      // width: 60%;
+    }
+    .w2 {
+      margin-right: 20px;
+    }
+
+    /deep/.van-ellipsis {
+      color: #9d9d9d;
+      font-size: 12px !important;
+    }
+  }
+}
+.btn_box {
+  width: 100%;
+  box-sizing: border-box;
+
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 10px 16px;
-  background-color: #fff;
+  // padding: 10px 16px;
   .cc_btn {
     width: 31%;
     height: 36px;
@@ -218,8 +331,11 @@ export default {
     background-color: #29b286;
   }
 }
+.jsb {
+  justify-content: space-between;
+}
 .home_page {
-  padding: 58px 0 80px;
+  padding: 138px 0 80px;
   height: 100vh;
   overflow: auto;
 
@@ -228,9 +344,7 @@ export default {
     // background-color: #fff;
   }
 
-  .jsb {
-    justify-content: space-between;
-  }
+
 
   .goods_box {
     // margin: 14px;
@@ -270,6 +384,7 @@ export default {
           font-size: 16px;
           font-weight: 600;
           letter-spacing: 1px;
+          max-width: 85%;
         }
       }
       &_arraw {