This commit is contained in:
louiscklaw
2025-05-30 01:14:10 +08:00
parent 98bc3fe3ce
commit 834f58bde1
52 changed files with 624 additions and 604 deletions

View File

@@ -10,27 +10,25 @@ import { Iconify } from 'src/components/iconify';
import { CustomBreadcrumbs } from 'src/components/custom-breadcrumbs';
import { UserCardList } from '../user-card-list';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
export function UserCardsView() {
const { t } = useTranslation();
return (
<DashboardContent>
<CustomBreadcrumbs
heading="User cards"
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'User', href: paths.dashboard.user.root },
{ name: 'Cards' },
//
{ name: t('Dashboard'), href: paths.dashboard.root },
{ name: t('User'), href: paths.dashboard.user.root },
{ name: t('Cards') },
]}
action={
<Button
component={RouterLink}
href={paths.dashboard.user.new}
variant="contained"
startIcon={<Iconify icon="mingcute:add-line" />}
>
New user
<Button component={RouterLink} href={paths.dashboard.user.new} variant="contained" startIcon={<Iconify icon="mingcute:add-line" />}>
{t('New user')}
</Button>
}
sx={{ mb: { xs: 3, md: 5 } }}

View File

@@ -5,18 +5,22 @@ import { DashboardContent } from 'src/layouts/dashboard';
import { CustomBreadcrumbs } from 'src/components/custom-breadcrumbs';
import { UserNewEditForm } from '../user-new-edit-form';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
export function UserCreateView() {
const { t } = useTranslation();
return (
<DashboardContent>
<CustomBreadcrumbs
heading="Create a new user"
heading={t('Create a new user')}
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'User', href: paths.dashboard.user.root },
{ name: 'New user' },
//
{ name: t('Dashboard'), href: paths.dashboard.root },
{ name: t('User'), href: paths.dashboard.user.root },
{ name: t('New user') },
]}
sx={{ mb: { xs: 3, md: 5 } }}
/>

View File

@@ -3,6 +3,7 @@ import { DashboardContent } from 'src/layouts/dashboard';
import { paths } from 'src/routes/paths';
import type { IUserItem } from 'src/types/user';
import { UserNewEditForm } from '../user-new-edit-form';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
@@ -11,14 +12,16 @@ type Props = {
};
export function UserEditView({ user: currentUser }: Props) {
const { t } = useTranslation();
return (
<DashboardContent>
<CustomBreadcrumbs
heading="Edit"
backHref={paths.dashboard.user.list}
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'User', href: paths.dashboard.user.root },
{ name: t('Dashboard'), href: paths.dashboard.root },
{ name: t('User'), href: paths.dashboard.user.root },
{ name: currentUser?.name },
]}
sx={{ mb: { xs: 3, md: 5 } }}

View File

@@ -13,7 +13,7 @@ import { varAlpha } from 'minimal-shared/utils';
import { useCallback, useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { _roles, _userList, USER_STATUS_OPTIONS } from 'src/_mock';
import { useGetUsers } from 'src/actions/user';
import { deleteUser, useGetUsers } from 'src/actions/user';
import { CustomBreadcrumbs } from 'src/components/custom-breadcrumbs';
import { ConfirmDialog } from 'src/components/custom-dialog';
import { Iconify } from 'src/components/iconify';
@@ -39,6 +39,8 @@ import type { IUserItem, IUserTableFilters } from 'src/types/user';
import { UserTableFiltersResult } from '../user-table-filters-result';
import { UserTableRow } from '../user-table-row';
import { UserTableToolbar } from '../user-table-toolbar';
import { Router } from 'react-router';
import { useRouter } from 'src/routes/hooks';
// ----------------------------------------------------------------------
@@ -48,6 +50,7 @@ const STATUS_OPTIONS = [{ value: 'all', label: 'All' }, ...USER_STATUS_OPTIONS];
export function UserListView() {
const { t } = useTranslation();
const router = useRouter();
const TABLE_HEAD: TableHeadCellProps[] = [
{ id: 'name', label: t('Name') },
@@ -59,12 +62,13 @@ export function UserListView() {
];
const { users, mutate } = useGetUsers();
const [processNewUser, setProcessNewUser] = useState<boolean>(false);
const table = useTable();
const confirmDialog = useBoolean();
const [tableData, setTableData] = useState<IUserItem[]>(_userList);
const [tableData, setTableData] = useState<IUserItem[]>([]);
useEffect(() => {
setTableData(users);
@@ -87,16 +91,22 @@ export function UserListView() {
const notFound = (!dataFiltered.length && canReset) || !dataFiltered.length;
const handleDeleteRow = useCallback(
(id: string) => {
const deleteRow = tableData.filter((row) => row.id !== id);
async (id: string) => {
// const deleteRow = tableData.filter((row) => row.id !== id);
// toast.success('Delete success!');
// setTableData(deleteRow);
// table.onUpdatePageDeleteRow(dataInPage.length);
toast.success('Delete success!');
setTableData(deleteRow);
table.onUpdatePageDeleteRow(dataInPage.length);
try {
await deleteUser(id);
toast.success('Delete success!');
mutate();
} catch (error) {
console.error(error);
toast.error('Delete failed!');
}
},
[dataInPage.length, table, tableData]
[table, tableData, mutate]
);
const handleDeleteRows = useCallback(() => {
@@ -121,7 +131,7 @@ export function UserListView() {
<ConfirmDialog
open={confirmDialog.value}
onClose={confirmDialog.onFalse}
title="Delete"
title={t('Delete')}
content={
<>
Are you sure want to delete <strong> {table.selected.length} </strong> items?
@@ -133,7 +143,7 @@ export function UserListView() {
color="error"
onClick={() => {
handleDeleteRows();
confirmDialog.onFalse();
// confirmDialog.onFalse();
}}
>
{t('Delete')}
@@ -142,22 +152,33 @@ export function UserListView() {
/>
);
useEffect(() => {
mutate();
}, []);
return (
<>
<DashboardContent>
<CustomBreadcrumbs
heading="List"
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'User', href: paths.dashboard.user.root },
{ name: 'List' },
//
{ name: t('Dashboard'), href: paths.dashboard.root },
{ name: t('User'), href: paths.dashboard.user.root },
{ name: t('List') },
]}
action={
<Button
component={RouterLink}
href={paths.dashboard.user.new}
disabled={processNewUser}
loading={processNewUser}
// component={RouterLink}
// href={paths.dashboard.user.new}
variant="contained"
startIcon={<Iconify icon="mingcute:add-line" />}
onClick={() => {
setProcessNewUser(true);
router.push(paths.dashboard.user.new);
}}
>
{t('New user')}
</Button>

View File

@@ -22,6 +22,7 @@ import { ProfileCover } from '../profile-cover';
import { ProfileFriends } from '../profile-friends';
import { ProfileGallery } from '../profile-gallery';
import { ProfileFollowers } from '../profile-followers';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
@@ -53,6 +54,8 @@ const NAV_ITEMS = [
const TAB_PARAM = 'tab';
export function UserProfileView() {
const { t } = useTranslation();
const pathname = usePathname();
const searchParams = useSearchParams();
const selectedTab = searchParams.get(TAB_PARAM) ?? '';
@@ -74,21 +77,12 @@ export function UserProfileView() {
<DashboardContent>
<CustomBreadcrumbs
heading="Profile"
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'User', href: paths.dashboard.user.root },
{ name: user?.displayName },
]}
links={[{ name: t('Dashboard'), href: paths.dashboard.root }, { name: t('User'), href: paths.dashboard.user.root }, { name: user?.displayName }]}
sx={{ mb: { xs: 3, md: 5 } }}
/>
<Card sx={{ mb: 3, height: 290 }}>
<ProfileCover
role={_userAbout.role}
name={user?.displayName}
avatarUrl={user?.photoURL}
coverUrl={_userAbout.coverUrl}
/>
<ProfileCover role={_userAbout.role} name={user?.displayName} avatarUrl={user?.photoURL} coverUrl={_userAbout.coverUrl} />
<Box
sx={{
@@ -109,7 +103,7 @@ export function UserProfileView() {
key={tab.value}
value={tab.value}
icon={tab.icon}
label={tab.label}
label={t(tab.label)}
href={createRedirectPath(pathname, tab.value)}
/>
))}
@@ -121,13 +115,7 @@ export function UserProfileView() {
{selectedTab === 'followers' && <ProfileFollowers followers={_userFollowers} />}
{selectedTab === 'friends' && (
<ProfileFriends
friends={_userFriends}
searchFriends={searchFriends}
onSearchFriends={handleSearchFriends}
/>
)}
{selectedTab === 'friends' && <ProfileFriends friends={_userFriends} searchFriends={searchFriends} onSearchFriends={handleSearchFriends} />}
{selectedTab === 'gallery' && <ProfileGallery gallery={_userGallery} />}
</DashboardContent>