nestjs rewrite
This commit is contained in:
popovspiridon99
@ -1,11 +1,10 @@
|
||||
import { ActionIcon, Button, Flex, Group, Input, Stack, Text, TextInput } from "@mantine/core"
|
||||
import { ActionIcon, Button, Flex, Group, Stack, Text, TextInput } from "@mantine/core"
|
||||
import { useEffect, useState } from "react"
|
||||
import createReport, { listCommands } from 'docx-templates'
|
||||
import { Dropzone, DropzoneProps, IMAGE_MIME_TYPE, MS_WORD_MIME_TYPE } from '@mantine/dropzone'
|
||||
import { IconFile, IconFileTypeDocx, IconPhoto, IconPlus, IconUpload, IconX } from "@tabler/icons-react"
|
||||
import { Dropzone, IMAGE_MIME_TYPE } from '@mantine/dropzone'
|
||||
import { IconFileTypeDocx, IconPlus, IconUpload, IconX } from "@tabler/icons-react"
|
||||
import { CommandSummary } from "docx-templates/lib/types"
|
||||
import { Control, Controller, FieldValues, SubmitHandler, useFieldArray, useForm, UseFormRegister } from "react-hook-form"
|
||||
import { TemplateHandler } from 'easy-template-x'
|
||||
|
||||
const xslTemplate = `<?xml version="1.0" encoding="utf-8"?>
|
||||
<xsl:stylesheet version="1.0" xmlns="urn:schemas-microsoft-com:office:spreadsheet" xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
|
||||
@ -962,54 +961,6 @@ const handleGenerateExcel = () => {
|
||||
URL.revokeObjectURL(url)
|
||||
}
|
||||
|
||||
const TemplateFormET = ({
|
||||
templateUrl
|
||||
}: {
|
||||
templateUrl: string
|
||||
}) => {
|
||||
const [templateUint8Array, setTemplateUint8Array] = useState<Uint8Array | null>(null)
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
const loadTemplate = async (templateUrl: string) => {
|
||||
setLoading(true)
|
||||
try {
|
||||
const response = await fetch(templateUrl)
|
||||
const templateArrayBuffer = await response.arrayBuffer()
|
||||
|
||||
setTemplateUint8Array(new Uint8Array(templateArrayBuffer))
|
||||
} catch (error) {
|
||||
console.error("Error generating DOCX:", error)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const loadTags = async (templateUint8Array: Uint8Array) => {
|
||||
const handler = new TemplateHandler()
|
||||
const tags = await handler.parseTags(templateUint8Array)
|
||||
|
||||
console.log(tags)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (templateUint8Array) {
|
||||
loadTags(templateUint8Array)
|
||||
}
|
||||
}, [templateUint8Array])
|
||||
|
||||
useEffect(() => {
|
||||
if (templateUrl) {
|
||||
loadTemplate(templateUrl)
|
||||
}
|
||||
}, [templateUrl])
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
interface TemplateCommand extends CommandSummary {
|
||||
children?: CommandSummary[]
|
||||
}
|
||||
@ -1098,6 +1049,7 @@ const FormLoop = ({
|
||||
))
|
||||
}
|
||||
</Stack>
|
||||
|
||||
<ActionIcon onClick={() => {
|
||||
if (command.children) {
|
||||
append(command.children.map(c => c.code).reduce((acc, key) => {
|
||||
@ -1132,51 +1084,51 @@ const renderCommand = (
|
||||
|
||||
if (command.type === 'IMAGE') {
|
||||
return (
|
||||
<Controller
|
||||
key={key}
|
||||
name={name}
|
||||
control={control}
|
||||
render={({ field: { onChange, value } }) => (
|
||||
<Dropzone
|
||||
accept={IMAGE_MIME_TYPE}
|
||||
maxSize={5 * 1024 ** 2}
|
||||
onReject={(files) => console.log('rejected files', files)}
|
||||
onDrop={(files) => {
|
||||
console.log(files[0])
|
||||
files[0].arrayBuffer().then(res => {
|
||||
onChange({
|
||||
width: 6,
|
||||
height: 6,
|
||||
data: new Uint8Array(res),
|
||||
extension: files[0]?.path?.match(/\.[^.]+$/)?.[0] || ""
|
||||
<Stack gap={0}>
|
||||
<Text size='sm' fw={500}>{command.code}</Text>
|
||||
<Controller
|
||||
key={key}
|
||||
name={name}
|
||||
control={control}
|
||||
render={({ field: { onChange } }) => (
|
||||
<Dropzone
|
||||
accept={IMAGE_MIME_TYPE}
|
||||
maxSize={5 * 1024 ** 2}
|
||||
onReject={(files) => console.log('rejected files', files)}
|
||||
onDrop={(files) => {
|
||||
console.log(files[0])
|
||||
files[0].arrayBuffer().then(res => {
|
||||
onChange({
|
||||
width: 6,
|
||||
height: 6,
|
||||
data: new Uint8Array(res),
|
||||
extension: files[0]?.path?.match(/\.[^.]+$/)?.[0] || ""
|
||||
})
|
||||
})
|
||||
})
|
||||
}}
|
||||
maxFiles={1}
|
||||
>
|
||||
<Group justify="center" gap="xl" mih={220} style={{ pointerEvents: 'none' }}>
|
||||
<Dropzone.Accept>
|
||||
<IconUpload size={52} color="var(--mantine-color-blue-6)" stroke={1.5} />
|
||||
</Dropzone.Accept>
|
||||
<Dropzone.Reject>
|
||||
<IconX size={52} color="var(--mantine-color-red-6)" stroke={1.5} />
|
||||
</Dropzone.Reject>
|
||||
<Dropzone.Idle>
|
||||
<IconFileTypeDocx size={52} color="var(--mantine-color-dimmed)" stroke={1.5} />
|
||||
</Dropzone.Idle>
|
||||
}}
|
||||
maxFiles={1}
|
||||
>
|
||||
<Group justify="center" gap="xl" mih={220} style={{ pointerEvents: 'none' }}>
|
||||
<Dropzone.Accept>
|
||||
<IconUpload size={52} color="var(--mantine-color-blue-6)" stroke={1.5} />
|
||||
</Dropzone.Accept>
|
||||
<Dropzone.Reject>
|
||||
<IconX size={52} color="var(--mantine-color-red-6)" stroke={1.5} />
|
||||
</Dropzone.Reject>
|
||||
<Dropzone.Idle>
|
||||
<IconFileTypeDocx size={52} color="var(--mantine-color-dimmed)" stroke={1.5} />
|
||||
</Dropzone.Idle>
|
||||
|
||||
<div>
|
||||
<Text size="xl" inline>
|
||||
Drag files here or click to select files
|
||||
</Text>
|
||||
<Text size="sm" c="dimmed" inline mt={7}>
|
||||
Attach as many files as you like, each file should not exceed 5mb
|
||||
</Text>
|
||||
</div>
|
||||
</Group>
|
||||
</Dropzone>
|
||||
)}
|
||||
/>
|
||||
<div>
|
||||
<Text size="xl" inline>
|
||||
Перетащите файлы сюда или нажмите, чтобы выбрать их
|
||||
</Text>
|
||||
</div>
|
||||
</Group>
|
||||
</Dropzone>
|
||||
)}
|
||||
/>
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
}
|
||||
@ -1186,7 +1138,7 @@ const TemplateForm = ({
|
||||
}: {
|
||||
templateUrl: string,
|
||||
}) => {
|
||||
const { register, control, handleSubmit, reset, watch, formState } = useForm({
|
||||
const { register, control, handleSubmit } = useForm({
|
||||
mode: 'onChange',
|
||||
})
|
||||
|
||||
@ -1276,6 +1228,15 @@ const TemplateForm = ({
|
||||
}
|
||||
}, [templateUrl])
|
||||
|
||||
useEffect(() => {
|
||||
console.log(loading)
|
||||
}, [loading])
|
||||
|
||||
useEffect(() => {
|
||||
console.log(saving)
|
||||
}, [saving])
|
||||
|
||||
|
||||
if (commandList) {
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
@ -1283,13 +1244,16 @@ const TemplateForm = ({
|
||||
{commandList.map(command => {
|
||||
if (command.type === 'FOR') {
|
||||
return (
|
||||
<FormLoop key={command.code} control={control} register={register} command={command} />
|
||||
<Stack gap={0} key={command.code}>
|
||||
<Text size='sm' fw={500}>{command.code}</Text>
|
||||
<FormLoop control={control} register={register} command={command} />
|
||||
</Stack>
|
||||
)
|
||||
} else {
|
||||
return renderCommand(control, register, command, command.code, command.code, command.code)
|
||||
}
|
||||
})}
|
||||
<Button type='submit'>Submit</Button>
|
||||
<Button ml='auto' w='fit-content' type='submit'>Сохранить</Button>
|
||||
</Stack>
|
||||
</form>
|
||||
)
|
||||
@ -1297,8 +1261,6 @@ const TemplateForm = ({
|
||||
}
|
||||
|
||||
const PrintReport = () => {
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
return (
|
||||
<Stack p='sm' gap='sm' w='100%'>
|
||||
<TemplateForm templateUrl="/template_table.docx" />
|
||||
|
||||
Reference in New Issue
Block a user