From 3ed2cb78a690b64c3b2646d35e1500081186dfa3 Mon Sep 17 00:00:00 2001
From: huzheng12 <52150713+huzheng12@users.noreply.github.com>
Date: Mon, 06 May 2024 00:21:32 +0800
Subject: [PATCH] first commit
---
src/page/promote/index.vue | 217 +++++++++++++++++++++++++++++++++--------------------
1 files changed, 135 insertions(+), 82 deletions(-)
diff --git a/src/page/promote/index.vue b/src/page/promote/index.vue
index d8b049a..27b989c 100644
--- a/src/page/promote/index.vue
+++ b/src/page/promote/index.vue
@@ -1,70 +1,121 @@
<template>
<div class="font-26 promote">
<assets-head :title="$t('推荐')" />
- <div class="advise w-828 h-220 p-40 box-border flex flex-col items-start justify-center"
- :class="{ 'h-260 ': $i18n.locale !== 'CN' }">
- <span v-if="$i18n.locale === 'CN'" class="font-600 font-50" style="color:#273549;">{{ $t('邀请好友，一起赚币') }}</span>
- <span v-else class="font-900 w-445 font-55">{{ $t('邀请好友，一起赚币') }}</span>
- <span class="w-500 mt-20 font-40 font-600" style="color:#273549">{{ $t('马上充值即刻获取佣金') }}</span>
+ <div
+ class="advise w-828 h-220 p-40 box-border flex flex-col items-start justify-center"
+ :class="{ 'h-260 ': $i18n.locale !== 'CN' }"
+ >
+ <span
+ v-if="$i18n.locale === 'CN'"
+ class="font-600 font-50"
+ style="color: #273549"
+ >{{ $t("邀请好友，一起赚币") }}</span
+ >
+ <span v-else class="font-900 w-445 font-55">{{
+ $t("邀请好友，一起赚币")
+ }}</span>
+ <span class="w-500 mt-20 font-40 font-600" style="color: #273549">{{
+ $t("马上充值即刻获取佣金")
+ }}</span>
</div>
<div class="performance-title">
- <div class="performance-title-1 flex-col flex items-start"
- :class="{ 'performance-title-1-1': $i18n.locale !== 'CN' }">
- {{ $t('我的总推广') }}
- <div class="performance-text text-left">{{ promote_list.total && promote_list.total.children }}</div>
+ <div
+ class="performance-title-1 flex-col flex items-start"
+ :class="{ 'performance-title-1-1': $i18n.locale !== 'CN' }"
+ >
+ {{ $t("我的总推广") }}
+ <div class="performance-text text-left">
+ {{ promote_list.total && promote_list.total.children }}
+ </div>
</div>
- <div class="performance-title-2 flex-col flex items-center"
- :class="{ 'performance-title-1-1': $i18n.locale !== 'CN' }">
- {{ $t('总充值') }}
- <div class="performance-text2 text-left">{{ promote_list.recharge_sum ? (promote_list.recharge_sum * 1).toFixed(2)
- :
- '0.00' }}</div>
+ <div
+ class="performance-title-2 flex-col flex items-center"
+ :class="{ 'performance-title-1-1': $i18n.locale !== 'CN' }"
+ >
+ {{ $t("总充值") }}
+ <div class="performance-text2 text-left">
+ {{
+ promote_list.recharge_sum
+ ? (promote_list.recharge_sum * 1).toFixed(2)
+ : "0.00"
+ }}
+ </div>
</div>
- <div class="flex items-center w-160 justify-end colorMain" style="align-self: start">
- <div class="performance-title-3" @click="$router.push('/promote/rules')">{{ $t('规则') }}</div>
+ <div
+ class="flex items-center w-160 justify-end colorMain"
+ style="align-self: start"
+ >
+ <div
+ class="performance-title-3"
+ @click="$router.push('/promote/rules')"
+ >
+ {{ $t("规则") }}
+ </div>
- <img class="performance-title-4" src="../../assets/image/promote/right.png" />
+ <img
+ class="performance-title-4"
+ src="../../assets/image/promote/right.png"
+ />
</div>
</div>
<div class="numberOfPeople">
<div class="numberOfPeople-text flex flex-col align-center">
- {{ $t('一代人数') }}
- <div class="mt-20 numberOfPeople-text4 text-center">{{ promote_list.total && promote_list.total.level_1
- }}</div>
+ {{ $t("一代人数") }}
+ <div class="mt-20 numberOfPeople-text4 text-center">
+ {{ promote_list.total && promote_list.total.level_1 }}
+ </div>
</div>
<div class="numberOfPeople-text2 flex flex-col align-center">
- {{ $t('二代人数') }}
- <div class="mt-20 numberOfPeople-text5 flex-1 text-center ">{{ promote_list.total &&
- promote_list.total.level_2
- }}</div>
+ {{ $t("二代人数") }}
+ <div class="mt-20 numberOfPeople-text5 flex-1 text-center">
+ {{ promote_list.total && promote_list.total.level_2 }}
+ </div>
</div>
<!-- <div style="flex: 1;"></div>-->
<div class="numberOfPeople-text3 flex flex-col align-center">
- {{ $t('三代人数') }}
- <div class="mt-20 numberOfPeople-text6 flex-1 text-center ">{{ promote_list.total &&
- promote_list.total.level_3
- }}</div>
+ {{ $t("三代人数") }}
+ <div class="mt-20 numberOfPeople-text6 flex-1 text-center">
+ {{ promote_list.total && promote_list.total.level_3 }}
+ </div>
</div>
</div>
<div class="Recommend">
- <div class="Recommend-text btnMain text-white" @click="ShareQRCode_push">{{ $t('立即推广') }}</div>
+ <div class="Recommend-text btnMain text-white" @click="ShareQRCode_push">
+ {{ $t("立即推广") }}
+ </div>
</div>
<div class="segmentation-max"></div>
- <div class="MyRecommendation-title">{{ $t('我的推广') }}</div>
- <div style="width: 100%;">
+ <div class="MyRecommendation-title">{{ $t("我的推广") }}</div>
+ <div style="width: 100%">
<van-tabs ref="tabs" v-model="active" sticky animated @change="onChange">
- <van-tab :title="item.title" v-for="item in selectData" :key="item.title" :name="item.type">
+ <van-tab
+ :title="item.title"
+ v-for="item in selectData"
+ :key="item.title"
+ :name="item.type"
+ >
<div class="Recommendation-tab-title">
- <div class="Recommendation-tab-title1">{{ $t('用户名') }}</div>
- <div class="Recommendation-tab-title1">{{ $t('总人数') }}</div>
- <div class="Recommendation-tab-title1">{{ $t('总充值') }}</div>
+ <div class="Recommendation-tab-title1">{{ $t("用户名") }}</div>
+ <div class="Recommendation-tab-title1">{{ $t("总人数") }}</div>
+ <div class="Recommendation-tab-title1">{{ $t("总充值") }}</div>
</div>
- <van-list v-model="loading" :finished="finished" :finished-text="$t('没有更多了')" @load="onLoad"
- :loading-text="$t('加载中...')">
- <div v-for="(item, index) in promote_list_data" :key="index" class="Recommendation-tab">
+ <van-list
+ v-model="loading"
+ :finished="finished"
+ :finished-text="$t('没有更多了')"
+ @load="onLoad"
+ :loading-text="$t('加载中...')"
+ >
+ <div
+ v-for="(item, index) in promote_list_data"
+ :key="index"
+ class="Recommendation-tab"
+ >
<div class="Recommendation-tab1">{{ item.username }}</div>
<div class="Recommendation-tab1">{{ item.reco_sum }}</div>
- <div class="Recommendation-tab1">{{ (item.recharge_sum * 1).toFixed(2) }}</div>
+ <div class="Recommendation-tab1">
+ {{ (item.recharge_sum * 1).toFixed(2) }}
+ </div>
</div>
</van-list>
</van-tab>
@@ -73,14 +124,14 @@
</div>
</template>
<script>
-import { Tab, Tabs } from 'vant';
-import Axiospromote from '@/API/promote.js'
-import { List } from 'vant';
+import { Tab, Tabs } from "vant";
+import Axiospromote from "@/API/promote.js";
+import { List } from "vant";
import assetsHead from "@/components/assets-head";
export default {
data() {
return {
- active: '1',
+ active: "1",
level: 1,
page_no: 1,
promote_list: [],
@@ -90,11 +141,11 @@
finished: false,
pageSize: 10,
selectData: [
- { title: this.$t('一代'), type: '1' },
- { title: this.$t('二代'), type: '2' },
- { title: this.$t('三代'), type: '3' },
- ]
- }
+ { title: this.$t("一代"), type: "1" },
+ { title: this.$t("二代"), type: "2" },
+ { title: this.$t("三代"), type: "3" },
+ ],
+ };
},
components: {
assetsHead,
@@ -107,47 +158,52 @@
},
methods: {
init() {
- this.promote_data()
+ this.promote_data();
},
onLoad() {
// 异步更新数据
- this.promote_data()
+ this.promote_data();
},
promote_data() {
- const t = this
+ const t = this;
this.loading = true;
- Axiospromote.promote({ level: t.level, page_no: t.page_no }).then((res) => {
- console.log(111, res)
- t.promote_list = res.data
- this.promote_list_data = [...this.promote_list_data, ...res.data.list]
- // console.log(logs)
- this.loading = false
- if (res.data.list.length < this.pageSize) {
- this.finished = true
- } else {
- this.page_no++
+ Axiospromote.promote({ level: t.level, page_no: t.page_no }).then(
+ (res) => {
+ console.log(111, res);
+ t.promote_list = res.data;
+ this.promote_list_data = [
+ ...this.promote_list_data,
+ ...res.data.list,
+ ];
+ // console.log(logs)
+ this.loading = false;
+ if (res.data.list.length < this.pageSize) {
+ this.finished = true;
+ } else {
+ this.page_no++;
+ }
+ this.$refs.tabs && this.$refs.tabs.resize();
}
- this.$refs.tabs && this.$refs.tabs.resize();
- })
+ );
},
onClickLeft() {
- this.$router.push('/')
+ this.$router.push("/");
},
ShareQRCode_push() {
- this.$router.push('/ShareQRCode')
+ this.$router.push("/ShareQRCode");
},
onChange(e) {
- this.promote_list_data = []
- this.finished = false
- this.page_no = 1
- this.level = e
+ this.promote_list_data = [];
+ this.finished = false;
+ this.page_no = 1;
+ this.level = e;
this.loading = true;
if (this.loading) {
- this.promote_data()
+ this.promote_data();
}
- }
+ },
},
-}
+};
</script>
<style lang="scss" scoped>
.promote {
@@ -166,8 +222,6 @@
}
}
}
-
-
.advise {
background: url("./invite-bg.png") no-repeat center center;
@@ -194,7 +248,7 @@
font-style: normal;
font-weight: 400;
font-size: 26px;
- color: #848E9C;
+ color: #848e9c;
&.performance-title-1-1 {
width: 250px;
@@ -209,7 +263,7 @@
font-style: normal;
font-weight: 400;
font-size: 26px;
- color: #848E9C;
+ color: #848e9c;
&.performance-title-1-1 {
font-size: 26px;
@@ -243,7 +297,7 @@
font-style: normal;
font-weight: 600;
font-size: 66px;
- color: #2EBD85;
+ color: #2ebd85;
margin-top: 22px;
}
@@ -252,7 +306,7 @@
font-style: normal;
font-weight: 600;
font-size: 66px;
- color: #2EBD85;
+ color: #2ebd85;
margin-top: 22px;
}
@@ -274,7 +328,7 @@
font-weight: 400;
text-align: center;
font-size: 26px;
- color: #848E9C;
+ color: #848e9c;
}
.numberOfPeople2 {
@@ -300,7 +354,6 @@
color: themed("text_color");
}
}
-
.Recommend {
padding-right: 35px;
@@ -363,7 +416,7 @@
font-size: 30px;
line-height: 85px;
text-align: center;
- color: #868D9A;
+ color: #868d9a;
}
.Recommendation-tab {
--
Gitblit v1.9.3