huangzhenbao/medical-mall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善页面2

Browse Source
This commit is contained in:
huangzhenbao
2026-02-12 23:56:40 +08:00
parent db323abaf0
commit 3357a09294
4 changed files with 189 additions and 631 deletions
Download Patch File Download Diff File Expand all files Collapse all files

212
pages/mall/admin/setting/interface/payment.uvue
View File

@@ -2,202 +2,78 @@
<view class="admin-page-container">
<view class="page-header">
<view class="breadcrumb">
<text class="bc-item">设置</text>
<text class="bc-item">设置</text>
<text class="bc-sep">/</text>
<text class="bc-item">接口配置</text>
<text class="bc-item">接口配置</text>
<text class="bc-sep">/</text>
<text class="bc-item active">商城支付配置</text>
<text class="bc-item active">商城支付</text>
</view>
</view>
<view class="content-card">
<view class="tabs-header">
<view class="tab-item active"><text class="tab-text">基础配置</text></view>
<view class="tab-item"><text class="tab-text">微信支付配置</text></view>
<view class="tab-item active"><text class="tab-text">支付配置</text></view>
</view>
<view class="config-view">
<view class="form-section">
<view class="form-content">
<view class="form-row">
<view class="form-label">余额支付:</view>
<view class="form-label">微信支付:</view>
<view class="form-input-box">
<radio-group class="form-radio-group" @change="onBalancePayChange">
<label class="radio-label">
<radio value="1" :checked="form.balancePay == '1'" color="#2d8cf0" />
<text class="radio-text">开启</text>
</label>
<label class="radio-label">
<radio value="0" :checked="form.balancePay == '0'" color="#2d8cf0" />
<text class="radio-text">关闭</text>
</label>
</radio-group>
<text class="form-tips">余额支付请选择开启或关闭</text>
<switch checked color="#2d8cf0" @change="onWxPayChange" />
<text class="form-tips">开启后前端可使用微信支付</text>
</view>
</view>
<view class="form-row">
<view class="form-label">好友代付:</view>
<view class="form-label">AppID:</view>
<view class="form-input-box">
<radio-group class="form-radio-group" @change="onFriendPayChange">
<label class="radio-label">
<radio value="1" :checked="form.friendPay == '1'" color="#2d8cf0" />
<text class="radio-text">开启</text>
</label>
<label class="radio-label">
<radio value="0" :checked="form.friendPay == '0'" color="#2d8cf0" />
<text class="radio-text">关闭</text>
</label>
</radio-group>
<text class="form-tips">好友代付开关，关闭后付款类型不显示好友代付</text>
<input class="form-input" v-model="form.wxAppId" placeholder="微信AppID" />
</view>
</view>
<view class="form-row">
<view class="form-label">MchID:</view>
<view class="form-input-box">
<input class="form-input" v-model="form.wxMchId" placeholder="商户号" />
</view>
</view>
<view class="form-row" style="margin-top: 40px;">
<view class="form-label">支付宝支付:</view>
<view class="form-input-box">
<switch color="#2d8cf0" @change="onAliPayChange" />
</view>
</view>
<view class="form-actions">
<button class="submit-btn" type="primary" @click="handleSubmit">提交</button>
<button class="submit-btn" type="primary" @click="handleSubmit">保存设置</button>
</view>
</view>
</view>
</view>
</view>
</template>
<script setup lang="uts">
import { ref, reactive } from 'vue'
const form = reactive({
balancePay: '1',
friendPay: '1'
})
const onBalancePayChange = (e: any) => {
form.balancePay = e.detail.value
}
const onFriendPayChange = (e: any) => {
form.friendPay = e.detail.value
}
const handleSubmit = () => {
uni.showToast({ title: '提交成功' })
}
const form = reactive({ wxAppId: '', wxMchId: '', wxEnabled: true, aliEnabled: false })
const onWxPayChange = (e : any) => { form.wxEnabled = e.detail.value }
const onAliPayChange = (e : any) => { form.aliEnabled = e.detail.value }
const handleSubmit = () => { uni.showToast({ title: '支付配置已保存' }) }
</script>
<style scoped>
.admin-page-container {
min-height: 100vh;
background-color: #f5f7f9;
padding: 20px;
}
.breadcrumb {
display: flex;
flex-direction: row;
margin-bottom: 20px;
}
.admin-page-container { min-height: 100vh; background-color: #f5f7f9; padding: 20px; }
.breadcrumb { display: flex; flex-direction: row; margin-bottom: 20px; }
.bc-item { font-size: 14px; color: #999; }
.bc-item.active { color: #333; }
.bc-sep { margin: 0 8px; color: #ccc; }
.content-card {
background-color: #fff;
border-radius: 4px;
}
.tabs-header {
display: flex;
flex-direction: row;
border-bottom: 1px solid #f0f0f0;
padding: 0 20px;
}
.tab-item {
padding: 15px 20px;
cursor: pointer;
}
.tab-text {
font-size: 14px;
color: #666;
}
.tab-item.active {
border-bottom: 2px solid #2d8cf0;
}
.tab-item.active .tab-text {
color: #2d8cf0;
font-weight: bold;
}
.config-view {
padding: 24px;
}
.form-content {
padding-left: 20px;
}
.form-row {
display: flex;
flex-direction: row;
margin-bottom: 30px;
align-items: flex-start;
}
.form-label {
width: 100px;
font-size: 14px;
color: #333;
text-align: right;
margin-right: 20px;
padding-top: 8px;
}
.form-input-box {
flex: 1;
}
.form-radio-group {
display: flex;
flex-direction: row;
height: 36px;
align-items: center;
}
.radio-label {
display: flex;
flex-direction: row;
align-items: center;
margin-right: 24px;
}
.radio-text {
font-size: 14px;
margin-left: 8px;
}
.form-tips {
display: block;
font-size: 12px;
color: #bfbfbf;
margin-top: 12px;
line-height: 1.6;
}
.form-actions {
margin-top: 40px;
padding-left: 120px;
}
.submit-btn {
width: 80px;
height: 36px;
background-color: #2d8cf0;
color: #fff;
border-radius: 4px;
font-size: 14px;
line-height: 36px;
text-align: center;
}
.content-card { background-color: #fff; border-radius: 4px; }
.tabs-header { display: flex; flex-direction: row; border-bottom: 1px solid #f0f0f0; padding: 0 20px; }
.tab-item { padding: 15px 20px; border-bottom: 2px solid transparent; }
.tab-text { font-size: 14px; color: #666; }
.tab-item.active { border-bottom-color: #2d8cf0; }
.tab-item.active .tab-text { color: #2d8cf0; font-weight: bold; }
.form-section { padding: 40px 20px; }
.form-content { max-width: 800px; }
.form-row { display: flex; flex-direction: row; margin-bottom: 24px; align-items: center; }
.form-label { width: 140px; font-size: 14px; color: #606266; text-align: right; margin-right: 20px; }
.form-input-box { flex: 1; }
.form-input { width: 100%; max-width: 400px; border: 1px solid #dcdfe6; border-radius: 4px; height: 36px; padding: 0 12px; font-size: 14px; }
.form-tips { display: block; font-size: 12px; color: #999; margin-top: 8px; }
.form-actions { margin-top: 40px; padding-left: 160px; }
.submit-btn { width: 100px; height: 36px; background-color: #2d8cf0; color: #fff; border-radius: 4px; font-size: 14px; line-height: 36px; text-align: center; }
</style>