schiwagoa/tianji
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: fix a style bug which survey table too width and broke style

Browse Source
This commit is contained in:
moonrailgun 2024-06-08 14:14:26 +08:00
parent ef49d9ebd2
commit 1c98cf5c7d
2 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/client/components/DataTable.tsx
View File

@ -75,7 +75,7 @@ export function DataTable<TData>({
{headerGroup.headers.map((header) => { {headerGroup.headers.map((header) => {
return ( return (
<TableHead key={header.id}> <TableHead key={header.id} className="text-nowrap">
{header.isPlaceholder {header.isPlaceholder
? null ? null
: flexRender( : flexRender(

13
src/client/routes/survey/$surveyId/index.tsx
View File

@ -21,6 +21,7 @@ import { useMemo } from 'react';
import { SurveyDownloadBtn } from '@/components/survey/SurveyDownloadBtn'; import { SurveyDownloadBtn } from '@/components/survey/SurveyDownloadBtn';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import { SurveyUsageBtn } from '@/components/survey/SurveyUsageBtn'; import { SurveyUsageBtn } from '@/components/survey/SurveyUsageBtn';
import { Scrollbar } from '@radix-ui/react-scroll-area';
type SurveyResultItem = type SurveyResultItem =
AppRouterOutput['survey']['resultList']['items'][number]; AppRouterOutput['survey']['resultList']['items'][number];
@ -122,10 +123,8 @@ function PageComponent() {
/> />
} }
> >
<ScrollArea className="h-full overflow-hidden p-4"> <div className="h-full overflow-hidden p-4">
<ScrollBar orientation="horizontal" /> <div className="mb-4 w-full">
<div className="mb-4">
<Card> <Card>
<CardHeader> <CardHeader>
<CardTitle>{t('Count')}</CardTitle> <CardTitle>{t('Count')}</CardTitle>
@ -140,10 +139,12 @@ function PageComponent() {
</Card> </Card>
</div> </div>
<div> <ScrollArea className="w-full">
<Scrollbar orientation="horizontal" />
<DataTable columns={columns} data={dataSource} /> <DataTable columns={columns} data={dataSource} />
</div>
</ScrollArea> </ScrollArea>
</div>
</CommonWrapper> </CommonWrapper>
); );
} }