sozsoft/erp-platform
1
0
Fork 0
Code Issues 6 Pull requests Projects 3 Releases Packages Wiki Activity Actions

Grid, Card ve Pivot son güncelleme

Browse source
This commit is contained in:
Sedat Öztürk 2025-09-23 22:52:08 +03:00
parent bd287d752e
commit ea5dbe91f5
10 changed files with 86 additions and 54 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/src/components/ui/Button/Button.tsx
View file

@ -86,7 +86,7 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
`h-${CONTROL_SIZES.xs}`,
icon && !children
? `w-${CONTROL_SIZES.xs} ${sizeIconClass} text-base`
: 'px-3 py-1 text-xs'
: 'px-2 py-1 text-xs'
)
break
default:

4
ui/src/index.css
View file

@ -1,5 +1,9 @@
@import './assets/styles/app.css';
.dx-field-item {
padding-top: 5px !important;
}
.dx-toolbar .dx-toolbar-item.no-default {
all: unset; /* tüm default style'ları sıfırla */
display: block; /* tekrar görünür yap */

6
ui/src/utils/hooks/useCurrentMenuIcon.tsx
View file

@ -13,9 +13,11 @@ export function useCurrentMenuIcon(className = 'w-6 h-6'): JSX.Element {
if (!menu.path) return false
// normalize: /list/ -> /form/
const formPath = menu.path.replace('/list/', '/form/')
const menuPath = menu.path.toLowerCase()
const listFormPath = menuPath.replace('/list/', '/form/')
const formPath = listFormPath.replace('/list-', '/form-')
return location.pathname.startsWith(menu.path) || location.pathname.startsWith(formPath)
return location.pathname.startsWith(menuPath) || location.pathname.startsWith(listFormPath) || location.pathname.startsWith(formPath)
})
const IconComponent = currentMenu?.icon ? navigationIcon[currentMenu.icon] || FaUser : FaUser

55
ui/src/views/form/FormButtons.tsx
View file

@ -83,7 +83,8 @@ const FormButtons = (props: {
if (props.onActionNew) {
props.onActionNew()
} else {
navigate(ROUTES_ENUM.protected.admin.formNew.replace(':formCode', listFormCode))
navigate(-1)
//navigate(ROUTES_ENUM.protected.admin.formNew.replace(':formCode', listFormCode))
}
toast.push(
<Notification type="success" duration={2000}>
@ -171,8 +172,10 @@ const FormButtons = (props: {
{!isSubForm && (
<Button
variant="solid"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaBackward />}
color="gray-500"
title={translate('::Cancel')}
onClick={() => {
@ -183,13 +186,14 @@ const FormButtons = (props: {
}
}}
>
<FaBackward />
</Button>
)}
{mode != 'new' && (
<Button
variant="solid"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaTrash />}
color="red-500"
title={translate('::Delete')}
onClick={() => {
@ -197,13 +201,14 @@ const FormButtons = (props: {
}}
{...(permissions.d ? {} : { disabled: true })}
>
<FaTrash />
</Button>
)}
{mode != 'new' && (
<Button
variant="solid"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaPlus />}
title={translate('::AddNew')}
onClick={() => {
if (onActionNew) {
@ -213,14 +218,14 @@ const FormButtons = (props: {
}
}}
{...(permissions.c ? {} : { disabled: true })}
>
<FaPlus />
</Button>
></Button>
)}
{mode == 'view' && (
<Button
variant="solid"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaEdit />}
title={translate('::Edit')}
onClick={() => {
if (onActionEdit) {
@ -234,14 +239,14 @@ const FormButtons = (props: {
}
}}
{...(permissions.u ? {} : { disabled: true })}
>
<FaEdit />
</Button>
></Button>
)}
{(mode == 'edit' || (onActionView && mode == 'new')) && (
<Button
variant="solid"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaFileAlt />}
title={translate('::Detail')}
onClick={() => {
if (onActionView) {
@ -255,26 +260,26 @@ const FormButtons = (props: {
}
}}
{...(permissions.r ? {} : { disabled: true })}
>
<FaFileAlt />
</Button>
></Button>
)}
{(mode == 'edit' || mode == 'new') && (
<Button
variant="solid"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaSave />}
title={translate('::Save')}
onClick={handleSubmit}
{...(permissions.c || permissions.u ? {} : { disabled: true })}
>
<FaSave />
</Button>
></Button>
)}
{checkPermission(gridDto?.gridOptions.permissionDto.c) && !isSubForm && (
<Button
variant="solid"
color="green-500"
size="xs"
variant="default"
className="dx-button dx-button-mode-contained dx-button-normal"
icon={<FaInfo />}
color="green-500"
title={translate('::ListForms.ListForm.Manage')}
onClick={() => {
window.open(
@ -285,9 +290,7 @@ const FormButtons = (props: {
isPwaMode ? '_self' : '_blank',
)
}}
>
<FaInfo />
</Button>
></Button>
)}
</div>
<Dialog

4
ui/src/views/form/FormDevExpress.tsx
View file

@ -24,7 +24,7 @@ const FormDevExpress = (props: {
const { listFormCode, isSubForm, mode, refForm, formData, formItems, setFormData } = props
return (
<form className={`${DX_CLASSNAMES} py-2 px-2`}>
<form className={`${DX_CLASSNAMES} ${!isSubForm ? 'px-2' : ''} pb-2`}>
<FormDx
ref={refForm}
formData={formData}
@ -43,6 +43,7 @@ const FormDevExpress = (props: {
{formItems.map((formGroupItem, i) => {
return (
<GroupItemDx
key={'formGroupItem-' + i}
colCount={formGroupItem.colCount}
colSpan={formGroupItem.colSpan}
@ -96,6 +97,7 @@ const FormDevExpress = (props: {
</SimpleItemDx>
) : (
<SimpleItemDx
cssClass='font-semibold'
key={'formItem-' + i}
{...formItem}
editorOptions={{

2
ui/src/views/form/FormView.tsx
View file

@ -99,7 +99,7 @@ const FormView = (
/>
)}
</div>
<div className="px-2">
<div className={`${isSubForm ? 'px-2' : ''}`}>
<FormDevExpress
mode={mode}
refForm={refForm}

3
ui/src/views/form/SubForms.tsx
View file

@ -11,6 +11,7 @@ import { GridDto, SubFormDto, SubFormTabTypeEnum } from '@/proxy/form/models'
import FormEdit from './FormEdit'
import FormNew from './FormNew'
import FormView from './FormView'
import { getList } from '@/services/form.service'
const SubForms = (props: {
gridDto: GridDto
@ -78,7 +79,7 @@ const SubForms = (props: {
}
}
}}
className='mt-2'
className="mt-2"
>
<TabList>
{subForms.map((subForm, i) => {

36
ui/src/views/list/Card.tsx
View file

@ -20,20 +20,7 @@ import { Container, Loading } from '@/components/shared'
import WidgetGroup from '@/components/common/WidgetGroup'
import { GridExtraFilterState } from './Utils'
import { useStoreActions, useStoreState } from '@/store/store'
interface CardProps {
listFormCode: string
searchParams?: URLSearchParams
isSubForm?: boolean
level?: number
refreshData?: () => Promise<void>
gridDto?: GridDto
}
type Option = {
value: number
label: string
}
import { FaTrashCan } from 'react-icons/fa6'
const CardItem = ({
isSubForm,
@ -189,6 +176,20 @@ const CardItem = ({
)
}
interface CardProps {
listFormCode: string
searchParams?: URLSearchParams
isSubForm?: boolean
level?: number
refreshData?: () => Promise<void>
gridDto?: GridDto
}
type Option = {
value: number
label: string
}
const Card = (props: CardProps) => {
const { listFormCode, searchParams, gridDto } = props
const { createSelectDataSource } = useListFormCustomDataSource({})
@ -287,6 +288,7 @@ const Card = (props: CardProps) => {
const dataSource = createSelectDataSource(gridDto.gridOptions, listFormCode, urlSearchParams)
setGridDataSource(dataSource)
//listFormStates
const listFormStates = states.find((a) => a.listFormCode === listFormCode)
if (listFormStates) {
setLayoutCount(listFormStates.cardLayoutColumn || 4)
@ -340,7 +342,7 @@ const Card = (props: CardProps) => {
if (data.length > 0) {
window.scrollTo({ top: 0, behavior: 'smooth' })
if (data.length < 3) {
if (data.length < 6) {
setLayoutCount(data.length)
}
}
@ -379,9 +381,9 @@ const Card = (props: CardProps) => {
onFilter(newValue)
setPrevValue(newValue)
}}
className="p-1 pl-6 pr-2 border border-1 outline-none text-xs text-gray-700
dark:text-gray-200 placeholder-gray-400 rounded"
className="p-1 pl-6 pr-2 border border-1 outline-none text-xs text-gray-700 dark:text-gray-200 placeholder-gray-400 rounded"
/>
<Button
size="xs"
variant={layoutCount === 1 ? 'solid' : 'default'}

22
ui/src/views/list/Grid.tsx
View file

@ -66,6 +66,7 @@ import { useToolbar } from './useToolbar'
import { ImportDashboard } from '@/components/importManager/ImportDashboard'
import WidgetGroup from '@/components/ui/Widget/WidgetGroup'
import { GridExtraFilterToolbar } from './GridExtraFilterToolbar'
import { getList } from '@/services/form.service'
interface GridProps {
listFormCode: string
@ -79,7 +80,7 @@ interface GridProps {
const statedGridPanelColor = 'rgba(50, 200, 200, 0.5)' // kullanici tanimli gridState ile islem gormus gridin paneline ait renk
const Grid = (props: GridProps) => {
const { listFormCode, searchParams, isSubForm, level, gridDto } = props
const { listFormCode, searchParams, isSubForm, level, gridDto: extGridDto } = props
const { translate } = useLocalization()
const { smaller } = useResponsive()
@ -91,6 +92,7 @@ const Grid = (props: GridProps) => {
const [formData, setFormData] = useState<any>()
const [mode, setMode] = useState<RowMode>('view')
const [extraFilters, setExtraFilters] = useState<GridExtraFilterState[]>([])
const [gridDto, setGridDto] = useState<GridDto>()
const preloadExportLibs = () => {
import('exceljs')
@ -103,7 +105,19 @@ const Grid = (props: GridProps) => {
const defaultSearchParams = useRef<string | null>(null)
useEffect(() => {
// sadece 1 kere açılışta al
const initializeGrid = async () => {
const response = await getList({ listFormCode })
setGridDto(response.data)
}
if (extGridDto === undefined) {
initializeGrid()
} else {
setGridDto(extGridDto)
}
}, [listFormCode, extGridDto])
useEffect(() => {
if (!defaultSearchParams.current) {
defaultSearchParams.current = searchParams?.get('filter') ?? null
}
@ -399,9 +413,8 @@ const Grid = (props: GridProps) => {
gridRef.current.instance.state(null)
}
if (refListFormCode.current && refListFormCode.current !== listFormCode) {
if (refListFormCode.current !== listFormCode) {
setExtraFilters([])
defaultSearchParams.current = null
}
}, [listFormCode])
@ -493,6 +506,7 @@ const Grid = (props: GridProps) => {
searchParams?.delete('filter')
}
gridRef.current?.instance.refresh()
}, [extraFilters])

6
ui/src/views/list/List.tsx
View file

@ -52,6 +52,10 @@ const List = () => {
return null
}
if (!gridDto) {
return null
}
return (
<Container>
<div
@ -63,7 +67,7 @@ const List = () => {
<div className="flex items-center gap-2">
{MenuIcon}
<h4 className="text-slate-700 text-sm font-medium leading-none">
{translate('::' + gridDto?.gridOptions?.title)}
{translate('::' + gridDto?.gridOptions?.title) || ''}
</h4>
</div>