frontend/pages/files.tsx
2022-08-28 11:05:58 +03:00

143 lines
4.5 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import type { NextPage } from 'next'
import Head from 'next/head'
import { ErrorViewer } from '../Components/ErrorViewer'
import { FileUploader } from '../Components/FileUploader'
import { Header } from '../Components/header'
import styles from '../styles/Home.module.css'
import 'antd/dist/antd.css';
import { ItemSelect, SelectItemIE } from '../Components/ItemSelect'
import { useState } from 'react'
import { get } from './api/fetch'
import { host } from './api/consts'
import { PulseLoader } from 'react-spinners'
import axios from 'axios'
import { Checkbox } from 'antd'
import { CircularProgressbar, buildStyles } from 'react-circular-progressbar';
import 'react-circular-progressbar/dist/styles.css';
const Home: NextPage = () => {
const [correct, setCorrect] = useState(true)
const [err, setErr] = useState(true)
const [files, setFiles] = useState([])
const [file, setFile] = useState({})
const [data,setData] = useState("")
let i = 1;
let cards = new Array<JSX.Element>()
let correctClasses = 0
const getData = () =>{
let localFiles = JSON.parse(localStorage == undefined? "":localStorage.getItem("files") as string)
setFiles(localFiles)
setFile(localFiles[0])
if (data == ""){
axios.get(host+"/api/site/state/" + (localFiles[0] as any).uuid).then(res => {
if (res.data.paragraphs_processed > 0){
setTimeout(getData, 1000);
}
else{
axios.get(host+"/api/site/docx/" + (localFiles[0] as any).uuid).then(res => {
setData(res.data)
})
}
})
}
}
const onFileChange = (newFile:any) =>{
setData("")
axios.get(host+"/api/site/docx/" + newFile.uuid).then(res => {
setData(res.data)
})
setFile(newFile)
}
if (data == ""){
setTimeout(getData, 2000);
}
if (data != ""){
for(var name in data as any) {
if ((data as any)[name].correct){correctClasses++}
if (correct == false && (data as any)[name].correct == true){continue}
if (err == false && (data as any)[name].correct == false){continue}
cards.push(
<ErrorViewer
num={i}
paragraph={(data as any)[name].texts}
errText={name}
correct={(data as any)[name].correct}
></ErrorViewer>
)
i++
}
}
return (
<div className={styles.container}>
<Head>
<title>Загрузите файл</title>
<meta name="description" content="Generated by create next app" />
<link rel="icon" href="/favicon.ico" />
</Head>
<main className={styles.main}>
<Header></Header>
<div className={styles.selector}>{
files.length == 0? "" : <ItemSelect
onChange={(val)=>onFileChange(val as any)}
items={files.map((value:any)=> ({
name: value.file.slice(60, value.uuid.lenght),
value: value
} as SelectItemIE)
)}
></ItemSelect>
}
</div>
<div className={styles.pagination}>
<div className={styles.tools}>
<div><a href={(file as any).file}>Скачать файл</a></div>
<Checkbox checked={err} onChange={()=>setErr(!err)}>Есть замечания</Checkbox>
<Checkbox checked={correct} onChange={()=>setCorrect(!correct)}>Без замечаний </Checkbox>
</div>
{data == ""? <PulseLoader color={"#13377D"}></PulseLoader>:cards}
</div>
<div className={styles.progress}>
<CircularProgressbar
styles={{
root: {},
path: {
stroke: `#13377D`,
strokeLinecap: 'butt',
transition: 'stroke-dashoffset 0.5s ease 0s',
transform: 'rotate(1turn)',
transformOrigin: 'center center',
},
trail: {
stroke: '#fff',
strokeLinecap: 'round',
transformOrigin: 'center center',
},
text: {
fill: '#13377D',
fontWeight:'600',
fontSize: '20px',
},
background: {
fill: '#3e98c7',
},
}}
value={(correctClasses/39)*100} text={`${((correctClasses/39)*100).toFixed(0)}%`}></CircularProgressbar>
<div>Вероятность соответствия документа</div>
</div>
</main>
</div>
)
}
export default Home