Compare commits

..

2 Commits

Author SHA1 Message Date
15bc323ee4 test: add client services 2025-06-10 17:06:19 +05:00
958f00069f test 2025-06-10 17:05:35 +05:00
56 changed files with 15953 additions and 3031 deletions

View File

@ -12,35 +12,36 @@ services:
start-api:
cd api && \
poetry run python -m ${API_APPLICATION_NAME}
source .venv/bin/activate && \
python -m ${API_APPLICATION_NAME}
start-client:
cd client && \
npm run dev
npm start
migrate:
cd api && \
source .venv/bin/activate && \
cd $(API_APPLICATION_NAME)/db && \
PYTHONPATH='../..' ALEMBIC_MIGRATIONS=True poetry run alembic upgrade $(args)
PYTHONPATH='../..' ALEMBIC_MIGRATIONS=True alembic upgrade $(args)
downgrade:
cd api && \
source .venv/bin/activate && \
cd $(API_APPLICATION_NAME)/db && \
PYTHONPATH='../..' poetry run alembic downgrade -1
PYTHONPATH='../..' alembic downgrade -1
revision:
cd api && \
source .venv/bin/activate && \
cd $(API_APPLICATION_NAME)/db && \
PYTHONPATH='../..' ALEMBIC_MIGRATIONS=True poetry run alembic revision --autogenerate
PYTHONPATH='../..' ALEMBIC_MIGRATIONS=True alembic revision --autogenerate
venv-api:
cd api && \
poetry env activate \
poetry install
venv-client:
cd client && \
npm install
install:
make migrate head && \
cd api && \
@ -57,8 +58,3 @@ format-api:
check-api:
cd api && \
poetry run ruff format . --check
regenerate-openapi-local:
cd client \
rm src/types/openapi-types.ts \
npx openapi-typescript http://localhost:8000/openapi -o src/types/openapi-types.ts

View File

@ -1,49 +1 @@
# Vorkout/connect
### Makefile cheat sheet
```Makefile
Dev:
venv-api create python virtual environment
venv-client install node modules
install Migrate database and initialize project
Application Api:
start-api Run api server
Application Client:
start-client Run client server
Prod:
...
Code:
check-api Check api code with ruff
format-api Reformat api code with ruff
Help:
...
Testing:
...
```
### Запуск в режиме разработки
Для запуска в режиме разработки нужно
1. Устрановить среду для clint и api
2. Запустить в докере или локально необходимые сервисы (базуб брокер и redis) `make services`
3. Для миграции и создания первого пользователя необходимо запустить `make install`
3. Запустить api `make start-api`
4. Запустить client `make start-client`
### Миграции алембик
1. Стоит внимательно учитывать, адрес какой базы стоит в настройках alembic - локальной или продакшн. Посмотреть это можно в файле [env.py](connect/api/api/db/alembic/env.py). Конфиг для локальной базы
```python
config.set_main_option(
"sqlalchemy.url",
f"mysql+pymysql://root:hackme@localhost:3306/connect_test",
)
```
Vorkout/connect

View File

@ -18,7 +18,8 @@ class DbCredentialsSchema(BaseModel):
class DefaultSettings(BaseSettings):
ENV: str = environ.get("ENV", "local")
PATH_PREFIX: str = environ.get("PATH_PREFIX", "/api/v1")
APP_HOST: str = environ.get("APP_HOST", "http://127.0.0.1")
# APP_HOST: str = environ.get("APP_HOST", "http://127.0.0.1")
APP_HOST: str = environ.get("APP_HOST", "http://localhost")
APP_PORT: int = int(environ.get("APP_PORT", 8000))
APP_ID: uuid.UUID = environ.get("APP_ID", uuid.uuid4())
LOGS_STORAGE_PATH: str = environ.get("LOGS_STORAGE_PATH", "storage/logs")

View File

@ -1,38 +0,0 @@
"""empty message
Revision ID: 93106fbe7d83
Revises: f1b06efacec0
Create Date: 2025-06-26 16:36:02.270706
"""
from typing import Sequence, Union
from alembic import op
import sqlalchemy as sa
from sqlalchemy.dialects import mysql
# revision identifiers, used by Alembic.
revision: str = '93106fbe7d83'
down_revision: Union[str, None] = 'f1b06efacec0'
branch_labels: Union[str, Sequence[str], None] = None
depends_on: Union[str, Sequence[str], None] = None
def upgrade() -> None:
"""Upgrade schema."""
# ### commands auto generated by Alembic - please adjust! ###
op.alter_column('account_keyring', 'key_value',
existing_type=mysql.VARCHAR(length=255),
type_=sa.String(length=512),
existing_nullable=False)
# ### end Alembic commands ###
def downgrade() -> None:
"""Downgrade schema."""
# ### commands auto generated by Alembic - please adjust! ###
op.alter_column('account_keyring', 'key_value',
existing_type=sa.String(length=512),
type_=mysql.VARCHAR(length=255),
existing_nullable=False)
# ### end Alembic commands ###

View File

@ -1,17 +1,19 @@
import math
from datetime import datetime, timezone
from enum import Enum
from typing import Optional
import math
from sqlalchemy import func, insert, select
from datetime import datetime, timezone
from sqlalchemy import insert, select, func
from sqlalchemy.ext.asyncio import AsyncConnection
from enum import Enum
from api.db.tables.account import account_table
from api.schemas.account.account import User
from api.schemas.endpoints.account import all_user_adapter, AllUser, AllUserResponse, UserCreate
from api.schemas.endpoints.account import AllUserResponse, all_user_adapter
async def get_user_accaunt_page(connection: AsyncConnection, page, limit) -> Optional[AllUserResponse]:
async def get_user_accaunt_page(connection: AsyncConnection, page, limit) -> Optional[User]:
"""
Получает список ползовелей заданных значениями page, limit.
"""
@ -45,28 +47,31 @@ async def get_user_accaunt_page(connection: AsyncConnection, page, limit) -> Opt
validated_users = all_user_adapter.validate_python(users_data)
return AllUserResponse(
users=validated_users,
amount_count=total_count,
amount_pages=total_pages,
current_page=page,
limit=limit,
)
return AllUserResponse(users=validated_users, amount_count=total_count, amount_pages=total_pages)
async def get_user_by_id(connection: AsyncConnection, user_id: int) -> Optional[AllUser]:
async def get_user_by_id(connection: AsyncConnection, id: int) -> Optional[User]:
"""
Получает юзера по id.
"""
query = select(account_table).where(account_table.c.id == user_id)
query = select(account_table).where(account_table.c.id == id)
user_db_cursor = await connection.execute(query)
user = user_db_cursor.mappings().one_or_none()
user_db = user_db_cursor.one_or_none()
if not user:
if not user_db:
return None
return AllUser.model_validate(user)
user_data = {
column.name: (
getattr(user_db, column.name).name
if isinstance(getattr(user_db, column.name), Enum)
else getattr(user_db, column.name)
)
for column in account_table.columns
}
return User.model_validate(user_data)
async def get_user_by_login(connection: AsyncConnection, login: str) -> Optional[User]:
@ -102,7 +107,7 @@ async def update_user_by_id(connection: AsyncConnection, update_values, user) ->
await connection.commit()
async def create_user(connection: AsyncConnection, user: UserCreate, creator_id: int) -> Optional[AllUser]:
async def create_user(connection: AsyncConnection, user: User, creator_id: int) -> Optional[User]:
"""
Создает нове поле в таблице account_table.
"""
@ -112,15 +117,14 @@ async def create_user(connection: AsyncConnection, user: UserCreate, creator_id:
email=user.email,
bind_tenant_id=user.bind_tenant_id,
role=user.role.value,
meta=user.meta or {},
meta=user.meta,
creator_id=creator_id,
created_at=datetime.now(timezone.utc),
status=user.status.value,
)
res = await connection.execute(query)
await connection.execute(query)
await connection.commit()
new_user = await get_user_by_id(connection, res.lastrowid)
return new_user
return user

View File

@ -8,14 +8,13 @@ from api.db.tables.account import account_table, account_keyring_table, KeyType,
from api.schemas.account.account import User
from api.schemas.account.account_keyring import AccountKeyring
from api.schemas.endpoints.account import AllUser
from api.utils.key_id_gen import KeyIdGenerator
from datetime import datetime, timezone
async def get_user(connection: AsyncConnection, login: str) -> tuple[Optional[AllUser], Optional[AccountKeyring]]:
async def get_user(connection: AsyncConnection, login: str) -> Optional[User]:
query = (
select(account_table, account_keyring_table)
.join(account_keyring_table, account_table.c.id == account_keyring_table.c.owner_id)
@ -46,7 +45,7 @@ async def get_user(connection: AsyncConnection, login: str) -> tuple[Optional[Al
for column in account_keyring_table.columns
}
user = AllUser.model_validate(user_data)
user = User.model_validate(user_data)
password = AccountKeyring.model_validate(password_data)
return user, password

View File

@ -1,14 +1,13 @@
from datetime import datetime, timedelta, timezone
from enum import Enum
from typing import Optional
from datetime import datetime, timezone
from enum import Enum
from sqlalchemy import insert, select, update
from sqlalchemy.dialects.mysql import insert as mysql_insert
from sqlalchemy import insert, select
from sqlalchemy.ext.asyncio import AsyncConnection
from api.db.tables.account import account_keyring_table, KeyStatus, KeyType
from api.db.tables.account import account_keyring_table
from api.schemas.account.account_keyring import AccountKeyring
from api.utils.hasher import hasher
async def get_key_by_id(connection: AsyncConnection, key_id: str) -> Optional[AccountKeyring]:
@ -68,37 +67,3 @@ async def create_key(connection: AsyncConnection, key: AccountKeyring, key_id: i
await connection.commit()
return key
async def create_password_key(connection: AsyncConnection, password: str | None, owner_id: int):
if password is None:
password = hasher.generate_password()
hashed_password = hasher.hash_data(password)
stmt = mysql_insert(account_keyring_table).values(
owner_id=owner_id,
key_type=KeyType.PASSWORD.value,
key_id="PASSWORD",
key_value=hashed_password,
created_at=datetime.now(timezone.utc),
expiry=datetime.now(timezone.utc) + timedelta(days=365),
status=KeyStatus.ACTIVE,
)
stmt.on_duplicate_key_update(key_value=hashed_password)
await connection.execute(stmt)
await connection.commit()
async def update_password_key(connection: AsyncConnection, owner_id: int, password: str):
stmt = select(account_keyring_table).where(account_keyring_table.c.owner_id == owner_id)
result = await connection.execute(stmt)
keyring = result.one_or_none()
if not keyring:
await create_password_key(connection, password, owner_id)
else:
stmt = (
update(account_keyring_table)
.values(key_value=hasher.hash_data(password), expiry=datetime.now(timezone.utc) + timedelta(days=365))
.where(account_keyring_table.c.owner_id == owner_id)
)
await connection.execute(stmt)
await connection.commit()

View File

@ -60,7 +60,7 @@ account_keyring_table = Table(
Column("owner_id", UnsignedInt, ForeignKey("account.id"), primary_key=True, nullable=False),
Column("key_type", SQLAEnum(KeyType), primary_key=True, nullable=False),
Column("key_id", String(40), primary_key=True, default=None),
Column("key_value", String(512), nullable=False),
Column("key_value", String(255), nullable=False),
Column("created_at", DateTime(timezone=True), server_default=func.now()),
Column("expiry", DateTime(timezone=True), nullable=True),
Column("status", SQLAEnum(KeyStatus), nullable=False),

View File

@ -4,24 +4,29 @@ from fastapi import (
HTTPException,
status,
)
from sqlalchemy.ext.asyncio import AsyncConnection
from api.db.connection.session import get_connection_dep
from api.db.logic.account import (
create_user,
get_user_accaunt_page,
get_user_by_id,
get_user_by_login,
update_user_by_id,
create_user,
get_user_by_login,
get_user_accaunt_page,
)
from api.db.logic.keyring import create_password_key, update_password_key
from api.db.tables.account import AccountStatus
from api.schemas.account.account import User
from api.db.tables.account import AccountStatus
from api.schemas.base import bearer_schema
from api.schemas.endpoints.account import AllUser, AllUserResponse, UserCreate, UserUpdate
from api.schemas.endpoints.account import UserUpdate, AllUserResponse
from api.services.auth import get_current_user
from api.services.update_data_validation import update_user_data_changes
from api.services.user_role_validation import db_user_role_validation
from api.services.update_data_validation import update_user_data_changes
api_router = APIRouter(
prefix="/account",
@ -46,11 +51,9 @@ async def get_all_account(
return user_list
@api_router.get("/{user_id}", dependencies=[Depends(bearer_schema)], response_model=UserUpdate)
@api_router.get("/{user_id}", dependencies=[Depends(bearer_schema)], response_model=User)
async def get_account(
user_id: int,
connection: AsyncConnection = Depends(get_connection_dep),
current_user=Depends(get_current_user),
user_id: int, connection: AsyncConnection = Depends(get_connection_dep), current_user=Depends(get_current_user)
):
authorize_user = await db_user_role_validation(connection, current_user)
@ -62,27 +65,26 @@ async def get_account(
return user
@api_router.post("", dependencies=[Depends(bearer_schema)], response_model=AllUser)
@api_router.post("", dependencies=[Depends(bearer_schema)], response_model=User)
async def create_account(
user: UserCreate,
connection: AsyncConnection = Depends(get_connection_dep),
current_user=Depends(get_current_user),
user: UserUpdate, connection: AsyncConnection = Depends(get_connection_dep), current_user=Depends(get_current_user)
):
authorize_user = await db_user_role_validation(connection, current_user)
user_validation = await get_user_by_login(connection, user.login)
if user_validation is None:
new_user = await create_user(connection, user, authorize_user.id)
await create_password_key(connection, user.password, new_user.id)
return new_user
await create_user(connection, user, authorize_user.id)
user_new = await get_user_by_login(connection, user.login)
return user_new
else:
raise HTTPException(
status_code=status.HTTP_400_BAD_REQUEST, detail="An account with this information already exists."
)
@api_router.put("/{user_id}", dependencies=[Depends(bearer_schema)], response_model=UserUpdate)
@api_router.put("/{user_id}", dependencies=[Depends(bearer_schema)], response_model=User)
async def update_account(
user_id: int,
user_update: UserUpdate,
@ -95,15 +97,12 @@ async def update_account(
if user is None:
raise HTTPException(status_code=status.HTTP_404_NOT_FOUND, detail="Account not found")
if user_update.password is not None:
await update_password_key(connection, user.id, user_update.password)
update_values = update_user_data_changes(user_update, user)
if update_values is None:
return user
user_update_data = UserUpdate.model_validate({**user.model_dump(), **update_values})
user_update_data = User.model_validate({**user.model_dump(), **update_values})
await update_user_by_id(connection, update_values, user)
@ -114,9 +113,7 @@ async def update_account(
@api_router.delete("/{user_id}", dependencies=[Depends(bearer_schema)], response_model=User)
async def delete_account(
user_id: int,
connection: AsyncConnection = Depends(get_connection_dep),
current_user=Depends(get_current_user),
user_id: int, connection: AsyncConnection = Depends(get_connection_dep), current_user=Depends(get_current_user)
):
authorize_user = await db_user_role_validation(connection, current_user)

View File

@ -1,14 +1,14 @@
from datetime import datetime, timedelta, timezone
import jwt
from fastapi import (
APIRouter,
Depends,
HTTPException,
Request,
Response,
status,
Request,
)
from loguru import logger
from fastapi_jwt_auth import AuthJWT
@ -22,7 +22,7 @@ from api.services.auth import authenticate_user
from api.db.logic.auth import add_new_refresh_token, upgrade_old_refresh_token
from api.schemas.endpoints.auth import Auth, Tokens
from api.schemas.endpoints.auth import Auth, Access
api_router = APIRouter(
prefix="/auth",
@ -30,11 +30,21 @@ api_router = APIRouter(
)
def get_login_from_jwt(token: str):
payload = jwt.decode(
token,
get_settings().SECRET_KEY,
algorithms=[get_settings().ALGORITHM],
)
return payload.get("sub")
class Settings(BaseModel):
authjwt_secret_key: str = get_settings().SECRET_KEY
# Configure application to store and get JWT from cookies
authjwt_token_location: set = {"headers"}
authjwt_token_location: set = {"headers", "cookies"}
authjwt_cookie_domain: str = get_settings().DOMAIN
authjwt_refresh_cookie_name: str = "refresh_token_cookie"
# Only allow JWT cookies to be sent over https
authjwt_cookie_secure: bool = get_settings().ENV == "prod"
@ -48,7 +58,7 @@ def get_config():
return Settings()
@api_router.post("", response_model=Tokens)
@api_router.post("", response_model=Access)
async def login_for_access_token(
user: Auth,
response: Response,
@ -68,7 +78,9 @@ async def login_for_access_token(
# headers={"WWW-Authenticate": "Bearer"},
)
access_token_expires = timedelta(minutes=get_settings().ACCESS_TOKEN_EXPIRE_MINUTES)
# access_token_expires = timedelta(minutes=get_settings().ACCESS_TOKEN_EXPIRE_MINUTES)
access_token_expires = timedelta(seconds=5)
refresh_token_expires = timedelta(days=get_settings().REFRESH_TOKEN_EXPIRE_DAYS)
logger.debug(f"refresh_token_expires {refresh_token_expires}")
@ -80,27 +92,26 @@ async def login_for_access_token(
await add_new_refresh_token(connection, refresh_token, refresh_token_expires_time, user)
return Tokens(access_token=access_token, refresh_token=refresh_token)
Authorize.set_refresh_cookies(refresh_token)
return Access(access_token=access_token)
@api_router.post("/refresh", response_model=Tokens)
@api_router.post("/refresh", response_model=Access)
async def refresh(
request: Request,
connection: AsyncConnection = Depends(get_connection_dep),
Authorize: AuthJWT = Depends(),
) -> Tokens:
try:
Authorize.jwt_refresh_token_required()
current_user = Authorize.get_jwt_subject()
except Exception:
refresh_token = request.headers.get("Authorization").split(" ")[1]
await upgrade_old_refresh_token(connection, refresh_token)
raise HTTPException(
status_code=status.HTTP_401_UNAUTHORIZED,
detail="Invalid refresh token",
)
):
refresh_token = request.cookies.get("refresh_token_cookie")
access_token_expires = timedelta(minutes=get_settings().ACCESS_TOKEN_EXPIRE_MINUTES)
if not refresh_token:
raise HTTPException(status_code=401, detail="Refresh token is missing")
Authorize.jwt_refresh_token_required(refresh_token)
current_user = Authorize.get_jwt_subject()
# try:
# access_token_expires = timedelta(minutes=get_settings().ACCESS_TOKEN_EXPIRE_MINUTES)
access_token_expires = timedelta(seconds=5)
new_access_token = Authorize.create_access_token(subject=current_user, expires_time=access_token_expires)
return Tokens(access_token=new_access_token)
return Access(access_token=new_access_token)

View File

@ -1,9 +1,9 @@
from typing import Optional, List
from datetime import datetime
from typing import List, Optional
from pydantic import EmailStr, Field, TypeAdapter
from api.db.tables.account import AccountRole, AccountStatus
from api.schemas.base import Base
@ -12,7 +12,6 @@ class UserUpdate(Base):
name: Optional[str] = Field(None, max_length=100)
login: Optional[str] = Field(None, max_length=100)
email: Optional[EmailStr] = None
password: Optional[str] = None
bind_tenant_id: Optional[str] = Field(None, max_length=40)
role: Optional[AccountRole] = None
meta: Optional[dict] = None
@ -21,17 +20,6 @@ class UserUpdate(Base):
status: Optional[AccountStatus] = None
class UserCreate(Base):
name: str = Field(max_length=100)
login: str = Field(max_length=100)
email: Optional[EmailStr] = None
password: Optional[str] = None
bind_tenant_id: Optional[str] = Field(None, max_length=40)
role: AccountRole
meta: Optional[dict] = None
status: AccountStatus
class AllUser(Base):
id: int
name: str
@ -47,8 +35,6 @@ class AllUserResponse(Base):
users: List[AllUser]
amount_count: int
amount_pages: int
current_page: int
limit: int
all_user_adapter = TypeAdapter(List[AllUser])

View File

@ -8,6 +8,9 @@ class Auth(Base):
password: str
class Tokens(Base):
class Refresh(Base):
refresh_token: str
class Access(Base):
access_token: str
refresh_token: str | None = None

View File

@ -1,25 +1,27 @@
from fastapi import Request, HTTPException
from typing import Optional
from fastapi import HTTPException, Request
from sqlalchemy.ext.asyncio import AsyncConnection
from api.db.logic.auth import get_user
# # from backend.schemas.users.token import TokenData
from api.schemas.account.account import User
from api.db.tables.account import AccountStatus
from api.schemas.endpoints.account import AllUser
from api.utils.hasher import hasher
from api.utils.hasher import Hasher
async def get_current_user(request: Request) -> str | HTTPException:
async def get_current_user(request: Request) -> Optional[User]:
if not hasattr(request.state, "current_user"):
return HTTPException(status_code=401, detail="Unauthorized")
return request.state.current_user
async def authenticate_user(connection: AsyncConnection, username: str, password: str) -> Optional[AllUser]:
async def authenticate_user(connection: AsyncConnection, username: str, password: str) -> Optional[User]:
sql_user, sql_password = await get_user(connection, username)
if not sql_user or sql_user.status != AccountStatus.ACTIVE:
return None
hasher = Hasher()
if not hasher.verify_data(password, sql_password.key_value):
return None
return sql_user

View File

@ -1,4 +1,3 @@
from fastapi_jwt_auth import AuthJWT
from starlette.middleware.base import BaseHTTPMiddleware
from fastapi import (
Request,
@ -12,6 +11,9 @@ import re
from re import escape
from fastapi_jwt_auth import AuthJWT
class MiddlewareAccessTokenValidadtion(BaseHTTPMiddleware):
def __init__(self, app):
super().__init__(app)
@ -30,8 +32,10 @@ class MiddlewareAccessTokenValidadtion(BaseHTTPMiddleware):
status_code=status.HTTP_405_METHOD_NOT_ALLOWED,
content={"detail": "Method not allowed"},
)
if any(pattern.match(request.url.path) for pattern in self.excluded_routes):
return await call_next(request)
auth_header = request.headers.get("Authorization")
if not auth_header:
return JSONResponse(
@ -39,6 +43,7 @@ class MiddlewareAccessTokenValidadtion(BaseHTTPMiddleware):
content={"detail": "Missing authorization header."},
headers={"WWW-Authenticate": "Bearer"},
)
try:
token = auth_header.split(" ")[1]
Authorize = AuthJWT(request)
@ -50,4 +55,5 @@ class MiddlewareAccessTokenValidadtion(BaseHTTPMiddleware):
content={"detail": "The access token is invalid or expired."},
headers={"WWW-Authenticate": "Bearer"},
)
return await call_next(request)

View File

@ -1,6 +1,4 @@
import hashlib
import secrets
# Хешер для работы с паролем.
@ -16,10 +14,3 @@ class Hasher:
def verify_data(self, password: str, hashed: str) -> bool:
# Проверяет пароль путем сравнения его хеша с сохраненным хешем.
return self.hash_data(password) == hashed
@staticmethod
def generate_password() -> str:
return secrets.token_urlsafe(20)
hasher = Hasher()

View File

@ -1,23 +1,32 @@
import asyncio
import os
import asyncio
import hashlib
import secrets
from api.db.connection.session import get_connection
from api.db.tables.account import account_keyring_table, account_table, AccountRole, KeyStatus, KeyType
from api.utils.hasher import hasher
from api.db.tables.account import account_table, account_keyring_table, AccountRole, KeyType, KeyStatus
from api.utils.key_id_gen import KeyIdGenerator
INIT_LOCK_FILE = "../init.lock"
DEFAULT_LOGIN = "vorkout"
def hash_password(password: str) -> str:
return hashlib.sha256(password.encode()).hexdigest()
def generate_password() -> str:
return secrets.token_urlsafe(20)
async def init():
if os.path.exists(INIT_LOCK_FILE):
print("Sorry, service is already initialized")
return
async with get_connection() as conn:
password = hasher.generate_password()
hashed_password = hasher.hash_data(password)
password = generate_password()
hashed_password = hash_password(password)
create_user_query = account_table.insert().values(
name=DEFAULT_LOGIN,

View File

@ -1,8 +1,10 @@
[project]
name = "api"
version = "0.0.5"
version = "0.0.3"
description = ""
authors = [{ name = "Vladislav", email = "vlad.dev@heado.ru" }]
authors = [
{name = "Vladislav",email = "vlad.dev@heado.ru"}
]
readme = "README.md"
requires-python = ">=3.11,<4.0"
dependencies = [

View File

@ -1,4 +1,5 @@
VITE_APP_WEBSOCKET_PROTOCOL=ws
VITE_APP_HTTP_PROTOCOL=http
VITE_APP_API_URL=localhost:8000
VITE_APP_URL=localhost:3000
REACT_APP_WEBSOCKET_PROTOCOL=ws
REACT_APP_HTTP_PROTOCOL=http
REACT_APP_API_URL=localhost:8000
REACT_APP_URL=localhost:3000
BROWSER=none

View File

@ -1,17 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="description" content="Web site created using Vite" />
<link rel="icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="/logo192.png" />
<link rel="manifest" href="/manifest.json" />
<title>VORKOUT</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

17414
client/package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,6 +1,6 @@
{
"name": "client",
"version": "0.0.5",
"version": "0.0.2",
"private": true,
"dependencies": {
"@ant-design/icons": "^5.6.1",
@ -9,6 +9,7 @@
"@testing-library/react": "^16.2.0",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.5.2",
"@types/node": "^16.18.126",
"@types/react": "^19.0.11",
"@types/react-dom": "^19.0.4",
"antd": "^5.24.7",
@ -20,13 +21,16 @@
"react-dom": "^18.3.1",
"react-i18next": "^15.5.1",
"react-router-dom": "^7.5.0",
"react-scripts": "5.0.1",
"typescript": "^4.9.5",
"web-vitals": "^2.1.4",
"zustand": "^5.0.5"
},
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
@ -45,13 +49,5 @@
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@esbuild-plugins/node-globals-polyfill": "^0.2.3",
"@types/node": "^20.19.1",
"@vitejs/plugin-react": "^4.5.2",
"typescript": "^5.8.3",
"vite": "^6.3.5",
"vite-plugin-node-polyfills": "^0.23.0"
}
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

43
client/public/index.html Normal file
View File

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>VORKOUT</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>

View File

@ -1,21 +1,10 @@
/* eslint-disable react-hooks/exhaustive-deps */
import React, { useEffect } from 'react';
import React from 'react';
import { Route, Routes } from 'react-router-dom';
import { useSetUserSelector } from './store/userStore';
import LoginPage from './pages/LoginPage';
import ProtectedRoute from './pages/ProtectedRoute';
import MainLayout from './pages/MainLayout';
import ProtectedRoute from './pages/ProtectedRoute';
import LoginPage from './pages/LoginPage';
function App() {
const setUser = useSetUserSelector();
useEffect(() => {
const storedUser = localStorage.getItem('user');
if (storedUser) {
setUser(JSON.parse(storedUser));
}
}, []);
return (
<div className="App">
<Routes>

View File

@ -1,13 +1,10 @@
import axios from 'axios';
import { Access, Auth } from '../types/auth';
import { User } from '../types/user';
import { AuthService } from '../services/auth';
import axiosRetry from 'axios-retry';
import { Auth, Tokens } from '@/types/auth';
import { useAuthStore } from '@/store/authStore';
import { AuthService } from '@/services/authService';
import { User, UserCreate, UserUpdate } from '@/types/user';
const baseURL = `${import.meta.env.VITE_APP_HTTP_PROTOCOL}://${
import.meta.env.VITE_APP_API_URL
}/api/v1`;
const baseURL = `${process.env.REACT_APP_HTTP_PROTOCOL}://${process.env.REACT_APP_API_URL}/api/v1`;
const base = axios.create({
baseURL,
@ -18,40 +15,35 @@ const base = axios.create({
});
base.interceptors.request.use((config) => {
if (config.url === '/auth/refresh') {
return config;
}
const token = useAuthStore.getState().accessToken;
const token = localStorage.getItem('accessToken');
if (token) {
config.headers.Authorization = `Bearer ${token}`;
}
return config;
});
axiosRetry(base, {
retries: 3,
retryDelay: (retryCount: number) => {
console.log(`retry attempt: ${retryCount}`);
return retryCount * 2000;
},
retryCondition: async (error: any) => {
if (error.code === 'ERR_CANCELED') {
return true;
}
return false;
},
});
// axiosRetry(base, {
// retries: 3,
// retryDelay: (retryCount: number) => {
// console.log(`retry attempt: ${retryCount}`);
// return retryCount * 2000;
// },
// retryCondition: async (error: any) => {
// if (error.code === 'ERR_CANCELED') {
// return true;
// }
// return false;
// },
// });
base.interceptors.response.use(
(response) => {
return response;
},
async function (error) {
if (!error.response) {
return Promise.reject(error);
}
console.log('error', error);
const originalRequest = error.response.config;
console.log('originalRequest._retry', originalRequest);
const urlTokens = error?.request?.responseURL.split('/');
const url = urlTokens[urlTokens.length - 1];
console.log('url', url);
@ -63,13 +55,11 @@ base.interceptors.response.use(
url !== 'logout'
) {
originalRequest._retry = true;
try {
await AuthService.refresh();
return base(originalRequest);
} catch (error) {
const res = await AuthService.refresh().catch(async () => {
await AuthService.logout();
return new Promise(() => {});
}
});
console.log('res', res);
return await base(originalRequest);
}
return await Promise.reject(error);
}
@ -77,22 +67,14 @@ base.interceptors.response.use(
const api = {
// auth
async login(auth: Auth): Promise<Tokens> {
const response = await base.post<Tokens>('/auth', auth);
async login(auth: Auth): Promise<Access> {
console.log(auth);
const response = await base.post<Access>('/auth', auth);
return response.data;
},
async refreshToken(): Promise<Tokens> {
const token = localStorage.getItem('refreshToken');
const response = await base.post<Tokens>(
'/auth/refresh',
{},
{
headers: {
Authorization: `Bearer ${token}`,
},
}
);
async refreshToken(): Promise<Access> {
const response = await base.post<Access>('/auth/refresh');
return response.data;
},
@ -101,30 +83,6 @@ const api = {
const response = await base.get<User>('/profile');
return response.data;
},
async getUsers(page: number, limit: number): Promise<any> {
const response = await base.get<User[]>(
`/account?page=${page}&limit=${limit}`
);
return response.data;
},
async getUserById(userId: number): Promise<User> {
const response = await base.get<User>(`/account/${userId}`);
return response.data;
},
async createUser(user: UserCreate): Promise<User> {
const response = await base.post<User>('/account', user);
return response.data;
},
async updateUser(userId: number, user: UserUpdate): Promise<User> {
const response = await base.put<User>(`/account/${userId}`, user);
return response.data;
},
// keyrings
};
export default api;

View File

@ -2,16 +2,12 @@ import { Drawer } from 'antd';
import { useEffect, useState } from 'react';
import { Avatar, Typography } from 'antd';
import { useTranslation } from 'react-i18next';
import { useUserSelector } from '@/store/userStore';
interface ContentDrawerProps {
open: boolean;
closeDrawer: () => void;
children: React.ReactNode;
type: 'create' | 'edit';
login?: string;
name?: string;
email?: string | null;
}
export default function ContentDrawer({
@ -19,11 +15,7 @@ export default function ContentDrawer({
closeDrawer,
children,
type,
login,
name,
email,
}: ContentDrawerProps) {
const user = useUserSelector();
const { t } = useTranslation();
const [width, setWidth] = useState<number | string>('30%');
@ -38,7 +30,6 @@ export default function ContentDrawer({
window.addEventListener('resize', calculateWidths);
return () => window.removeEventListener('resize', calculateWidths);
}, []);
console.log(login, user?.login, login === user?.login);
const editDrawerTitle = (
<div
@ -68,21 +59,16 @@ export default function ContentDrawer({
<div style={{ display: 'flex', alignItems: 'center', gap: 12, flex: 1 }}>
<Avatar
src={
login ? `https://gamma.heado.ru/go/ava?name=${login}` : undefined
}
src="https://cdn-icons-png.flaticon.com/512/219/219986.png"
size={40}
style={{ flexShrink: 0 }}
/>
<div>
<Typography.Text
strong
style={{ display: 'block', fontSize: '20px' }}
>
{name} {login === user?.login ? t('you') : ''}
<Typography.Text strong style={{ display: 'block' }}>
Александр Александров
</Typography.Text>
<Typography.Text type="secondary" style={{ fontSize: 14 }}>
{email}
alexandralex@vorkout.ru
</Typography.Text>
</div>
</div>
@ -166,7 +152,7 @@ export default function ContentDrawer({
placement="right"
open={open}
width={width}
destroyOnHidden={true}
destroyOnClose={true}
closable={false}
>
{children}

View File

@ -1,9 +1,5 @@
import { useUserSelector } from '@/store/userStore';
import { Avatar } from 'antd';
import Title from 'antd/es/typography/Title';
import { useState } from 'react';
import ContentDrawer from './ContentDrawer';
import UserEdit from './UserEdit';
interface HeaderProps {
title: string;
@ -11,13 +7,6 @@ interface HeaderProps {
}
export default function Header({ title, additionalContent }: HeaderProps) {
const [openEdit, setOpenEdit] = useState(false);
const showEditDrawer = () => setOpenEdit(true);
const closeEditDrawer = () => {
setOpenEdit(false);
};
const user = useUserSelector();
return (
<div
style={{
@ -54,24 +43,13 @@ export default function Header({ title, additionalContent }: HeaderProps) {
alignItems: 'center',
justifyContent: 'center',
}}
onClick={showEditDrawer}
>
<Avatar
size={25.77}
src={`https://gamma.heado.ru/go/ava?name=${user?.login}`}
src={`https://cdn-icons-png.flaticon.com/512/219/219986.png`}
/>
</div>
</div>
<ContentDrawer
login={user?.login}
name={user?.name}
email={user?.email}
open={openEdit}
closeDrawer={closeEditDrawer}
type="edit"
>
{user?.id && <UserEdit closeDrawer={closeEditDrawer} userId={user?.id} />}
</ContentDrawer>
</div>
);
}

View File

@ -1,4 +1,3 @@
import { useUserSelector } from '@/store/userStore';
import { Divider, Menu, Tooltip } from 'antd';
import React from 'react';
import { useTranslation } from 'react-i18next';
@ -14,7 +13,6 @@ export default function SiderMenu({
selectedKey,
hangleMenuClick,
}: SiderMenuProps) {
const user = useUserSelector();
const { t } = useTranslation();
const collapseStyle = collapsed
? { fontSize: '12px' }
@ -76,17 +74,15 @@ export default function SiderMenu({
label: t('settings'),
className: 'no-expand-icon',
children: [
user && (user.role === 'OWNER' || user.role === 'ADMIN')
? {
key: '/accounts',
label: !collapsed ? (
<Tooltip title={t('accounts')}>{t('accounts')}</Tooltip>
) : (
t('accounts')
),
style: collapseStyle,
}
: undefined,
{
key: '/accounts',
label: !collapsed ? (
<Tooltip title={t('accounts')}>{t('accounts')}</Tooltip>
) : (
t('accounts')
),
style: collapseStyle,
},
{
key: '/events-list',
label: !collapsed ? (

View File

@ -8,19 +8,13 @@ import {
UploadFile,
GetProp,
UploadProps,
message,
Spin,
} from "antd";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { useUserSelector } from "@/store/userStore";
import { UserCreate as NewUserCreate } from "@/types/user";
import { UserService } from "@/services/userService";
import { LoadingOutlined } from "@ant-design/icons";
} from 'antd';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
const { Option } = Select;
type FileType = Parameters<GetProp<UploadProps, "beforeUpload">>[0];
type FileType = Parameters<GetProp<UploadProps, 'beforeUpload'>>[0];
const getBase64 = (file: FileType): Promise<string> =>
new Promise((resolve, reject) => {
@ -30,17 +24,10 @@ const getBase64 = (file: FileType): Promise<string> =>
reader.onerror = (error) => reject(error);
});
interface UserCreateProps {
closeDrawer: () => void;
getUsers: () => Promise<void>;
}
export default function UserCreate({ closeDrawer, getUsers }: UserCreateProps) {
const user = useUserSelector();
export default function UserCreate() {
const { t } = useTranslation();
const [previewOpen, setPreviewOpen] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [loading, setLoading] = useState(false);
const [previewImage, setPreviewImage] = useState('');
const [fileList, setFileList] = useState<UploadFile[]>([]);
@ -53,49 +40,40 @@ export default function UserCreate({ closeDrawer, getUsers }: UserCreateProps) {
setPreviewOpen(true);
};
const handleChange: UploadProps["onChange"] = ({ fileList: newFileList }) =>
const handleChange: UploadProps['onChange'] = ({ fileList: newFileList }) =>
setFileList(newFileList);
const onFinish = async (values: NewUserCreate) => {
setLoading(true);
await UserService.createUser(values);
await getUsers();
closeDrawer();
setLoading(false);
message.info(t("createdAccountMessage"), 4);
};
const customUploadButton = (
<div>
<div
style={{
height: "102px",
width: "102px",
backgroundColor: "#E2E2E2",
borderRadius: "50%",
display: "flex",
alignItems: "center",
justifyContent: "center",
height: '102px',
width: '102px',
backgroundColor: '#E2E2E2',
borderRadius: '50%',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
marginBottom: 8,
marginTop: 30,
cursor: "pointer",
cursor: 'pointer',
}}
>
<img
src="./icons/drawer/add_photo_alternate.svg"
alt="add_photo_alternate"
style={{ height: "18px", width: "18px" }}
style={{ height: '18px', width: '18px' }}
/>
</div>
<span style={{ fontSize: "14px", color: "#8c8c8c" }}>
{t("selectPhoto")}
<span style={{ fontSize: '14px', color: '#8c8c8c' }}>
{t('selectPhoto')}
</span>
</div>
);
const photoToUpload = (
<div style={{ height: "102px" }}>
<div style={{ height: '102px' }}>
<Upload
listType="picture-circle"
fileList={fileList}
@ -107,11 +85,11 @@ export default function UserCreate({ closeDrawer, getUsers }: UserCreateProps) {
</Upload>
{previewImage && (
<Image
wrapperStyle={{ display: "none" }}
wrapperStyle={{ display: 'none' }}
preview={{
visible: previewOpen,
onVisibleChange: (visible) => setPreviewOpen(visible),
afterOpenChange: (visible) => !visible && setPreviewImage(""),
afterOpenChange: (visible) => !visible && setPreviewImage(''),
}}
src={previewImage}
/>
@ -122,24 +100,24 @@ export default function UserCreate({ closeDrawer, getUsers }: UserCreateProps) {
return (
<div
style={{
display: "flex",
flexDirection: "column",
height: "100%",
display: 'flex',
flexDirection: 'column',
height: '100%',
}}
>
<div
style={{
display: "flex",
alignItems: "center",
justifyContent: "center",
marginBottom: "36px",
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
marginBottom: '36px',
}}
>
<div
style={{
display: "flex",
flexDirection: "column",
alignItems: "center",
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
}}
>
{photoToUpload}
@ -148,85 +126,83 @@ export default function UserCreate({ closeDrawer, getUsers }: UserCreateProps) {
<Form
name="user-edit-form"
layout="vertical"
onFinish={onFinish}
// onFinish={onFinish}
initialValues={{
name: "",
login: "",
password: "",
email: "",
bindTenantId: "",
role: "",
status: "",
name: '',
login: '',
password: '',
email: '',
tenant: '',
role: '',
status: '',
}}
style={{ flex: 1, display: "flex", flexDirection: "column" }}
style={{ flex: 1, display: 'flex', flexDirection: 'column' }}
>
<Form.Item
label={t("name")}
label={t('name')}
name="name"
rules={[{ required: true, message: t("nameMessage") }]}
rules={[{ required: true, message: t('nameMessage') }]}
>
<Input />
</Form.Item>
<Form.Item
label={t("login")}
label={t('login')}
name="login"
rules={[{ required: true, message: t("loginMessage") }]}
rules={[{ required: true, message: t('loginMessage') }]}
>
<Input />
</Form.Item>
<Form.Item
label={t("password")}
label={t('password')}
name="password"
rules={[{ message: t("passwordMessage") }]}
rules={[{ required: true, message: t('passwordMessage') }]}
>
<Input.Password />
</Form.Item>
<Form.Item
label={t("email")}
label={t('email')}
name="email"
rules={[
{ message: t("emailMessage") },
{ type: "email", message: t("emailErrorMessage") },
{ required: true, message: t('emailMessage') },
{ type: 'email', message: t('emailErrorMessage') },
]}
>
<Input />
</Form.Item>
<Form.Item
label={t("tenant")}
name="bindTenantId"
rules={[{ message: t("tenantMessage") }]}
label={t('tenant')}
name="tenant"
rules={[{ required: true, message: t('tenantMessage') }]}
>
<Input />
</Form.Item>
<Form.Item
label={t("role")}
label={t('role')}
name="role"
rules={[{ required: true, message: t("roleMessage") }]}
rules={[{ required: true, message: t('roleMessage') }]}
>
<Select placeholder={t("roleMessage")}>
{user && user.role === "OWNER" ? (
<Option value="ADMIN">{t("ADMIN")}</Option>
) : undefined}
<Option value="EDITOR">{t("EDITOR")}</Option>
<Option value="VIEWER">{t("VIEWER")}</Option>
<Select placeholder={t('roleMessage')}>
<Option value="Директор магазина">Директор магазина</Option>
<Option value="Менеджер">Менеджер</Option>
<Option value="Кассир">Кассир</Option>
</Select>
</Form.Item>
<Form.Item
label={t("status")}
label={t('status')}
name="status"
rules={[{ required: true, message: t("statusMessage") }]}
rules={[{ required: true, message: t('statusMessage') }]}
>
<Select placeholder={t("statusMessage")}>
<Option value="ACTIVE">{t("ACTIVE")}</Option>
<Option value="DISABLED">{t("DISABLED")}</Option>
<Option value="BLOCKED">{t("BLOCKED")}</Option>
<Option value="DELETED">{t("DELETED")}</Option>
<Select placeholder={t('statusMessage')}>
<Option value="ACTIVE">Активен</Option>
<Option value="DISABLED">Неактивен</Option>
<Option value="BLOCKED">Заблокирован</Option>
<Option value="DELETED">Удален</Option>
</Select>
</Form.Item>
@ -237,23 +213,14 @@ export default function UserCreate({ closeDrawer, getUsers }: UserCreateProps) {
type="primary"
htmlType="submit"
block
style={{ color: "#000" }}
style={{ color: '#000' }}
>
{loading ? (
<>
<Spin indicator={<LoadingOutlined spin />} size="small"></Spin>{" "}
{t("saving")}
</>
) : (
<>
<img
src="/icons/drawer/reg.svg"
alt="save"
style={{ height: "18px", width: "18px" }}
/>{" "}
{t("addAccount")}
</>
)}
<img
src="/icons/drawer/reg.svg"
alt="save"
style={{ height: '18px', width: '18px' }}
/>{' '}
{t('addAccount')}
</Button>
</Form.Item>
</Form>

View File

@ -1,101 +1,47 @@
import { UserService } from '@/services/userService';
import { useUserSelector } from '@/store/userStore';
import { UserUpdate } from '@/types/user';
import { LoadingOutlined } from '@ant-design/icons';
import { Button, Form, Input, message, Select, Spin } from 'antd';
import { useEffect, useState } from 'react';
import { Button, Form, Input, Select } from 'antd';
import { useTranslation } from 'react-i18next';
const { Option } = Select;
interface UserEditProps {
userId?: number;
closeDrawer: () => void;
}
export default function UserEdit({ userId, closeDrawer }: UserEditProps) {
const currentUser = useUserSelector();
const [form] = Form.useForm();
export default function UserEdit() {
const { t } = useTranslation();
const [user, setUser] = useState<UserUpdate>({
id: 0,
name: '',
login: '',
email: '',
password: '',
bindTenantId: '',
role: 'VIEWER',
meta: {},
createdAt: '',
status: 'ACTIVE',
});
const [loading, setLoading] = useState(false);
useEffect(() => {
async function getUser() {
if (typeof userId === 'undefined') {
return;
}
const user = await UserService.getUserById(userId);
setUser(user);
form.setFieldsValue({ ...user });
}
getUser();
}, []);
const onFinish = async (values: UserUpdate) => {
setLoading(true);
let updatedUser: Partial<UserUpdate> = {};
(Object.keys(values) as Array<keyof UserUpdate>).forEach((key) => {
if (values[key] !== user[key]) {
updatedUser = { ...updatedUser, [key]: values[key] };
}
});
if (Object.keys(updatedUser).length > 0) {
console.log('updateUser', userId, updatedUser);
await UserService.updateUser(userId!, updatedUser);
}
setLoading(false);
message.info(t('editAccountMessage'), 4);
closeDrawer();
};
return (
<div style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
<Form
form={form}
name="user-edit-form"
layout="vertical"
onFinish={onFinish}
initialValues={{ ...user }}
// onFinish={onFinish}
initialValues={{
name: 'Александр Александров',
login: 'alexandralex@vorkout.ru',
password: 'jKUUl776GHd',
email: 'alexandralex@vorkout.ru',
tenant: 'text',
role: 'Директор магазина',
status: 'Активен',
}}
style={{ flex: 1, display: 'flex', flexDirection: 'column' }}
>
<Form.Item
label={t('name')}
name="name"
rules={[{ message: t('nameMessage') }]}
rules={[{ required: true, message: t('nameMessage') }]}
>
<Input />
</Form.Item>
{user?.id === currentUser?.id ? undefined : (
<Form.Item
label={t('login')}
name="login"
rules={[{ message: t('loginMessage') }]}
>
<Input />
</Form.Item>
)}
<Form.Item
label={t('login')}
name="login"
rules={[{ required: true, message: t('loginMessage') }]}
>
<Input />
</Form.Item>
<Form.Item
label={t('password')}
name="password"
rules={[{ message: t('passwordMessage') }]}
rules={[{ required: true, message: t('passwordMessage') }]}
>
<Input.Password />
</Form.Item>
@ -113,27 +59,23 @@ export default function UserEdit({ userId, closeDrawer }: UserEditProps) {
<Form.Item
label={t('tenant')}
name="bindTenantId"
name="tenant"
rules={[{ required: true, message: t('tenantMessage') }]}
>
<Input />
</Form.Item>
{user?.id === currentUser?.id ? undefined : (
<Form.Item
label={t('role')}
name="role"
rules={[{ required: true, message: t('roleMessage') }]}
>
<Select placeholder={t('roleMessage')}>
{currentUser && currentUser.role === 'OWNER' ? (
<Option value="ADMIN">{t('ADMIN')}</Option>
) : undefined}
<Option value="EDITOR">{t('EDITOR')}</Option>
<Option value="VIEWER">{t('VIEWER')}</Option>
</Select>
</Form.Item>
)}
<Form.Item
label={t('role')}
name="role"
rules={[{ required: true, message: t('roleMessage') }]}
>
<Select placeholder={t('roleMessage')}>
<Option value="Директор магазина">Директор магазина</Option>
<Option value="Менеджер">Менеджер</Option>
<Option value="Кассир">Кассир</Option>
</Select>
</Form.Item>
<Form.Item
label={t('status')}
@ -141,10 +83,10 @@ export default function UserEdit({ userId, closeDrawer }: UserEditProps) {
rules={[{ required: true, message: t('statusMessage') }]}
>
<Select placeholder={t('statusMessage')}>
<Option value="ACTIVE">{t('ACTIVE')}</Option>
<Option value="DISABLED">{t('DISABLED')}</Option>
<Option value="BLOCKED">{t('BLOCKED')}</Option>
<Option value="DELETED">{t('DELETED')}</Option>
<Option value="ACTIVE">Активен</Option>
<Option value="DISABLED">Неактивен</Option>
<Option value="BLOCKED">Заблокирован</Option>
<Option value="DELETED">Удален</Option>
</Select>
</Form.Item>
@ -157,21 +99,12 @@ export default function UserEdit({ userId, closeDrawer }: UserEditProps) {
block
style={{ color: '#000' }}
>
{loading ? (
<>
<Spin indicator={<LoadingOutlined spin />} size="small"></Spin>{' '}
{t('saving')}
</>
) : (
<>
<img
src="/icons/drawer/save.svg"
alt="save"
style={{ height: '18px', width: '18px' }}
/>{' '}
{t('save')}
</>
)}
<img
src="/icons/drawer/save.svg"
alt="save"
style={{ height: '18px', width: '18px' }}
/>{' '}
{t('save')}
</Button>
</Form.Item>
</Form>

View File

@ -1,9 +1,8 @@
import '@/config/i18n';
import './i18n';
import { ConfigProvider } from 'antd';
import { useTranslation } from 'react-i18next';
import { BrowserRouter } from 'react-router-dom';
import { theme } from '@/config/customTheme';
import { theme } from './customTheme';
import en from 'antd/locale/en_US';
import ru from 'antd/locale/ru_RU';
@ -19,7 +18,7 @@ export default function AppWrapper({ children }: any) {
return (
<ConfigProvider locale={antdLocales[currentLang]} theme={theme}>
<BrowserRouter>{children}</BrowserRouter>
{children}
</ConfigProvider>
);
}

View File

@ -37,20 +37,6 @@ i18n
addAccount: 'Add account',
save: 'Save changes',
newAccount: 'New account',
ACTIVE: 'Active',
DISABLED: 'Disabled',
BLOCKED: 'Blocked',
DELETED: 'Deleted',
OWNER: 'Owner',
ADMIN: 'Admin',
EDITOR: 'Editor',
VIEWER: 'Viewer',
nameLogin: 'Name, login',
createdAt: 'Created',
saving: 'Saving...',
createdAccountMessage: 'User successfully created!',
editAccountMessage: 'User successfully updated!',
you: '(You)',
},
},
ru: {
@ -80,20 +66,6 @@ i18n
addAccount: 'Добавить аккаунт',
save: 'Сохранить изменения',
newAccount: 'Новая учетная запись',
ACTIVE: 'Активен',
DISABLED: 'Выключен',
BLOCKED: 'Заблокирован',
DELETED: 'Удален',
OWNER: 'Владелец',
ADMIN: 'Админ',
EDITOR: 'Редактор',
VIEWER: 'Наблюдатель',
nameLogin: 'Имя, Логин',
createdAt: 'Создано',
saving: 'Сохранение...',
createdAccountMessage: 'Пользователь успешно создан!',
editAccountMessage: 'Пользователь успешно обновлен!',
you: '(Вы)',
},
},
},

12
client/src/env.d.ts vendored
View File

@ -1,12 +0,0 @@
/// <reference types="vite/client" />
interface ImportMetaEnv {
readonly VITE_APP_WEBSOCKET_PROTOCOL: string;
readonly VITE_APP_HTTP_PROTOCOL: string;
readonly VITE_APP_API_URL: string;
readonly VITE_APP_URL: string;
}
interface ImportMeta {
readonly env: ImportMetaEnv;
}

View File

@ -1,8 +1,9 @@
import React from 'react';
import ReactDOM from 'react-dom/client';
import '@/index.css';
import App from '@/App';
import AppWrapper from '@/config/AppWrapper';
import './index.css';
import App from './App';
import { BrowserRouter } from 'react-router-dom';
import AppWrapper from './config/AppWrapper';
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
@ -10,6 +11,8 @@ const root = ReactDOM.createRoot(
root.render(
<AppWrapper>
<App />
<BrowserRouter>
<App />
</BrowserRouter>
</AppWrapper>
);

View File

@ -1,219 +1,36 @@
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { AccountStatus, AllUser, AllUserResponse } from "@/types/user";
import Header from "@/components/Header";
import ContentDrawer from "@/components/ContentDrawer";
import UserCreate from "@/components/UserCreate";
import { Avatar, Table } from "antd";
import { TableProps } from "antd/lib";
import { UserService } from "@/services/userService";
import UserEdit from "@/components/UserEdit";
import { useSearchParams } from "react-router-dom";
import Header from '../components/Header';
import { useState } from 'react';
import ContentDrawer from '../components/ContentDrawer';
import UserCreate from '../components/UserCreate';
import { useTranslation } from 'react-i18next';
export default function AccountsPage() {
const { t } = useTranslation();
const [openCreate, setOpenCreate] = useState(false);
const [searchParams, setSearchParams] = useSearchParams();
const [open, setOpen] = useState(false);
const [activeAccount, setActiveAccount] = useState<
{ login: string; id: number; name: string; email: string } | undefined
>(undefined);
const showCreateDrawer = () => setOpenCreate(true);
const closeCreateDrawer = () => {
setActiveAccount(undefined);
setOpenCreate(false);
};
const [openEdit, setOpenEdit] = useState(false);
const showEditDrawer = () => setOpenEdit(true);
const closeEditDrawer = () => {
setActiveAccount(undefined);
setOpenEdit(false);
};
const [accounts, setAccounts] = useState<AllUserResponse>({
amountCount: 0,
amountPages: 0,
users: [],
currentPage: 1,
limit: 10,
});
async function getUsers() {
const page = Number(searchParams.get("page") || "1");
const limit = Number(searchParams.get("limit") || "10");
setSearchParams({
page: page.toString(),
limit: limit.toString(),
});
const data = await UserService.getUsers(page, limit);
console.log("searchParams", searchParams);
setAccounts(data);
}
useEffect(() => {
getUsers();
}, []);
const statusColor = {
ACTIVE: "#27AE60",
DISABLED: "#606060",
BLOCKED: "#FF0000",
DELETED: "#B30000",
};
const columns: TableProps<AllUser>["columns"] = [
{
title: "#",
dataIndex: "id",
key: "id",
},
{
title: t("nameLogin"),
dataIndex: "nameLogin",
key: "nameLogin",
render: (text, record) => (
<div
onClick={() => {
setActiveAccount({
login: record.login,
id: record.id,
name: record.name,
email: record.email || "",
});
showEditDrawer();
}}
style={{
display: "flex",
alignItems: "center",
gap: "16px",
cursor: "pointer",
}}
>
<div
style={{
height: "32px",
width: "32px",
display: "flex",
alignItems: "center",
justifyContent: "center",
}}
>
<Avatar
size={32}
src={`https://gamma.heado.ru/go/ava?name=${record.login}`}
/>
</div>
<div style={{ display: "flex", flexDirection: "column" }}>
<div>{record.name}</div>
<div style={{ color: "#606060" }}>{record.login}</div>
</div>
</div>
),
},
{
title: "E-mail",
dataIndex: "email",
key: "email",
},
{
title: t("tenant"),
dataIndex: "bindTenantId",
key: "tenant",
},
{
title: t("role"),
dataIndex: "role",
key: "role",
render: (text) => <div>{t(text)}</div>,
},
{
title: t("createdAt"),
dataIndex: "createdAt",
key: "createdAt",
render: (text) => (
<div>
{new Date(text).toLocaleString("ru", {
year: "2-digit",
month: "2-digit",
day: "2-digit",
})}
</div>
),
},
{
title: t("status"),
dataIndex: "status",
key: "status",
render: (text) => (
<div style={{ color: statusColor[text as AccountStatus] }}>
{t(text)}
</div>
),
},
];
const onTableChange: TableProps<AllUser>["onChange"] = (pagination) => {
console.log(pagination);
UserService.getUsers(
pagination.current as number,
pagination.pageSize
).then((data) => {
setAccounts(data);
setSearchParams({
page: data.currentPage.toString(),
limit: data.limit.toString(),
});
});
};
const showDrawer = () => setOpen(true);
const closeDrawer = () => setOpen(false);
return (
<>
<Header
title={t("accounts")}
title={t('accounts')}
additionalContent={
<img
src="./icons/header/add_2.svg"
alt="add"
style={{
height: "18px",
width: "18px",
cursor: "pointer",
height: '18px',
width: '18px',
cursor: 'pointer',
}}
onClick={showCreateDrawer}
onClick={showDrawer}
/>
}
/>
<Table
size="small"
onChange={onTableChange}
columns={columns}
dataSource={accounts.users}
pagination={{
pageSize: accounts.limit,
current: accounts.currentPage,
total: accounts.amountCount,
}}
rowKey={"id"}
/>
<ContentDrawer
open={openCreate}
closeDrawer={closeCreateDrawer}
type="create"
>
<UserCreate getUsers={getUsers} closeDrawer={closeCreateDrawer} />
</ContentDrawer>
<ContentDrawer
login={activeAccount?.login}
name={activeAccount?.name}
email={activeAccount?.email}
open={openEdit}
closeDrawer={closeEditDrawer}
type="edit"
>
<UserEdit userId={activeAccount?.id} closeDrawer={closeEditDrawer} />
<ContentDrawer open={open} closeDrawer={closeDrawer} type="create">
<UserCreate />
</ContentDrawer>
</>
);

View File

@ -1,5 +1,5 @@
import Header from '@/components/Header';
import { useTranslation } from 'react-i18next';
import Header from '../components/Header';
export default function ConfigurationPage() {
const { t } = useTranslation();

View File

@ -1,5 +1,5 @@
import Header from '@/components/Header';
import { useTranslation } from 'react-i18next';
import Header from '../components/Header';
export default function EventsListPage() {
const { t } = useTranslation();

View File

@ -1,13 +1,13 @@
import React from 'react';
import { Form, Input, Button, Typography, message } from 'antd';
import { Form, Input, Button, Typography } from 'antd';
import {
EyeInvisibleOutlined,
EyeTwoTone,
UserOutlined,
} from '@ant-design/icons';
import { AuthService } from '../services/auth';
import { Auth } from '../types/auth';
import { useNavigate } from 'react-router-dom';
import { AuthService } from '@/services/authService';
import { Auth } from '@/types/auth';
const { Text, Link } = Typography;
@ -45,11 +45,7 @@ export default function LoginPage() {
/>
</div>
<Form
name="login"
onFinish={onFinish}
layout="vertical"
>
<Form name="login" onFinish={onFinish} layout="vertical">
<Form.Item
name="login"
rules={[{ required: true, message: 'Введите login' }]}

View File

@ -2,13 +2,15 @@
import React, { useEffect, useState } from 'react';
import { Layout } from 'antd';
import Sider from 'antd/es/layout/Sider';
import SiderMenu from '../components/SiderMenu';
import { Route, Routes, useLocation, useNavigate } from 'react-router-dom';
import SiderMenu from '@/components/SiderMenu';
import ProcessDiagramPage from './ProcessDiagramPage';
import RunningProcessesPage from './RunningProcessesPage';
import AccountsPage from './AccountsPage';
import EventsListPage from './EventsListPage';
import ConfigurationPage from './ConfigurationPage';
import { useSetUserSelector } from '../store/user';
import { UserService } from '../services/user';
export default function MainLayout() {
const navigate = useNavigate();
@ -19,6 +21,8 @@ export default function MainLayout() {
const [width, setWidth] = useState<number | string>('15%');
const [collapsedWidth, setCollapsedWidth] = useState(50);
const setUser = useSetUserSelector()
const calculateWidths = () => {
const windowWidth = window.innerWidth;
const expanded = Math.min(Math.max(windowWidth * 0.15, 180), 240);
@ -54,6 +58,21 @@ export default function MainLayout() {
navigate(key);
}
useEffect(() => {
const token = localStorage.getItem('accessToken');
if (!token) {
navigate('/login');
} else {
if (localStorage.getItem('user')) {
setUser(JSON.parse(localStorage.getItem('user') as string))
} else {
UserService.getProfile().then((user) => {
setUser(user);
});
}
}
}, [])
return (
<Layout style={{ minHeight: '100vh' }}>
<Sider

View File

@ -1,5 +1,5 @@
import Header from '@/components/Header';
import { useTranslation } from 'react-i18next';
import Header from '../components/Header';
export default function ProcessDiagramPage() {
const { t } = useTranslation();

View File

@ -1,14 +1,15 @@
/* eslint-disable react-hooks/exhaustive-deps */
// ProtectedRoute.js
import { Outlet, useNavigate } from 'react-router-dom';
import React, { useEffect } from 'react';
import { useUserSelector } from '@/store/userStore';
import { useUserSelector } from '../store/user';
const ProtectedRoute = (): React.JSX.Element => {
const navigate = useNavigate();
const user = useUserSelector();
const navigate = useNavigate();
useEffect(() => {
if (!user?.id) {
if (user.id === null) {
navigate('/login');
}
}, [user]);

View File

@ -1,5 +1,5 @@
import Header from '@/components/Header';
import { useTranslation } from 'react-i18next';
import Header from '../components/Header';
export default function RunningProcessesPage() {
const { t } = useTranslation();

View File

@ -0,0 +1,22 @@
import api from '../api/api';
import { useUserStore } from '../store/user';
import { Auth } from '../types/auth';
export class AuthService {
static async login(auth: Auth) {
const token = await api.login(auth);
console.log(token)
localStorage.setItem('accessToken', token.accessToken);
}
static async logout() {
useUserStore.getState().removeUser();
localStorage.removeItem('userInfo');
localStorage.removeItem('accessToken');
}
static async refresh() {
const token = await api.refreshToken();
localStorage.setItem('accessToken', token.accessToken);
}
}

View File

@ -1,30 +0,0 @@
import api from "@/api/api";
import { useAuthStore } from "@/store/authStore";
import { Auth } from "@/types/auth";
import { UserService } from "./userService";
import { useUserStore } from "@/store/userStore";
export class AuthService {
static async login(auth: Auth) {
const token = await api.login(auth);
useAuthStore.getState().setAccessToken(token.accessToken);
localStorage.setItem('refreshToken', token.refreshToken as string);
await UserService.getProfile().then((user) => {
useUserStore.getState().setUser(user);
});
}
static async logout() {
console.log('logout');
useUserStore.getState().setUser(null);
useAuthStore.getState().setAccessToken(null);
localStorage.removeItem('userInfo');
localStorage.removeItem('refreshToken');
}
static async refresh() {
console.log('refresh');
const token = await api.refreshToken();
useAuthStore.getState().setAccessToken(token.accessToken);
}
}

View File

@ -0,0 +1,10 @@
import api from '../api/api';
import { User } from '../types/user';
export class UserService {
static async getProfile(): Promise<User> {
const user = api.getProfile();
return user;
}
}

View File

@ -1,38 +0,0 @@
import api from '@/api/api';
import { AllUserResponse, User, UserCreate, UserUpdate } from '@/types/user';
export class UserService {
static async getProfile(): Promise<User> {
console.log('getProfile');
const user = api.getProfile();
return user;
}
static async getUsers(
page: number = 1,
limit: number = 10
): Promise<AllUserResponse> {
console.log('getUsers');
const allUsers = api.getUsers(page, limit);
return allUsers;
}
static async getUserById(userId: number): Promise<User> {
console.log('getUserById');
const user = api.getUserById(userId);
return user;
}
static async createUser(user: UserCreate): Promise<User> {
console.log('createUser');
const createdUser = api.createUser(user);
return createdUser;
}
static async updateUser(userId: number, user: UserUpdate): Promise<User> {
console.log('updateUser');
const updatedUser = api.updateUser(userId, user);
return updatedUser;
}
}

View File

@ -1,18 +0,0 @@
import { create } from 'zustand';
import { devtools } from 'zustand/middleware';
type AuthState = {
accessToken: string | null;
setAccessToken: (token: string | null) => void;
};
export const useAuthStore = create<AuthState>()(
devtools((set) => ({
accessToken: null,
setAccessToken: (token) => set({ accessToken: token }),
}))
);
export const useAuthSelector = () => {
return useAuthStore((state) => state.accessToken);
};

View File

@ -1,16 +1,17 @@
import { User } from '@/types/user';
import { create } from 'zustand';
import { devtools, persist } from 'zustand/middleware';
import { User } from '../types/user';
const userInfo = localStorage.getItem('userInfo');
type UserStoreState = {
user: User | null;
user: User;
loading: boolean;
};
type UserStoreActions = {
setUser: (user: User | null) => void;
setUser: (user: User) => void;
removeUser: () => void;
};
type UserStore = UserStoreState & UserStoreActions;
@ -21,7 +22,8 @@ export const useUserStore = create<UserStore>()(
(set, get) => ({
user: userInfo != null ? JSON.parse(userInfo) : ({} as User),
loading: false,
setUser: (user: User | null) => set({ user }),
setUser: (user: User) => set({ user }),
removeUser: () => set({ user: {} as User }),
}),
{ name: 'userInfo' }
)

View File

@ -1,4 +1,4 @@
import { components } from './openapi-types';
export type Auth = components['schemas']['Auth'];
export type Tokens = components['schemas']['Tokens'];
export type Access = components['schemas']['Access'];

View File

@ -120,6 +120,11 @@ export interface paths {
export type webhooks = Record<string, never>;
export interface components {
schemas: {
/** Access */
Access: {
/** Accesstoken */
accessToken: string;
};
/** AccountKeyring */
AccountKeyring: {
/** Ownerid */
@ -191,10 +196,6 @@ export interface components {
amountCount: number;
/** Amountpages */
amountPages: number;
/** Currentpage */
currentPage: number;
/** Limit */
limit: number;
};
/** Auth */
Auth: {
@ -218,13 +219,6 @@ export interface components {
* @enum {string}
*/
KeyType: "PASSWORD" | "ACCESS_TOKEN" | "REFRESH_TOKEN" | "API_KEY";
/** Tokens */
Tokens: {
/** Accesstoken */
accessToken: string;
/** Refreshtoken */
refreshToken?: string | null;
};
/** User */
User: {
/** Id */
@ -251,25 +245,6 @@ export interface components {
createdAt: string;
status: components["schemas"]["AccountStatus"];
};
/** UserCreate */
UserCreate: {
/** Name */
name?: string | null;
/** Login */
login?: string | null;
/** Email */
email?: string | null;
/** Password */
password?: string | null;
/** Bindtenantid */
bindTenantId?: string | null;
role?: components["schemas"]["AccountRole"] | null;
/** Meta */
meta?: {
[key: string]: unknown;
} | null;
status?: components["schemas"]["AccountStatus"] | null;
};
/** UserUpdate */
UserUpdate: {
/** Id */
@ -280,8 +255,6 @@ export interface components {
login?: string | null;
/** Email */
email?: string | null;
/** Password */
password?: string | null;
/** Bindtenantid */
bindTenantId?: string | null;
role?: components["schemas"]["AccountRole"] | null;
@ -332,7 +305,7 @@ export interface operations {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["Tokens"];
"application/json": components["schemas"]["Access"];
};
};
/** @description Validation Error */
@ -361,7 +334,7 @@ export interface operations {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["Tokens"];
"application/json": components["schemas"]["Access"];
};
};
};
@ -460,7 +433,7 @@ export interface operations {
};
requestBody: {
content: {
"application/json": components["schemas"]["UserCreate"];
"application/json": components["schemas"]["UserUpdate"];
};
};
responses: {
@ -470,7 +443,7 @@ export interface operations {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["AllUser"];
"application/json": components["schemas"]["User"];
};
};
/** @description Validation Error */
@ -501,7 +474,7 @@ export interface operations {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["UserUpdate"];
"application/json": components["schemas"]["User"];
};
};
/** @description Validation Error */
@ -536,7 +509,7 @@ export interface operations {
[name: string]: unknown;
};
content: {
"application/json": components["schemas"]["UserUpdate"];
"application/json": components["schemas"]["User"];
};
};
/** @description Validation Error */

View File

@ -1,9 +1,3 @@
import { components } from './openapi-types';
import { components } from "./openapi-types"
export type User = components['schemas']['User'];
export type AllUserResponse = components['schemas']['AllUserResponse'];
export type AllUser = components['schemas']['AllUser'];
export type AccountStatus = components['schemas']['AccountStatus'];
export type AccountRole = components['schemas']['AccountRole'];
export type UserUpdate = components['schemas']['UserUpdate'];
export type UserCreate = components['schemas']['UserCreate'];
export type User = components["schemas"]["User"];

View File

@ -1,7 +1,11 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
@ -14,11 +18,9 @@
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
"baseUrl": ".",
"paths": {
"@/*": ["./src/*"]
}
"jsx": "react-jsx"
},
"include": ["src"]
"include": [
"src"
]
}

View File

@ -1,23 +0,0 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import path from 'path';
export default defineConfig({
plugins: [react()],
server: {
port: 3000,
open: false,
},
build: {
outDir: 'build',
},
preview: {
port: 3000,
open: false,
},
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
});

6
package-lock.json generated Normal file
View File

@ -0,0 +1,6 @@
{
"name": "connect",
"lockfileVersion": 3,
"requires": true,
"packages": {}
}

1
package.json Normal file
View File

@ -0,0 +1 @@
{}

View File

@ -32,11 +32,11 @@ startretries=5
[program:client]
environment=
VITE_APP_WEBSOCKET_PROTOCOL=ws,
VITE_APP_HTTP_PROTOCOL=http,
VITE_APP_API_URL=localhost:8000,
VITE_APP_URL=localhost:3000
command=bash -c 'cd client; npm run build; npm run preview'
REACT_APP_WEBSOCKET_PROTOCOL=ws,
REACT_APP_HTTP_PROTOCOL=http,
REACT_APP_API_URL=localhost:8000,
REACT_APP_URL=localhost:3000
command=bash -c 'cd client; npm run build; serve -s build'
numprocs=1
process_name=node-%(process_num)d
stdout_logfile=client.out.log