food_wechat/pages/main/index.vue
air f704e809e8 【类 型】:
【原  因】:
【过  程】:
【影  响】:
2025-06-25 12:36:08 +08:00

91 lines
2.1 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="vh100 flex column">
<!-- topbar -->
<u-navbar title="我的" bgColor="#d43030" :titleStyle="{ color: '#FFF'}" :autoBack="true" placeholder>
<view class="u-nav-slot" slot="left">
<u-icon name="arrow-left" color="#fff" size="19"></u-icon>
</view>
</u-navbar>
<!-- 头像 -->
<view class="flex mc">
<view class="avatarBox rad-c">
<u-avatar size="300rpx" :src="avatarSrc"></u-avatar>
</view>
</view>
<!-- 昵称 -->
<view class="flex mc fz28 fb m-t-24">
{{userInfo.name}}
</view>
<!-- 菜单栏 -->
<view class="m-t-24 m-r-24 m-l-24 bg-w p-24 rad8 boxshadow">
<view class="fb fz36 p-b-12 borderBDas">常用功能</view>
<view class="flex msb">
<navigator url="/pages/order/index">
<view class="setItemBox flex mac column p-24">
<u-icon name="order" size="28"></u-icon>
<view class="fz24">订单</view>
</view>
</navigator>
<view class="setItemBox flex mac column p-24">
<u-icon name="map-fill" size="28"></u-icon>
<view class="fz24">地图</view>
</view>
<view class="setItemBox flex mac column p-24" @click="callPhone(shopCon.tel)">
<u-icon name="server-fill" size="28"></u-icon>
<view class="fz24">客服</view>
</view>
<view class="setItemBox flex mac column p-24">
<u-icon name="setting-fill" size="28"></u-icon>
<view class="fz24">设置</view>
</view>
</view>
</view>
<!-- tabbar -->
<view>
<tabbar></tabbar>
</view>
</view>
</template>
<script>
import {
callPhone
} from '@/utils/index.js'
export default {
data() {
return {
avatarSrc: "", //头像地址
menuCurrent: null, //tabbar当前页
}
},
onShow() {
// 当页面显示时设置tabber的激活项
this.$store.commit('setTabbarCurrent', 2)
},
methods: {
callPhone,
},
computed: {
userInfo() {
return this.$store.state.userInfo
},
//单位信息
shopCon() {
return this.$store.state.shopCon
},
},
watch: {}
}
</script>
<style lang="scss" scoped>
.avatarBox {
margin-top: 89rpx;
border: 12rpx solid #fff;
}
.setItemBox {
width: 72rpx;
height: 72rpx;
}
</style>