396316021
/
pet_uni
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
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.
107 Commits
1 Branch
0 Tags
8.0 MiB
 
 
 
Tree: 70f8c0f286
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '70f8c0f286'
${ noResults }
pet_uni/pages/Index/components/UserPage/index.vue

375 lines
15 KiB
Raw Blame History

<template>
<!-- <view class="user-background" :style="{-->
<!-- backgroundImage:'url('+(userInfo.background_image ? userInfo.background_image : staticImage.bodyBackground)+')'-->
<!-- }">-->
<!-- -->
<!-- </view>-->
<!-- <view class="user-shadow" :style="{-->
<!-- backgroundImage:'url('+staticImage.bodyShadow+')'-->
<!-- }">-->
<!-- -->
<!-- </view>-->
<official-account></official-account>
<view class="app-wallpaper" :style="{
backgroundImage:'url('+staticImage.wallpaperBgImage+')'
}">
<view class="background-image" >
<view class="back">
<u-image width="100%" height="550" class="img" :src="staticImage.bodyShadow" mode="aspectFill"></u-image>
</view>
<view class="back">
<u-image width="100%" height="550" class="img" :src="userInfo.background_image ? userInfo.background_image : staticImage.bodyBackground" mode="aspectFill"></u-image>
</view>
</view>
<view class="user-detail row">
<view class="user-detail-avatar-container" @click="navTo('/pages/UserDetail/index',true)">
<view class="">
<!-- <image :src="user.avatar" mode="aspectFill" class="img"/>-->
<u-avatar :src="user.avatar" size="90"></u-avatar>
</view>
<view class="user-detail-avatar-border"></view>
</view>
<view class="user-detail-info" v-if="user.nickname">
<view class="user-detail-title-container row">
<u-image mode="widthFix" class="user-detail-img" width="83" height="36" :src="staticImage.hiImage"></u-image>
<view class="user-detail-title">
{{user.nickname}}
</view>
<view class="user-detail-coupons" :style="{
backgroundImage:'url('+staticImage.couponsImage+')'
}" @click="navTo('/pages/UserCoupons/index',true)">
{{user.coupon_count}}
</view>
<view class="user-detail-id col-12">会员编号：{{user.id}}</view>
</view>
</view>
<view class="user-detail-title-container row col" v-else>
<u-text text="登录" size="32" custom-style="margin-left:30rpx;" @click="navTo('/pages/Login/index')"></u-text>
</view>
</view>
<view class="user-information .user-button-group-container">
<view class="user-button-content">
<image class="img gun1" :src="staticImage.gun1" mode="heightFix"/>
<view class="user-title-img">
<u-image height="40" class="img" :src="staticImage.informationTitle" mode="heightFix"></u-image>
</view>
<view class="user-button-group row">
<view class="user-button col-4" @click="navTo('/pages/Pet/index?type=pet',true)">
<view class="img-box">
<u-image class="img" :src="staticImage.information.pet" mode="aspectFit" width="60" height="60"></u-image>
</view>
<view class="user-title">宝贝档案</view>
<view class="user-desc">{{ userExtends.pet_count ?? 0 }}个萌宠</view>
</view>
<view class="user-button col-4" @click="navTo('/pages/Addr/index',true)">
<view class="img-box">
<u-image class="img" :src="staticImage.information.info" mode="aspectFit" width="60" height="60"></u-image>
</view>
<view class="user-title">信息档案</view>
<view class="user-desc">{{ userExtends.address_count ?? 0 }}个地址</view>
</view>
<view class="user-button col-4" @click="navTo('/pages/Pet/index?type=feed',true)">
<view class="img-box">
<u-image class="img" :src="staticImage.information.feed" mode="aspectFit" width="60" height="60"></u-image>
</view>
<view class="user-title">喂养档案</view>
<view class="user-desc">{{ userExtends.feed_count ?? 0 }}个档案</view>
</view>
</view>
</view>
<view class="user-button-group-background">
<view class="user-button-group-container-background-color"></view>
<view class="user-button-group-container-background-border"></view>
</view>
</view>
<view class="user-baby-log .user-button-group-container">
<view class="user-button-content">
<image class="img gun2" :src="staticImage.gun2" mode="heightFix"/>
<view class="user-title-img row">
<u-image height="40" class="img" :src="staticImage.babyTitle" mode="heightFix"></u-image>
<!-- <view class="shop-car-container">-->
<!-- <image class="img shop-car" :src="staticImage.baby.shopCar" mode="heightFix"/>-->
<!-- <view class="shop-car-number">{{ userExtends.order_count }}</view>-->
<!-- </view>-->
</view>
<view class="user-button-group row">
<view class="user-button col-6" @click="navTo('/pages/UserOrderPage/index?type=0&is_buy=2',true)">
<view class="img-box">
<u-badge v-if="userExtends.order_pending>0" type="error" max="99" :value="userExtends.order_pending" absolute :offset="[0,0]" custom-style="z-index:1;"></u-badge>
<u-image width="90" height="90" class="img" :src="staticImage.baby.wait" mode="aspectFit"></u-image>
</view>
<view class="user-title">待服务</view>
</view>
<view class="user-button col-6" @click="navTo('/pages/UserOrderPage/index?type=2&is_buy=2',true)">
<view>
<view class="img-box">
<u-badge v-if="userExtends.order_in>0" type="error" max="99" :value="userExtends.order_in" absolute :offset="[0,0]" custom-style="z-index:1;"></u-badge>
<u-image width="90" height="90" class="img" :src="staticImage.baby.end" mode="aspectFit"></u-image>
</view>
<view class="user-title">已完成</view>
</view>
</view>
</view>
</view>
<view class="user-button-group-background">
<view class="user-button-group-container-background-color"></view>
<view class="user-button-group-container-background-border"></view>
</view>
</view>
<view class="user-big-service .user-button-group-container">
<view class="user-button-content">
<image class="img gun2" :src="staticImage.gun2" mode="heightFix"/>
<view class="user-title-img">
<u-image height="40" class="img" :src="staticImage.bigTitle" mode="heightFix"></u-image>
</view>
<view class="user-button-group row">
<view class="user-button col-6" @click="navTo('/pages/UserOrderPage/index?type=0&is_buy=1',true)">
<view class="img-box">
<u-badge v-if="userExtends.hm_order_pending>0" type="error" max="99" :value="userExtends.hm_order_pending" absolute :offset="[0,0]" custom-style="z-index:1;"></u-badge>
<u-image width="90" height="90" class="img" :src="staticImage.big.wait" mode="aspectFit"></u-image>
</view>
<view class="user-title">待服务</view>
</view>
<view class="user-button col-6" @click="navTo('/pages/UserOrderPage/index?type=2&is_buy=1',true)">
<view class="img-box">
<u-badge v-if="userExtends.hm_order_in>0" type="error" max="99" :value="userExtends.hm_order_in" absolute :offset="[0,0]" custom-style="z-index:1;"></u-badge>
<u-image width="90" height="90" class="img" :src="staticImage.big.end" mode="aspectFit"></u-image>
</view>
<view class="user-title">已完成</view>
</view>
</view>
</view>
<view class="user-button-group-background">
<view class="user-button-group-container-background-color"></view>
<view class="user-button-group-container-background-border"></view>
</view>
</view>
<view class="user-more .user-button-group-container">
<view class="user-button-content">
<image class="img gun2" :src="staticImage.gun2" mode="heightFix"/>
<view class="user-title-img">
<u-image height="40" class="img" :src="staticImage.moreTitle" mode="heightFix"></u-image>
</view>
<view class="user-button-group row">
<view class="user-button col-3">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.online" @click="navTo('/pages/ChatDetail/index?id=0',true)" mode="aspectFit"></u-image>
</view>
<view class="user-title">在线沟通</view>
</view>
<view class="user-button col-3" @click="openPrivacyContract" >
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.privacy" mode="aspectFit"></u-image>
</view>
<view class="user-title">隐私协议</view>
</view>
<view class="user-button col-3" @click="navTo('/pages/Feed/index',true)">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.feedback" mode="aspectFit"></u-image>
</view>
<view class="user-title">意见反馈</view>
</view>
<view class="user-button col-3" @click="navTo('/pages/AboutUs/AboutUs')">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.about" mode="aspectFit"></u-image>
</view>
<view class="user-title">关于我们</view>
</view>
</view>
</view>
<view class="user-button-group-background">
<view class="user-button-group-container-background-color"></view>
<view class="user-button-group-container-background-border"></view>
</view>
</view>
<view class="user-more user-button-group-container">
<view class="user-button-content">
<image class="img gun2" :src="staticImage.gun2" mode="heightFix"/>
<view class="user-button-group row" style="justify-content: flex-start;">
<view class="user-button col-3">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.feedback" @click="navTo('/pages/Draw/list')" mode="aspectFit"></u-image>
</view>
<view class="user-title">我的奖品</view>
</view>
<view class="user-button col-3" v-if="userInfo.is_waitstaff === 1">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.about" @click="navTo('/pages/Help/index')" mode="aspectFit"></u-image>
</view>
<view class="user-title">进入帮填</view>
</view>
<view class="user-button col-3" v-if="workerToken">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.about" @click="clearWorkerUser" mode="aspectFit"></u-image>
</view>
<view class="user-title">退出帮填</view>
</view>
<view class="user-button col-3">
<view class="img-box">
<u-image width="48" height="48" class="img" :src="staticImage.more.feedback" @click="navTo('/pages/UserOrderPage/index',true)" mode="aspectFit"></u-image>
</view>
<view class="user-title">我的订单</view>
</view>
</view>
</view>
<view class="user-button-group-background">
<view class="user-button-group-container-background-color"></view>
<view class="user-button-group-container-background-border"></view>
</view>
</view>
</view>
</template>
<script>
import {
imghost
} from '@/config/host.js'
import HeaderNav from '@/components/HeaderNav/Index.vue';
import FooterNav from '@/components/FooterNav/Index.vue';
import RightNav from '@/components/RightNav/Index.vue';
import api from '@/utils/functions.js';
import {userDetail, userExtends} from "@/api/user";
import log from "@/utils/log";
import {UserCache} from "@/config/config";
export default {
components: {
HeaderNav,
FooterNav,
RightNav
},
data() {
return {
title: 'Hello',
loading: true,
staticImage:{
hiImage:imghost+'/index-user-title-hi.png',
couponsImage:imghost+'/user-coupons.png',
bodyBackground:imghost+'/user-background.png',
bodyShadow:imghost+'/user-detail-background.png',
informationTitle:imghost+'/user-information-title.png',
babyTitle:imghost+'/user-baby-title.png',
bigTitle:imghost+'/user-big-title.png',
moreTitle:imghost+'/user-more-title.png',
gun1:imghost+'/user-gun-1.png',
gun2:imghost+'/user-gun-2.png',
information:{
pet:imghost+'/user-information-pet.png',
info:imghost+'/user-information-info.png',
feed:imghost+'/user-information-feed.png',
},
baby:{
wait:imghost+'/user-baby-wait.png',
end:imghost+'/user-baby-end.png',
shopCar:imghost+'/user-shop-car.png',
},
big:{
wait:imghost+'/user-big-wait.png',
end:imghost+'/user-big-end.png',
},
more:{
online:imghost+'/user-more-online.png',
privacy:imghost+'/user-more-privacy.png',
feedback:imghost+'/user-more-feedback.png',
about:imghost+'/user-more-about.png',
}
},
user:{
avatar:'',
nickname:'',
coupon_count:0,
id:0,
feed_count:0
},
isTop:false,
pagePadding:100,
userInfo:{},
userExtends:{},
workerToken:{}
}
},
methods: {
clearWorkerUser(){
let token = uni.getStorageSync('workerToken');
uni.removeStorageSync('workerToken');
uni.setStorageSync('token',token);
userDetail().then(res => {
this.$store.commit('userInfo', UserCache.setAndReturn(res.data));
uni.showToast({title:'退出成功'});
uni.reLaunch({url:'/pages/Index/index'})
});
},
openPrivacyContract() {
uni.openPrivacyContract({});
},
navTo(url,token = false) {
if (token) {
if (uni.getStorageSync('token')) {
uni.navigateTo({
url: url
})
} else {
uni.navigateTo({
url: '/pages/Login/index'
})
}
}else{
uni.navigateTo({
url: url
})
}
},
showNumber(){
userExtends().then(data => {
log(data);
this.userExtends = data.data;
this.$store.commit('userExtends',UserCache.extSetAndReturn(data.data));
});
},
updateUserInfo(){
if(this.userInfo){
this.user.id = this.userInfo.id
this.user.nickname = this.userInfo.name
this.user.avatar = this.userInfo.avatar
this.user.coupon_count = this.userExtends.coupon_count
}
},
showUserInfo(){
this.workerToken = uni.getStorageSync('workerToken');
userDetail().then(res => {
this.$store.commit('userInfo', UserCache.setAndReturn(res.data));
})
}
},
mounted() {
if(uni.getStorageSync('token')){
this.showUserInfo();
this.showNumber();
}
},
created() {
this.pagePadding = (api.navHeight().navPaddingTop+
api.navHeight().navHeight + (api.navHeight().headerPadding *2))
},
watch:{
"$store.state.userInfo": {
handler(newVal, oldVal) {
this.userInfo = newVal;
this.updateUserInfo();
}
},
"$store.state.userExtends": {
handler(newVal, oldVal) {
this.userExtends = newVal;
this.updateUserInfo();
}
}
}
}
</script>
<style lang="scss">
@import './components/index.scss';
</style>