245 lines
6.5 KiB
Vue
245 lines
6.5 KiB
Vue
<template>
|
||
<view class="mine-container" :style="{ height: `${windowHeight}px` }">
|
||
|
||
<!-- 添加tabs管理辣椒资产 -->
|
||
<view class="header">
|
||
<v-tabs
|
||
v-model="current"
|
||
:tabs="icons"
|
||
field="name"
|
||
height="90rpx"
|
||
fontSize="30rpx"
|
||
:fixed="true"
|
||
:scroll="false"
|
||
:zIndex="1000"
|
||
:topOffset="windowTop"
|
||
@change="changeTab">
|
||
</v-tabs>
|
||
</view>
|
||
|
||
<view class="content">
|
||
<account v-if="currentKey === 'account'" :embedded="true"></account>
|
||
<record-index v-else-if="currentKey === 'record'" :embedded="true"></record-index>
|
||
<earn-index v-else-if="currentKey === 'earn'" :embedded="true"></earn-index>
|
||
<coupon-list v-else-if="currentKey === 'coupon'" :embedded="true"></coupon-list>
|
||
</view>
|
||
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getUserBalance,
|
||
getMyRecordsStatistics,
|
||
getIdentity,
|
||
} from "@/api/system/user.js";
|
||
import { mapMutations } from "vuex";
|
||
import vTabs from "@/components/v-tabs/v-tabs.vue";
|
||
import Account from "@/pages/chili/mine/account/account.vue";
|
||
import RecordIndex from "@/pages/chili/mine/record/index.vue";
|
||
import EarnIndex from "@/pages/chili/mine/earn/index.vue";
|
||
import CouponList from "@/pages/chili/mine/account/couponList.vue";
|
||
export default {
|
||
components: { vTabs, Account, RecordIndex, EarnIndex, CouponList },
|
||
data() {
|
||
return {
|
||
icons: [
|
||
{
|
||
icon: require("@/static/my1.png"),
|
||
name: "我的资产",
|
||
link: "/pages/chili/mine/account/account",
|
||
},
|
||
// {
|
||
// icon: require("@/static/my2.png"),
|
||
// name: "打款",
|
||
// // link: "/pages/chili/mine/recharge/recharge",
|
||
// link: "",
|
||
// },
|
||
{
|
||
icon: require("@/static/my3.png"),
|
||
name: "购买记录",
|
||
link: "/pages/chili/mine/record/index",
|
||
},
|
||
{
|
||
icon: require("@/static/my4.png"),
|
||
name: "收益记录",
|
||
link: "/pages/chili/mine/earn/index",
|
||
},
|
||
// {
|
||
// icon: require("@/static/my5.png"),
|
||
// name: "分红收益",
|
||
// link: "/pages/chili/mine/account/withDraw",
|
||
// },
|
||
{
|
||
icon: require("@/static/my6.png"),
|
||
name: "资产明细",
|
||
link: "/pages/chili/mine/account/couponList",
|
||
},
|
||
// {
|
||
// icon: require("@/static/my7.png"),
|
||
// name: "绿色积分明细",
|
||
// link: "/pages/chili/mine/recharge/lsjf",
|
||
// },
|
||
// {
|
||
// icon: require("@/static/my8.png"),
|
||
// name: "贡献值明细",
|
||
// link: "/pages/chili/mine/recharge/xf",
|
||
// },
|
||
],
|
||
balance: 0,
|
||
chuzhonggao: 0,
|
||
tuiguang: 0,
|
||
statistics: {
|
||
ljNum: 0,
|
||
},
|
||
current: 0,
|
||
currentKey: "account",
|
||
|
||
// key 映射，兼容小程序端
|
||
keysMap: {
|
||
"/pages/chili/mine/account/account": "account",
|
||
"/pages/chili/mine/record/index": "record",
|
||
"/pages/chili/mine/earn/index": "earn",
|
||
"/pages/chili/mine/account/couponList": "coupon"
|
||
},
|
||
|
||
name: this.$store.state.user.name,
|
||
// version: getApp().globalData.config.appInfo.version,
|
||
userInfo: JSON.parse(uni.getStorageSync("App-UserInfo")),
|
||
};
|
||
},
|
||
computed: {
|
||
avatar() {
|
||
return this.$store.state.user.avatar;
|
||
},
|
||
windowHeight() {
|
||
// return uni.getSystemInfoSync().windowHeight - 50;
|
||
},
|
||
windowTop() {
|
||
return 'var(--window-top)'
|
||
}
|
||
},
|
||
created() {
|
||
// 初始化默认渲染第一个 tab 对应的页面（映射为 key）
|
||
const first = this.icons && this.icons[0] ? this.icons[0].link : null;
|
||
this.currentKey = first ? (this.keysMap[first] || "account") : "account";
|
||
},
|
||
onShow() {
|
||
this.getUserBalance();
|
||
this.getIdentity();
|
||
this.getMyRecordsStatistics();
|
||
this.checkToken()
|
||
},
|
||
methods: {
|
||
...mapMutations(["logout"]),
|
||
// 顶部 v-tabs 切换时，切换内嵌组件
|
||
changeTab(i) {
|
||
this.current = i;
|
||
const link = this.icons[i] && this.icons[i].link ? this.icons[i].link : null;
|
||
this.currentKey = link ? (this.keysMap[link] || this.currentKey) : this.currentKey;
|
||
},
|
||
//就是点击下边四个tab的时候调用一下这个接口，返回false的话就调用一下退出登录，给他退掉
|
||
checkToken() {
|
||
this.$http("GET", "/user/userCache").then((res) => {
|
||
if (!res.data) {
|
||
this.logout();
|
||
}
|
||
});
|
||
},
|
||
async getIdentity() {
|
||
let res = await getIdentity();
|
||
if (res.code == 200) {
|
||
this.tuiguang = res.data.tuiguang;
|
||
this.chuzhonggao = res.data.chuzhonggao;
|
||
}
|
||
},
|
||
async getUserBalance() {
|
||
let res = await getUserBalance();
|
||
if (res.code == 200) this.balance = res.data.money;
|
||
console.log("res", res);
|
||
},
|
||
async getMyRecordsStatistics() {
|
||
let res = await getMyRecordsStatistics({
|
||
type:1
|
||
});
|
||
if (res.code == 200) {
|
||
for (let key in res.data) {
|
||
if (key == "辣椒") this.statistics.ljNum = res.data[key];
|
||
}
|
||
}
|
||
console.log("res", this.statistics);
|
||
},
|
||
|
||
handleToEditInfo() {
|
||
console.log("1");
|
||
// this.$tab.navigateTo('/pages/chili/mine/info /edit')
|
||
},
|
||
handleToSetting() {
|
||
this.$tab.navigateTo("/pages/chili/mine/setting/index");
|
||
},
|
||
handleToLogin() {
|
||
console.log("1");
|
||
// this.$tab.reLaunch('/pages/chili/login')
|
||
},
|
||
|
||
handleToAvatar() {
|
||
this.$tab.navigateTo("/pages/chili/mine/avatar/index");
|
||
},
|
||
handleLogout() {
|
||
this.$modal.confirm("确定注销并退出系统吗？").then(() => {
|
||
this.$store.dispatch("LogOut").then(() => {
|
||
this.$tab.reLaunch("/pages/chili/index");
|
||
});
|
||
});
|
||
},
|
||
handleHelp() {
|
||
this.$tab.navigateTo("/pages/chili/mine/help/index");
|
||
},
|
||
handleAbout() {
|
||
this.$tab.navigateTo("/pages/chili/mine/about/index");
|
||
},
|
||
handleJiaoLiuQun() {
|
||
this.$modal.showToast("QQ群：133713780");
|
||
},
|
||
handleBuilding(url) {
|
||
if (!url) return this.$msg("暂未开放");
|
||
this.$tab.navigateTo(url);
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style>
|
||
page {
|
||
background-color: #f4f4f4;
|
||
}
|
||
</style>
|
||
<style lang="scss" scoped>
|
||
@import "../common/style/base.scss";
|
||
|
||
/deep/.u-navbar__content__title {
|
||
color: #fff;
|
||
}
|
||
|
||
.team_count {
|
||
font-size: 36rpx;
|
||
margin-left: 178rpx;
|
||
}
|
||
|
||
.mine-container {
|
||
width: 100%;
|
||
height: 100%;
|
||
overflow-y: scroll;
|
||
}
|
||
|
||
.content {
|
||
/deep/ .u-navbar {
|
||
display: none !important;
|
||
}
|
||
/deep/ .u-navbar__placeholder {
|
||
display: none !important;
|
||
}
|
||
}
|
||
</style>
|