40346-vm/frontend/src/pages/cron_runs/cron_runs-edit.tsx
Flatlogic Bot f741ab0364 Base
2026-06-29 19:07:34 +00:00

656 lines
7.2 KiB
TypeScript

import { mdiChartTimelineVariant, mdiUpload } from '@mdi/js'
import Head from 'next/head'
import React, { ReactElement, useEffect, useState } from 'react'
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import dayjs from "dayjs";
import CardBox from '../../components/CardBox'
import LayoutAuthenticated from '../../layouts/Authenticated'
import SectionMain from '../../components/SectionMain'
import SectionTitleLineWithButton from '../../components/SectionTitleLineWithButton'
import { getPageTitle } from '../../config'
import { Field, Form, Formik } from 'formik'
import FormField from '../../components/FormField'
import BaseDivider from '../../components/BaseDivider'
import BaseButtons from '../../components/BaseButtons'
import BaseButton from '../../components/BaseButton'
import FormCheckRadio from '../../components/FormCheckRadio'
import FormCheckRadioGroup from '../../components/FormCheckRadioGroup'
import FormFilePicker from '../../components/FormFilePicker'
import FormImagePicker from '../../components/FormImagePicker'
import { SelectField } from "../../components/SelectField";
import { SelectFieldMany } from "../../components/SelectFieldMany";
import { SwitchField } from '../../components/SwitchField'
import {RichTextField} from "../../components/RichTextField";
import { update, fetch } from '../../stores/cron_runs/cron_runsSlice'
import { useAppDispatch, useAppSelector } from '../../stores/hooks'
import { useRouter } from 'next/router'
import {saveFile} from "../../helpers/fileSaver";
import dataFormatter from '../../helpers/dataFormatter';
import ImageField from "../../components/ImageField";
const EditCron_runsPage = () => {
const router = useRouter()
const dispatch = useAppDispatch()
const initVals = {
'job_name': '',
started_at: new Date(),
finished_at: new Date(),
run_status: '',
processed_count: '',
sent_count: '',
error_count: '',
error_summary: '',
}
const [initialValues, setInitialValues] = useState(initVals)
const { cron_runs } = useAppSelector((state) => state.cron_runs)
const { id } = router.query
useEffect(() => {
dispatch(fetch({ id: id }))
}, [id])
useEffect(() => {
if (typeof cron_runs === 'object') {
setInitialValues(cron_runs)
}
}, [cron_runs])
useEffect(() => {
if (typeof cron_runs === 'object') {
const newInitialVal = {...initVals};
Object.keys(initVals).forEach(el => newInitialVal[el] = (cron_runs)[el])
setInitialValues(newInitialVal);
}
}, [cron_runs])
const handleSubmit = async (data) => {
await dispatch(update({ id: id, data }))
await router.push('/cron_runs/cron_runs-list')
}
return (
<>
<Head>
<title>{getPageTitle('Edit cron_runs')}</title>
</Head>
<SectionMain>
<SectionTitleLineWithButton icon={mdiChartTimelineVariant} title={'Edit cron_runs'} main>
{''}
</SectionTitleLineWithButton>
<CardBox>
<Formik
enableReinitialize
initialValues={initialValues}
onSubmit={(values) => handleSubmit(values)}
>
<Form>
<FormField
label="JobName"
>
<Field
name="job_name"
placeholder="JobName"
/>
</FormField>
<FormField
label="StartedAt"
>
<DatePicker
dateFormat="yyyy-MM-dd hh:mm"
showTimeSelect
selected={initialValues.started_at ?
new Date(
dayjs(initialValues.started_at).format('YYYY-MM-DD hh:mm'),
) : null
}
onChange={(date) => setInitialValues({...initialValues, 'started_at': date})}
/>
</FormField>
<FormField
label="FinishedAt"
>
<DatePicker
dateFormat="yyyy-MM-dd hh:mm"
showTimeSelect
selected={initialValues.finished_at ?
new Date(
dayjs(initialValues.finished_at).format('YYYY-MM-DD hh:mm'),
) : null
}
onChange={(date) => setInitialValues({...initialValues, 'finished_at': date})}
/>
</FormField>
<FormField label="RunStatus" labelFor="run_status">
<Field name="run_status" id="run_status" component="select">
<option value="success">success</option>
<option value="partial">partial</option>
<option value="failed">failed</option>
<option value="skipped">skipped</option>
</Field>
</FormField>
<FormField
label="ProcessedCount"
>
<Field
type="number"
name="processed_count"
placeholder="ProcessedCount"
/>
</FormField>
<FormField
label="SentCount"
>
<Field
type="number"
name="sent_count"
placeholder="SentCount"
/>
</FormField>
<FormField
label="ErrorCount"
>
<Field
type="number"
name="error_count"
placeholder="ErrorCount"
/>
</FormField>
<FormField label="ErrorSummary" hasTextareaHeight>
<Field name="error_summary" as="textarea" placeholder="ErrorSummary" />
</FormField>
<BaseDivider />
<BaseButtons>
<BaseButton type="submit" color="info" label="Submit" />
<BaseButton type="reset" color="info" outline label="Reset" />
<BaseButton type='reset' color='danger' outline label='Cancel' onClick={() => router.push('/cron_runs/cron_runs-list')}/>
</BaseButtons>
</Form>
</Formik>
</CardBox>
</SectionMain>
</>
)
}
EditCron_runsPage.getLayout = function getLayout(page: ReactElement) {
return (
<LayoutAuthenticated
portal='admin'
permission={'UPDATE_CRON_RUNS'}
>
{page}
</LayoutAuthenticated>
)
}
export default EditCron_runsPage