234 lines
6.4 KiB
Plaintext
234 lines
6.4 KiB
Plaintext
<template>
|
|
<view class="marketing-recharge-config">
|
|
<view class="config-card border-shadow">
|
|
<view class="config-header">
|
|
<text class="config-title">用户充值配置</text>
|
|
</view>
|
|
|
|
<view class="config-body">
|
|
<view class="config-item">
|
|
<view class="item-label">
|
|
<text class="label-txt">余额功能启用：</text>
|
|
<text class="label-desc">商城余额功能启用或者关闭</text>
|
|
</view>
|
|
<view class="item-content">
|
|
<view class="radio-group">
|
|
<view class="radio-item" @click="config.balance_enabled = true">
|
|
<view class="radio-circle" :class="{ checked: config.balance_enabled }"></view>
|
|
<text class="radio-txt">开启</text>
|
|
</view>
|
|
<view class="radio-item ml-20" @click="config.balance_enabled = false">
|
|
<view class="radio-circle" :class="{ checked: !config.balance_enabled }"></view>
|
|
<text class="radio-txt">关闭</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="config-item">
|
|
<view class="item-label">
|
|
<text class="label-txt">充值注意事项：</text>
|
|
<text class="label-desc">充值注意事项</text>
|
|
</view>
|
|
<view class="item-content">
|
|
<textarea class="config-textarea" v-model="config.notice" placeholder="请输入充值注意事项"></textarea>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="config-item">
|
|
<view class="item-label">
|
|
<text class="label-txt">小程序充值开关：</text>
|
|
<text class="label-desc">仅小程序端的充值开关，小程序提交审核前，需要关闭此功能</text>
|
|
</view>
|
|
<view class="item-content">
|
|
<view class="radio-group">
|
|
<view class="radio-item" @click="config.mp_recharge = true">
|
|
<view class="radio-circle" :class="{ checked: config.mp_recharge }"></view>
|
|
<text class="radio-txt">开启</text>
|
|
</view>
|
|
<view class="radio-item ml-20" @click="config.mp_recharge = false">
|
|
<view class="radio-circle" :class="{ checked: !config.mp_recharge }"></view>
|
|
<text class="radio-txt">关闭</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="config-item">
|
|
<view class="item-label">
|
|
<text class="label-txt">最低充值金额：</text>
|
|
<text class="label-desc">用户单次最低充值金额</text>
|
|
</view>
|
|
<view class="item-content">
|
|
<input class="config-input" type="number" v-model="config.min_amount" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="config-footer">
|
|
<button class="btn-submit" @click="handleSave">提交</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import { reactive, onMounted, ref } from 'vue'
|
|
import { fetchRechargeConfig, saveRechargeConfig, RechargeConfig } from '@/services/admin/marketingService.uts'
|
|
|
|
const isLoading = ref(false)
|
|
const isSaving = ref(false)
|
|
|
|
const config = reactive({
|
|
balance_enabled: true,
|
|
notice: '',
|
|
mp_recharge: false,
|
|
min_amount: 0.01
|
|
})
|
|
|
|
onMounted(() => {
|
|
loadConfig()
|
|
})
|
|
|
|
async function loadConfig() {
|
|
isLoading.value = true
|
|
try {
|
|
const res = await fetchRechargeConfig()
|
|
if (res != null) {
|
|
config.balance_enabled = res.balance_enabled
|
|
config.notice = res.recharge_notice ?? ''
|
|
config.mp_recharge = res.mp_recharge_enabled
|
|
config.min_amount = res.min_recharge_amount
|
|
}
|
|
} catch (e) {
|
|
uni.showToast({ title: '加载配置失败', icon: 'none' })
|
|
} finally {
|
|
isLoading.value = false
|
|
}
|
|
}
|
|
|
|
async function handleSave() {
|
|
if (isSaving.value) return
|
|
|
|
isSaving.value = true
|
|
const payload : RechargeConfig = {
|
|
balance_enabled: config.balance_enabled,
|
|
recharge_notice: config.notice,
|
|
mp_recharge_enabled: config.mp_recharge,
|
|
min_recharge_amount: config.min_amount
|
|
}
|
|
|
|
try {
|
|
const success = await saveRechargeConfig(payload)
|
|
if (success) {
|
|
uni.showToast({ title: '保存成功', icon: 'success' })
|
|
} else {
|
|
uni.showToast({ title: '保存失败', icon: 'none' })
|
|
}
|
|
} catch (e) {
|
|
uni.showToast({ title: '保存异常', icon: 'none' })
|
|
} finally {
|
|
isSaving.value = false
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.marketing-recharge-config {
|
|
padding: 0;
|
|
background: transparent;
|
|
min-height: auto;
|
|
}
|
|
|
|
.border-shadow {
|
|
background: #fff;
|
|
border-radius: 4px;
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
.config-card { padding: 24px; }
|
|
|
|
.config-header {
|
|
border-bottom: 1px solid #e8eaec;
|
|
padding-bottom: 16px;
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.config-title {
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
color: #17233d;
|
|
position: relative;
|
|
padding-left: 12px;
|
|
}
|
|
.config-title::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 4px;
|
|
bottom: 4px;
|
|
width: 3px;
|
|
background: #1890ff;
|
|
}
|
|
|
|
.config-item {
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin-bottom: 30px;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.item-label { width: 220px; display: flex; flex-direction: column; }
|
|
.label-txt { font-size: 14px; color: #333; margin-bottom: 4px; }
|
|
.label-desc { font-size: 12px; color: #999; }
|
|
|
|
.item-content { flex: 1; }
|
|
|
|
.radio-group { display: flex; flex-direction: row; padding-top: 4px; }
|
|
.radio-item { display: flex; flex-direction: row; align-items: center; cursor: pointer; }
|
|
.radio-circle { width: 14px; height: 14px; border: 1px solid #dcdfe6; border-radius: 50%; margin-right: 6px; position: relative; }
|
|
.radio-circle.checked { border-color: #1890ff; }
|
|
.radio-circle.checked::after { content: ''; position: absolute; width: 8px; height: 8px; background: #1890ff; border-radius: 50%; top: 2px; left: 2px; }
|
|
.radio-txt { font-size: 14px; color: #606266; }
|
|
.ml-20 { margin-left: 20px; }
|
|
|
|
.config-textarea {
|
|
width: 100%;
|
|
max-width: 600px;
|
|
height: 120px;
|
|
border: 1px solid #dcdfe6;
|
|
border-radius: 4px;
|
|
padding: 12px;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.config-input {
|
|
width: 300px;
|
|
height: 32px;
|
|
border: 1px solid #dcdfe6;
|
|
border-radius: 4px;
|
|
padding: 0 12px;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.config-footer {
|
|
margin-top: 40px;
|
|
padding-left: 220px;
|
|
}
|
|
|
|
.btn-submit {
|
|
width: 80px;
|
|
height: 32px;
|
|
line-height: 32px;
|
|
background: #1890ff;
|
|
color: #fff;
|
|
border: none;
|
|
border-radius: 4px;
|
|
font-size: 14px;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
|
|
|
|
|