新增分包支付汇总
This commit is contained in:
280
pageCoupon/discountCoupons.vue
Normal file
280
pageCoupon/discountCoupons.vue
Normal file
@@ -0,0 +1,280 @@
|
||||
<template>
|
||||
<!-- 基础赠送设置切换 -->
|
||||
<view class="foundation">
|
||||
<view :class="[switchTop==1?'active':'']" @click="switchTop =1">
|
||||
基础设置
|
||||
</view>
|
||||
<view :class="[switchTop==2?'active':'']" @click="switchTop=2">
|
||||
赠送设置
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="content1">
|
||||
<view>
|
||||
折扣名称
|
||||
</view>
|
||||
<input type="text" placeholder="填写名称" />
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
折扣（%）
|
||||
</view>
|
||||
<input type="text" placeholder="填写名称" />
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
使用门槛
|
||||
</view>
|
||||
<input type="text" placeholder="隔多少元，可用 " />
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
优惠券类型
|
||||
</view>
|
||||
<radio-group @change="radioChange" style="margin-top: 16rpx;">
|
||||
<radio style="transform:scale(0.7)">单次折扣券</radio>
|
||||
<radio style="transform:scale(0.7)">储值折扣券</radio>
|
||||
</radio-group>
|
||||
<view class="siwtichStyle">
|
||||
<span>最大抵扣金额</span>
|
||||
<switch color="#FFCC33" style="transform:scale(0.7)" />
|
||||
</view>
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
抵扣规则
|
||||
</view>
|
||||
从最高价开始抵扣
|
||||
<view class="siwtichStyle">
|
||||
<span>可抵扣件数</span>
|
||||
<switch color="#FFCC33" style="transform:scale(0.7)" />
|
||||
</view>
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
有效期类型
|
||||
</view>
|
||||
领券后有效期内可用
|
||||
<view class="siwtichStyle">
|
||||
<span>有效期（天）</span>
|
||||
<input type="text" placeholder="填写天数 " />
|
||||
</view>
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
隔天生效
|
||||
</view>
|
||||
<input type="text" placeholder="隔多少天，生效 " />
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
总发放数量
|
||||
</view>
|
||||
<input type="text" placeholder="填写数量" />
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
</view>
|
||||
<view class="content2">
|
||||
<view class="">
|
||||
可用门店
|
||||
</view>
|
||||
<view class="">
|
||||
<span>进本店可用</span>
|
||||
<span>></span>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content2">
|
||||
<view class="">
|
||||
可用商品
|
||||
</view>
|
||||
<view class="">
|
||||
<span>指定商品可用</span>
|
||||
<span>></span>
|
||||
</view>
|
||||
|
||||
<view class="siwtichStyle">
|
||||
<!-- <span>选择商品</span> -->
|
||||
<!-- <view class=""> -->
|
||||
<span>选择商品</span>
|
||||
<input type="text" placeholder="选择指定商品 " />
|
||||
<span>></span>
|
||||
<!-- </view> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="content2">
|
||||
<view class="">
|
||||
|
||||
</view>
|
||||
<view class="">
|
||||
<span>更多设置</span>
|
||||
<span>></span>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content2">
|
||||
<view>
|
||||
指定时间段可用
|
||||
</view>
|
||||
<radio-group @change="radioChange" style="margin-top: 16rpx;">
|
||||
<radio style="transform:scale(0.7)">全时段可用</radio>
|
||||
<radio style="transform:scale(0.7)">指定时段可用</radio>
|
||||
</radio-group>
|
||||
</view>
|
||||
<view class="content2">
|
||||
<view class="">
|
||||
发放方式
|
||||
</view>
|
||||
<view class="">
|
||||
<span>用户不可自行领取</span>
|
||||
<span>></span>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content1">
|
||||
<view>
|
||||
每人领取限量
|
||||
</view>
|
||||
不限量
|
||||
<hr style="margin-top: 24rpx;color: #E5E5E5;" />
|
||||
<view class="siwtichStyle2">
|
||||
<span>不限量</span>
|
||||
<switch color="#FFCC33" style="transform:scale(0.7)" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
reactive,
|
||||
ref,
|
||||
toRef,
|
||||
watch
|
||||
} from 'vue';
|
||||
let switchTop = ref(1)
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.foundation {
|
||||
width: 694rpx;
|
||||
height: 70rpx;
|
||||
background: #E6F0FF;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 36rpx auto;
|
||||
|
||||
>view {
|
||||
text-align: center;
|
||||
width: 344rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
color: #318AFE;
|
||||
}
|
||||
|
||||
.active {
|
||||
margin: auto;
|
||||
width: 344rpx;
|
||||
height: 56rpx;
|
||||
background: #318AFE;
|
||||
color: #fff;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 750rpx;
|
||||
background: #F9F9F9;
|
||||
padding: 32rpx;
|
||||
|
||||
.content1 {
|
||||
background-color: #fff;
|
||||
padding: 32rpx 24rpx;
|
||||
|
||||
>input {
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
>view {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.siwtichStyle {
|
||||
margin-top: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
width: 646rpx;
|
||||
height: 104rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
.siwtichStyle2 {
|
||||
margin-top: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
width: 646rpx;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content2 {
|
||||
padding: 32rpx 24rpx;
|
||||
margin: 32rpx 0;
|
||||
box-sizing: border-box;
|
||||
width: 694rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||||
|
||||
>view:first-child {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
|
||||
}
|
||||
|
||||
>view:nth-child(2) {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 16rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
>view:nth-child(3) {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 16rpx;
|
||||
background: #FFFFFF;
|
||||
width: 646rpx;
|
||||
height: 154rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
|
||||
.siwtichStyle {
|
||||
margin-top: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
width: 646rpx;
|
||||
height: 104rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user