充值订单筛选

493a6554 · renyizhao · 780cb232 · 493a6554 · 493a6554
Commit 493a6554 authored Jun 17, 2026 by renyizhao
Show whitespace changes
Inline Side-by-side

Showing with 103 additions and 50 deletions

src/api/member/recharge/index.ts
+6 -2

src/views/member/recharge/index.vue
+97 -48

No files found.
--- a/src/api/member/recharge/index.ts
+++ b/src/api/member/recharge/index.ts
@@ -3,14 +3,15 @@ import request from '@/config/axios'
 export interface MemberRechargePageReqVO {
  pageNo: number
  pageSize: number
-  userId?: number
+  userMobile?: string
  payChannel?: string
  payStatus?: number
+  redeemed?: number
  createTime?: [string, string]
 }
 export interface MemberRechargeRespVO {
-  id: number
+  id: number | null
  userId: number
  userMobile: string
  amount: number
@@ -46,5 +47,8 @@ export const MemberRechargeApi = {
  },
  manualRecharge: async (data: MemberRechargeManualReqVO) => {
    return request.post({ url: '/member/recharge/manual', data })
+  },
+  getPendingCount: async () => {
+    return request.get({ url: '/member/recharge/pending-count' })
  }
 }
--- a/src/views/member/recharge/index.vue
+++ b/src/views/member/recharge/index.vue
@@ -11,10 +11,10 @@
          :inline="true"
          label-width="100px"
        >
-          <el-form-item label="用户ID" prop="userId">
+          <el-form-item label="手机号" prop="userMobile">
            <el-input
-              v-model="queryParams.userId"
+              v-model="queryParams.userMobile"
-              placeholder="请输入用户ID"
+              placeholder="请输入手机号"
              clearable
              @keyup.enter="handleQuery"
              class="!w-240px"
@@ -44,6 +44,19 @@
              <el-option label="已退款" :value="2" />
            </el-select>
          </el-form-item>
+          <el-form-item label="充值状态" prop="redeemed">
+            <el-select
+              v-model="queryParams.redeemed"
+              placeholder="请选择充值状态"
+              clearable
+              class="!w-240px"
+            >
+              <el-option label="无需充值" :value="0" />
+              <el-option label="已充值" :value="1" />
+              <el-option label="待充值" :value="2" />
+              <el-option label="已人工充值" :value="3" />
+            </el-select>
+          </el-form-item>
          <el-form-item label="创建时间" prop="createTime">
            <el-date-picker
              v-model="queryParams.createTime"
@@ -56,8 +69,12 @@
            />
          </el-form-item>
          <el-form-item>
-            <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+            <el-button @click="handleQuery"
-            <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+              ><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
+            >
+            <el-button @click="resetQuery"
+              ><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button
+            >
          </el-form-item>
        </el-form>
      </el-tab-pane>
@@ -65,7 +82,9 @@
      <!-- 待充值 Tab -->
      <el-tab-pane name="pending">
        <template #label>
+          <el-badge :value="pendingCount" :hidden="pendingCount === 0" :max="99">
            <span>待充值</span>
+          </el-badge>
        </template>
      </el-tab-pane>
    </el-tabs>
@@ -74,8 +93,14 @@
  <!-- 列表 -->
  <ContentWrap>
    <!-- 充值记录列表 -->
-    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" v-if="activeTab === 'list'">
+    <el-table
-      <el-table-column label="用户名" align="center" prop="userMobile" />
+      v-loading="loading"
+      :data="list"
+      :stripe="true"
+      :show-overflow-tooltip="true"
+      v-if="activeTab === 'list'"
+    >
+      <el-table-column label="手机号" align="center" prop="userMobile" />
      <el-table-column label="充值金额" align="center" prop="amount">
        <template #default="{ row }">
          <span>¥{{ row.amount }}</span>
@@ -112,30 +137,38 @@
      />
      <el-table-column label="交易流水号" align="center" prop="transactionId" min-width="180" />
      <el-table-column label="备注" align="center" prop="remark" min-width="150" />
-      <el-table-column label="处理人" align="center" prop="manualOperatorId" width="100">
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        :formatter="dateFormatter"
+        width="180px"
+      />
+      <el-table-column label="处理人" align="center" prop="manualOperatorName" width="100">
        <template #default="scope">
-          <span v-if="scope.row.redeemed === 3">{{ scope.row.manualOperatorId || '-' }}</span>
+          <span v-if="scope.row.redeemed === 3">{{ scope.row.manualOperatorName || '-' }}</span>
          <span v-else>-</span>
        </template>
      </el-table-column>
      <el-table-column label="处理时间" align="center" prop="manualProcessTime" width="180">
        <template #default="scope">
-          <span v-if="scope.row.redeemed === 3">{{ scope.row.manualProcessTime ? formatDate(scope.row.manualProcessTime) : '-' }}</span>
+          <span v-if="scope.row.redeemed === 3 && scope.row.manualProcessTime">{{
+            formatDate(scope.row.manualProcessTime)
+          }}</span>
          <span v-else>-</span>
        </template>
      </el-table-column>
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        :formatter="dateFormatter"
-        width="180px"
-      />
    </el-table>
    <!-- 待充值列表 -->
-    <el-table v-loading="pendingLoading" :data="pendingList" :stripe="true" :show-overflow-tooltip="true" v-if="activeTab === 'pending'">
+    <el-table
-      <el-table-column label="用户名" align="center" prop="userMobile" />
+      v-loading="pendingLoading"
+      :data="pendingList"
+      :stripe="true"
+      :show-overflow-tooltip="true"
+      v-if="activeTab === 'pending'"
+    >
+      <el-table-column label="手机号" align="center" prop="userMobile" />
      <el-table-column label="充值金额" align="center" prop="amount">
        <template #default="{ row }">
          <span>¥{{ row.amount }}</span>
@@ -162,27 +195,17 @@
      <el-table-column label="交易流水号" align="center" prop="transactionId" min-width="180" />
      <el-table-column label="备注" align="center" prop="remark" min-width="150" />
      <el-table-column
-        label="操作"
-        align="center"
-        width="100"
-      >
-        <template #default="scope">
-          <el-button
-            type="primary"
-            link
-            @click="openManualDialog(scope.row)"
-          >
-            人工充值
-          </el-button>
-        </template>
-      </el-table-column>
-      <el-table-column
        label="创建时间"
        align="center"
        prop="createTime"
        :formatter="dateFormatter"
        width="180px"
      />
+      <el-table-column label="操作" align="center" width="100">
+        <template #default="scope">
+          <el-button type="primary" link @click="openManualDialog(scope.row)"> 人工充值 </el-button>
+        </template>
+      </el-table-column>
    </el-table>
    <!-- 分页 -->
@@ -205,14 +228,8 @@
  <!-- 人工充值弹窗 -->
  <Dialog v-model="dialogVisible" title="人工充值" width="400px">
    <el-form ref="formRef" :model="formData" :rules="formRules" label-width="100px">
-      <el-form-item label="充值记录ID">
+      <el-form-item label="充值金额">
-        <el-input v-model="formData.rechargeId" disabled />
+        <span>¥{{ formData.amount }}</span>
-      </el-form-item>
-      <el-form-item label="用户" prop="userMobile">
-        <el-input v-model="formData.userMobile" disabled />
-      </el-form-item>
-      <el-form-item label="充值金额" prop="amount">
-        <el-input v-model="formData.amount" disabled />
      </el-form-item>
      <el-form-item label="兑换码" prop="redemptionCode">
        <el-input v-model="formData.redemptionCode" placeholder="请输入兑换码" />
@@ -220,7 +237,9 @@
    </el-form>
    <template #footer>
      <el-button @click="dialogVisible = false">取 消</el-button>
-      <el-button type="primary" @click="handleManualRecharge" :loading="submitLoading">确 定</el-button>
+      <el-button type="primary" @click="handleManualRecharge" :loading="submitLoading"
+        >确 定</el-button
+      >
    </template>
  </Dialog>
 </template>
@@ -239,6 +258,7 @@ const list = ref<MemberRechargeRespVO[]>([])
 const pendingList = ref<MemberRechargeRespVO[]>([])
 const total = ref(0)
 const pendingTotal = ref(0)
+const pendingCount = ref(0)
 const dialogVisible = ref(false)
 const submitLoading = ref(false)
 const formRef = ref()
@@ -246,9 +266,10 @@ const formRef = ref()
 const queryParams = reactive({
  pageNo: 1,
  pageSize: 10,
-  userId: undefined,
+  userMobile: undefined,
  payChannel: undefined,
  payStatus: undefined,
+  redeemed: undefined,
  createTime: []
 })
@@ -261,7 +282,6 @@ const queryFormRef = ref()
 const formData = reactive({
  rechargeId: undefined as number | undefined,
-  userMobile: '',
  amount: '',
  redemptionCode: ''
 })
@@ -271,15 +291,28 @@ const formRules = {
 }
 /** 格式化日期时间 */
-const formatDate = (date: string) => {
+const formatDate = (date: any) => {
  if (!date) return '-'
+  if (typeof date === 'number') {
+    // 毫秒时间戳
+    const d = new Date(date)
+    const pad = (n: number) => n.toString().padStart(2, '0')
+    return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`
+  }
+  if (typeof date === 'string') {
    return date.substring(0, 19)
+  }
+  if (date instanceof Date) {
+    return date.toLocaleString()
+  }
+  return String(date)
 }
 /** Tab 切换 */
 const handleTabChange = (tab: string) => {
  if (tab === 'pending') {
    getPendingList()
+    getPendingCount()
  } else {
    getList()
  }
@@ -309,6 +342,17 @@ const getPendingList = async () => {
  }
 }
+/** 获取待充值数量 */
+const getPendingCount = async () => {
+  try {
+    const res = await MemberRechargeApi.getPendingCount()
+    pendingCount.value = res || 0
+    console.log('pendingCount.value', pendingCount.value, 'res.data', res)
+  } catch {
+    pendingCount.value = 0
+  }
+}
 /** 搜索按钮操作 */
 const handleQuery = () => {
  queryParams.pageNo = 1
@@ -323,9 +367,12 @@ const resetQuery = () => {
 /** 打开人工充值弹窗 */
 const openManualDialog = (row: MemberRechargeRespVO) => {
+  if (!row.id) {
+    ElMessage.error('充值记录ID无效')
+    return
+  }
  formData.rechargeId = row.id
-  formData.userMobile = row.userMobile || ''
+  formData.amount = row.amount ? `${row.amount}` : ''
-  formData.amount = row.amount ? `¥${row.amount}` : ''
  formData.redemptionCode = ''
  dialogVisible.value = true
 }
@@ -342,6 +389,7 @@ const handleManualRecharge = async () => {
    })
    dialogVisible.value = false
    getPendingList()
+    getPendingCount()
    ElMessage.success('人工充值处理成功')
  } finally {
    submitLoading.value = false
@@ -351,5 +399,6 @@ const handleManualRecharge = async () => {
 /** 初始化 */
 onMounted(() => {
  getList()
+  getPendingCount()
 })
 </script>