ry_app/pages/menu.vue

109 lines
2.0 KiB
Vue

<template>
<view class="menu">
<!-- 顶部用户信息 -->
<view class="user-info">
<image class="avatar" src="/static/avatar.png"></image>
<text class="name">个人店</text>
<text class="sub">商店智能店</text>
<text class="stats">已上线50万会员 | 管理员</text>
</view>
<!-- 企业管理 -->
<view class="section">
<text class="section-title">企业管理</text>
<view class="section-item">
<text class="item-label">企业名称</text>
<text class="item-value">总部/管理员</text>
</view>
<view class="section-item">
<text class="item-label">创建企业组织</text>
<text class="item-label">创建店铺</text>
</view>
</view>
<!-- 其他菜单项 -->
<view class="menu-list">
<view class="menu-item" @click="goToPage('shop')">
<text></text>
<text>202 今日进店</text>
</view>
<view class="menu-item" @click="goToPage('product')">
<text>商品管理</text>
</view>
<!-- 其他菜单项... -->
</view>
</view>
</template>
<script>
export default {
methods: {
goToPage(page) {
uni.navigateTo({ url: `/pages/${page}/${page}` })
this.$emit('close')
}
}
}
</script>
<style scoped>
.menu {
padding: 40rpx;
height: 100%;
background: #fff;
}
.user-info {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 40rpx;
}
.avatar {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
margin-bottom: 20rpx;
}
.name {
font-size: 36rpx;
font-weight: bold;
}
.sub {
font-size: 28rpx;
color: #666;
margin: 10rpx 0;
}
.stats {
font-size: 24rpx;
color: #888;
}
.section {
margin: 30rpx 0;
}
.section-title {
font-size: 30rpx;
font-weight: bold;
display: block;
margin-bottom: 20rpx;
}
.section-item {
display: flex;
justify-content: space-between;
margin: 15rpx 0;
}
.menu-item {
padding: 25rpx 0;
border-bottom: 1rpx solid #eee;
display: flex;
justify-content: space-between;
}
</style>