ChatGPT/FastGPT
1
0
Fork 0
mirror of https://github.com/labring/FastGPT.git synced 2026-05-08 01:08:43 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: ui (#6642)

Browse Source
This commit is contained in:
Archer
2026-03-25 18:49:55 +08:00
committed by GitHub
parent 0ce410d742
commit 064b2ce65d
2 changed files with 116 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/web/components/common/DateRangePicker/index.tsx
+79 -56
View File
@@ -89,70 +89,93 @@ const DateRangePicker = ({
<Card
position={'absolute'}
zIndex={1}
css={{
'--rdp-background-color': '#d6e8ff',
'--rdp-accent-color': '#0000ff'
}}
p={3}
{...(popPosition === 'top'
? {
bottom: '40px'
}
: {})}
>
<DayPicker
locale={zhCN}
id="test"
mode="range"
defaultMonth={defaultDate.to}
selected={range}
disabled={[
{ from: new Date(2022, 3, 1), to: addDays(new Date(), -180) },
{ from: addDays(new Date(), 1), to: new Date(2099, 1, 1) }
]}
onSelect={(date) => {
let typeDate = date as DateRangeType;
if (!typeDate || typeDate?.from === undefined) {
typeDate = {
from: range?.from,
to: range?.from
};
<Box
sx={{
'.rdp-day_button:hover:not(:disabled)': {
backgroundColor: '#E1EAFF'
},
'.rdp-range_start .rdp-day_button, .rdp-range_end .rdp-day_button': {
backgroundColor: '#3370FF',
color: 'white',
border: 'none'
},
'.rdp-range_start .rdp-day_button:hover, .rdp-range_end .rdp-day_button:hover': {
backgroundColor: '#2860E0'
},
'.rdp-button_previous:hover, .rdp-button_next:hover': {
backgroundColor: '#F0F4FF',
borderRadius: '6px'
}
if (typeDate?.to === undefined) {
typeDate.to = typeDate.from;
}
if (typeDate?.from) {
typeDate.from = new Date(typeDate.from.setHours(0, 0, 0, 0));
}
if (typeDate?.to) {
typeDate.to = new Date(typeDate.to.setHours(23, 59, 59, 999));
}
setRange(typeDate);
onChange?.(typeDate);
}}
footer={
<Flex justifyContent={'flex-end'}>
<Button
variant={'outline'}
size={'sm'}
mr={2}
onClick={() => setShowSelected(false)}
>
{t('common:Close')}
</Button>
<Button
size={'sm'}
onClick={() => {
onSuccess?.(range || defaultDate);
setShowSelected(false);
}}
>
{t('common:Confirm')}
</Button>
</Flex>
}
/>
>
<DayPicker
locale={zhCN}
id="test"
mode="range"
style={
{
'--rdp-accent-color': '#3370FF',
'--rdp-accent-background-color': '#E1EAFF'
} as React.CSSProperties
}
defaultMonth={defaultDate.to}
selected={range}
disabled={[
{ from: new Date(2022, 3, 1), to: addDays(new Date(), -180) },
{ from: addDays(new Date(), 1), to: new Date(2099, 1, 1) }
]}
onSelect={(date) => {
let typeDate = date as DateRangeType;
if (!typeDate || typeDate?.from === undefined) {
typeDate = {
from: range?.from,
to: range?.from
};
}
if (typeDate?.to === undefined) {
typeDate.to = typeDate.from;
}
if (typeDate?.from) {
typeDate.from = new Date(typeDate.from.setHours(0, 0, 0, 0));
}
if (typeDate?.to) {
typeDate.to = new Date(typeDate.to.setHours(23, 59, 59, 999));
}
setRange(typeDate);
onChange?.(typeDate);
}}
footer={
<Flex justifyContent={'flex-end'}>
<Button
variant={'outline'}
size={'sm'}
mr={2}
onClick={() => setShowSelected(false)}
>
{t('common:Close')}
</Button>
<Button
size={'sm'}
onClick={() => {
onSuccess?.(range || defaultDate);
setShowSelected(false);
}}
>
{t('common:Confirm')}
</Button>
</Flex>
}
/>
</Box>
</Card>
)}
</Box>