diff --git a/src/modules/login/Login.tsx b/src/modules/login/Login.tsx index 87b4320..d6c15dc 100644 --- a/src/modules/login/Login.tsx +++ b/src/modules/login/Login.tsx @@ -26,9 +26,10 @@ const Login = () => { try { setAuthLoading(true); const response = await AuthService.login(email, password); + console.log("🚀 ~ file: Login.tsx ~ line 29 ~ login ~ response", response) toast.success('Login is succeed!'); setAuthLoading(false); - dispatch(loginUser(response?.data.tokens.access.token)); + dispatch(loginUser(response)); navigate('/'); } catch (error: any) { setAuthLoading(false); diff --git a/src/pages/detail-player/BoxHistoryClaim.tsx b/src/pages/detail-player/BoxHistoryClaim.tsx index 7bb2487..8773f55 100644 --- a/src/pages/detail-player/BoxHistoryClaim.tsx +++ b/src/pages/detail-player/BoxHistoryClaim.tsx @@ -64,7 +64,7 @@ const BoxHistoryClaim = (props: DataInfoProps) => { const fakeDataInfoHero: Info[] = [ - { name: 'Tổng giao dịch thực hiện:', value: '506 lần' }, + { name: 'Tổng giao dịch thực hiện:', value: '5106 lần' }, { name: 'Khối lượng giao dịch:', value: '1000 MXY' }, ] return ( diff --git a/src/pages/detail-player/BoxInfoHero.tsx b/src/pages/detail-player/BoxInfoHero.tsx index dd5b190..dad428a 100644 --- a/src/pages/detail-player/BoxInfoHero.tsx +++ b/src/pages/detail-player/BoxInfoHero.tsx @@ -1,9 +1,10 @@ +/* eslint-disable react/no-array-index-key */ /* eslint-disable react/jsx-no-bind */ import React, { useEffect, useState } from 'react' import BoxComponent, { Info } from '@app/components/boxComponent' import SearchBox from '@app/components/searchbox/SearchBox' -import { DataDetailNft, DataNftPlayer, DataPlayer } from '@app/utils/types'; -import { getDataHeroes } from '@app/utils'; +import { DataDetailNft, DataNftCharacter, DataNftPlayer, DataPlayer, DataRankNft } from '@app/utils/types'; +import { getDataHeroes, getNftCharacter, getNftRRank } from '@app/utils'; import TableCustom from '@app/components/table/Table'; import { Select } from 'antd'; @@ -17,31 +18,61 @@ const BoxInfoHero = (props: DataInfoProps) => { const [currentPage, setCurrentPage] = useState(1) const [pageSize, setPageSize] = useState(10) const [dataNft, setDataNft] = useState([]); - console.log("🚀 ~ file: BoxInfoHero.tsx ~ line 19 ~ BoxInfoHero ~ dataNft", dataNft) const [setSearchItems, setSetSearchItems] = useState('') const [totalDocs, setTotalDocs] = useState() const { Option } = Select; + const [dataNftCharacter, setDataNftCharacter] = useState([]); + const [dataRankNft, setDataRankNft] = useState([]); + const [isSelling, setIsSelling] = useState() + const [characterSelected, setCharacterSelected] = useState([]) + const [rankSelected, setRankSelected] = useState([]) const onSearch = (value: string) => { setSetSearchItems(value.trim()) setCurrentPage(1) } - function handleChange(value: string) { - console.log(`selected ${value}`); + function handleSelectCharacter(value: any) { + setCharacterSelected(value) } + function handleSelectRank(value: any) { + setRankSelected(value) + } + + const handleChangeStatus = (value: boolean) => { + setIsSelling(value) + } + + + const address = dataInfo?.address useEffect(() => { const getDataNft = async () => { - const data = await getDataHeroes(address, currentPage, pageSize, setSearchItems); + const data = await getDataHeroes(address, currentPage, pageSize, isSelling, characterSelected, rankSelected, setSearchItems); setDataNft(data?.docs) setPageSize(10) setTotalDocs(data?.totalDocs) } getDataNft() - }, [setSearchItems]) + }, [isSelling, characterSelected, rankSelected, setSearchItems]) + + useEffect(() => { + const getCharacterNft = async () => { + const data = await getNftCharacter(); + setDataNftCharacter(data) + } + getCharacterNft() + }, []) + + useEffect(() => { + const getRankNft = async () => { + const data = await getNftRRank(); + setDataRankNft(data) + } + getRankNft() + }, []) const dataSource = dataNft @@ -176,15 +207,48 @@ const BoxInfoHero = (props: DataInfoProps) => {
- +
+ +
+
+ +
+
+ +
{ const { dataInfo } = props - + // const { Option } = Select; const [dataItemInGame, setDataItemInGame] = useState([]); - + const [totalDocs, setTotalDocs] = useState() + const [currentPage, setCurrentPage] = useState(1) + const [pageSize, setPageSize] = useState(10) const address = dataInfo?.address useEffect(() => { const getDataItemInGame = async () => { - const data = await getDataItemIngame(address); + const data = await getDataItemIngame(address, currentPage, pageSize,); setDataItemInGame(data.docs); + setPageSize(10) + setTotalDocs(data?.totalDocs) } getDataItemInGame() }, []) @@ -55,12 +59,48 @@ const BoxInfoItemIngame = (props: DataInfoProps) => {
+

Danh sách hero của người chơi

-

abc

+ {/*
+ +
+
+ +
*/}
- + @@ -68,4 +108,5 @@ const BoxInfoItemIngame = (props: DataInfoProps) => { ) } + export default BoxInfoItemIngame diff --git a/src/pages/edit-user/index.tsx b/src/pages/edit-user/index.tsx index 0b33963..cc9687f 100644 --- a/src/pages/edit-user/index.tsx +++ b/src/pages/edit-user/index.tsx @@ -1,34 +1,37 @@ /* eslint-disable react/jsx-no-bind */ -import React, {useEffect, useState} from "react"; -import {ContentHeader} from "@app/components"; -import {Button, Input, Select, Spin} from "antd"; +import React, { useEffect, useState } from "react"; +import { ContentHeader } from "@app/components"; +import { Button, Input, Select, Spin } from "antd"; import TextArea from "antd/lib/input/TextArea"; -import {useNavigate, useParams} from "react-router-dom"; -import {ApplicationRootState, DataUser, OptionRole} from "@app/utils/types"; -import {editNewUser, getUserById} from "@app/utils"; -import {useSelector} from "react-redux"; -import {toast} from "react-toastify"; +import { useNavigate, useParams } from "react-router-dom"; +import { ApplicationRootState, DataUser, OptionRole } from "@app/utils/types"; +import { editNewUser, getUserById } from "@app/utils"; +import { useSelector } from "react-redux"; +import { toast } from "react-toastify"; -const {Option} = Select; +const { Option } = Select; const EditUser = () => { const navigate = useNavigate(); // get id user - const {id} = useParams(); + const { id } = useParams(); const [dataUser, setDataUser] = useState(); const [loading, setLoading] = useState(false); const dataRoleUser = useSelector( (state: ApplicationRootState) => state.user.dataRoles ); + console.log("🚀 ~ file: index.tsx ~ line 23 ~ EditUser ~ dataRoleUser", dataRoleUser) const userEdit: any = { fullName: dataUser?.fullName, roles: dataUser?.roles, phoneNumber: dataUser?.phoneNumber, note: dataUser?.note }; + console.log("🚀 ~ file: index.tsx ~ line 30 ~ EditUser ~ userEdit", userEdit) + // func edit user const handleInputDataUser = (type: string, e: any) => { - const {value} = e.target; + const { value } = e.target; userEdit[type] = value; }; // handle select for getRoles @@ -101,7 +104,7 @@ const EditUser = () => { @@ -170,7 +173,7 @@ const NotificationUsers = () => {
diff --git a/src/plugins/axios.ts b/src/plugins/axios.ts index 99023ea..9d08fb6 100644 --- a/src/plugins/axios.ts +++ b/src/plugins/axios.ts @@ -56,11 +56,8 @@ const interceptAuth = (config: AxiosRequestConfig) => { }, (error) => { if (error.response.status === 401) { - localStorage.removeItem('token'); window.location.href = '/login'; - - } else if (error.response.status === 400) { if (error.response.data && error.response.data.code) { switch (Number(error.response.data.code)) { diff --git a/src/services/auth.ts b/src/services/auth.ts index 6342335..c727456 100644 --- a/src/services/auth.ts +++ b/src/services/auth.ts @@ -1,7 +1,6 @@ /* eslint-disable object-shorthand */ /* eslint-disable prettier/prettier */ import { removeWindowClass } from '@app/utils/helpers'; -import { Gatekeeper } from 'gatekeeper-client-sdk'; import { createService } from '../plugins/axios'; import { IToken, ITokens } from '../store/userToken/constants' @@ -9,20 +8,12 @@ const baseURL = process.env.REACT_APP_GATEKEEPER_URL; export const axios = createService(baseURL); -export const loginByAuth = async (email: string, password: string) => { - const token = await Gatekeeper.loginByAuth(email, password); - localStorage.setItem('token', token); - removeWindowClass('login-page'); - removeWindowClass('hold-transition'); - return token; -}; + export const login = async (email: string, password: string) => { const response = await axios.post('/auth/login', { email: email, password: password }); - localStorage.setItem('user', JSON.stringify(response?.data)); - localStorage.setItem('token', response?.data.tokens.access.token); removeWindowClass('login-page'); removeWindowClass('hold-transition'); - return response + return response?.data }; export const refreshToken = async (refreshToken: IToken) => { diff --git a/src/store/reducers/auth.ts b/src/store/reducers/auth.ts index 6275104..6923890 100644 --- a/src/store/reducers/auth.ts +++ b/src/store/reducers/auth.ts @@ -5,20 +5,14 @@ export interface AuthState { isLoggedIn: boolean; token: string | null; currentUser: any; - user: any; } -const user = JSON.parse(localStorage.getItem('user') || '{}'); -console.log("🚀 ~ file: auth.ts ~ line 12 ~ user", user) const initialState: AuthState = { isLoggedIn: !!localStorage.getItem('token'), token: localStorage.getItem('token'), - user: localStorage.getItem('user'), - currentUser: { - email: user?.user.email, - picture: null + email: '', } }; @@ -27,9 +21,10 @@ export const authSlice = createSlice({ initialState, reducers: { loginUser: (state, { payload }) => { - localStorage.setItem('token', payload); + localStorage.setItem('token', payload?.tokens.access.token); state.isLoggedIn = true; - state.token = payload; + state.token = payload?.tokens.access.token; + state.currentUser.email = payload?.user.email; }, logoutUser: (state) => { localStorage.removeItem('token'); @@ -37,12 +32,10 @@ export const authSlice = createSlice({ state.isLoggedIn = false; state.token = null; }, - loadUser: (state, { payload }) => { - state.currentUser = payload; - } + } }); -export const { loginUser, logoutUser, loadUser } = authSlice.actions; +export const { loginUser, logoutUser } = authSlice.actions; export default authSlice.reducer; diff --git a/src/styles/components/_common.scss b/src/styles/components/_common.scss index b46dee9..9a321e2 100644 --- a/src/styles/components/_common.scss +++ b/src/styles/components/_common.scss @@ -16,6 +16,12 @@ border-radius: 8px !important; } + .ant-input-group-addon { + &:last-child { + left: 0 !important; + } + } + button { border-radius: 8px !important; background-color: #2d7ff9; diff --git a/src/styles/pages/_detail-player.scss b/src/styles/pages/_detail-player.scss index 0ae52ce..f879149 100644 --- a/src/styles/pages/_detail-player.scss +++ b/src/styles/pages/_detail-player.scss @@ -20,6 +20,36 @@ margin-left: 15px; } } + + .table-filter { + &__select { + display: flex; + + .select__item { + margin-right: 15px; + width: 250px; + + .ant-select-multiple { + width: 100% !important; + } + } + + .multi-item { + .ant-select-selection-item { + background: #2D7FF9; + + &-content { + color: #FFFFFF; + + } + + &-remove { + color: #FFFFFF; + } + } + } + } + } } } } \ No newline at end of file diff --git a/src/utils/index.ts b/src/utils/index.ts index e61e4f0..2c51e41 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -51,19 +51,22 @@ export const shortAddress = (address: string) => { // function manager list uses and roles export const getListUsers = async ( - page: string = "1", - pageSize: string = "10", - sortBy: string = "createdAt%3Aasc" + page?: number, + pageSize?: number, + sortBy: string = "createdAt%3Aasc", + keyword?: string, + ) => { - const url = `users/list?page=${page}&pageSize=${pageSize}&sortBy=${sortBy}`; + const url = `/users/list?page=${page}&pageSize=${pageSize}&sortBy=${sortBy}&keyword=${keyword}`; try { const response = await axios.get(url); - return response.data.docs; + return response.data; } catch (error: any) { throw new Error(error.message); } }; + export const getUserById = async (id: string = "") => { const url = `users/${id}`; try { @@ -149,9 +152,12 @@ export const getDataHeroes = async ( address?: string, page?: number, pageSize?: number, + isSelling?: boolean, + characterIds?: number[], + rankIds?: number[], keyword?: string ) => { - const params: any = { page, pageSize, keyword } + const params: any = { page, pageSize, isSelling, characterIds, rankIds, keyword } const response = await axios.get(`/player/${address}/game/nfts`, { params }) return response.data }; @@ -273,6 +279,18 @@ export const getDetailNotification = async (id: string) => { const response = await axios.get(url); return response.data; }; + +export const getNftCharacter = async () => { + const url = `/nfts/characters`; + const response = await axios.get(url); + return response.data; +}; + +export const getNftRRank = async () => { + const url = `/nfts/ranks`; + const response = await axios.get(url); + return response.data; +}; export const getNotificationTypes = async ( page: string = "1", pageSize: string = "10", diff --git a/src/utils/types.ts b/src/utils/types.ts index 8978fe0..789a96e 100644 --- a/src/utils/types.ts +++ b/src/utils/types.ts @@ -144,6 +144,19 @@ export interface DataNftPlayer { dataDetailNft: DataDetailNft[]; } +export interface DataNftCharacter { + characterId: number, + characterName: string, + imgCharacter: string, + id: string, +} + +export interface DataRankNft { + imgRank: string, + rankId: number, + rankName: string, + id: string, +} export interface DataDetailNft { evolveLevel: number; specialSkillLevel: number; @@ -214,7 +227,6 @@ export interface OptionRole { name: string; value: string; } - export interface ApplicationRootState { auth: AuthState; ui: UiState;