15.07.2025.17:15

This commit is contained in:
Flatlogic Bot 2025-07-15 11:45:33 +00:00
parent 6c0ade74e1
commit 3c5736c929
2 changed files with 155 additions and 103 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,36 +1,19 @@
import { import React, { useState } from 'react';
mdiAccount,
mdiChartTimelineVariant,
mdiMail,
mdiUpload,
} from '@mdi/js';
import Head from 'next/head'; import Head from 'next/head';
import React, { ReactElement } from 'react'; import { Formik, Form, Field, FieldArray } from 'formik';
import CardBox from '../../components/CardBox';
import LayoutAuthenticated from '../../layouts/Authenticated';
import SectionMain from '../../components/SectionMain'; import SectionMain from '../../components/SectionMain';
import SectionTitleLineWithButton from '../../components/SectionTitleLineWithButton'; import SectionTitleLineWithButton from '../../components/SectionTitleLineWithButton';
import { getPageTitle } from '../../config'; import CardBox from '../../components/CardBox';
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 BaseButton from '../../components/BaseButton';
import FormCheckRadio from '../../components/FormCheckRadio'; import BaseButtons from '../../components/BaseButtons';
import FormCheckRadioGroup from '../../components/FormCheckRadioGroup'; import BaseDivider from '../../components/BaseDivider';
import FormFilePicker from '../../components/FormFilePicker'; import FormField from '../../components/FormField';
import FormImagePicker from '../../components/FormImagePicker';
import { SwitchField } from '../../components/SwitchField';
import { SelectField } from '../../components/SelectField'; import { SelectField } from '../../components/SelectField';
import { SelectFieldMany } from '../../components/SelectFieldMany'; import { SelectFieldMany } from '../../components/SelectFieldMany';
import { RichTextField } from '../../components/RichTextField'; import { mdiChartTimelineVariant } from '@mdi/js';
import { create } from '../../stores/rfqs/rfqsSlice';
import { useAppDispatch } from '../../stores/hooks'; import { useAppDispatch } from '../../stores/hooks';
import { create as createRfqs } from '../../stores/rfqs/rfqsSlice';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import moment from 'moment';
const initialValues = { const initialValues = {
client_name: '', client_name: '',
@ -39,99 +22,169 @@ const initialValues = {
rfqnumber: '', rfqnumber: '',
client_address: '', client_address: '',
status: 'draft', status: 'draft',
locations: [], locations: [
{
safety_item_1: '',
safety_item_2: '',
safety_item_3: '',
safety_item_4: '',
safety_item_5: '',
},
],
}; };
const RfqsNew = () => { const RfqsNew = () => {
const router = useRouter(); const [step, setStep] = useState(0);
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const router = useRouter();
const handleSubmit = async (data) => { const handleSubmit = async (values) => {
await dispatch(create(data)); await dispatch(createRfqs(values));
await router.push('/rfqs/rfqs-list'); router.push('/rfqs/rfqs-list');
}; };
return ( return (
<> <>
<Head> <Head>
<title>{getPageTitle('New Item')}</title> <title>New RFQ</title>
</Head> </Head>
<SectionMain> <SectionMain>
<SectionTitleLineWithButton <SectionTitleLineWithButton
icon={mdiChartTimelineVariant} icon={mdiChartTimelineVariant}
title='New Item' title={step === 0 ? 'RFQ Details' : 'RFQ Locations'}
main main
> />
{''}
</SectionTitleLineWithButton>
<CardBox> <CardBox>
<Formik <Formik initialValues={initialValues} onSubmit={handleSubmit}>
initialValues={initialValues} {({ values }) => (
onSubmit={(values) => handleSubmit(values)} <Form>
> {step === 0 && (
<Form> <>
<FormField label='ClientName'> <FormField label="Client Name">
<Field name='client_name' placeholder='ClientName' /> <Field name="client_name" placeholder="Client Name" />
</FormField> </FormField>
<FormField label='SystemType'> <FormField label="Client Address">
<Field name='system_type' placeholder='SystemType' /> <Field name="client_address" placeholder="Client Address" />
</FormField> </FormField>
<FormField label='CustomOptions' labelFor='custom_options'> <FormField label="System Type" labelFor="system_type">
<Field <Field
name='custom_options' name="system_type"
id='custom_options' id="system_type"
itemRef={'custom_options'} component={SelectField}
options={[]} options={[
component={SelectFieldMany} { value: 'Standard', label: 'Standard' },
></Field> { value: 'Custom', label: 'Custom' },
</FormField> ]}
<FormField label='RFQ Number'> />
<Field name='rfqnumber' type='number' placeholder='RFQ Number' /> </FormField>
</FormField>
<FormField label='Client Address'> <FormField label="RFQ Number">
<Field name='client_address' placeholder='Client Address' /> <Field name="rfqnumber" type="number" placeholder="RFQ Number" />
</FormField> </FormField>
<FormField label='Status' labelFor='status'> <FormField label="Custom Options" labelFor="custom_options">
<Field <Field
name='status' name="custom_options"
id='status' id="custom_options"
component={SelectField} itemRef="custom_options"
options={[ component={SelectFieldMany}
{ value: 'draft', label: 'Draft' }, options={[]}
{ value: 'in_progress', label: 'In Progress' }, />
{ value: 'submitted', label: 'Submitted' }, </FormField>
]}
/>
</FormField>
<FormField label='Locations' labelFor='locations'> <BaseDivider />
<Field <BaseButtons>
name='locations' <BaseButton
id='locations' type="button"
itemRef={'rfq_locations'} color="info"
options={[]} label="Next"
component={SelectFieldMany} onClick={() => setStep(1)}
/> />
</FormField> </BaseButtons>
</>
)}
{step === 1 && (
<>
<FieldArray name="locations">
{({ remove, push }) => (
<>
{values.locations.map((loc, index) => (
<div key={index} style={{ marginBottom: '1rem' }}>
<h4>Location #{index + 1}</h4>
<FormField label="Safety Item 1">
<Field
name={`locations[${index}].safety_item_1`}
placeholder="Safety Item 1"
/>
</FormField>
<FormField label="Safety Item 2">
<Field
name={`locations[${index}].safety_item_2`}
placeholder="Safety Item 2"
/>
</FormField>
<FormField label="Safety Item 3">
<Field
name={`locations[${index}].safety_item_3`}
placeholder="Safety Item 3"
/>
</FormField>
<FormField label="Safety Item 4">
<Field
name={`locations[${index}].safety_item_4`}
placeholder="Safety Item 4"
/>
</FormField>
<FormField label="Safety Item 5">
<Field
name={`locations[${index}].safety_item_5`}
placeholder="Safety Item 5"
/>
</FormField>
<BaseButton
type="button"
color="danger"
outline
label="Remove"
onClick={() => remove(index)}
/>
</div>
))}
<BaseButton
type="button"
color="success"
label="Add Location"
onClick={() =>
push({
safety_item_1: '',
safety_item_2: '',
safety_item_3: '',
safety_item_4: '',
safety_item_5: '',
})
}
/>
</>
)}
</FieldArray>
<BaseDivider />
<BaseButtons>
<BaseDivider /> <BaseButton
<BaseButtons> type="button"
<BaseButton type='submit' color='info' label='Submit' /> color="info"
<BaseButton type='reset' color='info' outline label='Reset' /> outline
<BaseButton label="Back"
type='reset' onClick={() => setStep(0)}
color='danger' />
outline <BaseButton type="submit" color="success" label="Submit" />
label='Cancel' </BaseButtons>
onClick={() => router.push('/rfqs/rfqs-list')} </>
/> )}
</BaseButtons> </Form>
</Form> )}
</Formik> </Formik>
</CardBox> </CardBox>
</SectionMain> </SectionMain>
@ -139,10 +192,8 @@ const RfqsNew = () => {
); );
}; };
RfqsNew.getLayout = function getLayout(page: ReactElement) { RfqsNew.getLayout = function getLayout(page) {
return ( return page;
<LayoutAuthenticated permission={'CREATE_RFQS'}>{page}</LayoutAuthenticated>
);
}; };
export default RfqsNew; export default RfqsNew;