|
|
@@ -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 {
|