Vorkout/connect
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

VORKOUT-8 #13

Merged
vlad.dev merged 30 commits from VORKOUT-8 into master 2025-07-02 12:23:44 +05:00
Conversation 0 Commits 30 Files Changed 23 +62 -61
1 changed files with 62 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit ad312d4ff8 - Show all commits

123
client/src/pages/AccountsPage.tsx
View File

@ -1,19 +1,20 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from "react";
import { useTranslation } from 'react-i18next'; import { useTranslation } from "react-i18next";
import { AccountStatus, AllUser, AllUserResponse } from '@/types/user'; import { AccountStatus, AllUser, AllUserResponse } from "@/types/user";
import Header from '@/components/Header'; import Header from "@/components/Header";
import ContentDrawer from '@/components/ContentDrawer'; import ContentDrawer from "@/components/ContentDrawer";
import UserCreate from '@/components/UserCreate'; import UserCreate from "@/components/UserCreate";
import { Avatar, Table } from 'antd'; import { Avatar, Table } from "antd";
import { TableProps } from 'antd/lib'; import { TableProps } from "antd/lib";
import { UserService } from '@/services/userService'; import { UserService } from "@/services/userService";
import UserEdit from '@/components/UserEdit'; import UserEdit from "@/components/UserEdit";
import { useSearchParams } from 'react-router-dom'; import { useSearchParams } from "react-router-dom";
export default function AccountsPage() { export default function AccountsPage() {
const { t } = useTranslation(); const { t } = useTranslation();
const [openCreate, setOpenCreate] = useState(false); const [openCreate, setOpenCreate] = useState(false);
const [searchParams, setSearchParams] = useSearchParams(); const [searchParams, setSearchParams] = useSearchParams();
console.log("searchParams", searchParams);
const [activeAccount, setActiveAccount] = useState< const [activeAccount, setActiveAccount] = useState<
{ login: string; id: number; name: string; email: string } | undefined { login: string; id: number; name: string; email: string } | undefined
@ -45,8 +46,8 @@ export default function AccountsPage() {
const data = await UserService.getUsers(); const data = await UserService.getUsers();
setAccounts(data); setAccounts(data);
setSearchParams({ setSearchParams({
page: data.currentPage.toString(), page: searchParams.get("page") || "1",
limit: data.limit.toString(), limit: searchParams.get("limit") || "10",
}); });
} }
@ -54,22 +55,22 @@ export default function AccountsPage() {
}, []); }, []);
const statusColor = { const statusColor = {
ACTIVE: '#27AE60', ACTIVE: "#27AE60",
DISABLED: '#606060', DISABLED: "#606060",
BLOCKED: '#FF0000', BLOCKED: "#FF0000",
DELETED: '#B30000', DELETED: "#B30000",
}; };
const columns: TableProps<AllUser>['columns'] = [ const columns: TableProps<AllUser>["columns"] = [
{ {
title: '#', title: "#",
dataIndex: 'id', dataIndex: "id",
key: 'id', key: "id",
}, },
{ {
title: t('nameLogin'), title: t("nameLogin"),
dataIndex: 'nameLogin', dataIndex: "nameLogin",
key: 'nameLogin', key: "nameLogin",
render: (text, record) => ( render: (text, record) => (
<div <div
onClick={() => { onClick={() => {
@ -77,24 +78,24 @@ export default function AccountsPage() {
login: record.login, login: record.login,
id: record.id, id: record.id,
name: record.name, name: record.name,
email: record.email || '', email: record.email || "",
}); });
showEditDrawer(); showEditDrawer();
}} }}
style={{ style={{
display: 'flex', display: "flex",
alignItems: 'center', alignItems: "center",
gap: '16px', gap: "16px",
cursor: 'pointer', cursor: "pointer",
}} }}
> >
<div <div
style={{ style={{
height: '32px', height: "32px",
width: '32px', width: "32px",
display: 'flex', display: "flex",
alignItems: 'center', alignItems: "center",
justifyContent: 'center', justifyContent: "center",
}} }}
> >
<Avatar <Avatar
@ -102,47 +103,47 @@ export default function AccountsPage() {
src={`https://gamma.heado.ru/go/ava?name=${record.login}`} src={`https://gamma.heado.ru/go/ava?name=${record.login}`}
/> />
</div> </div>
<div style={{ display: 'flex', flexDirection: 'column' }}> <div style={{ display: "flex", flexDirection: "column" }}>
<div>{record.name}</div> <div>{record.name}</div>
<div style={{ color: '#606060' }}>{record.login}</div> <div style={{ color: "#606060" }}>{record.login}</div>
</div> </div>
</div> </div>
), ),
}, },
{ {
title: 'E-mail', title: "E-mail",
dataIndex: 'email', dataIndex: "email",
key: 'email', key: "email",
}, },
{ {
title: t('tenant'), title: t("tenant"),
dataIndex: 'bindTenantId', dataIndex: "bindTenantId",
key: 'tenant', key: "tenant",
}, },
{ {
title: t('role'), title: t("role"),
dataIndex: 'role', dataIndex: "role",
key: 'role', key: "role",
render: (text) => <div>{t(text)}</div>, render: (text) => <div>{t(text)}</div>,
}, },
{ {
title: t('createdAt'), title: t("createdAt"),
dataIndex: 'createdAt', dataIndex: "createdAt",
key: 'createdAt', key: "createdAt",
render: (text) => ( render: (text) => (
<div> <div>
{new Date(text).toLocaleString('ru', { {new Date(text).toLocaleString("ru", {
year: '2-digit', year: "2-digit",
month: '2-digit', month: "2-digit",
day: '2-digit', day: "2-digit",
})} })}
</div> </div>
), ),
}, },
{ {
title: t('status'), title: t("status"),
dataIndex: 'status', dataIndex: "status",
key: 'status', key: "status",
render: (text) => ( render: (text) => (
<div style={{ color: statusColor[text as AccountStatus] }}> <div style={{ color: statusColor[text as AccountStatus] }}>
{t(text)} {t(text)}
@ -151,7 +152,7 @@ export default function AccountsPage() {
}, },
]; ];
const onTableChange: TableProps<AllUser>['onChange'] = (pagination) => { const onTableChange: TableProps<AllUser>["onChange"] = (pagination) => {
console.log(pagination); console.log(pagination);
UserService.getUsers( UserService.getUsers(
pagination.current as number, pagination.current as number,
@ -168,15 +169,15 @@ export default function AccountsPage() {
return ( return (
<> <>
<Header <Header
title={t('accounts')} title={t("accounts")}
additionalContent={ additionalContent={
<img <img
src="./icons/header/add_2.svg" src="./icons/header/add_2.svg"
alt="add" alt="add"
style={{ style={{
height: '18px', height: "18px",
width: '18px', width: "18px",
cursor: 'pointer', cursor: "pointer",
}} }}
onClick={showCreateDrawer} onClick={showCreateDrawer}
/> />
@ -192,7 +193,7 @@ export default function AccountsPage() {
current: accounts.currentPage, current: accounts.currentPage,
total: accounts.amountCount, total: accounts.amountCount,
}} }}
rowKey={'id'} rowKey={"id"}
/> />
<ContentDrawer <ContentDrawer