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.
646 lines
16 KiB
646 lines
16 KiB
<template>
|
|
<gui-page :customFooter="true" iphoneXButtomStyle="background:#F8F8F8"
|
|
:footerSets="{height:120, zIndex:100, bg:'none'}">
|
|
<view slot="gBody" :style="appThemeStyle"
|
|
style="background: linear-gradient(180deg, rgba(255,255,255,0)0%,rgba(249, 238, 248, 1.0) 100%);height: 100vh;">
|
|
<view style="position: relative;">
|
|
<view class="a" style="width: 100%; height: 350rpx; z-index: 1;">
|
|
<image src="../../static/3334.png" style="width: 100%; height: 300rpx;"></image>
|
|
</view>
|
|
<view class="b"
|
|
style="position: absolute; top: 60rpx; left: 0; width: 100%; height: 100px; z-index: 0;padding: 0 10rpx;">
|
|
<view style="padding: 10rpx;border-radius: 10rpx;display: flex;justify-content: space-between;"
|
|
v-if="isLogin">
|
|
<view style="display: flex;width: 60%;">
|
|
<view style="margin-right: 20rpx;">
|
|
<image :src="userInfo.avatar_url"
|
|
style="width: 120rpx;height: 120rpx;border-radius: 50%;border: 5rpx solid #633981;">
|
|
</image>
|
|
</view>
|
|
<view style="line-height: 60rpx;font-weight: bold;">
|
|
<view style="font-size: 34rpx;color: #fff;">{{ userInfo.nick_name }}</view>
|
|
<view style="color: #fff;">{{ userInfo.mobile }}</view>
|
|
</view>
|
|
</view>
|
|
<view style="display: flex;justify-content: center;align-items: center;">
|
|
|
|
|
|
|
|
<view style="display: flex;justify-content: center;align-items: center;">
|
|
<view @click="onSettled" v-if="userInfo.is_info == 0"
|
|
style="display: flex; padding: 15rpx 35rpx;background: linear-gradient(to top, #0E001F, #7B0373 );color: #fff;font-size: 24rpx;border-radius: 30rpx;">
|
|
<view>商家入驻</view>
|
|
<view class="arrow-right">
|
|
<image src="../../static/right.png"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-if="userInfo.is_info == 1 " @click="wddp"
|
|
style="display: flex; padding: 15rpx 35rpx;background: linear-gradient(to top, #0E001F, #7B0373 );color: #fff;font-size: 24rpx;border-radius: 30rpx;">
|
|
|
|
<view>我的店铺</view>
|
|
<view class="arrow-right">
|
|
<image src="../../static/right.png"></image>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="padding: 10rpx;border-radius: 10rpx;display: flex;" v-else @click="handleLogin">
|
|
|
|
<view style="margin-right: 20rpx;">
|
|
<avatar-image :width="120" style="border: 5rpx solid #633981;border-radius: 50%;" />
|
|
</view>
|
|
<view style="line-height: 60rpx;width: 420rpx;font-weight: bold;">
|
|
<view style="font-size: 34rpx;color: #fff;">未登录</view>
|
|
<view style="color: #fff;">点击登录账号</view>
|
|
</view>
|
|
<view style="display: flex;justify-content: center;align-items: center;">
|
|
<view
|
|
style="padding: 10rpx 20rpx;background: linear-gradient(to top, #0E001F, #7B0373 );color: #fff;font-size: 24rpx;border-radius: 30rpx;">
|
|
商家入驻
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view class="gui-list gui-padding-x" style="padding: 0 20rpx;">
|
|
<!-- <button class="btn-normal" open-type="contact" @click="zaixiankefu">
|
|
<view class="gui-list-items">
|
|
<image src="../../static/zxkfzs.png" style="width: 35rpx;height: 35rpx;"></image>
|
|
<view class="gui-list-body gui-border-b" style="padding: 40rpx 0;">
|
|
<view class="gui-list-title">
|
|
<text class="gui-list-title-text" style="font-size: 18px;">在线客服助手</text>
|
|
</view>
|
|
</view>
|
|
<text class="gui-list-arrow-right gui-icons gui-color-gray"></text>
|
|
</view>
|
|
</button> -->
|
|
<!-- <view class="gui-list-items">
|
|
<image src="../../static/zskftd.png" style="width: 35rpx;height: 35rpx;"></image>
|
|
<view class="gui-list-body gui-border-b" style="padding: 40rpx 0;">
|
|
<view class="gui-list-title">
|
|
<text class="gui-list-title-text" style="font-size: 18px;">专属客服通道</text>
|
|
</view>
|
|
</view>
|
|
<text class="gui-list-arrow-right gui-icons gui-color-gray"></text>
|
|
</view> -->
|
|
<view class="gui-list-items" @click="handleService('/pagesNew/order/index')">
|
|
<image src="../../static/yhfwxy.png" style="width: 35rpx;height: 35rpx;"></image>
|
|
<view class="gui-list-body gui-border-b" style="padding: 40rpx 0;">
|
|
<view class="gui-list-title">
|
|
<text class="gui-list-title-text" style="font-size: 18px;">订单列表</text>
|
|
</view>
|
|
</view>
|
|
<text class="gui-list-arrow-right gui-icons gui-color-gray"></text>
|
|
</view>
|
|
<view class="gui-list-items" @click="handleService('/pages/dealer/index')">
|
|
<image src="../../static/yqsjrz.png" style="width: 35rpx;height: 35rpx;"></image>
|
|
<view class="gui-list-body gui-border-b" style="padding: 40rpx 0;">
|
|
<view class="gui-list-title">
|
|
<text class="gui-list-title-text" style="font-size: 18px;">邀请商家入驻</text>
|
|
</view>
|
|
</view>
|
|
<text class="gui-list-arrow-right gui-icons gui-color-gray"></text>
|
|
</view>
|
|
<view class="gui-list-items" @click="tiaozhuan('/pages/article/details?articleId=4')">
|
|
<image src="../../static/yhfwxy.png" style="width: 35rpx;height: 35rpx;"></image>
|
|
<view class="gui-list-body" style="padding: 40rpx 0;">
|
|
<view class="gui-list-title">
|
|
<text class="gui-list-title-text" style="font-size: 18px;">用户服务协议</text>
|
|
</view>
|
|
</view>
|
|
<text class="gui-list-arrow-right gui-icons gui-color-gray"></text>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view v-if="isLogin" @click="handleLogout()"
|
|
style="font-size: 18px;width: 90%;text-align: center;padding: 20rpx 0;text-align: center;background: linear-gradient(to top, #0E001F, #7B0373 );margin: 200rpx auto 0 ;color: #fff;border-radius: 40rpx;">
|
|
退出登录
|
|
</view>
|
|
</view>
|
|
<view slot="gFooter" class="gui-flex gui-rows gui-nowrap gui-space-between gui-align-items-end"
|
|
style="background: linear-gradient(to top, #0E001F, #7B0373 );padding-bottom: 100rpx;">
|
|
<view class="gui-footer-icon-buttons" @tap="navChang(0)" style="padding-bottom: 30rpx;;text-align: center;">
|
|
<view class="tab">
|
|
<image src="../../static/sy.png" mode="widthFix"></image>
|
|
</view>
|
|
<view>
|
|
首页
|
|
</view>
|
|
</view>
|
|
|
|
<view class="gui-footer-icon-buttons" @tap="navChang(1)" style="padding-bottom: 30rpx;;text-align: center;">
|
|
<view class="tab">
|
|
<image src="../../static/dd.png" mode="widthFix"></image>
|
|
</view>
|
|
<view>
|
|
订单
|
|
</view>
|
|
</view>
|
|
<view class="gui-footer-icon-buttons" @tap="navChang(2)" style="padding-bottom: 30rpx;;text-align: center;">
|
|
<view class="tab">
|
|
<image src="../../static/wds.png" mode="widthFix"></image>
|
|
</view>
|
|
<view style="color: #B32ABE;">
|
|
我的
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</gui-page>
|
|
</template>
|
|
|
|
<script>
|
|
import store from '@/store'
|
|
import AvatarImage from '@/components/avatar-image'
|
|
import Recommended from '@/components/recommended'
|
|
import {
|
|
setCartTabBadge
|
|
} from '@/core/app'
|
|
import SettingKeyEnum from '@/common/enum/setting/Key'
|
|
import SettingModel from '@/common/model/Setting'
|
|
import * as UserApi from '@/api/user'
|
|
import * as OrderApi from '@/api/order'
|
|
import {
|
|
checkLogin
|
|
} from '@/core/app'
|
|
|
|
// 订单操作
|
|
const orderNavbar = [{
|
|
id: 'all',
|
|
name: '全部订单',
|
|
icon: 'qpdingdan'
|
|
},
|
|
{
|
|
id: 'payment',
|
|
name: '待支付',
|
|
icon: 'daifukuan',
|
|
count: 0
|
|
},
|
|
{
|
|
id: 'delivery',
|
|
name: '待发货',
|
|
icon: 'daifahuo',
|
|
count: 0
|
|
},
|
|
{
|
|
id: 'received',
|
|
name: '待收货',
|
|
icon: 'daishouhuo',
|
|
count: 0
|
|
},
|
|
]
|
|
|
|
/**
|
|
* 我的服务
|
|
* id: 标识; name: 标题名称; icon: 图标; type 类型(link和button); url: 跳转的链接
|
|
*/
|
|
const service = [{
|
|
id: 'address',
|
|
name: '收货地址',
|
|
icon: 'shouhuodizhi',
|
|
type: 'link',
|
|
url: 'pages/address/index'
|
|
},
|
|
{
|
|
id: 'coupon',
|
|
name: '领券中心',
|
|
icon: 'lingquan',
|
|
type: 'link',
|
|
url: 'pages/coupon/index'
|
|
},
|
|
{
|
|
id: 'myCoupon',
|
|
name: '优惠券',
|
|
icon: 'youhuiquan',
|
|
type: 'link',
|
|
url: 'pages/my-coupon/index'
|
|
},
|
|
{
|
|
id: 'refund',
|
|
name: '退换/售后',
|
|
icon: 'shouhou',
|
|
type: 'link',
|
|
url: 'pages/refund/index',
|
|
count: 0
|
|
},
|
|
{
|
|
id: 'help',
|
|
name: '我的帮助',
|
|
icon: 'bangzhu',
|
|
type: 'link',
|
|
url: 'pages/help/index'
|
|
},
|
|
{
|
|
id: 'contact',
|
|
name: '在线客服',
|
|
icon: 'kefu',
|
|
type: 'button',
|
|
openType: 'contact'
|
|
},
|
|
{
|
|
id: 'points',
|
|
name: '我的积分',
|
|
icon: 'jifen',
|
|
type: 'link',
|
|
url: 'pages/points/log'
|
|
},
|
|
{
|
|
id: 'dealer',
|
|
name: '分销中心',
|
|
icon: 'fenxiao',
|
|
type: 'link',
|
|
url: 'pages/dealer/index'
|
|
},
|
|
{
|
|
id: 'groupon',
|
|
name: '我的拼团',
|
|
icon: 'pintuan',
|
|
type: 'link',
|
|
url: 'pages/groupon/index?tab=1'
|
|
},
|
|
{
|
|
id: 'bargain',
|
|
name: '我的砍价',
|
|
icon: 'kanjia',
|
|
type: 'link',
|
|
url: 'pages/bargain/index?tab=1'
|
|
},
|
|
]
|
|
|
|
export default {
|
|
components: {
|
|
AvatarImage,
|
|
Recommended
|
|
},
|
|
data() {
|
|
return {
|
|
// 枚举类
|
|
SettingKeyEnum,
|
|
// 正在加载
|
|
isLoading: true,
|
|
// 首次加载
|
|
isFirstload: true,
|
|
// 是否已登录
|
|
isLogin: false,
|
|
// 系统设置
|
|
setting: {},
|
|
// 当前用户信息
|
|
userInfo: {},
|
|
// 账户资产
|
|
assets: {
|
|
balance: '--',
|
|
points: '--',
|
|
coupon: '--'
|
|
},
|
|
// 我的服务
|
|
service,
|
|
// 订单操作
|
|
orderNavbar,
|
|
// 当前用户待处理的订单数量
|
|
todoCounts: {
|
|
payment: 0,
|
|
deliver: 0,
|
|
received: 0
|
|
},
|
|
navCurrent: 2
|
|
}
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onLoad(options) {},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow(options) {
|
|
this.onRefreshPage()
|
|
},
|
|
|
|
methods: {
|
|
zaixiankefu() {
|
|
window.location.href = 'https://work.weixin.qq.com/kfid/kfc6206617a5de54b2d'; // 跳转到相对路径下的网页
|
|
},
|
|
navChang: function(index) {
|
|
if (index == 1) {
|
|
uni.navigateTo({
|
|
url: '/pages/order/index'
|
|
})
|
|
}
|
|
if (index == 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/index'
|
|
})
|
|
}
|
|
|
|
},
|
|
tiaozhuan(e) {
|
|
uni.navigateTo({
|
|
url: e
|
|
})
|
|
},
|
|
wddp() {
|
|
if (!this.isLogin) {
|
|
this.$toast('请登录')
|
|
return false;
|
|
}
|
|
|
|
uni.navigateTo({
|
|
url: './shop/index'
|
|
})
|
|
},
|
|
onSettled() {
|
|
if (!this.isLogin) {
|
|
this.$toast('请登录')
|
|
return false;
|
|
}
|
|
|
|
uni.navigateTo({
|
|
url: './settled/index'
|
|
})
|
|
},
|
|
|
|
// 刷新页面
|
|
onRefreshPage() {
|
|
// 更新购物车角标
|
|
setCartTabBadge()
|
|
// 判断是否已登录
|
|
this.isLogin = checkLogin()
|
|
// 获取页面数据
|
|
this.getPageData()
|
|
},
|
|
|
|
// 获取页面数据
|
|
getPageData(callback) {
|
|
const app = this
|
|
app.isLoading = true
|
|
Promise.all([app.getSetting(), app.getUserInfo(), app.getUserAssets(), app.getTodoCounts()])
|
|
.then(result => {
|
|
app.isFirstload = false
|
|
// 初始化我的服务数据
|
|
app.initService()
|
|
// 初始化订单操作数据
|
|
app.initOrderTabbar()
|
|
// 执行回调函数
|
|
callback && callback()
|
|
})
|
|
.catch(err => console.log('catch', err))
|
|
.finally(() => {
|
|
app.isLoading = false
|
|
})
|
|
},
|
|
|
|
// 初始化我的服务数据
|
|
initService() {
|
|
const app = this
|
|
const newService = []
|
|
service.forEach(item => {
|
|
// 默认开启
|
|
item.enabled = true
|
|
// 我的积分
|
|
if (item.id === 'points') {
|
|
item.name = '我的' + app.setting[SettingKeyEnum.POINTS.value].points_name
|
|
}
|
|
// 是否显示分销中心
|
|
if (item.id === 'dealer' && !app.setting._other.isEnabledDealer) {
|
|
item.enabled = false
|
|
}
|
|
// 数据角标
|
|
if (item.count != undefined) {
|
|
item.count = app.todoCounts[item.id]
|
|
}
|
|
newService.push(item)
|
|
})
|
|
app.service = newService
|
|
},
|
|
|
|
// 初始化订单操作数据
|
|
initOrderTabbar() {
|
|
const app = this
|
|
const newOrderNavbar = []
|
|
orderNavbar.forEach(item => {
|
|
if (item.count != undefined) {
|
|
item.count = app.todoCounts[item.id]
|
|
}
|
|
newOrderNavbar.push(item)
|
|
})
|
|
app.orderNavbar = newOrderNavbar
|
|
},
|
|
|
|
// 获取商城设置
|
|
getSetting() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
SettingModel.data()
|
|
.then(setting => {
|
|
app.setting = setting
|
|
resolve(setting)
|
|
}).catch(reject)
|
|
})
|
|
},
|
|
|
|
// 获取当前用户信息
|
|
getUserInfo() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
!app.isLogin ? resolve(null) : UserApi.info({}, {
|
|
load: app.isFirstload
|
|
})
|
|
.then(result => {
|
|
app.userInfo = result.data.userInfo
|
|
resolve(app.userInfo)
|
|
})
|
|
.catch(err => {
|
|
if (err.result && err.result.status == 401) {
|
|
app.isLogin = false
|
|
resolve(null)
|
|
} else {
|
|
reject(err)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
// 获取账户资产
|
|
getUserAssets() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
!app.isLogin ? resolve(null) : UserApi.assets({}, {
|
|
load: app.isFirstload
|
|
})
|
|
.then(result => {
|
|
app.assets = result.data.assets
|
|
resolve(app.assets)
|
|
})
|
|
.catch(err => {
|
|
if (err.result && err.result.status == 401) {
|
|
app.isLogin = false
|
|
resolve(null)
|
|
} else {
|
|
reject(err)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
// 获取当前用户待处理的订单数量
|
|
getTodoCounts() {
|
|
const app = this
|
|
return new Promise((resolve, reject) => {
|
|
!app.isLogin ? resolve(null) : OrderApi.todoCounts({}, {
|
|
load: app.isFirstload
|
|
})
|
|
.then(result => {
|
|
app.todoCounts = result.data.counts
|
|
resolve(app.todoCounts)
|
|
})
|
|
.catch(err => {
|
|
if (err.result && err.result.status == 401) {
|
|
app.isLogin = false
|
|
resolve(null)
|
|
} else {
|
|
reject(err)
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
// 跳转到登录页
|
|
handleLogin() {
|
|
!this.isLogin && this.$navTo('pages/login/index')
|
|
},
|
|
|
|
// 跳转到绑定手机号页面
|
|
handleBindMobile() {
|
|
this.$navTo('pages/user/bind/index')
|
|
},
|
|
|
|
// 退出登录
|
|
handleLogout() {
|
|
const app = this
|
|
uni.showModal({
|
|
title: '友情提示',
|
|
content: '您确定要退出登录吗?',
|
|
success(res) {
|
|
if (res.confirm) {
|
|
store.dispatch('Logout', {})
|
|
.then(result => app.onRefreshPage())
|
|
}
|
|
}
|
|
})
|
|
},
|
|
|
|
// 跳转到钱包页面
|
|
onTargetWallet() {
|
|
this.$navTo('pages/wallet/index')
|
|
},
|
|
|
|
// 跳转到订单页
|
|
onTargetOrder(item) {
|
|
this.$navTo('pages/order/index', {
|
|
dataType: item.id
|
|
})
|
|
},
|
|
|
|
// 跳转到我的积分页面
|
|
onTargetPoints() {
|
|
this.$navTo('pages/points/log')
|
|
},
|
|
|
|
// 跳转到我的优惠券页
|
|
onTargetMyCoupon() {
|
|
this.$navTo('pages/my-coupon/index')
|
|
},
|
|
|
|
// 跳转到服务页面
|
|
handleService(url) {
|
|
uni.navigateTo({
|
|
url: url
|
|
})
|
|
},
|
|
|
|
},
|
|
|
|
/**
|
|
* 下拉刷新
|
|
*/
|
|
onPullDownRefresh() {
|
|
// 获取首页数据
|
|
this.getPageData(() => {
|
|
uni.stopPullDownRefresh()
|
|
})
|
|
},
|
|
|
|
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page{
|
|
background: #F8EEF7;
|
|
}
|
|
.arrow-right {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
padding-left: 10rpx;
|
|
}
|
|
|
|
.arrow-right image {
|
|
width: 12rpx;
|
|
height: 15rpx;
|
|
}
|
|
|
|
.gui-border-b {
|
|
border-bottom: 4rpx solid #F1F2F3;
|
|
}
|
|
|
|
.gui-color-gray {
|
|
color: #CCBBCC !important;
|
|
font-size: 60rpx !important;
|
|
}
|
|
|
|
.gui-footer-icon-buttons {
|
|
color: #FFF;
|
|
width: 130rpx;
|
|
// height: 80rpx;
|
|
padding: 20rpx 10rpx 10rpx;
|
|
flex: 1;
|
|
position: relative;
|
|
margin: 0;
|
|
// background-color: #F8F8F8;
|
|
}
|
|
|
|
.tab image {
|
|
width: 50rpx;
|
|
height: 60rpx;
|
|
}
|
|
|
|
.gui-footer-buttons-ab {
|
|
position: absolute;
|
|
z-index: 101;
|
|
left: 325rpx;
|
|
top: 0rpx;
|
|
width: 110rpx;
|
|
height: 150rpx;
|
|
}
|
|
|
|
.gui-footer-buttons-ab-icon {
|
|
width: 110rpx;
|
|
height: 110rpx;
|
|
line-height: 120rpx;
|
|
text-align: center;
|
|
font-size: 68rpx;
|
|
background-color: #F7F8FA;
|
|
border-radius: 100rpx;
|
|
}
|
|
</style>
|