appointment_weapp/pages/my/index.vue

408 lines
8.9 KiB
Vue

<template>
<view>
<navbar :collapse='false' :Background='Background' :navtitle='navtitle' :navboxshow="navboxshow"
@fatherMethod='navfatherMethod'></navbar>
<view class="index_box">
<image class="index_boximge" :src="userlist.background" mode="aspectFill"></image>
<!-- #ifdef MP-WEIXIN -->
<navigator :url="'/pages/my/setup/index'" class="index_boxone flex-between"
:style="[{'padding-top':HeighT.customBar+'px'}]">
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<navigator :url="'/pages/my/setup/index'" class="index_boxone flex-between" style="padding-top:44px;">
<!-- #endif -->
<view class="index_boxone_one flex-start" v-if="userlist.user">
<image :src="userlist.user.avatar" mode="aspectFill"></image>
<view class="index_boxone_tow flex-colum-start">
<text class="index_boxone_tow_one">{{userlist.user.nickname || "暂无昵称"}}</text>
<text class="index_boxone_tow_tow">{{userlist.user.user_id}}</text>
</view>
</view>
<u-icon name="setting" color="#fff" size="20"></u-icon>
</navigator>
<view class="onebox">
<view class="onebox_one">
<view class="onebox_one_text flex-between">
<text>我的订单</text>
<text @click="order(10)">查看全部</text>
</view>
<view class="onebox_one_one flex-around">
<view class="flex-colum" v-for="(item,index) in userlist.user_order" :key="index"
@click="order(index)">
<image :src="item.img" mode="aspectFill"></image>
<text>{{item.name}}</text>
</view>
</view>
</view>
</view>
<view class="towbox flex-between">
<view class="towbox_item flex-start" v-for="(item,index) in userlist.t_user" :key="index"
@click="toworder(index)">
<image :src="item.img" mode="aspectFill"></image>
<view class="flex-colum">
<text>{{item.name}}</text>
<view v-if="index==0">{{item.balance}}<text>元</text></view>
<view v-if="index==1">{{item.card_count}}<text>张</text></view>
</view>
</view>
</view>
<view class="therebox">
<view class="therebox_item flex-between" v-for="(item,index) in userlist.list" :key="index"
@click="mobilemobile(item)">
<view class="flex-start">
<image :src="item.img" mode="aspectFill"></image>
<text>{{item.name}}</text>
</view>
<u-icon name="arrow-right" color="#9b9b9b" size="14"></u-icon>
</view>
</view>
</view>
<bottombbar :valuebbar='4'></bottombbar>
</view>
</template>
<script>
import navbar from '@/components/navbar.vue'
import bottombbar from '@/components/bottombbar.vue'
export default {
components: {
navbar,
bottombbar
},
computed: {
HeighT() {
return this.$store.getters.is_BarHeight
},
},
data() {
return {
navtitle: '', //名称
navboxshow: '0', //显示
Background: 'none',
userlist: {
user: {
avatar: "https://door.sxczgkj.cn//assets/img/avatar.png",
nickname: "超掌柜",
user_id: 1001,
},
t_user: [{
balance: "0.00",
img: "https://door.sxczgkj.cn//apple/qb.png"
}, {
card_count: "0",
img: "https://door.sxczgkj.cn//apple/kx.png"
}],
list: [{
img: "https://door.sxczgkj.cn//apple/kf.png",
mobile: "0290102212",
name: "联系客服",
url: ""
}, {
img: "https://door.sxczgkj.cn//apple/aq.png",
name: "安全密码",
url: "my/setup/repairpassword",
}]
}
}
},
onLoad() {
},
onShow() {
this.$store.dispatch("actionsclassification");
this.usermy()
this.$store.dispatch('storeuseruserinfo')
},
methods: {
async mobilemobile(e) {
switch (e.name) {
case '联系客服':
uni.makePhoneCall({
phoneNumber: e.mobile //打电话
});
break;
case '安全密码':
if (uni.cache.get('loginuser').userinfo.mobile) {
uni.pro.navigateTo(e.url)
} else {
uni.showModal({
title: '提示',
content: '确认订单需要获取您的手机号',
success: function(res) {
if (res.confirm) {
uni.redirectTo({
url: '/pages/my/setup/index'
});
} else if (res.cancel) {}
}
});
}
break;
case '我的地址':
uni.pro.navigateTo(e.url)
break;
}
},
async usermy() {
let res = await this.api.usermy({
store_id: uni.cache.get('store_id') // 判断显示哪家的作品,
})
this.userlist = res
console.log(res)
},
threelist(e) {
uni.pro.navigateTo('my/order/index', {
e: e
})
},
toworder(e) {
if (e == 0) {
uni.pro.navigateTo('my/member/memberone', e)
} else {
uni.pro.navigateTo('my/member/index', {
e: e
})
}
},
order(e) {
switch (e) {
case 10:
if (uni.cache.get('loginuser').style_type == 2) {
uni.pro.navigateTo('mall/order/index', {
e: 0
})
} else {
uni.pro.navigateTo('my/order/index', {
e: 0
})
}
break;
case 0:
if (uni.cache.get('loginuser').style_type == 2) {
uni.pro.navigateTo('mall/order/index', {
e: 1
})
} else {
uni.pro.navigateTo('my/order/index', {
e: 1
})
}
break;
case 1:
if (uni.cache.get('loginuser').style_type == 2) {
uni.pro.navigateTo('mall/order/index', {
e: 2
})
} else {
uni.pro.navigateTo('my/order/index', {
e: 2
})
}
break;
case 2:
if (uni.cache.get('loginuser').style_type == 2) {
uni.pro.navigateTo('mall/order/index', {
e: 3
})
} else {
uni.pro.navigateTo('my/order/index', {
e: 3
})
}
break;
case 3:
if (uni.cache.get('loginuser').style_type == 2) {
uni.pro.navigateTo('mall/order/index', {
e: 4
})
} else {
uni.pro.navigateTo('my/order/index', {
e: 4
})
}
}
}
}
}
</script>
<style lang="scss">
page {
background: #F9F9F9;
}
.index_box {
position: relative;
padding: 0 32rpx;
width: 100%;
height: 502rpx;
// background: url(@/static/1.png) no-repeat;
background-size: cover;
.index_boximge {
z-index: 0;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.index_boxone {
z-index: 9;
.index_boxone_one {
image {
z-index: 999;
width: 124rpx;
height: 124rpx;
border-radius: 50%;
}
}
.index_boxone_tow {
margin-left: 32rpx;
height: 100rpx;
justify-content: space-around;
.index_boxone_tow_one {
z-index: 9;
font-size: 40rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
.index_boxone_tow_tow {
z-index: 9;
font-size: 28rpx;
font-family: Segoe UI-Regular, Segoe UI;
font-weight: 400;
color: #FFFFFF;
}
}
}
.onebox {
position: relative;
top: 40rpx;
.onebox_one {
width: 100%;
background: #FFFFFF;
border-radius: 12rpx;
padding: 32rpx;
.onebox_one_text{
width: 100%;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
text:nth-child(2){
font-size: 28rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: 500;
color: #666;
}
}
.onebox_one_one {
margin-top: 32rpx;
.flex-colum {
image {
width: 64rpx;
height: 64rpx;
}
text {
margin-top: 16rpx;
font-size: 28rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #333333;
}
}
}
}
}
.towbox {
margin-top: 64rpx;
.towbox_item {
width: 48%;
background: #FFFFFF;
padding: 32rpx 24rpx;
border-radius: 12rpx;
image {
width: 100rpx;
height: 100rpx;
}
.flex-colum {
width:50%;
margin-left: 28rpx;
align-items: flex-start;
text {
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #999999;
}
view {
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
text {
color: #333333;
font-size: 22rpx;
}
}
}
}
}
.therebox {
margin-top: 32rpx;
width: 100%;
background: #FFFFFF;
border-radius: 12rpx;
padding: 0 32rpx 32rpx 32rpx;
.therebox_item {
padding-top: 32rpx;
.flex-start {
image {
width: 32rpx;
height: 32rpx;
}
text {
margin-left: 24rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
}
}
}
}
</style>