Pivot menüsü
This commit is contained in:
parent
cd67bd2b06
commit
1c93a7acb9
1 changed files with 100 additions and 82 deletions
|
|
@ -32,8 +32,8 @@ import {
|
||||||
} from './Utils'
|
} from './Utils'
|
||||||
import { useFilters } from './useFilters'
|
import { useFilters } from './useFilters'
|
||||||
import WidgetGroup from '@/components/common/WidgetGroup'
|
import WidgetGroup from '@/components/common/WidgetGroup'
|
||||||
import { Button, Notification, toast } from '@/components/ui'
|
import { Button, Dropdown, Notification, toast } from '@/components/ui'
|
||||||
import { FaCog, FaSave, FaTimes, FaUndo } from 'react-icons/fa'
|
import { FaChevronDown, FaCog, FaEllipsisV, FaSave, FaTimes, FaUndo } from 'react-icons/fa'
|
||||||
import { usePermission } from '@/utils/hooks/usePermission'
|
import { usePermission } from '@/utils/hooks/usePermission'
|
||||||
import { ROUTES_ENUM } from '@/routes/route.constant'
|
import { ROUTES_ENUM } from '@/routes/route.constant'
|
||||||
import { usePWA } from '@/utils/hooks/usePWA'
|
import { usePWA } from '@/utils/hooks/usePWA'
|
||||||
|
|
@ -422,89 +422,107 @@ const Pivot = (props: PivotProps) => {
|
||||||
{gridDto && columnData && (
|
{gridDto && columnData && (
|
||||||
<div className="p-1 bg-white dark:bg-neutral-800 dark:border-neutral-700 ">
|
<div className="p-1 bg-white dark:bg-neutral-800 dark:border-neutral-700 ">
|
||||||
<div className="flex justify-end items-center">
|
<div className="flex justify-end items-center">
|
||||||
<div className="relative pb-1 flex gap-1 border-b-1">
|
<div className="relative flex gap-1">
|
||||||
<label className="flex items-center gap-2 text-sm px-2 cursor-pointer">
|
<label className="flex items-center gap-1 text-xs cursor-pointer">
|
||||||
<Checkbox
|
<span>{translate('::ListForms.ListFormEdit.ShowChart')}</span>
|
||||||
checked={showChart}
|
<Checkbox checked={showChart} onChange={(checked) => setShowChart(checked)} />
|
||||||
onChange={(checked) => setShowChart(checked)}
|
|
||||||
/>
|
|
||||||
<span>{translate('::ListForms.ListFormEdit.ShowChart') || 'Grafik'}</span>
|
|
||||||
</label>
|
</label>
|
||||||
|
<div className="dx-menu">
|
||||||
<Button
|
<Dropdown
|
||||||
size="xs"
|
placement="bottom-end"
|
||||||
variant={'default'}
|
renderTitle={
|
||||||
className="text-sm flex items-center gap-1"
|
<Button
|
||||||
onClick={clearPivotFilters}
|
size="xs"
|
||||||
title={translate('::ListForms.ListForm.RemoveFilter')}
|
variant={'default'}
|
||||||
>
|
className="text-sm flex items-center gap-1 border-0"
|
||||||
<FaTimes className="w-3 h-3" /> {translate('::ListForms.ListForm.RemoveFilter')}
|
title="Menu"
|
||||||
</Button>
|
>
|
||||||
|
<i className="dx-icon dx-icon-overflow"></i>
|
||||||
<Button
|
<span>{translate('::ListForms.ListForm.GridMenu')}</span>
|
||||||
size="xs"
|
<FaChevronDown className="w-2 h-2" />
|
||||||
variant={'default'}
|
</Button>
|
||||||
className="text-sm flex items-center gap-1"
|
|
||||||
onClick={() => {
|
|
||||||
const instance = gridRef.current?.instance()
|
|
||||||
if (instance) {
|
|
||||||
const ds = instance.getDataSource()
|
|
||||||
if (ds && typeof ds.state === 'function') {
|
|
||||||
const currentState = ds.state()
|
|
||||||
customSaveState(currentState)
|
|
||||||
.then(() => {
|
|
||||||
toast.push(
|
|
||||||
<Notification type="success" duration={2000}>
|
|
||||||
{translate('::ListForms.ListForm.GridStateSaved')}
|
|
||||||
</Notification>,
|
|
||||||
{ placement: 'top-end' },
|
|
||||||
)
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
toast.push(
|
|
||||||
<Notification type="danger" duration={2500}>
|
|
||||||
{translate('::ListForms.ListForm.GridStateSaveError')}
|
|
||||||
</Notification>,
|
|
||||||
{ placement: 'top-end' },
|
|
||||||
)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}}
|
|
||||||
title={translate('::ListForms.ListForm.SaveGridState')}
|
|
||||||
>
|
|
||||||
<FaSave className="w-3 h-3" /> {translate('::ListForms.ListForm.SaveGridState')}
|
|
||||||
</Button>
|
|
||||||
|
|
||||||
<Button
|
|
||||||
size="xs"
|
|
||||||
variant={'default'}
|
|
||||||
className="text-sm flex items-center gap-1"
|
|
||||||
onClick={resetPivotGridState}
|
|
||||||
title={translate('::ListForms.ListForm.ResetGridState')}
|
|
||||||
>
|
|
||||||
<FaUndo className="w-3 h-3" /> {translate('::ListForms.ListForm.ResetGridState')}
|
|
||||||
</Button>
|
|
||||||
|
|
||||||
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
|
|
||||||
<Button
|
|
||||||
size="xs"
|
|
||||||
variant={'default'}
|
|
||||||
className="text-sm"
|
|
||||||
onClick={() => {
|
|
||||||
window.open(
|
|
||||||
ROUTES_ENUM.protected.saas.listFormManagement.edit.replace(
|
|
||||||
':listFormCode',
|
|
||||||
listFormCode,
|
|
||||||
),
|
|
||||||
isPwaMode ? '_self' : '_blank',
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
title={translate('::ListForms.ListForm.Manage')}
|
|
||||||
>
|
>
|
||||||
<FaCog className="w-3 h-3" />
|
<Dropdown.Item
|
||||||
</Button>
|
eventKey="removeFilter"
|
||||||
)}
|
onClick={clearPivotFilters}
|
||||||
|
className="px-2"
|
||||||
|
>
|
||||||
|
<span className="flex items-center gap-2">
|
||||||
|
<FaTimes className="w-3 h-3" />
|
||||||
|
<span>{translate('::ListForms.ListForm.RemoveFilter')}</span>
|
||||||
|
</span>
|
||||||
|
</Dropdown.Item>
|
||||||
|
|
||||||
|
<Dropdown.Item
|
||||||
|
eventKey="saveGridState"
|
||||||
|
onClick={() => {
|
||||||
|
const instance = gridRef.current?.instance()
|
||||||
|
if (instance) {
|
||||||
|
const ds = instance.getDataSource()
|
||||||
|
if (ds && typeof ds.state === 'function') {
|
||||||
|
const currentState = ds.state()
|
||||||
|
customSaveState(currentState)
|
||||||
|
.then(() => {
|
||||||
|
toast.push(
|
||||||
|
<Notification type="success" duration={2000}>
|
||||||
|
{translate('::ListForms.ListForm.GridStateSaved')}
|
||||||
|
</Notification>,
|
||||||
|
{ placement: 'top-end' },
|
||||||
|
)
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
toast.push(
|
||||||
|
<Notification type="danger" duration={2500}>
|
||||||
|
{translate('::ListForms.ListForm.GridStateSaveError')}
|
||||||
|
</Notification>,
|
||||||
|
{ placement: 'top-end' },
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
className="px-2"
|
||||||
|
>
|
||||||
|
<span className="flex items-center gap-2">
|
||||||
|
<FaSave className="w-3 h-3" />
|
||||||
|
<span>{translate('::ListForms.ListForm.SaveGridState')}</span>
|
||||||
|
</span>
|
||||||
|
</Dropdown.Item>
|
||||||
|
|
||||||
|
<Dropdown.Item
|
||||||
|
eventKey="resetGridState"
|
||||||
|
onClick={resetPivotGridState}
|
||||||
|
className="px-2"
|
||||||
|
>
|
||||||
|
<span className="flex items-center gap-2">
|
||||||
|
<FaUndo className="w-3 h-3" />
|
||||||
|
<span>{translate('::ListForms.ListForm.ResetGridState')}</span>
|
||||||
|
</span>
|
||||||
|
</Dropdown.Item>
|
||||||
|
|
||||||
|
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
|
||||||
|
<Dropdown.Item
|
||||||
|
eventKey="formManager"
|
||||||
|
onClick={() => {
|
||||||
|
window.open(
|
||||||
|
ROUTES_ENUM.protected.saas.listFormManagement.edit.replace(
|
||||||
|
':listFormCode',
|
||||||
|
listFormCode,
|
||||||
|
),
|
||||||
|
isPwaMode ? '_self' : '_blank',
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
className="px-2"
|
||||||
|
>
|
||||||
|
<span className="flex items-center gap-2">
|
||||||
|
<FaCog className="w-3 h-3" />
|
||||||
|
<span>{translate('::ListForms.ListForm.Manage')}</span>
|
||||||
|
</span>
|
||||||
|
</Dropdown.Item>
|
||||||
|
)}
|
||||||
|
</Dropdown>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{showChart && (
|
{showChart && (
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue