dlh/shop_uniapp
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善抢购组件列表

Browse Source
This commit is contained in:
wangxiaowei 2024-09-25 17:46:58 +08:00
parent e05858c90a
commit c17417d795
3 changed files with 69 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
bundle_b/pages/panic_buying/index.vue
View File

@ -8,8 +8,19 @@
bg-color="transparent" @end="refresh"></u-count-down>
</view> -->
<view class="list">
<view class="item flex">
<u-image></u-image>
<view class="item flex" v-for="(item, index) in 100">
<u-image class="img" src="https://dlh.hainings.com/uploads/images/2024092116413178de43713.jpg" width="200rpx" height="200rpx" border-radius="10rpx"></u-image>
<view class="info m-l-20">
<view class="line-2 xl bold">芒果奶糕108g*2/箱</view>
<view class="panic-btn m-t-20">
<view class="left sm text-center bold">￥299</view>
<view class="right">
<view class="xl m-t-10 bold">￥69</view>
<view class="sm">抢购价</view>
<u-image class="flash" src="https://zjeloong.oss-cn-hangzhou.aliyuncs.com/activity/panic_buying/flash.png" width="60rpx" height="60rpx"></u-image>
</view>
</view>
</view>
</view>
</view>
</view>
@ -41,15 +52,15 @@
<style lang="scss">
page {
background: #FFF8D1;
background: #c22921;
}
.head {
background-image: url(https://zjeloong.oss-cn-hangzhou.aliyuncs.com/activity/panic_buying/panic_bg.png);
background-size: 100% 100%;
background-image: url(https://zjeloong.oss-cn-hangzhou.aliyuncs.com/activity/panic_buying/panic_bg.jpg);
background-size: cover;
background-repeat: no-repeat;
min-height: 500rpx;
max-height: 500rpx;
min-height: 800rpx;
max-height: 800rpx;
}
.time {
@ -58,6 +69,54 @@
}
.list {
margin: 0 20rpx;
background-color: #fff;
border-radius: 10rpx;
padding: 20rpx;
.item {
width: 100%;
margin-bottom: 20rpx;
.info {
width: calc(100% - 200rpx);
.panic-btn {
display: flex;
align-items: center;
.left {
width: 30%;
background-color: #feece3; background-image: linear-gradient(90deg, #feece3 0%, #ffeede 100%);
height: 100rpx;
line-height: 100rpx;
color: #A77227;
text-decoration: line-through;
}
.right {
color: #fff;
width: 70%;
background-color: #e04670; background-image: linear-gradient(106deg, #e04670 18%, #fd0a1c 100%);
border-top-right-radius: 40rpx;
border-bottom-right-radius: 40rpx;
height: 100rpx;
text-align: center;
position: relative;
view {
margin-left: -20rpx;
}
.flash {
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 20rpx;
}
}
}
}
}
}
</style>

17
components/index-home/index-home.vue
View File

@ -51,22 +51,9 @@
</view> -->
<!-- 抢购 -->
<!-- <view class="seckill m-t-20">
<scroll-view style="height: 120rpx; white-space: nowrap;" scroll-x="true" scroll-with-animation="true">
<view v-for="(item, index) in list" :key="index" :id="'item-' + index"
class="time-item flex-col row-center col-center" :class="{active: index == active}"
@tap="exchangeTime(index)">
<view :class="'xl bold time'">{{ item.start_time }}</view>
<view :class="'sm br60 state ' + ( item.status === 2 ? 'muted': '' )">
{{ item.tips }}
</view>
</view>
</scroll-view>
</view> -->
<view class="m-t-20">
<!-- <view class="m-t-20">
<panic-buying></panic-buying>
</view>
</view> -->
<view class="seckill m-t-20" v-if="mallNews != ''">
<mall-news :list="mallNews"></mall-news>

2
components/panic-buying/panic-buying.vue
View File

@ -60,7 +60,7 @@
position: relative;
margin: 20rpx 0;
width: 100%;
background-image: linear-gradient(118deg, #f9b7b7 0%, #ff3737 83%);
background-color: #ff3737;
border-radius: 10rpx;
color: #fff;
height: 40rpx;