Files
XiaoLingHou_web/pages/mine/components/MineHeader.vue
2023-12-29 00:08:10 +08:00

87 lines
1.6 KiB
Vue

<template>
<!-- 用户信息组件 -->
<view class="mine-hd">
<view class="mine-info">
<view class="mine-avatar">
<image :src="userInfo.avatar" mode="aspectFit"></image>
</view>
<view class="mine-info-text">
<view class="name">
<view class="name-text">{{ userInfo.nickname }}</view>
<!-- <view class="member-sign">
<image src="../../../static/mine/m_gorden_member.png" mode="aspectFit" v-if="memberStatus"></image>
<image src="../../../static/mine/m_normal_member.png" mode="aspectFit" v-else></image>
</view> -->
</view>
<!-- <view class="member-text">
<text v-if="memberStatus">会员到期时间: 2023-05-28 24:00:00</text>
<text v-else>暂未开通会员</text>
</view> -->
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
memberStatus: false,
orderList: []
}
},
computed: {
userInfo() {
return this.$storeMine.userInfo;
}
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.mine-hd {
padding: 0 0 30rpx;
.mine-info {
display: flex;
align-items: center;
.mine-avatar {
image {
width: 109rpx;
height: 109rpx;
border-radius: 9999rpx;
}
}
.mine-info-text {
padding-left: 25rpx;
.name {
display: flex;
align-items: center;
.name-text {
line-height: 40rpx;
font-size: 38rpx;
font-weight: 600;
}
.member-sign {
padding-left: 10rpx;
image {
width: 150rpx;
height: 40rpx;
}
}
}
.member-text {
padding-top: 10rpx;
font-size: 24rpx;
}
}
}
}
</style>