angelo
/
web-africa-h5
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
web-africa-h5/pages/user/index/index.vue

727 lines
21 KiB
Vue
Raw Normal View History

## 初始化；
2025-03-21 14:49:01 +08:00
<template>
<view class="pr pb100 o-h box-s-b" style="width: 750rpx;">
<view class="user-bg"></view>
<view class="user-top d-b-s white">
<view class="flex-1">
<view class=" d-b-s ww100">
<image class="user-ava" :src="userInfo.headPath || userInfo.countryCircularIcon" mode=""></image>
<view class="user-info d-c d-b-s flex-1">
<view class="d-s-c mb10">
<text class="f28 fb mr20">{{ userInfo.memberName }}</text>
<!-- <view class="grad-btn d-c-c">
<image class="menber-icon" src="/static/icon/menber-icon.png" mode=""></image>
<text>{{userData.awardsVal}}</text>
</view> -->
<view class="d-s-c">
<image @click="gotoPage('/pages/user/grade/index')" class="vip-icon"
v-if="userInfo.gradeIcon" :src="userInfo.gradeIcon" mode=""></image>
<!-- <image class="vip-icon" v-if="userInfo.awardsIcon" :src="userInfo.awardsIcon" mode=""></image> -->
</view>
</view>
<view class="f22">{{ $t('MN_T_1') }}:{{ userInfo.memberCode }}</view>
</view>
</view>
</view>
<view class="d-c d-b-e user-info">
<view class="icon iconfont icon-shezhi1" @click="gotoPage('pages/user/set/index')"></view>
</view>
</view>
<view class="f24 pr d-b-c" style="margin-top: 7rpx;z-index: 1;padding: 0 26rpx 0 22rpx;">
<view class="flex-1 d-s-c ml105">
<view class="grade-box" v-if="userData.registerAuthority != 0">
<u-icon name="/static/icon/user-fw.png" size="24rpx"></u-icon>
<text class="ml10">{{ userData.registerAuthorityVal }}</text>
</view>
<view class="grade-box" v-if="userData.isMakerSpace == 0">
<u-icon name="/static/icon/user-ck.png" size="24rpx"></u-icon>
<text class="ml10">{{ $t('MN_F_T_34') }}</text>
</view>
</view>
<!-- <view class="d-c-c" @click="gotoPage('/pages/user/awardTitle/index')">
<text class="mr10 white">{{ $t('ENU_MENU_103') }}</text>
<u-icon name="arrow-right" size="26rpx" color="#fff"></u-icon>
</view> -->
<view class="d-c-c" @click="gotoPage('/pages/user/awards/index')">
<text class="mr10 white">{{ $t('ENU_MENU_103') }}</text>
<u-icon name="arrow-right" size="26rpx" color="#fff"></u-icon>
</view>
</view>
<view class="my-grade">
<view class="border-b grade-title">{{ userInfo.pkAwardsVal }}</view>
<view class="d-b-c pt20">
<view class="flex-1 silder-box d-c">
<view class="f24 gray6" v-if="awardsinfo.targetPv != -1" >
<text>{{ $t('S_L_1') }} {{ awardsinfo.tarAwardsName }} {{ $t('S_L_2') }}:</text>
<text class="domation fb">
{{ (awardsinfo.targetPv * 1 - awardsinfo.sumRealPv * 1 > 0 ? awardsinfo.targetPv * 1 - awardsinfo.sumRealPv * 1 : 0).toFixed(2) }}
</text>
<text class="domation fb">{{ $t('fn_136') }}</text>
</view>
<view class="f24 gray6" v-if="awardsinfo.targetPv == -1">{{ $t('S_L_3') }}</view>
<view class="user-silder" v-if="awardsinfo.targetPv * 1 > 0">
<view :style="'width: ' + ((awardsinfo.sumRealPv * 1) / (awardsinfo.targetPv * 1)) * 100 + '%;'"
class="user-silder-active"></view>
</view>
<view class="user-silder all" v-else>
<view style="width:100%" class="user-silder-active"></view>
</view>
</view>
<image @click="gotoPage('/pages/user/grade/index?type=1')" class="my-grade-img"
v-if="userInfo.awardsIcon" :src="userInfo.awardsIcon" mode=""></image>
</view>
</view>
<annuity :userInfo="userInfo"></annuity>
<view class="my-assets">
<view class="my-assets-all">
<view class="f28">{{ $t('N_I_247') }}</view>
<view class="gray9 f24" @click="gotoPage('/pages/order/myorder')">
{{ $t('MY_ORD_54') }}
<text class="icon iconfont icon-jiantou"></text>
</view>
</view>
<view class="d-b-c w100 p-20-0">
<view v-for="(item,index) in orderStatus" :key="index" class="item" @click="gotoOrder(item.value)">
<view class="icon-box pr">
<image :src="'/static/icon/user/order0'+(index+1)+'.png'" mode=""></image>
<text class="dot d-c-c"
v-if="item.value==0&&orderCount.waitPayNum != null && orderCount.waitPayNum > 0">{{ orderCount.waitPayNum }}</text>
<text class="dot d-c-c"
v-if="item.value==1&&orderCount.payNum != null && orderCount.payNum > 0">{{ orderCount.payNum }}</text>
</view>
<text>{{item.label }}</text>
</view>
<!-- <view class="item" @click="gotoPage('/pages/order/myorder?dataType=1')">
<view class="icon-box pr">
<image src="/static/icon/user/order02.png" mode=""></image>
<text class="dot d-c-c"
v-if="orderCount.payNum != null && orderCount.payNum > 0">{{ orderCount.payNum }}</text>
</view>
<text class="">{{ $t('ENU_ORDER_S_1') }}</text>
</view>
<view class="item" @click="gotoPage('/pages/order/myorder?dataType=4')">
<view class="icon-box pr">
<image src="/static/icon/user/order04.png" mode=""></image>
</view>
<text>{{ $t('ENU_ORDER_S_5') }}</text>
</view> -->
</view>
</view>
<view class="menu-list-2" v-if="listmenu">
<view class="my-assets-all m-0-20">
<view class="f28">{{ $t('ENU_MENU_50') }}</view>
</view>
<view class="menu-list-list">
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/index?openIndex=-1')"
v-if="hasMenu('ConsanguinityCheck')">
<image class="menu-icon" src="/static/icon/user/cc01.png" mode=""></image>
<view>{{ $t('MN_F_49') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/index?openIndex=0')"
v-if="hasMenu('incomeDetail')">
<image class="menu-icon" src="/static/icon/user/cc03.png" mode=""></image>
<view>{{ $t('ENU_MENU_530') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/bonus-source/index')"
v-if="hasMenu('bonusSource')">
<image class="menu-icon" src="/static/icon/user/cc08.png" mode=""></image>
<view>{{ $t('ENU_MENU_540') }}</view>
</view>
<!-- 考核明细隐藏 -->
<!-- <view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/index?openIndex=1')" v-if="hasMenu('appraisal')">
<image class="menu-icon" src="/static/icon/user/cc04.png" mode=""></image>
<view>{{ $t('ENU_MENU_560') }}</view>
</view> -->
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/registration-list/index')"
v-if="hasMenu('registration')">
<image class="menu-icon" src="/static/icon/user/cc05.png" mode=""></image>
<view>{{ $t('ENU_MENU_570') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/index?openIndex=2')"
v-if="hasMenu('investment')">
<image class="menu-icon" src="/static/icon/user/cc06.png" mode=""></image>
<view>{{ $t('ENU_MENU_580') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/statistic-analysis/index')"
v-if="hasMenu('statistics')">
<image class="menu-icon" src="/static/icon/user/cc07.png" mode=""></image>
<view>{{ $t('w_0420') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/market/activity-zone/index')"
v-if="hasMenu('activeZone')">
<image class="menu-icon" src="/static/icon/user/cc02.png" mode=""></image>
<view>{{ $t('ENU_MENU_520') }}</view>
</view>
<!-- <view class="d-c-c d-c menu-item" v-if="hasMenu('frame')" @click="gotoPage('/pages/member-area/architecture/index')">
<image class="menu-icon" src="/static/icon/user/cc10.png" mode=""></image>
<view>{{ $t('MN_F_T_42') }}</view>
</view> -->
<view class="d-c-c d-c menu-item" v-if="hasMenu('frame')"
@click="gotoPage('/pages/architecture/architecture')">
<image class="menu-icon" src="/static/icon/user/cc10.png" mode=""></image>
<view>{{ $t('MN_F_T_42') }}</view>
</view>
</view>
</view>
<view class="menu-list" v-if="listmenu">
<view class="d-c-c d-c menu-item" @click="openWallet" v-if="hasMenu('wallet')">
<image class="menu-icon" src="/static/icon/user/gj01.png" mode=""></image>
<view>{{ $t('N_I_246') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/pickup-area/index')" v-if="hasMenu('pickGoods')">
<image class="menu-icon" src="/static/icon/user/gj02.png" mode=""></image>
<view>{{ $t('N_I_248') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/electron-card/index')">
<image class="menu-icon" src="/static/icon/user/electron.png" mode=""></image>
<view>{{ $t('PER_DA_13') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/maker-space/index')" v-if="hasMenu('space')">
<image class="menu-icon" src="/static/icon/user/gj03.png" mode=""></image>
<view>{{ $t('ENU_APPROVE_B_141') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/self-service/index')" v-if="hasMenu('selfHelp')">
<image class="menu-icon" src="/static/icon/user/gj04.png" mode=""></image>
<view>{{ $t('ENU_MENU_905') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('pages/user/set/security')">
<image class="menu-icon" src="/static/icon/user/gj05.png" mode=""></image>
<view>{{ $t('w_0026') }}</view>
</view>
<!-- 隐藏地址管理 -->
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/address/address')">
<image class="menu-icon" src="/static/icon/user/gj06.png" mode=""></image>
<view>{{ $t('w_0027') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/card/list')">
<image class="menu-icon" src="/static/icon/user/gj07.png" mode=""></image>
<view>{{ $t('MY_WAL_3') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/feedback/feedback')">
<image class="menu-icon" src="/static/icon/user/cc02.png" mode=""></image>
<view>{{ $t('S_L_15') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="changelang()">
<image class="menu-icon" src="/static/icon/user/gj08.png" mode=""></image>
<view>{{ $t('MY_ORD_55') }}</view>
</view>
<!-- 关于我们 -->
<!-- <view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/about/index')">
<image class="menu-icon" src="/static/icon/user/gj09.png" mode=""></image>
<view>{{ $t('w_0006') }}</view>
</view> -->
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/affiliate/index')">
<image class="menu-icon" src="/static/icon/user/address.png" mode=""></image>
<view>{{ $t('MN_F_T_742') }}{{ $t('S_C_88') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/honor/index')">
<image class="menu-icon" src="/static/icon/user/honor.png" mode=""></image>
<!-- <view>{{ $t('MN_F_T_137') }}</view> -->
<view>{{ $t('APP_ADD_12') }}</view>
</view>
<!-- 创客空间隐藏 -->
<!-- <view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/makerSpace/index')">
<image class="menu-icon" src="/static/icon/user/makerSpace.png" mode=""></image>
<view>{{ $t('ENU_G_C_7') }}</view>
</view> -->
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/goal/list')" v-if="hasMenu('iTarget')">
<image class="menu-icon" src="/static/icon/user/goal.png" mode=""></image>
<view>{{ $t('S_C_1') }}</view>
</view>
<!-- 达人隐藏 -->
<!-- <view class="d-c-c d-c menu-item" @click="openDetail()">
<image class="menu-icon" src="/static/icon/user/gj05.png" mode=""></image>
<view>{{ $t('APP_ADD_11') }}</view>
</view> -->
<!-- 礼品地址隐藏 -->
<!-- <view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/gift/index')">
<image class="menu-icon" src="/static/icon/user/gift.png" mode=""></image>
<view>{{ $t('PER_DA_19') }}</view>
</view> -->
<!-- 公告 -->
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/notice/index')">
<image class="menu-icon" src="/static/icon/user/gift.png" mode=""></image>
<view>{{ $t('MN_F_T_82') }}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/performance/index')">
<image class="menu-icon" src="/static/icon/user/performance.png" mode=""></image>
<view>{{ $t('S_C_71') }}</view>
</view>
<view class="d-c-c d-c menu-item" v-if="userInfo.pkStore" @click="gotoPage('/pages/order/store')">
<image class="menu-icon" src="/static/icon/user/dpdd.png" mode=""></image>
<view>{{$t('fn_001')}}</view>
</view>
<view class="d-c-c d-c menu-item" v-if="userInfo.pkStore" @click="gotoPage('/pages/order/memberStoreOrder')">
<image class="menu-icon" src="/static/icon/user/dpdd.png" mode=""></image>
<view>{{$t('fn_146')}}</view>
</view>
<view class="d-c-c d-c menu-item" @click="gotoPage('/pages/user/personalServices/index')">
<image class="menu-icon" src="/static/icon/user/grff.png" mode=""></image>
<view>{{$t('fn_125')}}</view>
</view>
</view>
<button @click="loginOut()" class="normal-sub-btn">{{ $t('w_0028') }}</button>
<ranking :isPop="isDetail" :detail="detailModel" @close="closeDetail"></ranking>
<popIntu :isShow="isWallet" :title="$t('MY_WAL_21')" password :placeholder="$t('PER_DA_50')"
@close="closeWallet"></popIntu>
</view>
</template>
<script>
import popIntu from '@/components/pop-input.vue';
import ranking from './detail.vue';
import annuity from '@/components/annuity/index.vue';
export default {
components: {
popIntu,
ranking,
annuity
},
data() {
return {
isDetail: false,
detailModel: null,
userInfo: {},
userData: {},
listmenu: [],
orderCount: {
waitPayNum: 0,
payNum: 0
},
isWallet: false,
awardsinfo: {
pkTransaction: 0,
pkTransactionVal: '',
sumRealPv: '',
tarAwardsName: '',
targetPv: ''
},
orderStatus: []
};
},
onLoad: function(options) {
this.getMenu();
this.getCartNum();
this.getOrderStatus();
this.getOrderNumData();
},
onShow() {
this.getUserData();
this.getUserInfoData();
this.getAwards();
},
methods: {
gotoOrder(e) {
this.gotoPage('/pages/order/myorder?dataType=' + e)
},
getOrderStatus() {
let self = this;
feat(global): 国际化及配置处理
2025-08-28 10:54:21 +08:00
self._get('system/pub/enums/order-status-api', {}, res => {
## 初始化；
2025-03-21 14:49:01 +08:00
self.orderStatus = res.data;
})
},
closeDetail() {
this.isDetail = false;
this.detailModel = null;
},
openDetail(e) {
this.detailModel = e;
this.isDetail = true;
},
getAwards() {
let self = this;
self._get('member/api/member/index-member-awards', {}, res => {
self.awardsinfo = res.data;
});
},
getOrderNumData() {
let self = this;
self.loading = true;
self._get(
'sale/api/my-order/num', {},
function(res) {
self.orderCount = res.data;
}, {},
() => {
self.loading = false;
}
);
},
getCartNum() {
let self = this;
self._get(
'sale/api/shopping/getShoppingCount', {
specialArea: '',
pkCountry: ''
},
res => {
uni.setTabBarBadge({
index: 2,
text: res.data.cont + ''
});
}
);
},
hasMenu(key) {
let self = this;
let flag = false;
self.listmenu.forEach((item, index) => {
if (item.menuKey == key) {
flag = true;
}
});
return flag;
},
getMenu() {
let self = this;
self._get('system/api/menu/list', {}, res => {
let list = [];
let arr = res.data;
arr.forEach((item, index) => {
list.push(item);
});
self.listmenu = list;
});
},
// 获取用户信息
getUserInfoData() {
let self = this;
self.loadding = true;
self._get('member/api/member/get-info', {}, function(res) {
if (res.code == 200) {
self.userInfo = res.data;
}
uni.setStorageSync('currencyIcon', res.data.currencyIcon);
self.loadding = false;
uni.hideLoading();
});
},
// 获取用户信息
getUserData() {
let self = this;
self.loadding = true;
self._get('member/api/member/get-data', {}, function(res) {
if (res.code == 200) {
self.userData = res.data;
}
self.loadding = false;
uni.hideLoading();
});
},
openWallet() {
this.isWallet = true;
},
closeWallet(e) {
let self = this;
if (e) {
self._get(
'/member/api/recharge/check-pwd', {
pwd: e
},
res => {
self.gotoPage('/pages/user/my-wallet/index');
}
);
}
this.isWallet = false;
},
/*发送短信*/
loginOut() {
let self = this;
self._delete('member/auth/api/logout', '', result => {
if (result.code == 200) {
uni.removeStorageSync('Admin-Token');
uni.removeStorageSync('expires_in');
self.gotoPage('/login');
}
});
}
}
};
</script>
<style lang="scss">
.user-bg {
position: absolute;
left: -375rpx;
top: -500rpx;
z-index: 0;
width: 1500rpx;
height: 1060rpx;
border-radius: 50%;
background-color: #e74435;
}
.user-top {
width: 750rpx;
// height: 331rpx;
position: relative;
z-index: 1;
padding: 77rpx 25rpx 0 22rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
}
.grad-btn {
// width: 146rpx;
height: 46rpx;
line-height: 46rpx;
padding: 0 18rpx;
background: rgba(#000, 0.25);
border-radius: 23rpx;
margin-left: 22rpx;
}
.menber-icon {
width: 23rpx;
height: 18rpx;
margin-right: 7rpx;
}
.user-info {
// height: 88rpx;
}
.user-ava {
width: 88rpx;
height: 88rpx;
border-radius: 50%;
display: block;
margin-right: 18rpx;
}
.icon.icon-shezhi1 {
font-size: 44rpx;
color: #fff;
}
.vip-icon {
width: 59rpx;
height: 59rpx;
margin-right: 26rpx;
display: block;
}
.menu-list {
width: 708rpx;
box-sizing: border-box;
margin: 0 20rpx 0 22rpx;
background-color: #fff;
border-radius: 20rpx;
padding: 32rpx 0 10rpx 0;
position: relative;
z-index: 2;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
}
.menu-list-2 {
width: 708rpx;
box-sizing: border-box;
margin: 0 20rpx 0 22rpx;
background-color: #fff;
border-radius: 20rpx;
padding: 0 0 10rpx 0;
position: relative;
z-index: 2;
margin-bottom: 24rpx;
}
.menu-list-list {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
padding-top: 20rpx;
}
.menu-item {
width: 33.3%;
font-size: 24rpx;
flex-shrink: 0;
margin-bottom: 28rpx;
word-break: break-all;
padding: 0 10rpx;
box-sizing: border-box;
text-align: center;
}
.menu-item>view {
line-height: 1.5;
height: 64rpx;
}
.menu-title {
height: 100rpx;
line-height: 100rpx;
}
.menu-icon {
width: 88rpx;
height: 88rpx;
display: block;
margin-bottom: 6rpx;
}
.icon.icon-jiantou {
font-size: 26rpx;
color: #999;
}
.normal-sub-btn {
margin: 50rpx auto;
}
.my-assets {
width: 708rpx;
box-sizing: border-box;
margin: 0 20rpx 0 22rpx;
padding: 22rpx;
padding-top: 0;
padding-bottom: 0;
background: #ffffff;
border-radius: 20rpx;
z-index: 2;
position: relative;
margin-bottom: 24rpx;
}
.my-assets .item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
word-break: break-all;
}
.my-assets .item>text {
text-align: center;
}
.my-assets .icon-box image {
width: 72rpx;
height: 72rpx;
}
.my-assets .icon-box {
// width: 60rpx;
// height: 60rpx;
}
.my-assets .icon-box .iconfont {
font-size: 50rpx;
color: #333333;
}
.my-assets .icon-box .dot {
position: absolute;
top: 0rpx;
right: -14rpx;
height: 25rpx;
min-width: 25rpx;
padding: 4rpx;
border-radius: 20rpx;
font-size: 20rpx;
background: #3d3d3d;
color: #ffffff;
}
.my-assets-all {
display: flex;
justify-content: space-between;
align-items: center;
height: 90rpx;
line-height: 90rpx;
border-bottom: 1rpx solid #eee;
}
.my-assets-all .icon.icon-jiantou {
font-size: 12px;
color: #999999;
}
.my-grade {
width: 708rpx;
box-sizing: border-box;
margin: 0 20rpx 0 22rpx;
padding: 22rpx;
padding-top: 0;
padding-bottom: 0;
background: #ffffff;
border-radius: 20rpx;
// margin-top: -92rpx;
z-index: 2;
position: relative;
margin-bottom: 24rpx;
padding-bottom: 20rpx;
// height: 134rpx;
// display: flex;
// justify-content: space-between;
// align-items: center;
margin-top: 28rpx;
}
.grade-title {
height: 77rpx;
display: flex;
justify-content: flex-start;
align-items: center;
font-size: 24rpx;
color: #666;
font-weight: bold;
}
.my-grade-img {
width: 104rpx;
height: 94rpx;
margin-left: 4rpx;
}
.silder-box {
height: 74rpx;
display: flex;
justify-content: space-between;
align-items: baseline;
}
.user-silder {
width: 100%;
height: 18rpx;
background: #eeeeee;
border-radius: 9rpx;
position: relative;
}
.user-silder-active {
max-width: 100%;
position: absolute;
left: 0;
top: 0;
bottom: 0;
z-index: 2;
height: 18rpx;
background: #fb3024;
border-radius: 9rpx;
}
.grade-box {
color: #fb3024;
font-size: 22rpx;
display: flex;
justify-content: center;
align-items: center;
height: 40rpx;
background: #ffffff;
border-radius: 20rpx 0 20rpx 20rpx;
padding: 0 22rpx;
margin-right: 30rpx;
}
.ml105 {
margin-left: 105rpx;
}
</style>