root/xl-root
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
多啦C梦
2025-04-30 10:02:22 +08:00
parent ff17e84aed
commit d7fe2a62a9
10 changed files with 6942 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/pages/merchant/components/Alipay.vue
View File

@@ -1,11 +1,35 @@
<script setup>
import {ref} from "vue";
import {reactive, ref} from "vue";
import {Message} from "@arco-design/web-vue";
import Api from "../../../api/index.js";
const {money} = defineProps({
money: {
type: Number,
default: null
}
});
const visible = ref(false);
const qrInfo = reactive({});
const open = () => {
if (!money) {
Message.warning('充值金额需大于0元');
return;
}
visible.value = true;
initQR();
}
const initQR = async () => {
const {data} = await Api.merchant.rechargeOrderQR({
money: money,
});
Object.assign(qrInfo, data);
}
</script>
<template>
<a-button type="primary" @click="visible=true">立即充值</a-button>
<a-button type="primary" @click="open">立即充值</a-button>
<a-modal
:footer="false"
@@ -18,7 +42,7 @@ const visible = ref(false);
<div class="py-[24px] px-[20px]">
<div class="flex justify-center gap-[15px]">
支付金额: <span class="text-[rgb(var(--arcoblue-6))]">200元</span>
支付金额: <span class="text-[rgb(var(--arcoblue-6))]">{{ money }}元</span>
</div>
<div class="text-center mt-[20px]">打开支付宝扫描下方二维码支付</div>
<div class="w-[200px] aspect-square mx-auto mt-[5px]">

10
src/pages/merchant/pages/my-wallet/components/Recharge.vue
View File

@@ -1,6 +1,10 @@
<script setup>
import {reactive} from "vue";
import Alipay from "../../../components/Alipay.vue";
const form = reactive({
money: null,
});
</script>
<template>
@@ -12,11 +16,11 @@ import Alipay from "../../../components/Alipay.vue";
<a-form>
<a-form-item label="立即充值">
<a-input-number class="w-1/2" placeholder="输入金额"></a-input-number>
<a-input-number v-model:model-value="form.money" class="w-1/2" placeholder="输入金额"></a-input-number>
</a-form-item>
<a-form-item class="mt-[40px]">
<Alipay></Alipay>
<Alipay :money="form.money"></Alipay>
</a-form-item>
</a-form>
</template>

9
src/pages/merchant/pages/my-wallet/components/Reflect.vue
View File

@@ -7,6 +7,13 @@ import openWithdrawalStatus from "./openWithdrawalStatus.js";
import LookWithdrawalInformationModal from "../../../components/LookWithdrawalInformationModal.vue";
import Api from "../../../../../api/index.js";
const {businessInfo} = defineProps({
businessInfo: {
type: Object,
default: {}
}
});
const withdrawalList = reactive([]);
const getData = async () => {
const {data} = await Api.merchant.getWithdrawalList();
@@ -60,7 +67,7 @@ onMounted(() => {
<a-form-item label="提现金额">
<div class="max-w-[768px] flex gap-[20px] items-center">
<a-input-number :placeholder="`最多可提现${388.88}元`"></a-input-number>
<a-input-number :placeholder="`最多可提现${businessInfo.money}元`"></a-input-number>
<a-link :hoverable="false" class="whitespace-nowrap">全部提现</a-link>
</div>
</a-form-item>

37
src/pages/merchant/pages/my-wallet/wallet-overview.vue
View File

@@ -1,7 +1,7 @@
<script setup>
import Recharge from "./components/Recharge.vue";
import Reflect from "./components/Reflect.vue";
import {reactive} from "vue";
import {onMounted, reactive} from "vue";
import useTableQuery from "../../../../hooks/useTableQuery.js";
import Api from "../../../../api/index.js";
@@ -57,6 +57,21 @@ const {loading, pagination, initFetchData} = useTableQuery({
console.log(vo);
}
});
const businessInfo = reactive({
money: 0,
coin: 0,
recharge: 0,
withdrawal: 0,
consume: 0,
});
const getData = async () => {
const {data} = await Api.merchant.getBusinessInfo();
Object.assign(businessInfo, data);
}
onMounted(() => {
getData();
})
</script>
<template>
@@ -70,20 +85,24 @@ const {loading, pagination, initFetchData} = useTableQuery({
<div class="flex-grow flex flex-col gap-[20px]">
<div class="mock-card grid grid-cols-5 gap-[20px]" id="statistic-card">
<div class="bg-[rgb(var(--arcoblue-1))] p-[20px]">
<a-statistic title="钱包余额(元)" :value="8.06" :precision="2" :value-from="0" animation></a-statistic>
</div>
<div class="bg-[rgb(var(--arcoblue-1))] p-[20px]">
<a-statistic title="任务款余额(元)" :value="8.06" :precision="2" :value-from="0"
<a-statistic title="钱包余额(元)" :value="businessInfo.money" :precision="2" :value-from="0"
animation></a-statistic>
</div>
<div class="bg-[rgb(var(--arcoblue-1))] p-[20px]">
<a-statistic title="累计充值(元)" :value="8.06" :precision="2" :value-from="0" animation></a-statistic>
<a-statistic title="任务款余额(元)" :value="businessInfo.coin" :precision="2" :value-from="0"
animation></a-statistic>
</div>
<div class="bg-[rgb(var(--arcoblue-1))] p-[20px]">
<a-statistic title="累计消耗(元)" :value="8.06" :precision="2" :value-from="0" animation></a-statistic>
<a-statistic title="累计充值(元)" :value="businessInfo.recharge" :precision="2" :value-from="0"
animation></a-statistic>
</div>
<div class="bg-[rgb(var(--arcoblue-1))] p-[20px]">
<a-statistic title="累计提现(元)" :value="8.06" :precision="2" :value-from="0" animation></a-statistic>
<a-statistic title="累计消耗(元)" :value="businessInfo.consume" :precision="2" :value-from="0"
animation></a-statistic>
</div>
<div class="bg-[rgb(var(--arcoblue-1))] p-[20px]">
<a-statistic title="累计提现(元)" :value="businessInfo.withdrawal" :precision="2" :value-from="0"
animation></a-statistic>
</div>
</div>
@@ -93,7 +112,7 @@ const {loading, pagination, initFetchData} = useTableQuery({
<Recharge></Recharge>
</a-tab-pane>
<a-tab-pane key="Reflect" title="我的提现">
<Reflect></Reflect>
<Reflect :businessInfo="businessInfo"></Reflect>
</a-tab-pane>
</a-tabs>
</a-card>