From 45c0531d192c23353c502bc3773a580aa4225c9b Mon Sep 17 00:00:00 2001 From: Firesieht Date: Sat, 27 Aug 2022 01:37:17 +0300 Subject: [PATCH] add upload page & create main --- Components/ErrorViewer/error.module.css | 77 +++++++++++++++++++++++++ Components/ErrorViewer/index.tsx | 41 ++++++++----- Components/header/header.module.css | 3 +- pages/api/interface.ts | 3 + pages/index.tsx | 61 ++++++++++++++++++-- pages/upload.tsx | 43 ++++++++++++++ public/images/correct.svg | 3 + styles/Home.module.css | 50 ++++++++++++++++ styles/globals.css | 2 +- 9 files changed, 263 insertions(+), 20 deletions(-) create mode 100644 pages/api/interface.ts create mode 100644 pages/upload.tsx create mode 100644 public/images/correct.svg diff --git a/Components/ErrorViewer/error.module.css b/Components/ErrorViewer/error.module.css index e69de29..59ee088 100644 --- a/Components/ErrorViewer/error.module.css +++ b/Components/ErrorViewer/error.module.css @@ -0,0 +1,77 @@ +.viewer{ + background: #FFFFFF; + color: rgba(0, 0, 0, 0.85); + font-family: 'Roboto', sans-serif; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 22px; + box-shadow: inset 0px -1px 0px #F0F0F0; + padding: 12px 16px; + cursor: pointer; + width: 100%; +} +.card{ + display: flex; + flex-direction: row; + justify-content: space-between; + gap:15px; + align-items: center; + user-select: none; +} + +.arrow{ + display: flex; + gap:7px +} + +.Text{ + max-width: 70%; + color: rgba(0, 0, 0, 0.45); +} + +.leftSide{ + display: flex; + flex-direction: row; + gap:25px +} + +.rightSide{ + display: flex; + flex-direction: row; + gap:50px +} + +.fixes{ + padding-top: 25px; + transition: 0.3s; + display: flex; + justify-content: left; + flex-direction: column; + gap:10px; + width: 100%; + font-family: 'Roboto', sans-serif; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 22px; + color: rgba(0, 0, 0, 0.45); + +} + +.paragraphs{ + display: flex; + justify-content: left; + flex-direction: column; + gap:10px; +} +.paragraph{ + display: flex; + justify-content: left; + flex-direction: column; + gap:5px; +} + +.correct{ + width: 110px; +} \ No newline at end of file diff --git a/Components/ErrorViewer/index.tsx b/Components/ErrorViewer/index.tsx index 0b89e13..4b10cd2 100644 --- a/Components/ErrorViewer/index.tsx +++ b/Components/ErrorViewer/index.tsx @@ -9,6 +9,7 @@ interface ErrorViewerIE{ paragraph: string[]; variants?: string[]; num: number; + correct:boolean } export const ErrorViewer : React.FC = (props) =>{ @@ -16,22 +17,33 @@ export const ErrorViewer : React.FC = (props) =>{ return( -
-
- -
{props.num}
-
- {props.errText} +
+
+
+ +
№{props.num}
+
+ {props.errText} +
-
setOpen(!open)}> - -
-
-
-
+
+
{props.correct? "Нет замечаний":"Есть замечания"}
+
setOpen(!open)} className={styles.arrow}> + Посмотреть + +
+
+
+ + { open? +
+
{ props.paragraph.map( - (value)=>
{value}
+ (value, index)=>
+
№{index+1}
+
{value}
+
) }
@@ -43,6 +55,9 @@ export const ErrorViewer : React.FC = (props) =>{ }
+ :
+ } +
); } \ No newline at end of file diff --git a/Components/header/header.module.css b/Components/header/header.module.css index b7521c2..73aadd9 100644 --- a/Components/header/header.module.css +++ b/Components/header/header.module.css @@ -10,6 +10,8 @@ justify-content: space-between; gap:100px; width: 100%; + border: 1px solid #F4F7FD; + box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.12); } .logo{ @@ -44,5 +46,4 @@ color: #FFFFFF; background: #13377D; transition: 0.3s; - } \ No newline at end of file diff --git a/pages/api/interface.ts b/pages/api/interface.ts new file mode 100644 index 0000000..c2d42a7 --- /dev/null +++ b/pages/api/interface.ts @@ -0,0 +1,3 @@ +export interface dtoIE{ + +} \ No newline at end of file diff --git a/pages/index.tsx b/pages/index.tsx index 2060328..3296c86 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -5,23 +5,74 @@ 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' + + 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}" + // ], + // "Условия": [] + // } + + + let i = 1; + let cards = new Array() + + for(var name in data) { + cards.push( + + ) + i++ + } + + return (
- Create Next App + Загрузите файл
-
- +
+ setFile(val as any)} + items={files} + >
-
- +
+ {cards}
diff --git a/pages/upload.tsx b/pages/upload.tsx new file mode 100644 index 0000000..321a98e --- /dev/null +++ b/pages/upload.tsx @@ -0,0 +1,43 @@ +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 { useRouter } from 'next/router' + + + +const Upload: NextPage = () => { + const [files, setFiles] = useState(new Array()) + let router = useRouter() + + const onNext = () =>{ + localStorage.setItem("files", JSON.stringify(files)) + + router.push("/") + } + + return ( +
+ + Create Next App + + + +
+
+
+ setFiles([...files, file])}> +
onNext()}>Далее
+
+ +
+
+ ) +} + +export default Upload diff --git a/public/images/correct.svg b/public/images/correct.svg new file mode 100644 index 0000000..d82121c --- /dev/null +++ b/public/images/correct.svg @@ -0,0 +1,3 @@ + + + diff --git a/styles/Home.module.css b/styles/Home.module.css index e69de29..40e7a96 100644 --- a/styles/Home.module.css +++ b/styles/Home.module.css @@ -0,0 +1,50 @@ +.selector{ + width: 20%; + height: calc(100vh - 120px); + padding: 50px; + padding-left: 100px; + display: flex; + justify-content: right; +} +.pagination{ + width: calc(80% - 100px); + height: calc(100vh - 120px); + padding: 50px; + overflow-y: scroll; +} + +.main{ + padding-top: 120px; + display: flex; + justify-content: space-around; +} + +.btn{ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 10px 24px; + gap: 10px; + font-style: normal; + font-weight: 500; + font-size: 18px; + line-height: 28px; + cursor: pointer; + + + color: #13377D; + background: #F4F7FD; + border: 1px solid #13377D; + border-radius: 8px; + transition: 0.3s; +} + +.upload{ + display: flex; + flex-direction: column; + gap:25px; + padding-top: 210px; + justify-content: center; + align-items: center; +} diff --git a/styles/globals.css b/styles/globals.css index bb7427b..833bf09 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -5,7 +5,7 @@ body { font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; } - +@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'); a { color: inherit; text-decoration: none;