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.
 
 
 
 
 
huazhiyu/pages/my/my.vue

400 lines
11 KiB

<template>
<view class="page">
<view class="my-top">
<!-- head -->
<view class="head" :style="'background-color: rgba(255,255,255,'+(scrollTop/50)+');'">
<view class="title" style="margin-left:20px;">
<text v-show="scrollTop>20">我的</text>
</view>
<view class="setting-mess">
<view class="setting" @click="onSetting">
<text class="iconfont icon-setting" :style="scrollTop>20?'color:#333333':'color:#236030'"></text>
</view>
</view>
</view>
<!-- 用户信息 -->
<view class="user-info" v-if="userInfo.id" @click="goUserCenter">
<view class="portrait">
<image :src="userInfo.avatar" mode="aspectFill"></image>
</view>
<view class="info">
<view class="nickname">
<text>{{userInfo.nickname}}</text>
</view>
<view class="nickname">
<!-- <image src="/static/rank.png"></image>
<text>{{userInfo.score}}</text> -->
<text>{{userInfo.mobile.replace(/^(\d{3})\d{4}(\d{4})/,'$1****$2')}}</text>
</view>
</view>
<u-icon name="arrow-right" color="#236030" class="right"></u-icon>
</view>
<view class="user-info" v-else @click="onUserInfo">
<view class="portrait">
<image src="/static/image/logo254.png"></image>
</view>
<view class="info">
<view class="nickname">
<text>登录/注册</text>
</view>
</view>
</view>
<!-- 订单信息 -->
<view class="order-info">
<view class="shopTop">
<view class="star" @click="goCollection">
<u-icon name="star" color="#ffffff"></u-icon>
<text>商品收藏</text>
</view>
<view class="star">
<text>商品评价</text>
</view>
</view>
<div class="shopItem">
<view class="list" @click="onSkipOrder(1)">
<view class="icon">
<image src="../../static/image/1.png" mode="heightFix"></image>
<!-- <text class="num">22</text> -->
</view>
<view class="title">
<text>待付款</text>
</view>
</view>
<view class="list" @click="onSkipOrder(2)">
<view class="icon">
<image src="../../static/image/2.png" mode="heightFix"></image>
<!-- <text class="num">22</text> -->
</view>
<view class="title">
<text>待发货</text>
</view>
</view>
<view class="list" @click="onSkipOrder(3)">
<view class="icon">
<image src="../../static/image/3.png" mode="heightFix"></image>
<!-- <text class="num">22</text> -->
<!-- <text class="num">22</text> -->
</view>
<view class="title">
<text>待收货</text>
</view>
</view>
<view class="list" @click="onSkipOrder(4)">
<view class="icon">
<image src="../../static/image/4.png" mode="heightFix"></image>
<!-- <text class="num">22</text> -->
<!-- <text class="num">22</text> -->
</view>
<view class="title">
<text>待评价</text>
</view>
</view>
<view class="list" @click="onSkipOrder(5)">
<view class="icon">
<image src="../../static/image/5.png" mode="heightFix"></image>
<!-- <text class="num">22</text> -->
<!-- <text class="num">22</text> -->
</view>
<view class="title">
<text>我的订单</text>
</view>
</view>
</div>
</view>
</view>
<!-- 买方 -->
<view class="wallet-info">
<view class="fangmian">
买方
</view>
<view class="infoContainer">
<view class="list" @click="goBuyWareHouse(-1)">
<view class="icon">
<image src="../../static/image/c1.png" mode="heightFix"></image>
</view>
<view class="title">
<text>我的仓库</text>
</view>
</view>
<view class="list" @click="goBuyWareHouse(0)">
<view class="icon">
<image src="../../static/image/c2.png" mode="heightFix"></image>
</view>
<view class="title">
<text>确认付款</text>
</view>
</view>
<view class="list" @click="goBuyWareHouse(1)">
<view class="icon">
<image src="../../static/image/c3.png" mode="heightFix"></image>
</view>
<view class="title">
<text>确认收货</text>
</view>
</view>
<view class="list" @click="goBuyWareHouse(3)">
<view class="icon">
<image src="../../static/image/c4.png" mode="heightFix"></image>
</view>
<view class="title">
<text class="action">已完成</text>
</view>
</view>
</view>
</view>
<!-- 卖方 -->
<view class="wallet-info">
<view class="fangmian">
卖方
</view>
<view class="infoContainer">
<view class="list" @click="goSellWareHouse(-1)">
<view class="icon">
<image src="../../static/image/c1.png" mode="heightFix"></image>
</view>
<view class="title">
<text>我的仓库</text>
</view>
</view>
<view class="list" @click="goSellWareHouse(0)">
<view class="icon">
<image src="../../static/image/c2.png" mode="heightFix"></image>
</view>
<view class="title">
<text>确认付款</text>
</view>
</view>
<view class="list" @click="goSellWareHouse(1)">
<view class="icon">
<image src="../../static/image/c3.png" mode="heightFix"></image>
</view>
<view class="title">
<text>确认收货</text>
</view>
</view>
<view class="list" @click="goSellWareHouse(3)">
<view class="icon">
<image src="../../static/image/c4.png" mode="heightFix"></image>
</view>
<view class="title">
<text class="action">已完成</text>
</view>
</view>
</view>
</view>
<view class="card">
<u-cell-group :border="false">
<u-cell icon="order" :iconStyle="{'color':'#236030'}" @click="onIncome" :titleStyle="{'color':'#236030'}" title="收支详情" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="gift" :iconStyle="{'color':'#236030'}" @click="onMySign" :titleStyle="{'color':'#236030'}" title="签约中心" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="rmb-circle" :iconStyle="{'color':'#236030'}" @click="onRecharge" :titleStyle="{'color':'#236030'}" title="充值入口" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="rmb-circle" :iconStyle="{'color':'#236030'}" @click="onWithdraw" :titleStyle="{'color':'#236030'}" title="提现入口" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="map" :iconStyle="{'color':'#236030'}" @click="onAddress" :titleStyle="{'color':'#236030'}" title="我的地址" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="coupon" :iconStyle="{'color':'#236030'}" @click="jump(1)" :titleStyle="{'color':'#236030'}" title="我的优惠券" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="scan" :iconStyle="{'color':'#236030'}" @click="jump(4)" :titleStyle="{'color':'#236030'}" title="我的邀请二维码" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<!-- -->
<u-cell icon="man-add" v-show="!userInfo.pid&&userInfo.pid!=0" :iconStyle="{'color':'#236030'}" @click="jump(5)" :titleStyle="{'color':'#236030'}" title="绑定推荐人" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
</u-cell-group>
</view>
<view class="card">
<u-cell-group :border="false">
<u-cell icon="share-square" @click="jump(2)" :iconStyle="{'color':'#236030'}" :titleStyle="{'color':'#236030'}" title="分销中心" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="rmb" @click="goPay" :iconStyle="{'color':'#236030'}" :titleStyle="{'color':'#236030'}" title="收款管理" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
<u-cell icon="rmb-circle" @click="jump(3)" :iconStyle="{'color':'#236030'}" :titleStyle="{'color':'#236030'}" title="我的收益" :isLink="true" :rightIconStyle="{'color':'#236030'}"></u-cell>
</u-cell-group>
</view>
<!-- tabbar -->
<TabBar :tabBarShow="3"></TabBar>
</view>
</template>
<script>
import {getUserInfo} from '@/common/api.js'
import TabBar from '../../components/TabBar/TabBar.vue';
export default {
components:{
TabBar,
},
data() {
return {
scrollTop: 0,
isHotline: false,
userInfo:{
avatar:"",
createtime:null,
expires_in:null,
expiretime:null,
id:null,
mobile:null,
nickname:null,
score:null,
token:null,
user_id:null,
username:null,
}
};
},
onReady() {
uni.hideTabBar();
},
onPageScroll(e) {
this.scrollTop = e.scrollTop;
},
onShow(){
this.getUserInfoHandle()
},
methods:{
goUserCenter(){
uni.navigateTo({
url:'/pages/Information/Information?name='+this.userInfo.nickname+'&avatar='+this.userInfo.avatar
})
},
goPay(){
uni.navigateTo({
url:'/pages/shoukuan/shoukuan'
})
},
//获取用户信息
getUserInfoHandle(){
getUserInfo().then(res=>{
this.userInfo =Object.assign(({},this.userInfo,res.data))
})
},
/**
* 用户信息点击
* @param {Number} type
*/
onUserInfo(){
uni.navigateTo({
url: '/pages/login/login'
})
},
onRecharge(){
uni.navigateTo({
url: '/pages/my/recharge',
})
},
onWithdraw(){
uni.navigateTo({
url: '/pages/my/withdraw',
})
},
// 收支详情
onIncome(){
uni.navigateTo({
url: '/pages/my/incomeExpenditureDetail',
})
},
// 我的签约
onMySign(){
uni.navigateTo({
url: '/pages/my/mySign',
})
},
/**
* 地址点击
*/
onAddress(){
uni.navigateTo({
url: '/pages/AddressList/AddressList',
})
},
/**
* 关注跳转
*/
onCollect(type){
switch (type){
case 'goods':
uni.navigateTo({
url: '/pages/GoodsOn/GoodsOn'
})
break;
case 'content':
uni.navigateTo({
url: '/pages/ContentCollection/ContentCollection'
})
break;
case 'record':
uni.navigateTo({
url: '/pages/BrowsingHistory/BrowsingHistory'
})
break;
}
},
goCollection(){
uni.navigateTo({
url:'/pages/GoodsOn/GoodsOn'
})
},
/**
* 订单
*/
onSkipOrder(type){
uni.navigateTo({
url: '/pages/MyOrderList/MyOrderList?type=' + type,
})
},
/**
* 设置点击
*/
onSetting(){
uni.navigateTo({
url: '/pages/Setting/Setting'
})
},
jump(val){
if(val==1){
uni.navigateTo({
url:'/pages/MyCoupon/MyCoupon'
})
}else if(val==2){
uni.navigateTo({
url:'/pages/fenxiao/fenxiao'
})
}else if(val==3){
uni.navigateTo({
url:'/pages/shouyi/shouyi'
})
}else if(val==4){
uni.navigateTo({
url:'/pages/my/invite'
})
}else if(val==5){
uni.navigateTo({
url:'/pages/bind/bind'
})
}
},
goBuyWareHouse(val){
uni.navigateTo({
url:"/pages/warehouse/buy?type="+val
})
},
goSellWareHouse(val){
uni.navigateTo({
url:"/pages/warehouse/sell?type="+val
})
},
}
}
</script>
<style scoped lang="scss">
@import 'my.scss';
::v-deep .u-cell__body{
padding:30rpx !important
}
</style>