From aff45d11be7ea49806cf44a72c131ba47224e509 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E7=8B=BC?= <2468023037@qq.com>
Date: Sun, 23 Feb 2025 00:16:44 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/withdraw/index.vue | 283 +++++++++++++++++++++++++++++++++++
 1 file changed, 283 insertions(+)
 create mode 100644 src/views/withdraw/index.vue

diff --git a/src/views/withdraw/index.vue b/src/views/withdraw/index.vue
new file mode 100644
index 0000000..53129d1
--- /dev/null
+++ b/src/views/withdraw/index.vue
@@ -0,0 +1,283 @@
+<template>
+  <div class="container">
+    <Breadcrumb :items="['menu.withdraw', 'menu.withdraw.list']" />
+
+    <a-card class="general-card" :title="$t('menu.withdraw.list')">
+        <a-row>
+        <a-col :flex="1">
+          <a-form :model="queryParams" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }"
+            label-align="left">
+            <a-row :gutter="16">
+              <a-col :span="8">
+                <a-form-item field="name" :label="'用户名'">
+                  <a-input v-model="queryParams.username" :placeholder="'请输入用户名'" />
+                </a-form-item>
+              </a-col>
+              <a-col :span="8">
+                <a-form-item field="updatedat" label="交易时间">
+                  <a-range-picker v-model="queryParams.updatedat" style="width: 100%" />
+                </a-form-item>
+              </a-col>
+              <a-col :span="8">
+                <a-form-item field="status" :label="'交易类型'">
+                  <a-select v-model="queryParams.status" :options="[
+                     {
+                    label: '全部',
+                    value: -1,
+                  },
+                     {
+                    label: '申请中',
+                    value: 1,
+                  },{
+                    label: '已到账',
+                    value: 2
+                  }, {
+                    label: '已驳回',
+                    value: 3,
+                  }, {
+                    label: '等待银行打款',
+                    value: 4,
+                  }, {
+                    label: '支付失败',
+                    value: 5,
+                  }]" :placeholder="'请选择交易类型'" />
+                </a-form-item>
+              </a-col>
+            </a-row>
+          </a-form>
+        </a-col>
+
+        <a-col :flex="'86px'" style="text-align: right">
+          <a-space  :size="18">
+            <a-button type="primary" @click="getAll">
+              <template #icon>
+                <icon-search />
+              </template>
+              查询
+            </a-button>
+            <a-button @click="reset">
+              <template #icon>
+                <icon-refresh />
+              </template>
+              重置
+            </a-button>
+          </a-space>
+        </a-col>
+      </a-row>
+      <div class="table-container">
+        <div class="table-content">
+            <a-table :data="data" :summary="summary" :pagination="false" :sticky-header="0" :scroll="{ y: 'calc(100vh - 375px)' }">
+                <template #columns>
+                <a-table-column title="账号" data-index="username"></a-table-column>
+                <a-table-column title="交易类型" data-index="status_text"></a-table-column>
+                <a-table-column title="交易时间" data-index="createtime2"></a-table-column>
+                <a-table-column title="交易金额" data-index="amount"></a-table-column>
+                <a-table-column title="订单编号" data-index="order_number"></a-table-column>
+                <a-table-column title="操作">
+                    <template #cell="{ record }">
+                        <a-button @click="handleNotBlock(record)">拒绝</a-button> 
+                        <a-button @click="handleBlock(record)">同意</a-button> 
+                    </template>
+                </a-table-column>
+                </template>
+            </a-table>
+            </div>
+            <div class="summary-container">
+                <div>
+                    合计：{{ addNum }}
+                </div>
+            </div>
+            <div class="pagination-container">
+                <a-pagination 
+                    v-model:current="pagination.current"
+                    v-model:page-size="pagination.pageSize"
+                    :total="pagination.total"
+                    :page-size-options="pagination.pageSizeOptions"
+                    :show-jumper="pagination.showJumper"
+                    :show-page-size="pagination.showPageSize"
+                    :show-total="pagination.showTotal"
+                    @change="handleTableChange"
+                    @page-size-change="handlePageSizeChange"
+                />
+            </div>
+      </div>
+    </a-card>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { computed, ref, reactive, watch, nextTick, onMounted } from 'vue';
+import { PaginationProps,TableChangeExtra  } from '@arco-design/web-vue';
+import { lists,pushMoney } from '@/api/withdraw';
+import { Modal } from '@arco-design/web-vue';
+import { Message } from '@arco-design/web-vue';
+
+const queryParams = ref({
+  username: "",
+  status: -1,
+  updatedat: [],
+  current: 1,
+  pageSize: 10,
+});
+const addNum = ref(0);
+
+const pagination =  reactive<PaginationProps>({
+    current: 1, // 当前页码
+    pageSize: 10, // 每页显示的条数
+    total: 0, // 总条数（根据实际情况设置）
+    pageSizeOptions: [10, 20, 50, 100,10000],
+    showJumper: true,
+    showPageSize: true,
+    showTotal: true,
+})
+
+//改变每页显示数量
+const handlePageSizeChange = (pageSize: number) => {
+    pagination.current = 1; 
+    pagination.pageSize = pageSize;
+    queryParams.value.current = 1;
+    queryParams.value.pageSize = pageSize;
+    getAll();
+}
+
+interface DataItem {
+    user_id: string;
+    username: string;
+    money: Date;
+    status: string;
+    createtime2: string;
+}
+
+let data = ref<DataItem[]>([])
+//跳页
+const handleTableChange = (page:number) => {
+    pagination.current = page;
+    queryParams.value.current = page;
+    getAll();
+};
+//同意提现
+const handleBlock = async(record:any) => {
+    Modal.confirm({
+        title: '操作提醒',
+        content: '是否确认该选择',
+        okText: '确认',
+        cancelText: '取消',
+        onOk: async () => {
+            record.type = 0;
+            const res = await pushMoney(record);
+            if (res.code === 200) {
+                reset();
+                Message.success('操作成功');
+            } else {
+                reset();
+                Message.error('操作失败');
+            }
+        },
+        onCancel: () => {
+            // 用户点击取消按钮时的操作（可选）
+            Message.info('操作已取消');
+        }
+    });
+};
+
+//不同意提现
+const handleNotBlock = async(record:any) => {
+    Modal.confirm({
+        title: '操作提醒',
+        content: '是否确认该选择',
+        okText: '确认',
+        cancelText: '取消',
+        onOk: async () => {
+            record.type = 1;
+            const res = await pushMoney(record);
+            if (res.code === 200) {
+                reset();
+                Message.success('操作成功');
+            } else {
+                reset();
+                Message.error('操作失败');
+            }
+        },
+        onCancel: () => {
+            // 用户点击取消按钮时的操作（可选）
+            Message.info('操作已取消');
+        }
+    });
+};
+
+//显示合计
+const summary = () => {
+    let amount = 0;
+    data.value.forEach(record => {
+        amount += record.amount;
+    })
+    addNum.value = amount;
+}
+//给合计样式
+const getColorStyle = (column, record) => {
+      if (['amount'].includes(column.dataIndex)) {
+        return {color: record[column.dataIndex] > 0 ? 'red' : 'green'}
+      }
+      return undefined
+}
+
+//重置
+const reset=()=>{
+  queryParams.value.username="";
+  queryParams.value.status=-1;
+  queryParams.value.updatedat=[];
+  getAll();
+}
+//获取列表数据
+const getAll = async() => {
+    const res= await lists(queryParams.value);
+    if (res.code == 200) {
+        data.value = res.data.data;
+        pagination.total = res.data.total;
+        summary();
+    }
+};
+onMounted(async () => {
+  getAll()
+})
+</script>
+
+
+<style lang="less" scoped>
+
+.table-container {
+  height: calc(100vh - 320px);
+}
+
+.table-content {
+  flex: 1;
+  overflow: hidden;
+}
+
+.arco-table {
+  height: 100%;
+  overflow-y: auto;
+}
+
+.pagination-container {
+  display: flex;
+  justify-content: flex-end;
+  padding: 10px;
+  background-color: white;
+  border-top: 1px solid #e8e8e8;
+}
+
+.arco-table {
+  overflow: hidden;
+}
+
+.container {
+  padding: 0 20px 20px 20px;
+}
+
+.summary-container{
+  background-color: rgb(223, 226, 224);
+  text-align: center;
+  font-size: 20px;
+}
+</style>