Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
  • Loading branch information
Zoom-Developer committed Nov 12, 2024
2 parents 93f97de + 6183b44 commit e9bd0bd
Show file tree
Hide file tree
Showing 35 changed files with 641 additions and 144 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,3 +4,4 @@ __pycache__/
.env
data/
/frontend/node_modules
/frontend/dist
13 changes: 10 additions & 3 deletions frontend/src/app/index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,12 @@
--bg-main: radial-gradient(58.01% 47.04% at 50% 50%,rgb(99, 7, 33),rgb(19, 19, 19) 100%);
--font-system: Roboto;
--font-card: Roboto;

--photo-form-size-w: 290px;
--photo-form-size-h: 552px;
--scale-photo: 0.7;
--photo-form-size-w: calc(300px * var(--scale-photo));
--photo-form-size-h: calc(552px * var(--scale-photo));

--photo-buttons-size: 58px;
--photo-buttons-icon-size: 26px;

--bg-auth: linear-gradient(180.00deg, rgba(24, 24, 24, 0.69),rgba(10, 10, 10, 0.83) 100%),rgb(35, 35, 35);
--pink: rgb(255, 108, 166);
Expand All @@ -37,6 +40,10 @@
body {
margin: 0;
font-family: var(--font-system);
.g-popup_open {
z-index: 9999999999;
}


}

Expand Down
9 changes: 2 additions & 7 deletions frontend/src/app/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,14 @@ import { createRoot } from 'react-dom/client'
import {App} from './ui/app.tsx'
import './index.scss'
import UserProvider from './providers/userProvider.tsx'
import {ThemeProvider, ToasterComponent, ToasterProvider} from '@gravity-ui/uikit'
import '@gravity-ui/uikit/styles/fonts.css';
import '@gravity-ui/uikit/styles/styles.css';

createRoot(document.getElementById('root')!).render(
<ThemeProvider theme='dark'>
<UserProvider>
<ToasterProvider>
<App/>
<ToasterComponent mobile={true}></ToasterComponent>
</ToasterProvider>
<App/>
</UserProvider>
</ThemeProvider>

)


4 changes: 3 additions & 1 deletion frontend/src/app/providers/userProvider.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,9 @@ export default function UserProvider({ children }: IChildren) {
const [user, setUser] = useState<User | undefined | null>(undefined);

const updateUser = () => {
getUser().then(setUser)
getUser()
.then(setUser)
.catch(() => setUser(null))
console.log(user)
}

Expand Down
5 changes: 4 additions & 1 deletion frontend/src/app/router/router.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { useState } from "react";
import { FocusUser} from "../../entities";
import { Feed, Edit, History } from "../../pages";
import { Page } from "../ui/app";
Expand All @@ -8,12 +9,14 @@ interface Props {
}

export function Router({page, focus}: Props) {
const [verifySend, setVerify] = useState(false)

const nowPage = () => {
switch (page) {
case 'feed':
return <Feed focus={focus}/>
case 'edit':
return <Edit/>
return <Edit verifySend={verifySend} verify_hook={setVerify}/>
case 'history':
return <History/>
}
Expand Down
15 changes: 10 additions & 5 deletions frontend/src/app/ui/app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,12 @@ import {Auth} from '../../pages'
import { UserContext } from '../providers'
import { editIcon, feedIcon, historyIcon, NavBar, NavIcon } from '../../shared'
import { Router } from '../router/router'
import { ReactNotifications } from 'react-notifications-component'
import { ThemeProvider } from '@gravity-ui/uikit'
import ReactDOMClient from 'react-dom/client';
import {Toaster} from '@gravity-ui/uikit';

export type Page = 'feed' | 'history' | 'edit'
Toaster.injectReactDOMClient(ReactDOMClient);

export function App() {
const {user} = useContext(UserContext)
Expand All @@ -26,11 +29,13 @@ export function App() {
{src: historyIcon, hook: () => setPage('history'), active: page == 'history'},
]

return <main data-theme={user.male ? 'blue' : 'pink'} className={styles['main']}>
<ReactNotifications></ReactNotifications>
<NavBar buttons={buttons}/>
<Router page={page} focus={user.focus_user}/>
return <ThemeProvider theme='dark'>
<main data-theme={user.male ? 'blue' : 'pink'} className={styles['main']}>
<NavBar buttons={buttons}/>
<Router page={page} focus={user.focus_user}/>
</main>
</ThemeProvider>

}
}

29 changes: 26 additions & 3 deletions frontend/src/entities/user/api.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,41 @@ import { UserClient } from "../../shared";
import { User } from "./model";

export async function getUser(): Promise<User|null> {
return UserClient.get('').then(
return UserClient.get('')
.then(
response => {
return response.data
}
).catch(error => {
console.log(error)
return null
throw error
})
}

export async function editUser(newUser: User): Promise<User> {
return UserClient.patch('', newUser).then(
response => {
return response.data
}
).catch(error => {
console.log(error)
throw error
})
}

export async function updateAvatar(avatar: FormData) {
return UserClient.patch('/avatar', {avatar})
.then(response => {
return response.data
}).catch(error => {
console.log(error)
throw error
})
}

export async function genKey (username: string): Promise<string> {
return UserClient.post('/getauth', {username}).then(
return UserClient.post('/getauth', {username})
.then(
response => {
return response.data
}
Expand Down
29 changes: 2 additions & 27 deletions frontend/src/pages/auth/ui/auth.tsx
Original file line number Diff line number Diff line change
@@ -1,38 +1,13 @@
import styles from './style.module.scss'
import { ReactElement, useContext, useEffect, useState } from "react";
import { Sex, Stage, UserRegister } from "../model/types";
import {Input, Button, Select, Option, InputImg, TextArea, white2107, blue2107, pink2107 } from '../../../shared';
import {Input, Button, Select, Option, InputImg, TextArea, white2107, blue2107, pink2107, Literales } from '../../../shared';
import { CropWidget } from '../../../widgets';
import { UserContext } from '../../../app/providers';
import { register } from '../api/api';

export function Auth() {
const Literales: Option[] = [
{key: "10k", value: "10К"},
{key: "10c", value: "10С"},
{key: "10u", value: "10Ю"},
{key: "10y", value: "10У"},
{key: "10j", value: "10Ж"},
{key: "10i", value: "10И"},
{key: "10t", value: "10Т"},
{key: "10a", value: "10А"},
{key: "10b", value: "10Б"},
{key: "10g", value: "10Ж"},
{key: "10o", value: "10О"},
{key: "10f", value: "10Ф"},
{key: "11k", value: "11К"},
{key: "11c", value: "11С"},
{key: "11y", value: "11Ю"},
{key: "11j", value: "11Ж"},
{key: "11i", value: "11И"},
{key: "11t", value: "11Т"},
{key: "11a", value: "11А"},
{key: "11b", value: "11Б"},
{key: "11g", value: "11Ж"},
{key: "11o", value: "11О"},
{key: "11f", value: "11Ф"},
{key: "11p", value: "11П"},
]


const {updateUser} = useContext(UserContext)
const [theme, setTheme] = useState<'pink' | 'blue' | null>(null)
Expand Down
3 changes: 3 additions & 0 deletions frontend/src/pages/edit/model/model.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import { User } from "../../../entities";

export type UserEdit = Omit<User, 'focus_user' | 'focus_is_liked'>
132 changes: 130 additions & 2 deletions frontend/src/pages/edit/ui/edit.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,131 @@
export function Edit() {
return <>Редачить профиль</>
import { useContext, useState } from 'react'
import styles from './style.module.scss'
import { addNotify, Card } from '../../../shared'
import { ReactSVG } from 'react-svg'
import PencilToSquareIcon from '@gravity-ui/icons/svgs/pencil-to-square.svg';
import {SealCheck} from '@gravity-ui/icons';
import { Button, Icon, Portal } from '@gravity-ui/uikit'
import { UserContext } from '../../../app/providers'
import { ModalEdit } from './modal_edit';
import { ModalAbout, ModalName, ModalClass } from './modals';
import { CropWidget } from '../../../widgets';
import { updateAvatar, User } from '../../../entities';

const myRoot = document.getElementById('my-root');

interface Props {
verifySend: boolean
verify_hook: React.Dispatch<React.SetStateAction<boolean>>
}

export function Edit({verifySend, verify_hook}: Props) {
const [animEdit, setAnimEdit] = useState(false)
const [editModal, setEdit] = useState(false)
const [img, setImg] = useState<string | undefined>(undefined)
const {user, setUser} = useContext(UserContext)

const openModal = (func: React.Dispatch<React.SetStateAction<boolean>>) => {
setEdit(false)
func(true)
setAnimEdit(false)
}

const [litera, setLitera] = useState(false)
const [desc, setDesc] = useState(false)
const [name, setName] = useState(false)

const onEdit = () => {
setAnimEdit(true)
setEdit(true)
}

const onVerify = () => {
addNotify({
title: 'Заявка отправлена',
content: 'Заявка на верификацию успешно отправлена. Мы пришлем тебе уведомление после её рассмотрения',
type: 'info'
})
verify_hook(true)
}

const afterPhoto = (user: User) => {
setUser(user)
addNotify({
title: 'Фото обновлено',
content: 'Вы успешно обновили фотографию своего профиля'
})
}

const onPhoto = () => {
setAnimEdit(false)
if (img) {
fetch(img)
.then(res => res.blob())
.then(blob => {
const avatarForm = new FormData();
avatarForm.append('avatar', blob)
updateAvatar(avatarForm).then(afterPhoto)
})
}
}

if (user)
return <main className={styles['main']}>

{img && <CropWidget
img={img}
setImg={setImg}
onComplete={onPhoto}
/>
}


{myRoot && <Portal container={myRoot}>
<ModalEdit
is_open={editModal}
open_litera={() => openModal(setLitera)}
open_desc={() => openModal(setDesc)}
open_name={() => openModal(setName)}
set_photo={setImg}
close_hook={() => setEdit(false)
}
/>
</Portal>
}




<ModalAbout is_open={desc} close_hook={() => setDesc(false)} nowDesc={user.desc}></ModalAbout>
<ModalName is_open={name} close_hook={() => setName(false)} nowName={user.name} nowSur={user.surname}></ModalName>
<ModalClass is_open={litera} close_hook={() => setLitera(false)} nowClass={user.literal}></ModalClass>
<div className={styles['container']}>
<Card
name={focus.name}
surname={user.surname}
avatar={user.attachments[0]}
desc={user.desc}
litera={user.literal}
is_me_liked={false}
is_verify={user.verify}>
</Card>
<div className={styles['button-list']}>
<button className={styles['button']}>
<ReactSVG
className={`${styles['icon']} ${animEdit ? styles['active-edit'] : styles['edit-icon']}`}
src={PencilToSquareIcon}
onClick={onEdit}
/>
</button>
</div>
</div>
<div className={styles['bottom-widget-container']}>
<div style={verifySend ? { display: 'none'} : {}} className={styles['button-container']}>
<Button onClick={onVerify} pin='circle-circle' view='normal' size='m'>
<Icon data={SealCheck}></Icon>
Верификация
</Button>
</div>
</div>
</main>
}
17 changes: 17 additions & 0 deletions frontend/src/pages/edit/ui/modal.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
.content {
display: flex;
flex-direction: column;
align-items: center;
gap: 16px;
width: 100%;
padding-bottom: 12px;
--g-sheet-content-padding: 10px;
--g-text-body-font-weight: 400;
.button-list {
width: 100%;
display: flex;
flex-direction: column;
padding: 4px;
gap: 4px;
}
}
Loading

0 comments on commit e9bd0bd

Please sign in to comment.