96 lines
3.5 KiB
TypeScript
96 lines
3.5 KiB
TypeScript
'use client';
|
|
|
|
// File: app/(dashboard)/response-codes/page.tsx
|
|
// Master Approval Matrix management UI (T031, FR-022)
|
|
import { useState } from 'react';
|
|
import { Settings, ShieldCheck, ChevronRight } from 'lucide-react';
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
|
import { useResponseCodes } from '@/hooks/use-response-codes';
|
|
import { MatrixEditor } from '@/components/response-code/MatrixEditor';
|
|
import { ProjectOverrideManager } from '@/components/response-code/ProjectOverrideManager';
|
|
import { useProjectStore } from '@/lib/stores/project-store';
|
|
|
|
export default function ResponseCodesPage() {
|
|
const [activeTab, setActiveTab] = useState('global');
|
|
const selectedProjectId = useProjectStore((state) => state.selectedProjectId);
|
|
|
|
// Dummy data for example - in real app, these would come from specialized hooks
|
|
const { data: globalRules = [] } = useResponseCodes();
|
|
|
|
return (
|
|
<div className="p-6 space-y-6">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<div className="flex items-center gap-2 text-sm text-muted-foreground mb-1">
|
|
<span>Admin</span>
|
|
<ChevronRight className="h-3 w-3" />
|
|
<span>Master Data</span>
|
|
</div>
|
|
<h1 className="text-2xl font-bold flex items-center gap-2">
|
|
<ShieldCheck className="h-6 w-6 text-primary" />
|
|
Approval Matrix & Response Codes
|
|
</h1>
|
|
<p className="text-muted-foreground text-sm mt-1">
|
|
Manage global response codes and document-specific approval rules.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<Tabs value={activeTab} onValueChange={setActiveTab} className="space-y-4">
|
|
<TabsList>
|
|
<TabsTrigger value="global" className="gap-2">
|
|
Global Matrix
|
|
</TabsTrigger>
|
|
<TabsTrigger value="project" className="gap-2">
|
|
Project Overrides
|
|
</TabsTrigger>
|
|
<TabsTrigger value="codes" className="gap-2">
|
|
Code Definitions
|
|
</TabsTrigger>
|
|
</TabsList>
|
|
|
|
<TabsContent value="global" className="space-y-4">
|
|
<div className="grid grid-cols-1 gap-4">
|
|
<MatrixEditor
|
|
documentTypeCode="SDW"
|
|
rules={globalRules.map(r => ({
|
|
publicId: r.publicId,
|
|
responseCode: {
|
|
publicId: r.publicId,
|
|
code: r.code,
|
|
descriptionEn: r.descriptionEn || '',
|
|
category: r.category || 'ENGINEERING'
|
|
},
|
|
isEnabled: true,
|
|
requiresComments: false,
|
|
triggersNotification: false,
|
|
isOverridden: false
|
|
}))}
|
|
onToggleEnabled={() => {}}
|
|
onToggleRequiresComments={() => {}}
|
|
onToggleNotification={() => {}}
|
|
/>
|
|
</div>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="project">
|
|
<ProjectOverrideManager
|
|
projectPublicId={selectedProjectId ?? ''}
|
|
projectName="Selected Project"
|
|
overrides={[]}
|
|
onDeleteOverride={() => {}}
|
|
onAddOverride={() => {}}
|
|
/>
|
|
</TabsContent>
|
|
|
|
<TabsContent value="codes">
|
|
<div className="bg-muted/30 border rounded-lg p-12 text-center text-muted-foreground">
|
|
<Settings className="h-12 w-12 mx-auto mb-4 opacity-20" />
|
|
<p>Response Code definition management is coming soon.</p>
|
|
</div>
|
|
</TabsContent>
|
|
</Tabs>
|
|
</div>
|
|
);
|
|
}
|