forked from hangshuo652/aurak
feat: implement QuestionBank CRUD with pagination and template query
- Add pagination support to findAll (page, limit query params) - Add findByTemplateId method to service - Add GET /by-template/:templateId endpoint to controller - Service already includes CRUD for QuestionBank and QuestionBankItem
This commit is contained in:
@@ -0,0 +1,69 @@
|
||||
import React from 'react';
|
||||
import { AlertCircle, X } from 'lucide-react';
|
||||
import { useLanguage } from '../contexts/LanguageContext';
|
||||
|
||||
interface ConfirmDialogProps {
|
||||
isOpen: boolean;
|
||||
title?: string;
|
||||
message: string;
|
||||
confirmLabel?: string;
|
||||
cancelLabel?: string;
|
||||
onConfirm: () => void;
|
||||
onCancel: () => void;
|
||||
}
|
||||
|
||||
const ConfirmDialog: React.FC<ConfirmDialogProps> = ({
|
||||
isOpen,
|
||||
title,
|
||||
message,
|
||||
confirmLabel,
|
||||
cancelLabel,
|
||||
onConfirm,
|
||||
onCancel,
|
||||
}) => {
|
||||
const { t } = useLanguage();
|
||||
|
||||
if (!isOpen) return null;
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 z-[10000] flex items-center justify-center p-4 bg-black/10 backdrop-blur-[2px] animate-in fade-in duration-200">
|
||||
<div className="bg-white rounded-[2.5rem] shadow-2xl w-full max-w-sm overflow-hidden animate-in zoom-in duration-300 pointer-events-auto border border-white/40 ring-1 ring-black/5">
|
||||
<div className="flex justify-between items-center px-10 pt-10 pb-4">
|
||||
<h3 className="text-base font-black text-slate-900 flex items-center gap-3">
|
||||
<div className="w-10 h-10 rounded-2xl bg-amber-50 flex items-center justify-center">
|
||||
<AlertCircle className="w-5 h-5 text-amber-500" />
|
||||
</div>
|
||||
{title || t('confirmTitle') || 'Confirm'}
|
||||
</h3>
|
||||
<button
|
||||
onClick={onCancel}
|
||||
className="w-8 h-8 rounded-full flex items-center justify-center text-slate-400 hover:text-slate-600 hover:bg-slate-100 transition-all"
|
||||
>
|
||||
<X size={18} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="px-10 py-6">
|
||||
<p className="text-sm font-bold text-slate-500 leading-relaxed whitespace-pre-wrap">{message}</p>
|
||||
</div>
|
||||
|
||||
<div className="px-10 pb-10 pt-2 flex justify-end gap-3">
|
||||
<button
|
||||
onClick={onCancel}
|
||||
className="flex-1 h-12 text-sm text-slate-600 hover:bg-slate-100 rounded-2xl transition-all font-black uppercase tracking-widest"
|
||||
>
|
||||
{cancelLabel || t('cancel') || 'Cancel'}
|
||||
</button>
|
||||
<button
|
||||
onClick={onConfirm}
|
||||
className="flex-1 h-12 text-sm bg-indigo-600 text-white rounded-2xl hover:bg-indigo-700 transition-all font-black shadow-lg shadow-indigo-600/20 active:scale-95 uppercase tracking-widest"
|
||||
>
|
||||
{confirmLabel || t('confirm') || 'Confirm'}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ConfirmDialog;
|
||||
Reference in New Issue
Block a user