This commit is contained in:
gyq
2025-09-25 11:16:36 +08:00
15 changed files with 486 additions and 44 deletions

View File

@@ -17,35 +17,78 @@
</view>
</view>
<up-gap height="26rpx" bg-color="#F9F9F9"></up-gap>
<view class="my_item my_assets" @click="Myassets">
<view class="my_item_title">我的资产</view>
<view class="my_assets_list">
<view class="my_list_item">
<image class="my_list_item_icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png" mode="aspectFill">
</image>
<view class="my_list_item_name">储值</view>
<view class="my_list_item_num">{{userInfo.amount || '0'}}</view>
<view class="amount">
<view class="u-flex u-flex-between u-m-t-20">
<view class="u-flex">
<image style="width: 50rpx;height: 37rpx;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png"
mode="aspectFill">
</image>
<text class="color-333 font-14 u-m-l-20">储值</text>
</view>
<view class="u-flex color-666">
<text class="font-12 u-m-r-4">3家店</text>
<up-icon name="arrow-down" color="#666" size="12px"></up-icon>
</view>
</view>
<view class="my_list_item">
<image class="my_list_item_icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png">
</image>
<view class="my_list_item_name">积分</view>
<view class="my_list_item_num">{{userInfo.accountPoints || 0}}</view>
</view>
<view class="my_list_item">
<image class="my_list_item_icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/coupon.png">
</image>
<view class="my_list_item_name">优惠券</view>
<view class="my_list_item_num">{{userInfo.couponNum ||'0'}}</view>
<view class="card-list">
<view class="card-list-item" v-for="(item,index) in 3" :key="index">
<up-image radius="20rpx" width="182rpx" height="182rpx"></up-image>
<view class="info text-center">
<view class="color-333 u-m-t-14 ">
<text class="font-10">¥</text>
<text class="font-16 font-700 ">9999.99</text>
</view>
<view class="font-12 color-666">这里是店铺名称</view>
</view>
</view>
<view class="u-flex u-flex-column u-flex-center">
<view class="text-center color-333 font-12">查看全部</view>
</view>
</view>
</view>
</view>
<view class="vip u-m-t-40">
<view class="u-flex u-flex-between u-m-t-20">
<view class="u-flex">
<image style="width: 50rpx;height: 37rpx;"
src="/static/icon/vip.png"
mode="aspectFill">
</image>
<text class="color-333 font-14 u-m-l-20">会员</text>
</view>
<view class="u-flex color-666">
<text class="font-12 u-m-r-4">3家店</text>
<up-icon name="arrow-down" color="#666" size="12px"></up-icon>
</view>
</view>
<view class="card-list">
<view class="card-list-item" v-for="(item,index) in 3" :key="index">
<up-image radius="20rpx" width="182rpx" height="182rpx"></up-image>
<view class="info text-center">
<view class="color-333 u-m-t-14 ">
<text class="font-10">¥</text>
<text class="font-16 font-700 ">9999.99</text>
</view>
<view class="font-12 color-666">这里是店铺名称</view>
</view>
</view>
<view class="u-flex u-flex-column u-flex-center">
<view class="text-center color-333 font-12">查看全部</view>
</view>
</view>
</view>
<view class="my_item my_fun">
<view class="my_item_title">我的功能</view>
</view>
<view class="my_item my_fun u-m-t-30">
<view class="my_fun_list">
<view class="my_list_item" v-for="(item,index) in myFunList" :key="index"
@click="clickTo(item,index)">
@@ -53,8 +96,11 @@
<image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image>
<view class="my_list_item_name">{{item.name}}</view>
</view>
<view class="my_list_item_right">
<u-icon name="play-right-fill" color="#999999" size="12"></u-icon>
<view class="my_list_item_right u-flex ">
<text v-if="item.type=='score'" class="font-12 ">{{userInfo.accountPoints || 0}}</text>
<text v-else-if="item.type=='my_coupon'" class="font-12 ">{{userInfo.couponNum || 0}}</text>
<text class="font-12 color-999" v-else>查看</text>
<u-icon class="u-m-t-2" name="arrow-right" color="#999999" size="12"></u-icon>
</view>
</view>
</view>
@@ -82,26 +128,31 @@
} from '@/stores/user.js';
const store = productStore();
const myFunList = ref([{
name: "我的优惠券",
name: "积分",
type: "score",
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png"
},
{
name: "优惠券",
type: "my_coupon",
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_coupon.png"
},
{
name: "我的订单",
type: "my_order",
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_order.png"
},
// {
// name: "我的订单",
// type: "my_order",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_order.png"
// },
// { name: "收货地址", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_address.png"},
// {
// name: "个人资料",
// type: "myself",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/personal.png"
// },
{
name: "我的会员卡",
type: "my_member",
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png"
},
// {
// name: "我的会员卡",
// type: "my_member",
// icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png"
// },
// { name: "关于", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/inRegard.png"},
])
@@ -218,13 +269,12 @@
.myContent {
position: relative;
z-index: 1;
padding: 298rpx 20rpx 0 20rpx;
padding: 298rpx 0 0 0;
.my_info {
height: 172rpx;
align-items: center;
background-color: #fff;
padding: 0 32rpx;
padding: 32rpx 32rpx;
border-radius: 18rpx;
.my_info_left {
@@ -272,9 +322,8 @@
.my_item {
background-color: #fff;
padding: 22rpx 32rpx;
padding: 0 32rpx;
border-radius: 18rpx;
margin-top: 16rpx;
.my_item_title {
font-weight: bold;
@@ -362,4 +411,22 @@
}
}
}
.card-list {
display: grid;
grid-template-columns: repeat(4, 1fr);
column-gap: 40rpx;
margin-top: 20rpx;
.card-list-item{
max-width: 182rpx;
box-shadow: 8rpx 8rpx 32rpx 0 #0b18390f;
.info{
padding-bottom: 16rpx;
overflow: hidden;
}
}
}
</style>