TPS
/
halkbank_shahsyotag_frontend
4
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

styling corrections

This commit is contained in:
Aydogdy Agabayev 2022-03-17 14:57:41 +05:00
parent 1e5ae5bdc8
commit 579f09386b
10 changed files with 211 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/backend/sendRequest.js
View File

@ -2,7 +2,9 @@ import axios from "axios";
export const sendRequest = (url, token, data, setState, setLoader) => {
const form = new FormData();
form.append("file", data.file);
data.file.map((el) => {
form.append("file[]", el);
});
form.append("name", data.name);
form.append("last_name", data.surname);
form.append("middle_name", data.fathers);

8
src/backend/sendRequestCard.js
View File

@ -1,8 +1,12 @@
import axios from "axios";
// import { getDate } from "../helpers/Date";
export const sendRequestCard = (url, token, data, setLoader) => {
let today = new Date().toLocaleDateString();
const form = new FormData();
form.append("file", data.file);
data.file.map((el) => {
form.append("file[]", el);
});
form.append("name", data.name);
form.append("surname", data.surname);
form.append("middlename", data.middlename);
@ -20,6 +24,8 @@ export const sendRequestCard = (url, token, data, setLoader) => {
form.append("selected_time", data.selected_time);
form.append("the_codeword", data.the_codeword);
form.append("sms_notification", data.sms_notification);
// form.append("date", `today`);
axios
.post(`${url}?token=${token}`, form)
.then((res) => {

6
src/components/CardStages/CardStage4.js
View File

@ -176,19 +176,19 @@ const CardStage4 = ({ setStage, data, setData }) => {
if (files.input1) {
setData({
...data,
file: files.input1[0],
file: [files.input1[0]],
});
}
if (files.input2) {
setData({
...data,
file: files.input2[0],
file: [files.input2[0]],
});
}
if (files.input3) {
setData({
...data,
file: files.input3[0],
file: [files.input3[0]],
});
}
}

6
src/components/CreditStages/CreditStage5.js
View File

@ -171,19 +171,19 @@ const CreditStage5 = ({ setStage, data, setData }) => {
if (files.input1) {
setData({
...data,
file: files.input1[0],
file: [files.input1[0]],
});
}
if (files.input2) {
setData({
...data,
file: files.input2[0],
file: [files.input2[0]],
});
}
if (files.input3) {
setData({
...data,
file: files.input3[0],
file: [files.input3[0]],
});
}
}

50
src/components/global/LoggedNav.js
View File

@ -1,7 +1,8 @@
// IMPORT MODULES
import React, { useState, useContext } from "react";
import React, { useState, useContext, useRef } from "react";
import { Link } from "react-router-dom";
import { UserContext } from "../../backend/UserContext";
import { deleteUser } from "../../backend/deleteUser";
// IMPORT COMPONENTS
import Loader from "./Loader";
@ -14,15 +15,27 @@ import menu from "../../icons/menu.svg";
import userImg from "../../icons/user.svg";
const LoggedNav = ({ setSideOpen }) => {
const { user } = useContext(UserContext);
const { user, setUser } = useContext(UserContext);
const langBlock = useRef();
const userBlock = useRef();
const handleLanguage = (lang) => {
setLanguage(lang);
};
const [langOpen, setLangOpen] = useState(false);
const [language, setLanguage] = useState("РУС");
const [profile, setProfile] = useState(false);
return (
<nav className="nav logged-nav">
<nav
className="nav logged-nav"
onClick={(e) => {
if (!langBlock.current.contains(e.target)) {
setLangOpen(false);
}
if (!userBlock.current.contains(e.target)) {
setProfile(false);
}
}}
>
<div className="container">
<div className="nav-inner">
<div className="nav__left">
@ -45,7 +58,8 @@ const LoggedNav = ({ setSideOpen }) => {
<div className="nav__right">
<ul
className={langOpen ? "language active" : "language"}
onClick={() => {
ref={langBlock}
onClick={(e) => {
setLangOpen(!langOpen);
}}
>
@ -89,7 +103,31 @@ const LoggedNav = ({ setSideOpen }) => {
</ul>
</li>
</ul>
<div className="user">
<div
className={profile ? "user active" : "user"}
onClick={() => {
setProfile(!profile);
}}
ref={userBlock}
>
<div className="user-dropdown">
<ul>
<li>
<Link to="/home/profile">Данные профиля</Link>
</li>
<li>
<button
className="sign-out-btn"
onClick={() => {
deleteUser();
setUser(null);
}}
>
Выход
</button>
</li>
</ul>
</div>
<div className="user-img">
<img src={userImg} alt="user" />
</div>

75
src/pages/Base.js
View File

@ -1,5 +1,5 @@
// IMPORT MODULES
import React, { useContext } from "react";
import React, { useCallback, useContext, useState } from "react";
import { UserContext } from "../backend/UserContext";
// IMPORT COMPONENTS
@ -44,27 +44,39 @@ const Base = () => {
<tr key={i}>
<td>#{el.id}</td>
<td>{el.type}</td>
<td>--date</td>
<td>--status</td>
<td>--action</td>
</tr>
);
})
) : user.online_card !== [] ? (
user.online_card.map((el, i) => {
return (
<tr key={i}>
<td>#{el.id}</td>
<td>{el.type}</td>
<td>--date</td>
<td>{el.date}</td>
<td>--status</td>
<td>--action</td>
</tr>
);
})
) : user ? (
user.online_card !== [] ? (
""
) : (
<tr>
<td>Заявок нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
)
) : (
<tr>
<td>Заявок на карту нет</td>
<td>Заявок нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
)
) : user ? (
user.online_card !== [] ? (
""
) : (
<tr>
<td>Заявок нет</td>
<td></td>
<td></td>
<td></td>
@ -73,7 +85,38 @@ const Base = () => {
)
) : (
<tr>
<td>Заявок на карту нет</td>
<td>Заявок нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
)}
{user ? (
user.online_card !== [] ? (
user.online_card.map((el, i) => {
return (
<tr key={i}>
<td>#{el.id}</td>
<td>{el.selected_card}</td>
<td>{el.date}</td>
<td>--status</td>
<td>--action</td>
</tr>
);
})
) : (
<tr>
<td>Заявок нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
)
) : (
<tr>
<td>Заявок нет</td>
<td></td>
<td></td>
<td></td>

42
src/pages/Cards.js
View File

@ -1,5 +1,6 @@
// IMPORT MODULES
import React, { useState, useEffect } from "react";
import React, { useState, useEffect, useContext } from "react";
import { UserContext } from "../backend/UserContext";
// IMPORT COMPONENTS
import Breadcrumb from "../components/global/Breadcrumb";
@ -11,6 +12,7 @@ import card from "../icons/card-black.svg";
import add from "../icons/add.svg";
const Cards = () => {
const { user } = useContext(UserContext);
const [loader, setLoader] = useState(false);
const [modalOpen, setModalOpen] = useState(false);
const [stage, setStage] = useState(1);
@ -65,13 +67,37 @@ const Cards = () => {
<th>Статус</th>
<th>Действие</th>
</tr>
<tr>
<td>Заявок на карту нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
{user ? (
user.online_card !== [] ? (
user.online_card.map((el, i) => {
return (
<tr key={i}>
<td>#{el.id}</td>
<td>{el.selected_card}</td>
<td>{el.date}</td>
<td>--status</td>
<td>--action</td>
</tr>
);
})
) : (
<tr>
<td>Заявок на карту нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
)
) : (
<tr>
<td>Заявок на карту нет</td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
)}
</tbody>
</table>
</div>

2
src/pages/Credits.js
View File

@ -71,7 +71,7 @@ const Credits = () => {
<tr key={i}>
<td>#{el.id}</td>
<td>{el.type}</td>
<td>--date</td>
<td>{el.date}</td>
<td>--status</td>
<td>--action</td>
</tr>

2
src/pages/Recovery.js
View File

@ -36,7 +36,7 @@ const Recovery = () => {
if (
inputValid.email &&
inputValid.new === inputValid.match &&
inputValid.new !== ""
inputValid.new
) {
setBtnEnabled(true);
} else {

56
src/styles/_nav.scss
View File

@ -177,6 +177,62 @@
}
}
.user {
position: relative;
.user-dropdown {
border-radius: 1rem;
ul {
display: flex;
flex-direction: column;
li {
padding: 1rem;
background: transparent;
transition: 0.4s all ease;
&:hover {
background: #bebebe;
transition: 0.4s all ease;
}
}
}
a {
font-size: 1.4rem;
text-align: center;
display: block;
}
background: #dbdbdb;
z-index: 250;
position: absolute;
right: 0;
top: calc(100% + 0.6rem);
width: 100%;
overflow: hidden;
max-height: 0;
transition: 0.4s all ease;
}
&.active {
background-color: #c7c7c7;
transition: 0.4s all ease;
.user-dropdown {
max-height: 15rem;
transition: 0.4s all ease;
}
}
}
.sign-out-btn {
font-size: 1.4rem;
text-align: center;
display: block;
border: none;
background: none;
width: 100%;
height: 100%;
}
// MEDIA
@media screen and (max-width: 1000px) {