mall_client/zyhs3_uniapp/pages/licai/mine/index.vue

545 lines
13 KiB
Vue
Raw Permalink Normal View History

2026-03-13 07:50:35 +00:00
<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">
<!-- 选中 Tab 对应页面渲染区域小程序端不支持动态组件改为静态分支 -->
<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 class="cardContent" style="display: none;">
<view class="card">
<view class="info">
<!-- 多少棵 -->
<view class="line">
<view class="logo">
<image src="@/static/ic_bl.png" />
</view>
<view class="label">槟榔:</view>
<view class="value">{{ statistics["ljNum"] }}</view>
<view class="label"></view>
</view>
<u-gap height="5"></u-gap>
<!-- 级别 -->
<view class="line">
<view class="logo_no"> </view>
<view class="label">级别:</view>
<view class="value" v-if="pageload">
{{ abc_level.find(i => i.dictValue == chuzhonggao).dictLabel || '无级别' }}
</view>
<view v-else>正在获取中...</view>
</view>
<u-gap height="5"></u-gap>
<!-- 推广商 -->
<view class="line">
<view class="logo_no"> </view>
<view class="label">代理:</view>
<view class="value" v-if="pageload">
{{agency_level.find(i => i.dictValue == agencyLevel).dictLabel || '无级别'}}
</view>
<view v-else>正在获取中...</view>
</view>
</view>
</view>
</view>
<!-- 顶部卡片END -->
<view class="container" style="display: none;">
<!-- 按钮组START -->
<view class="btn_group">
<u-gap height="10"></u-gap>
<view class="content">
<view class="item" v-for="(v, i) in icons" :key="i" @click="handleBuilding(v.link)">
<view class="icon">
<image :src="v.icon" mode="heightFix" />
</view>
<view class="name">{{ v.name }}</view>
</view>
</view>
</view>
<!-- 按钮组END -->
</view>
<!-- 代理等级 -->
<u-popup :show="dldjShow" mode="center" round="10">
<view class="dldj-box">
<view class="dldj-title">{{ dlInfo.status == 0?'代理等级申请中':dlInfo.status == 1? '代理等级申请被驳回':'申请代理等级' }}
</view>
<view class="dldj-input" @click="dlPickerShow = true">
<text>
{{dlLevel != null ? agency_level.find(i => i.dictValue == dlLevel).dictLabel || '请选择':'请选择' }}
</text>
<u-icon name="arrow-right" size="12"></u-icon>
</view>
<view class="dldj-btns">
<u-button size="mini" :text="dlInfo.status == 0? '修改申请':'申请' " type="success"
@click="applyBlAgency"></u-button>
<u-button size="mini" text="关闭" type="info" @click="closeDldj"></u-button>
</view>
</view>
</u-popup>
<u-picker v-if="agency_level.length" :show="dlPickerShow" :columns="[agency_level.slice(1)]" keyName="dictLabel"
@confirm="dlConfirm" @cancel="dlPickerShow = false"></u-picker>
</view>
</template>
<script>
import {
getUserBalance,
getMyRecordsStatistics,
getIdentity,
getAbclevel,
getAgencylevel,
applyBlAgency,
getMyAgencyRecord
} from "@/api/system/user.js";
import {
mapMutations
} from "vuex";
import vTabs from "@/components/v-tabs/v-tabs.vue";
// 引入需要内嵌展示的页面组件
import Account from "@/pages/licai/mine/account/account.vue";
import RecordIndex from "@/pages/licai/mine/record/index.vue";
import EarnIndex from "@/pages/licai/mine/earn/index.vue";
import CouponList from "@/pages/licai/mine/account/couponList.vue";
export default {
components: { vTabs, Account, RecordIndex, EarnIndex, CouponList },
data() {
return {
icons: [{
icon: require("@/static/my1.png"),
name: "我的资产",
link: "/pages/licai/mine/account/account",
},
// {
// icon: require("@/static/my2.png"),
// name: "打款",
// link: "/pages/licai/mine/recharge/recharge",
// },
{
icon: require("@/static/my3.png"),
name: "购买记录",
link: "/pages/licai/mine/record/index",
},
{
icon: require("@/static/my4.png"),
name: "收益记录",
link: "/pages/licai/mine/earn/index",
},
// {
// icon: require("@/static/my5.png"),
// name: "分红收益",
// link: "/pages/licai/mine/account/withDraw",
// },
{
icon: require("@/static/my6.png"),
name: "资产明细",
link: "/pages/licai/mine/account/couponList",
},
// {
// icon: require("@/static/my5.png"),
// name: "代理申请",
// link: "dldj",
// },
// {
// icon: require("@/static/my7.png"),
// name: "绿色积分明细",
// link: "/pages/licai/mine/recharge/lsjf",
// },
// {
// icon: require("@/static/my8.png"),
// name: "贡献值明细",
// link: "/pages/licai/mine/recharge/xf",
// },
],
balance: 0,
pageload:false,
chuzhonggao: 0,
tuiguang: 0,
agencyLevel: 0,
statistics: {
ljNum: 0,
},
name: this.$store.state.user.name,
// version: getApp().globalData.config.appInfo.version,
userInfo: JSON.parse(uni.getStorageSync("App-UserInfo")),
abc_level: [],
agency_level: [],
dldjShow: false,
dlInfo: {},
dlLevel: null,
dlPickerShow: false,
current: 0,
// key 映射,兼容小程序端
keysMap: {
"/pages/licai/mine/account/account": "account",
"/pages/licai/mine/record/index": "record",
"/pages/licai/mine/earn/index": "earn",
"/pages/licai/mine/account/couponList": "coupon"
},
currentKey: "account"
};
},
computed: {
avatar() {
return this.$store.state.user.avatar;
},
windowHeight() {
return uni.getSystemInfoSync().windowHeight;
},
// 顶部原生导航(或状态栏)高度,用于 fixed 元素偏移
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";
},
async onShow() {
await this.getAbclevel();
await this.getAgencylevel();
await this.getUserBalance();
await this.getIdentity();
await this.getMyRecordsStatistics();
await this.checkToken()
this.pageload = true
},
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 getAbclevel() {
let res = await getAbclevel();
if (res.code == 200) {
this.abc_level = res.data
}
},
async getAgencylevel() {
let res = await getAgencylevel();
if (res.code == 200) {
this.agency_level = res.data
}
},
async getIdentity() {
let res = await getIdentity();
if (res.code == 200) {
this.tuiguang = res.data.tuiguang;
this.chuzhonggao = res.data.abcLevel;
this.agencyLevel = res.data.blAgencyLevel;
}
},
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: 2
});
console.log(res, "槟榔统计")
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/licai/mine/info /edit')
},
handleToSetting() {
this.$tab.navigateTo("/pages/licai/mine/setting/index");
},
handleToLogin() {
console.log("1");
// this.$tab.reLaunch('/pages/licai/login')
},
handleToAvatar() {
this.$tab.navigateTo("/pages/licai/mine/avatar/index");
},
handleLogout() {
this.$modal.confirm("确定注销并退出系统吗?").then(() => {
this.$store.dispatch("LogOut").then(() => {
this.$tab.reLaunch("/pages/licai/index");
});
});
},
handleHelp() {
this.$tab.navigateTo("/pages/licai/mine/help/index");
},
handleAbout() {
this.$tab.navigateTo("/pages/licai/mine/about/index");
},
handleJiaoLiuQun() {
this.$modal.showToast("QQ群133713780");
},
handleBuilding(url) {
if (url == 'dldj') {
this.openDldj()
return
}
if (!url) return this.$msg("暂未开放");
this.$tab.navigateTo(url);
},
openDldj() {
getMyAgencyRecord().then(res => {
if (res.code == 200) {
if(res.data.status == 1){
this.$msg("你已申请过代理等级");
return
}
this.dlInfo = res.data
this.dldjShow = true
this.dlLevel = res.data.newLevel
}
})
},
closeDldj() {
this.dldjShow = false
},
dlConfirm(e) {
this.dlLevel = e.value[0].dictValue
this.dlPickerShow = false
},
applyBlAgency() {
if (this.dlLevel == null) {
return this.$msg("请选择会员等级")
}
applyBlAgency({
id: this.dlInfo.id,
applyLevel: this.dlLevel
}).then(res => {
if (res.code == 200) {
this.$modal.showToast("操作成功,请等待审核");
this.dldjShow = false
}
}).catch(err => {
return this.$msg(err.message)
})
}
},
};
</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;
}
.cardContent {
min-height: 200px;
background-image: linear-gradient(to bottom,
rgba(75, 178, 46, 1) 0%,
rgba(75, 178, 46, 1) 70%,
rgba(75, 178, 46, 0) 100%);
padding: 20rpx;
box-sizing: border-box;
.card {
width: 100%;
height: 358rpx;
background-image: url("~@/static/cardContent.png");
background-size: 100% 100%;
margin-bottom: 20rpx;
}
}
.info {
padding-top: 40rpx;
padding-left: 40rpx;
.line {
display: flex;
align-items: center;
.logo_no {
width: 45rpx;
}
.logo {
width: 45rpx;
height: 45rpx;
background: #fff;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
image {
width: 26rpx;
height: 35rpx;
}
}
.label {
color: #ccc;
margin: 0 12rpx;
font-size: 30rpx;
font-weight: 400;
}
.value {
color: #efe3bc;
font-size: 30rpx;
font-weight: 600;
}
.level {
width: 42rpx;
height: 34rpx;
margin-right: 10rpx;
}
}
}
/* 已移除 three_data 模块,删除对应样式 */
.container {
padding: 0 20rpx;
box-sizing: border-box;
}
/* 已移除 two_link 模块,删除对应样式 */
.btn_group {
background: #fff;
border-radius: 15rpx;
padding: 20rpx 30rpx 0 30rpx;
box-sizing: border-box;
.content {
display: flex;
flex-wrap: wrap;
.item {
width: 25%;
margin-bottom: 50rpx;
// border: 1px solid red;
display: flex;
flex-direction: column;
align-items: center;
.icon {
height: 60rpx;
// border: 1px solid red;
image {
height: 100%;
}
}
.name {
font-size: 28rpx;
color: #111;
margin-top: 12rpx;
font-weight: 500;
}
}
}
}
.dldj-box {
padding: 30rpx 20rpx 40rpx;
width: 600rpx;
.dldj-title {
text-align: center;
font-size: 26rpx;
margin-bottom: 30rpx;
}
.dldj-input {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 40rpx;
border: solid 1rpx #eee;
padding: 10rpx;
border-radius: 10rpx;
font-size: 22rpx;
}
.dldj-btns {
.u-button {
margin-top: 20rpx;
height: 70rpx;
}
}
}
.bl-subsection {
padding: 9rpx 18rpx;
background-color: #FFFFFF;
}
/* 内嵌页面时,统一隐藏子页面内部的 u-navbar仅作用于本页的 .content 容器内) */
.content {
/deep/ .u-navbar {
display: none !important;
}
/deep/ .u-navbar__placeholder {
display: none !important;
}
}
</style>