add history and view of files

This commit is contained in:
Firesieht 2022-08-27 03:48:28 +03:00
parent badc37c44e
commit 12900998c8
8 changed files with 202 additions and 4579 deletions

View File

@ -1,6 +1,6 @@
.myselect{ .myselect{
border: none; border: none;
font-size: 24px; font-size: 14px;
color: #1C85BF; color: #1C85BF;
font-weight: 500; font-weight: 500;
outline: none; outline: none;

4552
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -15,7 +15,8 @@
"next": "12.2.5", "next": "12.2.5",
"react": "18.2.0", "react": "18.2.0",
"react-doc-viewer": "^0.1.5", "react-doc-viewer": "^0.1.5",
"react-dom": "18.2.0" "react-dom": "18.2.0",
"react-spinners": "^0.13.4"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "18.7.13", "@types/node": "18.7.13",

58
pages/history.tsx Normal file
View File

@ -0,0 +1,58 @@
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 { useRouter } from 'next/router'
const History: NextPage = () => {
let files = new Array<JSX.Element>()
const [data, setData] = useState("")
let router = useRouter()
if (data == ""){
axios.get(host+"/api/docx").then(res => {
setData(res.data)
})
}
if (data != ""){
(data as any).forEach((value:any) => {
files.push(
<div className={styles.fileCard} onClick={()=>router.push("/view/" + value.uuid)}>
{value.file.slice(48, value.file.lenght)}
</div>
)
});
}
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.history}>
{
data==""? <PulseLoader color={"#13377D"}></PulseLoader>:files
}
</div>
</main>
</div>
)
}
export default History

View File

@ -7,53 +7,60 @@ import styles from '../styles/Home.module.css'
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import { ItemSelect, SelectItemIE } from '../Components/ItemSelect' import { ItemSelect, SelectItemIE } from '../Components/ItemSelect'
import { useState } from 'react' import { useState } from 'react'
import { get } from './api/fetch'
import { host } from './api/consts'
import { PulseLoader } from 'react-spinners'
import axios from 'axios'
const Home: NextPage = () => { const Home: NextPage = () => {
const [file, setFile] = useState()
let files = JSON.parse(localStorage.getItem("files") as string) let files = JSON.parse(localStorage.getItem("files") as string)
// let data ={ const [file, setFile] = useState(files[0].uuid)
// "Цель предоставления субсидии": [ const [data,setData] = useState("")
// "1. {2} Настоящие Правила устанавливают цели, условия и порядок предоставления субсидии из федерального бюджета Фонду \"Центр стратегических разработок\" (далее - Фонд) в целях оценки эффектов от реализации инвестиционных проектов в сфере транспорта в рамках государственной программы Российской Федерации \"Экономическое развитие и инновационная экономика\" (далее - субсидия). {2}"
// ],
// "Размещение информации на едином портале бюджетной системы Российской Федерации": [
// "2. {3} Предоставление субсидии осуществляется в пределах лимитов бюджетных обязательств, доведенных в установленном порядке до Министерства экономического развития Российской Федерации как получателя средств федерального бюджета на цели, указанные в пункте 1 настоящих Правил. {3}"
// ],
// "Требования к участникам отбора": [
// "8. {11} Фонд по состоянию на 1-е число месяца, предшествующего месяцу, в котором заключается соглашение о предоставлении субсидии, должен соответствовать следующим требованиям: {11}"
// ],
// "Перечень документов, представляемых получателем субсидии для подтверждения соответствия требованиям": [
// "9. {19} Для заключения соглашения о предоставлении субсидии Фонд представляет в Министерство экономического развития Российской Федерации документы, подписанные руководителем Фонда (иным уполномоченным лицом), подтверждающие соответствие Фонда каждому из требований, предусмотренных пунктом 8 настоящих Правил. {19}"
// ],
// "Размер субсидии и (или) порядок расчета размера субсидии": [
// "6. {4} Субсидия предоставляется на финансовое обеспечение затрат, связанных с достижением целей, указанных в пункте 1 настоящих Правил, в том числе понесенных Фондом в текущем финансовом году до заключения соглашения о предоставлении субсидии (при наличии документов, подтверждающих фактически произведенные затраты), в размере, определяемом по формуле: {4}",
// "7. {22} Размер субсидии (Рсуб) определяется в пределах лимитов бюджетных обязательств, утвержденных и доведенных в установленном порядке до Министерства экономического развития Российской Федерации как получателя средств федерального бюджета на цели, указанные в пункте 1 настоящих Правил. {22}"
// ],
// "Условия и порядок заключения соглашения": [
// "3. {24} Субсидия предоставляется на основании соглашения о предоставлении субсидии, заключаемого между Министерством экономического развития Российской Федерации и Фондом (далее - соглашение о предоставлении субсидии). {24}",
// "4. {24} Соглашение о предоставлении субсидии содержит в том числе: {24}",
// "5. {24} Соглашение о предоставлении субсидии и дополнительные соглашения к нему, предусматривающие внесение изменений, или дополнительное соглашение о расторжении соглашения о предоставлении субсидии заключаются в государственной интегрированной информационной системе управления общественными финансами \"Электронный бюджет\" в соответствии с типовой формой, установленной Министерством финансов Российской Федерации.{24}"
// ],
// "Условия": []
// }
let i = 1; let i = 1;
let cards = new Array<JSX.Element>() let cards = new Array<JSX.Element>()
for(var name in data) { const getData = () =>{
cards.push( if (data == ""){
axios.get(host+"/api/docx/" + file).then(res => {
setData(res.data)
})
}
}
const onFileChange = (newFile:any) =>{
setData("")
axios.get(host+"/api/docx/" + newFile).then(res => {
setData(res.data)
})
setFile(newFile)
}
setTimeout(getData, 2000);
if (data != ""){
for(var name in data as any) {
cards.push(
<ErrorViewer <ErrorViewer
num={i} num={i}
paragraph={(data as any)[name][0]==undefined? ["Выявлено отсутсвие данного модуля"]:(data as any)[name]} paragraph={(data as any)[name][0]==undefined? ["Выявлено отсутсвие данного модуля"]:(data as any)[name]}
errText={name} errText={name}
correct={(data as any)[name][0]==undefined? false:true} correct={(data as any)[name][0]==undefined? false:true}
></ErrorViewer> ></ErrorViewer>
) )
i++ i++
}
} }
let select = new Array<SelectItemIE>()
files.forEach((value : any) => {
select.push(
{
name: value.file.slice(48, value.uuid.lenght),
value: value.uuid
} as SelectItemIE
)
});
return ( return (
<div className={styles.container}> <div className={styles.container}>
@ -67,12 +74,12 @@ const Home: NextPage = () => {
<div className={styles.selector}> <div className={styles.selector}>
<ItemSelect <ItemSelect
onChange={(val)=>setFile(val as any)} onChange={(val)=>onFileChange(val as any)}
items={files} items={select}
></ItemSelect> ></ItemSelect>
</div> </div>
<div className={styles.pagination}> <div className={styles.pagination}>
{cards} {data == ""? <PulseLoader color={"#13377D"}></PulseLoader>:cards}
</div> </div>
</main> </main>
</div> </div>

View File

@ -17,7 +17,6 @@ const Upload: NextPage = () => {
const onNext = () =>{ const onNext = () =>{
localStorage.setItem("files", JSON.stringify(files)) localStorage.setItem("files", JSON.stringify(files))
router.push("/") router.push("/")
} }

66
pages/view/[id].tsx Normal file
View File

@ -0,0 +1,66 @@
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 { host } from '../api/consts'
import { PulseLoader } from 'react-spinners'
import axios from 'axios'
import { useRouter } from 'next/router'
const View: NextPage = () => {
let router = useRouter()
let uuid = router.query.id as string
const [data,setData] = useState("")
let i = 1;
let cards = new Array<JSX.Element>()
const getData = () =>{
if (data == ""){
axios.get(host+"/api/docx/" + uuid).then(res => {
setData(res.data)
})
}
}
setTimeout(getData, 2000);
if (data != ""){
for(var name in data as any) {
cards.push(
<ErrorViewer
num={i}
paragraph={(data as any)[name][0]==undefined? ["Выявлено отсутсвие данного модуля"]:(data as any)[name]}
errText={name}
correct={(data as any)[name][0]==undefined? false:true}
></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.uploader}>
{data == ""? <PulseLoader color={"#13377D"}></PulseLoader>:cards}
</div>
</main>
</div>
)
}
export default View

View File

@ -48,3 +48,25 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.history{
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap:50px;
padding: 120px;
}
.fileCard{
background: #F4F7FD;
box-shadow: inset 0px -1px 0px #F0F0F0;
width: 240px;
height: 120PX;
padding: 25px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #13377D;
cursor: pointer;
}