690514:2019 204-rfa-approval-refactor #01

2026-05-14 20:19:21 +07:00
parent 07cc6d47b1
commit 0240d80da5
183 changed files with 20050 additions and 1017 deletions
@@ -0,0 +1,95 @@
+'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>
+  );
+}