up

src/pages/request/NewRequest.tsx

@@ -8,6 +8,7 @@ import { Link, useNavigate } from 'react-router-dom'
 import { Paths } from '@/config/Paths'
 import { extractErrorMessage } from '@/config/func'
 import { ArrowRight2 } from 'iconsax-react'
+import ModalConfirm from '@/components/ModalConfirm'
 
 const NewRequest: FC = () => {
     const navigate = useNavigate()
@@ -15,6 +16,7 @@ const NewRequest: FC = () => {
     const { items, setItems } = useRequestStore()
     const [editingIndex, setEditingIndex] = useState<number | null>(null)
     const [formKey, setFormKey] = useState(0)
+    const [showConfirmModal, setShowConfirmModal] = useState(false)
 
     useEffect(() => {
         setItems([])
@@ -44,14 +46,18 @@ const NewRequest: FC = () => {
         setEditingIndex(index)
     }
 
-    const onSubmit = () => {
+    const openSubmitConfirm = () => {
         if (items.length === 0) {
             toast('حداقل یک قلم باید به درخواست اضافه کنید.', 'error')
             return
         }
+        setShowConfirmModal(true)
+    }
 
+    const onSubmit = () => {
         submitRequest(items, {
             onSuccess: () => {
+                setShowConfirmModal(false)
                 setItems([])
                 setEditingIndex(null)
                 setFormKey((k) => k + 1)
@@ -106,10 +112,20 @@ const NewRequest: FC = () => {
                     editingIndex={editingIndex}
                     onEdit={handleEdit}
                     onRemove={handleRemove}
-                    onSubmit={onSubmit}
+                    onSubmit={openSubmitConfirm}
                     isPending={isPending}
                 />
             </div>
+
+            <ModalConfirm
+                open={showConfirmModal}
+                onClose={() => setShowConfirmModal(false)}
+                onConfirm={onSubmit}
+                title='ثبت نهایی درخواست'
+                message={`آیا از ثبت نهایی درخواست با ${items.length} قلم اطمینان دارید؟`}
+                confirmLabel='ثبت درخواست'
+                isLoading={isPending}
+            />
         </div>
     )
 }