Skip to content

J
jz_Travel
Commit ca694c5a authored by youjie's avatar youjie
Browse files
Options

个人中心

parent ac611249
Show whitespace changes
Inline Side-by-side
Showing with 747 additions and 203 deletions
pages/user-center/components/userHeader.vue 0 → 100644
View file @ ca694c5a
<template>
<view class="userHeaderBox">
<view class="titlenav" :style="{ paddingTop: nav }">{{ pageTitle }}</view>
<view class="userHeadPic row">
<view class="userHeadPicL">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748795455095258.png" mode="widthFix"></image>
</view>
<view class="col column">
<text class="userHeadPicR_title">Ranjunjun</text>
<text class="userHeadPicR_text">销售:李龙飞等3位</text>
</view>
</view>
<view class="userHeadPasBox">
<view class="userHeadPas column">
<view class="userHeadPasTop">
<view class="userHeadPasT_Num row-sbs-n">
<view class="column">
<text style="font-size: 40rpx;color: #C07D45;">60</text>
</view>
<view class="column">
<view class="userHeadPasMoney relative">
<view>¥</view>
<text style="font-size: 36rpx;">66248.2</text>
</view>
</view>
<view class="column">
<text style="color: #4F360D;font-size: 36rpx;">3</text>
</view>
</view>
<view class="userHeadPasT_Text row-sbs-n">
<view class="column">
<text class="userHeadPasTTeT" style="font-size: 28rpx;font-weight: bold;">
幸福存折
</text>
</view>
<view class="column">
<text class="userHeadPasTTeT" style="font-size: 26rpx;font-weight: 100;">累计已省</text>
</view>
<view class="column">
<text class="userHeadPasTTeT" style="font-size: 26rpx;font-weight: 100;">抵扣券</text>
</view>
</view>
</view>
<view class="userHeadPasButtom column">
<view class="userHeadPasButText">
再完成
<text class="userHeadPasButTNum">4单</text>即可成为
<text class="userHeadPasButTVip">VIP</text>享永久折扣！
<img class="userHeadPasButImg" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638732528690203686.png"/>
</view>
<view class="jz_LineDetaVipPr">
<view class="jz_LineDetaVPB">
<view class="jz_LineDetaVPBBox" v-for="(item,index) in progress"
:key="index">
<view class="jz_LineDetaVPBLine" :style="{'opacity':index==0?'0':1}"></view>
<view class="jz_LineDetaVPBN">{{item.text}}</view>
<view class="jz_LineDetaVPBBoxI" v-if="item.img"><img :src="item.img"/></view>
<view class="jz_LineDetaVPBLine" v-else></view>
</view>
</view>
<view class="jz_LineDetaVPB jz_LineDetaVPBY">
<view class="jz_LineDetaVPBBox" v-for="(item,index) in progress"
:key="index"
:class="[item.colorStyle]">
<view class="jz_LineDetaVPBLine" :style="{'opacity':index==0?'0':1}"></view>
<view class="jz_LineDetaVPBN">{{item.text}}</view>
<view class="jz_LineDetaVPBBoxI" v-if="item.img"></view>
<view class="jz_LineDetaVPBLine"
:class="[item.radiusR]" v-else></view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
pageTitle: "个人中心",
nav: 0,
progress:[
{
text:'1',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'2',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'3',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'4',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'',
colorStyle: 'active',
radiusL: '',
radiusR: '',
img:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638732528736165089.png'
},
],
};
},
components: {
},
created() {
},
onLoad() {
this.nav = uni.getSystemInfoSync().statusBarHeight + "px";
},
mounted() {
},
onShow() {
},
methods: {
},
};
</script>
<style lang="scss" scoped>
@import url("@/asset/css/flex.css");
.userHeaderBox{
width: 750rpx;
height: 622rpx;
background: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748787642081151.png')no-repeat;
background-size: 100% 100%;
padding-top: 118rpx;
}
.titlenav {
width: 100%;
text-align: center;
font-size: 16px;
color: #000;
}
.userHeadPic{
padding: 49rpx 20rpx 25rpx 62rpx;
}
.userHeadPicL{
width: 97rpx;
height: 97rpx;
overflow: hidden;
border-radius: 50%;
margin-right: 27rpx;
}
.userHeadPicL image{
width: 97rpx;
height: 97rpx;
display: block;
}
.userHeadPicR_title{
font-family: PingFang SC;
font-weight: bold;
font-size: 36rpx;
color: #080A09;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.userHeadPicR_text{
font-family: PingFang SC;
font-weight: 500;
font-size: 24rpx;
color: #61462E;
margin-top: 16rpx;
letter-spacing: 1rpx;
}
.jz_LineDetaVipPr{
margin-top: 28rpx;
position: relative;
left: -20rpx;
}
.jz_LineDetaVip{
width: 100%;
height: 120rpx;
background: linear-gradient(90deg, #3F423F, #313131);
border-radius: 18rpx;
display: flex;
flex-direction: column;
padding: 15rpx 0 6rpx 0;
margin-top: 18rpx;
margin-bottom: 18rpx;
}
.jz_LineDetaVipTop{
font-family: PingFang SC;
font-weight: 400;
font-size: 24rpx;
color: #E2C27A;
letter-spacing: .1rpx;
display: flex;
align-content: center;
padding: 0 34rpx;
}
.jz_LineDetaVipTop img{
width: 21rpx;
height: 21rpx;
display: inline-block;
margin-left: 5rpx;
}
.jz_LineDetaVPB{
display: flex;
}
.jz_LineDetaVPBBox{
display: flex;
align-items: center;
width: 1px;
flex: 1;
}
.jz_LineDetaVPBN{
width: 30rpx;
height: 30rpx;
background: #2E2E2E;
border-radius: 50%;
text-align: center;
line-height: 28rpx;
font-family: DIN Black;
font-weight: bold;
font-size: 24rpx;
color: #494949;;
}
.jz_LineDetaVPBLine{
flex: 1;
height: 10rpx;
background: #2E2E2E;
}
.jz_LineDetaVPBBoxI{
position: relative;
flex: 1;
}
.jz_LineDetaVPBBoxI img{
width: 87rpx;
height: 99rpx;
position: absolute;
bottom: -35rpx;
right: 8rpx;
z-index: 2;
}
.jz_LineDetaVPBBox.active .jz_LineDetaVPBN{
background: linear-gradient(270deg, #C99E59, #FFFFB3);
}
.jz_LineDetaVPBBox.active .jz_LineDetaVPBLine{
background: #C99E59;
color: #583F2C;
}
.VPBLRadiusL{
border-radius: 20rpx 0 0 20rpx ;
}
.VPBLRadiusR{
border-radius: 0 20rpx 20rpx 0;
}
.jz_LineDetaVPBY{
position: absolute;
left: -29rpx;
right: 0;
top: 0;
}
.userHeadPasBox{
padding: 0 31rpx;
}
.userHeadPas{
background: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748814839963880.png')no-repeat;
background-size: 100% 100%;
}
.userHeadPasTop{
padding: 41rpx 65rpx 50rpx 65rpx;
}
.userHeadPasTop view{
text-align: center;
}
.userHeadPasTop view text{
font-family: HYYuanLongHei;
font-weight: normal;
font-weight: bold;
}
.userHeadPasT_Text{
color: #4F360D;
padding-top: 14rpx;
}
.userHeadPasMoney view{
font-size: 20rpx;
font-weight: bold;
position: absolute;
top: 15rpx;
left: -20rpx;
}
.userHeadPasButtom{
padding: 21rpx 0 40rpx 39rpx;
}
.userHeadPasButText{
font-family: PingFang SC;
font-weight: bold;
font-size: 24rpx;
color: #F9E5B3;
}
.userHeadPasButTNum{
color: #FF3166;
}
.userHeadPasButTVip{
font-size: 41rpx;
font-style: italic;
margin-right: 15rpx;
}
.userHeadPasButImg{
width: 21rpx;
height: 21rpx;
margin-left: 21rpx;
}
</style>
pages/user-center/components/vipUserHeader.vue 0 → 100644
View file @ ca694c5a
<template>
<view class="userHeaderBox">
<view class="titlenav" :style="{ paddingTop: nav }">{{ pageTitle }}</view>
<view class="userHeadPic row">
<view class="userHeadPicL">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748864186439447.png" mode="widthFix"></image>
</view>
<view class="col column">
<text class="userHeadPicR_title">Ranjunjun</text>
<view class="userHeadPicR_VIP">
<img src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/202502111735vip.png"/>
</view>
</view>
</view>
<view class="userHeadInfoBox">
<view class="userHeadInfo">
<view class="userHeadInfo_Name">王蕾钧</view>
<view class="userHeadInfo_text">销售:李龙飞等3位</view>
<img class="userHeadInfo_vip" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/202502111735zk.png" />
<view class="userHeadPasTop">
<view class="userHeadPasT_Num row-sbs-n">
<view class="row col">
<text class="userHeadPasTextb" style="font-size: 40rpx;color: #FF3166;">60</text>
</view>
<view class="userHeadPasT_Nl">
<view class="userHeadPasT_Lin"></view>
</view>
<view class="row col">
<view class="userHeadPasMoney">
<text class="userHeadPasMo">¥</text>
<text style="font-size: 36rpx;">
248.2
</text>
</view>
</view>
<view class="userHeadPasT_Nl">
<view class="userHeadPasT_Lin"></view>
</view>
<view class="row col">
<text class="userHeadPasTextb" style="color: #E2C27A;font-size: 36rpx;">3</text>
</view>
</view>
<view class="userHeadPasT_Text row-sbs-n">
<view class="row col">
<text class="userHeadPasTTeT" style="font-size: 28rpx;font-weight: bold;">
幸福存折
</text>
</view>
<view class="userHeadPasT_Nl">
<view class="userHeadPasT_Lin" style="opacity: 0;"></view>
</view>
<view class="row col">
<text class="userHeadPasTTeT" style="font-size: 26rpx;font-weight: 100;">累计已省</text>
</view>
<view class="userHeadPasT_Nl">
<view class="userHeadPasT_Lin" style="opacity: 0;"></view>
</view>
<view class="row col">
<text class="userHeadPasTTeT" style="font-size: 26rpx;font-weight: 100;">抵扣券</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
pageTitle: "个人中心",
nav: 0,
progress:[
{
text:'1',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'2',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'3',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'4',
colorStyle: 'active',
radiusL: '',
radiusR: '',
},
{
text:'',
colorStyle: 'active',
radiusL: '',
radiusR: '',
img:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638732528736165089.png'
},
],
};
},
components: {
},
created() {
},
onLoad() {
this.nav = uni.getSystemInfoSync().statusBarHeight + "px";
},
mounted() {
},
onShow() {
},
methods: {
},
};
</script>
<style lang="scss" scoped>
@import url("@/asset/css/flex.css");
.userHeaderBox{
width: 750rpx;
height: 827rpx;
background: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748788146223914.png')no-repeat;
background-size: 100% 100%;
padding-top: 118rpx;
}
.titlenav {
width: 100%;
text-align: center;
font-size: 16px;
color: #FFF;
}
.userHeadPic{
padding: 37rpx 20rpx 78rpx 54rpx;
}
.userHeadPicL{
width: 70rpx;
height: 70rpx;
overflow: hidden;
border-radius: 50%;
margin-right: 16rpx;
}
.userHeadPicL image{
width: 70rpx;
height: 70rpx;
display: block;
}
.userHeadPicR_title{
font-family: PingFang SC;
font-size: 28rpx;
color: #C4B799;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.userHeadPicR_VIP{
padding-top: 3rpx;
}
.userHeadPicR_VIP img{
width: 81rpx;
height: 26rpx;
display: block;
}
.userHeadInfoBox{
padding: 0 35rpx;
}
.userHeadInfo{
width: 680rpx;
height: 508rpx;
background: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/20250211.png')no-repeat;
background-size: 100% 100%;
position: relative;
top: -92rpx;
padding: 78rpx 20rpx 55rpx 44rpx;
}
.userHeadInfo_Name{
font-family: PingFang SC;
font-weight: 800;
font-size: 44rpx;
color: #F1D492;
}
.userHeadInfo_text{
font-family: PingFang SC;
font-weight: 500;
font-size: 24rpx;
color: #AB9D83;
letter-spacing: 1rpx;
padding-top: 16rpx;
}
.userHeadInfo_vip{
width: 385rpx;
height: 49rpx;
display: block;
padding-top: 29rpx;
}
.userHeadPasTop{
padding: 88rpx 0 50rpx 0;
}
.userHeadPasTop view{
text-align: center;
}
.userHeadPasTop view text{
font-family: HYYuanLongHei;
font-weight: normal;
font-weight: bold;
}
.userHeadPasT_Text{
text-align: center;
color: #E2C27A;
padding-top: 14rpx;
}
.userHeadPasMoney{
width: 100%;
text-align: center;
color: #E2C27A;
}
.userHeadPasMo{
font-size: 20rpx;
font-weight: bold;
margin-right: 5rpx;
}
.userHeadPasT_Nl{
position: relative;
}
.userHeadPasT_Nl text{
display: block;
}
.userHeadPasT_Lin{
position: absolute;
right: 0;
top: 3rpx;
width: 1rpx;
height: 39rpx;
background: #E2C27A;
opacity: 0.5;
}
.userHeadPasTextb,.userHeadPasTTeT{
width: 100%;
display: block;
text-align: center;
}
</style>
pages/user-center/user-center.vue
View file @ ca694c5a
......@@ -13,204 +13,86 @@
<view class="title" v-if="scrollTop > 50">{{ pageTitle }}</view>
</view>
<view class="userBox" :style="{ 'padding-bottom': bottommargin }">
<view :style="{
'background-image':'url(' + (meueData.user_center.top_pic_url ? meueData.user_center.top_pic_url : '') + ')',
backgroundSize: '100% 310px',
}"
class="imgbg" :class="{
miniHeadTop: meueData.user_center.is_foot_bar_status != 1 && meueData.user_center.is_account_status != 1, }">
<view class="titlenav" :style="{ paddingTop: nav }">{{ pageTitle }}</view>
<view class="topheard" :style="{
'margin-top':
modelstype == 0
? '52px'
: modelstype == 1
? '37px'
: modelstype == 2
? '33px'
: 0,
}"
v-if="meueData.user_center.top_style == 1">
<u-avatar :src="user_info.avatar" size="140" shape="circle"></u-avatar>
<view style=" display: flex;flex-direction: column; justify-content: center; height: 100rpx; margin-left: 20rpx; ">
<Text class="nickname" style=" color: #fff; font-size: 36rpx;font-weight: 800; max-width: 400rpx; overflow: hidden; display: inline-block; white-space: nowrap;text-overflow: ellipsis; font-family:'microsoft yahei ui light'"
@click="login(user_info)">
<template v-if="b2b_user_info&&b2b_user_info.name">
{{b2b_user_info.name}}
</template>
<template v-else-if="mall_UserInfo&&mall_UserInfo.Name">
{{mall_UserInfo.Name}}
</template>
<template v-else>
立即登录
</template>
</Text>
<view style="font-size:12px; margin-top:3px;">
<template v-if="b2b_user_info&&b2b_user_info.customerName&&b2b_user_info.customerName!=''">
{{b2b_user_info.customerName}}
</template>
<template v-else>
{{b2b_user_info ? b2b_user_info.name : ""}}
</template>
<!-- <userHeader></userHeader> -->
<vipUserHeader></vipUserHeader>
<view class="userMyOrderBox width100One">
<view style="position: relative;top:-13rpx">
<view class="userMyOrder">
<view class="userMyOrderTitle row-sbas-n col">
<view class="userMyOrderTitL">我的订单</view>
<view class="userMyOrderTitR row" @click="goUrl('/pages/order/index/index')">
<text>全部</text>
<view>
<u-icon class="userMyOrderTitRIght" name="arrow-up" size="30" color="#B2B3B3"></u-icon>
</view>
</view>
</view>
<view style=" display: flex; flex-direction: column; align-items: center; margin-top: 23px;margin-bottom: 5px; "
v-if="meueData.user_center.top_style == 2">
<u-avatar :src="user_info.avatar" shape="circle" size="120"></u-avatar>
<Text style="color: #fff; font-size: 40rpx; font-weight: 800" class="nickname" @click="login(user_info)">{{ user_info.nickname ? user_info.nickname : "立即登录" }}</Text>
<view class="member" v-if="is_icon_members_grade == 1 && user_info.nickname">
<image :src="user_info.identity.level_icon" mode="aspectFill" style="width: 22px; height: 22px; border-radius: 11px"></image>
<Text style="margin-right: 10px">{{ user_info.identity.level_name != null ? user_info.identity.level_name : "普通用户" }}</Text>
</view>
</view>
<view class="top_b">
<!--我的收藏-->
<view class="top_b_item" v-if="meueData.user_center.is_foot_bar_status == 1" @click="goUrl('/pages/favorite/favorite')">
<text style="font-size: 21px">{{ user_info.favorite ? user_info.favorite : 0 }}</text>
<text>{{ meueData.user_center.foot_bar[0].name }}</text>
</view>
<!--我的足迹-->
<view class="top_b_item" v-if="meueData.user_center.is_foot_bar_status == 1" @click="goUrl('/pages/foot/index/index')">
<text style="font-size: 21px">{{ user_info.footprint ? user_info.footprint : 0 }}</text>
<text>{{ meueData.user_center.foot_bar[1].name }}</text>
</view>
<!--优惠劵-->
<!-- <view class="top_b_item" v-if=" meueData.user_center && meueData.user_center.is_account_status == 1" @click="goUrl(couponsObj.link_url)">
<text style="font-size: 21px">{{ user_info.coupon ? user_info.coupon : 0 }}</text>
<text>{{ couponsObj.name }}</text>
</view> -->
</view>
<view class="Receiptbalance" v-if=" meueData.user_center && meueData.user_center.is_account_status == 1">
<!--余额-->
<view class="Receiptbalance_item" v-for="(item, index) in meueData.user_center.account" :key="index" v-if="item.link_url == '/pages/balance/balance'"
@click="goUrl(item.link_url)">
<image :src="item.icon_url" style="width: 22px; height: auto" mode="widthFix"></image>
<view style="margin-left: 15px;display: flex;flex-direction: column;justify-content: space-between;">
<span style="font-size: 21px; color: #0d0d0d; font-weight: 200">
{{ user_info.balance ? user_info.balance > 10000? (user_info.balance / 10000).toFixed(1) + "w": user_info.balance: 0 }}
</span>
<span style="">{{ item.name }}</span>
</view>
</view>
<view style="width: 1px; height: 34px; background: #e8e8e8"></view>
<!--积分明细-->
<view class="Receiptbalance_item" v-for="(item, index) in meueData.user_center.account" :key="index" v-if="item.link_url =='/pages/user-center/integral-detail/integral-detail'"
@click="goUrl(item.link_url)">
<image :src="item.icon_url" style="width: 17px; height: auto" mode="widthFix"></image>
<view style="margin-left: 15px; display: flex;flex-direction: column;justify-content: space-between;">
<span style="font-size: 21px; color: #0d0d0d; font-weight: 200">
{{user_info.integral? user_info.integral > 10000? (user_info.integral / 10000).toFixed(1) + "w": user_info.integral: 0}}
</span>
<span>{{ item.name }}</span>
</view>
</view>
</view>
</view>
<!-- 排课点数 -->
<view class="order_bar paike" style="" @click="gopointBalance" v-if="meueData.user_center.is_point_status == 1">
<span style="font-size: 14px; color: #111111">可用余额(点数)：</span>
<span style="font-size: 22px; color: #111111; font-family: aa">{{ PointNum }}</span>
</view>
<view class="order_bar" v-if="meueData.user_center.is_order_bar_status == 1">
<u-section title="我的订单" sub-title="查看更多" style="width: 100%; padding: 0px 0 10px" @click="goUrl('/pages/order/index/index?status=0')"></u-section>
<view class="order_bar_list">
<view class="order_bar_item" v-for="(item, index) in meueData.user_center.order_bar" :key="index" :name="item.name"
@click="goUrl(item.link_url)">
<image :src="item.icon_url" style="width: 60rpx; height: auto" mode="widthFix"></image>
<Text style="margin-top: 10rpx">{{ item.name }}</Text>
<!-- 待付款 -->
<view v-if="item.link_url == '/pages/order/index/index?status=1' && user_info.MyOrder.NonPayment > 0" class="badge"
:style="{ background: mainColor }">
{{ user_info.MyOrder.NonPayment }}
<view class="order_bar_item" @click="goUrl('/pages/order/index/index?status=1')">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748963970628311.png" style="width: 66rpx; height: auto" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">待付款</Text>
<view class="badge"></view>
</view>
<!-- 待发货 -->
<view v-if="item.link_url == '/pages/order/index/index?status=2' &&user_info.MyOrder.WaitSendGoods > 0" class="badge"
:style="{ background: mainColor }">
{{ user_info.MyOrder.WaitSendGoods }}
<view class="order_bar_item" @click="goUrl('/pages/order/index/index?status=2')">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748963971941398.png" style="width: 66rpx; height: auto" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">未确认</Text>
<view class="badge"></view>
</view>
<!-- 待收货 -->
<view v-if="item.link_url == '/pages/order/index/index?status=3' &&user_info.MyOrder.WaitReceiving > 0" class="badge"
:style="{ background: mainColor }">
{{ user_info.MyOrder.WaitReceiving }}
<view class="order_bar_item" @click="goUrl('/pages/order/index/index?status=3')">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748963971902348.png" style="width: 66rpx; height: auto" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">已完成</Text>
<view class="badge"></view>
</view>
<!-- 待评价 -->
<view v-if="item.link_url == '/pages/order/order-commit' && user_info.MyOrder.WaitCommentNum > 0" class="badge"
:style="{ background: mainColor }">
{{ user_info.MyOrder.WaitCommentNum }}
<view class="order_bar_item">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638748964440207840.png" style="width: 66rpx; height: auto" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">待处理</Text>
<view class="badge"></view>
</view>
<!-- 售后 -->
<view v-if="item.link_url == '/pages/order/after-sale/refunds-list' && user_info.MyOrder.AfterSaleNum > 0" class="badge"
:style="{ background: mainColor }">
{{ user_info.MyOrder.AfterSaleNum }}
</view>
<view class="orderProductBox">
<view class="orderProduct row">
<view class="orderProductL">
<image style="width: 91rpx; height: 88rpx;"
mode="aspectFill"
src=" http://imgfile.oytour.com/Upload/WebSite/202501090355546390000000073.jpg"></image>
</view>
<view class="orderProductR col column">
<view class="orderProductR_state">待处理</view>
<view class="orderProductR_text">(东东一地) 河津樱早樱东京富士山纯 河津樱早樱东京富士山纯</view>
</view>
</view>
<view class="order_bar" style="margin-top: 20rpx" v-if="meueData.user_center.is_sdorder_bar_status == 1">
<u-section title="司导订单" sub-title="查看更多" style="width: 100%; padding: 0px 0 10px" @click="goUrl('/pages/guidecar/orderList?status=0')"></u-section>
<view class="order_bar_list">
<view class="order_bar_item" v-for="(item, index) in meueData.user_center.sdorder_bar" :key="index" :name="item.name"
@click="goUrl(item.link_url)">
<image :src="item.icon_url" style="width: 60rpx; height: auto" mode="widthFix"></image>
<Text style="margin-top: 10rpx">{{ item.name }}</Text>
<!-- 待付款 -->
<view v-if="item.link_url == '/pages/guidecar/orderList?status=1' && user_info.MyGuideCarOrder.NonPayment>0"
class="badge" :style="{ background: mainColor }">
{{ user_info.MyGuideCarOrder.NonPayment }}
</view>
<!-- 待确认 -->
<view v-if="item.link_url == '/pages/guidecar/orderList?status=2' && user_info.MyGuideCarOrder.WaitSendGoods>0"
class="badge" :style="{ background: mainColor }">
{{ user_info.MyGuideCarOrder.WaitSendGoods }}
</view>
<!-- 待出行 -->
<view v-if="item.link_url == '/pages/guidecar/orderList?status=3' &&user_info.MyGuideCarOrder.WaitReceiving>0"
class="badge" :style="{ background: mainColor }">
{{ user_info.MyGuideCarOrder.WaitReceiving }}
</view>
<!-- 出行中 -->
<view v-if=" item.link_url == '/pages/guidecar/orderList?status=4' && user_info.MyGuideCarOrder.Completed>0 "
class="badge" :style="{ background: mainColor }">
{{ user_info.MyGuideCarOrder.Completed }}
</view>
<!-- 待评价 -->
<view v-if="item.link_url == '/pages/guidecar/order-commit' && user_info.MyGuideCarOrder.GuideCarWaitCommentNum>0"
class="badge" :style="{ background: mainColor }">
{{ user_info.MyGuideCarOrder.GuideCarWaitCommentNum }}
<view style="height: 20rpx;"></view>
<view class="userMyOrder" style="padding: 12rpx 0 20rpx 0;">
<view class="order_bar_list">
<view class="order_bar_item relative" style="margin-top: 0;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749519965857485.png" style="width: 70rpx; height: 70" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">在线客服</Text>
<button open-type="contact" style="position: absolute;left: 0;top: 0;
bottom: 0;right: 0;z-index: 1;opacity: 0;"></button>
</view>
<view class="order_bar_item" style="margin-top: 0;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749520007722617.png" style="width: 70rpx; height: 70" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">年底大红包</Text>
</view>
<view class="order_bar_item" style="margin-top: 0;"
@click="goUrl('/pages/index/index')">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749520286130928.png" style="width: 70rpx; height: 70" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">我的旅行社</Text>
</view>
<view class="order_bar_item" style="margin-top: 0;"
@click="goUrl('/pages/coupon/list/list')">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638749520367368328.png" style="width: 70rpx; height: 70" mode="widthFix"></image>
<Text style="margin-top: 10rpx;font-size: 24rpx;">领券中心</Text>
</view>
<template v-if=" meueData.user_center && meueData.user_center.nar_menus.length > 0 ">
<view v-if=" meueData.user_center && meueData.user_center.is_menu_status == 1" v-for="(mItem, mIndex) in meueData.user_center.nar_menus"
:key="mIndex" :style="{ marginTop: mIndex == 0 && (meueData.user_center.is_foot_bar_status == 1 || meueData.user_center.is_account_status == 1)? '25px' : '', }"
class="headCommon">
<view style="margin: 10px">{{ mItem.MenuNavTitle }}</view>
<view :class="mItem.MenuNavStyle == 1 ? 'menus' : 'menus2'" style="width: 100%">
<view :class="mItem.MenuNavStyle == 1 ? 'menus_item' : 'menus_item2'" v-for="(item, index) in mItem.MeunList"
:key="index" :name="item.name" @click="goUrl(item.link_url)" v-if="pandu(item)">
<image :src="item.icon_url" :style="{width: mItem.MenuNavStyle == 1 ? '20px' : '16px',height: 'auto',}" mode="widthFix"></image>
<Text style="font-size: 26rpx" :style="{'margin-top': mItem.MenuNavStyle == 1 ? '10rpx' : '0rpx','margin-left': mItem.MenuNavStyle == 1 ? '0rpx' : '24rpx', }">
{{ item.name }}
</Text>
<!-- #ifdef MP-WEIXIN -->
<button open-type="contact" class="contButton" v-if="item.link_url == 'contact' && item.name == '客服'"></button>
<!-- #endif -->
<!-- #ifdef MP-ALIPAY -->
<view class="contButton" style="display: flex;justify-content: center;align-items: center;" v-if="item.link_url == 'contact' && item.name == '客服'">
<contact-button tnt-inst-id="QqR_ZV6m" scene="SCE01203509" :icon="item.icon_url" size="70rpx" :alipay-card-no="2088 + userId"
:ext-info="appid">
</contact-button>
</view>
<!-- #endif -->
</view>
</view>
</view>
</template>
<view class="login-btn" style="margin:30px 0" @click='signOutHandler'>退出登录</view>
</view>
<auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth="gbAuth"></auth>
<tabbars></tabbars>
......@@ -230,11 +112,20 @@
import tabbars from "@/components/tabbar/index";
import auth from "../../components/auth/index.vue";
import blinddate from "./components/blinddate-user.vue";
import userHeader from "./components/userHeader.vue";
import vipUserHeader from "./components/vipUserHeader.vue";
export default {
components: {
tabbars,
auth,
blinddate,
userHeader,
vipUserHeader,
},
data() {
return {
isloading: true,
pageTitle: "用户中心",
pageTitle: "个人中心",
navHeight: 0,
contentHeight: 0,
cstyle: {},
......@@ -271,11 +162,6 @@
userId: uni.getStorageSync("mall_UserInfo").UserId,
};
},
components: {
tabbars,
auth,
blinddate,
},
created() {
this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary;
......@@ -302,7 +188,7 @@
this.b2b_user_info = uni.getStorageSync('b2b_user')
this.mall_UserInfo = uni.getStorageSync("mall_UserInfo");
this.nav = uni.getSystemInfoSync().statusBarHeight + "px";
this.headStyle.background = `linear-gradient(to right, '#e6b865',80%, '#ebb45e')`;
this.headStyle.background = `#232323`;
this.headStyle.paddingTop = this.nav;
if (!this.mall_UserInfo) {
this.showAuth = true;
......@@ -464,6 +350,7 @@
(res) => {
uni.hideNavigationBarLoading();
this.meueData = res.data.config;
console.log(this.meueData.user_center.order_bar,'--------');
this.user_info = res.data.user_info;
this.meueData.user_center.account.forEach((x) => {
if (x.link_url == "/pages/coupon/index/index") {
......@@ -609,7 +496,8 @@
};
</script>
<style>
<style lang="scss" scoped>
@import url("@/asset/css/flex.css");
.body {
background: #f3f4f6;
height: 100vh;
......@@ -701,8 +589,8 @@
margin-top: 80rpx;
}
.userStyle .order_bar .order_bar_list {
width: 100%;
.order_bar_list {
padding: 22rpx 55rpx 34rpx 55rpx;
display: flex;
flex-direction: row;
align-items: center;
......@@ -721,14 +609,16 @@
position: absolute;
right: -10rpx;
top: -10rpx;
padding: 0 12rpx;
padding: 0 8rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 20rpx;
background: #FF3166;
color: #fff;
height: 30rpx;
border-radius: 15rpx;
min-width: 28rpx;
height: 28rpx;
border-radius: 14rpx;
}
.userStyle .menus {
......@@ -973,4 +863,70 @@
margin: 30px 0;
box-sizing: border-box;
}
.userMyOrderBox{
padding: 0 31rpx;
}
.userMyOrder{
background: #FFF;
border-radius: 20rpx;
padding: 33rpx 0 22rpx 0;
}
.userMyOrderTitle{
padding: 23rpx 31rpx 0 31rpx;
}
.userMyOrderTitL{
font-family: PingFang SC;
font-weight: 800;
font-size: 32rpx;
color: #080A09;
}
.userMyOrderTitR{
font-family: PingFang SC;
font-weight: 500;
font-size: 24rpx;
color: #B2B3B3;
align-items: center;
}
.userMyOrderTitRIght{
margin-left: 11rpx;
transform: rotate(90deg);
}
.orderProductBox{
padding: 0 20rpx;
}
.orderProduct{
width: 648rpx;
height: 132rpx;
background: #F7F7F7;
border-radius: 18rpx;
padding: 21rpx 20rpx;
}
.orderProductL{
width: 91rpx;
height: 88rpx;
border-radius: 14rpx;
overflow: hidden;
margin-right: 18rpx;
}
.orderProductR_state{
font-family: PingFang SC;
font-weight: 500;
font-size: 28rpx;
color: #080A09;
padding-top: 5rpx;
}
.orderProductR_text{
width: 100%;
font-family: PingFang SC;
font-weight: 500;
font-size: 24rpx;
color: #8C8C8C;
padding-top: 4rpx;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment