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

Tasarımsal güncellemeler

Browse source
This commit is contained in:
Sedat ÖZTÜRK 2026-06-10 10:53:32 +03:00
parent c1e7f8cd1d
commit 4e439f3bf5
14 changed files with 208 additions and 158 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/public/version.json
View file

@ -1,5 +1,5 @@
{
"commit": "b286332",
"commit": "c1e7f8c",
"releases": [
{
"version": "1.1.04",

21
ui/src/components/template/MobileNav.tsx
View file

@ -1,7 +1,12 @@
import { useState, Suspense, lazy } from 'react'
import classNames from 'classnames'
import Drawer from '@/components/ui/Drawer'
import { NAV_MODE_THEMED, NAV_MODE_TRANSPARENT, DIR_RTL } from '@/constants/theme.constant'
import {
DIR_RTL,
MODE_DARK,
NAV_MODE_DARK,
NAV_MODE_THEMED,
} from '@/constants/theme.constant'
import withHeaderItem, { WithHeaderItemProps } from '@/utils/hoc/withHeaderItem'
import NavToggle from '@/components/shared/NavToggle'
import useResponsive from '@/utils/hooks/useResponsive'
@ -32,21 +37,17 @@ const MobileNav = () => {
const mode = useStoreState((state) => state.theme.mode)
const direction = useStoreState((state) => state.theme.direction)
const currentRouteKey = useStoreState((state) => state.base.common.currentRouteKey)
const sideNavCollapse = useStoreState((state) => state.theme.layout.sideNavCollapse)
const userAuthority = useStoreState((state) => state.auth.user.authority)
const { smaller } = useResponsive()
const mobileNavMode = mode === MODE_DARK && navMode !== NAV_MODE_THEMED ? NAV_MODE_DARK : navMode
const navColor = () => {
if (navMode === NAV_MODE_THEMED) {
if (mobileNavMode === NAV_MODE_THEMED) {
return `bg-${themeColor}-${primaryColorLevel} side-nav-${navMode}`
}
if (navMode === NAV_MODE_TRANSPARENT) {
return `side-nav-${mode}`
}
return `side-nav-${navMode}`
return `side-nav-${mobileNavMode}`
}
const { mainMenu: navigationConfig } = useStoreState((state) => state.abpConfig.menu)
@ -61,6 +62,8 @@ const MobileNav = () => {
<Drawer
title="Navigation"
isOpen={isOpen}
className={classNames(mode === MODE_DARK && 'bg-gray-800 text-gray-100')}
headerClass={classNames(mode === MODE_DARK && 'border-gray-700')}
bodyClass={classNames(navColor(), 'p-0')}
width={320}
placement={direction === DIR_RTL ? 'right' : 'left'}
@ -70,7 +73,7 @@ const MobileNav = () => {
<Suspense fallback={<></>}>
{isOpen && (
<VerticalMenuContent
navMode={navMode}
navMode={mobileNavMode}
collapsed={false}
navigationTree={navigationConfig}
routeKey={currentRouteKey}

2
ui/src/components/template/ThemeConfigurator/ThemeConfigurator.tsx
View file

@ -23,7 +23,7 @@ const ThemeConfigurator = ({ callBackClose }: ThemeConfiguratorProps) => {
return (
<div className="flex flex-col h-full justify-between">
<div className="flex flex-col gap-y-3 mb-2">
<div className="flex flex-col gap-y-3 mb-2 ml-1">
<div>
<h6 className="mb-3">{translate('::App.SiteManagement.Theme.Style')}</h6>
<StyleSwitcher onStyleChange={handleStyleChange} />

2
ui/src/views/admin/listForm/edit/FormTabDetails.tsx
View file

@ -294,7 +294,7 @@ function FormTabDetails(
</Field>
</FormItem>
<div className="flex gap-2">
<div className="flex flex-wrap gap-2">
<FormItem
label={translate('::ListForms.ListFormEdit.DetailsLayoutDto.GridLayout')}
invalid={errors.layoutDto?.grid && touched.layoutDto?.grid}

14
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabDetails.tsx
View file

@ -1,5 +1,5 @@
import { Container } from '@/components/shared'
import { Button, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { SelectBoxOption } from '@/types/shared'
import { useLocalization } from '@/utils/hooks/useLocalization'
@ -28,7 +28,6 @@ function FormFieldTabDetails({
const { translate } = useLocalization()
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
@ -39,7 +38,8 @@ function FormFieldTabDetails({
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.FieldName')}
invalid={errors.fieldName && touched.fieldName}
@ -68,6 +68,8 @@ function FormFieldTabDetails({
>
<Field type="text" name="bandName" component={Input} />
</FormItem>
</Card>
<Card>
<FormItem label={translate('::ListForms.ListFormEdit.CustomValueType')}>
<Field type="text" name="sourceDbType">
{({ field, form }: FieldProps<SelectBoxOption>) => (
@ -84,7 +86,6 @@ function FormFieldTabDetails({
)}
</Field>
</FormItem>
<FormItem label={translate('::ListForms.ListFormFieldEdit.DetailsAlignment')}>
<Field type="text" name="alignment">
{({ field, form }: FieldProps<SelectBoxOption>) => (
@ -130,15 +131,14 @@ function FormFieldTabDetails({
textArea={true}
/>
</FormItem>
</Card>
</div>
<Button block variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}

14
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabJoinOptions.tsx
View file

@ -1,5 +1,5 @@
import { Container } from '@/components/shared'
import { Button, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, FormContainer, FormItem, Input, Select } from '@/components/ui'
import {
ColumnFormatEditDto,
GridColumnJoinConditionEnum,
@ -39,7 +39,6 @@ function FormFieldTabJoinOptions({
const { translate } = useLocalization()
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
@ -50,7 +49,8 @@ function FormFieldTabJoinOptions({
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
<Card>
<FormItem
labelClass="!justify-start"
labelWidth="40%"
@ -147,7 +147,8 @@ function FormFieldTabJoinOptions({
component={Input}
/>
</FormItem>
</Card>
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.JoinOptionsFieldNameAlias')}
invalid={
@ -231,15 +232,14 @@ function FormFieldTabJoinOptions({
component={Input}
/>
</FormItem>
</Card>
</div>
<Button block variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}

38
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabLookup.tsx
View file

@ -1,5 +1,5 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import type { DatabaseColumnDto, SqlObjectExplorerDto } from '@/proxy/sql-query-manager/models'
import { sqlObjectManagerService } from '@/services/sql-query-manager.service'
@ -46,7 +46,9 @@ function TablePickerModal({
const { translate } = useLocalization()
const [step, setStep] = useState<'table' | 'columns'>('table')
const [tableSearch, setTableSearch] = useState('')
const [pickerTable, setPickerTable] = useState<{ schemaName: string; tableName: string } | null>(null)
const [pickerTable, setPickerTable] = useState<{ schemaName: string; tableName: string } | null>(
null,
)
const [pickerColumns, setPickerColumns] = useState<DatabaseColumnDto[]>([])
const [isLoadingColumns, setIsLoadingColumns] = useState(false)
const [keyCol, setKeyCol] = useState('')
@ -76,7 +78,7 @@ function TablePickerModal({
<span className="text-sm font-semibold text-gray-700 dark:text-gray-200">
{step === 'table'
? translate('::ListForms.Wizard.Step3.SelectTable') || 'Tablo Seç'
: pickerTable?.tableName ?? ''}
: (pickerTable?.tableName ?? '')}
</span>
</div>
<button
@ -120,7 +122,11 @@ function TablePickerModal({
setPickerColumns([])
setIsLoadingColumns(true)
try {
const res = await sqlObjectManagerService.getTableColumns(dsCode, t.schemaName, t.tableName)
const res = await sqlObjectManagerService.getTableColumns(
dsCode,
t.schemaName,
t.tableName,
)
setPickerColumns(res.data ?? [])
} catch {
setPickerColumns([])
@ -159,7 +165,9 @@ function TablePickerModal({
>
<option value="">-- Seçiniz --</option>
{pickerColumns.map((c) => (
<option key={c.columnName} value={c.columnName}>{c.columnName}</option>
<option key={c.columnName} value={c.columnName}>
{c.columnName}
</option>
))}
</select>
</div>
@ -174,7 +182,9 @@ function TablePickerModal({
>
<option value="">-- Seçiniz --</option>
{pickerColumns.map((c) => (
<option key={c.columnName} value={c.columnName}>{c.columnName}</option>
<option key={c.columnName} value={c.columnName}>
{c.columnName}
</option>
))}
</select>
</div>
@ -187,7 +197,9 @@ function TablePickerModal({
type="button"
disabled={!keyCol || !nameCol}
onClick={() => {
onSelect(`SELECT "${keyCol}" AS "Key", "${nameCol}" AS "Name" FROM "${pickerTable?.tableName}" ORDER BY "${nameCol}";`)
onSelect(
`SELECT "${keyCol}" AS "Key", "${nameCol}" AS "Name" FROM "${pickerTable?.tableName}" ORDER BY "${nameCol}";`,
)
}}
className="mt-1 w-full py-1.5 text-xs font-semibold rounded bg-indigo-600 text-white hover:bg-indigo-700 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
>
@ -246,7 +258,6 @@ function FormFieldTabLookup({
}
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={getNormalizedInitialValues(initialValues)}
@ -257,7 +268,8 @@ function FormFieldTabLookup({
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.LookupDataSourceType')}
invalid={errors.lookupDto?.dataSourceType && touched.lookupDto?.dataSourceType}
@ -351,7 +363,8 @@ function FormFieldTabLookup({
component={Input}
/>
</FormItem>
</Card>
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.LookupCascadeRelationField')}
invalid={
@ -432,15 +445,14 @@ function FormFieldTabLookup({
component={Input}
/>
</FormItem>
</Card>
</div>
<Button block variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}

12
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabOptions.tsx
View file

@ -1,5 +1,5 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { SelectBoxOption } from '@/types/shared'
import { useLocalization } from '@/utils/hooks/useLocalization'
@ -32,7 +32,6 @@ function FormFieldTabOptions({
const { translate } = useLocalization()
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
@ -43,7 +42,8 @@ function FormFieldTabOptions({
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.OptionsListOrderNo')}
invalid={errors.listOrderNo && touched.listOrderNo}
@ -85,6 +85,8 @@ function FormFieldTabOptions({
>
<Field type="number" name="sortIndex" component={Input} />
</FormItem>
</Card>
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.OptionsIsActive')}
invalid={errors.isActive && touched.isActive}
@ -108,15 +110,15 @@ function FormFieldTabOptions({
<FormItem label={translate('::ListForms.ListFormEdit.AllowAdding')}>
<Field name="allowAdding" component={Checkbox} />
</FormItem>
</Card>
</div>
<Button block variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}

13
ui/src/views/admin/listForm/edit/form-fields/FormFieldTabPivotSetting.tsx
View file

@ -1,5 +1,5 @@
import { Container } from '@/components/shared'
import { Button, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { Button, Card, Checkbox, FormContainer, FormItem, Input, Select } from '@/components/ui'
import { ColumnFormatEditDto, ListFormFieldEditTabs } from '@/proxy/admin/list-form-field/models'
import { useLocalization } from '@/utils/hooks/useLocalization'
import { Field, FieldProps, Form, Formik } from 'formik'
@ -38,7 +38,6 @@ function FormFieldTabPivotSetting({
const { translate } = useLocalization()
return (
<Container className="grid xl:grid-cols-2">
<Formik
enableReinitialize
initialValues={initialValues}
@ -49,7 +48,8 @@ function FormFieldTabPivotSetting({
>
{({ touched, errors, isSubmitting, values }) => (
<Form>
<FormContainer size="sm">
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.PivotSettingIsPivot')}
invalid={errors.pivotSettingsDto?.isPivot && touched.pivotSettingsDto?.isPivot}
@ -137,7 +137,9 @@ function FormFieldTabPivotSetting({
)}
</Field>
</FormItem>
</Card>
<Card>
<FormItem
label={translate('::ListForms.ListFormFieldEdit.PivotSettingGroupInterval')}
invalid={
@ -210,15 +212,14 @@ function FormFieldTabPivotSetting({
>
<Field name="pivotSettingsDto.wordWrapEnabled" component={Checkbox} />
</FormItem>
</Card>
</div>
<Button block variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</Button>
</FormContainer>
</Form>
)}
</Formik>
</Container>
)
}

23
ui/src/views/admin/listForm/edit/form-fields/FormFields.tsx
View file

@ -405,8 +405,7 @@ function FormFields({
<Table compact>
<THead>
<Tr>
{/* <Th className="w-[40px]"></Th> */}
<Th>
<Th className='w-3/12'>
<div>
<Button
shape="circle"
@ -446,10 +445,10 @@ function FormFields({
)}
</div>
</Th>
<Th>Field</Th>
<Th>Culture</Th>
<Th>Role</Th>
<Th>User</Th>
<Th className="w-3/12">Field</Th>
<Th className="w-2/12">Culture</Th>
<Th className="hidden sm:table-cell w-2/12">Role</Th>
<Th className="hidden sm:table-cell w-2/12">User</Th>
</Tr>
</THead>
<TBody>
@ -464,7 +463,7 @@ function FormFields({
}}
key={field.id}
>
<Td className="flex items-center space-x-1">
<Td className="flex items-center !p-0">
<Button
shape="circle"
variant="plain"
@ -483,20 +482,20 @@ function FormFields({
<span>{!field?.visible && <FaEyeSlash />}</span>
<span>{!field?.isActive && <FaTimes />}</span>
</Td>
<Td>{field.fieldName}</Td>
<Td className="flex items-center space-x-1">
<Td className='!p-0'>{field.fieldName}</Td>
<Td className='align-middle text-center !p-0'>
<Avatar
size={18}
shape="circle"
src={`/img/countries/${field.cultureName ?? 'default'}.png`}
title={field.cultureName}
/>
<span className="ltr:ml-2 rtl:mr-2">{field.cultureName}</span>
</Td>
<Td>
<Td className="hidden sm:table-cell !p-0">
{field.roleId &&
(roleList.find((a) => a.value === field.roleId)?.label ?? 'X')}
</Td>
<Td>
<Td className="hidden sm:table-cell !p-0">
{field.userId &&
(userList.find((a) => a.value === field.userId)?.label ?? 'X')}
</Td>

45
ui/src/views/list/GanttView.tsx
View file

@ -244,23 +244,26 @@ const GanttView = (props: GanttViewProps) => {
progressExpr={gridDto.gridOptions.ganttOptionDto?.progressExpr}
/>
<Toolbar>
<Item name="undo" />
<Item name="redo" />
<Item name="separator" />
<Item name="collapseAll" />
<Item name="expandAll" />
{gridDto.gridOptions.ganttOptionDto?.allowTaskAdding && <Item name="addTask" />}
{gridDto.gridOptions.ganttOptionDto?.allowTaskDeleting && (
<Item name="deleteTask" />
<Toolbar multiline>
<Item name="undo" locateInMenu="auto" />
<Item name="redo" locateInMenu="auto" />
<Item name="separator" locateInMenu="auto" />
<Item name="collapseAll" locateInMenu="auto" />
<Item name="expandAll" locateInMenu="auto" />
{gridDto.gridOptions.ganttOptionDto?.allowTaskAdding && (
<Item name="addTask" locateInMenu="auto" />
)}
<Item name="separator" />
<Item name="zoomIn" />
<Item name="zoomOut" />
<Item name="separator" />
{gridDto.gridOptions.ganttOptionDto?.allowTaskDeleting && (
<Item name="deleteTask" locateInMenu="auto" />
)}
<Item name="separator" locateInMenu="auto" />
<Item name="zoomIn" locateInMenu="auto" />
<Item name="zoomOut" locateInMenu="auto" />
<Item name="separator" locateInMenu="auto" />
<Item
location="after"
widget="dxSelectBox"
locateInMenu="auto"
options={{
width: 150,
items: [
@ -279,9 +282,21 @@ const GanttView = (props: GanttViewProps) => {
onValueChanged: (e: any) => setScaleType(e.value),
}}
/>
<Item location="after" widget="dxButton" options={getRefreshButtonOptions()} />
<Item
location="after"
widget="dxButton"
locateInMenu="auto"
showText="always"
options={getRefreshButtonOptions()}
/>
{checkPermission(gridDto?.gridOptions.permissionDto.u) && (
<Item location="after" widget="dxButton" options={getSettingButtonOptions()} />
<Item
location="after"
widget="dxButton"
locateInMenu="auto"
showText="always"
options={getSettingButtonOptions()}
/>
)}
</Toolbar>

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

@ -1829,7 +1829,10 @@ const Grid = (props: GridProps) => {
setExtraFilters={setExtraFilters}
/>
</Template>
<Toolbar visible={toolbarData.length > 0 || filterToolbarData.length > 0}>
<Toolbar
visible={toolbarData.length > 0 || filterToolbarData.length > 0}
multiline
>
{toolbarData.map((item) => (
<Item key={item.name} {...item}></Item>
))}

1
ui/src/views/list/Tree.tsx
View file

@ -1601,6 +1601,7 @@ const Tree = (props: TreeProps) => {
</Template>
<Toolbar
visible={(toolbarData?.length ?? 0) > 0 || (filterToolbarData?.length ?? 0) > 0}
multiline
>
{toolbarData?.map((item) => (
<Item key={item.name} {...item}></Item>

14
ui/src/views/list/useToolbar.tsx
View file

@ -127,6 +127,8 @@ const useToolbar = ({
items.push({
widget: 'dxButton',
name: 'refreshButton',
locateInMenu: 'auto',
showText: 'always',
options: {
icon: 'refresh',
onClick: refreshData,
@ -147,6 +149,8 @@ const useToolbar = ({
widget: 'dxButton',
name: 'workflowStart',
location: 'after',
locateInMenu: 'auto',
showText: 'always',
options: {
icon: 'play',
text: 'Workflow Start',
@ -204,6 +208,8 @@ const useToolbar = ({
widget: 'dxButton',
name: `workflowApproval_${criteria.id}`,
location: 'after',
locateInMenu: 'auto',
showText: 'always',
options: {
icon: 'check',
text: criteria.title,
@ -272,6 +278,8 @@ const useToolbar = ({
items.push({
widget: 'dxButton',
name: 'expandAllButton',
locateInMenu: 'auto',
showText: 'always',
options: {
icon: 'plus',
text: translate('::ListForms.ListFormEdit.ExpandAll'),
@ -284,6 +292,8 @@ const useToolbar = ({
items.push({
widget: 'dxButton',
name: 'collapseAllButton',
locateInMenu: 'auto',
showText: 'always',
options: {
icon: 'minus',
text: translate('::ListForms.ListFormEdit.CollapseAll'),
@ -407,6 +417,8 @@ const useToolbar = ({
const buttonDeleteAll: DataGridTypes.ToolbarItem = {
location: 'after',
widget: 'dxButton',
locateInMenu: 'auto',
showText: 'always',
name: 'deleteAllRecords',
options: {
text: translate('::ListForms.ListForm.DeleteAllRecords'),
@ -490,6 +502,8 @@ const useToolbar = ({
const buttonCustom: DataGridTypes.ToolbarItem = {
location: 'after',
widget: 'dxButton',
locateInMenu: 'auto',
showText: 'always',
name: action.hint,
options: {
hint: translate('::' + action.hint),