feat: 修改样式

This commit is contained in:
2025-08-13 05:20:51 -07:00
parent a918cdab68
commit 1b9e97ab3c
17 changed files with 52 additions and 48 deletions
@@ -26,14 +26,14 @@ interface PaginationProps<TData> {
export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
return (
<div className='flex flex-wrap items-center justify-between gap-2'>
<div className='text-muted-foreground flex-1 whitespace-nowrap text-center sm:text-left'>
<div className='flex flex-wrap items-center justify-center gap-2'>
<div className='whitespace-nowrap text-center text-[15px] text-[#666]'>
{text?.textPageOf?.(table.getState().pagination.pageIndex + 1, table.getPageCount()) ||
`Page ${table.getState().pagination.pageIndex + 1} of ${table.getPageCount()}`}
</div>
<div className='flex flex-grow items-center justify-center gap-2 sm:justify-end'>
<div className='flex items-center space-x-2'>
<p className='font-medium'>{text?.textRowsPerPage || 'Rows per page'}</p>
<div className='ml-[34px] flex items-center justify-center gap-3'>
{/*<div className='flex items-center space-x-2'>
<p className='font-medium'>{text?.textRowsPerPage || 'Rows per page'}</p>
<Select
value={`${table.getState().pagination.pageSize}`}
onValueChange={(value) => {
@@ -51,11 +51,11 @@ export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
))}
</SelectContent>
</Select>
</div>
</div>*/}
<Button
variant='outline'
size='icon'
className='hidden lg:flex'
className='h-[30px] w-[30px] rounded-full bg-[#EAEAEA] text-[#848484]'
onClick={() => table.setPageIndex(0)}
disabled={!table.getCanPreviousPage()}
>
@@ -64,6 +64,7 @@ export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
</Button>
<Button
variant='outline'
className='h-[30px] w-[30px] rounded-full bg-[#EAEAEA] text-[#848484]'
size='icon'
onClick={() => table.previousPage()}
disabled={!table.getCanPreviousPage()}
@@ -75,8 +76,8 @@ export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
value={`${table.getState().pagination.pageIndex + 1}`}
onValueChange={(value) => table.setPageIndex(Number(value) - 1)}
>
<SelectTrigger className='w-[70px]'>
<SelectValue placeholder='Select page number' />
<SelectTrigger className='h-[30px] w-[70px] rounded-full bg-[#EAEAEA] text-[#848484]'>
<SelectValue placeholder='Select page number' className={''} />
</SelectTrigger>
<SelectContent className='w-12'>
{Array.from({ length: table.getPageCount() }, (_, i) => (
@@ -88,6 +89,7 @@ export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
</Select>
<Button
variant='outline'
className='h-[30px] w-[30px] rounded-full bg-[#EAEAEA] text-[#848484]'
size='icon'
onClick={() => table.nextPage()}
disabled={!table.getCanNextPage()}
@@ -98,7 +100,7 @@ export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
<Button
variant='outline'
size='icon'
className='hidden lg:flex'
className='h-[30px] w-[30px] rounded-full bg-[#EAEAEA] text-[#848484]'
onClick={() => table.setPageIndex(table.getPageCount() - 1)}
disabled={!table.getCanNextPage()}
>
@@ -171,7 +171,7 @@ export function ProList<TData, TValue extends Record<string, unknown>>({
)}
<div
className={cn('relative overflow-x-auto', {
className={cn('relative', {
'rounded-xl border': data.length === 0,
})}
>