zksu
/
WEB
forked from yoone/WEB
1
0
Fork 0

Compare commits

..

2 Commits

Author SHA1 Message Date
tikkhun 2467a0c3b2 refactor: 提取站点相关逻辑到自定义hook并优化类型定义
将多处重复的站点数据获取和处理的逻辑提取到自定义hook useSites中
修改origin_id类型为string以匹配实际使用场景
移除调试用的console.log语句
为用户名字段添加可复制功能
2026-01-05 16:31:08 +08:00
tikkhun 5471f7a038 fix: 修复账单地址显示问题并优化表格列配置
修复账单地址显示为仅state的问题,改为显示完整地址信息
优化多个页面的表格列配置和请求参数处理
移除Product列表页的展开行功能
添加批量操作按钮和错误处理逻辑
2026-01-05 15:36:35 +08:00
7 changed files with 132 additions and 55 deletions

92
src/hooks/useSites.ts Normal file
View File

@ -0,0 +1,92 @@
import { useState, useEffect } from 'react';
import { sitecontrollerAll } from '@/servers/api/site';
// 站点数据的类型定义
interface Site {
id: number;
name: string;
[key: string]: any;
}
// 自定义 Hook管理站点数据
const useSites = () => {
// 添加站点数据状态
const [sites, setSites] = useState<Site[]>([]);
// 添加加载状态
const [loading, setLoading] = useState<boolean>(false);
// 添加错误状态
const [error, setError] = useState<string | null>(null);
// 获取站点数据
const fetchSites = async () => {
// 设置加载状态为 true
setLoading(true);
// 清空之前的错误信息
setError(null);
try {
// 调用 API 获取所有站点数据
const { data, success } = await sitecontrollerAll();
// 判断请求是否成功
if (success) {
// 将站点数据保存到状态中
setSites(data || []);
} else {
// 如果请求失败,设置错误信息
setError('获取站点数据失败');
}
} catch (error) {
// 捕获异常并打印错误日志
console.error('获取站点数据失败:', error);
// 设置错误信息
setError('获取站点数据时发生错误');
} finally {
// 无论成功与否,都将加载状态设置为 false
setLoading(false);
}
};
// 根据站点ID获取站点名称
const getSiteName = (siteId: number | undefined | null) => {
// 如果站点ID不存在返回默认值
if (!siteId) return '-';
// 如果站点ID是字符串类型直接返回
if (typeof siteId === 'string') {
return siteId;
}
// 在站点列表中查找对应的站点
const site = sites.find((s) => s.id === siteId);
// 如果找到站点返回站点名称否则返回站点ID的字符串形式
return site ? site.name : String(siteId);
};
// 根据站点ID获取站点对象
const getSiteById = (siteId: number | undefined | null) => {
// 如果站点ID不存在返回 null
if (!siteId) return null;
// 在站点列表中查找对应的站点
const site = sites.find((s) => s.id === siteId);
// 返回找到的站点对象,如果找不到则返回 null
return site || null;
};
// 组件加载时获取站点数据
useEffect(() => {
// 调用获取站点数据的函数
fetchSites();
}, []); // 空依赖数组表示只在组件挂载时执行一次
// 返回站点数据和相关方法
return {
sites, // 站点数据列表
loading, // 加载状态
error, // 错误信息
fetchSites, // 重新获取站点数据的方法
getSiteName, // 根据ID获取站点名称的方法
getSiteById, // 根据ID获取站点对象的方法
};
};
// 导出 useSites Hook
export default useSites;

View File

@ -115,34 +115,7 @@ const CustomerList: React.FC = () => {
const actionRef = useRef<ActionType>(); const actionRef = useRef<ActionType>();
const { message } = App.useApp(); const { message } = App.useApp();
const [syncModalVisible, setSyncModalVisible] = useState(false); const [syncModalVisible, setSyncModalVisible] = useState(false);
const [sites, setSites] = useState<any[]>([]); // 添加站点数据状态
// 获取站点数据
const fetchSites = async () => {
try {
const { data, success } = await sitecontrollerAll();
if (success) {
setSites(data || []);
}
} catch (error) {
console.error('获取站点数据失败:', error);
}
};
// 根据站点ID获取站点名称
const getSiteName = (siteId: number | undefined | null) => {
if (!siteId) return '-';
if (typeof siteId === 'string') {
return siteId;
}
const site = sites.find((s) => s.id === siteId);
return site ? site.name : String(siteId);
};
// 组件加载时获取站点数据
useEffect(() => {
fetchSites();
}, []);
const columns: ProColumns<API.GetCustomerDTO>[] = [ const columns: ProColumns<API.GetCustomerDTO>[] = [
{ {
@ -204,8 +177,8 @@ const CustomerList: React.FC = () => {
}, },
{ {
title: '用户名', title: '用户名',
dataIndex: 'username', dataIndex: 'username',
hideInSearch: true, copyable: true,
sorter: true, sorter: true,
}, },
{ {
@ -223,6 +196,7 @@ const CustomerList: React.FC = () => {
title: '账单地址', title: '账单地址',
dataIndex: 'billing', dataIndex: 'billing',
hideInSearch: true, hideInSearch: true,
width: 200, width: 200,
render: (billing) => <AddressCell address={billing} title="账单地址" />, render: (billing) => <AddressCell address={billing} title="账单地址" />,
}, },
@ -236,7 +210,6 @@ const CustomerList: React.FC = () => {
{ {
title: '评分', title: '评分',
dataIndex: 'rate', dataIndex: 'rate',
width: 120,
hideInSearch: true, hideInSearch: true,
sorter: true, sorter: true,
render: (_, record) => { render: (_, record) => {
@ -343,6 +316,7 @@ const CustomerList: React.FC = () => {
scroll={{ x: 'max-content' }} scroll={{ x: 'max-content' }}
headerTitle="查询表格" headerTitle="查询表格"
actionRef={actionRef} actionRef={actionRef}
columns={columns}
rowKey="id" rowKey="id"
request={async (params, sorter,filter) => { request={async (params, sorter,filter) => {
console.log('custoemr request',params, sorter,filter) console.log('custoemr request',params, sorter,filter)
@ -370,7 +344,7 @@ const CustomerList: React.FC = () => {
success: true, success: true,
}; };
}} }}
columns={columns}
search={{ search={{
labelWidth: 'auto', labelWidth: 'auto',
span: 6, span: 6,

View File

@ -137,7 +137,7 @@ const ListPage: React.FC = () => {
{ {
title: '账单地址', title: '账单地址',
dataIndex: 'billing', dataIndex: 'billing',
render: (_, record) => record?.billing.state || record?.shipping.state, render: (_, record) => JSON.stringify(record?.billing || record?.shipping),
}, },
{ {
title: '标签', title: '标签',

View File

@ -189,11 +189,20 @@ const ListPage: React.FC = () => {
dataIndex: 'siteId', dataIndex: 'siteId',
valueType: 'select', valueType: 'select',
request: async () => { request: async () => {
const { data = [] } = await sitecontrollerAll(); try {
return data.map((item) => ({ const result = await sitecontrollerAll();
label: item.name, const {success, data}= result
value: item.id, if (success && data) {
})); return data.map((site: any) => ({
label: site.name,
value: site.id,
}));
}
return [];
} catch (error) {
console.error('获取站点列表失败:', error);
return [];
}
}, },
}, },
{ {

View File

@ -492,9 +492,12 @@ const List: React.FC = () => {
sortField = field; sortField = field;
sortOrder = sort[field]; sortOrder = sort[field];
} }
const {current,pageSize,...where} = params
console.log(`params`,params)
const { data, success } = await productcontrollerGetproductlist({ const { data, success } = await productcontrollerGetproductlist({
...params, where,
page: current || 1,
per_page: pageSize || 10,
sortField, sortField,
sortOrder, sortOrder,
} as any); } as any);
@ -505,17 +508,17 @@ const List: React.FC = () => {
}; };
}} }}
columns={columns} columns={columns}
expandable={{ // expandable={{
expandedRowRender: (record) => ( // expandedRowRender: (record) => (
<SiteProductInfo // <SiteProductInfo
skus={(record.siteSkus as string[]) || []} // skus={(record.siteSkus as string[]) || []}
record={record} // record={record}
parentTableRef={actionRef} // parentTableRef={actionRef}
/> // />
), // ),
rowExpandable: (record) => // rowExpandable: (record) =>
!!(record.siteSkus && record.siteSkus.length > 0), // !!(record.siteSkus && record.siteSkus.length > 0),
}} // }}
editable={{ editable={{
type: 'single', type: 'single',
onSave: async (key, record, originRow) => { onSave: async (key, record, originRow) => {

View File

@ -62,11 +62,10 @@ const OrdersPage: React.FC = () => {
return [{ key: 'all', label: `全部(${total})` }, ...tabs]; return [{ key: 'all', label: `全部(${total})` }, ...tabs];
}, [count]); }, [count]);
const columns: ProColumns<API.Order>[] = [ const columns: ProColumns<API.UnifiedOrderDTO>[] = [
{ {
title: '订单号', title: '订单号',
dataIndex: 'id', dataIndex: 'id',
hideInSearch: true,
}, },
{ {
title: '状态', title: '状态',
@ -97,7 +96,6 @@ const OrdersPage: React.FC = () => {
{ {
title: '客户姓名', title: '客户姓名',
dataIndex: 'customer_name', dataIndex: 'customer_name',
hideInSearch: true,
}, },
{ {
title: '商品', title: '商品',
@ -129,7 +127,6 @@ const OrdersPage: React.FC = () => {
}, },
{ {
title: '联系电话', title: '联系电话',
hideInSearch: true,
render: (_, record) => record.shipping?.phone || record.billing?.phone, render: (_, record) => record.shipping?.phone || record.billing?.phone,
}, },
{ {
@ -319,6 +316,8 @@ const OrdersPage: React.FC = () => {
setSelectedRowKeys={setSelectedRowKeys} setSelectedRowKeys={setSelectedRowKeys}
siteId={siteId} siteId={siteId}
/>, />,
<Button disabled></Button>
,
<Button <Button
title="批量删除" title="批量删除"
danger danger

View File

@ -213,7 +213,7 @@ declare namespace API {
/** 站点ID */ /** 站点ID */
site_id?: number; site_id?: number;
/** 原始ID */ /** 原始ID */
origin_id?: number; origin_id?: string;
/** 邮箱 */ /** 邮箱 */
email?: string; email?: string;
/** 名字 */ /** 名字 */