FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-18 07:26:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(web/input): date input

Browse Source
This commit is contained in:
Luke
2023-01-13 19:09:07 +01:00
parent 2a1429848c
commit d621aca29f
5 changed files with 103 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
web/src/features/dialog/InputDialog.tsx
View File

@@ -1,9 +1,18 @@
import { Group, Modal, Button, Stack, SelectItem } from '@mantine/core';
import React, { FormEvent, useRef } from 'react';
import { Group, Modal, Button, Stack } from '@mantine/core';
import React from 'react';
import { useNuiEvent } from '../../hooks/useNuiEvent';
import { useLocales } from '../../providers/LocaleProvider';
import { fetchNui } from '../../utils/fetchNui';
import { IInput, ICheckbox, ISelect, INumber, ISlider, IColorInput, OptionValue } from '../../interfaces/dialog';
import {
IInput,
ICheckbox,
ISelect,
INumber,
ISlider,
IColorInput,
OptionValue,
IDateInput,
} from '../../interfaces/dialog';
import InputField from './components/fields/input';
import CheckboxField from './components/fields/checkbox';
import SelectField from './components/fields/select';
@@ -11,10 +20,11 @@ import NumberField from './components/fields/number';
import SliderField from './components/fields/slider';
import { useFieldArray, useForm } from 'react-hook-form';
import ColorField from './components/fields/color';
import DateField from './components/fields/date';
export interface InputProps {
heading: string;
rows: Array<IInput | ICheckbox | ISelect | INumber | ISlider | IColorInput>;
rows: Array<IInput | ICheckbox | ISelect | INumber | ISlider | IColorInput | IDateInput>;
options?: {
allowCancel?: boolean;
};
@@ -44,7 +54,17 @@ const InputDialog: React.FC = () => {
setFields(data);
setVisible(true);
data.rows.forEach((row, index) => {
fieldForm.insert(index, { value: row.type !== 'checkbox' ? row.default : row.checked } || { value: null });
fieldForm.insert(
index,
{
value:
row.type !== 'checkbox'
? row.type === 'date' && row.default
? new Date(row.default)
: row.default
: row.checked,
} || { value: null }
);
// Backwards compat with new Select data type
if (row.type === 'select') {
row.options = row.options.map((option) =>
@@ -117,6 +137,7 @@ const InputDialog: React.FC = () => {
{row.type === 'number' && <NumberField control={form.control} row={row} index={index} />}
{row.type === 'slider' && <SliderField control={form.control} row={row} index={index} />}
{row.type === 'color' && <ColorField control={form.control} row={row} index={index} />}
{row.type === 'date' && <DateField control={form.control} row={row} index={index} />}
</React.Fragment>
);
})}