diff options
Diffstat (limited to 'lib/evaluation-criteria/table/reg-eval-criteria-details-sheet.tsx')
| -rw-r--r-- | lib/evaluation-criteria/table/reg-eval-criteria-details-sheet.tsx | 188 |
1 files changed, 114 insertions, 74 deletions
diff --git a/lib/evaluation-criteria/table/reg-eval-criteria-details-sheet.tsx b/lib/evaluation-criteria/table/reg-eval-criteria-details-sheet.tsx index 60ca173b..cfcf6e26 100644 --- a/lib/evaluation-criteria/table/reg-eval-criteria-details-sheet.tsx +++ b/lib/evaluation-criteria/table/reg-eval-criteria-details-sheet.tsx @@ -2,20 +2,20 @@ /* IMPORT */ import { Badge } from '@/components/ui/badge'; -import { Button } from '@/components/ui/button'; + import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { ScrollArea } from '@/components/ui/scroll-area'; import { Separator } from '@/components/ui/separator'; import { Sheet, SheetContent, SheetHeader, SheetTitle } from '@/components/ui/sheet'; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'; import { useEffect, useState } from 'react'; -import { Loader2, X } from 'lucide-react'; +import { Loader2 } from 'lucide-react'; import { REG_EVAL_CRITERIA_CATEGORY, REG_EVAL_CRITERIA_CATEGORY2, REG_EVAL_CRITERIA_ITEM, - type RegEvalCriteriaView, type RegEvalCriteriaDetails, + type RegEvalCriteria, } from '@/db/schema'; import { getRegEvalCriteriaDetails } from '../service'; // 서버 액션 import @@ -23,7 +23,7 @@ import { getRegEvalCriteriaDetails } from '../service'; // 서버 액션 import /* TYPES */ interface RegEvalCriteriaDetailsSheetProps { - criteriaViewData: RegEvalCriteriaView; + criteriaViewData: RegEvalCriteria; open: boolean; onOpenChange: (open: boolean) => void; } @@ -125,7 +125,7 @@ export function RegEvalCriteriaDetailsSheet({ </div> <div> - <p className="text-sm font-medium text-muted-foreground">평가명 (범위)</p> + <p className="text-sm font-medium text-muted-foreground">평가명</p> <p className="text-sm mt-1 font-medium">{criteriaViewData.range || '-'}</p> </div> @@ -140,78 +140,118 @@ export function RegEvalCriteriaDetailsSheet({ <Separator /> - {/* 평가 옵션 및 점수 카드 */} - <Card> - <CardHeader> - <CardTitle className="text-lg">평가 옵션 및 점수</CardTitle> - <p className="text-sm text-muted-foreground"> - 각 평가 옵션에 따른 점수를 확인할 수 있습니다. - </p> - </CardHeader> - <CardContent> - {loading ? ( - <div className="flex justify-center items-center py-8"> - <Loader2 className="h-4 w-4 animate-spin mr-2" /> - <span className="text-sm text-muted-foreground">로딩 중...</span> - </div> - ) : error ? ( - <div className="flex justify-center items-center py-8"> - <div className="text-sm text-destructive">{error}</div> + {/* 점수 정보 카드 - 점수 유형에 따라 다른 UI 표시 */} + {criteriaViewData.scoreType === 'variable' ? ( + /* 변동점수 정보 카드 */ + <Card> + <CardHeader> + <CardTitle className="text-lg">변동점수 설정</CardTitle> + <p className="text-sm text-muted-foreground"> + 이 평가 기준은 변동점수 유형으로 설정되어 있습니다. + </p> + </CardHeader> + <CardContent className="space-y-4"> + <div className="grid grid-cols-3 gap-4"> + <div> + <p className="text-sm font-medium text-muted-foreground">최소점수</p> + <Badge variant="outline" className="mt-1"> + {criteriaViewData.variableScoreMin || '-'} + </Badge> + </div> + <div> + <p className="text-sm font-medium text-muted-foreground">최대점수</p> + <Badge variant="outline" className="mt-1 "> + {criteriaViewData.variableScoreMax || '-'} + </Badge> + </div> + <div> + <p className="text-sm font-medium text-muted-foreground">점수단위</p> + <Badge variant="outline" className="mt-1"> + {criteriaViewData.variableScoreUnit || '-'} + </Badge> + </div> </div> - ) : details.length === 0 ? ( - <div className="flex justify-center items-center py-8"> - <div className="text-sm text-muted-foreground">등록된 평가 옵션이 없습니다.</div> + <div className="p-4 bg-muted rounded-lg"> + <p className="text-sm text-muted-foreground"> + 변동점수 유형에서는 평가 시 설정된 점수 범위 내에서 점수를 부여합니다. + </p> </div> - ) : ( - <div className="border rounded-lg"> - <Table> - <TableHeader> - <TableRow> - <TableHead className="w-12">#</TableHead> - <TableHead className="min-w-[200px]">평가 옵션</TableHead> - <TableHead className="text-center w-24">기자재-조선</TableHead> - <TableHead className="text-center w-24">기자재-해양</TableHead> - <TableHead className="text-center w-24">벌크-조선</TableHead> - <TableHead className="text-center w-24">벌크-해양</TableHead> - </TableRow> - </TableHeader> - <TableBody> - {details.map((detail, index) => ( - <TableRow key={detail.id}> - <TableCell className="font-medium"> - {(detail.orderIndex ?? index) + 1} - </TableCell> - <TableCell className="font-medium"> - {detail.detail} - </TableCell> - <TableCell className="text-center"> - <Badge variant="outline" className="font-mono"> - {formatScore(detail.scoreEquipShip)} - </Badge> - </TableCell> - <TableCell className="text-center"> - <Badge variant="outline" className="font-mono"> - {formatScore(detail.scoreEquipMarine)} - </Badge> - </TableCell> - <TableCell className="text-center"> - <Badge variant="outline" className="font-mono"> - {formatScore(detail.scoreBulkShip)} - </Badge> - </TableCell> - <TableCell className="text-center"> - <Badge variant="outline" className="font-mono"> - {formatScore(detail.scoreBulkMarine)} - </Badge> - </TableCell> + </CardContent> + </Card> + ) : ( + /* 고정점수 - 평가 옵션 및 점수 카드 */ + <Card> + <CardHeader> + <CardTitle className="text-lg">평가 옵션 및 점수</CardTitle> + <p className="text-sm text-muted-foreground"> + 각 평가 옵션에 따른 점수를 확인할 수 있습니다. + </p> + </CardHeader> + <CardContent> + {loading ? ( + <div className="flex justify-center items-center py-8"> + <Loader2 className="h-4 w-4 animate-spin mr-2" /> + <span className="text-sm text-muted-foreground">로딩 중...</span> + </div> + ) : error ? ( + <div className="flex justify-center items-center py-8"> + <div className="text-sm text-destructive">{error}</div> + </div> + ) : details.length === 0 ? ( + <div className="flex justify-center items-center py-8"> + <div className="text-sm text-muted-foreground">등록된 평가 옵션이 없습니다.</div> + </div> + ) : ( + <div className="border rounded-lg"> + <Table> + <TableHeader> + <TableRow> + <TableHead className="w-12">#</TableHead> + <TableHead className="min-w-[200px]">평가 옵션</TableHead> + <TableHead className="text-center w-24">기자재-조선</TableHead> + <TableHead className="text-center w-24">기자재-해양</TableHead> + <TableHead className="text-center w-24">벌크-조선</TableHead> + <TableHead className="text-center w-24">벌크-해양</TableHead> </TableRow> - ))} - </TableBody> - </Table> - </div> - )} - </CardContent> - </Card> + </TableHeader> + <TableBody> + {details.map((detail, index) => ( + <TableRow key={detail.id}> + <TableCell className="font-medium"> + {(detail.orderIndex ?? index) + 1} + </TableCell> + <TableCell className="font-medium"> + {detail.detail} + </TableCell> + <TableCell className="text-center"> + <Badge variant="outline" className="font-mono"> + {formatScore(detail.scoreEquipShip)} + </Badge> + </TableCell> + <TableCell className="text-center"> + <Badge variant="outline" className="font-mono"> + {formatScore(detail.scoreEquipMarine)} + </Badge> + </TableCell> + <TableCell className="text-center"> + <Badge variant="outline" className="font-mono"> + {formatScore(detail.scoreBulkShip)} + </Badge> + </TableCell> + <TableCell className="text-center"> + <Badge variant="outline" className="font-mono"> + {formatScore(detail.scoreBulkMarine)} + </Badge> + </TableCell> + </TableRow> + ))} + </TableBody> + </Table> + </div> + )} + </CardContent> + </Card> + )} </div> </ScrollArea> |