This commit is contained in:
2024-05-09 01:32:05 +03:00
parent 90802acc56
commit 8ff16e687f
14 changed files with 171 additions and 38 deletions

View File

@@ -1,24 +1,83 @@
import styles from './BarcodePage.module.css';
import PageBlock from "../../components/PageBlock/PageBlock.tsx";
import {Button} from "@mantine/core";
import BarcodeTemplatesTable from "./components/BarcodeTemplatesTable/BarcodeTemplatesTable.tsx";
import useGetAllBarcodeTemplates from "../../api/barcode/useGetAllBarcodeTemplates.tsx";
import {modals} from "@mantine/modals";
import {BarcodeService, BarcodeTemplateSchema} from "../../client";
import {notifications} from "../../shared/lib/notifications.ts";
const BarcodePage = () => {
const {barcodeTemplates, refetch} = useGetAllBarcodeTemplates();
const onCreate = (template: BarcodeTemplateSchema) => {
BarcodeService.createBarcodeTemplate(({
requestBody: {
...template,
attributeIds: template.attributes.map(attr => attr.id)
}
})).then(async ({ok, message}) => {
notifications.guess(ok, {message});
if (!ok) return;
await refetch()
})
}
const onChange = (template: BarcodeTemplateSchema) => {
BarcodeService.updateBarcodeTemplate({
requestBody: {
...template,
attributeIds: template.attributes.map(attr => attr.id)
}
}).then(async ({ok, message}) => {
notifications.guess(ok, {message});
if (!ok) return;
await refetch()
})
}
const onDelete = (template: BarcodeTemplateSchema) => {
BarcodeService.deleteBarcodeTemplate({
requestBody: {
id: template.id
}
}).then(async ({ok, message}) => {
notifications.guess(ok, {message});
if (!ok) return;
await refetch()
})
}
const onCreateClick = () => {
modals.openContextModal({
modal: "barcodeTemplateFormModal",
title: 'Создание шаблона',
withCloseButton: false,
innerProps: {
onCreate: onCreate
}
});
}
return (
<div className={styles['container']}>
<PageBlock>
<div className={styles['top-panel']}>
<Button
onClick={() => onCreateClick()}
variant={"default"}
>
Создать клиента
Создать шаблон
</Button>
</div>
</PageBlock>
<PageBlock>
<>dsad</>
<BarcodeTemplatesTable
items={barcodeTemplates}
onChange={onChange}
onDelete={onDelete}
/>
</PageBlock>
</div>
)

View File

@@ -0,0 +1,7 @@
import {GetInputProps} from "@mantine/form/lib/types";
import {FC} from "react";
type Props = GetInputProps<Array<{ name:string,value:string }>>
const BarcodeTemplateAdditionalFieldTable:FC<Props> = (props:Props) => {
}

View File

@@ -6,6 +6,7 @@ import {BaseTable} from "../../../../components/BaseTable/BaseTable.tsx";
import {modals} from "@mantine/modals";
import {ActionIcon, Flex, Tooltip} from "@mantine/core";
import {IconEdit, IconTrash} from "@tabler/icons-react";
import {MRT_TableOptions} from "mantine-react-table";
const BarcodeTemplatesTable: FC<CRUDTableProps<BarcodeTemplateSchema>> = ({
items,
@@ -39,8 +40,7 @@ const BarcodeTemplatesTable: FC<CRUDTableProps<BarcodeTemplateSchema>> = ({
<Tooltip label="Редактировать">
<ActionIcon
onClick={() => onEditClick(row.original)}
variant={"default"}
>
variant={"default"}>
<IconEdit/>
</ActionIcon>
</Tooltip>
@@ -53,7 +53,7 @@ const BarcodeTemplatesTable: FC<CRUDTableProps<BarcodeTemplateSchema>> = ({
</Tooltip>
</Flex>
)
}}
} as MRT_TableOptions<BarcodeTemplateSchema>}
/>
</>
)

View File

@@ -1,6 +1,7 @@
import {BarcodeTemplateSchema} from "../../../../client";
import {MRT_ColumnDef} from "mantine-react-table";
import {useMemo} from "react";
import {IconCheck, IconX} from "@tabler/icons-react";
export const useBarcodeTemplatesTableColumns = () => {
return useMemo<MRT_ColumnDef<BarcodeTemplateSchema>[]>(() => [
@@ -8,17 +9,19 @@ export const useBarcodeTemplatesTableColumns = () => {
accessorKey: "name",
header: "Название",
},
{
accessorKey: "isDefault",
header: "По умолчанию",
},
{
accessorKey: "attributes",
header: "Атрибуты",
Cell: ({row}) => <>{row.original.attributes.map(attr => attr.name).join(', ')}</>
},
{
header: "Размер",
Cell: ({row}) => <>{row.original.width}x{row.original.height}</>
},
{
accessorKey: "isDefault",
header: "По умолчанию",
Cell: ({row}) => row.original.isDefault ? <IconCheck/> : <IconX/>
}
], []);
}

View File

@@ -5,7 +5,7 @@ import {useForm} from "@mantine/form";
import {Checkbox, Fieldset, Flex, NumberInput, rem, TextInput} from "@mantine/core";
import {IconX} from "@tabler/icons-react";
import BarcodeTemplateAttributeMultiselect
from "../../component/BarcodeTemplateAttributeMultiselect/BarcodeTemplateAttributeMultiselect.tsx";
from "../../components/BarcodeTemplateAttributeMultiselect/BarcodeTemplateAttributeMultiselect.tsx";
type Props = CreateEditFormProps<BarcodeTemplateSchema>
const BarcodeTemplateFormModal = ({
@@ -30,7 +30,7 @@ const BarcodeTemplateFormModal = ({
name: (name: string | undefined) => name && name.trim() !== '' ? null : "Необходимо ввести название шаблона",
}
})
console.log(form.values);
return (
<BaseFormModal
{...innerProps}
@@ -44,40 +44,33 @@ const BarcodeTemplateFormModal = ({
<Fieldset legend={"Шаблон штрихкода"}>
<Flex direction={"column"} gap={rem(10)}>
<TextInput
label={"Название"}
label={'Название'}
placeholder={"Введите название шаблона"}
{...form.getInputProps('name')}
/>
<Fieldset
styles={{
legend: {
marginBottom: 0,
fontWeight: 500
}
}}
variant={"unstyled"}
legend={"Размер"}>
<Flex gap={10} align={"center"}>
<NumberInput
hideControls
placeholder={"Ширина"}
{...form.getInputProps('width')}
/>
<IconX/>
<NumberInput
hideControls
placeholder={"Высота"}
{...form.getInputProps('height')}
/>
</Flex>
</Fieldset>
<Flex gap={10} align={"center"}>
<NumberInput
hideControls
label={'Ширина'}
placeholder={"Ширина в мм"}
{...form.getInputProps('width')}
/>
<IconX/>
<NumberInput
hideControls
label={'Высота'}
placeholder={"Высота в мм"}
{...form.getInputProps('height')}
/>
</Flex>
<BarcodeTemplateAttributeMultiselect
label={"Атрибуты"}
placeholder={"Выберите атрибуты"}
placeholder={!form.values.attributes?.length ? "Выберите атрибуты" : undefined}
{...form.getInputProps('attributes')}
/>
<Checkbox
label={"Использовать как стандартный шаблон"}
checked={form.getInputProps('isDefault').value as boolean}
{...form.getInputProps('isDefault')}/>
</Flex>

View File

@@ -24,6 +24,10 @@ export const useClientsTableColumns = () => {
{
accessorKey: "details.inn",
header: "ИНН"
},
{
accessorKey:"barcodeTemplate.name",
header:"Шаблон штрихкодов"
}
], []);
}

View File

@@ -3,6 +3,7 @@ import {Fieldset, TextInput} from "@mantine/core";
import {useForm} from "@mantine/form";
import {ClientSchema} from "../../../../client";
import BaseFormModal, {CreateEditFormProps} from "../BaseFormModal/BaseFormModal.tsx";
import BarcodeTemplateSelect from "../../../../components/Selects/BarcodeTemplateSelect/BarcodeTemplateSelect.tsx";
type Props = CreateEditFormProps<ClientSchema>;
@@ -22,7 +23,8 @@ const ClientFormModal = ({
phoneNumber: innerProps.element.details?.phoneNumber,
email: innerProps.element.details?.email,
inn: innerProps.element.details?.inn
}
},
barcodeTemplate: innerProps.element.barcodeTemplate
} : {
id: -1,
name: '',
@@ -89,6 +91,13 @@ const ClientFormModal = ({
{...form.getInputProps('details.inn')}
/>
</Fieldset>
<Fieldset legend={'Настройки'}>
<BarcodeTemplateSelect
label={'Шаблон штрихкодов'}
placeholder={'Выберите шаблон штрихкодов'}
{...form.getInputProps('barcodeTemplate')}
/>
</Fieldset>
</>
</BaseFormModal.Body>