|
|
@@ -1,171 +1,184 @@
|
|
|
<template>
|
|
|
- <view class="coupon-page">
|
|
|
- <view class="fix">
|
|
|
- <view class="top"></view>
|
|
|
- <view class="handle">
|
|
|
- <view class="head_left">
|
|
|
- <span class="cuIcon-back" @click="back"></span>
|
|
|
- </view>
|
|
|
- <span class="center">商家优惠券</span>
|
|
|
- <view class="head_right">
|
|
|
- <!-- <span class="cuIcon-search" @click="goSearch"></span> -->
|
|
|
- <view class="manage" @click="manage">
|
|
|
- 添加
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 顶部标签页 -->
|
|
|
- <view class="tab-container ">
|
|
|
- <view class="tab-bar flex justify-between items-center">
|
|
|
- <view v-for="(item, index) in tabList" :key="index" class="tab-item"
|
|
|
- :class="{ active: currentTab === index }" @click="onTabChange(index)">
|
|
|
- {{ item.name }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <mescroll-uni class="list" :fixed="false" ref="mescrollRef" @up="getList" @init="mescrollInit" :use="false">
|
|
|
-
|
|
|
- <!-- 代金券列表 -->
|
|
|
- <view class="coupon-card" v-for="(item, index) in dataList[`couponList${currentTab}`]" :key="item.id"
|
|
|
- @click="handleDetail(item.id)" :class="{ 'disabled': item.status === 'expired' }">
|
|
|
- <!-- 顶部标题栏 -->
|
|
|
- <view class="card-header"
|
|
|
- :style="currentTab == 0 ? 'background: #EFFFFE' : currentTab == 1 ? 'background: #F4FAFF ' : 'background: #FFF7F3'">
|
|
|
- <image style=" vertical-align: top" :src="`/static/coupon/titlebg${currentTab + 1}.png`" mode="">
|
|
|
- </image>
|
|
|
- <view class="status" v-if="item.delFlag == '1'"
|
|
|
- :style="currentTab == 0 ? 'color: #2DAC9F' : currentTab == 1 ? 'color: #4183BC' : 'color: #DB6332'">
|
|
|
- 销售中
|
|
|
- </view>
|
|
|
- <view class="status" v-else>{{ item.delFlag == '0' ? '待上架' : item.delFlag == '3' ? '已失效' : '' }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="flex" style="padding: 14rpx 18rpx;">
|
|
|
- <!-- 优惠券金额 -->
|
|
|
- <view class="amount-section">
|
|
|
- <text class="amount" v-if="currentTab == 0">{{ item.parValue }}</text>
|
|
|
- <text class="amount" v-else :style="currentTab == 1 ? 'color: #278BE5' : 'color: #FB5308'">{{
|
|
|
+ <view class="coupon-page">
|
|
|
+ <view class="fix">
|
|
|
+ <view class="top"></view>
|
|
|
+ <view class="handle">
|
|
|
+ <view class="head_left">
|
|
|
+ <span class="cuIcon-back" @click="back"></span>
|
|
|
+ </view>
|
|
|
+ <span class="center">商家优惠券</span>
|
|
|
+ <view class="head_right">
|
|
|
+ <!-- <span class="cuIcon-search" @click="goSearch"></span> -->
|
|
|
+ <view class="manage" @click="manage">
|
|
|
+ 添加
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 顶部标签页 -->
|
|
|
+ <view class="tab-container ">
|
|
|
+ <view class="tab-bar flex justify-between items-center">
|
|
|
+ <view v-for="(item, index) in tabList" :key="index" class="tab-item" :class="{ active: currentTab === index }"
|
|
|
+ @click="onTabChange(index)">
|
|
|
+ {{ item.name }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <mescroll-uni class="list" :fixed="false" ref="mescrollRef" @up="getList" @init="mescrollInit" :use="false">
|
|
|
+
|
|
|
+ <!-- 代金券列表 -->
|
|
|
+ <view class="coupon-card" v-for="(item, index) in dataList[`couponList${currentTab}`]" :key="item.id"
|
|
|
+ @click="handleDetail(item.id)" :class="{ 'disabled': item.status === 'expired' }">
|
|
|
+ <!-- 顶部标题栏 -->
|
|
|
+ <view class="card-header"
|
|
|
+ :style="currentTab == 0 ? 'background: #EFFFFE' : currentTab == 1 ? 'background: #F4FAFF ' : 'background: #FFF7F3'">
|
|
|
+ <image style=" vertical-align: top" :src="`/static/coupon/titlebg${currentTab + 1}.png`" mode="">
|
|
|
+ </image>
|
|
|
+ <view class="status" v-if="item.delFlag == '1'"
|
|
|
+ :style="currentTab == 0 ? 'color: #2DAC9F' : currentTab == 1 ? 'color: #4183BC' : 'color: #DB6332'">
|
|
|
+ 销售中
|
|
|
+ </view>
|
|
|
+ <view class="status" v-else>{{ item.delFlag == '0' ? '待上架' : item.delFlag == '3' ? '已失效' : '' }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="flex" style="padding: 14rpx 18rpx;">
|
|
|
+ <!-- 优惠券金额 -->
|
|
|
+ <view class="amount-section">
|
|
|
+ <text class="amount" v-if="currentTab == 0">{{ item.parValue }}</text>
|
|
|
+ <text class="amount" v-else :style="currentTab == 1 ? 'color: #278BE5' : 'color: #FB5308'">{{
|
|
|
item.contentInfo }}</text>
|
|
|
- <text class="unit" v-if="currentTab == 2">折</text>
|
|
|
- <text class="unit" v-else>元</text>
|
|
|
- <view class="use-condition" v-if="currentTab == 0 && item.voucherWay == '1'">售价{{
|
|
|
+ <text class="unit" v-if="currentTab == 2">折</text>
|
|
|
+ <text class="unit" v-else>元</text>
|
|
|
+ <view class="use-condition" v-if="currentTab == 0 && item.voucherWay == '1'">售价{{
|
|
|
item.voucherWayInfo
|
|
|
}}元</view>
|
|
|
- <view class="use-condition" v-if="currentTab == 1 && item.contentConditions !== '0'">满{{
|
|
|
+ <view class="use-condition" v-if="currentTab == 1 && item.contentConditions !== '0'">满{{
|
|
|
item.contentConditions }}元可抵扣</view>
|
|
|
- <view class="use-condition" v-if="currentTab == 2 && item.contentConditions !== '0'">满{{
|
|
|
+ <view class="use-condition" v-if="currentTab == 2 && item.contentConditions !== '0'">满{{
|
|
|
item.contentConditions }}元可使用</view>
|
|
|
- <view class="use-condition" v-if="currentTab !== 0 && item.contentConditions == '0'">不限制条件使用
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 优惠券信息 -->
|
|
|
- <view class="info-section">
|
|
|
- <view class="info-item">
|
|
|
- <text class="dot">•</text>
|
|
|
- <text class="label" v-if="currentTab == 0">获取方式:</text>
|
|
|
- <text class="label" v-else>领取限制:</text>
|
|
|
- <text class="value" v-if="currentTab == 0">{{ item.voucherWay == '1' ? '购买' : '消费满' +
|
|
|
+ <view class="use-condition" v-if="currentTab !== 0 && item.contentConditions == '0'">不限制条件使用
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 优惠券信息 -->
|
|
|
+ <view class="info-section">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="dot">•</text>
|
|
|
+ <text class="label" v-if="currentTab == 0">获取方式:</text>
|
|
|
+ <text class="label" v-else>领取限制:</text>
|
|
|
+ <text class="value" v-if="currentTab == 0">{{ item.voucherWay == '1' ? '购买' : '消费满' +
|
|
|
item.voucherWayInfo + '元可领取' }}</text>
|
|
|
- <text class="value" v-else>{{ item.couponWay == '1' ? '所有人可领取' : '本店消费可领' }}</text>
|
|
|
- </view>
|
|
|
- <view class="info-item">
|
|
|
- <text class="dot">•</text>
|
|
|
- <text class="label" v-if="currentTab == 0">使用条件:</text>
|
|
|
- <text class="label" v-else>适用范围:</text>
|
|
|
- <text class="value" v-if="currentTab == 0">{{ item.conditions == '0' ? '不限制' : '最低消费' +
|
|
|
+ <text class="value" v-else>{{ item.couponWay == '1' ? '所有人可领取' : '本店消费可领' }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="dot">•</text>
|
|
|
+ <text class="label" v-if="currentTab == 0">使用条件:</text>
|
|
|
+ <text class="label" v-else>适用范围:</text>
|
|
|
+ <text class="value" v-if="currentTab == 0">{{ item.conditions == '0' ? '不限制' : '最低消费' +
|
|
|
item.conditions + '元' }}</text>
|
|
|
- <text class="value" v-else>{{
|
|
|
+ <text class="value" v-else>{{
|
|
|
item.couponRange == '1' ? '本店可用' : item.couponRange == '2' ? '部分分类商品可用' : '部分分类商品不可用'
|
|
|
}}</text>
|
|
|
- </view>
|
|
|
- <view class="info-item">
|
|
|
- <text class="dot">•</text>
|
|
|
- <text class="label">有效期:</text>
|
|
|
- <text class="value">{{ item.beginTime + '/' + item.endTime }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 数量统计 -->
|
|
|
- <view class="stats-section flex"
|
|
|
- :class="currentTab == 0 ? 'backg-color1' : currentTab == 1 ? 'backg-color2' : 'backg-color3'">
|
|
|
- <text class="stat-item" v-if="currentTab == 0 && item.voucherWay == '1'">已购买:{{ item.payNumber }}</text>
|
|
|
- <text class="stat-item" v-else>已领取:{{ item.payNumber }}</text>
|
|
|
- <text class="stat-item">已使用:{{ item.useNumber }}</text>
|
|
|
- <text class="stat-item">总库存:{{ item.number }}</text>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 操作按钮 -->
|
|
|
- <view class="action-section">
|
|
|
- <text class="action-btn" v-if="item.delFlag == '0' || item.delFlag == '3'"
|
|
|
- @click.stop="handleAction('up', item)">上架</text>
|
|
|
- <text class="action-btn" v-if="item.delFlag == '1'"
|
|
|
- @click.stop="handleAction('down', item)">下架</text>
|
|
|
- <text class="action-btn" v-if="item.delFlag == '1' && item.voucherWay !== 1"
|
|
|
- @click.stop="handleAction('grant', item)">发放</text>
|
|
|
- <text class="action-btn" v-if="item.delFlag == '0' || item.delFlag == '3'"
|
|
|
- @click.stop="handleEdit(item.id)">编辑</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </mescroll-uni>
|
|
|
-
|
|
|
- <u-select mode="single-column" :list="grantoptions" label-name="label" value-name="value" v-model="show"
|
|
|
- @confirm="confirm($event)"></u-select>
|
|
|
- <!-- 底部支付弹框 -->
|
|
|
- <u-popup v-model="showPaymentPopup" mode="center" :round="10">
|
|
|
- <view class="payment-popup">
|
|
|
- <view class="popup-header">
|
|
|
- <text class="popup-title">上架优惠券</text>
|
|
|
- <view class="popup-icon">
|
|
|
- <u-icon name="close" size="20" @click="closePaymentPopup"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="popup-concant flex align-center justify-center">
|
|
|
- <view>当前优惠券上架</view>
|
|
|
- <view>需重新设置有效时间</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="action-buttons">
|
|
|
- <view class="cancel-btn" @click="closePaymentPopup">取消</view>
|
|
|
- <view class="confirm-btn" @click="handleEdit(selectRow.id)">去设置</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </u-popup>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="dot">•</text>
|
|
|
+ <text class="label">有效期:</text>
|
|
|
+ <text class="value">{{ item.beginTime + '/' + item.endTime }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 数量统计 -->
|
|
|
+ <view class="stats-section flex"
|
|
|
+ :class="currentTab == 0 ? 'backg-color1' : currentTab == 1 ? 'backg-color2' : 'backg-color3'">
|
|
|
+ <text class="stat-item" v-if="currentTab == 0 && item.voucherWay == '1'">已购买:{{ item.payNumber }}</text>
|
|
|
+ <text class="stat-item" v-else>已领取:{{ item.payNumber }}</text>
|
|
|
+ <text class="stat-item">已使用:{{ item.useNumber }}</text>
|
|
|
+ <text class="stat-item">总库存:{{ item.number }}</text>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 操作按钮 -->
|
|
|
+ <view class="action-section">
|
|
|
+ <text class="action-btn" v-if="item.delFlag == '0' || item.delFlag == '3'"
|
|
|
+ @click.stop="handleAction('up', item)">上架</text>
|
|
|
+ <text class="action-btn" v-if="item.delFlag == '1'" @click.stop="handleAction('down', item)">下架</text>
|
|
|
+ <text class="action-btn" v-if="item.delFlag == '1' && item.voucherWay !== 1"
|
|
|
+ @click.stop="handleAction('grant', item)">发放</text>
|
|
|
+ <text class="action-btn" v-if="item.delFlag == '0' || item.delFlag == '3'"
|
|
|
+ @click.stop="handleEdit(item.id)">编辑</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </mescroll-uni>
|
|
|
+
|
|
|
+ <u-select mode="single-column" :list="grantoptions" label-name="label" value-name="value" v-model="show"
|
|
|
+ @confirm="confirm($event)"></u-select>
|
|
|
+ <!-- 底部支付弹框 -->
|
|
|
+ <u-popup v-model="showPaymentPopup" mode="center" :round="10">
|
|
|
+ <view class="payment-popup">
|
|
|
+ <view class="popup-header">
|
|
|
+ <text class="popup-title">上架优惠券</text>
|
|
|
+ <view class="popup-icon">
|
|
|
+ <u-icon name="close" size="20" @click="closePaymentPopup"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="popup-concant flex align-center justify-center">
|
|
|
+ <view>当前优惠券上架</view>
|
|
|
+ <view>需重新设置有效时间</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="action-buttons">
|
|
|
+ <view class="cancel-btn" @click="closePaymentPopup">取消</view>
|
|
|
+ <view class="confirm-btn" @click="handleEdit(selectRow.id)">去设置</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { USER_INFO } from "@/common/util/constants"
|
|
|
-
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- showPaymentPopup: false,
|
|
|
- show: false,
|
|
|
- grantoptions: [{ value: '1', label: '本店消费用户' },
|
|
|
- { value: '2', label: '本店特定商品消费用户' }],
|
|
|
- currentTab: 0,
|
|
|
- tabList: [
|
|
|
- { name: '代金券' },
|
|
|
- { name: '满减券' },
|
|
|
- { name: '折扣券' }
|
|
|
- ],
|
|
|
- activeItemStyle: {
|
|
|
- backgroundColor: 'rgba(41, 121, 255, 0.1)',
|
|
|
- borderRadius: '32rpx',
|
|
|
- transition: 'all 0.3s'
|
|
|
- },
|
|
|
- dataList: {
|
|
|
- couponList0: [],
|
|
|
- couponList1: [],
|
|
|
- couponList2: [],
|
|
|
- },
|
|
|
- reductionList: [],
|
|
|
- discountList: [],
|
|
|
- selectRow: {},
|
|
|
- upOption: {
|
|
|
+ import {
|
|
|
+ USER_INFO
|
|
|
+ } from "@/common/util/constants"
|
|
|
+
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ showPaymentPopup: false,
|
|
|
+ show: false,
|
|
|
+ grantoptions: [{
|
|
|
+ value: '1',
|
|
|
+ label: '本店消费用户'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: '2',
|
|
|
+ label: '本店特定商品消费用户'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ currentTab: 0,
|
|
|
+ tabList: [{
|
|
|
+ name: '代金券'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '满减券'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '折扣券'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ activeItemStyle: {
|
|
|
+ backgroundColor: 'rgba(41, 121, 255, 0.1)',
|
|
|
+ borderRadius: '32rpx',
|
|
|
+ transition: 'all 0.3s'
|
|
|
+ },
|
|
|
+ dataList: {
|
|
|
+ couponList0: [],
|
|
|
+ couponList1: [],
|
|
|
+ couponList2: [],
|
|
|
+ },
|
|
|
+ reductionList: [],
|
|
|
+ discountList: [],
|
|
|
+ selectRow: {},
|
|
|
+ upOption: {
|
|
|
page: {
|
|
|
num: 0,
|
|
|
size: 10 // 每页数据的数量,默认10
|
|
|
@@ -175,524 +188,531 @@ export default {
|
|
|
tip: '暂无相关数据'
|
|
|
}
|
|
|
},
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- closePaymentPopup() {
|
|
|
- this.showPaymentPopup = false
|
|
|
- },
|
|
|
- getList(page) {
|
|
|
- this.$http.post('/merchant/localVoucherInfo/list',
|
|
|
- {
|
|
|
- merchantId: uni.getStorageSync(USER_INFO).merchantId,
|
|
|
- pageSize: page.size ,
|
|
|
- pageNo: page.num
|
|
|
- }).then(res => {
|
|
|
- if (res.data.success) {
|
|
|
- if( res.data.result.records==null && page.num==1){
|
|
|
- this.dataList.couponList0=[]
|
|
|
- }
|
|
|
- else{
|
|
|
- this.dataList.couponList0 =res.data.result.pages? this.dataList.couponList0.concat(res.data.result.records) : this.dataList.couponList0
|
|
|
- }
|
|
|
-
|
|
|
- this.mescroll.endSuccess(res.data.result.records.length, res.data.result.total);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ closePaymentPopup() {
|
|
|
+ this.showPaymentPopup = false
|
|
|
+ },
|
|
|
+ getList(page) {
|
|
|
+ this.$http.post('/merchant/localVoucherInfo/list', {
|
|
|
+ merchantId: uni.getStorageSync(USER_INFO).merchantId,
|
|
|
+ pageSize: page.size,
|
|
|
+ pageNo: page.num
|
|
|
+ }).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ if (res.data.result.records == null && page.num == 1) {
|
|
|
+ this.dataList.couponList0 = []
|
|
|
+ } else {
|
|
|
+ this.dataList.couponList0 = res.data.result.pages ? this.dataList.couponList0.concat(res.data.result
|
|
|
+ .records) : this.dataList.couponList0
|
|
|
+ }
|
|
|
+
|
|
|
+ this.mescroll.endSuccess(res.data.result.records.length, res.data.result.total);
|
|
|
uni.showTabBar()
|
|
|
- }
|
|
|
- else {
|
|
|
- this.dataList.couponList0 = []
|
|
|
+ } else {
|
|
|
+ this.dataList.couponList0 = []
|
|
|
this.mescroll.endErr()
|
|
|
}
|
|
|
}).catch(() => {
|
|
|
this.mescroll.endErr()
|
|
|
})
|
|
|
- },
|
|
|
- getList1(page) {
|
|
|
- this.$http.post('/merchant/localCouponInfo/list', { merchantId: uni.getStorageSync(USER_INFO).merchantId, type: this.currentTab ,
|
|
|
- pageSize: page.size,
|
|
|
- pageNo: page.num
|
|
|
- }).then(res => {
|
|
|
- if (res.data.success) {
|
|
|
- this.dataList['couponList' + this.currentTab] =res.data.result.pages? this.dataList['couponList' + this.currentTab].concat(res.data.result.records) : this.dataList['couponList' + this.currentTab]
|
|
|
- }
|
|
|
- else {
|
|
|
- this.$tip.error(res.data.message);
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- //返回
|
|
|
- back() {
|
|
|
- uni.navigateBack({
|
|
|
- delta: 1
|
|
|
- });
|
|
|
- },
|
|
|
- handleAction(type, item) {
|
|
|
- this.selectRow = item
|
|
|
- if (type == 'grant') {
|
|
|
- this.show = true
|
|
|
- }
|
|
|
- if (type == 'up' || type == 'down') {
|
|
|
- uni.showModal({
|
|
|
- title: type == 'up' ? '上架优惠券' : '下架优惠券',
|
|
|
- content: type == 'up' ? '当前优惠券确定上架?' : '当前优惠券确定下架?',
|
|
|
- success: (res) => {
|
|
|
- if (res.confirm) {
|
|
|
- let upDown = ['/merchant/localVoucherInfo/editUpper', '/merchant/localCouponInfo/editUpper', '/merchant/localCouponInfo/editUpper']
|
|
|
- this.$http.get(upDown[this.currentTab], { params: { id: item.id, delFlag: type == 'up' ? '1' : '0' } }).then(res => {
|
|
|
- if (res.data.success) {
|
|
|
- let page = {
|
|
|
- num: 1,
|
|
|
- size: 10
|
|
|
- }
|
|
|
- if (this.currentTab == 0) {
|
|
|
- this.dataList.couponList0 = []
|
|
|
- this.getList(page)
|
|
|
- }
|
|
|
- else {
|
|
|
- this.dataList['couponList' + this.currentTab] =[]
|
|
|
- this.getList1(page)
|
|
|
- }
|
|
|
- }
|
|
|
- else {
|
|
|
- if (res.data.message == "当前优惠卷上架需重新设置有效时间") {
|
|
|
- this.showPaymentPopup = true
|
|
|
- // uni.showModal({
|
|
|
- // title: '上架优惠券' ,
|
|
|
- // content:`当前优惠卷上架}`,
|
|
|
- // success: (res) => {
|
|
|
- // }
|
|
|
- // })
|
|
|
- }
|
|
|
- else {
|
|
|
- this.$tip.error(res.data.message);
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- confirm(e) {
|
|
|
- let data = {
|
|
|
- beginTime: this.selectRow.beginTime,
|
|
|
- endTime: this.selectRow.endTime,
|
|
|
- consumerId: this.selectRow.id,
|
|
|
- type: this.currentTab == '0' ? '3' : this.currentTab
|
|
|
- }
|
|
|
- if (e[0].value == 1) {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/coupon/storeUsers?params=' + encodeURIComponent(JSON.stringify(data))
|
|
|
- })
|
|
|
- }
|
|
|
- else {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/coupon/activity?row=' + encodeURIComponent(JSON.stringify(data))
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- manage() {
|
|
|
- if (this.currentTab == '0') {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/coupon/creatcoupon'
|
|
|
- })
|
|
|
- }
|
|
|
- if (this.currentTab == '1') {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/coupon/creatReduction'
|
|
|
- })
|
|
|
- }
|
|
|
- if (this.currentTab == '2') {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/coupon/creatDiscount'
|
|
|
- })
|
|
|
- }
|
|
|
- this.$store.state.shopSelectedIds = []
|
|
|
-
|
|
|
- },
|
|
|
- onTabChange(index) {
|
|
|
- let page = {
|
|
|
+ },
|
|
|
+ getList1(page) {
|
|
|
+ this.$http.post('/merchant/localCouponInfo/list', {
|
|
|
+ merchantId: uni.getStorageSync(USER_INFO).merchantId,
|
|
|
+ type: this.currentTab,
|
|
|
+ pageSize: page.size,
|
|
|
+ pageNo: page.num
|
|
|
+ }).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ this.dataList['couponList' + this.currentTab] = res.data.result.pages ? this.dataList['couponList' + this
|
|
|
+ .currentTab].concat(res.data.result.records) : this.dataList['couponList' + this.currentTab]
|
|
|
+ } else {
|
|
|
+ this.$tip.error(res.data.message);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //返回
|
|
|
+ back() {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleAction(type, item) {
|
|
|
+ this.selectRow = item
|
|
|
+ if (type == 'grant') {
|
|
|
+ this.show = true
|
|
|
+ }
|
|
|
+ if (type == 'up' || type == 'down') {
|
|
|
+ uni.showModal({
|
|
|
+ title: type == 'up' ? '上架优惠券' : '下架优惠券',
|
|
|
+ content: type == 'up' ? '当前优惠券确定上架?' : '当前优惠券确定下架?',
|
|
|
+ success: (res) => {
|
|
|
+ if (res.confirm) {
|
|
|
+ let upDown = ['/merchant/localVoucherInfo/editUpper', '/merchant/localCouponInfo/editUpper',
|
|
|
+ '/merchant/localCouponInfo/editUpper'
|
|
|
+ ]
|
|
|
+ this.$http.get(upDown[this.currentTab], {
|
|
|
+ params: {
|
|
|
+ id: item.id,
|
|
|
+ delFlag: type == 'up' ? '1' : '0'
|
|
|
+ }
|
|
|
+ }).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ let page = {
|
|
|
+ num: 1,
|
|
|
+ size: 10
|
|
|
+ }
|
|
|
+ if (this.currentTab == 0) {
|
|
|
+ this.dataList.couponList0 = []
|
|
|
+ this.getList(page)
|
|
|
+ } else {
|
|
|
+ this.dataList['couponList' + this.currentTab] = []
|
|
|
+ this.getList1(page)
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (res.data.message == "当前优惠卷上架需重新设置有效时间") {
|
|
|
+ this.showPaymentPopup = true
|
|
|
+ // uni.showModal({
|
|
|
+ // title: '上架优惠券' ,
|
|
|
+ // content:`当前优惠卷上架}`,
|
|
|
+ // success: (res) => {
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ } else {
|
|
|
+ this.$tip.error(res.data.message);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ confirm(e) {
|
|
|
+ let data = {
|
|
|
+ beginTime: this.selectRow.beginTime,
|
|
|
+ endTime: this.selectRow.endTime,
|
|
|
+ consumerId: this.selectRow.id,
|
|
|
+ type: this.currentTab == '0' ? '3' : this.currentTab
|
|
|
+ }
|
|
|
+ if (e[0].value == 1) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/coupon/storeUsers?params=' + encodeURIComponent(JSON.stringify(data))
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/coupon/activity?row=' + encodeURIComponent(JSON.stringify(data))
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ manage() {
|
|
|
+ if (this.currentTab == '0') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/coupon/creatcoupon'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (this.currentTab == '1') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/coupon/creatReduction'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (this.currentTab == '2') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/coupon/creatDiscount'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.$store.state.shopSelectedIds = []
|
|
|
+
|
|
|
+ },
|
|
|
+ onTabChange(index) {
|
|
|
+ this.dataList={
|
|
|
+ couponList0: [],
|
|
|
+ couponList1: [],
|
|
|
+ couponList2: [],
|
|
|
+ }
|
|
|
+ let page = {
|
|
|
num: 1,
|
|
|
size: 10
|
|
|
}
|
|
|
- this.currentTab = index
|
|
|
- if (index == 0) {
|
|
|
- this.getList(page)
|
|
|
- }
|
|
|
- else {
|
|
|
- this.getList1(page)
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- // 详情
|
|
|
- handleDetail(id) {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages/coupon/couponDetail?id=${id}&tab=${this.currentTab}`
|
|
|
- })
|
|
|
- },
|
|
|
- mescrollInit(mescroll) {
|
|
|
+ this.currentTab = index
|
|
|
+ if (index == 0) {
|
|
|
+ this.getList(page)
|
|
|
+ } else {
|
|
|
+ this.getList1(page)
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 详情
|
|
|
+ handleDetail(id) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/coupon/couponDetail?id=${id}&tab=${this.currentTab}`
|
|
|
+ })
|
|
|
+ },
|
|
|
+ mescrollInit(mescroll) {
|
|
|
this.mescroll = mescroll;
|
|
|
},
|
|
|
- handleEdit(id) {
|
|
|
- // TODO: 实现编辑逻辑
|
|
|
- if (this.currentTab == '0') {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages/coupon/creatcoupon?id=${id}`
|
|
|
- })
|
|
|
- }
|
|
|
- if (this.currentTab == '1') {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages/coupon/creatReduction?id=${id}`
|
|
|
- })
|
|
|
- }
|
|
|
- if (this.currentTab == '2') {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pages/coupon/creatDiscount?id=${id}`
|
|
|
- })
|
|
|
- }
|
|
|
- this.$store.state.shopSelectedIds = []
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad(options) {
|
|
|
- if (options && options.tab) {
|
|
|
- this.currentTab = options.tab
|
|
|
- }
|
|
|
- else {
|
|
|
- this.currentTab = 0
|
|
|
- }
|
|
|
- },
|
|
|
- onShow() {
|
|
|
- let page = {
|
|
|
- num: 1,
|
|
|
- size: 10
|
|
|
- }
|
|
|
- this.showPaymentPopup = false
|
|
|
- if (this.currentTab == 1 || this.currentTab == 2) {
|
|
|
- this.getList1(page)
|
|
|
- }
|
|
|
- },
|
|
|
-}
|
|
|
+ handleEdit(id) {
|
|
|
+ // TODO: 实现编辑逻辑
|
|
|
+ if (this.currentTab == '0') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/coupon/creatcoupon?id=${id}`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (this.currentTab == '1') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/coupon/creatReduction?id=${id}`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (this.currentTab == '2') {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pages/coupon/creatDiscount?id=${id}`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.$store.state.shopSelectedIds = []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ if (options && options.tab) {
|
|
|
+ this.currentTab = options.tab
|
|
|
+ } else {
|
|
|
+ this.currentTab = 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ let page = {
|
|
|
+ num: 1,
|
|
|
+ size: 10
|
|
|
+ }
|
|
|
+ this.showPaymentPopup = false
|
|
|
+ if (this.currentTab == 1 || this.currentTab == 2) {
|
|
|
+ this.getList1(page)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.coupon-page {
|
|
|
- width: 100%;
|
|
|
- height: 100vh;
|
|
|
- background: #F7F8FC;
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- position: fixed;
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-.tab-container {
|
|
|
- padding: 16rpx 32rpx;
|
|
|
- background-color: #ffffff;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-bar {
|
|
|
- position: relative;
|
|
|
-
|
|
|
- .tab-item {
|
|
|
- // padding: 12rpx 40rpx;
|
|
|
- height: 60rpx;
|
|
|
- line-height: 60rpx;
|
|
|
- text-align: center;
|
|
|
- width: 33.33%;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #666;
|
|
|
- position: relative;
|
|
|
- border-radius: 8px;
|
|
|
- // margin-right: 20rpx;
|
|
|
- transition: all 0.3s;
|
|
|
-
|
|
|
- &.active {
|
|
|
- color: #449AFF;
|
|
|
- background: rgba(68, 154, 255, 0.05);
|
|
|
- font-weight: 500;
|
|
|
- border: 1px solid #449AFF;
|
|
|
- }
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-.coupon-card {
|
|
|
- background: linear-gradient(to right, #ffffff, #f8fbff);
|
|
|
- border-radius: 12rpx;
|
|
|
- // padding: 30rpx;
|
|
|
- margin: 26rpx 32rpx;
|
|
|
- box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
|
|
|
-
|
|
|
- .card-header {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- // margin-bottom: 20rpx;
|
|
|
- padding: 10rpx 18rpx;
|
|
|
-
|
|
|
-
|
|
|
- image {
|
|
|
- width: 230rpx;
|
|
|
- height: 50rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .status {
|
|
|
- font-size: 26rpx;
|
|
|
- color: #999;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .amount-section {
|
|
|
- width: 40%;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .amount {
|
|
|
- font-size: 80rpx;
|
|
|
- font-weight: bold;
|
|
|
- color: #02C1AB
|
|
|
- }
|
|
|
-
|
|
|
- .unit {
|
|
|
- font-size: 22rpx;
|
|
|
- color: #999999;
|
|
|
- margin-left: 4rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .use-condition {
|
|
|
- margin-top: 10rpx;
|
|
|
- font-size: 22rpx;
|
|
|
- color: #888888;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .info-section {
|
|
|
- .info-item {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 16rpx;
|
|
|
- font-size: 26rpx;
|
|
|
- color: #666;
|
|
|
-
|
|
|
- .dot {
|
|
|
- color: #999;
|
|
|
- margin-right: 8rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .label {
|
|
|
- color: #999;
|
|
|
- }
|
|
|
-
|
|
|
- .value {
|
|
|
- color: #333;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .backg-color1 {
|
|
|
- color: #2BC0AE;
|
|
|
- background: linear-gradient(90deg, #EFFFFE 0%, #F8FFFF 100%);
|
|
|
- }
|
|
|
-
|
|
|
- .backg-color2 {
|
|
|
- color: #5399D6;
|
|
|
- background: linear-gradient(90deg, #F4FAFF 0%, #FAFDFF 100%);
|
|
|
- }
|
|
|
-
|
|
|
- .backg-color3 {
|
|
|
- color: #E97C4F;
|
|
|
- background: linear-gradient(90deg, #FFF7F3 0%, #FFFBF8 100%);
|
|
|
- }
|
|
|
-
|
|
|
- .stats-section {
|
|
|
- display: flex;
|
|
|
- margin: 0 16rpx 13rpx 16rpx;
|
|
|
- padding: 13rpx 0;
|
|
|
- font-size: 24rpx;
|
|
|
-
|
|
|
-
|
|
|
- .stat-item {
|
|
|
- // margin-right: 40rpx;
|
|
|
- width: 33.33%;
|
|
|
- border-right: 1px solid #D4ECEA;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- &:last-child {
|
|
|
- margin-right: 0;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .stat-item:last-child {
|
|
|
- border-right: none;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .action-section {
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- // margin-top: 30rpx;
|
|
|
- border-top: 1px solid #EEEEEE;
|
|
|
- padding: 16rpx;
|
|
|
-
|
|
|
- .action-btn {
|
|
|
- border-radius: 4px 4px 4px 4px;
|
|
|
- margin-left: 27rpx;
|
|
|
- width: 190rpx;
|
|
|
- height: 43rpx;
|
|
|
- line-height: 43rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333333;
|
|
|
- text-align: center;
|
|
|
- border: 1px solid #CCCCCC;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.handle {
|
|
|
- // height: 112rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 78rpx 24rpx 32rpx 24rpx;
|
|
|
- position: relative;
|
|
|
- background: linear-gradient(90deg, #D8EAFF 4%, #E6F8F8 67%, #DDF1FA 100%), linear-gradient(#FFFFFF 0%, rgba(247, 248, 252, 0) 100%);
|
|
|
-
|
|
|
- .head_left {
|
|
|
- font-size: 40rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .center {
|
|
|
- position: absolute;
|
|
|
- left: 50%;
|
|
|
- top: 65%;
|
|
|
- transform: translate(-50%, -50%);
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: 600;
|
|
|
- }
|
|
|
-
|
|
|
- .head_right {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- span {
|
|
|
- width: 40rpx;
|
|
|
- height: 40rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
-
|
|
|
- .manage {
|
|
|
- // width: 150rpx;
|
|
|
- margin-left: 28rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.payment-popup {
|
|
|
- padding: 30rpx;
|
|
|
- width: 570rpx;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 16rpx;
|
|
|
-
|
|
|
- .popup-header {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding-bottom: 20rpx;
|
|
|
- border-bottom: 1px solid #EEEEEE;
|
|
|
-
|
|
|
- .popup-title {
|
|
|
- font-size: 34rpx;
|
|
|
- color: #333;
|
|
|
- font-weight: 500;
|
|
|
- transform: translateX(180rpx);
|
|
|
- }
|
|
|
-
|
|
|
- .popup-icon {
|
|
|
- background: #DEDEDE;
|
|
|
- width: 39rpx;
|
|
|
- height: 39rpx;
|
|
|
- text-align: center;
|
|
|
- border-radius: 50%
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .popup-concant {
|
|
|
- height: 180rpx;
|
|
|
- font-weight: 500;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #333333;
|
|
|
- flex-direction: column;
|
|
|
-
|
|
|
- view {
|
|
|
- margin: 16rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .payment-title {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #333;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .action-buttons {
|
|
|
- display: flex;
|
|
|
- margin-top: 20rpx;
|
|
|
- gap: 20rpx;
|
|
|
- padding-top: 20rpx;
|
|
|
- border-top: 1rpx solid #EEEEEE;
|
|
|
-
|
|
|
- .cancel-btn,
|
|
|
- .confirm-btn {
|
|
|
- flex: 1;
|
|
|
- height: 78rpx;
|
|
|
- line-height: 78rpx;
|
|
|
- text-align: center;
|
|
|
- border-radius: 44rpx;
|
|
|
- font-size: 28rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .cancel-btn {
|
|
|
- background: #F5F6FA;
|
|
|
- color: #666;
|
|
|
- }
|
|
|
-
|
|
|
- .confirm-btn {
|
|
|
- background: #5B9CF9;
|
|
|
- color: #FFFFFF;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.fix {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- background: #F7F8FC;
|
|
|
- position: sticky;
|
|
|
- top: 0px;
|
|
|
-
|
|
|
- /*#ifdef APP-PLUS*/
|
|
|
- .top {
|
|
|
- width: 100%;
|
|
|
- height: var(--status-bar-height);
|
|
|
- background: linear-gradient(87deg, #E2F4F8 0%, #A3CDFF 100%), linear-gradient(to bottom, #FFFFFF, #FFFFFF);
|
|
|
- }
|
|
|
+ .coupon-page {
|
|
|
+ width: 100%;
|
|
|
+ height: 100vh;
|
|
|
+ background: #F7F8FC;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ position: fixed;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-container {
|
|
|
+ padding: 16rpx 32rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tab-bar {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .tab-item {
|
|
|
+ // padding: 12rpx 40rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ width: 33.33%;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #666;
|
|
|
+ position: relative;
|
|
|
+ border-radius: 8px;
|
|
|
+ // margin-right: 20rpx;
|
|
|
+ transition: all 0.3s;
|
|
|
+
|
|
|
+ &.active {
|
|
|
+ color: #449AFF;
|
|
|
+ background: rgba(68, 154, 255, 0.05);
|
|
|
+ font-weight: 500;
|
|
|
+ border: 1px solid #449AFF;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .coupon-card {
|
|
|
+ background: linear-gradient(to right, #ffffff, #f8fbff);
|
|
|
+ border-radius: 12rpx;
|
|
|
+ // padding: 30rpx;
|
|
|
+ margin: 26rpx 32rpx;
|
|
|
+ box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
|
|
|
+
|
|
|
+ .card-header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ // margin-bottom: 20rpx;
|
|
|
+ padding: 10rpx 18rpx;
|
|
|
+
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 230rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .status {
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .amount-section {
|
|
|
+ width: 40%;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ .amount {
|
|
|
+ font-size: 80rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #02C1AB
|
|
|
+ }
|
|
|
+
|
|
|
+ .unit {
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #999999;
|
|
|
+ margin-left: 4rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .use-condition {
|
|
|
+ margin-top: 10rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #888888;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-section {
|
|
|
+ .info-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 16rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #666;
|
|
|
+
|
|
|
+ .dot {
|
|
|
+ color: #999;
|
|
|
+ margin-right: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .label {
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+
|
|
|
+ .value {
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .backg-color1 {
|
|
|
+ color: #2BC0AE;
|
|
|
+ background: linear-gradient(90deg, #EFFFFE 0%, #F8FFFF 100%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .backg-color2 {
|
|
|
+ color: #5399D6;
|
|
|
+ background: linear-gradient(90deg, #F4FAFF 0%, #FAFDFF 100%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .backg-color3 {
|
|
|
+ color: #E97C4F;
|
|
|
+ background: linear-gradient(90deg, #FFF7F3 0%, #FFFBF8 100%);
|
|
|
+ }
|
|
|
+
|
|
|
+ .stats-section {
|
|
|
+ display: flex;
|
|
|
+ margin: 0 16rpx 13rpx 16rpx;
|
|
|
+ padding: 13rpx 0;
|
|
|
+ font-size: 24rpx;
|
|
|
+
|
|
|
+
|
|
|
+ .stat-item {
|
|
|
+ // margin-right: 40rpx;
|
|
|
+ width: 33.33%;
|
|
|
+ border-right: 1px solid #D4ECEA;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-right: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .stat-item:last-child {
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .action-section {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ // margin-top: 30rpx;
|
|
|
+ border-top: 1px solid #EEEEEE;
|
|
|
+ padding: 16rpx;
|
|
|
+
|
|
|
+ .action-btn {
|
|
|
+ border-radius: 4px 4px 4px 4px;
|
|
|
+ margin-left: 27rpx;
|
|
|
+ width: 190rpx;
|
|
|
+ height: 43rpx;
|
|
|
+ line-height: 43rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #333333;
|
|
|
+ text-align: center;
|
|
|
+ border: 1px solid #CCCCCC;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .handle {
|
|
|
+ // height: 112rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 78rpx 24rpx 32rpx 24rpx;
|
|
|
+ position: relative;
|
|
|
+ background: linear-gradient(90deg, #D8EAFF 4%, #E6F8F8 67%, #DDF1FA 100%), linear-gradient(#FFFFFF 0%, rgba(247, 248, 252, 0) 100%);
|
|
|
+
|
|
|
+ .head_left {
|
|
|
+ font-size: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .center {
|
|
|
+ position: absolute;
|
|
|
+ left: 50%;
|
|
|
+ top: 65%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+
|
|
|
+ .head_right {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ span {
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+
|
|
|
+ .manage {
|
|
|
+ // width: 150rpx;
|
|
|
+ margin-left: 28rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .payment-popup {
|
|
|
+ padding: 30rpx;
|
|
|
+ width: 570rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 16rpx;
|
|
|
+
|
|
|
+ .popup-header {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
+ border-bottom: 1px solid #EEEEEE;
|
|
|
+
|
|
|
+ .popup-title {
|
|
|
+ font-size: 34rpx;
|
|
|
+ color: #333;
|
|
|
+ font-weight: 500;
|
|
|
+ transform: translateX(180rpx);
|
|
|
+ }
|
|
|
+
|
|
|
+ .popup-icon {
|
|
|
+ background: #DEDEDE;
|
|
|
+ width: 39rpx;
|
|
|
+ height: 39rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 50%
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .popup-concant {
|
|
|
+ height: 180rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #333333;
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ view {
|
|
|
+ margin: 16rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .payment-title {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .action-buttons {
|
|
|
+ display: flex;
|
|
|
+ margin-top: 20rpx;
|
|
|
+ gap: 20rpx;
|
|
|
+ padding-top: 20rpx;
|
|
|
+ border-top: 1rpx solid #EEEEEE;
|
|
|
+
|
|
|
+ .cancel-btn,
|
|
|
+ .confirm-btn {
|
|
|
+ flex: 1;
|
|
|
+ height: 78rpx;
|
|
|
+ line-height: 78rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 44rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .cancel-btn {
|
|
|
+ background: #F5F6FA;
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+
|
|
|
+ .confirm-btn {
|
|
|
+ background: #5B9CF9;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .fix {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ background: #F7F8FC;
|
|
|
+ position: sticky;
|
|
|
+ top: 0px;
|
|
|
+
|
|
|
+ /*#ifdef APP-PLUS*/
|
|
|
+ .top {
|
|
|
+ width: 100%;
|
|
|
+ height: var(--status-bar-height);
|
|
|
+ background: linear-gradient(87deg, #E2F4F8 0%, #A3CDFF 100%), linear-gradient(to bottom, #FFFFFF, #FFFFFF);
|
|
|
+ }
|
|
|
+
|
|
|
/* #endif */
|
|
|
-}
|
|
|
+ }
|
|
|
|
|
|
-.list {
|
|
|
- flex: 1;
|
|
|
- width: 100%;
|
|
|
- overflow-y: auto;
|
|
|
- background: #FFFFFF;
|
|
|
+ .list {
|
|
|
+ flex: 1;
|
|
|
+ width: 100%;
|
|
|
+ overflow-y: auto;
|
|
|
+ background: #FFFFFF;
|
|
|
|
|
|
-}
|
|
|
+ }
|
|
|
</style>
|