This commit is contained in:
parent
92dc991f5d
commit
db35f2d707
|
|
@ -1,7 +1,7 @@
|
||||||
VITE_NOW_TYPE = 'dist'
|
VITE_NOW_TYPE = 'dist'
|
||||||
|
|
||||||
# VITE_PUSH_URL = 'ws://192.168.1.22:8787'
|
VITE_PUSH_URL = 'ws://192.168.1.22:8787'
|
||||||
# VITE_BASE_URL = 'http://192.168.1.22:8546'
|
VITE_BASE_URL = 'http://192.168.1.22:8546'
|
||||||
|
|
||||||
VITE_PUSH_URL ='wss://erp.lihaink.cn/pull'
|
# VITE_PUSH_URL ='wss://erp.lihaink.cn/pull'
|
||||||
VITE_BASE_URL = 'https://erp.lihaink.cn'
|
# VITE_BASE_URL = 'https://erp.lihaink.cn'
|
||||||
|
|
@ -0,0 +1,46 @@
|
||||||
|
import request from '@/utils/axios.js'
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 获取余额和银行信息
|
||||||
|
*/
|
||||||
|
export function amountAccountApi() {
|
||||||
|
return request.get(`/merchant/Merchant/amount_account`)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 提现列表
|
||||||
|
*/
|
||||||
|
export function amountTakingListsApi(data) {
|
||||||
|
return request.get(`/merchant/Merchant/taking_lists`, {params: data})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 提现总次数和金额
|
||||||
|
*/
|
||||||
|
export function amountTakingInfoApi() {
|
||||||
|
return request.get(`/merchant/Merchant/taking_info`)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 提现操作
|
||||||
|
*/
|
||||||
|
export function amountWithdrawApi(data) {
|
||||||
|
return request.post(`/merchant/Merchant/withdraw`, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 7日订单统计
|
||||||
|
*/
|
||||||
|
export function financialRecordApi(data) {
|
||||||
|
return request.get(`/financial/FinancialRecord/lists`, {params: data})
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 余额明细
|
||||||
|
*/
|
||||||
|
export function financialRecordListsApi(data) {
|
||||||
|
return request.get(`/financial/FinancialRecord/api_lists`, {params: data})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -59,6 +59,7 @@ const list = ref([
|
||||||
},
|
},
|
||||||
{ name: "purchaseOrder", title: "采购订单", ico: "Van", count: 0 },
|
{ name: "purchaseOrder", title: "采购订单", ico: "Van", count: 0 },
|
||||||
{ name: "orderCount", title: "订单统计", ico: "DocumentRemove", count: 0 },
|
{ name: "orderCount", title: "订单统计", ico: "DocumentRemove", count: 0 },
|
||||||
|
{ name: "wallet", title: "余额提现", ico: "Wallet", count: 0 },
|
||||||
// { name: "test", title: "打印", ico: "Tickets", count: 0 },
|
// { name: "test", title: "打印", ico: "Tickets", count: 0 },
|
||||||
]);
|
]);
|
||||||
const aup = () => {
|
const aup = () => {
|
||||||
|
|
|
||||||
|
|
@ -41,6 +41,12 @@ const routes = [
|
||||||
meta: { title: '订单统计' },
|
meta: { title: '订单统计' },
|
||||||
component: () => import('@/views/saleOrder/indexCount.vue'),
|
component: () => import('@/views/saleOrder/indexCount.vue'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/wallet',
|
||||||
|
name: 'wallet',
|
||||||
|
meta: { title: '提现' },
|
||||||
|
component: () => import('@/views/wallet/index.vue'),
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: '/test',
|
path: '/test',
|
||||||
name: 'test',
|
name: 'test',
|
||||||
|
|
|
||||||
|
|
@ -227,4 +227,4 @@ onUnmounted(() => {
|
||||||
background-color: #999; /* 设置鼠标悬停时滑块的背景色 */
|
background-color: #999; /* 设置鼠标悬停时滑块的背景色 */
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
, onMounted, onUnmounted
|
|
||||||
|
|
|
||||||
|
|
@ -1,24 +1,9 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
import {
|
import { amountTakingListsApi, financialRecordApi } from "@/api/merchant.js";
|
||||||
orderListApi,
|
|
||||||
orderStatusApi,
|
|
||||||
orderLadingApi,
|
|
||||||
cartListApi,
|
|
||||||
statisticsApi,
|
|
||||||
orderPriceApi,
|
|
||||||
} from "@/api/store.js";
|
|
||||||
import { useUserStore } from "@/store/user.js";
|
|
||||||
import pay from "@/components/pay.vue";
|
|
||||||
import { ElMessage } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
import { useRouter } from "vue-router";
|
|
||||||
|
|
||||||
const userStore = useUserStore();
|
|
||||||
const orderList = ref([]);
|
const orderList = ref([]);
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const tabPosition = ref(1); // 1-全部, 2-未收银
|
|
||||||
const payRef = ref(null);
|
|
||||||
|
|
||||||
const where = ref({
|
const where = ref({
|
||||||
page_no: 1,
|
page_no: 1,
|
||||||
|
|
@ -26,110 +11,26 @@ const where = ref({
|
||||||
});
|
});
|
||||||
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const total = ref(0);
|
|
||||||
|
|
||||||
const getOrderList = () => {
|
const getOrderList = () => {
|
||||||
orderPriceApi(where.value).then((res) => {
|
financialRecordApi(where.value).then((res) => {
|
||||||
orderList.value = res.data;
|
orderList.value = res.data.lists;
|
||||||
// total.value = res.data.count;
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
// getOrderList();
|
getOrderList();
|
||||||
|
|
||||||
const formData = ref({});
|
|
||||||
const getStatistics = () => {
|
|
||||||
loading.value = true;
|
|
||||||
statisticsApi(userStore.userInfo.service.mer_id, {
|
|
||||||
staff_id: userStore.userInfo.service.service_id,
|
|
||||||
}).then((res) => {
|
|
||||||
formData.value = res.data.data;
|
|
||||||
loading.value = false;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
// getStatistics();
|
|
||||||
|
|
||||||
const prevClick = (e) => {
|
|
||||||
where.value.page_no = e;
|
|
||||||
getOrderList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const nextClick = (e) => {
|
|
||||||
where.value.page_no = e;
|
|
||||||
getOrderList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const currentChange = (e) => {
|
|
||||||
where.value.page_no = e;
|
|
||||||
getOrderList();
|
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div v-loading="loading" element-loading-text="加载中" class="my-order">
|
<div v-loading="loading" element-loading-text="加载中" class="my-order">
|
||||||
<div class="from" v-if="formData.today">
|
|
||||||
<div class="form-card green">
|
|
||||||
<div>{{ formData.today.payPrice }}</div>
|
|
||||||
<div class="tips">今日线上收银金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card green">
|
|
||||||
<div>{{ formData.yesterday.payPrice }}</div>
|
|
||||||
<div class="tips">昨日线上收银金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card green">
|
|
||||||
<div>{{ formData.month.payPrice }}</div>
|
|
||||||
<div class="tips">本月线上收银金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card">
|
|
||||||
<div>{{ (formData.today.cashPayment + formData.today.payPrice).toFixed(2) }}</div>
|
|
||||||
<div class="tips">今日收银 线上+现金 总金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card">
|
|
||||||
<div>{{ (formData.month.cashPayment + formData.month.payPrice).toFixed(2) }}</div>
|
|
||||||
<div class="tips">本月收银 线上+现金 总金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card red">
|
|
||||||
<div>{{ formData.today.cashPayment }}</div>
|
|
||||||
<div class="tips">今日现金收银金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card red">
|
|
||||||
<div>{{ formData.yesterday.cashPayment }}</div>
|
|
||||||
<div class="tips">昨日现金收银金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card red">
|
|
||||||
<div>{{ formData.month.cashPayment }}</div>
|
|
||||||
<div class="tips">本月现金收银金额</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card">
|
|
||||||
<div>
|
|
||||||
{{ (formData.yesterday.cashPayment + formData.yesterday.payPrice).toFixed(2) }}
|
|
||||||
</div>
|
|
||||||
<div class="tips">昨日收银 线上+现金 总金额</div>
|
|
||||||
</div>
|
|
||||||
<!-- <div class="form-card">
|
|
||||||
<div>{{formData.today.orderNum}}</div>
|
|
||||||
<div class="tips">今日订单数</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card">
|
|
||||||
<div>{{formData.yesterday.orderNum}}</div>
|
|
||||||
<div class="tips">昨日订单数</div>
|
|
||||||
</div>
|
|
||||||
<div class="form-card">
|
|
||||||
<div>{{formData.month.orderNum}}</div>
|
|
||||||
<div class="tips">本月订单数</div>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
<div class="table">
|
<div class="table">
|
||||||
<el-table :data="orderList" style="width: 100%">
|
<el-table :data="orderList" style="width: 100%">
|
||||||
<el-table-column prop="day" label="日期" width="260" />
|
<el-table-column prop="record_date" label="时间" width="260" />
|
||||||
<el-table-column prop="total" label="订单数量" />
|
<el-table-column prop="cashier_cash_total_amount" label="现金收银金额(元)" />
|
||||||
<el-table-column prop="cash_payment" label="现金收银金额" />
|
<el-table-column prop="cashier_total_amount" label="线上收银金额(元)" />
|
||||||
<el-table-column prop="pay_price" label="线上收银金额" />
|
<el-table-column prop="platofrm_total_amount" label="平台订单金额(元)" />
|
||||||
<el-table-column label="总金额">
|
<el-table-column prop="total_amount" label="总金额(元)" />
|
||||||
<template #default="scope">
|
|
||||||
{{ (((+scope.row.pay_price || 0) + (+scope.row.cash_payment || 0))).toFixed(2) }}
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,255 @@
|
||||||
|
<script setup>
|
||||||
|
import { onMounted, onUnmounted, ref } from "vue";
|
||||||
|
import { amountTakingListsApi, financialRecordListsApi } from "@/api/merchant.js";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import mitt from "@/utils/mitt.js";
|
||||||
|
import moment from "moment";
|
||||||
|
|
||||||
|
const where = ref({
|
||||||
|
page_no: 1,
|
||||||
|
page_size: 15,
|
||||||
|
loadend: false,
|
||||||
|
loading: false,
|
||||||
|
create_time: "",
|
||||||
|
start_time: ""
|
||||||
|
});
|
||||||
|
const changeDate = () => {
|
||||||
|
where.value.page_no = 1;
|
||||||
|
where.value.loadend = false;
|
||||||
|
where.value.loading = false;
|
||||||
|
goods_list.value = [];
|
||||||
|
getOrderList();
|
||||||
|
};
|
||||||
|
|
||||||
|
const listType = ref(1);
|
||||||
|
const goods_list = ref([]);
|
||||||
|
const getOrderList = () => {
|
||||||
|
console.log("触底", !where.value.loadend , !where.value.loading);
|
||||||
|
if (!where.value.loadend && !where.value.loading) {
|
||||||
|
console.log("加载");
|
||||||
|
where.value.loading = true;
|
||||||
|
if (listType.value == 1)
|
||||||
|
amountTakingListsApi({
|
||||||
|
page_no: where.value.page_no,
|
||||||
|
page_size: where.value.page_size,
|
||||||
|
create_time: where.value.create_time,
|
||||||
|
}).then((res) => {
|
||||||
|
goods_list.value = [...goods_list.value, ...res.data.lists];
|
||||||
|
if (res.data.lists.length < where.value.page_size)
|
||||||
|
where.value.loadend = true;
|
||||||
|
where.value.loading = false;
|
||||||
|
where.value.page_no++;
|
||||||
|
});
|
||||||
|
if (listType.value == 2)
|
||||||
|
financialRecordListsApi({
|
||||||
|
page_no: where.value.page_no,
|
||||||
|
page_size: where.value.page_size,
|
||||||
|
start_time: moment(where.value.start_time || new Date()).format('YYYY-MM-DD'),
|
||||||
|
// end_time: moment('2024-05-16').format('YYYY-MM-DD'),
|
||||||
|
}).then((res) => {
|
||||||
|
goods_list.value = [...goods_list.value, ...res.data.lists];
|
||||||
|
if (res.data.lists.length < where.value.page_size)
|
||||||
|
where.value.loadend = true;
|
||||||
|
where.value.loading = false;
|
||||||
|
where.value.page_no++;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
getOrderList();
|
||||||
|
|
||||||
|
const changeListType = () => {
|
||||||
|
where.value.page_no = 1;
|
||||||
|
where.value.loadend = false;
|
||||||
|
where.value.loading = false;
|
||||||
|
goods_list.value = [];
|
||||||
|
getOrderList();
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
mitt.on("get-taking-lists", (res) => {
|
||||||
|
where.value.page_no = 1;
|
||||||
|
where.value.loadend = false;
|
||||||
|
where.value.loading = false;
|
||||||
|
goods_list.value = [];
|
||||||
|
getOrderList();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
mitt.off("get-taking-lists");
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="my-order">
|
||||||
|
<div class="date">
|
||||||
|
<div>
|
||||||
|
<el-date-picker
|
||||||
|
v-if="listType==1"
|
||||||
|
v-model="where.create_time"
|
||||||
|
type="month"
|
||||||
|
placeholder="请选择月份"
|
||||||
|
@change="changeDate"
|
||||||
|
/>
|
||||||
|
<el-date-picker
|
||||||
|
v-if="listType==2"
|
||||||
|
v-model="where.start_time"
|
||||||
|
type="date"
|
||||||
|
placeholder="请选择日期"
|
||||||
|
@change="changeDate"
|
||||||
|
format="YYYY-MM-DD"
|
||||||
|
/>
|
||||||
|
<el-button type="primary" style="margin-left: 1rem">重置</el-button>
|
||||||
|
</div>
|
||||||
|
<el-radio-group v-model="listType" @change="changeListType">
|
||||||
|
<el-radio-button label="提现记录" :value="1" />
|
||||||
|
<el-radio-button label="余额明细" :value="2" />
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
<div class="detail">
|
||||||
|
<div
|
||||||
|
class="table"
|
||||||
|
v-loading="where.loading"
|
||||||
|
v-infinite-scroll="getOrderList"
|
||||||
|
infinite-scroll-distance="300"
|
||||||
|
infinite-scroll-delay="300"
|
||||||
|
style="overflow: auto"
|
||||||
|
:infinite-scroll-immediate="false"
|
||||||
|
v-if="listType==1"
|
||||||
|
>
|
||||||
|
<el-table :data="goods_list">
|
||||||
|
<el-table-column
|
||||||
|
prop="merchant_bank_info.is_own"
|
||||||
|
label="账户类型"
|
||||||
|
width="100"
|
||||||
|
>
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div>
|
||||||
|
{{ row.merchant_bank_info.is_own ? "对公账户" : "个人账户" }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="price" label="银行卡">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div>
|
||||||
|
{{ row.merchant_bank_info.bank_info.name }} ({{
|
||||||
|
row.merchant_bank_info.bank_code.slice(-4)
|
||||||
|
}})
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="amount" label="提现金额" width="150" />
|
||||||
|
<el-table-column label="备注/凭证" width="200">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div v-if="row.arrival_proof">
|
||||||
|
<el-image
|
||||||
|
style="width: 3rem; height: 3rem; margin-right: 0.2rem"
|
||||||
|
v-for="(item, index) in JSON.parse(row.arrival_proof)"
|
||||||
|
:key="index"
|
||||||
|
:src="item"
|
||||||
|
:preview-src-list="JSON.parse(row.arrival_proof)"
|
||||||
|
:initial-index="index"
|
||||||
|
></el-image>
|
||||||
|
</div>
|
||||||
|
<div v-else>{{ row.fail_msg }}</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="提现状态" width="100">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<el-tag v-if="row.arrival_proof" type="success">已到账</el-tag>
|
||||||
|
<el-tag v-else-if="row.is_check == 1" type="primary"
|
||||||
|
>待转账</el-tag
|
||||||
|
>
|
||||||
|
<el-tag v-else-if="row.is_check == 0" type="info">待审核</el-tag>
|
||||||
|
<el-tag v-else-if="row.is_check == 2" type="danger"
|
||||||
|
>提现失败</el-tag
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="create_time" label="提现时间" width="200" />
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="table"
|
||||||
|
v-loading="where.loading"
|
||||||
|
v-infinite-scroll="getOrderList"
|
||||||
|
infinite-scroll-distance="500"
|
||||||
|
infinite-scroll-delay="500"
|
||||||
|
style="overflow: auto"
|
||||||
|
:infinite-scroll-immediate="false"
|
||||||
|
v-if="listType==2"
|
||||||
|
>
|
||||||
|
<el-table :data="goods_list">
|
||||||
|
<el-table-column
|
||||||
|
prop="number_sn"
|
||||||
|
label="订单号"
|
||||||
|
width="250"
|
||||||
|
>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="number" label="变动金额" width="180" />
|
||||||
|
<el-table-column prop="financial_type" label="变动类型" width="180" />
|
||||||
|
<el-table-column prop="create_time" label="时间" />
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.my-order {
|
||||||
|
border-radius: 1.2rem;
|
||||||
|
height: 100%;
|
||||||
|
flex: 1;
|
||||||
|
background-color: #fff;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.date {
|
||||||
|
padding: 1rem 1rem 0 1rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail {
|
||||||
|
height: calc(100vh - 100px - 4rem);
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.table {
|
||||||
|
padding: 1rem;
|
||||||
|
padding-bottom: 6rem;
|
||||||
|
overflow-y: auto;
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.table-title {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.table-info {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
color: #777;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
padding-bottom: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info-item {
|
||||||
|
width: 33%;
|
||||||
|
display: flex;
|
||||||
|
padding-top: 1rem;
|
||||||
|
.info-item-title {
|
||||||
|
flex-shrink: 0;
|
||||||
|
padding-right: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,203 @@
|
||||||
|
<script setup>
|
||||||
|
import { ref, onMounted, onUnmounted } from "vue";
|
||||||
|
import { useUserStore } from "@/store/user.js";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { useRouter } from "vue-router";
|
||||||
|
import mitt from "@/utils/mitt.js";
|
||||||
|
import { amountAccountApi, amountTakingInfoApi, amountWithdrawApi } from "@/api/merchant.js";
|
||||||
|
|
||||||
|
const userStore = useUserStore();
|
||||||
|
|
||||||
|
const info = ref({
|
||||||
|
balance: 0,
|
||||||
|
count: 0,
|
||||||
|
total: 0
|
||||||
|
});
|
||||||
|
|
||||||
|
const bankList = ref([]);
|
||||||
|
const getInfo = () => {
|
||||||
|
amountAccountApi().then((res) => {
|
||||||
|
res.data.bank_list.forEach(item => {
|
||||||
|
if(item.is_check){
|
||||||
|
form.value.merchant_bank_id = item.id; //选择默认银行卡
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if(!form.value.merchant_bank_id) form.value.merchant_bank_id = res.data.bank_list[0].id;
|
||||||
|
bankList.value = res.data.bank_list;
|
||||||
|
info.value.balance = res.data.balance;
|
||||||
|
});
|
||||||
|
amountTakingInfoApi().then(res=>{
|
||||||
|
info.value = Object.assign(info.value, res.data);
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
getInfo();
|
||||||
|
|
||||||
|
const form = ref({
|
||||||
|
merchant_bank_id: '',
|
||||||
|
amount: ''
|
||||||
|
});
|
||||||
|
const setForm = (e)=>{
|
||||||
|
form.value.merchant_bank_id = e.id
|
||||||
|
}
|
||||||
|
|
||||||
|
const submit = ()=>{
|
||||||
|
if(+form.value.amount <= 0) {
|
||||||
|
form.value.amount = '';
|
||||||
|
return ElMessage.error('提现金额必须大于0');
|
||||||
|
}
|
||||||
|
if(+form.value.amount > +info.value.balance) {
|
||||||
|
form.value.amount = info.value.balance;
|
||||||
|
return ElMessage.error('提现金额不能大于余额');
|
||||||
|
}
|
||||||
|
amountWithdrawApi(form.value).then(res=>{
|
||||||
|
form.value.amount = "";
|
||||||
|
ElMessage.success('提现成功，等待管理员审核');
|
||||||
|
mitt.emit('get-taking-lists')
|
||||||
|
getInfo();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="my-order">
|
||||||
|
<div class="header-nav">
|
||||||
|
<div class="nav-item">
|
||||||
|
{{ "提现" }}
|
||||||
|
</div>
|
||||||
|
<div class="nav-body">
|
||||||
|
<div class="my-money">
|
||||||
|
<div>我的余额:</div>
|
||||||
|
<div style="text-align: center; color: #2ec479;">
|
||||||
|
<span>{{ info.balance }}</span>元
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="my-count">
|
||||||
|
<div class="count">提现次数: <span>{{ info.count }}</span>次</div>
|
||||||
|
<div class="money">累计提现到账: <span style="color: #ff4a00;"> {{ info.total }}</span>元</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="order-lists"
|
||||||
|
infinite-scroll-distance="300"
|
||||||
|
infinite-scroll-delay="500"
|
||||||
|
style="overflow: auto"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="item"
|
||||||
|
:class="{ 'item-active': form.merchant_bank_id == item.id }"
|
||||||
|
v-for="(item, index) in bankList"
|
||||||
|
:key="index"
|
||||||
|
@click="setForm(item, index)"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
提现至
|
||||||
|
<span style="color:#1890ff;">{{item.bank_name}}({{item.bank_code.slice(-4)}})</span>
|
||||||
|
<span class="own">{{ item.is_own==1?'对公':'个人' }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="height: 8.2rem;"></div>
|
||||||
|
<div class="order-footer">
|
||||||
|
<div class="input-btn">
|
||||||
|
<el-input v-model="form.amount" placeholder="请输入提现金额" type="number"></el-input>
|
||||||
|
<el-button class="btn" type="primary" @click="form.amount=info.balance">全部</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="order-btn">
|
||||||
|
<el-button class="btn" type="primary" @click="submit" :disabled="info.balance<=0">立即提现</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.my-order {
|
||||||
|
border-radius: 1.2rem;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
width: 30rem;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.header-nav {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 1rem;
|
||||||
|
height: 7.5rem;
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-body {
|
||||||
|
.my-money {
|
||||||
|
padding: 0.4rem 0;
|
||||||
|
height: 4rem;
|
||||||
|
span {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.my-count {
|
||||||
|
height: 1.4rem;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
color: #777;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.order-lists {
|
||||||
|
flex: 1;
|
||||||
|
overflow-y: auto;
|
||||||
|
.item {
|
||||||
|
padding: 1rem;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
.own{
|
||||||
|
font-size: 0.7rem;
|
||||||
|
padding: 0.1rem 0.2rem;
|
||||||
|
background-color: #2ec479;
|
||||||
|
color: #fff;
|
||||||
|
margin-left: 1rem;
|
||||||
|
border-radius: 0.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item-active {
|
||||||
|
background-color: #efefef;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.order-footer {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
box-shadow: 0 -1px 0.625rem #eee;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
.input-btn{
|
||||||
|
display: flex;
|
||||||
|
padding: 1rem 1.5rem;
|
||||||
|
padding-bottom: 0;
|
||||||
|
|
||||||
|
.btn{
|
||||||
|
margin-left: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.order-btn {
|
||||||
|
height: 3.2rem;
|
||||||
|
padding: 1rem 1.5rem;
|
||||||
|
.btn {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
border-radius: 3rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,44 @@
|
||||||
|
<script setup>
|
||||||
|
import order from "./component/order.vue";
|
||||||
|
import detail from "./component/detail.vue";
|
||||||
|
import padding from "@/components/padding.vue";
|
||||||
|
import { ref, nextTick } from "vue";
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="my-card">
|
||||||
|
<order style="flex-shrink: 0;" ref="orderRef"/>
|
||||||
|
<padding />
|
||||||
|
<detail ref="detailRef"/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.my-card {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
}
|
||||||
|
/* 修改滚动条的样式 */
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 0.315rem; /* 设置滚动条的宽度 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设置滚动条的轨道样式 */
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background-color: #f1f1f1; /* 设置轨道的背景色 */
|
||||||
|
/* margin: 1.25rem 0; */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设置滚动条的滑块样式 */
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background-color: #ccc; /* 设置滑块的背景色 */
|
||||||
|
border-radius: 0.315rem; /* 设置滑块的圆角 */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设置滚动条鼠标悬停时的滑块样式 */
|
||||||
|
::-webkit-scrollbar-thumb:hover {
|
||||||
|
background-color: #999; /* 设置鼠标悬停时滑块的背景色 */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue