Pivot üzerinde Grafik göster kısmı seçilebiliyor
This commit is contained in:
parent
e3413f4a5a
commit
d42e6f61bd
1 changed files with 17 additions and 4 deletions
|
|
@ -41,6 +41,7 @@ import { layoutTypes } from '../admin/listForm/edit/types'
|
||||||
import { useListFormCustomDataSource } from './useListFormCustomDataSource'
|
import { useListFormCustomDataSource } from './useListFormCustomDataSource'
|
||||||
import { useListFormColumns } from './useListFormColumns'
|
import { useListFormColumns } from './useListFormColumns'
|
||||||
import { useStoreState } from '@/store'
|
import { useStoreState } from '@/store'
|
||||||
|
import Checkbox from '@/components/ui/Checkbox'
|
||||||
|
|
||||||
interface PivotProps {
|
interface PivotProps {
|
||||||
listFormCode: string
|
listFormCode: string
|
||||||
|
|
@ -67,6 +68,7 @@ const Pivot = (props: PivotProps) => {
|
||||||
|
|
||||||
const [gridDataSource, setGridDataSource] = useState<CustomStore<any, any>>()
|
const [gridDataSource, setGridDataSource] = useState<CustomStore<any, any>>()
|
||||||
const [columnData, setColumnData] = useState<GridColumnData[]>()
|
const [columnData, setColumnData] = useState<GridColumnData[]>()
|
||||||
|
const [showChart, setShowChart] = useState(false)
|
||||||
|
|
||||||
// StateStoring için storageKey'i memoize et
|
// StateStoring için storageKey'i memoize et
|
||||||
const storageKey = useMemo(() => {
|
const storageKey = useMemo(() => {
|
||||||
|
|
@ -282,6 +284,9 @@ const Pivot = (props: PivotProps) => {
|
||||||
addCss(css)
|
addCss(css)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Set initial chart visibility
|
||||||
|
setShowChart(gridDto.gridOptions.pivotOptionDto.showChart ?? false)
|
||||||
}, [gridDto])
|
}, [gridDto])
|
||||||
|
|
||||||
// Kolonları memoize et
|
// Kolonları memoize et
|
||||||
|
|
@ -388,9 +393,9 @@ const Pivot = (props: PivotProps) => {
|
||||||
}
|
}
|
||||||
}, [gridDto, columnData, gridDataSource, customLoadState])
|
}, [gridDto, columnData, gridDataSource, customLoadState])
|
||||||
|
|
||||||
// Chart binding - sadece bir kez
|
// Chart binding - showChart değiştiğinde de çalışmalı
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!gridRef?.current || !chartRef?.current) return
|
if (!showChart || !gridRef?.current || !chartRef?.current) return
|
||||||
|
|
||||||
const pivotInstance = gridRef?.current?.instance()
|
const pivotInstance = gridRef?.current?.instance()
|
||||||
const chartInstance = chartRef?.current?.instance()
|
const chartInstance = chartRef?.current?.instance()
|
||||||
|
|
@ -400,7 +405,7 @@ const Pivot = (props: PivotProps) => {
|
||||||
alternateDataFields: false,
|
alternateDataFields: false,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}, [gridDto])
|
}, [showChart, gridDto])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
@ -418,6 +423,14 @@ const Pivot = (props: PivotProps) => {
|
||||||
<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 pb-1 flex gap-1 border-b-1">
|
||||||
|
<label className="flex items-center gap-2 text-sm px-2 cursor-pointer">
|
||||||
|
<Checkbox
|
||||||
|
checked={showChart}
|
||||||
|
onChange={(checked) => setShowChart(checked)}
|
||||||
|
/>
|
||||||
|
<span>{translate('::ListForms.ListFormEdit.ShowChart') || 'Grafik'}</span>
|
||||||
|
</label>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
size="xs"
|
size="xs"
|
||||||
variant={'default'}
|
variant={'default'}
|
||||||
|
|
@ -494,7 +507,7 @@ const Pivot = (props: PivotProps) => {
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{gridDto.gridOptions.pivotOptionDto.showChart && (
|
{showChart && (
|
||||||
<Chart ref={chartRef as any}>
|
<Chart ref={chartRef as any}>
|
||||||
<Size height={gridDto.gridOptions.pivotOptionDto.chartHeight} />
|
<Size height={gridDto.gridOptions.pivotOptionDto.chartHeight} />
|
||||||
<Tooltip enabled={true}></Tooltip>
|
<Tooltip enabled={true}></Tooltip>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue