|
|
@@ -0,0 +1,688 @@
|
|
|
+<template>
|
|
|
+ <view class="app-content">
|
|
|
+ <view class="main-content">
|
|
|
+ <!-- 充值设置卡片 -->
|
|
|
+ <view class="section-card">
|
|
|
+ <!-- 充值是否成为VIP会员 -->
|
|
|
+ <view class="setting-block">
|
|
|
+ <view class="block-label">充值是否成为VIP会员</view>
|
|
|
+ <radio-group class="radio-row" @change="vipChange">
|
|
|
+ <label class="radio-label" for="vipYes">
|
|
|
+ <radio id="vipYes" value="1" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.isVipMember == 1" />
|
|
|
+ <text class="radio-text">是</text>
|
|
|
+ </label>
|
|
|
+ <label class="radio-label" for="vipNo">
|
|
|
+ <radio id="vipNo" value="0" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.isVipMember == 0" />
|
|
|
+ <text class="radio-text">否</text>
|
|
|
+ </label>
|
|
|
+ </radio-group>
|
|
|
+ <view class="vip-amount-row" v-if="form.isVipMember == 1">
|
|
|
+ <text class="suffix-text">单笔充值 ≥</text>
|
|
|
+ <input
|
|
|
+ v-model="form.vipAmount"
|
|
|
+ type="digit"
|
|
|
+ class="inline-input"
|
|
|
+ placeholder="请输入金额"
|
|
|
+ @focus="form.vipAmount = ''"
|
|
|
+ />
|
|
|
+ <text class="suffix-text">元</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 充值规则 -->
|
|
|
+ <view class="setting-block inline">
|
|
|
+ <view class="block-label inline">充值规则</view>
|
|
|
+ <radio-group class="radio-row" @change="ruleChange">
|
|
|
+ <label class="radio-label" for="ruleNone">
|
|
|
+ <radio id="ruleNone" value="0" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.rechargeRule == 0" />
|
|
|
+ <text class="radio-text">无赠送</text>
|
|
|
+ </label>
|
|
|
+ <label class="radio-label" for="ruleHb">
|
|
|
+ <radio id="ruleHb" value="2" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.rechargeRule == 2" />
|
|
|
+ <text class="radio-text">送红包</text>
|
|
|
+ </label>
|
|
|
+ <label class="radio-label" for="ruleMoney">
|
|
|
+ <radio id="ruleMoney" value="1" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.rechargeRule == 1" />
|
|
|
+ <text class="radio-text">送钱</text>
|
|
|
+ </label>
|
|
|
+ </radio-group>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 送红包：红包非余额支付时 + 红包规则列表 -->
|
|
|
+ <block v-if="form.rechargeRule == 2">
|
|
|
+ <view class="section-card">
|
|
|
+ <view class="block-label">红包非余额支付时</view>
|
|
|
+ <radio-group class="radio-row" @change="hbPayableChange">
|
|
|
+ <label class="radio-label" for="hbDisable">
|
|
|
+ <radio id="hbDisable" value="0" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.hbPayable == 0" />
|
|
|
+ <text class="radio-text">不可用</text>
|
|
|
+ </label>
|
|
|
+ <label class="radio-label" for="hbEnable">
|
|
|
+ <radio id="hbEnable" value="1" style="transform:scale(0.875,0.875)" color="#049E2C" :checked="form.hbPayable == 1" />
|
|
|
+ <text class="radio-text">可用</text>
|
|
|
+ </label>
|
|
|
+ </radio-group>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="section-card">
|
|
|
+ <view class="block-label">红包规则</view>
|
|
|
+ <view class="hb-list-wrap">
|
|
|
+ <block v-if="!$util.isEmpty(list.data)">
|
|
|
+ <view
|
|
|
+ class="hb-list"
|
|
|
+ v-for="(item, index) in list.data"
|
|
|
+ :key="item.id"
|
|
|
+ @click.stop="navigateToSendHb(item)"
|
|
|
+ >
|
|
|
+ <view class="hb-list-det">
|
|
|
+ <view class="app-size-28 app-color-0">
|
|
|
+ 满<text style="margin-left: 6upx;font-size: 32upx; font-weight: bold">{{ formatAmountDisplay(item.amount) }}元</text>，送{{ item.num }}个红包(共{{ formatAmountDisplay(item.allHbAmount) }}元)
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="hb-confirm-btn">
|
|
|
+ <button class="admin-button-com middle blue" @click.stop="navigateToSendHb(item)">修改</button>
|
|
|
+ <button class="admin-button-com middle blue" style="margin-left: 24upx;" @click.stop="deleteRule(item, index)">删除</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ <block v-else>
|
|
|
+ <app-wrapper-empty title="暂无数据" :is-empty="$util.isEmpty(list.data)" />
|
|
|
+ </block>
|
|
|
+ </view>
|
|
|
+ <view class="inline-action">
|
|
|
+ <view v-if="list.data.length < 50">
|
|
|
+ <button class="admin-button-com middle blue" @click="addHbRuleFn">创建规则</button>
|
|
|
+ </view>
|
|
|
+ <view v-else>
|
|
|
+ <button class="admin-button-com middle blue" disabled>最多创建50条规则</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+
|
|
|
+ <!-- 送钱：说明 + 档位表格 -->
|
|
|
+ <block v-if="form.rechargeRule == 1">
|
|
|
+ <view class="block-label top-label">送钱规则</view>
|
|
|
+ <view class="config-intro">
|
|
|
+ <view class="intro-card">
|
|
|
+ <view class="intro-header">
|
|
|
+ <text class="intro-title">说明</text>
|
|
|
+ </view>
|
|
|
+ <view class="intro-content">
|
|
|
+ <view class="intro-tips">
|
|
|
+ <view class="intro-tip-item highlight">
|
|
|
+ <text class="intro-tip-text">客户有欠款未结清，充值时将没有赠送！</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="tier-table">
|
|
|
+ <view class="table-header">
|
|
|
+ <view class="header-cell serial">序号</view>
|
|
|
+ <view class="header-cell recharge">充值金额(¥)</view>
|
|
|
+ <view class="header-cell give">赠送金额(¥)</view>
|
|
|
+ <view class="header-cell discount">折扣率</view>
|
|
|
+ </view>
|
|
|
+ <view class="table-body">
|
|
|
+ <view class="table-row" v-for="(item, inIndex) in map" :key="inIndex">
|
|
|
+ <view class="table-cell serial">
|
|
|
+ <text class="serial-number">{{ inIndex + 1 }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="table-cell recharge">
|
|
|
+ <input
|
|
|
+ v-model="item.recharge"
|
|
|
+ type="digit"
|
|
|
+ class="table-input recharge-input"
|
|
|
+ @focus="() => clearRecharge(inIndex)"
|
|
|
+ placeholder="0"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="table-cell give">
|
|
|
+ <input
|
|
|
+ v-model="item.give"
|
|
|
+ type="digit"
|
|
|
+ class="table-input give-input"
|
|
|
+ @focus="() => clearGive(inIndex)"
|
|
|
+ placeholder="0"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="table-cell discount">
|
|
|
+ <text class="discount-text" v-if="item.recharge && item.give">
|
|
|
+ {{ getDiscountRate(item.recharge, item.give) }} 折
|
|
|
+ </text>
|
|
|
+ <text class="discount-placeholder" v-else>--</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="inline-action">
|
|
|
+ <button class="admin-button-com middle blue" @click="saveMoneyRules">保存送钱规则</button>
|
|
|
+ </view>
|
|
|
+ </block>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 底部保存：仅保存 VIP 设置、充值规则、红包非余额支付时 -->
|
|
|
+ <view class="app-footer">
|
|
|
+ <button class="admin-button-com big blue" @click="saveSetting">保存设置</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import AppWrapperEmpty from '@/components/app-wrapper-empty';
|
|
|
+import { list } from '@/mixins';
|
|
|
+import { getRechargeData as getRechargeDataApi, modifyRecharge } from '@/api/member';
|
|
|
+import { getRechargeSetting, saveRechargeSetting } from '@/api/shop';
|
|
|
+import { hbRulesList, deleteHbRule } from '@/api/hb';
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'rechargeSetting',
|
|
|
+ components: {
|
|
|
+ AppWrapperEmpty
|
|
|
+ },
|
|
|
+ mixins: [list],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: {
|
|
|
+ isVipMember: 0,
|
|
|
+ vipAmount: '',
|
|
|
+ rechargeRule: 0, // 0:无赠送, 1:送钱, 2:送红包
|
|
|
+ hbPayable: 0 // 0:不可用, 1:可用
|
|
|
+ },
|
|
|
+ map: [] // 送钱档位列表
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+ this.loadSetting();
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ if (this.form.rechargeRule == 2) {
|
|
|
+ this.getHbRulesList();
|
|
|
+ }
|
|
|
+ if (this.form.rechargeRule == 1) {
|
|
|
+ this.getRechargeData();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ this.loadSetting();
|
|
|
+ if (this.form.rechargeRule == 2) {
|
|
|
+ this.resetList();
|
|
|
+ this.getHbRulesList().then(() => {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ });
|
|
|
+ } else if (this.form.rechargeRule == 1) {
|
|
|
+ this.getRechargeData().then(() => {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.stopPullDownRefresh();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init() {},
|
|
|
+ loadSetting() {
|
|
|
+ getRechargeSetting().then(res => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ const d = res.data || {};
|
|
|
+ this.form.isVipMember = Number(d.isVipMember) || 0;
|
|
|
+ this.form.vipAmount = d.vipAmount != null ? d.vipAmount : '';
|
|
|
+ this.form.rechargeRule = Number(d.rechargeRule) || 0;
|
|
|
+ this.form.hbPayable = Number(d.hbPayable) || 0;
|
|
|
+
|
|
|
+ if (this.form.rechargeRule == 2) {
|
|
|
+ this.resetList();
|
|
|
+ this.getHbRulesList();
|
|
|
+ }
|
|
|
+ if (this.form.rechargeRule == 1) {
|
|
|
+ this.resetList();
|
|
|
+ this.getRechargeData();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ vipChange(e) {
|
|
|
+ this.form.isVipMember = Number(e.detail.value);
|
|
|
+ if (this.form.isVipMember != 1) {
|
|
|
+ this.form.vipAmount = '';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ ruleChange(e) {
|
|
|
+ this.form.rechargeRule = Number(e.detail.value);
|
|
|
+ if (this.form.rechargeRule == 2) {
|
|
|
+ this.resetList();
|
|
|
+ this.getHbRulesList();
|
|
|
+ }
|
|
|
+ if (this.form.rechargeRule == 1) {
|
|
|
+ this.getRechargeData();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hbPayableChange(e) {
|
|
|
+ this.form.hbPayable = Number(e.detail.value);
|
|
|
+ },
|
|
|
+
|
|
|
+ /* ---------- 红包规则列表 ---------- */
|
|
|
+ getHbRulesList() {
|
|
|
+ return hbRulesList({pageSize: 50}).then(res => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ const data = { code: res.code, msg: res.msg, data: { list: res.data.list } };
|
|
|
+ this.completes(data);
|
|
|
+ } else {
|
|
|
+ this.$msg(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getRechargeData() {
|
|
|
+ return getRechargeDataApi().then(res => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ this.map = res.data.recharge;
|
|
|
+ } else {
|
|
|
+ this.$msg(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ navigateToSendHb(item) {
|
|
|
+ uni.navigateTo({ url: '/admin/hb/sendHb?id=' + item.id });
|
|
|
+ },
|
|
|
+ deleteRule(item, index) {
|
|
|
+ this.$util.confirmModal({ title: '提示', content: '确定要删除该规则吗？' }, () => {
|
|
|
+ deleteHbRule({ id: item.id }).then(res => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ this.$msg('删除成功');
|
|
|
+ this.list.data.splice(index, 1);
|
|
|
+ if (this.list.data.length === 0) {
|
|
|
+ this.resetList();
|
|
|
+ this.getHbRulesList();
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$msg(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ formatAmountDisplay(value) {
|
|
|
+ if (value === null || value === undefined || value === '') return value;
|
|
|
+ const str = String(value);
|
|
|
+ return /^-?\d+\.00$/.test(str) ? str.split('.')[0] : str;
|
|
|
+ },
|
|
|
+ addHbRuleFn() {
|
|
|
+ // 最多创建50条规则
|
|
|
+ if (this.list.data.length >= 50) {
|
|
|
+ this.$msg('最多创建50条规则');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ uni.navigateTo({ url: '/admin/hb/sendHb' });
|
|
|
+ },
|
|
|
+
|
|
|
+ /* ---------- 送钱档位 ---------- */
|
|
|
+ clearRecharge(index) {
|
|
|
+ this.$set(this.map[index], 'recharge', '');
|
|
|
+ },
|
|
|
+ clearGive(index) {
|
|
|
+ this.$set(this.map[index], 'give', '');
|
|
|
+ },
|
|
|
+ getDiscountRate(recharge, give) {
|
|
|
+ const rechargeAmount = parseFloat(recharge) || 0;
|
|
|
+ const giveAmount = parseFloat(give) || 0;
|
|
|
+ if (rechargeAmount <= 0) return '0.0';
|
|
|
+ const totalValue = rechargeAmount + giveAmount;
|
|
|
+ return (rechargeAmount / totalValue * 10).toFixed(1);
|
|
|
+ },
|
|
|
+ saveMoneyRules() {
|
|
|
+ this.$util.confirmModal({ content: '确认提交送钱规则？' }, () => {
|
|
|
+ modifyRecharge({ data: this.map }).then(res => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ this.$msg(res.msg || '保存成功');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ /* ---------- 保存顶部设置 ---------- */
|
|
|
+ saveSetting() {
|
|
|
+ if (this.form.isVipMember == 1) {
|
|
|
+ const amount = parseFloat(this.form.vipAmount);
|
|
|
+ if (!amount || amount <= 0) {
|
|
|
+ this.$msg('请输入成为VIP的充值金额');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ const payload = {
|
|
|
+ isVipMember: this.form.isVipMember,
|
|
|
+ vipAmount: this.form.isVipMember == 1 ? this.form.vipAmount : '',
|
|
|
+ rechargeRule: this.form.rechargeRule,
|
|
|
+ hbPayable: this.form.rechargeRule == 2 ? this.form.hbPayable : 0
|
|
|
+ };
|
|
|
+ this.$util.confirmModal({ content: '确认保存设置？' }, () => {
|
|
|
+ saveRechargeSetting(payload).then(res => {
|
|
|
+ if (res.code == 1) {
|
|
|
+ this.$msg(res.msg || '保存成功');
|
|
|
+ } else if (res.msg) {
|
|
|
+ this.$msg(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.app-content {
|
|
|
+ min-height: 100vh;
|
|
|
+ background: linear-gradient(135deg, #f8fffe 0%, #eef7f0 100%);
|
|
|
+ padding-bottom: 180upx;
|
|
|
+}
|
|
|
+
|
|
|
+.main-content {
|
|
|
+ padding: 0upx 10upx 12upx;
|
|
|
+}
|
|
|
+
|
|
|
+/* ==== 通用卡片 ==== */
|
|
|
+.section-card {
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 16upx;
|
|
|
+ padding: 15upx;
|
|
|
+ margin-bottom: 24upx;
|
|
|
+ box-shadow: 0 2upx 8upx rgba(0, 0, 0, 0.04);
|
|
|
+}
|
|
|
+
|
|
|
+.block-label {
|
|
|
+ font-size: 30upx;
|
|
|
+ font-weight: 700;
|
|
|
+ color: #1a1a1a;
|
|
|
+ margin-bottom: 16upx;
|
|
|
+
|
|
|
+ &.inline {
|
|
|
+ margin-bottom: 0;
|
|
|
+ margin-right: 24upx;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.top-label {
|
|
|
+ padding: 4upx 0 16upx;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.setting-block {
|
|
|
+ padding: 14upx 0;
|
|
|
+
|
|
|
+ &.inline {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* ==== 单选组 ==== */
|
|
|
+.radio-row {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+}
|
|
|
+
|
|
|
+.radio-label {
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-right: 36upx;
|
|
|
+ padding: 10upx 0;
|
|
|
+}
|
|
|
+
|
|
|
+.radio-text {
|
|
|
+ font-size: 28upx;
|
|
|
+ color: #333;
|
|
|
+ margin-left: 4upx;
|
|
|
+}
|
|
|
+
|
|
|
+.suffix-text {
|
|
|
+ font-size: 28upx;
|
|
|
+ color: #333;
|
|
|
+ margin: 0 12upx;
|
|
|
+}
|
|
|
+
|
|
|
+.vip-amount-row {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin-top: 12upx;
|
|
|
+ padding-left: 4upx;
|
|
|
+
|
|
|
+ .suffix-text:first-child {
|
|
|
+ margin-left: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.inline-input {
|
|
|
+ width: 180upx;
|
|
|
+ height: 56upx;
|
|
|
+ border: 1upx solid #ddd;
|
|
|
+ border-radius: 8upx;
|
|
|
+ padding: 0 12upx;
|
|
|
+ font-size: 28upx;
|
|
|
+ text-align: center;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+/* ==== 红包规则列表 ==== */
|
|
|
+.hb-list-wrap {
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .hb-list {
|
|
|
+ @include disFlex(center, space-between);
|
|
|
+ padding: 30upx 0;
|
|
|
+ margin: 0 15upx;
|
|
|
+ color: $fontColor3;
|
|
|
+ border-bottom: 1px solid $borderColor;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .hb-list-det {
|
|
|
+ margin-left: 20upx;
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ .hb-confirm-btn {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.inline-action {
|
|
|
+ margin-top: 30upx;
|
|
|
+ padding: 0 15upx;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ .admin-button-com {
|
|
|
+ width: 70%;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* ==== 送钱：说明卡片 ==== */
|
|
|
+.config-intro {
|
|
|
+ margin-bottom: 30upx;
|
|
|
+
|
|
|
+ .intro-card {
|
|
|
+ background: linear-gradient(45deg, #049E2C, #09C567);
|
|
|
+ border-radius: 16upx;
|
|
|
+ padding: 24upx 30upx;
|
|
|
+ box-shadow: 0 6upx 20upx rgba(4, 158, 44, 0.15);
|
|
|
+
|
|
|
+ .intro-header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 16upx;
|
|
|
+
|
|
|
+ .intro-title {
|
|
|
+ font-size: 36upx;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .intro-content {
|
|
|
+ .intro-tips {
|
|
|
+ .intro-tip-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ margin-bottom: 12upx;
|
|
|
+ padding: 8upx 0;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .intro-tip-text {
|
|
|
+ flex: 1;
|
|
|
+ font-size: 28upx;
|
|
|
+ line-height: 1.4;
|
|
|
+ color: rgba(255, 255, 255, 0.85);
|
|
|
+ }
|
|
|
+
|
|
|
+ &.highlight {
|
|
|
+ .intro-tip-text {
|
|
|
+ color: #fff4e6;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 34upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* ==== 送钱：档位表格 ==== */
|
|
|
+.tier-table {
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 12upx;
|
|
|
+ overflow: hidden;
|
|
|
+ border: 1upx solid #e5e5e5;
|
|
|
+ box-shadow: 0 2upx 8upx rgba(0, 0, 0, 0.06);
|
|
|
+
|
|
|
+ .table-header {
|
|
|
+ display: flex;
|
|
|
+ background: #f8f9fa;
|
|
|
+ border-bottom: 1upx solid #e5e5e5;
|
|
|
+
|
|
|
+ .header-cell {
|
|
|
+ padding: 24upx 16upx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 28upx;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #333;
|
|
|
+ border-right: 1upx solid #e5e5e5;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.serial {
|
|
|
+ flex: 0 0 120upx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.recharge,
|
|
|
+ &.give {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.discount {
|
|
|
+ flex: 0 0 160upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .table-body {
|
|
|
+ .table-row {
|
|
|
+ display: flex;
|
|
|
+ border-bottom: 1upx solid #f0f0f0;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .table-cell {
|
|
|
+ padding: 20upx 16upx;
|
|
|
+ text-align: center;
|
|
|
+ border-right: 1upx solid #f0f0f0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ border-right: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.serial {
|
|
|
+ flex: 0 0 120upx;
|
|
|
+
|
|
|
+ .serial-number {
|
|
|
+ width: 40upx;
|
|
|
+ height: 40upx;
|
|
|
+ background: #049E2C;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 50%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 24upx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.recharge,
|
|
|
+ &.give {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.discount {
|
|
|
+ flex: 0 0 160upx;
|
|
|
+
|
|
|
+ .discount-text {
|
|
|
+ font-size: 26upx;
|
|
|
+ color: #ff6b35;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+
|
|
|
+ .discount-placeholder {
|
|
|
+ font-size: 24upx;
|
|
|
+ color: #ccc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.table-input {
|
|
|
+ width: 100%;
|
|
|
+ height: 80upx;
|
|
|
+ border: 1upx solid #ddd;
|
|
|
+ border-radius: 6upx;
|
|
|
+ padding: 0 12upx;
|
|
|
+ font-size: 32upx;
|
|
|
+ font-weight: 500;
|
|
|
+ text-align: center;
|
|
|
+ color: #333;
|
|
|
+ background: #fff;
|
|
|
+
|
|
|
+ &:focus {
|
|
|
+ border-color: #049E2C;
|
|
|
+ outline: none;
|
|
|
+ background: #f9fff9;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.give-input:focus {
|
|
|
+ border-color: #ff6b35;
|
|
|
+ }
|
|
|
+
|
|
|
+ &::placeholder {
|
|
|
+ color: #ccc;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
