GuilanCE/guilan-ace-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(admin): confirm event deletion actions
Some checks failed
Frontend CI/CD / build (push) Has been cancelled
Details
Frontend CI/CD / deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Amirhossein Khalili
2026-06-13 10:25:09 +03:30
parent 9e5be244f0
commit 25bd46ea2a
1 changed files with 82 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
src/views/AdminEvents.tsx
View File

@@ -2,15 +2,28 @@
import * as React from 'react';
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
import { Edit3, Eye, Trash2 } from 'lucide-react';
import { Link, useNavigate } from '@/lib/router';
import type { EventListItemSchema } from '@/lib/types';
import { api } from '@/lib/api';
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from '@/components/ui/alert-dialog';
import { Badge } from '@/components/ui/badge';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
import { ScrollArea } from '@/components/ui/scroll-area';
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
import ProgressiveImage from '@/components/ProgressiveImage';
import { useToast } from '@/hooks/use-toast';
import { formatJalali, formatToman, getEventCardImageUrl, resolveErrorMessage, toPersianDigits } from '@/lib/utils';
@@ -101,6 +114,70 @@ const AdminEventsPage: React.FC = () => {
}
}, [eventsQuery.data, filters.sort]);
const renderEventActions = (event: EventListItemSchema) => (
<div className="flex items-center justify-end gap-1">
<Tooltip>
<TooltipTrigger asChild>
<Button
size="icon"
variant="outline"
onClick={() => navigate(`/admin/events/${event.id}`)}
aria-label="جزئیات"
title="جزئیات"
>
<Eye className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent>جزئیات</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<Button size="icon" variant="outline" asChild aria-label="ویرایش" title="ویرایش">
<Link to={`/admin/events/${event.id}/edit`}>
<Edit3 className="h-4 w-4" />
</Link>
</Button>
</TooltipTrigger>
<TooltipContent>ویرایش</TooltipContent>
</Tooltip>
<AlertDialog>
<Tooltip>
<TooltipTrigger asChild>
<AlertDialogTrigger asChild>
<Button
size="icon"
variant="destructive"
disabled={deleteMutation.isPending}
aria-label="حذف"
title="حذف"
>
<Trash2 className="h-4 w-4" />
</Button>
</AlertDialogTrigger>
</TooltipTrigger>
<TooltipContent>حذف</TooltipContent>
</Tooltip>
<AlertDialogContent dir="rtl">
<AlertDialogHeader className="text-right">
<AlertDialogTitle>حذف رویداد</AlertDialogTitle>
<AlertDialogDescription>
آیا از حذف رویداد «{event.title}» مطمئن هستید؟ این عملیات رویداد را از لیست‌های عادی حذف می‌کند.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter className="gap-2 sm:justify-start">
<AlertDialogCancel>انصراف</AlertDialogCancel>
<AlertDialogAction
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
onClick={() => deleteMutation.mutate(event.id)}
>
حذف
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
);
return (
<div className="space-y-6">
<div className="flex flex-col gap-1">
@@ -219,7 +296,7 @@ const AdminEventsPage: React.FC = () => {
<th className="px-3 py-2 text-right">تاریخ شروع</th>
<th className="px-3 py-2 text-right">ثبت‌نام‌ها</th>
<th className="px-3 py-2 text-right">قیمت (تومان)</th>
<th className="px-3 py-2 text-right">عملیات</th>
<th className="px-3 py-2 text-right"></th>
</tr>
</thead>
<tbody>
@@ -244,20 +321,8 @@ const AdminEventsPage: React.FC = () => {
<td className="px-3 py-2 text-right">{formatJalali(event.start_time)}</td>
<td className="px-3 py-2 text-right">{toPersianDigits(event.registration_count)}</td>
<td className="px-3 py-2 text-right">{formatToman(event.price)}</td>
<td className="px-3 py-2 text-left flex items-center gap-1">
<Button size="sm" variant="outline" onClick={() => navigate(`/admin/events/${event.id}`)}>
جزئیات
</Button>
<Button size="sm" variant="outline" asChild>
<Link to={`/admin/events/${event.id}/edit`}>ویرایش</Link>
</Button>
<Button
size="sm"
variant="destructive"
onClick={() => deleteMutation.mutate(event.id)}
>
حذف
</Button>
<td className="px-3 py-2 text-left">
{renderEventActions(event)}
</td>
</tr>
))}
@@ -278,16 +343,8 @@ const AdminEventsPage: React.FC = () => {
<div>ثبت‌نام‌ها: {toPersianDigits(event.registration_count)}</div>
<div>قیمت: {formatToman(event.price)}</div>
</div>
<div className="flex items-center gap-2 justify-end">
<Button size="sm" variant="outline" onClick={() => navigate(`/admin/events/${event.id}`)}>
جزئیات
</Button>
<Button size="sm" variant="outline" asChild>
<Link to={`/admin/events/${event.id}/edit`}>ویرایش</Link>
</Button>
<Button size="sm" variant="destructive" onClick={() => deleteMutation.mutate(event.id)}>
حذف
</Button>
<div className="flex justify-end">
{renderEventActions(event)}
</div>
</div>
))}