调优化供应商用户列表的请求接口和加载状态处理。

This commit is contained in:
刘倡
2025-08-05 17:39:05 +08:00
parent 6eaf1c7397
commit b06c637ec4
5 changed files with 105 additions and 59 deletions

View File

@ -23,12 +23,18 @@ const Index: React.FC<{}> = () => {
{
title: '组织名称',
dataIndex: 'orgName',
width: '45%',
width: '35%',
},
{
title: '组织全称',
dataIndex: 'orgFullName',
width: '40%',
width: '30%',
hideInSearch: true,
},
{
title: '公司级别',
dataIndex: 'companyLevelText',
width: '25%',
hideInSearch: true,
},
{
@ -132,6 +138,12 @@ const Index: React.FC<{}> = () => {
<Form.Item label="组织编码" name="orgNum" rules={[{ required: true }]}>
<Input />
</Form.Item>
<Form.Item label="公司级别代码" name="companyLevelCode">
<Input placeholder="请输入公司级别代码" />
</Form.Item>
<Form.Item label="公司级别名称" name="companyLevelText">
<Input placeholder="请输入公司级别名称" />
</Form.Item>
</Form>
</Modal>
);

View File

@ -103,6 +103,7 @@ const LoginLog: React.FC = () => {
title: '登录IP',
dataIndex: 'loginIp',
width: 140,
search: false,
ellipsis: true,
render: (text) => (
<Tooltip title={text}>
@ -114,6 +115,7 @@ const LoginLog: React.FC = () => {
title: '登录状态',
dataIndex: 'loginStatus',
width: 100,
search: false,
valueType: 'select',
valueEnum: {
1: { text: '成功' },
@ -129,6 +131,7 @@ const LoginLog: React.FC = () => {
title: '登录方式',
dataIndex: 'loginType',
width: 100,
search: false,
valueType: 'select',
valueEnum: {
'PASSWORD': { text: '密码登录' },
@ -271,8 +274,8 @@ const LoginLog: React.FC = () => {
// 构建查询参数
const buildQueryParams = (params: any): LoginLogQueryParams => {
const basePageRequest: BasePageRequest = {
current: params.current || 1,
size: params.pageSize || 10,
pageNo: params.current || 1,
pageSize: params.pageSize || 10,
};
const queryParams: LoginLogQueryParams = {

View File

@ -4,8 +4,8 @@
// 基础分页请求
export interface BasePageRequest {
current: number; // 当前页码
size: number; // 每页大小
pageNo: number; // 当前页码
pageSize: number; // 每页大小
}
// 登录日志查询参数

View File

@ -1,5 +1,5 @@
import { PlusOutlined } from '@ant-design/icons';
import { Button, message, Popconfirm } from 'antd';
import { Button, message, Popconfirm, Spin } from 'antd';
import React, { useState, useRef, useEffect } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import type { ProColumns, ActionType } from '@ant-design/pro-table';
@ -7,11 +7,19 @@ import ProTable from '@ant-design/pro-table';
import type { SupplierUserListItem } from './data.d';
import { getSupplierUserList, updateSupplierUser, resetPassword } from './service';
import UpdateForm from './components/UpdateForm';
import tableProps from '@/utils/tableProps';
import '@/assets/xsy_style.less';
const SupplierUser: React.FC = () => {
const actionRef = useRef<ActionType>();
const [updateModalVisible, handleUpdateModalVisible] = useState<boolean>(false);
const [formValues, setFormValues] = useState({});
const [spin, spinSet] = useState<boolean>(false);
//查询分页数据
const [pageData, pageDataSet] = useState<any>({
pageNo: 1,
pageSize: 10
});
// 从URL查询参数获取并保存必要的参数
useEffect(() => {
@ -77,28 +85,33 @@ const SupplierUser: React.FC = () => {
};
const columns: ProColumns<SupplierUserListItem>[] = [
{ title: '序号', valueType: 'index', width: 50, },
{
title: '用户名',
dataIndex: 'username',
sorter: true,
},
{
title: '名',
title: '名',
dataIndex: 'name',
sorter: true,
},
{
title: '供应商名称',
dataIndex: 'supplierName',
search: false,
hideInTable: true,
sorter: true,
},
{
title: '统一信用代码',
dataIndex: 'creditCode',
search: false,
},
{
title: '手机号',
dataIndex: 'mobile',
search: false,
},
{
title: '状态',
@ -112,66 +125,78 @@ const SupplierUser: React.FC = () => {
title: '操作',
dataIndex: 'option',
valueType: 'option',
width: '15%',
render: (_, record) => [
<a
key="config"
onClick={() => {
handleUpdateModalVisible(true);
setFormValues(record);
}}
>
<Button type='text' key="config" onClick={() => {
handleUpdateModalVisible(true);
setFormValues(record);
}}>
</a>,
</Button>,
<Popconfirm
title="确认重置该用户的密码?"
onConfirm={() => handleResetPassword(record.username)}
key="reset"
>
<a></a>
<Button type='text'></Button>
</Popconfirm>,
],
},
];
return (
<PageContainer>
<ProTable<SupplierUserListItem>
headerTitle="供应商用户列表"
actionRef={actionRef}
rowKey="userId"
search={{
labelWidth: 120,
}}
request={(params) =>
getSupplierUserList(params).then((res) => {
return {
data: res.data.records,
success: true,
total: res.data.total,
};
})
}
columns={columns}
/>
<UpdateForm
onSubmit={async (value) => {
const success = await handleUpdate(value);
if (success) {
<Spin spinning={spin}>
<div style={{ maxHeight: innerHeight - 130, height: innerHeight - 130 }} className='xsy-entrust bgCWhite'>
<ProTable<SupplierUserListItem>
actionRef={actionRef}
rowKey="userId"
columns={columns}
options={false}
bordered={false}
className='tableSearch'
size='small'
search={{ labelWidth: 'auto', span: 6 }}
request={(params) =>
getSupplierUserList({
...params,
}).then((res) => {
const result = {
data: res.data.records,
total: res.data.total,
success: res.success,
pageSize: res.data.size,
current: res.data.current
}
return result;
})
}
pagination={{
...tableProps.pagination,
onChange: (page, pageSize) => pageDataSet({ pageNo: page, pageSize: pageSize }),
onShowSizeChange: (current, size) => pageDataSet({ pageNo: current, pageSize: size }),
}}
onReset={() => { pageDataSet({ pageNo: 1, pageSize: 10 }) }}
/>
<UpdateForm
onSubmit={async (value) => {
const success = await handleUpdate(value);
if (success) {
handleUpdateModalVisible(false);
setFormValues({});
if (actionRef.current) {
actionRef.current.reload();
}
}
}}
onCancel={() => {
handleUpdateModalVisible(false);
setFormValues({});
if (actionRef.current) {
actionRef.current.reload();
}
}
}}
onCancel={() => {
handleUpdateModalVisible(false);
setFormValues({});
}}
updateModalVisible={updateModalVisible}
values={formValues}
/>
</PageContainer>
}}
updateModalVisible={updateModalVisible}
values={formValues}
/>
</div>
</Spin>
);
};

View File

@ -2,22 +2,28 @@ import request from '@/utils/request';
import type { SupplierUserListItem, TableListParams } from './data.d';
export async function getSupplierUserList(params: TableListParams) {
return request('/sys/supplier/user/list', {
method: 'GET',
params,
return request('/api/sys-manager-ebtp-project/v1/supplieruser/getPage', {
method: 'POST',
data: {
...params,
basePageRequest: {
pageNo: params.current || 1,
pageSize: params.pageSize || 10,
},
},
});
}
export async function updateSupplierUser(params: SupplierUserListItem) {
return request('/sys/supplier/user/update', {
return request('/api/sys-manager-ebtp-project/v1/supplieruser/update', {
method: 'POST',
data: params,
});
}
export async function resetPassword(username: string) {
return request('/sys/supplier/user/reset-password', {
return request('/api/sys-manager-ebtp-project/v1/supplieruser/resetPassword', {
method: 'POST',
data: { username },
params: { username },
});
}