From d136fb2447f635aaf1f033e419136a065a4e8157 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sedat=20=C3=96zt=C3=BCrk?= Date: Sun, 28 Sep 2025 10:42:23 +0300 Subject: [PATCH] =?UTF-8?q?Chart=20Series=20Argument=20ve=20Value=20Field?= =?UTF-8?q?=20se=C3=A7imi?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../admin/listForm/edit/ChartTabSeries.tsx | 96 +++++++++++--- ui/src/views/admin/listForm/edit/FormEdit.tsx | 3 +- .../JsonRowOpDialogSeries.tsx | 118 ++++++++++++------ ui/src/views/list/Chart.tsx | 20 +-- 4 files changed, 174 insertions(+), 63 deletions(-) diff --git a/ui/src/views/admin/listForm/edit/ChartTabSeries.tsx b/ui/src/views/admin/listForm/edit/ChartTabSeries.tsx index d0186c86..a7e01e4c 100644 --- a/ui/src/views/admin/listForm/edit/ChartTabSeries.tsx +++ b/ui/src/views/admin/listForm/edit/ChartTabSeries.tsx @@ -8,6 +8,8 @@ import { Select, Table, Tabs, + Notification, + toast, } from '@/components/ui' import TBody from '@/components/ui/Table/TBody' import THead from '@/components/ui/Table/THead' @@ -31,18 +33,22 @@ import { chartSeriesSelectionModeOptions, chartSeriesDashStyleOptions, } from './options' -import { useState } from 'react' +import { useEffect, useState } from 'react' import { JsonRowDialogData } from './json-row-operations/types' import JsonRowOpDialogSeries from './json-row-operations/JsonRowOpDialogSeries' +import CreatableSelect from 'react-select/creatable' +import { getListFormFields } from '@/services/admin/list-form-field.service' +import groupBy from 'lodash/groupBy' const schema = object().shape({ name: string().required(), }) -function ChartTabSeries(props: FormEditProps) { +function ChartTabSeries(props: FormEditProps & { listFormCode: string }) { const [isJsonRowOpDialogOpen, setIsJsonRowOpDialogOpen] = useState(false) const [jsonRowOpModalData, setJsonRowOpModalData] = useState() const { translate } = useLocalization() + const [fieldList, setFieldList] = useState([]) const listFormValues = useStoreState((s) => s.admin.listFormValues) if (!listFormValues) { @@ -63,6 +69,45 @@ function ChartTabSeries(props: FormEditProps) { })) } + const getFields = async () => { + if (!props.listFormCode) { + return + } + + try { + const resp = await getListFormFields({ + listFormCode: props.listFormCode, + sorting: 'ListOrderNo', + maxResultCount: 1000, + }) + if (resp.data?.items) { + const fieldNames = groupBy(resp?.data?.items, 'fieldName') + setFieldList( + Object.keys(fieldNames).map((a) => ({ + value: a, + label: a, + })), + ) + } + } catch (error: any) { + toast.push( + + Alanlar getirilemedi + {error.toString()} + , + { + placement: 'top-end', + }, + ) + } + } + + useEffect(() => { + if (props.listFormCode) { + getFields() + } + }, [props.listFormCode]) + return ( - + + {({ field, form }: FieldProps) => ( + option.value === values.commonSeriesSettingsDto.valueField)} + onChange={(option) => form.setFieldValue(field.name, option?.value)} + menuPlacement="auto" + maxMenuHeight={150} + /> + )} + { - - + diff --git a/ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSeries.tsx b/ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSeries.tsx index 5b7e9e58..6c26d079 100644 --- a/ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSeries.tsx +++ b/ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSeries.tsx @@ -15,7 +15,7 @@ import { SelectBoxOption } from '@/shared/types' import { useStoreActions, useStoreState } from '@/store' import { useLocalization } from '@/utils/hooks/useLocalization' import { Field, FieldProps, Form, Formik } from 'formik' -import { Dispatch, SetStateAction } from 'react' +import { Dispatch, SetStateAction, useEffect, useState } from 'react' import { boolean, number, object, string } from 'yup' import { JsonRowDialogData } from './types' import { @@ -31,6 +31,9 @@ import { chartSeriesTypeOptions, } from '../options' import { ChartPanesDto, ChartSeriesDto, ChartValueAxisDto } from '@/proxy/admin/charts/models' +import { getListFormFields } from '@/services/admin/list-form-field.service' +import { groupBy } from 'lodash' +import CreatableSelect from 'react-select/creatable' const schema = object().shape({ visible: boolean().notRequired(), @@ -65,11 +68,13 @@ const schema = object().shape({ }) function JsonRowOpDialogSeries({ + listFormCode, isOpen, setIsOpen, data, setData, }: { + listFormCode: string isOpen: boolean setIsOpen: Dispatch> data: JsonRowDialogData | undefined @@ -77,6 +82,7 @@ function JsonRowOpDialogSeries({ }) { const { translate } = useLocalization() const { setJsonValue } = useStoreActions((a) => a.admin) + const [fieldList, setFieldList] = useState([]) const handleClose = async (e?: any) => { if (e) { @@ -111,6 +117,44 @@ function JsonRowOpDialogSeries({ })) } + const getFields = async () => { + if (!listFormCode) { + return + } + + try { + const resp = await getListFormFields({ + listFormCode, + sorting: 'ListOrderNo', + maxResultCount: 1000, + }) + if (resp.data?.items) { + const fieldNames = groupBy(resp?.data?.items, 'fieldName') + setFieldList( + Object.keys(fieldNames).map((a) => ({ + value: a, + label: a, + })), + ) + } + } catch (error: any) { + toast.push( + + Alanlar getirilemedi + {error.toString()} + , + { + placement: 'top-end', + }, + ) + } + } + useEffect(() => { + if (isOpen && data) { + getFields() + } + }, [isOpen, data]) + if (!data) { return null } @@ -258,7 +302,23 @@ function JsonRowOpDialogSeries({ invalid={errors.argumentField && touched.argumentField} errorMessage={errors.argumentField} > - + + {({ field, form }: FieldProps) => ( + option.value === values.valueField)} + onChange={(option) => form.setFieldValue(field.name, option?.value)} + menuPlacement="auto" + maxMenuHeight={150} + /> + )} + - + @@ -438,36 +504,18 @@ function JsonRowOpDialogSeries({ - + - + diff --git a/ui/src/views/list/Chart.tsx b/ui/src/views/list/Chart.tsx index 54114eda..6d76f43c 100644 --- a/ui/src/views/list/Chart.tsx +++ b/ui/src/views/list/Chart.tsx @@ -42,9 +42,9 @@ const Chart = (props: ChartProps) => { gridDto.gridOptions, listFormCode, searchParams, - [], - gridDto.gridOptions?.seriesDto?.map((s) => `${s.argumentField} asc false`).join(', '), - gridDto.gridOptions?.seriesDto?.map((s) => `${s.valueField} count`).join(', '), + // [], + // gridDto.gridOptions?.seriesDto?.map((s) => `${s.argumentField} asc false`).join(', '), + // gridDto.gridOptions?.seriesDto?.map((s) => `${s.valueField} count`).join(', '), ) const options = { @@ -74,13 +74,13 @@ const Chart = (props: ChartProps) => { valueAxis: gridDto.gridOptions.valueAxisDto, tooltip: gridDto.gridOptions.tooltipDto, - series: - gridDto.gridOptions.seriesDto?.length > 0 - ? gridDto.gridOptions.seriesDto.map((s) => ({ - argumentField: 'key', - valueField: 'summary', - })) - : undefined, + series:gridDto.gridOptions.seriesDto, + // gridDto.gridOptions.seriesDto?.length > 0 + // ? gridDto.gridOptions.seriesDto.map((s) => ({ + // argumentField: 'key', + // valueField: 'summary', + // })) + // : undefined, panes: gridDto.gridOptions.panesDto?.length > 0 ? gridDto.gridOptions.panesDto : undefined, commonSeriesSettings: gridDto.gridOptions.commonSeriesSettingsDto, commonPaneSettings: gridDto.gridOptions.commonPaneSettingsDto,