Card, Pivot, Tree içerisinde tüm translate değerleri
This commit is contained in:
parent
0f0d185b2a
commit
9478d4f69d
7 changed files with 275 additions and 62 deletions
|
|
@ -10794,6 +10794,204 @@
|
||||||
"key": "App.Platform.DeleteAction",
|
"key": "App.Platform.DeleteAction",
|
||||||
"tr": "Sil",
|
"tr": "Sil",
|
||||||
"en": "Delete"
|
"en": "Delete"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.Selected",
|
||||||
|
"tr": "seçili",
|
||||||
|
"en": "selected"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.SelectAll",
|
||||||
|
"tr": "Tümünü Seç",
|
||||||
|
"en": "Select All"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ExportSelectedToExcel",
|
||||||
|
"tr": "Seçilenleri Excel'e Aktar",
|
||||||
|
"en": "Export Selected to Excel"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ExportAllToExcel",
|
||||||
|
"tr": "Tümünü Excel'e Aktar",
|
||||||
|
"en": "Export All to Excel"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.NoSorting",
|
||||||
|
"tr": "Sıralama Yok",
|
||||||
|
"en": "No Sorting"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ChangeSortDirection",
|
||||||
|
"tr": "Sıralama yönünü değiştir",
|
||||||
|
"en": "Change sort direction"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ShowIn1Column",
|
||||||
|
"tr": "1 Sütunda Göster",
|
||||||
|
"en": "Show in 1 Column"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ShowIn2Columns",
|
||||||
|
"tr": "2 Sütunda Göster",
|
||||||
|
"en": "Show in 2 Columns"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ShowIn3Columns",
|
||||||
|
"tr": "3 Sütunda Göster",
|
||||||
|
"en": "Show in 3 Columns"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ShowIn4Columns",
|
||||||
|
"tr": "4 Sütunda Göster",
|
||||||
|
"en": "Show in 4 Columns"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.ShowIn5Columns",
|
||||||
|
"tr": "5 Sütunda Göster",
|
||||||
|
"en": "Show in 5 Columns"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.NoRecordsFound",
|
||||||
|
"tr": "Uygun kayıt bulunamadı",
|
||||||
|
"en": "No records found"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.TryDifferentFilters",
|
||||||
|
"tr": "Farklı filtreler deneyin veya yeni bir kayıt ekleyin.",
|
||||||
|
"en": "Try different filters or add a new record."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.Loading",
|
||||||
|
"tr": "Yükleniyor...",
|
||||||
|
"en": "Loading..."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.Card.TotalRecords",
|
||||||
|
"tr": "Toplam {0} kayıt",
|
||||||
|
"en": "Total {0} records"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ChartSeries",
|
||||||
|
"tr": "Grafik Serileri",
|
||||||
|
"en": "Chart Series"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.AddNewSeries",
|
||||||
|
"tr": "Yeni Seri Ekle",
|
||||||
|
"en": "Add New Series"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.Series",
|
||||||
|
"tr": "Seri",
|
||||||
|
"en": "Series"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ChartType",
|
||||||
|
"tr": "Grafik Tipi",
|
||||||
|
"en": "Chart Type"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.Name",
|
||||||
|
"tr": "Ad",
|
||||||
|
"en": "Name"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.SeriesName",
|
||||||
|
"tr": "Seri adı",
|
||||||
|
"en": "Series name"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ArgumentField",
|
||||||
|
"tr": "Argüman Alanı (X-Ekseni)",
|
||||||
|
"en": "Argument Field (X-Axis)"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ValueField",
|
||||||
|
"tr": "Değer Alanı (Y-Ekseni)",
|
||||||
|
"en": "Value Field (Y-Axis)"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.SummaryType",
|
||||||
|
"tr": "Özet Tipi",
|
||||||
|
"en": "Summary Type"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.SelectField",
|
||||||
|
"tr": "Alan seçin...",
|
||||||
|
"en": "Select field..."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.Cancel",
|
||||||
|
"tr": "İptal",
|
||||||
|
"en": "Cancel"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.Save",
|
||||||
|
"tr": "Kaydet",
|
||||||
|
"en": "Save"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ChartSaved",
|
||||||
|
"tr": "Grafik kaydedildi",
|
||||||
|
"en": "Chart saved"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.Error",
|
||||||
|
"tr": "Hata",
|
||||||
|
"en": "Error"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.NameRequired",
|
||||||
|
"tr": "Ad Gerekli",
|
||||||
|
"en": "Name Required"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ArgumentFieldRequired",
|
||||||
|
"tr": "Argüman Alanı Gerekli",
|
||||||
|
"en": "Argument Field Required"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.ValueFieldRequired",
|
||||||
|
"tr": "Değer Alanı Gerekli",
|
||||||
|
"en": "Value Field Required"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"resourceName": "Platform",
|
||||||
|
"key": "App.Platform.ChartDrawer.SummaryTypeRequired",
|
||||||
|
"tr": "Özet Tipi Gerekli",
|
||||||
|
"en": "Summary Type Required"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -15,6 +15,7 @@ import { usePWA } from '@/utils/hooks/usePWA'
|
||||||
import CardItem from './CardItem'
|
import CardItem from './CardItem'
|
||||||
import { layoutTypes } from '../admin/listForm/edit/types'
|
import { layoutTypes } from '../admin/listForm/edit/types'
|
||||||
import { useListFormCustomDataSource } from './useListFormCustomDataSource'
|
import { useListFormCustomDataSource } from './useListFormCustomDataSource'
|
||||||
|
import { useLocalization } from '@/utils/hooks/useLocalization'
|
||||||
|
|
||||||
interface CardProps {
|
interface CardProps {
|
||||||
listFormCode: string
|
listFormCode: string
|
||||||
|
|
@ -32,6 +33,7 @@ type Option = {
|
||||||
|
|
||||||
const Card = (props: CardProps) => {
|
const Card = (props: CardProps) => {
|
||||||
const { listFormCode, searchParams, gridDto } = props
|
const { listFormCode, searchParams, gridDto } = props
|
||||||
|
const { translate } = useLocalization()
|
||||||
const { createSelectDataSource } = useListFormCustomDataSource({} as any)
|
const { createSelectDataSource } = useListFormCustomDataSource({} as any)
|
||||||
const [data, setData] = useState<any[]>([])
|
const [data, setData] = useState<any[]>([])
|
||||||
const [totalCount, setTotalCount] = useState(0)
|
const [totalCount, setTotalCount] = useState(0)
|
||||||
|
|
@ -528,7 +530,7 @@ const Card = (props: CardProps) => {
|
||||||
className="cursor-pointer"
|
className="cursor-pointer"
|
||||||
/>
|
/>
|
||||||
<span className="text-sm text-gray-600 dark:text-gray-300">
|
<span className="text-sm text-gray-600 dark:text-gray-300">
|
||||||
{selectedKeys.size > 0 ? `${selectedKeys.size} seçili` : 'Tümünü Seç'}
|
{selectedKeys.size > 0 ? `${selectedKeys.size} ${translate('::App.Platform.Card.Selected')}` : translate('::App.Platform.Card.SelectAll')}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -536,7 +538,7 @@ const Card = (props: CardProps) => {
|
||||||
{selectionMode !== 'none' && selectedKeys.size > 0 && !gridDto?.gridOptions?.selectionDto?.allowSelectAll && (
|
{selectionMode !== 'none' && selectedKeys.size > 0 && !gridDto?.gridOptions?.selectionDto?.allowSelectAll && (
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<span className="text-sm text-gray-600 dark:text-gray-300">
|
<span className="text-sm text-gray-600 dark:text-gray-300">
|
||||||
{selectedKeys.size} seçili
|
{selectedKeys.size} {translate('::App.Platform.Card.Selected')}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -550,9 +552,9 @@ const Card = (props: CardProps) => {
|
||||||
size="xs"
|
size="xs"
|
||||||
variant="default"
|
variant="default"
|
||||||
onClick={() => handleExport('xlsx', selectionMode !== 'none' && selectedKeys.size > 0)}
|
onClick={() => handleExport('xlsx', selectionMode !== 'none' && selectedKeys.size > 0)}
|
||||||
title={selectionMode !== 'none' && selectedKeys.size > 0 ? `Seçilenleri Excel'e Aktar (${selectedKeys.size})` : "Tümünü Excel'e Aktar"}
|
title={selectionMode !== 'none' && selectedKeys.size > 0 ? `${translate('::App.Platform.Card.ExportSelectedToExcel')} (${selectedKeys.size})` : translate('::App.Platform.Card.ExportAllToExcel')}
|
||||||
>
|
>
|
||||||
📊 {selectionMode !== 'none' && selectedKeys.size > 0 ? `Seçilenleri Excel'e Aktar (${selectedKeys.size})` : `Tümünü Excel'e Aktar`}
|
📊 {selectionMode !== 'none' && selectedKeys.size > 0 ? `${translate('::App.Platform.Card.ExportSelectedToExcel')} (${selectedKeys.size})` : translate('::App.Platform.Card.ExportAllToExcel')}
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -576,7 +578,7 @@ const Card = (props: CardProps) => {
|
||||||
}}
|
}}
|
||||||
value={sortColumn || ''}
|
value={sortColumn || ''}
|
||||||
>
|
>
|
||||||
<option value="">Sıralama Yok</option>
|
<option value="">{translate('::App.Platform.Card.NoSorting')}</option>
|
||||||
{gridDto.columnFormats
|
{gridDto.columnFormats
|
||||||
.filter((col) => col.visible && col.dataType !== 'buttons')
|
.filter((col) => col.visible && col.dataType !== 'buttons')
|
||||||
.map((col) => (
|
.map((col) => (
|
||||||
|
|
@ -589,7 +591,7 @@ const Card = (props: CardProps) => {
|
||||||
<button
|
<button
|
||||||
onClick={() => toggleSort(sortColumn)}
|
onClick={() => toggleSort(sortColumn)}
|
||||||
className="text-gray-600 dark:text-gray-300 hover:text-blue-500 p-1"
|
className="text-gray-600 dark:text-gray-300 hover:text-blue-500 p-1"
|
||||||
title="Sıralama yönünü değiştir"
|
title={translate('::App.Platform.Card.ChangeSortDirection')}
|
||||||
>
|
>
|
||||||
{sortOrder === 'asc' ? <FaSortAmountUp className="w-3 h-3" /> : <FaSortAmountDown className="w-3 h-3" />}
|
{sortOrder === 'asc' ? <FaSortAmountUp className="w-3 h-3" /> : <FaSortAmountDown className="w-3 h-3" />}
|
||||||
</button>
|
</button>
|
||||||
|
|
@ -601,7 +603,7 @@ const Card = (props: CardProps) => {
|
||||||
<FaSearch className="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm" />
|
<FaSearch className="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm" />
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Search..."
|
placeholder={translate('::App.Search')}
|
||||||
value={searchText}
|
value={searchText}
|
||||||
onChange={(e) => setSearchText(e.target.value)}
|
onChange={(e) => setSearchText(e.target.value)}
|
||||||
onKeyDown={(e) => {
|
onKeyDown={(e) => {
|
||||||
|
|
@ -632,7 +634,7 @@ const Card = (props: CardProps) => {
|
||||||
setLayoutCount(1)
|
setLayoutCount(1)
|
||||||
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 1 })
|
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 1 })
|
||||||
}}
|
}}
|
||||||
title="1 Sütunda Göster"
|
title={translate('::App.Platform.Card.ShowIn1Column')}
|
||||||
>
|
>
|
||||||
1
|
1
|
||||||
</Button>
|
</Button>
|
||||||
|
|
@ -644,7 +646,7 @@ const Card = (props: CardProps) => {
|
||||||
setLayoutCount(2)
|
setLayoutCount(2)
|
||||||
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 2 })
|
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 2 })
|
||||||
}}
|
}}
|
||||||
title="2 Sütunda Göster"
|
title={translate('::App.Platform.Card.ShowIn2Columns')}
|
||||||
>
|
>
|
||||||
2
|
2
|
||||||
</Button>
|
</Button>
|
||||||
|
|
@ -656,7 +658,7 @@ const Card = (props: CardProps) => {
|
||||||
setLayoutCount(3)
|
setLayoutCount(3)
|
||||||
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 3 })
|
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 3 })
|
||||||
}}
|
}}
|
||||||
title="3 Sütunda Göster"
|
title={translate('::App.Platform.Card.ShowIn3Columns')}
|
||||||
>
|
>
|
||||||
3
|
3
|
||||||
</Button>
|
</Button>
|
||||||
|
|
@ -668,7 +670,7 @@ const Card = (props: CardProps) => {
|
||||||
setLayoutCount(4)
|
setLayoutCount(4)
|
||||||
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 4 })
|
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 4 })
|
||||||
}}
|
}}
|
||||||
title="4 Sütunda Göster"
|
title={translate('::App.Platform.Card.ShowIn4Columns')}
|
||||||
>
|
>
|
||||||
4
|
4
|
||||||
</Button>
|
</Button>
|
||||||
|
|
@ -680,7 +682,7 @@ const Card = (props: CardProps) => {
|
||||||
setLayoutCount(5)
|
setLayoutCount(5)
|
||||||
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 5 })
|
setStates({ listFormCode, layout: 'card', cardLayoutColumn: 5 })
|
||||||
}}
|
}}
|
||||||
title="5 Sütunda Göster"
|
title={translate('::App.Platform.Card.ShowIn5Columns')}
|
||||||
>
|
>
|
||||||
5
|
5
|
||||||
</Button>
|
</Button>
|
||||||
|
|
@ -699,7 +701,7 @@ const Card = (props: CardProps) => {
|
||||||
isPwaMode ? '_self' : '_blank',
|
isPwaMode ? '_self' : '_blank',
|
||||||
)
|
)
|
||||||
}}
|
}}
|
||||||
title="Form Manager"
|
title={translate('::ListForms.ListForm.Manage')}
|
||||||
>
|
>
|
||||||
<FaCog className="w-3 h-3" />
|
<FaCog className="w-3 h-3" />
|
||||||
</Button>
|
</Button>
|
||||||
|
|
@ -714,10 +716,10 @@ const Card = (props: CardProps) => {
|
||||||
<div className="text-center py-12">
|
<div className="text-center py-12">
|
||||||
<FaSearch className="mx-auto h-10 w-10 text-gray-400" />
|
<FaSearch className="mx-auto h-10 w-10 text-gray-400" />
|
||||||
<h3 className="mt-2 text-sm font-medium text-gray-900 dark:text-gray-200">
|
<h3 className="mt-2 text-sm font-medium text-gray-900 dark:text-gray-200">
|
||||||
Uygun kayıt bulunamadı
|
{translate('::App.Platform.Card.NoRecordsFound')}
|
||||||
</h3>
|
</h3>
|
||||||
<p className="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
<p className="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
||||||
Farklı filtreler deneyin veya yeni bir kayıt ekleyin.
|
{translate('::App.Platform.Card.TryDifferentFilters')}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
) : (
|
) : (
|
||||||
|
|
@ -766,7 +768,7 @@ const Card = (props: CardProps) => {
|
||||||
<div className="text-center py-4">
|
<div className="text-center py-4">
|
||||||
<div className="inline-block animate-spin rounded-full h-6 w-6 border-b-2 border-blue-500"></div>
|
<div className="inline-block animate-spin rounded-full h-6 w-6 border-b-2 border-blue-500"></div>
|
||||||
<p className="text-xs text-gray-500 dark:text-gray-400 mt-2">
|
<p className="text-xs text-gray-500 dark:text-gray-400 mt-2">
|
||||||
Yükleniyor... ({renderedCount}/{data.length})
|
{translate('::App.Platform.Card.Loading')} ({renderedCount}/{data.length})
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
@ -777,7 +779,7 @@ const Card = (props: CardProps) => {
|
||||||
<div className={classNames('flex items-center justify-between border-t-1 gap-4 mt-2')}>
|
<div className={classNames('flex items-center justify-between border-t-1 gap-4 mt-2')}>
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
<span className="text-xs text-gray-600 dark:text-gray-300">
|
<span className="text-xs text-gray-600 dark:text-gray-300">
|
||||||
Toplam {totalCount} kayıt
|
{translate('::App.Platform.Card.TotalRecords').replace('{0}', totalCount.toString())}
|
||||||
</span>
|
</span>
|
||||||
<Select
|
<Select
|
||||||
size="xs"
|
size="xs"
|
||||||
|
|
|
||||||
|
|
@ -136,6 +136,7 @@ const CardItem = forwardRef<HTMLDivElement, CardItemProps>((
|
||||||
canExport: colData?.canExport ?? false,
|
canExport: colData?.canExport ?? false,
|
||||||
dataField: i.dataField,
|
dataField: i.dataField,
|
||||||
name: i.dataField,
|
name: i.dataField,
|
||||||
|
label: { text: colData?.captionName ? translate('::' + colData?.captionName) : i.dataField },
|
||||||
editorType2: i.editorType2,
|
editorType2: i.editorType2,
|
||||||
editorType:
|
editorType:
|
||||||
i.editorType2 == PlatformEditorTypes.dxGridBox ? 'dxDropDownBox' : i.editorType2,
|
i.editorType2 == PlatformEditorTypes.dxGridBox ? 'dxDropDownBox' : i.editorType2,
|
||||||
|
|
@ -167,7 +168,7 @@ const CardItem = forwardRef<HTMLDivElement, CardItemProps>((
|
||||||
}),
|
}),
|
||||||
} as GroupItem
|
} as GroupItem
|
||||||
})
|
})
|
||||||
}, [gridDto, getCachedLookupDataSource])
|
}, [gridDto, getCachedLookupDataSource, translate])
|
||||||
|
|
||||||
const permissionResults: PermissionResults = {
|
const permissionResults: PermissionResults = {
|
||||||
c:
|
c:
|
||||||
|
|
|
||||||
|
|
@ -53,6 +53,7 @@ const Chart = (props: ChartProps) => {
|
||||||
const [searchParams] = useSearchParams()
|
const [searchParams] = useSearchParams()
|
||||||
const [chartOptions, setChartOptions] = useState<any>()
|
const [chartOptions, setChartOptions] = useState<any>()
|
||||||
const { createSelectDataSource } = useListFormCustomDataSource({} as any)
|
const { createSelectDataSource } = useListFormCustomDataSource({} as any)
|
||||||
|
const config = useStoreState((state) => state.abpConfig.config)
|
||||||
|
|
||||||
const params = useParams()
|
const params = useParams()
|
||||||
const _listFormCode = props?.listFormCode ?? params?.listFormCode ?? ''
|
const _listFormCode = props?.listFormCode ?? params?.listFormCode ?? ''
|
||||||
|
|
@ -229,7 +230,13 @@ const Chart = (props: ChartProps) => {
|
||||||
})
|
})
|
||||||
if (resp.data?.items) {
|
if (resp.data?.items) {
|
||||||
const fieldNames = groupBy(resp?.data?.items, 'fieldName')
|
const fieldNames = groupBy(resp?.data?.items, 'fieldName')
|
||||||
setFieldList(Object.keys(fieldNames).map((a) => ({ value: a, label: a })))
|
setFieldList(Object.keys(fieldNames).map((fieldName) => {
|
||||||
|
const firstItem = fieldNames[fieldName][0]
|
||||||
|
const label = firstItem.captionName
|
||||||
|
? translate('::' + firstItem.captionName)
|
||||||
|
: fieldName
|
||||||
|
return { value: fieldName, label }
|
||||||
|
}))
|
||||||
}
|
}
|
||||||
} catch (error: any) {
|
} catch (error: any) {
|
||||||
toast.push(
|
toast.push(
|
||||||
|
|
@ -243,7 +250,7 @@ const Chart = (props: ChartProps) => {
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (props.listFormCode) getFields()
|
if (props.listFormCode) getFields()
|
||||||
}, [props.listFormCode])
|
}, [props.listFormCode, config])
|
||||||
|
|
||||||
const handlePreviewChange = (series: ChartSeriesDto[]) => {
|
const handlePreviewChange = (series: ChartSeriesDto[]) => {
|
||||||
// Preview değişikliklerini anında chart'a yansıt
|
// Preview değişikliklerini anında chart'a yansıt
|
||||||
|
|
@ -310,7 +317,7 @@ const Chart = (props: ChartProps) => {
|
||||||
<FaSearch className="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm" />
|
<FaSearch className="absolute left-2 top-1/2 -translate-y-1/2 text-gray-400 text-sm" />
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Search..."
|
placeholder={translate('::App.Search')}
|
||||||
value={searchText}
|
value={searchText}
|
||||||
onChange={(e) => setSearchText(e.target.value)}
|
onChange={(e) => setSearchText(e.target.value)}
|
||||||
onKeyDown={(e) => {
|
onKeyDown={(e) => {
|
||||||
|
|
@ -335,23 +342,23 @@ const Chart = (props: ChartProps) => {
|
||||||
<Button
|
<Button
|
||||||
size="xs"
|
size="xs"
|
||||||
variant={'default'}
|
variant={'default'}
|
||||||
className="text-sm"
|
className="text-sm flex items-center gap-1"
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
setInitialized(false)
|
setInitialized(false)
|
||||||
await refreshGridDto?.()
|
await refreshGridDto?.()
|
||||||
}}
|
}}
|
||||||
title="Refresh Data"
|
title={translate('::App.Platform.Refresh')}
|
||||||
>
|
>
|
||||||
<FaSyncAlt className="w-3 h-3" />
|
<FaSyncAlt className="w-3 h-3" /> {translate('::App.Platform.Refresh')}
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
size="xs"
|
size="xs"
|
||||||
variant="default"
|
variant="default"
|
||||||
className="text-sm flex items-center gap-1"
|
className="text-sm flex items-center gap-1"
|
||||||
onClick={() => setOpenDrawer(true)}
|
onClick={() => setOpenDrawer(true)}
|
||||||
title="Series Customization"
|
title={translate('::ListForms.ListFormEdit.TabChartSeries')}
|
||||||
>
|
>
|
||||||
<FaCrosshairs className="w-3 h-3" /> Serileri Özelleştir
|
<FaCrosshairs className="w-3 h-3" /> {translate('::ListForms.ListFormEdit.TabChartSeries')}
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
|
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
|
||||||
|
|
@ -368,7 +375,7 @@ const Chart = (props: ChartProps) => {
|
||||||
isPwaMode ? '_self' : '_blank',
|
isPwaMode ? '_self' : '_blank',
|
||||||
)
|
)
|
||||||
}}
|
}}
|
||||||
title="Form Manager"
|
title={translate('::ListForms.ListForm.Manage')}
|
||||||
>
|
>
|
||||||
<FaCog className="w-3 h-3" />
|
<FaCog className="w-3 h-3" />
|
||||||
</Button>
|
</Button>
|
||||||
|
|
|
||||||
|
|
@ -19,17 +19,6 @@ interface ChartDrawerProps {
|
||||||
onPreviewChange: (series: ChartSeriesDto[]) => void
|
onPreviewChange: (series: ChartSeriesDto[]) => void
|
||||||
}
|
}
|
||||||
|
|
||||||
const schema = object().shape({
|
|
||||||
series: array().of(
|
|
||||||
object().shape({
|
|
||||||
name: string().required('Name Required'),
|
|
||||||
argumentField: string().required('Argument Field Required'),
|
|
||||||
valueField: string().required('Value Field Required'),
|
|
||||||
summaryType: string().required('Summary Type Required'),
|
|
||||||
}),
|
|
||||||
),
|
|
||||||
})
|
|
||||||
|
|
||||||
const ChartDrawer = ({
|
const ChartDrawer = ({
|
||||||
open,
|
open,
|
||||||
onClose,
|
onClose,
|
||||||
|
|
@ -42,6 +31,17 @@ const ChartDrawer = ({
|
||||||
const { userName } = useStoreState((s) => s.auth.user)
|
const { userName } = useStoreState((s) => s.auth.user)
|
||||||
const [selectedSeriesIndex, setSelectedSeriesIndex] = useState<number>(-1)
|
const [selectedSeriesIndex, setSelectedSeriesIndex] = useState<number>(-1)
|
||||||
|
|
||||||
|
const schema = object().shape({
|
||||||
|
series: array().of(
|
||||||
|
object().shape({
|
||||||
|
name: string().required(translate('::App.Platform.ChartDrawer.NameRequired')),
|
||||||
|
argumentField: string().required(translate('::App.Platform.ChartDrawer.ArgumentFieldRequired')),
|
||||||
|
valueField: string().required(translate('::App.Platform.ChartDrawer.ValueFieldRequired')),
|
||||||
|
summaryType: string().required(translate('::App.Platform.ChartDrawer.SummaryTypeRequired')),
|
||||||
|
}),
|
||||||
|
),
|
||||||
|
})
|
||||||
|
|
||||||
// Chart type icons
|
// Chart type icons
|
||||||
const chartTypeIcons = [
|
const chartTypeIcons = [
|
||||||
{ type: 'line', label: 'Line', icon: '📈' },
|
{ type: 'line', label: 'Line', icon: '📈' },
|
||||||
|
|
@ -111,14 +111,14 @@ const ChartDrawer = ({
|
||||||
onSubmit={async (values, { setSubmitting }) => {
|
onSubmit={async (values, { setSubmitting }) => {
|
||||||
try {
|
try {
|
||||||
await onSave(values.series)
|
await onSave(values.series)
|
||||||
toast.push(<Notification type="success">Chart kaydedildi</Notification>, {
|
toast.push(<Notification type="success">{translate('::App.Platform.ChartDrawer.ChartSaved')}</Notification>, {
|
||||||
placement: 'top-end',
|
placement: 'top-end',
|
||||||
})
|
})
|
||||||
onClose()
|
onClose()
|
||||||
} catch (error: any) {
|
} catch (error: any) {
|
||||||
toast.push(
|
toast.push(
|
||||||
<Notification type="danger">
|
<Notification type="danger">
|
||||||
Hata
|
{translate('::App.Platform.ChartDrawer.Error')}
|
||||||
<code>{error}</code>
|
<code>{error}</code>
|
||||||
</Notification>,
|
</Notification>,
|
||||||
{ placement: 'top-end' },
|
{ placement: 'top-end' },
|
||||||
|
|
@ -145,7 +145,7 @@ const ChartDrawer = ({
|
||||||
<div className="flex items-center justify-between p-4 border-b bg-gray-50">
|
<div className="flex items-center justify-between p-4 border-b bg-gray-50">
|
||||||
<h2 className="text-lg font-semibold flex items-center gap-2">
|
<h2 className="text-lg font-semibold flex items-center gap-2">
|
||||||
<span>📊</span>
|
<span>📊</span>
|
||||||
Chart Series
|
{translate('::App.Platform.ChartDrawer.ChartSeries')}
|
||||||
</h2>
|
</h2>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
|
|
@ -169,7 +169,7 @@ const ChartDrawer = ({
|
||||||
className="w-full"
|
className="w-full"
|
||||||
>
|
>
|
||||||
<div className="flex items-center justify-center gap-2">
|
<div className="flex items-center justify-center gap-2">
|
||||||
<FaPlus /> Yeni Seri Ekle
|
<FaPlus /> {translate('::App.Platform.ChartDrawer.AddNewSeries')}
|
||||||
</div>
|
</div>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -186,7 +186,7 @@ const ChartDrawer = ({
|
||||||
>
|
>
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="flex items-center justify-between mb-3">
|
<div className="flex items-center justify-between mb-3">
|
||||||
<span className="font-semibold text-sm">Seri #{index + 1}</span>
|
<span className="font-semibold text-sm">{translate('::App.Platform.ChartDrawer.Series')} #{index + 1}</span>
|
||||||
<Button
|
<Button
|
||||||
type="button"
|
type="button"
|
||||||
size="xs"
|
size="xs"
|
||||||
|
|
@ -201,7 +201,7 @@ const ChartDrawer = ({
|
||||||
|
|
||||||
{/* Chart Type Selector */}
|
{/* Chart Type Selector */}
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<label className="text-xs font-medium mb-1 block">Chart Type</label>
|
<label className="text-xs font-medium mb-1 block">{translate('::App.Platform.ChartDrawer.ChartType')}</label>
|
||||||
<Field name={`series[${index}].type`}>
|
<Field name={`series[${index}].type`}>
|
||||||
{({ field, form }: FieldProps) => (
|
{({ field, form }: FieldProps) => (
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
|
|
@ -256,20 +256,20 @@ const ChartDrawer = ({
|
||||||
|
|
||||||
{/* Name */}
|
{/* Name */}
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<label className="text-xs font-medium mb-1 block">Name</label>
|
<label className="text-xs font-medium mb-1 block">{translate('::App.Platform.ChartDrawer.Name')}</label>
|
||||||
<Field
|
<Field
|
||||||
size="sm"
|
size="sm"
|
||||||
name={`series[${index}].name`}
|
name={`series[${index}].name`}
|
||||||
type="text"
|
type="text"
|
||||||
component={Input}
|
component={Input}
|
||||||
placeholder="Series name"
|
placeholder={translate('::App.Platform.ChartDrawer.SeriesName')}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Argument Field */}
|
{/* Argument Field */}
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<label className="text-xs font-medium mb-1 block">
|
<label className="text-xs font-medium mb-1 block">
|
||||||
Argument Field (X-Axis)
|
{translate('::App.Platform.ChartDrawer.ArgumentField')}
|
||||||
</label>
|
</label>
|
||||||
<Field name={`series[${index}].argumentField`}>
|
<Field name={`series[${index}].argumentField`}>
|
||||||
{({ field, form }: FieldProps) => (
|
{({ field, form }: FieldProps) => (
|
||||||
|
|
@ -284,7 +284,7 @@ const ChartDrawer = ({
|
||||||
onChange={(option) => {
|
onChange={(option) => {
|
||||||
form.setFieldValue(field.name, option?.value)
|
form.setFieldValue(field.name, option?.value)
|
||||||
}}
|
}}
|
||||||
placeholder="Select field..."
|
placeholder={translate('::App.Platform.ChartDrawer.SelectField')}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</Field>
|
</Field>
|
||||||
|
|
@ -293,7 +293,7 @@ const ChartDrawer = ({
|
||||||
{/* Value Field */}
|
{/* Value Field */}
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<label className="text-xs font-medium mb-1 block">
|
<label className="text-xs font-medium mb-1 block">
|
||||||
Value Field (Y-Axis)
|
{translate('::App.Platform.ChartDrawer.ValueField')}
|
||||||
</label>
|
</label>
|
||||||
<Field name={`series[${index}].valueField`}>
|
<Field name={`series[${index}].valueField`}>
|
||||||
{({ field, form }: FieldProps) => (
|
{({ field, form }: FieldProps) => (
|
||||||
|
|
@ -308,7 +308,7 @@ const ChartDrawer = ({
|
||||||
onChange={(option) => {
|
onChange={(option) => {
|
||||||
form.setFieldValue(field.name, option?.value)
|
form.setFieldValue(field.name, option?.value)
|
||||||
}}
|
}}
|
||||||
placeholder="Select field..."
|
placeholder={translate('::App.Platform.ChartDrawer.SelectField')}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</Field>
|
</Field>
|
||||||
|
|
@ -317,7 +317,7 @@ const ChartDrawer = ({
|
||||||
{/* Summary Type */}
|
{/* Summary Type */}
|
||||||
<div className="mb-3">
|
<div className="mb-3">
|
||||||
<label className="text-xs font-medium mb-1 block">
|
<label className="text-xs font-medium mb-1 block">
|
||||||
Summary Type
|
{translate('::App.Platform.ChartDrawer.SummaryType')}
|
||||||
</label>
|
</label>
|
||||||
<Field name={`series[${index}].summaryType`}>
|
<Field name={`series[${index}].summaryType`}>
|
||||||
{({ field, form }: FieldProps) => (
|
{({ field, form }: FieldProps) => (
|
||||||
|
|
@ -346,12 +346,12 @@ const ChartDrawer = ({
|
||||||
{/* Footer */}
|
{/* Footer */}
|
||||||
<div className="p-4 border-t bg-gray-50 flex gap-2">
|
<div className="p-4 border-t bg-gray-50 flex gap-2">
|
||||||
<Button type="button" variant="plain" onClick={onClose} className="flex-1">
|
<Button type="button" variant="plain" onClick={onClose} className="flex-1">
|
||||||
İptal
|
{translate('::App.Platform.ChartDrawer.Cancel')}
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="solid" loading={isSubmitting} type="submit" className="flex-1">
|
<Button variant="solid" loading={isSubmitting} type="submit" className="flex-1">
|
||||||
<div className="flex items-center justify-center gap-2">
|
<div className="flex items-center justify-center gap-2">
|
||||||
<FaSave />
|
<FaSave />
|
||||||
{isSubmitting ? translate('::SavingWithThreeDot') : 'Kaydet'}
|
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::App.Platform.ChartDrawer.Save')}
|
||||||
</div>
|
</div>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -44,6 +44,7 @@ import { usePWA } from '@/utils/hooks/usePWA'
|
||||||
import { layoutTypes } from '../admin/listForm/edit/types'
|
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'
|
||||||
|
|
||||||
interface PivotProps {
|
interface PivotProps {
|
||||||
listFormCode: string
|
listFormCode: string
|
||||||
|
|
@ -66,6 +67,7 @@ const Pivot = (props: PivotProps) => {
|
||||||
const gridRef = useRef<PivotGridRef>()
|
const gridRef = useRef<PivotGridRef>()
|
||||||
const chartRef = useRef<ChartRef>(null)
|
const chartRef = useRef<ChartRef>(null)
|
||||||
const refListFormCode = useRef('')
|
const refListFormCode = useRef('')
|
||||||
|
const config = useStoreState((state) => state.abpConfig.config)
|
||||||
|
|
||||||
const [gridDataSource, setGridDataSource] = useState<CustomStore<any, any>>()
|
const [gridDataSource, setGridDataSource] = useState<CustomStore<any, any>>()
|
||||||
const [columnData, setColumnData] = useState<GridColumnData[]>()
|
const [columnData, setColumnData] = useState<GridColumnData[]>()
|
||||||
|
|
@ -248,7 +250,7 @@ const Pivot = (props: PivotProps) => {
|
||||||
)
|
)
|
||||||
|
|
||||||
setGridDataSource(dataSource)
|
setGridDataSource(dataSource)
|
||||||
}, [gridDto, searchParams])
|
}, [gridDto, config, searchParams])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
refListFormCode.current = listFormCode
|
refListFormCode.current = listFormCode
|
||||||
|
|
@ -321,9 +323,9 @@ const Pivot = (props: PivotProps) => {
|
||||||
variant={'default'}
|
variant={'default'}
|
||||||
className="text-sm flex items-center gap-1"
|
className="text-sm flex items-center gap-1"
|
||||||
onClick={clearPivotFilters}
|
onClick={clearPivotFilters}
|
||||||
title="Remove Filter"
|
title={translate('::ListForms.ListForm.RemoveFilter')}
|
||||||
>
|
>
|
||||||
<FaTimes className="w-3 h-3" /> Remove Filters
|
<FaTimes className="w-3 h-3" /> {translate('::ListForms.ListForm.RemoveFilter')}
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
|
|
@ -331,9 +333,9 @@ const Pivot = (props: PivotProps) => {
|
||||||
variant={'default'}
|
variant={'default'}
|
||||||
className="text-sm flex items-center gap-1"
|
className="text-sm flex items-center gap-1"
|
||||||
onClick={resetPivotGridState}
|
onClick={resetPivotGridState}
|
||||||
title="Reset Grid State"
|
title={translate('::ListForms.ListForm.ResetGridState')}
|
||||||
>
|
>
|
||||||
<FaUndo className="w-3 h-3" /> Reset Grid State
|
<FaUndo className="w-3 h-3" /> {translate('::ListForms.ListForm.ResetGridState')}
|
||||||
</Button>
|
</Button>
|
||||||
|
|
||||||
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
|
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
|
||||||
|
|
@ -350,7 +352,7 @@ const Pivot = (props: PivotProps) => {
|
||||||
isPwaMode ? '_self' : '_blank',
|
isPwaMode ? '_self' : '_blank',
|
||||||
)
|
)
|
||||||
}}
|
}}
|
||||||
title="Form Manager"
|
title={translate('::ListForms.ListForm.Manage')}
|
||||||
>
|
>
|
||||||
<FaCog className="w-3 h-3" />
|
<FaCog className="w-3 h-3" />
|
||||||
</Button>
|
</Button>
|
||||||
|
|
|
||||||
|
|
@ -63,6 +63,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 { DataType } from 'devextreme/common'
|
import { DataType } from 'devextreme/common'
|
||||||
|
import { useStoreState } from '@/store/store'
|
||||||
|
|
||||||
interface TreeProps {
|
interface TreeProps {
|
||||||
listFormCode: string
|
listFormCode: string
|
||||||
|
|
@ -94,6 +95,7 @@ const Tree = (props: TreeProps) => {
|
||||||
const [widgetGroupHeight, setWidgetGroupHeight] = useState(0)
|
const [widgetGroupHeight, setWidgetGroupHeight] = useState(0)
|
||||||
|
|
||||||
const [expandedRowKeys, setExpandedRowKeys] = useState<any[]>([])
|
const [expandedRowKeys, setExpandedRowKeys] = useState<any[]>([])
|
||||||
|
const config = useStoreState((state) => state.abpConfig.config)
|
||||||
|
|
||||||
const preloadExportLibs = () => {
|
const preloadExportLibs = () => {
|
||||||
import('exceljs')
|
import('exceljs')
|
||||||
|
|
@ -635,7 +637,7 @@ const Tree = (props: TreeProps) => {
|
||||||
}, [gridDto])
|
}, [gridDto])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!gridDto) return
|
if (!gridDto || !config) return
|
||||||
|
|
||||||
const cols = getBandedColumns()
|
const cols = getBandedColumns()
|
||||||
setColumnData(cols)
|
setColumnData(cols)
|
||||||
|
|
@ -648,7 +650,7 @@ const Tree = (props: TreeProps) => {
|
||||||
cols,
|
cols,
|
||||||
)
|
)
|
||||||
setTreeListDataSource(dataSource)
|
setTreeListDataSource(dataSource)
|
||||||
}, [gridDto, searchParams])
|
}, [gridDto, searchParams, config])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const activeFilters = extraFilters.filter((f) => f.value)
|
const activeFilters = extraFilters.filter((f) => f.value)
|
||||||
|
|
@ -1120,6 +1122,7 @@ const Tree = (props: TreeProps) => {
|
||||||
<SearchPanel
|
<SearchPanel
|
||||||
visible={gridDto.gridOptions.searchPanelDto.visible}
|
visible={gridDto.gridOptions.searchPanelDto.visible}
|
||||||
width={gridDto.gridOptions.searchPanelDto.width}
|
width={gridDto.gridOptions.searchPanelDto.width}
|
||||||
|
placeholder={translate('::App.Search')}
|
||||||
></SearchPanel>
|
></SearchPanel>
|
||||||
<Selection
|
<Selection
|
||||||
mode={gridDto.gridOptions.selectionDto?.mode}
|
mode={gridDto.gridOptions.selectionDto?.mode}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue