You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
604 lines
14 KiB
604 lines
14 KiB
<template>
|
|
<view class="main">
|
|
<image mode="widthFix" src="../../static/bg_my@2x.png"></image>
|
|
<view class="topImg-btn-bg" :style="{top:titleHeight.statusBarHeight + 8 + 'px'}">
|
|
<view class="title-h">我的</view>
|
|
</view>
|
|
<view class="top_view" v-if="showTiele">
|
|
<view class="state-h" :style="{ height: titleHeight.statusBarHeight + 8 + 'px'}"></view>
|
|
<view class="topImg-btn-bg" :style="{top:titleHeight.statusBarHeight + 'px'}">
|
|
<view class="title-h">我的</view>
|
|
</view>
|
|
</view>
|
|
<view class="myMain">
|
|
<view class="myInfo">
|
|
<image mode="scaleToFill" :src="user_info.avatar ? user_info.avatar : '../../static/avatar.jpg'">
|
|
</image>
|
|
<view class="title">{{user_info.wechat_nickname || '匿名用户'}}</view>
|
|
</view>
|
|
<view class="myOrder">
|
|
<view class="orderTab">我的订单</view>
|
|
<view class="content">
|
|
<view class="tabCol">
|
|
<view class="orderMenu">
|
|
<!-- <view class="menuCol" @tap="goOrderCol(0)">
|
|
<image src="../../static/icon_daifukuan@2x.png"></image>
|
|
<text>待确认</text>
|
|
</view> -->
|
|
<view class="menuCol" @tap="goOrderCol('unpaid')">
|
|
<image src="../../static/icon_daifuwu@2x.png"></image>
|
|
<text>待支付</text>
|
|
</view>
|
|
<view class="menuCol" @tap="goOrderCol('ongoing')">
|
|
<image src="../../static/icon_yifuwu@2x.png"></image>
|
|
<text>进行中</text>
|
|
</view>
|
|
<view class="menuCol" @tap="goOrderCol('finished')">
|
|
<image src="../../static/icon_daipingjia@2x.png"></image>
|
|
<text>已完成</text>
|
|
</view>
|
|
<view class="menuCol allOrder" @tap="toMyOrder()">
|
|
<image src="../../static/icon_dingdan@2x.png"></image>
|
|
<text>全部订单</text>
|
|
<image class="line" src="../../static/bg_yinying@2x.png"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="myOrder">
|
|
<view class="orderTab">我的活动</view>
|
|
<view class="content">
|
|
<view class="tabCol">
|
|
<view class="orderMenu">
|
|
<!-- <view class="menuCol" @tap="goOrderCol(0)">
|
|
<image src="../../static/icon_daifukuan@2x.png"></image>
|
|
<text>待确认</text>
|
|
</view> -->
|
|
<view class="menuCol" @tap="goMyActive('unpaid')">
|
|
<image src="../../static/icon_daifuwu@2x.png"></image>
|
|
<text>待支付</text>
|
|
</view>
|
|
<view class="menuCol" @tap="goMyActive('ongoing')">
|
|
<image src="../../static/icon_yifuwu@2x.png"></image>
|
|
<text>进行中</text>
|
|
</view>
|
|
<view class="menuCol" @tap="goMyActive('finished')">
|
|
<image src="../../static/icon_daipingjia@2x.png"></image>
|
|
<text>已完成</text>
|
|
</view>
|
|
<view class="menuCol allOrder" @tap="goMyActive()">
|
|
<image src="../../static/icon_dingdan@2x.png"></image>
|
|
<text>全部活动</text>
|
|
<image class="line" src="../../static/bg_yinying@2x.png"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--更多服务-->
|
|
<view class="introBox" style="display: none;">
|
|
<view class="normal_tit">更多服务</view>
|
|
<view class="serviceBox">
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_shoucang_1@2x.png"></image>
|
|
<text>我的收藏</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_pingjia@2x.png"></image>
|
|
<text>评价中心</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_tousu@2x.png"></image>
|
|
<text>用户投诉</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_tuikuan@2x.png"></image>
|
|
<text>我的退款</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_fenxiang@2x.png"></image>
|
|
<text>分享</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_youhuiquan@2x.png"></image>
|
|
<text>优惠券</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--推广业绩-->
|
|
<view class="introBox">
|
|
<view class="normal_tit">推广业绩</view>
|
|
<view class="serviceBox">
|
|
<view class="serviceCol" @tap="nodata()">
|
|
<image src="../../static/icon_daifukuan@2x.png"></image>
|
|
<text>我的订单</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="goTuiguang()" v-if="user_info.promotion!=1">
|
|
<image src="../../static/icon_shenqingzhuce@2x.png"></image>
|
|
<text>申请注册</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--推广工具-->
|
|
<view class="introBox" v-if="user_info.promotion==1">
|
|
<view class="normal_tit">推广工具</view>
|
|
<view class="serviceBox">
|
|
<view class="serviceCol" @tap="toPoster()">
|
|
<image src="../../static/icon_poster@2x.png"></image>
|
|
<text>专属海报</text>
|
|
</view>
|
|
<view class="serviceCol" @tap="toSet()">
|
|
<image src="../../static/icon_poster@2x.png"></image>
|
|
<text>推广配置</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!--为您精选-->
|
|
<!--<view class="introBox">
|
|
<view class="normal_tit">为您精选</view>
|
|
<view class="intro_row">
|
|
<view class="row_col">
|
|
<view class="imgOuter">
|
|
<image mode="aspectFill" src="../../static/rishang.png"></image>
|
|
<view class="date">2018/11/25 14:00</view>
|
|
</view>
|
|
<view class="title">孕期保健Q&A</view>
|
|
<view class="subTit">苏州·园区星海街188号园区星海街188号</view>
|
|
<view class="price"><text class="font_red">免费</text>130人参与</view>
|
|
</view>
|
|
<view class="row_col">
|
|
<view class="imgOuter">
|
|
<image mode="aspectFill" src="../../static/rishang.png"></image>
|
|
<view class="date">2018/11/25 14:00</view>
|
|
</view>
|
|
<view class="title">孕期保健Q&A</view>
|
|
<view class="subTit">苏州·园区星海街188号园区星海街188号</view>
|
|
<view class="price"><text class="font_red">免费</text></view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
|
|
|
|
<u-popup v-model="showUser" mode="center" closeable="true">
|
|
<view class="userBox" style="padding: 20rpx;">
|
|
<view class="userInfoContent" style="padding: 80rpx;font-size: 28rpx;">
|
|
<text class="">为了更好的提供服务请授权您的微信昵称</text>
|
|
</view>
|
|
<view class="userBoxBottom">
|
|
<button class="userBoxBottomCol btnuserBoxBottomCol" @click="getUserProfile"
|
|
style="border-radius:0;flex:1;">授权</button>
|
|
<button class="userBoxBottomCol" @click="touserInfoClose"
|
|
style="border-radius:0;flex:1;">关闭</button>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
weixin
|
|
} from '../../utils/weixin.js';
|
|
import util from "../../utils/util.js"
|
|
export default {
|
|
data() {
|
|
return {
|
|
titleHeight: [],
|
|
showTiele: false,
|
|
items: [{
|
|
title: "活动订单"
|
|
},
|
|
{
|
|
title: "商品订单"
|
|
}
|
|
],
|
|
current: 0,
|
|
userProfile: {},
|
|
user_info: {},
|
|
showUser:false
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.stytemInfo();
|
|
|
|
},
|
|
onShow() {
|
|
var that = this;
|
|
setTimeout(function() {
|
|
|
|
console.log("user", uni.getStorageSync("userInfo"))
|
|
if (that.checkLogin()) {
|
|
let user = uni.getStorageSync("userInfo").user_info;
|
|
that.user_info = user;
|
|
if (weixin.isNull(user.wechat_nickname) || weixin.isNull(user.avatar)) {
|
|
that.showUser=true;
|
|
} else {
|
|
that.user_info.wechat_nickname = user.wechat_nickname;
|
|
}
|
|
}
|
|
}, 1000)
|
|
},
|
|
onPageScroll(e) {
|
|
var that = this;
|
|
if (e.scrollTop > 60) {
|
|
that.showTiele = true;
|
|
} else {
|
|
that.showTiele = false;
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
touserInfoClose() {
|
|
this.showUser = false;
|
|
},
|
|
getUserProfile() {
|
|
var that = this;
|
|
weixin.getUserProfile((res) => {
|
|
console.log(res)
|
|
weixin.request({
|
|
api: '/api/member/update-wechat-info',
|
|
method: 'POST',
|
|
data: {
|
|
nickname: res.nickName,
|
|
avatar: res.avatarUrl
|
|
},
|
|
utilSuccess: function(r) {
|
|
console.log(r)
|
|
if (r.status == 1) {
|
|
weixin.getOpenidInfo(openidInfo => {
|
|
that.user_info.wechat_nickname = openidInfo.user_info.wechat_nickname;
|
|
that.user_info.avatar = openidInfo.user_info.avatar;
|
|
}, true)
|
|
that.showUser = false;
|
|
} else {
|
|
uni.showToast({
|
|
title: r.data.msg,
|
|
duration: 2000,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
}
|
|
|
|
})
|
|
})
|
|
},
|
|
// 获取系统信息
|
|
stytemInfo: function() {
|
|
var that = this;
|
|
uni.getSystemInfo({
|
|
success: function(res) {
|
|
that.titleHeight = res;
|
|
console.log(that.titleHeight)
|
|
}
|
|
})
|
|
},
|
|
toPoster() {
|
|
uni.navigateTo({
|
|
url: "../poster/poster"
|
|
})
|
|
},
|
|
toSet() {
|
|
uni.navigateTo({
|
|
url: "../../packages/packagePromotion/pages/promotionSet/promotionSet"
|
|
})
|
|
},
|
|
goTuiguang() {
|
|
uni.navigateTo({
|
|
url: "../../packages/packagePromotion/pages/applyReg/applyReg"
|
|
})
|
|
},
|
|
toMyOrder() {
|
|
uni.navigateTo({
|
|
url: "../../packages/packageOrder/pages/myOrder/myOrder"
|
|
})
|
|
},
|
|
goOrderCol(v) {
|
|
uni.navigateTo({
|
|
url: "../../packages/packageOrder/pages/myOrder/myOrder?status=" + v
|
|
})
|
|
},
|
|
goMyActive(flag){
|
|
uni.navigateTo({
|
|
url:'/pages/active/my'
|
|
})
|
|
},
|
|
nodata() {
|
|
uni.showToast({
|
|
title: '正在建设中',
|
|
duration: 1000
|
|
});
|
|
},
|
|
onClickItem(e) {
|
|
if (this.current !== e.currentIndex) {
|
|
this.current = e.currentIndex
|
|
}
|
|
},
|
|
open() {
|
|
this.$refs.calendar.open()
|
|
},
|
|
confirm(e) {
|
|
console.log(e);
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
page {
|
|
background-color: #F6F6F6;
|
|
}
|
|
</style>
|
|
<style lang="scss">
|
|
.main {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.topImg-btn-bg {
|
|
color: #fff;
|
|
font-weight: 400;
|
|
width: 100%;
|
|
left: 0;
|
|
font-size: 34rpx;
|
|
position: fixed;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
z-index: 4;
|
|
text-align: center;
|
|
}
|
|
|
|
.top_view {
|
|
background-color: #FF578A;
|
|
display: flex;
|
|
width: 100%;
|
|
align-items: center;
|
|
position: fixed;
|
|
left: 0;
|
|
z-index: 9;
|
|
top: 0;
|
|
|
|
.state-h {
|
|
width: 100%;
|
|
background-color: #FF578A;
|
|
}
|
|
|
|
.topImg-btn-bg {
|
|
background-color: #FF578A;
|
|
width: 100%;
|
|
height: 88rpx;
|
|
}
|
|
}
|
|
|
|
.myMain {
|
|
width: 100%;
|
|
margin-top: -240rpx;
|
|
}
|
|
|
|
.myInfo {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
align-content: center;
|
|
padding: 0 36rpx;
|
|
box-sizing: border-box;
|
|
|
|
image {
|
|
width: 112rpx;
|
|
height: 112rpx;
|
|
border-radius: 50%;
|
|
margin-right: 30rpx;
|
|
}
|
|
|
|
.title {
|
|
font-size: 36rpx;
|
|
font-weight: 500;
|
|
color: #FFFFFF;
|
|
line-height: 36px;
|
|
}
|
|
}
|
|
|
|
.myOrder {
|
|
width: 710rpx;
|
|
background: rgba(255, 255, 255, 1);
|
|
border-radius: 16rpx;
|
|
margin: 30rpx auto 0 auto;
|
|
}
|
|
|
|
.orderTab {
|
|
font-size: 34rpx;
|
|
font-weight: 400;
|
|
width: 60%;
|
|
margin-left: 10rpx;
|
|
padding: 30rpx 30rpx 0 30rpx;
|
|
}
|
|
|
|
.segmented-control__item--text {
|
|
border-color: rgba(255, 255, 255, 0) !important;
|
|
}
|
|
|
|
.segmented-control__text {
|
|
color: #666666;
|
|
}
|
|
|
|
.tabCol {
|
|
width: 100%;
|
|
}
|
|
|
|
.orderMenu {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
align-items: center;
|
|
align-content: center;
|
|
width: 100%;
|
|
background: #fff;
|
|
border-radius: 16rpx;
|
|
|
|
.menuCol {
|
|
width: 20%;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
padding: 35rpx 0;
|
|
text-align: center;
|
|
|
|
image {
|
|
display: block;
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
text {
|
|
display: block;
|
|
margin-top: 18rpx;
|
|
}
|
|
}
|
|
|
|
.allOrder {
|
|
position: relative;
|
|
|
|
text {
|
|
color: #FF753E;
|
|
}
|
|
|
|
.line {
|
|
display: block;
|
|
position: absolute;
|
|
width: 26rpx;
|
|
height: 96rpx;
|
|
top: 50%;
|
|
margin-top: -48rpx;
|
|
left: -10%;
|
|
}
|
|
}
|
|
}
|
|
|
|
.serviceBox {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.serviceCol {
|
|
width: 25%;
|
|
font-size: 24rpx;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
text-align: center;
|
|
padding: 8rpx 0 34rpx 0;
|
|
box-sizing: border-box;
|
|
|
|
image {
|
|
display: block;
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
text {
|
|
display: block;
|
|
margin-top: 18rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.introBox {
|
|
width: 710rpx;
|
|
margin: 20rpx auto 0 auto;
|
|
border-radius: 16rpx;
|
|
background: #fff;
|
|
padding: 0 35rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.intro_row {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
}
|
|
|
|
|
|
.userBoxBottom {
|
|
.userBoxBottomCol {
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.btnuserBoxBottomCol {
|
|
background: linear-gradient(90deg, #FF7E95 0%, #FF447B 100%);
|
|
border-radius: 36rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
line-height: 72rpx;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.row_col {
|
|
width: 310rpx;
|
|
border-radius: 8rpx;
|
|
padding-bottom: 20rpx;
|
|
|
|
.imgOuter {
|
|
width: 310rpx;
|
|
height: 230rpx;
|
|
position: relative;
|
|
|
|
image {
|
|
width: 310rpx;
|
|
height: 230rpx;
|
|
border-radius: 8rpx 8rpx 0 0;
|
|
}
|
|
|
|
.date {
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
font-size: 20rpx;
|
|
color: #fff;
|
|
line-height: 32rrpx;
|
|
padding: 0 8rpx;
|
|
border-radius: 5rpx;
|
|
position: absolute;
|
|
left: 20rpx;
|
|
bottom: 20rpx;
|
|
font-weight: 500;
|
|
}
|
|
}
|
|
|
|
.title {
|
|
width: 100%;
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
font-weight: 500;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
padding-top: 20rpx;
|
|
}
|
|
|
|
.subTit {
|
|
width: 100%;
|
|
font-size: 22rpx;
|
|
color: #333;
|
|
font-weight: 400;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
padding-top: 10rpx;
|
|
}
|
|
|
|
.price {
|
|
margin-top: 20rpx;
|
|
font-size: 22rpx;
|
|
color: #999;
|
|
|
|
text {
|
|
font-size: 32rpx;
|
|
font-weight: 400;
|
|
padding-right: 15rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|