modal düzenlemeler
This commit is contained in:
Sedat ÖZTÜRK
parent
a891beca3a
commit
f62d4b1a74
7 changed files with 377 additions and 384 deletions
|
|
@ -2,7 +2,6 @@ import {
|
|||
Button,
|
||||
Checkbox,
|
||||
Dialog,
|
||||
FormContainer,
|
||||
FormItem,
|
||||
Input,
|
||||
Notification,
|
||||
|
|
@ -91,11 +90,11 @@ function JsonRowOpDialogAnnotation({
|
|||
preventScroll={true}
|
||||
onClose={handleClose}
|
||||
onRequestClose={handleClose}
|
||||
width={900}
|
||||
height="90vh"
|
||||
>
|
||||
{(data.operation === 'create' || data.operation === 'update') && (
|
||||
<>
|
||||
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={
|
||||
data.chartAnnotationValues ?? {
|
||||
argument: '',
|
||||
|
|
@ -167,16 +166,17 @@ function JsonRowOpDialogAnnotation({
|
|||
}}
|
||||
>
|
||||
{({ touched, errors, values, isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="h-full overflow-y-auto p-2">
|
||||
<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">
|
||||
<Tabs defaultValue="annotations_general">
|
||||
<TabList>
|
||||
<TabNav value="annotations_general">General</TabNav>
|
||||
<TabNav value="annotations_border">Border</TabNav>
|
||||
</TabList>
|
||||
<TabContent value="annotations_general">
|
||||
<div className="p-2">
|
||||
<div className="p-3 grid grid-cols-3 gap-x-4 gap-y-1">
|
||||
<FormItem
|
||||
label="Tooltip Enabled"
|
||||
invalid={errors.tooltipEnabled && touched.tooltipEnabled}
|
||||
|
|
@ -262,7 +262,7 @@ function JsonRowOpDialogAnnotation({
|
|||
>
|
||||
<Field name="argument" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
|
||||
<FormItem
|
||||
label="Color"
|
||||
invalid={errors.color && touched.color}
|
||||
|
|
@ -385,7 +385,7 @@ function JsonRowOpDialogAnnotation({
|
|||
</div>
|
||||
</TabContent>
|
||||
<TabContent value="annotations_border">
|
||||
<div className="p-2">
|
||||
<div className="p-3 grid grid-cols-2 gap-x-4 gap-y-1">
|
||||
<FormItem
|
||||
label="Visible"
|
||||
invalid={errors.border?.visible && touched.border?.visible}
|
||||
|
|
@ -445,25 +445,21 @@ function JsonRowOpDialogAnnotation({
|
|||
</TabContent>
|
||||
</Tabs>
|
||||
</div>
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
</Dialog.Body>
|
||||
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
|
||||
<Button variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
{data.operation === 'delete' && (
|
||||
<>
|
||||
<h5 className="mb-4">Delete</h5>
|
||||
<p>Silmek istediğinize emin misiniz?</p>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={data}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
|
|
@ -487,21 +483,22 @@ function JsonRowOpDialogAnnotation({
|
|||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
<Form className="flex flex-col h-full">
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5>Delete</h5>
|
||||
<p>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={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
</Dialog>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@ import {
|
|||
Card,
|
||||
Checkbox,
|
||||
Dialog,
|
||||
FormContainer,
|
||||
FormItem,
|
||||
Input,
|
||||
Notification,
|
||||
|
|
@ -140,64 +139,64 @@ function JsonRowOpDialogEditForm({
|
|||
<Dialog
|
||||
id="editFormOperation"
|
||||
width={1200}
|
||||
height="90vh"
|
||||
isOpen={isOpen}
|
||||
preventScroll={true}
|
||||
onClose={handleClose}
|
||||
onRequestClose={handleClose}
|
||||
>
|
||||
{(data.operation === 'create' || data.operation === 'update') && (
|
||||
<>
|
||||
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
|
||||
<Formik
|
||||
initialValues={
|
||||
data.editFormValues ?? {
|
||||
order: 1,
|
||||
itemType: 'group',
|
||||
caption: '',
|
||||
colCount: 1,
|
||||
colSpan: 2,
|
||||
items: [],
|
||||
}
|
||||
<Formik
|
||||
initialValues={
|
||||
data.editFormValues ?? {
|
||||
order: 1,
|
||||
itemType: 'group',
|
||||
caption: '',
|
||||
colCount: 1,
|
||||
colSpan: 2,
|
||||
items: [],
|
||||
}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
try {
|
||||
const input: ListFormJsonRowDto = {
|
||||
index: data.index,
|
||||
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)
|
||||
}
|
||||
validationSchema={schema}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
try {
|
||||
const input: ListFormJsonRowDto = {
|
||||
index: data.index,
|
||||
fieldName: data.tabName,
|
||||
itemEditingForm: values,
|
||||
}
|
||||
}}
|
||||
>
|
||||
{({ touched, errors, values, isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="h-full overflow-y-auto p-2">
|
||||
|
||||
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)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{({ 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">
|
||||
<FormItem
|
||||
label="Order"
|
||||
|
|
@ -807,70 +806,69 @@ function JsonRowOpDialogEditForm({
|
|||
)}
|
||||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div className="text-right mt-4">
|
||||
<Button
|
||||
type="button"
|
||||
variant="solid"
|
||||
className="text-white bg-red-600 hover:bg-red-700 ltr:mr-2 rtl:ml-2"
|
||||
onClick={() => setIsHelperOpen(true)}
|
||||
>
|
||||
{translate('::ListForms.ListFormFieldEdit.HelperOpen')}
|
||||
</Button>
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
</div>
|
||||
</Dialog.Body>
|
||||
<Dialog.Footer className="flex justify-between items-center border-t pt-3 mt-1">
|
||||
<Button
|
||||
type="button"
|
||||
variant="solid"
|
||||
className="text-white bg-red-600 hover:bg-red-700"
|
||||
onClick={() => setIsHelperOpen(true)}
|
||||
>
|
||||
{translate('::ListForms.ListFormFieldEdit.HelperOpen')}
|
||||
</Button>
|
||||
<div className="flex gap-2">
|
||||
<Button variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</div>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
)}
|
||||
{data.operation === 'delete' && (
|
||||
<>
|
||||
<h5 className="mb-4">Delete</h5>
|
||||
<p>Silmek istediğinize emin misiniz?</p>
|
||||
<Formik
|
||||
initialValues={data}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
try {
|
||||
await deleteListFormJsonRow(data.id, data.tabName, values.index)
|
||||
toast.push(<Notification type="success">Kayıt silindi </Notification>)
|
||||
handleClose()
|
||||
} catch (error: any) {
|
||||
toast.push(
|
||||
<Notification type="danger">
|
||||
Hata
|
||||
<code>{error}</code>
|
||||
</Notification>,
|
||||
{ placement: 'top-end' },
|
||||
)
|
||||
} finally {
|
||||
setSubmitting(false)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
<Formik
|
||||
initialValues={data}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
try {
|
||||
await deleteListFormJsonRow(data.id, data.tabName, values.index)
|
||||
toast.push(<Notification type="success">Kayıt silindi </Notification>)
|
||||
handleClose()
|
||||
} catch (error: any) {
|
||||
toast.push(
|
||||
<Notification type="danger">
|
||||
Hata
|
||||
<code>{error}</code>
|
||||
</Notification>,
|
||||
{ placement: 'top-end' },
|
||||
)
|
||||
} finally {
|
||||
setSubmitting(false)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form className="flex flex-col h-full">
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5>Delete</h5>
|
||||
<p>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={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
)}
|
||||
</Dialog>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@ import {
|
|||
Card,
|
||||
Checkbox,
|
||||
Dialog,
|
||||
FormContainer,
|
||||
FormItem,
|
||||
Input,
|
||||
Notification,
|
||||
|
|
@ -132,11 +131,11 @@ function JsonRowOpDialogSeries({
|
|||
preventScroll={true}
|
||||
onClose={handleClose}
|
||||
onRequestClose={handleClose}
|
||||
width={900}
|
||||
height="90vh"
|
||||
>
|
||||
{(data.operation === 'create' || data.operation === 'update') && (
|
||||
<>
|
||||
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={
|
||||
data.chartSeriesValues ?? {
|
||||
index: -1,
|
||||
|
|
@ -208,9 +207,13 @@ function JsonRowOpDialogSeries({
|
|||
}}
|
||||
>
|
||||
{({ touched, errors, values, isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="h-full overflow-y-auto p-2">
|
||||
<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-2 gap-6">
|
||||
{/* Sol Kolon */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<FormItem
|
||||
label="Visible"
|
||||
invalid={errors.visible && touched.visible}
|
||||
|
|
@ -446,7 +449,9 @@ function JsonRowOpDialogSeries({
|
|||
>
|
||||
<Field type="number" name="cornerRadius" component={Input} />
|
||||
</FormItem>
|
||||
|
||||
</div>
|
||||
{/* Sağ Kolon - Label */}
|
||||
<div className="flex flex-col gap-1">
|
||||
<Card className="my-2" header="Label">
|
||||
<FormItem label="Label Visible">
|
||||
<Field name="label.visible" component={Checkbox} />
|
||||
|
|
@ -525,26 +530,24 @@ function JsonRowOpDialogSeries({
|
|||
</FormItem>
|
||||
</Card>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
</Dialog.Body>
|
||||
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
|
||||
<Button variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
{data.operation === 'delete' && (
|
||||
<>
|
||||
<h5 className="mb-4">Delete</h5>
|
||||
<p>Silmek istediğinize emin misiniz?</p>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={data}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
|
|
@ -568,21 +571,22 @@ function JsonRowOpDialogSeries({
|
|||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
<Form className="flex flex-col h-full">
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5>Delete</h5>
|
||||
<p>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={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
</Dialog>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@ import {
|
|||
Button,
|
||||
Checkbox,
|
||||
Dialog,
|
||||
FormContainer,
|
||||
FormItem,
|
||||
Input,
|
||||
Notification,
|
||||
|
|
@ -70,15 +69,14 @@ function JsonRowOpDialogSubForm({
|
|||
<Dialog
|
||||
id="subFormOperation"
|
||||
width={900}
|
||||
height="90vh"
|
||||
isOpen={isOpen}
|
||||
preventScroll={true}
|
||||
onClose={handleClose}
|
||||
onRequestClose={handleClose}
|
||||
>
|
||||
{(data.operation === 'create' || data.operation === 'update') && (
|
||||
<>
|
||||
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={
|
||||
data.subFormValues ?? {
|
||||
tabTitle: '',
|
||||
|
|
@ -124,9 +122,10 @@ function JsonRowOpDialogSubForm({
|
|||
}}
|
||||
>
|
||||
{({ touched, errors, values, isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="h-[500px] overflow-y-auto p-2">
|
||||
<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-4 gap-4">
|
||||
<FormItem
|
||||
label="Tab Title"
|
||||
|
|
@ -289,25 +288,21 @@ function JsonRowOpDialogSubForm({
|
|||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
</Dialog.Body>
|
||||
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
|
||||
<Button variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
{data.operation === 'delete' && (
|
||||
<>
|
||||
<h5 className="mb-4">Delete</h5>
|
||||
<p>Silmek istediğinize emin misiniz?</p>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={data}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
|
|
@ -330,21 +325,22 @@ function JsonRowOpDialogSubForm({
|
|||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
<Form className="flex flex-col h-full">
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5>Delete</h5>
|
||||
<p>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={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
</Dialog>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -2,7 +2,6 @@ import {
|
|||
Button,
|
||||
Checkbox,
|
||||
Dialog,
|
||||
FormContainer,
|
||||
FormItem,
|
||||
Input,
|
||||
Notification,
|
||||
|
|
@ -80,12 +79,11 @@ function JsonRowOpDialogWidget({
|
|||
preventScroll={true}
|
||||
onClose={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') && (
|
||||
<>
|
||||
<h5 className="mb-4">{data.index === -1 ? 'Add' : 'Update'}</h5>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={
|
||||
data.widgetValues ?? {
|
||||
colGap: 3,
|
||||
|
|
@ -138,9 +136,10 @@ function JsonRowOpDialogWidget({
|
|||
}}
|
||||
>
|
||||
{({ touched, errors, values, isSubmitting, setFieldValue }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="h-full overflow-y-auto p-1">
|
||||
<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-1">
|
||||
<div className="grid grid-cols-5 gap-4">
|
||||
<FormItem
|
||||
label="Column Gap (Sütun Boşluğu)"
|
||||
|
|
@ -266,12 +265,12 @@ function JsonRowOpDialogWidget({
|
|||
>
|
||||
<div
|
||||
className="border rounded-lg overflow-hidden"
|
||||
style={{ height: '200px' }}
|
||||
style={{ height: '35vh' }}
|
||||
>
|
||||
<SqlEditor
|
||||
value={values.sqlQuery || ''}
|
||||
onChange={(value) => setFieldValue('sqlQuery', value || '')}
|
||||
height="200px"
|
||||
height="35vh"
|
||||
/>
|
||||
</div>
|
||||
</FormItem>
|
||||
|
|
@ -426,25 +425,21 @@ function JsonRowOpDialogWidget({
|
|||
/>
|
||||
</FormItem>
|
||||
</div>
|
||||
<div className="text-right mt-2">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
</Dialog.Body>
|
||||
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
|
||||
<Button variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? translate('::SavingWithThreeDot') : translate('::Save')}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
{data.operation === 'delete' && (
|
||||
<>
|
||||
<h5 className="mb-4">Delete</h5>
|
||||
<p>Silmek istediğinize emin misiniz?</p>
|
||||
<Formik
|
||||
<Formik
|
||||
initialValues={data}
|
||||
onSubmit={async (values, { setSubmitting }) => {
|
||||
setSubmitting(true)
|
||||
|
|
@ -469,21 +464,22 @@ function JsonRowOpDialogWidget({
|
|||
}}
|
||||
>
|
||||
{({ isSubmitting }) => (
|
||||
<Form>
|
||||
<FormContainer size="sm">
|
||||
<div className="text-right mt-4">
|
||||
<Button className="ltr:mr-2 rtl:ml-2" variant="plain" onClick={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</div>
|
||||
</FormContainer>
|
||||
<Form className="flex flex-col h-full">
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5>Delete</h5>
|
||||
<p>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={handleClose}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button variant="solid" loading={isSubmitting} type="submit">
|
||||
{isSubmitting ? 'Deleting' : 'Delete'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</>
|
||||
)}
|
||||
</Dialog>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ import { Helmet } from 'react-helmet'
|
|||
import { useLocalization } from '@/utils/hooks/useLocalization'
|
||||
import { VideoroomDto } from '@/proxy/videoroom/models'
|
||||
import classNames from 'classnames'
|
||||
import { Button, Input } from '@/components/ui'
|
||||
import { Button, Dialog, Input } from '@/components/ui'
|
||||
import { FcVideoCall } from 'react-icons/fc'
|
||||
|
||||
export interface RoomProps {
|
||||
|
|
@ -508,25 +508,35 @@ const RoomList: React.FC = () => {
|
|||
</div>
|
||||
|
||||
{/* Class Modal (Create/Edit) */}
|
||||
{(showCreateModal || (showEditModal && videoroom)) && (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.95 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
className="bg-white rounded-lg max-w-2xl w-full max-h-[95vh] overflow-y-auto"
|
||||
>
|
||||
<div className="p-3 sm:p-3 border-b border-gray-200">
|
||||
<h2 className="text-xl sm:text-2xl font-bold text-gray-900">
|
||||
<Dialog
|
||||
isOpen={showCreateModal || (showEditModal && !!videoroom)}
|
||||
onClose={() => {
|
||||
setShowCreateModal(false)
|
||||
setShowEditModal(false)
|
||||
}}
|
||||
onRequestClose={() => {
|
||||
setShowCreateModal(false)
|
||||
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
|
||||
? translate('::App.Videoroom.CreateRoom') || 'Yeni Sınıf Oluştur'
|
||||
: translate('::App.Videoroom.EditRoom') || 'Sınıfı Düzenle'}
|
||||
</h2>
|
||||
? translate('::App.Videoroom.CreateRoom') || 'Yeni Oda Oluştur'
|
||||
: translate('::App.Videoroom.EditRoom') || 'Odayı Düzenle'}
|
||||
</h5>
|
||||
</div>
|
||||
|
||||
<form
|
||||
onSubmit={showCreateModal ? handleCreateClass : handleEditClass}
|
||||
className="p-4 sm:p-6 space-y-4 sm:space-y-6"
|
||||
>
|
||||
<div className="flex-1 overflow-y-auto p-1 space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
{translate('::App.Listform.ListformField.RoomName') || 'Room Name'} *
|
||||
|
|
@ -851,87 +861,80 @@ const RoomList: React.FC = () => {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-end space-x-4 pt-6 border-t border-gray-200">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
if (showCreateModal) {
|
||||
setShowCreateModal(false)
|
||||
}
|
||||
</div>
|
||||
</Dialog.Body>
|
||||
|
||||
if (showEditModal) {
|
||||
setShowEditModal(false)
|
||||
setVideoroom(newClassEntity)
|
||||
resetForm()
|
||||
}
|
||||
}}
|
||||
className="px-3 py-1 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
{translate('::Cancel') || 'İptal'}
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
className="px-3 py-1 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
|
||||
>
|
||||
{showCreateModal
|
||||
? translate('::App.Videoroom.CreateRoom') || 'Sınıf Oluştur'
|
||||
: translate('::App.Videoroom.SaveChanges') || 'Değişiklikleri Kaydet'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</motion.div>
|
||||
</div>
|
||||
)}
|
||||
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
|
||||
<Button
|
||||
type="button"
|
||||
variant="plain"
|
||||
onClick={() => {
|
||||
if (showCreateModal) setShowCreateModal(false)
|
||||
if (showEditModal) {
|
||||
setShowEditModal(false)
|
||||
setVideoroom(newClassEntity)
|
||||
resetForm()
|
||||
}
|
||||
}}
|
||||
>
|
||||
{translate('::Cancel') || 'İptal'}
|
||||
</Button>
|
||||
<Button type="submit" variant="solid" color="blue-600">
|
||||
{showCreateModal
|
||||
? translate('::App.Videoroom.CreateRoom') || 'Oda Oluştur'
|
||||
: translate('::App.Videoroom.SaveChanges') || 'Değişiklikleri Kaydet'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</form>
|
||||
</Dialog>
|
||||
|
||||
{/* Delete Confirmation Modal */}
|
||||
{showDeleteModal && videoroom && (
|
||||
<div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.95 }}
|
||||
animate={{ opacity: 1, scale: 1 }}
|
||||
className="bg-white rounded-lg max-w-md w-full mx-4"
|
||||
>
|
||||
<div className="p-6">
|
||||
<div className="flex items-center mb-4">
|
||||
<div className="p-3 bg-red-100 rounded-full mr-4">
|
||||
<FaTrash className="text-red-600" size={24} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-gray-900">
|
||||
{translate('::App.Videoroom.DeleteRoom') || 'Sınıfı Sil'}
|
||||
</h3>
|
||||
<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>
|
||||
<Dialog
|
||||
isOpen={showDeleteModal && !!videoroom}
|
||||
onClose={() => {
|
||||
setShowDeleteModal(false)
|
||||
setVideoroom(newClassEntity)
|
||||
}}
|
||||
onRequestClose={() => {
|
||||
setShowDeleteModal(false)
|
||||
setVideoroom(newClassEntity)
|
||||
}}
|
||||
width={480}
|
||||
>
|
||||
<Dialog.Body className="flex flex-col gap-3">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="p-3 bg-red-100 rounded-full flex-shrink-0">
|
||||
<FaTrash className="text-red-600" size={20} />
|
||||
</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>
|
||||
</>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1162,13 +1162,13 @@ GO`,
|
|||
isOpen={showCopyDialog}
|
||||
onClose={() => !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">
|
||||
<h5 className="mb-3">{translate('::App.Platform.CopySelectedObjects')}</h5>
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5 className="mb-1 flex-shrink-0">{translate('::App.Platform.CopySelectedObjects')}</h5>
|
||||
|
||||
{/* Mode Tabs */}
|
||||
<div className="flex gap-2 mb-4 border-b">
|
||||
<div className="flex gap-2 mb-2 border-b flex-shrink-0">
|
||||
<button
|
||||
onClick={() => setCopyDialogMode('objects')}
|
||||
className={`px-4 py-2 font-medium text-sm border-b-2 transition ${
|
||||
|
|
@ -1193,7 +1193,7 @@ GO`,
|
|||
</button>
|
||||
</div>
|
||||
|
||||
<div className="flex-1 overflow-y-auto pr-1">
|
||||
<div className="flex-1 min-h-0 overflow-y-auto pr-1">
|
||||
{copyDialogMode === 'objects' ? (
|
||||
<>
|
||||
{/* Objects Mode */}
|
||||
|
|
@ -1322,32 +1322,32 @@ GO`,
|
|||
</>
|
||||
)}
|
||||
</div>
|
||||
</Dialog.Body>
|
||||
|
||||
<div className="mt-2 flex justify-end gap-2 border-t pt-3">
|
||||
<Button
|
||||
variant="plain"
|
||||
onClick={() => setShowCopyDialog(false)}
|
||||
disabled={isCopyingObjects}
|
||||
>
|
||||
{translate('::Cancel')}
|
||||
</Button>
|
||||
<Button
|
||||
variant="solid"
|
||||
onClick={copyDialogMode === 'objects' ? handleCopyObjects : handleExecuteDirectSql}
|
||||
loading={isCopyingObjects}
|
||||
disabled={
|
||||
copyTargetDataSources.length === 0 ||
|
||||
(copyDialogMode === 'objects'
|
||||
? selectedExplorerObjects.length === 0
|
||||
: !sqlScriptForCopy?.trim())
|
||||
}
|
||||
>
|
||||
{copyDialogMode === 'objects'
|
||||
? translate('::Copy')
|
||||
: translate('::App.Platform.Execute') || 'Calistir'}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<Dialog.Footer className="flex justify-end gap-2 border-t pt-3 mt-1">
|
||||
<Button
|
||||
variant="plain"
|
||||
onClick={() => setShowCopyDialog(false)}
|
||||
disabled={isCopyingObjects}
|
||||
>
|
||||
{translate('::Cancel')}
|
||||
</Button>
|
||||
<Button
|
||||
variant="solid"
|
||||
onClick={copyDialogMode === 'objects' ? handleCopyObjects : handleExecuteDirectSql}
|
||||
loading={isCopyingObjects}
|
||||
disabled={
|
||||
copyTargetDataSources.length === 0 ||
|
||||
(copyDialogMode === 'objects'
|
||||
? selectedExplorerObjects.length === 0
|
||||
: !sqlScriptForCopy?.trim())
|
||||
}
|
||||
>
|
||||
{copyDialogMode === 'objects'
|
||||
? translate('::Copy')
|
||||
: translate('::App.Platform.Execute') || 'Calistir'}
|
||||
</Button>
|
||||
</Dialog.Footer>
|
||||
</Dialog>
|
||||
|
||||
<Dialog
|
||||
|
|
@ -1355,14 +1355,13 @@ GO`,
|
|||
onClose={() => setShowCopyResultDialog(false)}
|
||||
onRequestClose={() => setShowCopyResultDialog(false)}
|
||||
width={1050}
|
||||
contentClassName="max-h-[85vh] overflow-hidden"
|
||||
>
|
||||
<div className="flex h-full max-h-[85vh] flex-col">
|
||||
<h5 className="mb-3">
|
||||
<Dialog.Body className="flex flex-col gap-2">
|
||||
<h5 className="mb-1 flex-shrink-0">
|
||||
{translate('::App.Platform.Results') || 'Kopyalama Sonuc Detaylari'}
|
||||
</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">
|
||||
{translate('::App.Platform.Success')}: <strong>{copySuccessCount}</strong>
|
||||
</div>
|
||||
|
|
@ -1374,7 +1373,7 @@ GO`,
|
|||
</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">
|
||||
{copyResults.map((row, idx) => {
|
||||
const isError = row.status === 'error'
|
||||
|
|
@ -1508,13 +1507,13 @@ GO`,
|
|||
</tbody>
|
||||
</table>
|
||||
</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)}>
|
||||
{translate('::App.Platform.Close')}
|
||||
</Button>
|
||||
</div>
|
||||
</Dialog.Footer>
|
||||
</Dialog>
|
||||
</Container>
|
||||
)
|
||||
|
|
|
|||
Loading…
Reference in a new issue