Files
lucky_shop/pages_promotion/fenxiao/index.vue
ZF sun cc39e06161 refactor: replace hardcoded text with language package entries
Replace all inline hardcoded Chinese strings in multiple Vue pages with corresponding language package keys, to unify text management and support multi-language switching.
2026-06-22 11:23:53 +08:00

615 lines
23 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view :style="themeColor">
<view class="fenxiao-index"
:style="fenxiaoIndexPageStyle">
<block v-if="info.fenxiao_id > 0">
<!-- 头部 -->
<view class="fenxiao-index-header" :class="{ 'not-level': !levelList.length }">
<view class="member">
<view class="member-pic">
<image :src="info.headimg ? $util.img(info.headimg) : $util.getDefaultImage().head"
@error="info.headimg = $util.getDefaultImage().head" mode="aspectFill" show-menu-by-longpress/>
<!-- <text class="level-name ">{{ info.level_name }}</text> -->
</view>
<view class="member-info">
<view class="member-info-box">
<text class="name">{{ info.fenxiao_name }}</text>
<p class="level" v-if="info.level_num > 0"><img
:src="$util.img('public/uniapp/fenxiao/index/commissionFission-level.png')"
alt="" class="level-icon">{{ info.level_name }}</p>
</view>
<view class="recommend">{{ $lang('fenxiao.parentAgent') }}:{{ info.parent_name ? info.parent_name : $lang('fenxiao.mainStore') }}</view>
<view class="recommend">{{ $lang('fenxiao.invitedSuccess') }}:{{ teamNum.num }}人<text class="iconfont icon-right"
style="font-size: 24rpx;"></text></view>
</view>
<!-- <view class="promote-rules font-size-tag" @click="$util.redirectTo('/pages_promotion/fenxiao/promote')">
<text class="iconfont icon-wenhao font-size-tag"></text>
推广规则
</view> -->
</view>
<!-- <view class="fenxiao-level-wrap" v-if="levelList.length">
<image :src="$util.img('public/uniapp/fenxiao/index/level_icon.png')" mode="widthFix" class="level-icon"/>
<view class="level-wrap" @click="$util.redirectTo('/pages_promotion/fenxiao/level')">
<view class="title">{{ info.level_num > 0 ? info.level_name : '等级未解锁' }}</view>
<view class="desc">下单、邀请好友均可提升等级</view>
</view>
<view class="btn" @click="$refs.taskPopup.open()" v-if="info.condition.last_level">做任务</view>
</view> -->
</view>
<view class="fenxiao-index-allmoney">
<view class="allmoney-top-money">
<view class="allmoney-top">
<view class="font-size-sub">可{{ fenxiaoWords.withdraw }}(元)</view>
<view class="withdrawal-record"
@click="$util.redirectTo('/pages_promotion/fenxiao/withdraw_list')">
{{ $lang('fenxiao.withdrawalDetail') }}
<text class="iconfont icon-right"></text>
</view>
</view>
<view class="total-commission price-font">{{ info.account }}</view>
</view>
<view class="allmoney-bottom">
<!-- <view class="allmoney-all-wrap" @click="$util.redirectTo('/pages_promotion/fenxiao/bill')">
<view class="title">总{{ fenxiaoWords.account }}</view>
<view class="money price-font">{{ info.total_commission | moneyFormat }}</view>
</view>
<view class="allmoney-all-wrap" @click="$util.redirectTo('/pages_promotion/fenxiao/withdraw_list')">
<view class="title">已提现{{ fenxiaoWords.account }}</view>
<view class="money price-font">{{ info.account_withdraw | moneyFormat }}</view>
</view> -->
<view class="allmoney-all-wrap"
@click="$util.redirectTo('/pages_promotion/fenxiao/withdraw_list')">
<view class="title">{{ $lang('fenxiao.withdrawing') }}(元)<text class="iconfont icon-right"
style="font-size: 24rpx;"></text></view>
<view class="money price-font">{{ info.account_withdraw_apply | moneyFormat }}</view>
</view>
<view class="allmoney-all-wrap"
@click="$util.redirectTo('/pages_promotion/fenxiao/order', { type: 1 })">
<view class="title">{{ $lang('fenxiao.pendingEntry') }}(元)<text class="iconfont icon-right"
style="font-size: 24rpx;"></text></view>
<view class="money price-font">{{ info.in_progress_money | moneyFormat }}</view>
</view>
</view>
<view class="withdraw-btn" @click="$util.redirectTo('/pages_promotion/fenxiao/withdraw_apply')">{{ $lang('fenxiao.withdraw') }}
</view>
</view>
<view class="fenxiao-index-allmoney" style="padding: 0;border-radius:24rpx;margin-top: 0;"
@click="toPoster()">
<image :src="$util.img('public/uniapp/fenxiao/index/commissionFission-qrcode1.png')" mode="widthFix"
style="width: 100%;border-radius:24rpx" show-menu-by-longpress/>
</view>
<!-- 功能列表 -->
<view class="fenxiao-menu-list">
<view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/team')">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/down-line.png')" mode="widthFix" show-menu-by-longpress>
</image>
</view>
<view class="info">
<view class="title">{{ $lang('fenxiao.myFans') }}</view>
<view class="desc">{{ $lang('fenxiao.invitedUsers') }}</view>
</view>
</view>
<view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/withdraw_list')">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/jifenjiangli.png')" mode="widthFix" show-menu-by-longpress>
</image>
</view>
<view class="info">
<view class="title">{{ fenxiaoWords.withdraw }}明细</view>
<view class="desc">{{ $lang('fenxiao.totalCommission') }}¥{{ info.total_commission | moneyFormat }}
</view>
</view>
</view>
<view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/order')">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/fenxiaodingdan.png')" mode="widthFix" show-menu-by-longpress>
</image>
</view>
<view class="info">
<view class="title">{{ fenxiaoWords.concept + $lang('fenxiao.order') }}</view>
<view class="desc">{{ fenxiaoWords.concept + $lang('fenxiao.order') }}{{ $lang('fenxiao.detail') }}</view>
</view>
</view>
<view class="menu-item" @click="toPoster()">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/friend.png')" mode="widthFix" show-menu-by-longpress></image>
</view>
<view class="info">
<view class="title">{{ $lang('fenxiao.myInviteCode') }}</view>
<view class="desc">{{ $lang('fenxiao.inviteFriendsEarn') }}</view>
</view>
</view>
<!-- <view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/promote')">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/code.png')" mode="widthFix" show-menu-by-longpress></image>
</view>
<view class="info">
<view class="title">邀请好友</view>
<view class="desc">邀好友赚好礼</view>
</view>
</view> -->
<!-- <view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/bill')">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/bill.png')" mode="widthFix" show-menu-by-longpress></image>
</view>
<view class="info">
<view class="title">账单报表</view>
<view class="desc">{{ fenxiaoWords.account }}变更明细</view>
</view>
</view>
<view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/goods_list', { templateId: templateId })">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/market.png')" mode="widthFix" show-menu-by-longpress></image>
</view>
<view class="info">
<view class="title">{{ fenxiaoWords.concept }}商品</view>
<view class="desc">{{ fenxiaoWords.concept }}商品</view>
</view>
</view> -->
<!-- <view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/ranking_list', { type: 'profit' })">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/commission_rank.png')" mode="widthFix" show-menu-by-longpress>
</image>
</view>
<view class="info">
<view class="title">{{ fenxiaoWords.account }}排行</view>
<view class="desc">您的排名为第{{ profitRanking }}位</view>
</view>
</view> -->
<!-- <view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/ranking_list', { type: 'invited_num' })">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/promoter_rank.png')" mode="widthFix" show-menu-by-longpress>
</image>
</view>
<view class="info">
<view class="title">推广人排行</view>
<view class="desc">您的排名为{{ invitedNumRanking }}位</view>
</view>
</view> -->
<!-- <view class="menu-item" @click="$util.redirectTo('/pages_promotion/fenxiao/level')" v-if="levelList.length">
<view class="icon-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/team_reward.png')" mode="widthFix" show-menu-by-longpress></image>
</view>
<view class="info">
<view class="title">等级说明</view>
<view class="desc">{{ fenxiaoWords.concept }}等级说明</view>
</view>
</view> -->
</view>
<!-- <view class="fenxiao-team">
<view class="fenxiao-index-other">
<view @click="$util.redirectTo('/pages_promotion/fenxiao/team')" class="all-money-item">
<view class="img-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/down-line.png')" mode="aspectFill" show-menu-by-longpress></image>
</view>
<view class="all-money-tit-wrap">
<text class="all-money-tit">我的粉丝</text>
<text class="all-money-num">{{ teamNum.num }}人</text>
</view>
</view>
</view>
<view class="fenxiao-index-other">
<view @click="$util.redirectTo('/pages_promotion/fenxiao/child_fenxiao')" class="all-money-item">
<view class="img-wrap">
<image :src="$util.img('public/uniapp/fenxiao/index/yejikaohe.png')" mode="aspectFill" show-menu-by-longpress></image>
</view>
<view class="all-money-tit-wrap">
<text class="all-money-tit">{{ fenxiaoWords.fenxiao_name }}</text>
<text class="all-money-num">{{ teamNum.fenxiao_num }}人</text>
</view>
</view>
</view>
</view> -->
</block>
<ns-copyright></ns-copyright>
<view class="empty" v-if="!info.fenxiao_id > 0 && showEmpty">
<image :src="$util.img('public/uniapp/fenxiao/index/no-fenxiao.png')" mode="widthFix" show-menu-by-longpress></image>
<text>您还不是{{ fenxiaoWords.fenxiao_name }},请先提交申请</text>
<view @click="$util.redirectTo('/pages_promotion/fenxiao/apply')" class="color-base-bg">立即加入</view>
</view>
<loading-cover ref="loadingCover"></loading-cover>
<ns-login ref="login"></ns-login>
<uni-popup ref="taskPopup" type="bottom">
<view class="task-popup popup-layer" v-if="levelInfo">
<view class="head-wrap">
<text>快速升级技巧</text>
<text class="iconfont icon-close" @click="$refs.taskPopup.close()"></text>
</view>
<view class="body-wrap">
<view class="equity-content" v-for="(item, index) in levelInfo.task" :key="index">
<text class="subordinate-consumption">
{{ item.title }}
<text class="iconfont icon-wenhao" @click="openTips(item)"></text>
<text class="incomplete">{{ item.progress == 100 ? '已完成' : '未完成' }}</text>
</text>
<view class="circle">
<progress :percent="item.progress" activeColor="#E7B667" stroke-width="4" />
</view>
<text class="zero">{{ item.value }}</text>
<text>/{{ item.condition }}</text>
<text class="to-complete-box" @click="$util.redirectTo('/pages_promotion/fenxiao/promote')">
<text class="to-complete">{{ item.progress == 100 ? '已完成' : '去完成' }}</text>
</text>
</view>
</view>
</view>
</uni-popup>
<uni-popup type="bottom" ref="tips">
<view class="popup">
<view class="popup-header">
<text class="tit">提示</text>
<text class="iconfont icon-close" @click="$refs.tips.close()"></text>
</view>
<view class="popup-body">
<view>{{ tips }}</view>
<view v-if="levelInfo">{{ levelInfo.upgrade_type == 1 ? '满足任意一条件即可升级' : '满足全部条件才能进行升级' }}</view>
</view>
</view>
</uni-popup>
</view>
<!-- 底部tabBar -->
<view id="tab-bar">
<diy-bottom-nav></diy-bottom-nav>
</view>
</view>
</template>
<script>
import fenxiaoWords from '@/common/js/fenxiao-words.js';
export default {
data() {
return {
info: {
fenxiao_name: '',
fenxiao_id: 0
},
showEmpty: false,
teamNum: {
fenxiao_num: 0,
member_num: 0
},
//初始化获取到的模板id
templateId: '',
tips: '',
profitRanking: 0,
invitedNumRanking: 0,
levelList: [],
poster: ''
};
},
mixins: [fenxiaoWords],
onShow() {
if (this.fenxiaoWords && this.fenxiaoWords.concept) this.$langConfig.title(this.fenxiaoWords.concept + '中心');
if (this.storeToken) {
this.checkFenxiaoIsStart();
} else {
this.$nextTick(() => {
this.$refs.login.open('/pages_promotion/fenxiao/index');
});
}
this.getTemplateId();
this.getPoster();
},
onLoad() {
setTimeout(() => {
if (!this.addonIsExist.fenxiao) {
this.$util.showToast({
title: '商家未开启分销',
mask: true,
duration: 2000
});
setTimeout(() => {
this.$util.redirectTo(this.$util.INDEX_PAGE_URL, {}, 'redirectTo');
}, 2000);
}
}, 1000);
this.getFenxiaoLevel();
},
methods: {
toPoster() {
this.$util.redirectTo('/pages_promotion/fenxiao/promote_code', { poster: this.poster, templateId: this.templateId })
},
/**
* 获取分享海报
*/
getPoster() {
this.$api.sendRequest({
url: '/fenxiao/api/fenxiao/posterList',
success: res => {
if (res.code >= 0) {
this.poster = res.data.toString();
this.poster = encodeURIComponent(this.poster);
}
}
});
},
/**
* 检测分销是否开启
*/
checkFenxiaoIsStart() {
this.$api.sendRequest({
url: '/fenxiao/api/config/basics',
success: res => {
if (res.code == 0 && res.data) {
if (res.data.level > 0) {
this.getFenxiaoDetail();
} else {
this.$util.showToast({
title: '商家未开启分销',
mask: true,
duration: 2000
});
setTimeout(() => {
this.$util.redirectTo(this.$util.MEMBER_PAGE_URL);
}, 2000);
}
}
}
});
},
// 获取分销商信息
getFenxiaoDetail() {
this.$api.sendRequest({
url: '/fenxiao/api/fenxiao/detail',
success: res => {
if (res.data) {
if (res.data.status == -1) {
this.$util.showToast({
title: '当前分销商已冻结'
});
setTimeout(() => {
this.$util.redirectTo(this.$util.MEMBER_PAGE_URL);
}, 2000);
return;
}
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
this.info = res.data;
this.getTeamNum();
this.getRanking('invited_num');
this.getRanking('profit');
this.showEmpty = true;
} else {
this.$util.redirectTo('/pages_promotion/fenxiao/apply', {}, 'redirectTo');
}
},
fail: res => {
this.showEmpty = true;
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
}
});
},
//去提现
goTixian() {
this.$util.redirectTo('/pages_promotion/fenxiao/withdraw_apply');
},
toLevel() {
this.$util.redirectTo('/pages_promotion/fenxiao/level');
},
close() {
this.$refs.taskPopup.close();
},
getTeamNum() {
this.$api.sendRequest({
url: '/fenxiao/api/fenxiao/teamnum',
success: res => {
if (res.code >= 0) {
this.teamNum = res.data;
}
}
});
},
/**
* 获取分享海报模板id
*/
getTemplateId() {
this.$api.sendRequest({
url: '/fenxiao/api/fenxiao/posterTemplateIds',
success: res => {
if (res.code >= 0) {
this.templateId = [...res.data].join();
}
}
});
},
moneyFormat(money) {
if (isNaN(parseFloat(money))) return money;
return parseFloat(money).toFixed(2);
},
openTips(data) {
this.tips = data.tips;
this.$refs.tips.open();
},
getRanking(type) {
this.$api.sendRequest({
url: '/fenxiao/api/fenxiao/ranking',
data: {
type: type
},
success: res => {
if (res.code >= 0) {
if (type == 'profit') this.profitRanking = res.data;
if (type == 'invited_num') this.invitedNumRanking = res.data;
}
}
});
},
getFenxiaoLevel() {
this.$api.sendRequest({
url: '/fenxiao/api/Level/lists',
success: res => {
if (res.code == 0 && res.data) {
this.levelList = res.data;
}
}
});
}
},
onBackPress(options) {
if (options.from === 'navigateBack') {
return false;
}
this.$util.redirectTo(this.$util.MEMBER_PAGE_URL, {}, 'reLaunch');
return true;
},
watch: {
storeToken: function (nVal, oVal) {
if (nVal) {
this.checkFenxiaoIsStart();
}
}
},
computed: {
levelInfo() {
if (this.info && this.info.condition && this.info.condition.last_level) {
let level = this.info.condition.last_level;
level.task = [];
level.complete = 0;
if (level.one_fenxiao_order_num > 0) {
let task = {
title: '下级消费',
desc: '下级消费单数满' + level.one_fenxiao_order_num + '单',
tips: '分销商自己购买和自己推荐的直属会员购买的订单次数',
condition: level.one_fenxiao_order_num,
value: this.info.one_fenxiao_order_num,
progress: parseFloat(this.info.one_fenxiao_order_num) > parseFloat(level.one_fenxiao_order_num) ?
100 :
((parseFloat(this.info.one_fenxiao_order_num) / parseFloat(level.one_fenxiao_order_num)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
if (level.one_fenxiao_total_order > 0) {
let task = {
title: '下级消费',
desc: '下级消费金额满' + this.moneyFormat(level.one_fenxiao_total_order) + '元',
tips: '分销商自己购买和推荐的直属会员购买的订单的总额',
condition: this.moneyFormat(level.one_fenxiao_total_order),
value: this.info.one_fenxiao_total_order,
progress: parseFloat(this.info.one_fenxiao_total_order) > parseFloat(level.one_fenxiao_total_order) ?
100 :
((parseFloat(this.info.one_fenxiao_total_order) / parseFloat(level.one_fenxiao_total_order)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
if (level.one_fenxiao_order_money > 0) {
let task = {
title: '下级消费',
desc: '下级消费产生' + this.fenxiaoWords.account + '总额满' + this.moneyFormat(level
.one_fenxiao_order_money) + '元',
tips: '分销商自己购买和自己推荐的直属会员购买的订单' + this.fenxiaoWords.account + '总额',
condition: this.moneyFormat(level.one_fenxiao_order_money),
value: this.info.one_fenxiao_order_money,
progress: parseFloat(this.info.one_fenxiao_order_money) > parseFloat(level.one_fenxiao_order_money) ?
100 :
((parseFloat(this.info.one_fenxiao_order_money) / parseFloat(level.one_fenxiao_order_money)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
if (level.order_num > 0) {
let task = {
title: '自身消费',
desc: '自身消费单数满' + level.order_num + '单',
tips: '分销商自己购买的订单次数',
condition: level.order_num,
value: this.info.order_num,
progress: parseFloat(this.info.order_num) > parseFloat(level.order_num) ? 100 : ((parseFloat(this.info.order_num) / parseFloat(level.order_num)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
if (level.order_money > 0) {
let task = {
title: '自身消费',
desc: '自身消费金额满' + this.moneyFormat(level.order_money) + '元',
tips: '分销商自己购买的订单总额',
condition: this.moneyFormat(level.order_money),
value: this.info.order_money,
progress: parseFloat(this.info.order_money) > parseFloat(level.order_money) ?
100 :
((parseFloat(this.info.order_money) / parseFloat(level.order_money)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
if (level.one_child_num > 0) {
let task = {
title: '邀请好友',
desc: '邀请好友人数达到' + level.one_child_num + '人',
tips: '分销商的直属下级会员人数(包含已经申请成为分销商的)',
condition: level.one_child_num,
value: this.info.one_child_num,
progress: parseFloat(this.info.one_child_num) > parseFloat(level.one_child_num) ?
100 :
((parseFloat(this.info.one_child_num) / parseFloat(level.one_child_num)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
if (level.one_child_fenxiao_num > 0) {
let task = {
title: '邀请好友',
desc: '邀请好友成为分销商人数达到' + level.one_child_fenxiao_num + '人',
tips: '分销商的直属下级分销商人数',
condition: level.one_child_fenxiao_num,
value: this.info.one_child_fenxiao_num,
progress: parseFloat(this.info.one_child_fenxiao_num) > parseFloat(level.one_child_fenxiao_num) ?
100 :
((parseFloat(this.info.one_child_fenxiao_num) / parseFloat(level.one_child_fenxiao_num)) * 100).toFixed(2)
};
if (task.progress == 100) level.complete += 1;
level.task.push(task);
}
level.task_num = level.upgrade_type == 1 ? 1 : level.task.length;
return level;
}
},
fenxiaoIndexPageStyle() {
const style = {
...this.tabBarPagePaddingStyle
};
if (this.$util && this.$util.img) {
style.background = 'url(' + this.$util.img('public/uniapp/fenxiao/index/commissionFission-background.png') + ')';
style.backgroundRepeat = 'no-repeat';
style.backgroundSize = '100%';
}
return this.$util.objToStyle(style);
}
}
};
</script>
<style lang="scss">
@import './public/css/index.scss';
</style>
<style scoped lang="scss">
::v-deep .uni-popup__wrapper {
height: auto;
}
::v-deep .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box,
.uni-popup__wrapper.uni-custom.bottom .uni-popup__wrapper-box {
background: none;
max-height: unset !important;
overflow-y: hidden !important;
}
::v-deep .uni-popup__wrapper {
border-radius: 20rpx 20rpx 0 0;
}
</style>