You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
25 lines
1012 B
25 lines
1012 B
<template>
|
|
<view class="cart-bar" @tap="$emit('open')">
|
|
<view class="cart-icon-wrap">
|
|
<text class="cart-icon">🍷</text>
|
|
<text v-if="count > 0" class="cart-badge">{{ count }}</text>
|
|
</view>
|
|
<text class="cart-text">{{ count > 0 ? count + '件 · 去呼唤调酒师' : '购物车空空' }}</text>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'CartBar',
|
|
props: { count: { type: Number, default: 0 } },
|
|
emits: ['open']
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.cart-bar{position:sticky;bottom:0;height:100rpx;background:var(--bg-card);border-top:1px solid var(--border);display:flex;align-items:center;padding:0 24rpx;z-index:100;gap:16rpx}
|
|
.cart-icon-wrap{position:relative}
|
|
.cart-icon{font-size:48rpx}
|
|
.cart-badge{position:absolute;top:-8rpx;right:-8rpx;background:var(--red);color:#fff;font-size:20rpx;width:36rpx;height:36rpx;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700}
|
|
.cart-text{flex:1;font-size:28rpx;color:var(--text-dim)}
|
|
</style>
|