add history and view of files

2024-11-22 01:26:46 +03:00 · 2022-08-27 03:48:28 +03:00 · 2022-08-27 03:48:28 +03:00 · 12900998c8
commit 12900998c8
parent badc37c44e
8 changed files with 202 additions and 4579 deletions
--- a/Components/ItemSelect/itemSelect.module.css
+++ b/Components/ItemSelect/itemSelect.module.css
@ -1,6 +1,6 @@
 .myselect{
    border: none;
-    font-size: 24px;
+    font-size: 14px;
    color: #1C85BF;
    font-weight: 500;
    outline: none;
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -15,7 +15,8 @@
    "next": "12.2.5",
    "react": "18.2.0",
    "react-doc-viewer": "^0.1.5",
-    "react-dom": "18.2.0"
+    "react-dom": "18.2.0",
+    "react-spinners": "^0.13.4"
  },
  "devDependencies": {
    "@types/node": "18.7.13",
--- a/pages/history.tsx
+++ b/pages/history.tsx
@ -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
--- a/pages/index.tsx
+++ b/pages/index.tsx
@ -7,42 +7,39 @@ 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'



 const Home: NextPage = () => {
-  const [file, setFile] = useState()
+  
  let files = JSON.parse(localStorage.getItem("files") as string)
-  // let data ={
-  //   "Цель предоставления субсидии": [
-  //     "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}"
-  //   ],
-  //   "Условия": []
-  // }
-  
-
+  const [file, setFile] = useState(files[0].uuid)
+  const [data,setData]  = useState("")
  let i = 1;
  let cards = new Array<JSX.Element>()

-  for(var name in data) { 
+  const getData = () =>{
+    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
        num={i}
@ -53,7 +50,17 @@ const Home: NextPage = () => {
      )
      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 (
    <div className={styles.container}>
@ -67,12 +74,12 @@ const Home: NextPage = () => {
        
          <div className={styles.selector}>
            <ItemSelect 
-              onChange={(val)=>setFile(val as any)}
-              items={files}
+              onChange={(val)=>onFileChange(val as any)}
+              items={select}
            ></ItemSelect>
          </div>
          <div className={styles.pagination}>
-              {cards}
+              {data == ""? <PulseLoader color={"#13377D"}></PulseLoader>:cards}
          </div>
      </main>
    </div>
--- a/pages/upload.tsx
+++ b/pages/upload.tsx
@ -17,7 +17,6 @@ const Upload: NextPage = () => {

  const onNext = () =>{
    localStorage.setItem("files", JSON.stringify(files))
-    
    router.push("/")
  }
  
--- a/pages/view/[id].tsx
+++ b/pages/view/[id].tsx
@ -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
--- a/styles/Home.module.css
+++ b/styles/Home.module.css
@ -48,3 +48,25 @@
    justify-content: 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;
+}