Skip to content

E
ESYTD
Commit ec48a63c authored by Merekeyev Dias's avatar Merekeyev Dias
Browse files
Options

changed the project structure

parent 1300270f
Hide whitespace changes
Inline Side-by-side
Showing with 185 additions and 202 deletions
src/App.tsx
View file @ ec48a63c
import React from 'react';
import { BrowserRouter, Routes, Route, Outlet } from 'react-router-dom';
import Header from './components/Header/Header';
import AuthPage from './pages/AuthPage/AuthPage';
import HomePage from './pages/HomePage';
import AddPage from './pages/AddPage';
import './App.css';
import HomePage from './pages/HomePage/HomePage';
import RequestPage from './pages/RequestPage/RequestPage';
import Header from './partials/Header/Header';
import EditPage from './pages/EditPage';
import AddPage from './pages/(crudPages)/AddPage';
import EditPage from './pages/(crudPages)/EditPage';
import 'react-material-symbols/rounded';
import './App.css';
const AuthLayout = () => {
return (
......
src/partials/Header/custom-drawer.css → src/components/Header/Header.css
View file @ ec48a63c
.header {
background-color: #041225;
color: #fff;
display: flex;
padding: 1rem .5rem;
justify-content: space-between;
min-width: 1440px;
}
.header_left {
display: flex;
align-items: center;
}
.header_title {
font-size: 1.1rem;
letter-spacing: 1px;
}
.header_logout {
margin-right: .5rem;
}
.menu {
background: transparent;
}
/* Customizing drawer */
.custom-drawer {
color: #fff;
......
src/partials/Header/Header.tsx → src/components/Header/Header.tsx
View file @ ec48a63c
......@@ -3,8 +3,7 @@ import { Link } from 'react-router-dom';
import { Menu, Button, Drawer } from 'antd';
import type { MenuProps } from 'antd';
import { MaterialSymbol } from 'react-material-symbols';
import styles from './Header.module.css';
import './custom-drawer.css';
import './Header.css';
type MenuItem = Required<MenuProps>['items'][number];
......@@ -18,8 +17,8 @@ const Header: React.FC = () => {
const [openMenu, setOpenMenu] = useState(false);
return (
<header className={styles.header}>
<div className={styles.header_left}>
<header className="header">
<div className="header_left">
<Button
type='text'
onClick={() => {
......@@ -42,15 +41,15 @@ const Header: React.FC = () => {
items={items}
defaultSelectedKeys={['1']}
mode='inline'
className={styles.menu}
className="menu"
onSelect={() => {
setOpenMenu(false)
}}
/>
</Drawer>
<h1 className={styles.header_title}>ЕСУТД</h1>
<h1 className="header_title">ЕСУТД</h1>
</div>
<Button type='text' className={styles.header_logout}>
<Button type='text' className="header_logout">
<MaterialSymbol icon='logout' size={24} color='#fff' />
</Button>
</header>
......
src/components/HomePage/Home.tsx deleted 100644 → 0
View file @ 1300270f
import { useNavigate } from 'react-router';
import { Button, Pagination } from 'antd';
import { MaterialSymbol } from 'react-material-symbols';
import '../../styles/Home/home.css';
const Home = () => {
const navigate = useNavigate();
const handleAddClick = () => {
navigate("/add");
};
const handlePaginationChange = (page: number | string | null) => {
console.log("Current page:", page);
};
return (
<section className='section'>
<div className="add">
<Button icon={<MaterialSymbol icon='add_circle' size={20} color='#0E2B52' />} className='add_title' onClick={handleAddClick}>
Добавить
</Button>
</div>
<div className="data">
<table className="data-table">
<thead>
<tr>
<th>ID</th>
<th>БИН</th>
<th>Код организации</th>
<th>Наименование организации</th>
<th>Адрес системы/хост</th>
<th>Статус</th>
<th>Действие</th>
<th>Действие</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>050940002848</td>
<td>organization_code_1</td>
<td>ТОО “Рога и Копыта”</td>
<td>esutd-dev.arta.kz</td>
<td>активен</td>
<td>
<button className="view-btn" onClick={() => navigate("/edit")}>
<MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
</button>
</td>
<td>
<button className="delete-btn">
<MaterialSymbol icon='delete' size={22} color='#0E2B52' />
</button>
</td>
</tr>
<tr>
<td>2</td>
<td>050940002848</td>
<td>organization_code_2</td>
<td>ТОО “Рога и Копыта”</td>
<td>techreg.gov.kz</td>
<td>заблокирован</td>
<td>
<button className="view-btn" onClick={() => navigate("/edit")}>
<MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
</button>
</td>
<td>
<button className="delete-btn">
<MaterialSymbol icon='delete' size={22} color='#0E2B52' />
</button>
</td>
</tr>
<tr>
<td>3</td>
<td>050940002848</td>
<td>organization_code_3</td>
<td>ТОО “Рога и Копыта”</td>
<td>kaspi.kz</td>
<td>удален</td>
<td>
<button className="view-btn" onClick={() => navigate("/edit")}>
<MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
</button>
</td>
<td>
<button className="delete-btn">
<MaterialSymbol icon='delete' size={22} color='#0E2B52' />
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div className='pagination-container'>
<Pagination current={1} defaultCurrent={1} pageSize={1} total={10} onChange={handlePaginationChange} />
</div>
</section>
);
};
export default Home;
src/pages/AddPage.tsx → src/pages/(crudPages)/AddPage.tsx
View file @ ec48a63c
import React from 'react';
import { Form, Input, Button } from 'antd';
import { Form, Input, Button, Select } from 'antd';
import { useNavigate } from 'react-router';
import "../../src/styles/Home/addPage.css";
import './style.css';
const { Item } = Form;
const { Option } = Select;
const AddPage: React.FC = () => {
const navigate = useNavigate();
......@@ -14,7 +15,7 @@ const AddPage: React.FC = () => {
layout="vertical"
name="organization_form"
initialValues={{ remember: true }}
className='form-add'
className='form'
>
<Item
label="БИН организации"
......@@ -64,8 +65,20 @@ const AddPage: React.FC = () => {
<Input.Password maxLength={128} placeholder="Максимальная длина: 128 символов" />
</Item>
<Item
label="Статус"
name="status"
rules={[{ required: true, message: 'Пожалуйста, выберите статус!' }]}
>
<Select placeholder="Выберите статус">
<Option value="active">Активен</Option>
<Option value="blocked">Заблокирован</Option>
<Option value="deleted">Удален</Option>
</Select>
</Item>
<div className='form-footer'>
<Item style={{ textAlign: 'right' }} className='form-footer-item'>
<Item style={{}} className='form-footer-item'>
<Button type="default" style={{ marginRight: '8px' }}
onClick={() => navigate("/")}>
Отмена
......
src/pages/EditPage.tsx → src/pages/(crudPages)/EditPage.tsx
View file @ ec48a63c
import React from 'react';
import { Form, Input, Button, Select } from 'antd';
import { useNavigate } from 'react-router';
import "../../src/styles/Home/editPage.css";
import './style.css';
const { Item } = Form;
const { Option } = Select;
const EditPage = () => {
const EditPage: React.FC = () => {
const navigate = useNavigate();
return (
......
src/styles/Home/editPage.css → src/pages/(crudPages)/style.css
View file @ ec48a63c
.container {
display: flex;
flex-direction: column;
height: calc(100vh - 80px);
min-height: calc(100vh - 80px);
padding: 10px 20px;
overflow: hidden;
}
.form {
margin-left: 20px;
margin-right: 20px;
margin-top: 10px;
padding-right: 20px;
margin: 10px 20px 80px;
flex: 1;
overflow-y: auto;
margin-bottom: 80px;
}
.form-footer {
......@@ -21,16 +18,17 @@
bottom: 0;
left: 0;
width: 100%;
background: white;
padding: 10px 20px;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
display: flex;
justify-content: flex-end;
align-items: center;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
background: white;
}
.form-footer-item {
margin-right: 20px;
padding: 10px;
margin: auto 0;
}
\ No newline at end of file
src/pages/HomePage.tsx deleted 100644 → 0
View file @ 1300270f
import React from 'react';
import Home from '../components/HomePage/Home';
import '../styles/Home/homePage.css'
const HomePage: React.FC = () => {
return (
<div className='container'>
<Home />
</div>
);
};
export default HomePage;
src/pages/HomePage/HomePage.tsx 0 → 100644
View file @ ec48a63c
import React from 'react';
import { useNavigate } from 'react-router';
import { MaterialSymbol } from 'react-material-symbols';
import { Button, Pagination } from 'antd';
import './Homepage.css';
const HomePage: React.FC = () => {
const navigate = useNavigate();
const handleAddClick = () => {
navigate("/add");
};
const handlePaginationChange = (page: number | string | null) => {
console.log("Current page:", page);
};
return (
<div className="container">
<section className='section'>
<div className="add">
<Button icon={<MaterialSymbol icon='add_circle' size={20} color='#0E2B52' />} className='add_title' onClick={handleAddClick}>
Добавить
</Button>
</div>
<div className="data">
<table className="data-table">
<thead>
<tr>
<th>ID</th>
<th>БИН</th>
<th>Код организации</th>
<th>Наименование организации</th>
<th>Адрес системы/хост</th>
<th>Статус</th>
<th>Действие</th>
<th>Действие</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>050940002848</td>
<td>organization_code_1</td>
<td>ТОО “Рога и Копыта”</td>
<td>esutd-dev.arta.kz</td>
<td>активен</td>
<td>
<button className="view-btn" onClick={() => navigate("/edit")}>
<MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
</button>
</td>
<td>
<button className="delete-btn">
<MaterialSymbol icon='delete' size={22} color='#0E2B52' />
</button>
</td>
</tr>
<tr>
<td>2</td>
<td>050940002848</td>
<td>organization_code_2</td>
<td>ТОО “Рога и Копыта”</td>
<td>techreg.gov.kz</td>
<td>заблокирован</td>
<td>
<button className="view-btn" onClick={() => navigate("/edit")}>
<MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
</button>
</td>
<td>
<button className="delete-btn">
<MaterialSymbol icon='delete' size={22} color='#0E2B52' />
</button>
</td>
</tr>
<tr>
<td>3</td>
<td>050940002848</td>
<td>organization_code_3</td>
<td>ТОО “Рога и Копыта”</td>
<td>kaspi.kz</td>
<td>удален</td>
<td>
<button className="view-btn" onClick={() => navigate("/edit")}>
<MaterialSymbol icon='visibility' size={20} color='#0E2B52' />
</button>
</td>
<td>
<button className="delete-btn">
<MaterialSymbol icon='delete' size={22} color='#0E2B52' />
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div className='pagination-container'>
<Pagination current={1} defaultCurrent={1} pageSize={1} total={10} onChange={handlePaginationChange} />
</div>
</section>
</div>
);
};
export default HomePage;
src/styles/Home/home.css → src/pages/HomePage/Homepage.css
View file @ ec48a63c
.container{
min-width: 1440px;
margin: 0 auto;
}
.section {
margin: 0 auto;
margin-top: 10px;
......
src/pages/RequestPage/RequestPage.tsx
View file @ ec48a63c
......@@ -2,7 +2,7 @@ import React from 'react';
import { DatePicker, Select, Button, Pagination } from 'antd';
import { MaterialSymbol } from 'react-material-symbols';
import dayjs from 'dayjs';
import styles from './RequestPage.module.css';
import './RequestPage.css';
const dateFormat = 'YYYY/MM/DD';
......@@ -12,14 +12,14 @@ const RequestPage: React.FC = () => {
}
return (
<div className={styles.container}>
<div className={styles.filter}>
<div className={styles.fields}>
<div className={styles.dates}>
<div className="container">
<div className="filter">
<div className="fields">
<div className="dates">
<DatePicker defaultValue={dayjs('2023/09/24', dateFormat)} format={dateFormat} style={{marginRight: 14}}/>
<DatePicker defaultValue={dayjs('2023/09/24', dateFormat)} format={dateFormat} />
</div>
<div className={styles.category}>
<div className="category">
<Select placeholder="Не выбрано" style={{width: 270}} options={[]} />
</div>
</div>
......@@ -110,7 +110,7 @@ const RequestPage: React.FC = () => {
</table>
</div>
</section>
<div className={styles.pagination_container}>
<div className="pagination_container">
<Pagination current={1} defaultCurrent={1} pageSize={1} total={10} onChange={handlePaginationChange} />
</div>
</div>
......
src/partials/Header/Header.module.css deleted 100644 → 0
View file @ 1300270f
.header {
background-color: #041225;
color: #fff;
display: flex;
padding: 1rem .5rem;
justify-content: space-between;
min-width: 1440px;
}
.header_left {
display: flex;
align-items: center;
}
.header_title {
font-size: 1.1rem;
letter-spacing: 1px;
}
.header_logout {
margin-right: .5rem;
}
.menu {
background: transparent;
}
\ No newline at end of file
src/styles/Home/addPage.css deleted 100644 → 0
View file @ 1300270f
.container {
display: flex;
flex-direction: column;
min-height: calc(100vh - 80px);
padding: 10px 20px;
overflow: hidden;
}
.form-add {
flex: 1;
padding-bottom: 80px;
margin-left: 20px;
}
.form-footer {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
padding: 10px 20px;
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
}
\ No newline at end of file
src/styles/Home/homePage.css deleted 100644 → 0
View file @ 1300270f
.container{
min-width: 1440px;
margin: 0 auto;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment