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

modal düzenlemeler

Browse source
This commit is contained in:
Sedat ÖZTÜRK 2026-05-15 13:48:07 +03:00
parent a891beca3a
commit f62d4b1a74
7 changed files with 377 additions and 384 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogAnnotation.tsx
View file

@ -2,7 +2,6 @@ import {
Button, Button,
Checkbox, Checkbox,
Dialog, Dialog,
FormContainer,
FormItem, FormItem,
Input, Input,
Notification, Notification,
@ -91,11 +90,11 @@ function JsonRowOpDialogAnnotation({
preventScroll={true} preventScroll={true}
onClose={handleClose} onClose={handleClose}
onRequestClose={handleClose} onRequestClose={handleClose}
width={900}
height="90vh"
> >
{(data.operation === 'create' || data.operation === 'update') && ( {(data.operation === 'create' || data.operation === 'update') && (
<> <Formik
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
<Formik
initialValues={ initialValues={
data.chartAnnotationValues ?? { data.chartAnnotationValues ?? {
argument: '', argument: '',
@ -167,16 +166,17 @@ function JsonRowOpDialogAnnotation({
}} }}
> >
{({ touched, errors, values, isSubmitting }) => ( {({ touched, errors, values, isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2 overflow-hidden">
<div className="h-full overflow-y-auto p-2"> <h5 className="flex-shrink-0">{data.index === -1 ? 'Add' : 'Update'}</h5>
<div className="flex-1 overflow-y-auto">
<Tabs defaultValue="annotations_general"> <Tabs defaultValue="annotations_general">
<TabList> <TabList>
<TabNav value="annotations_general">General</TabNav> <TabNav value="annotations_general">General</TabNav>
<TabNav value="annotations_border">Border</TabNav> <TabNav value="annotations_border">Border</TabNav>
</TabList> </TabList>
<TabContent value="annotations_general"> <TabContent value="annotations_general">
<div className="p-2"> <div className="p-3 grid grid-cols-3 gap-x-4 gap-y-1">
<FormItem <FormItem
label="Tooltip Enabled" label="Tooltip Enabled"
invalid={errors.tooltipEnabled && touched.tooltipEnabled} invalid={errors.tooltipEnabled && touched.tooltipEnabled}
@ -262,7 +262,7 @@ function JsonRowOpDialogAnnotation({
> >
<Field name="argument" component={Input} /> <Field name="argument" component={Input} />
</FormItem> </FormItem>
<FormItem <FormItem
label="Color" label="Color"
invalid={errors.color && touched.color} invalid={errors.color && touched.color}
@ -385,7 +385,7 @@ function JsonRowOpDialogAnnotation({
</div> </div>
</TabContent> </TabContent>
<TabContent value="annotations_border"> <TabContent value="annotations_border">
<div className="p-2"> <div className="p-3 grid grid-cols-2 gap-x-4 gap-y-1">
<FormItem <FormItem
label="Visible" label="Visible"
invalid={errors.border?.visible && touched.border?.visible} invalid={errors.border?.visible && touched.border?.visible}
@ -445,25 +445,21 @@ function JsonRowOpDialogAnnotation({
</TabContent> </TabContent>
</Tabs> </Tabs>
</div> </div>
<div className="text-right mt-4"> </Dialog.Body>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
Cancel <Button variant="plain" onClick={handleClose}>
</Button> Cancel
<Button variant="solid" loading={isSubmitting} type="submit"> </Button>
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')} <Button variant="solid" loading={isSubmitting} type="submit">
</Button> {isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</div> </Button>
</FormContainer> </Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
{data.operation === 'delete' && ( {data.operation === 'delete' && (
<> <Formik
<h5 className="mb-4">Delete</h5>
<p>Silmek istediğinize emin misiniz?</p>
<Formik
initialValues={data} initialValues={data}
onSubmit={async (values, { setSubmitting }) => { onSubmit={async (values, { setSubmitting }) => {
setSubmitting(true) setSubmitting(true)
@ -487,21 +483,22 @@ function JsonRowOpDialogAnnotation({
}} }}
> >
{({ isSubmitting }) => ( {({ isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2">
<div className="text-right mt-4"> <h5>Delete</h5>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <p>Silmek istediğinize emin misiniz?</p>
Cancel </Dialog.Body>
</Button> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button variant="solid" loading={isSubmitting} type="submit"> <Button variant="plain" onClick={handleClose}>
{isSubmitting ? 'Deleting' : 'Delete'} Cancel
</Button> </Button>
</div> <Button variant="solid" loading={isSubmitting} type="submit">
</FormContainer> {isSubmitting ? 'Deleting' : 'Delete'}
</Button>
</Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
</Dialog> </Dialog>
) )

224
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogEditForm.tsx
View file

@ -3,7 +3,6 @@ import {
Card, Card,
Checkbox, Checkbox,
Dialog, Dialog,
FormContainer,
FormItem, FormItem,
Input, Input,
Notification, Notification,
@ -140,64 +139,64 @@ function JsonRowOpDialogEditForm({
<Dialog <Dialog
id="editFormOperation" id="editFormOperation"
width={1200} width={1200}
height="90vh"
isOpen={isOpen} isOpen={isOpen}
preventScroll={true} preventScroll={true}
onClose={handleClose} onClose={handleClose}
onRequestClose={handleClose} onRequestClose={handleClose}
> >
{(data.operation === 'create' || data.operation === 'update') && ( {(data.operation === 'create' || data.operation === 'update') && (
<> <Formik
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5> initialValues={
<Formik data.editFormValues ?? {
initialValues={ order: 1,
data.editFormValues ?? { itemType: 'group',
order: 1, caption: '',
itemType: 'group', colCount: 1,
caption: '', colSpan: 2,
colCount: 1, items: [],
colSpan: 2,
items: [],
}
} }
validationSchema={schema} }
onSubmit={async (values, { setSubmitting }) => { validationSchema={schema}
setSubmitting(true) onSubmit={async (values, { setSubmitting }) => {
try { setSubmitting(true)
const input: ListFormJsonRowDto = { try {
index: data.index, const input: ListFormJsonRowDto = {
fieldName: data.tabName, index: data.index,
itemEditingForm: values, fieldName: data.tabName,
} itemEditingForm: values,
if (data.index === -1) {
await postListFormJsonRow(data.id, input)
} else {
await putListFormJsonRow(data.id, input)
}
toast.push(
<Notification type="success">
{data.index === -1 ? 'Kayıt eklendi' : 'Kayıt güncellendi'}
</Notification>,
{ placement: 'top-end' },
)
handleClose()
} catch (error: any) {
toast.push(
<Notification type="danger">
Hata
<code>{error}</code>
</Notification>,
{ placement: 'top-end' },
)
} finally {
setSubmitting(false)
} }
}}
> if (data.index === -1) {
{({ touched, errors, values, isSubmitting }) => ( await postListFormJsonRow(data.id, input)
<Form> } else {
<FormContainer size="sm"> await putListFormJsonRow(data.id, input)
<div className="h-full overflow-y-auto p-2"> }
toast.push(
<Notification type="success">
{data.index === -1 ? 'Kayıt eklendi' : 'Kayıt güncellendi'}
</Notification>,
{ placement: 'top-end' },
)
handleClose()
} catch (error: any) {
toast.push(
<Notification type="danger">
Hata
<code>{error}</code>
</Notification>,
{ placement: 'top-end' },
)
} finally {
setSubmitting(false)
}
}}
>
{({ touched, errors, values, isSubmitting }) => (
<Form className="flex flex-col h-full">
<Dialog.Body className="flex flex-col gap-2 overflow-hidden">
<h5 className="flex-shrink-0">{data.index === -1 ? 'Add' : 'Update'}</h5>
<div className="flex-1 overflow-y-auto p-2">
<div className="grid grid-cols-5 gap-4 w-full"> <div className="grid grid-cols-5 gap-4 w-full">
<FormItem <FormItem
label="Order" label="Order"
@ -807,70 +806,69 @@ function JsonRowOpDialogEditForm({
)} )}
/> />
</FormItem> </FormItem>
</div> </div>
<div className="text-right mt-4"> </Dialog.Body>
<Button <Dialog.Footer className="flex justify-between items-center border-t pt-3 mt-1">
type="button" <Button
variant="solid" type="button"
className="text-white bg-red-600 hover:bg-red-700 ltr:mr-2 rtl:ml-2" variant="solid"
onClick={() => setIsHelperOpen(true)} className="text-white bg-red-600 hover:bg-red-700"
> onClick={() => setIsHelperOpen(true)}
{translate('::ListForms.ListFormFieldEdit.HelperOpen')} >
</Button> {translate('::ListForms.ListFormFieldEdit.HelperOpen')}
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> </Button>
Cancel <div className="flex gap-2">
</Button> <Button variant="plain" onClick={handleClose}>
<Button variant="solid" loading={isSubmitting} type="submit"> Cancel
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')} </Button>
</Button> <Button variant="solid" loading={isSubmitting} type="submit">
</div> {isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</FormContainer> </Button>
</Form> </div>
)} </Dialog.Footer>
</Formik> </Form>
</> )}
</Formik>
)} )}
{data.operation === 'delete' && ( {data.operation === 'delete' && (
<> <Formik
<h5 className="mb-4">Delete</h5> initialValues={data}
<p>Silmek istediğinize emin misiniz?</p> onSubmit={async (values, { setSubmitting }) => {
<Formik setSubmitting(true)
initialValues={data} try {
onSubmit={async (values, { setSubmitting }) => { await deleteListFormJsonRow(data.id, data.tabName, values.index)
setSubmitting(true) toast.push(<Notification type="success">Kayıt silindi </Notification>)
try { handleClose()
await deleteListFormJsonRow(data.id, data.tabName, values.index) } catch (error: any) {
toast.push(<Notification type="success">Kayıt silindi </Notification>) toast.push(
handleClose() <Notification type="danger">
} catch (error: any) { Hata
toast.push( <code>{error}</code>
<Notification type="danger"> </Notification>,
Hata { placement: 'top-end' },
<code>{error}</code> )
</Notification>, } finally {
{ placement: 'top-end' }, setSubmitting(false)
) }
} finally { }}
setSubmitting(false) >
} {({ isSubmitting }) => (
}} <Form className="flex flex-col h-full">
> <Dialog.Body className="flex flex-col gap-2">
{({ isSubmitting }) => ( <h5>Delete</h5>
<Form> <p>Silmek istediğinize emin misiniz?</p>
<FormContainer size="sm"> </Dialog.Body>
<div className="text-right mt-4"> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <Button variant="plain" onClick={handleClose}>
Cancel Cancel
</Button> </Button>
<Button variant="solid" loading={isSubmitting} type="submit"> <Button variant="solid" loading={isSubmitting} type="submit">
{isSubmitting ? 'Deleting' : 'Delete'} {isSubmitting ? 'Deleting' : 'Delete'}
</Button> </Button>
</div> </Dialog.Footer>
</FormContainer> </Form>
</Form> )}
)} </Formik>
</Formik>
</>
)} )}
</Dialog> </Dialog>
) )

72
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSeries.tsx
View file

@ -3,7 +3,6 @@ import {
Card, Card,
Checkbox, Checkbox,
Dialog, Dialog,
FormContainer,
FormItem, FormItem,
Input, Input,
Notification, Notification,
@ -132,11 +131,11 @@ function JsonRowOpDialogSeries({
preventScroll={true} preventScroll={true}
onClose={handleClose} onClose={handleClose}
onRequestClose={handleClose} onRequestClose={handleClose}
width={900}
height="90vh"
> >
{(data.operation === 'create' || data.operation === 'update') && ( {(data.operation === 'create' || data.operation === 'update') && (
<> <Formik
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
<Formik
initialValues={ initialValues={
data.chartSeriesValues ?? { data.chartSeriesValues ?? {
index: -1, index: -1,
@ -208,9 +207,13 @@ function JsonRowOpDialogSeries({
}} }}
> >
{({ touched, errors, values, isSubmitting }) => ( {({ touched, errors, values, isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2 overflow-hidden">
<div className="h-full overflow-y-auto p-2"> <h5 className="flex-shrink-0">{data.index === -1 ? 'Add' : 'Update'}</h5>
<div className="flex-1 overflow-y-auto p-2">
<div className="grid grid-cols-2 gap-6">
{/* Sol Kolon */}
<div className="flex flex-col gap-1">
<FormItem <FormItem
label="Visible" label="Visible"
invalid={errors.visible && touched.visible} invalid={errors.visible && touched.visible}
@ -446,7 +449,9 @@ function JsonRowOpDialogSeries({
> >
<Field type="number" name="cornerRadius" component={Input} /> <Field type="number" name="cornerRadius" component={Input} />
</FormItem> </FormItem>
</div>
{/* Sağ Kolon - Label */}
<div className="flex flex-col gap-1">
<Card className="my-2" header="Label"> <Card className="my-2" header="Label">
<FormItem label="Label Visible"> <FormItem label="Label Visible">
<Field name="label.visible" component={Checkbox} /> <Field name="label.visible" component={Checkbox} />
@ -525,26 +530,24 @@ function JsonRowOpDialogSeries({
</FormItem> </FormItem>
</Card> </Card>
</Card> </Card>
</div>
</div>
</div> </div>
<div className="text-right mt-4"> </Dialog.Body>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
Cancel <Button variant="plain" onClick={handleClose}>
</Button> Cancel
<Button variant="solid" loading={isSubmitting} type="submit"> </Button>
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')} <Button variant="solid" loading={isSubmitting} type="submit">
</Button> {isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</div> </Button>
</FormContainer> </Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
{data.operation === 'delete' && ( {data.operation === 'delete' && (
<> <Formik
<h5 className="mb-4">Delete</h5>
<p>Silmek istediğinize emin misiniz?</p>
<Formik
initialValues={data} initialValues={data}
onSubmit={async (values, { setSubmitting }) => { onSubmit={async (values, { setSubmitting }) => {
setSubmitting(true) setSubmitting(true)
@ -568,21 +571,22 @@ function JsonRowOpDialogSeries({
}} }}
> >
{({ isSubmitting }) => ( {({ isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2">
<div className="text-right mt-4"> <h5>Delete</h5>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <p>Silmek istediğinize emin misiniz?</p>
Cancel </Dialog.Body>
</Button> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button variant="solid" loading={isSubmitting} type="submit"> <Button variant="plain" onClick={handleClose}>
{isSubmitting ? 'Deleting' : 'Delete'} Cancel
</Button> </Button>
</div> <Button variant="solid" loading={isSubmitting} type="submit">
</FormContainer> {isSubmitting ? 'Deleting' : 'Delete'}
</Button>
</Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
</Dialog> </Dialog>
) )

62
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogSubForm.tsx
View file

@ -2,7 +2,6 @@ import {
Button, Button,
Checkbox, Checkbox,
Dialog, Dialog,
FormContainer,
FormItem, FormItem,
Input, Input,
Notification, Notification,
@ -70,15 +69,14 @@ function JsonRowOpDialogSubForm({
<Dialog <Dialog
id="subFormOperation" id="subFormOperation"
width={900} width={900}
height="90vh"
isOpen={isOpen} isOpen={isOpen}
preventScroll={true} preventScroll={true}
onClose={handleClose} onClose={handleClose}
onRequestClose={handleClose} onRequestClose={handleClose}
> >
{(data.operation === 'create' || data.operation === 'update') && ( {(data.operation === 'create' || data.operation === 'update') && (
<> <Formik
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
<Formik
initialValues={ initialValues={
data.subFormValues ?? { data.subFormValues ?? {
tabTitle: '', tabTitle: '',
@ -124,9 +122,10 @@ function JsonRowOpDialogSubForm({
}} }}
> >
{({ touched, errors, values, isSubmitting }) => ( {({ touched, errors, values, isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2 overflow-hidden">
<div className="h-[500px] overflow-y-auto p-2"> <h5 className="flex-shrink-0">{data.index === -1 ? 'Add' : 'Update'}</h5>
<div className="flex-1 overflow-y-auto p-2">
<div className="grid grid-cols-4 gap-4"> <div className="grid grid-cols-4 gap-4">
<FormItem <FormItem
label="Tab Title" label="Tab Title"
@ -289,25 +288,21 @@ function JsonRowOpDialogSubForm({
/> />
</FormItem> </FormItem>
</div> </div>
<div className="text-right mt-4"> </Dialog.Body>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
Cancel <Button variant="plain" onClick={handleClose}>
</Button> Cancel
<Button variant="solid" loading={isSubmitting} type="submit"> </Button>
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')} <Button variant="solid" loading={isSubmitting} type="submit">
</Button> {isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</div> </Button>
</FormContainer> </Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
{data.operation === 'delete' && ( {data.operation === 'delete' && (
<> <Formik
<h5 className="mb-4">Delete</h5>
<p>Silmek istediğinize emin misiniz?</p>
<Formik
initialValues={data} initialValues={data}
onSubmit={async (values, { setSubmitting }) => { onSubmit={async (values, { setSubmitting }) => {
setSubmitting(true) setSubmitting(true)
@ -330,21 +325,22 @@ function JsonRowOpDialogSubForm({
}} }}
> >
{({ isSubmitting }) => ( {({ isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2">
<div className="text-right mt-4"> <h5>Delete</h5>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <p>Silmek istediğinize emin misiniz?</p>
Cancel </Dialog.Body>
</Button> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button variant="solid" loading={isSubmitting} type="submit"> <Button variant="plain" onClick={handleClose}>
{isSubmitting ? 'Deleting' : 'Delete'} Cancel
</Button> </Button>
</div> <Button variant="solid" loading={isSubmitting} type="submit">
</FormContainer> {isSubmitting ? 'Deleting' : 'Delete'}
</Button>
</Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
</Dialog> </Dialog>
) )

68
ui/src/views/admin/listForm/edit/json-row-operations/JsonRowOpDialogWidget.tsx
View file

@ -2,7 +2,6 @@ import {
Button, Button,
Checkbox, Checkbox,
Dialog, Dialog,
FormContainer,
FormItem, FormItem,
Input, Input,
Notification, Notification,
@ -80,12 +79,11 @@ function JsonRowOpDialogWidget({
preventScroll={true} preventScroll={true}
onClose={handleClose} onClose={handleClose}
onRequestClose={handleClose} onRequestClose={handleClose}
width={data.operation === 'create' || data.operation === 'update' ? 'sm' : '450px'} width={data.operation === 'create' || data.operation === 'update' ? 900 : 450}
height="90vh"
> >
{(data.operation === 'create' || data.operation === 'update') && ( {(data.operation === 'create' || data.operation === 'update') && (
<> <Formik
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
<Formik
initialValues={ initialValues={
data.widgetValues ?? { data.widgetValues ?? {
colGap: 3, colGap: 3,
@ -138,9 +136,10 @@ function JsonRowOpDialogWidget({
}} }}
> >
{({ touched, errors, values, isSubmitting, setFieldValue }) => ( {({ touched, errors, values, isSubmitting, setFieldValue }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2 overflow-hidden">
<div className="h-full overflow-y-auto p-1"> <h5 className="flex-shrink-0">{data.index === -1 ? 'Add' : 'Update'}</h5>
<div className="flex-1 overflow-y-auto p-1">
<div className="grid grid-cols-5 gap-4"> <div className="grid grid-cols-5 gap-4">
<FormItem <FormItem
label="Column Gap (Sütun Boşluğu)" label="Column Gap (Sütun Boşluğu)"
@ -266,12 +265,12 @@ function JsonRowOpDialogWidget({
> >
<div <div
className="border rounded-lg overflow-hidden" className="border rounded-lg overflow-hidden"
style={{ height: '200px' }} style={{ height: '35vh' }}
> >
<SqlEditor <SqlEditor
value={values.sqlQuery || ''} value={values.sqlQuery || ''}
onChange={(value) => setFieldValue('sqlQuery', value || '')} onChange={(value) => setFieldValue('sqlQuery', value || '')}
height="200px" height="35vh"
/> />
</div> </div>
</FormItem> </FormItem>
@ -426,25 +425,21 @@ function JsonRowOpDialogWidget({
/> />
</FormItem> </FormItem>
</div> </div>
<div className="text-right mt-2"> </Dialog.Body>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
Cancel <Button variant="plain" onClick={handleClose}>
</Button> Cancel
<Button variant="solid" loading={isSubmitting} type="submit"> </Button>
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')} <Button variant="solid" loading={isSubmitting} type="submit">
</Button> {isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
</div> </Button>
</FormContainer> </Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
{data.operation === 'delete' && ( {data.operation === 'delete' && (
<> <Formik
<h5 className="mb-4">Delete</h5>
<p>Silmek istediğinize emin misiniz?</p>
<Formik
initialValues={data} initialValues={data}
onSubmit={async (values, { setSubmitting }) => { onSubmit={async (values, { setSubmitting }) => {
setSubmitting(true) setSubmitting(true)
@ -469,21 +464,22 @@ function JsonRowOpDialogWidget({
}} }}
> >
{({ isSubmitting }) => ( {({ isSubmitting }) => (
<Form> <Form className="flex flex-col h-full">
<FormContainer size="sm"> <Dialog.Body className="flex flex-col gap-2">
<div className="text-right mt-4"> <h5>Delete</h5>
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}> <p>Silmek istediğinize emin misiniz?</p>
Cancel </Dialog.Body>
</Button> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button variant="solid" loading={isSubmitting} type="submit"> <Button variant="plain" onClick={handleClose}>
{isSubmitting ? 'Deleting' : 'Delete'} Cancel
</Button> </Button>
</div> <Button variant="solid" loading={isSubmitting} type="submit">
</FormContainer> {isSubmitting ? 'Deleting' : 'Delete'}
</Button>
</Dialog.Footer>
</Form> </Form>
)} )}
</Formik> </Formik>
</>
)} )}
</Dialog> </Dialog>
) )

191
ui/src/views/admin/videoroom/RoomList.tsx
View file

@ -31,7 +31,7 @@ import { Helmet } from 'react-helmet'
import { useLocalization } from '@/utils/hooks/useLocalization' import { useLocalization } from '@/utils/hooks/useLocalization'
import { VideoroomDto } from '@/proxy/videoroom/models' import { VideoroomDto } from '@/proxy/videoroom/models'
import classNames from 'classnames' import classNames from 'classnames'
import { Button, Input } from '@/components/ui' import { Button, Dialog, Input } from '@/components/ui'
import { FcVideoCall } from 'react-icons/fc' import { FcVideoCall } from 'react-icons/fc'
export interface RoomProps { export interface RoomProps {
@ -508,25 +508,35 @@ const RoomList: React.FC = () => {
</div> </div>
{/* Class Modal (Create/Edit) */} {/* Class Modal (Create/Edit) */}
{(showCreateModal || (showEditModal && videoroom)) && ( <Dialog
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4"> isOpen={showCreateModal || (showEditModal && !!videoroom)}
<motion.div onClose={() => {
initial={{ opacity: 0, scale: 0.95 }} setShowCreateModal(false)
animate={{ opacity: 1, scale: 1 }} setShowEditModal(false)
className="bg-white rounded-lg max-w-2xl w-full max-h-[95vh] overflow-y-auto" }}
> onRequestClose={() => {
<div className="p-3 sm:p-3 border-b border-gray-200"> setShowCreateModal(false)
<h2 className="text-xl sm:text-2xl font-bold text-gray-900"> setShowEditModal(false)
}}
width={800}
height="90vh"
>
<form
onSubmit={showCreateModal ? handleCreateClass : handleEditClass}
className="flex flex-col h-full"
>
<Dialog.Body className="flex flex-col gap-2 overflow-hidden">
{/* Header */}
<div className="flex items-center gap-3 border-b pb-3 flex-shrink-0">
<FcVideoCall className="text-2xl" />
<h5 className="font-bold">
{showCreateModal {showCreateModal
? translate('::App.Videoroom.CreateRoom') || 'Yeni Sınıf Oluştur' ? translate('::App.Videoroom.CreateRoom') || 'Yeni Oda Oluştur'
: translate('::App.Videoroom.EditRoom') || 'Sınıfı Düzenle'} : translate('::App.Videoroom.EditRoom') || 'Odayı Düzenle'}
</h2> </h5>
</div> </div>
<form <div className="flex-1 overflow-y-auto p-1 space-y-4">
onSubmit={showCreateModal ? handleCreateClass : handleEditClass}
className="p-4 sm:p-6 space-y-4 sm:space-y-6"
>
<div> <div>
<label className="block text-sm font-medium text-gray-700 mb-2"> <label className="block text-sm font-medium text-gray-700 mb-2">
{translate('::App.Listform.ListformField.RoomName') || 'Room Name'} * {translate('::App.Listform.ListformField.RoomName') || 'Room Name'} *
@ -851,87 +861,80 @@ const RoomList: React.FC = () => {
</div> </div>
</div> </div>
<div className="flex items-center justify-end space-x-4 pt-6 border-t border-gray-200"> </div>
<button </Dialog.Body>
type="button"
onClick={() => {
if (showCreateModal) {
setShowCreateModal(false)
}
if (showEditModal) { <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
setShowEditModal(false) <Button
setVideoroom(newClassEntity) type="button"
resetForm() variant="plain"
} onClick={() => {
}} if (showCreateModal) setShowCreateModal(false)
className="px-3 py-1 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors" if (showEditModal) {
> setShowEditModal(false)
{translate('::Cancel') || 'İptal'} setVideoroom(newClassEntity)
</button> resetForm()
<button }
type="submit" }}
className="px-3 py-1 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors" >
> {translate('::Cancel') || 'İptal'}
{showCreateModal </Button>
? translate('::App.Videoroom.CreateRoom') || 'Sınıf Oluştur' <Button type="submit" variant="solid" color="blue-600">
: translate('::App.Videoroom.SaveChanges') || 'Değişiklikleri Kaydet'} {showCreateModal
</button> ? translate('::App.Videoroom.CreateRoom') || 'Oda Oluştur'
</div> : translate('::App.Videoroom.SaveChanges') || 'Değişiklikleri Kaydet'}
</form> </Button>
</motion.div> </Dialog.Footer>
</div> </form>
)} </Dialog>
{/* Delete Confirmation Modal */} {/* Delete Confirmation Modal */}
{showDeleteModal && videoroom && ( <Dialog
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"> isOpen={showDeleteModal && !!videoroom}
<motion.div onClose={() => {
initial={{ opacity: 0, scale: 0.95 }} setShowDeleteModal(false)
animate={{ opacity: 1, scale: 1 }} setVideoroom(newClassEntity)
className="bg-white rounded-lg max-w-md w-full mx-4" }}
> onRequestClose={() => {
<div className="p-6"> setShowDeleteModal(false)
<div className="flex items-center mb-4"> setVideoroom(newClassEntity)
<div className="p-3 bg-red-100 rounded-full mr-4"> }}
<FaTrash className="text-red-600" size={24} /> width={480}
</div> >
<div> <Dialog.Body className="flex flex-col gap-3">
<h3 className="text-lg font-semibold text-gray-900"> <div className="flex items-center gap-4">
{translate('::App.Videoroom.DeleteRoom') || 'Sınıfı Sil'} <div className="p-3 bg-red-100 rounded-full flex-shrink-0">
</h3> <FaTrash className="text-red-600" size={20} />
<p className="text-sm text-gray-600">
{translate('::App.Videoroom.DeleteRoomWarning') || 'Bu işlem geri alınamaz'}
</p>
</div>
</div>
<p className="text-gray-700 mb-6">
{translate('::DeleteConfirmation') ||
'Bu sınıfı silmek istediğinize emin misiniz?'}
</p>
<div className="flex items-center justify-end space-x-4">
<button
onClick={() => {
setShowDeleteModal(false)
setVideoroom(newClassEntity)
}}
className="px-4 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
>
{translate('::App.Common.Cancel') || 'İptal'}
</button>
<button
onClick={handleDeleteClass}
className="px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors"
>
{translate('::App.Platform.Delete') || 'Sil'}
</button>
</div>
</div> </div>
</motion.div> <div>
</div> <h5 className="font-bold">
)} {translate('::App.Videoroom.DeleteRoom') || 'Odayı Sil'}
</h5>
<p className="text-sm text-gray-500">
{translate('::App.Videoroom.DeleteRoomWarning') || 'Bu işlem geri alınamaz'}
</p>
</div>
</div>
<p className="text-sm text-gray-700">
{translate('::DeleteConfirmation') || 'Bu odayı silmek istediğinize emin misiniz?'}
</p>
</Dialog.Body>
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button
variant="plain"
onClick={() => {
setShowDeleteModal(false)
setVideoroom(newClassEntity)
}}
>
{translate('::Cancel') || 'İptal'}
</Button>
<Button variant="solid" color="red-600" onClick={handleDeleteClass}>
{translate('::App.Platform.Delete') || 'Sil'}
</Button>
</Dialog.Footer>
</Dialog>
</Container> </Container>
</> </>
) )

75
ui/src/views/developerKit/SqlQueryManager.tsx
View file

@ -1162,13 +1162,13 @@ GO`,
isOpen={showCopyDialog} isOpen={showCopyDialog}
onClose={() => !isCopyingObjects && setShowCopyDialog(false)} onClose={() => !isCopyingObjects && setShowCopyDialog(false)}
onRequestClose={() => !isCopyingObjects && setShowCopyDialog(false)} onRequestClose={() => !isCopyingObjects && setShowCopyDialog(false)}
contentClassName="max-h-[85vh] overflow-hidden" width={1050}
> >
<div className="flex h-full max-h-[85vh] flex-col"> <Dialog.Body className="flex flex-col gap-2">
<h5 className="mb-3">{translate('::App.Platform.CopySelectedObjects')}</h5> <h5 className="mb-1 flex-shrink-0">{translate('::App.Platform.CopySelectedObjects')}</h5>
{/* Mode Tabs */} {/* Mode Tabs */}
<div className="flex gap-2 mb-4 border-b"> <div className="flex gap-2 mb-2 border-b flex-shrink-0">
<button <button
onClick={() => setCopyDialogMode('objects')} onClick={() => setCopyDialogMode('objects')}
className={`px-4 py-2 font-medium text-sm border-b-2 transition ${ className={`px-4 py-2 font-medium text-sm border-b-2 transition ${
@ -1193,7 +1193,7 @@ GO`,
</button> </button>
</div> </div>
<div className="flex-1 overflow-y-auto pr-1"> <div className="flex-1 min-h-0 overflow-y-auto pr-1">
{copyDialogMode === 'objects' ? ( {copyDialogMode === 'objects' ? (
<> <>
{/* Objects Mode */} {/* Objects Mode */}
@ -1322,32 +1322,32 @@ GO`,
</> </>
)} )}
</div> </div>
</Dialog.Body>
<div className="mt-2 flex justify-end gap-2 border-t pt-3"> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button <Button
variant="plain" variant="plain"
onClick={() => setShowCopyDialog(false)} onClick={() => setShowCopyDialog(false)}
disabled={isCopyingObjects} disabled={isCopyingObjects}
> >
{translate('::Cancel')} {translate('::Cancel')}
</Button> </Button>
<Button <Button
variant="solid" variant="solid"
onClick={copyDialogMode === 'objects' ? handleCopyObjects : handleExecuteDirectSql} onClick={copyDialogMode === 'objects' ? handleCopyObjects : handleExecuteDirectSql}
loading={isCopyingObjects} loading={isCopyingObjects}
disabled={ disabled={
copyTargetDataSources.length === 0 || copyTargetDataSources.length === 0 ||
(copyDialogMode === 'objects' (copyDialogMode === 'objects'
? selectedExplorerObjects.length === 0 ? selectedExplorerObjects.length === 0
: !sqlScriptForCopy?.trim()) : !sqlScriptForCopy?.trim())
} }
> >
{copyDialogMode === 'objects' {copyDialogMode === 'objects'
? translate('::Copy') ? translate('::Copy')
: translate('::App.Platform.Execute') || 'Calistir'} : translate('::App.Platform.Execute') || 'Calistir'}
</Button> </Button>
</div> </Dialog.Footer>
</div>
</Dialog> </Dialog>
<Dialog <Dialog
@ -1355,14 +1355,13 @@ GO`,
onClose={() => setShowCopyResultDialog(false)} onClose={() => setShowCopyResultDialog(false)}
onRequestClose={() => setShowCopyResultDialog(false)} onRequestClose={() => setShowCopyResultDialog(false)}
width={1050} width={1050}
contentClassName="max-h-[85vh] overflow-hidden"
> >
<div className="flex h-full max-h-[85vh] flex-col"> <Dialog.Body className="flex flex-col gap-2">
<h5 className="mb-3"> <h5 className="mb-1 flex-shrink-0">
{translate('::App.Platform.Results') || 'Kopyalama Sonuc Detaylari'} {translate('::App.Platform.Results') || 'Kopyalama Sonuc Detaylari'}
</h5> </h5>
<div className="grid grid-cols-1 sm:grid-cols-3 gap-2 mb-3 text-xs sm:text-sm"> <div className="grid grid-cols-1 sm:grid-cols-3 gap-2 mb-2 text-xs sm:text-sm flex-shrink-0">
<div className="rounded border border-green-200 bg-green-50 px-3 py-2 text-green-700"> <div className="rounded border border-green-200 bg-green-50 px-3 py-2 text-green-700">
{translate('::App.Platform.Success')}: <strong>{copySuccessCount}</strong> {translate('::App.Platform.Success')}: <strong>{copySuccessCount}</strong>
</div> </div>
@ -1374,7 +1373,7 @@ GO`,
</div> </div>
</div> </div>
<div className="flex-1 overflow-auto border rounded"> <div className="flex-1 min-h-0 overflow-auto border rounded">
<div className="md:hidden p-2 space-y-2"> <div className="md:hidden p-2 space-y-2">
{copyResults.map((row, idx) => { {copyResults.map((row, idx) => {
const isError = row.status === 'error' const isError = row.status === 'error'
@ -1508,13 +1507,13 @@ GO`,
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </Dialog.Body>
<div className="flex justify-end gap-2 mt-4"> <Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
<Button variant="solid" onClick={() => setShowCopyResultDialog(false)}> <Button variant="solid" onClick={() => setShowCopyResultDialog(false)}>
{translate('::App.Platform.Close')} {translate('::App.Platform.Close')}
</Button> </Button>
</div> </Dialog.Footer>
</Dialog> </Dialog>
</Container> </Container>
) )