15.07.2025.17:15
This commit is contained in:
Flatlogic Bot
parent
6c0ade74e1
commit
3c5736c929
File diff suppressed because one or more lines are too long
@ -1,36 +1,19 @@
|
||||
import {
|
||||
mdiAccount,
|
||||
mdiChartTimelineVariant,
|
||||
mdiMail,
|
||||
mdiUpload,
|
||||
} from '@mdi/js';
|
||||
import React, { useState } from 'react';
|
||||
import Head from 'next/head';
|
||||
import React, { ReactElement } from 'react';
|
||||
import CardBox from '../../components/CardBox';
|
||||
import LayoutAuthenticated from '../../layouts/Authenticated';
|
||||
import { Formik, Form, Field, FieldArray } from 'formik';
|
||||
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 CardBox from '../../components/CardBox';
|
||||
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 { SwitchField } from '../../components/SwitchField';
|
||||
|
||||
import BaseButtons from '../../components/BaseButtons';
|
||||
import BaseDivider from '../../components/BaseDivider';
|
||||
import FormField from '../../components/FormField';
|
||||
import { SelectField } from '../../components/SelectField';
|
||||
import { SelectFieldMany } from '../../components/SelectFieldMany';
|
||||
import { RichTextField } from '../../components/RichTextField';
|
||||
|
||||
import { create } from '../../stores/rfqs/rfqsSlice';
|
||||
import { mdiChartTimelineVariant } from '@mdi/js';
|
||||
import { useAppDispatch } from '../../stores/hooks';
|
||||
import { create as createRfqs } from '../../stores/rfqs/rfqsSlice';
|
||||
import { useRouter } from 'next/router';
|
||||
import moment from 'moment';
|
||||
|
||||
const initialValues = {
|
||||
client_name: '',
|
||||
@ -39,99 +22,169 @@ const initialValues = {
|
||||
rfqnumber: '',
|
||||
client_address: '',
|
||||
status: 'draft',
|
||||
locations: [],
|
||||
locations: [
|
||||
{
|
||||
safety_item_1: '',
|
||||
safety_item_2: '',
|
||||
safety_item_3: '',
|
||||
safety_item_4: '',
|
||||
safety_item_5: '',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const RfqsNew = () => {
|
||||
const router = useRouter();
|
||||
const [step, setStep] = useState(0);
|
||||
const dispatch = useAppDispatch();
|
||||
const router = useRouter();
|
||||
|
||||
const handleSubmit = async (data) => {
|
||||
await dispatch(create(data));
|
||||
await router.push('/rfqs/rfqs-list');
|
||||
const handleSubmit = async (values) => {
|
||||
await dispatch(createRfqs(values));
|
||||
router.push('/rfqs/rfqs-list');
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Head>
|
||||
<title>{getPageTitle('New Item')}</title>
|
||||
<title>New RFQ</title>
|
||||
</Head>
|
||||
<SectionMain>
|
||||
<SectionTitleLineWithButton
|
||||
icon={mdiChartTimelineVariant}
|
||||
title='New Item'
|
||||
title={step === 0 ? 'RFQ Details' : 'RFQ Locations'}
|
||||
main
|
||||
>
|
||||
{''}
|
||||
</SectionTitleLineWithButton>
|
||||
/>
|
||||
<CardBox>
|
||||
<Formik
|
||||
initialValues={initialValues}
|
||||
onSubmit={(values) => handleSubmit(values)}
|
||||
>
|
||||
<Form>
|
||||
<FormField label='ClientName'>
|
||||
<Field name='client_name' placeholder='ClientName' />
|
||||
</FormField>
|
||||
<Formik initialValues={initialValues} onSubmit={handleSubmit}>
|
||||
{({ values }) => (
|
||||
<Form>
|
||||
{step === 0 && (
|
||||
<>
|
||||
<FormField label="Client Name">
|
||||
<Field name="client_name" placeholder="Client Name" />
|
||||
</FormField>
|
||||
|
||||
<FormField label='SystemType'>
|
||||
<Field name='system_type' placeholder='SystemType' />
|
||||
</FormField>
|
||||
<FormField label="Client Address">
|
||||
<Field name="client_address" placeholder="Client Address" />
|
||||
</FormField>
|
||||
|
||||
<FormField label='CustomOptions' labelFor='custom_options'>
|
||||
<Field
|
||||
name='custom_options'
|
||||
id='custom_options'
|
||||
itemRef={'custom_options'}
|
||||
options={[]}
|
||||
component={SelectFieldMany}
|
||||
></Field>
|
||||
</FormField>
|
||||
<FormField label='RFQ Number'>
|
||||
<Field name='rfqnumber' type='number' placeholder='RFQ Number' />
|
||||
</FormField>
|
||||
<FormField label="System Type" labelFor="system_type">
|
||||
<Field
|
||||
name="system_type"
|
||||
id="system_type"
|
||||
component={SelectField}
|
||||
options={[
|
||||
{ value: 'Standard', label: 'Standard' },
|
||||
{ value: 'Custom', label: 'Custom' },
|
||||
]}
|
||||
/>
|
||||
</FormField>
|
||||
|
||||
<FormField label='Client Address'>
|
||||
<Field name='client_address' placeholder='Client Address' />
|
||||
</FormField>
|
||||
<FormField label="RFQ Number">
|
||||
<Field name="rfqnumber" type="number" placeholder="RFQ Number" />
|
||||
</FormField>
|
||||
|
||||
<FormField label='Status' labelFor='status'>
|
||||
<Field
|
||||
name='status'
|
||||
id='status'
|
||||
component={SelectField}
|
||||
options={[
|
||||
{ value: 'draft', label: 'Draft' },
|
||||
{ value: 'in_progress', label: 'In Progress' },
|
||||
{ value: 'submitted', label: 'Submitted' },
|
||||
]}
|
||||
/>
|
||||
</FormField>
|
||||
<FormField label="Custom Options" labelFor="custom_options">
|
||||
<Field
|
||||
name="custom_options"
|
||||
id="custom_options"
|
||||
itemRef="custom_options"
|
||||
component={SelectFieldMany}
|
||||
options={[]}
|
||||
/>
|
||||
</FormField>
|
||||
|
||||
<FormField label='Locations' labelFor='locations'>
|
||||
<Field
|
||||
name='locations'
|
||||
id='locations'
|
||||
itemRef={'rfq_locations'}
|
||||
options={[]}
|
||||
component={SelectFieldMany}
|
||||
/>
|
||||
</FormField>
|
||||
<BaseDivider />
|
||||
<BaseButtons>
|
||||
<BaseButton
|
||||
type="button"
|
||||
color="info"
|
||||
label="Next"
|
||||
onClick={() => setStep(1)}
|
||||
/>
|
||||
</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>
|
||||
<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('/rfqs/rfqs-list')}
|
||||
/>
|
||||
</BaseButtons>
|
||||
</Form>
|
||||
<BaseDivider />
|
||||
<BaseButtons>
|
||||
<BaseButton
|
||||
type="button"
|
||||
color="info"
|
||||
outline
|
||||
label="Back"
|
||||
onClick={() => setStep(0)}
|
||||
/>
|
||||
<BaseButton type="submit" color="success" label="Submit" />
|
||||
</BaseButtons>
|
||||
</>
|
||||
)}
|
||||
</Form>
|
||||
)}
|
||||
</Formik>
|
||||
</CardBox>
|
||||
</SectionMain>
|
||||
@ -139,10 +192,8 @@ const RfqsNew = () => {
|
||||
);
|
||||
};
|
||||
|
||||
RfqsNew.getLayout = function getLayout(page: ReactElement) {
|
||||
return (
|
||||
<LayoutAuthenticated permission={'CREATE_RFQS'}>{page}</LayoutAuthenticated>
|
||||
);
|
||||
RfqsNew.getLayout = function getLayout(page) {
|
||||
return page;
|
||||
};
|
||||
|
||||
export default RfqsNew;
|
||||
Loading…
x
Reference in New Issue
Block a user