Browse Source

Enhance PlaymateBankApplyPage and PlaymateIdentityApplyPage with user rendering and new bank code field

- Replaced user number display with a UserBrief component for improved user information presentation in both PlaymateBankApplyPage and PlaymateIdentityApplyPage.
- Added a new "银行编码" field to the PlaymateBankApplyPage and updated the rendering logic to include bank code in the details view.
- Updated the PlaymateBankApplyAdminDTO interface to include the new bankCode property for better data management.
0es 1 month ago
parent
commit
44a8760811

+ 26 - 33
src/app/(dashboard)/playmate/bank-apply/page.tsx

@@ -24,6 +24,7 @@ import {
 import type { ColumnsType, TablePaginationConfig } from "antd/es/table";
 import type React from "react";
 import { useEffect, useState } from "react";
+import UserBrief from "@/components/UserBrief";
 import {
   approvePlaymateBankApply,
   getPlaymateBankApplyPage,
@@ -186,38 +187,18 @@ const PlaymateBankApplyPage: React.FC = () => {
 
   const columns: ColumnsType<PlaymateBankApplyAdminDTO> = [
     {
-      title: "用户编号",
-      dataIndex: "userNo",
-      key: "userNo",
-      width: 150,
+      title: "用户",
+      key: "user",
+      width: 260,
       fixed: "left",
-      render: (v) => v || "-",
-    },
-    {
-      title: "头像",
-      dataIndex: "avatar",
-      key: "avatar",
-      width: 90,
-      render: (v?: string) =>
-        v ? (
-          <Image
-            src={v}
-            alt="avatar"
-            width={40}
-            height={40}
-            style={{ borderRadius: "50%", objectFit: "cover" }}
-            preview
-          />
-        ) : (
-          "-"
-        ),
-    },
-    {
-      title: "昵称",
-      dataIndex: "nickname",
-      key: "nickname",
-      width: 160,
-      render: (v) => v || "-",
+      render: (_: unknown, record: PlaymateBankApplyAdminDTO) => (
+        <UserBrief
+          avatar={record.avatar}
+          nickname={record.nickname}
+          userNo={record.userNo}
+          size={40}
+        />
+      ),
     },
     {
       title: "姓名",
@@ -233,6 +214,13 @@ const PlaymateBankApplyPage: React.FC = () => {
       width: 160,
       render: (v) => v || "-",
     },
+    {
+      title: "银行编码",
+      dataIndex: "bankCode",
+      key: "bankCode",
+      width: 120,
+      render: (v) => v || "-",
+    },
     {
       title: "银行卡号",
       dataIndex: "bankNo",
@@ -379,7 +367,7 @@ const PlaymateBankApplyPage: React.FC = () => {
             pageSizeOptions: ["10", "20", "30", "40", "50", "100", "200"],
           }}
           onChange={handleTableChange}
-          scroll={{ x: 1900 }}
+          scroll={{ x: 2020 }}
           size="small"
           bordered
         />
@@ -459,6 +447,9 @@ const PlaymateBankApplyPage: React.FC = () => {
               <Descriptions.Item label="银行名称">
                 {currentRecord.bankName || "-"}
               </Descriptions.Item>
+              <Descriptions.Item label="银行编码">
+                {currentRecord.bankCode || "-"}
+              </Descriptions.Item>
               <Descriptions.Item label="银行卡号" span={2}>
                 {currentRecord.bankNo || "-"}
               </Descriptions.Item>
@@ -511,7 +502,9 @@ const PlaymateBankApplyPage: React.FC = () => {
               </div>
               <div>
                 <span className="font-medium">银行卡:</span>
-                {currentRecord.bankName || "-"} {currentRecord.bankNo || "-"}
+                {currentRecord.bankName || "-"}
+                {currentRecord.bankCode ? ` (${currentRecord.bankCode})` : ""}{" "}
+                {currentRecord.bankNo || "-"}
               </div>
             </div>
           )}

+ 12 - 31
src/app/(dashboard)/playmate/identity-apply/page.tsx

@@ -24,6 +24,7 @@ import {
 import type { ColumnsType, TablePaginationConfig } from "antd/es/table";
 import type React from "react";
 import { useEffect, useMemo, useState } from "react";
+import UserBrief from "@/components/UserBrief";
 import {
   approvePlaymateIdentityApply,
   getPlaymateIdentityApplyPage,
@@ -203,38 +204,18 @@ const PlaymateIdentityApplyPage: React.FC = () => {
 
   const columns: ColumnsType<PlaymateIdentityApplyAdminDTO> = [
     {
-      title: "用户编号",
-      dataIndex: "userNo",
-      key: "userNo",
-      width: 150,
+      title: "用户",
+      key: "user",
+      width: 260,
       fixed: "left",
-      render: (v) => v || "-",
-    },
-    {
-      title: "头像",
-      dataIndex: "avatar",
-      key: "avatar",
-      width: 90,
-      render: (v?: string) =>
-        v ? (
-          <Image
-            src={v}
-            alt="avatar"
-            width={40}
-            height={40}
-            style={{ borderRadius: "50%", objectFit: "cover" }}
-            preview
-          />
-        ) : (
-          "-"
-        ),
-    },
-    {
-      title: "昵称",
-      dataIndex: "nickname",
-      key: "nickname",
-      width: 160,
-      render: (v) => v || "-",
+      render: (_: unknown, record: PlaymateIdentityApplyAdminDTO) => (
+        <UserBrief
+          avatar={record.avatar}
+          nickname={record.nickname}
+          userNo={record.userNo}
+          size={40}
+        />
+      ),
     },
     {
       title: "真实姓名",

+ 4 - 0
src/types/api/playmateBankApply.ts

@@ -47,6 +47,10 @@ export interface PlaymateBankApplyAdminDTO {
   bankNo?: string;
   realName?: string;
   bankName?: string;
+  /**
+   * Bank code (e.g. ICBC, ABC)
+   */
+  bankCode?: string;
   phoneNum?: string;
   phoneCode?: string;
 }