完善页面
This commit is contained in:
44
src/components/coupon/GroupCoupon.vue
Normal file
44
src/components/coupon/GroupCoupon.vue
Normal file
@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<view class="p-30rpx rounded-16rpx mb-20rpx bg-white" @click="onCheck(coupon.id)">
|
||||
<view class="flex justify-between items-start relative ">
|
||||
<view class="w-180rpx h-180rpx">
|
||||
<wd-img width="100%" height="100%" :src="`${OSS}images/home_image5.png`"></wd-img>
|
||||
</view>
|
||||
<view class="flex-1 ml-32rpx line-1" :class="canUse ? '' : 'opacity-40'">
|
||||
<view class="text-32rpx text-[#303133] leading-44rpx line-1 w-350rpx">这是团购券套餐名称这是团购券套餐名称</view>
|
||||
<view class="text-26rpx text-[#6A6363] leading-36rpx mt-30rpx flex">
|
||||
<view class="line-1">这是商家名称这是商家名称这是商家名称这是商家名称这是商家名称</view>
|
||||
<view class="mx-14rpx">|</view>
|
||||
<view>{{ coupon.limit }}小时</view>
|
||||
</view>
|
||||
<view class="text-24rpx leading-34rpx text-[#909399] mt-16rpx">有效期:2025-01-01至2025-05-05</view>
|
||||
</view>
|
||||
<view>
|
||||
<wd-radio :value="coupon.id" shape="dot" :disabled="!canUse"></wd-radio>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup name="GroupCoupon">
|
||||
const OSS = inject('OSS')
|
||||
defineProps<{
|
||||
coupon: {
|
||||
id: number
|
||||
amount: number
|
||||
limit: number
|
||||
expire: string
|
||||
}
|
||||
canUse: boolean
|
||||
checked: boolean
|
||||
onCheck: (id: number) => void
|
||||
}>()
|
||||
</script>
|
||||
|
||||
|
||||
<script lang="ts">
|
||||
export default {}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
Reference in New Issue
Block a user