店铺优惠券样式修改

This commit is contained in:
高健 2021-08-05 15:15:41 +08:00
parent 740b45d2a3
commit e84c1f69b1
3 changed files with 25 additions and 13 deletions

View File

@ -63,7 +63,7 @@ Page({
}) })
}, },
//删除 //删除
doDel(e) { doDelOne(e) {
var item = e.currentTarget.dataset.item var item = e.currentTarget.dataset.item
var _self = this var _self = this
wx.showModal({ wx.showModal({

View File

@ -1,7 +1,8 @@
<cu-custom isBack="{{true}}"> <cu-custom isBack="{{true}}">
<view slot="content">新增优惠券</view> <view slot="content">新增优惠券</view>
</cu-custom> </cu-custom>
<scroll-view style="margin-bottom:80rpx;margin-top:10rpx" refresher-enabled="true" refresher-threshold="{{50}}" <view class="radial-gradient"></view>
<scroll-view style="margin-bottom:100rpx;margin-top:10rpx" refresher-enabled="true" refresher-threshold="{{50}}"
refresher-background="#fff" bindrefresherrefresh="dorefresh" refresher-triggered="{{isRefreshing}}"> refresher-background="#fff" bindrefresherrefresh="dorefresh" refresher-triggered="{{isRefreshing}}">
<view class="cu-list" wx:if="{{couponList.length>0}}"> <view class="cu-list" wx:if="{{couponList.length>0}}">
<view class="cu-item" wx:for="{{couponList}}" wx:key="index"> <view class="cu-item" wx:for="{{couponList}}" wx:key="index">
@ -29,7 +30,7 @@
领取次日{{item.expiringDays}}天内有效 领取次日{{item.expiringDays}}天内有效
</view> </view>
</view> </view>
<view class="right-box bg-yellow-yellow"> <view class="right-box">
<view> <view>
<text class="price-icon">¥</text> <text class="price-icon">¥</text>
<text class="price">{{item.amount}}</text> <text class="price">{{item.amount}}</text>
@ -47,7 +48,7 @@
<view class="btn-box"> <view class="btn-box">
<view class="btn bg-red radius" bindtap="doDelOne" data-item="{{item}}">删除</view> <view class="btn bg-red radius" bindtap="doDelOne" data-item="{{item}}">删除</view>
<view class="btn bg-yellow-light-1 radius margin-left-sm" bindtap="doRecoverOne" data-item="{{item}}">编辑 <view class="btn bg-yellow-light-1 radius margin-left-sm" bindtap="toEditPage" data-item="{{item}}">编辑
</view> </view>
</view> </view>
</view> </view>

View File

@ -11,23 +11,29 @@ page {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 15rpx 10rpx 10rpx 15rpx; border-radius: 0rpx 10rpx 10rpx 0rpx;
flex-direction: column; flex-direction: column;
padding: 10rpx; padding: 10rpx;
background-image: radial-gradient(circle at left top, #f2f2f2, #f2f2f2 10rpx, transparent 11rpx),
radial-gradient(circle at left bottom, #f2f2f2, #f2f2f2 10rpx, transparent 11rpx);
background-color: #E6B980;
} }
.left-box { .left-box {
width: 100%; width: 100%;
flex: 7; flex: 7;
background: #ffffff;
position: relative; position: relative;
border-radius: 10rpx 15rpx 15rpx 10rpx;
min-height: 140rpx; min-height: 140rpx;
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: space-between;
padding: 5rpx 15rpx; padding: 10rpx 15rpx;
position: relative;
border-radius: 10rpx 0rpx 0rpx 10rpx;
background-image: radial-gradient(circle at right top, #f2f2f2, #f2f2f2 10rpx, transparent 11rpx),
radial-gradient(circle at right bottom, #f2f2f2, #f2f2f2 10rpx, transparent 11rpx);
background-color: #ffffff;
} }
.price { .price {
@ -58,23 +64,28 @@ page {
.btn { .btn {
padding: 10rpx 40rpx; padding: 10rpx 40rpx;
} }
.coupon-name{
.coupon-name {
font-size: 32rpx; font-size: 32rpx;
font-weight: bold; font-weight: bold;
color: black; color: black;
flex: 1;
} }
.coupon-desc{
.coupon-desc {
font-size: 24rpx; font-size: 24rpx;
color: #797979; color: #797979;
} }
.coupon-type-yellow{
.coupon-type-yellow {
font-size: 24rpx; font-size: 24rpx;
color: #ffffff; color: #ffffff;
background: #ff9800; background: #ff9800;
padding: 0rpx 10rpx; padding: 0rpx 10rpx;
border-radius: 5rpx; border-radius: 5rpx;
} }
.coupon-type-blue{
.coupon-type-blue {
font-size: 24rpx; font-size: 24rpx;
color: #ffffff; color: #ffffff;
background: #0471ff; background: #0471ff;