continue: work on match table

2026-04-14 12:50:52 +07:00
parent 25ad9b0350
commit 35b7f82ad9
4 changed files with 159 additions and 18 deletions
@@ -0,0 +1,95 @@
+'use client'
+
+import CaseComplaint from '@/app/ui/file-page/violation-table/case-complaint';
+import CaseLegal from '@/app/ui/file-page/violation-table/case-legal';
+import { ViolationFileDetail } from '@/app/hooks/react-query/useFileViolations';
+import { MatchStatus } from '@/app/actions/violationActions';
+import { useEffect, useState } from 'react';
+
+type UpdateStatusHandler = (id: number, status: MatchStatus) => Promise<boolean>;
+
+const STATUSES_IN_WORK = ['COMPLAINT_IN_WORK', 'LEGAL_IN_WORK', 'COMPLAINT_AND_LEGAL_IN_WORK'];
+
+type TabType = 'complaint' | 'legal'
+
+export default function FilePageViolationInfoTabs({ selectedViolation, updateStatusHandler }: { selectedViolation: ViolationFileDetail, updateStatusHandler: UpdateStatusHandler }) {
+	const [activeTab, setActiveTab] = useState<TabType>('complaint');
+	const [showTabs, setShowTabs] = useState(false);
+	const isInWork = STATUSES_IN_WORK.includes(selectedViolation.status);
+
+	useEffect(() => {
+		console.log(selectedViolation.status);
+	}, [selectedViolation]);
+
+	useEffect(() => {
+		setShowTabs(false);
+	}, [selectedViolation.id]);
+
+	if (!isInWork && !showTabs) {
+		return (
+			<div className="violation-info-choice">
+				<h4>Вы можете</h4>
+				<div className="violation-info-choice-buttons">
+					<button
+						className="violation-info-choice-btn"
+						onClick={() => {
+							setShowTabs(true);
+							setActiveTab('complaint');
+						}}
+					>
+						Подать жалобу
+					</button>
+
+					<span>
+						или
+					</span>
+
+					<button
+						className="violation-info-choice-btn"
+						onClick={() => {
+							setShowTabs(true);
+							setActiveTab('legal');
+						}}
+					>
+						Подать притензию
+					</button>
+				</div>
+			</div>
+		);
+	}
+
+	return (
+		<div className="violation-info-tabs-wrapper">
+			<div className="violation-info-tabs">
+				<button
+					className={`violation-info-tab ${activeTab === 'complaint' ? 'violation-info-tab--active' : ''}`}
+					onClick={() => setActiveTab('complaint')}
+				>
+					Жалоба
+				</button>
+				<button
+					className={`violation-info-tab ${activeTab === 'legal' ? 'violation-info-tab--active' : ''}`}
+					onClick={() => setActiveTab('legal')}
+				>
+					Претензия
+				</button>
+			</div>
+			<div className="violation-info-content">
+				{activeTab === 'complaint' && (
+					<CaseComplaint
+						key={"complaint_" + selectedViolation.id}
+						selectedViolation={selectedViolation}
+						updateStatusHandler={updateStatusHandler}
+					/>
+				)}
+				{activeTab === 'legal' && (
+					<CaseLegal
+						key={"legal_" + selectedViolation.id}
+						selectedViolation={selectedViolation}
+						updateStatusHandler={updateStatusHandler}
+					/>
+				)}
+			</div>
+		</div>
+	);
+}