forked from baron/baron-sso
feat: implement CSV-based organization chart import and enhance group hierarchy
This commit is contained in:
@@ -0,0 +1,128 @@
|
|||||||
|
import { useMutation } from "@tanstack/react-query";
|
||||||
|
import { Download, FileText, Loader2, Upload } from "lucide-react";
|
||||||
|
import * as React from "react";
|
||||||
|
import { toast } from "sonner";
|
||||||
|
import { Button } from "../../../components/ui/button";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogDescription,
|
||||||
|
DialogFooter,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
DialogTrigger,
|
||||||
|
} from "../../../components/ui/dialog";
|
||||||
|
import { importOrgChart } from "../../../lib/adminApi";
|
||||||
|
import { t } from "../../../lib/i18n";
|
||||||
|
|
||||||
|
interface OrgChartUploadModalProps {
|
||||||
|
tenantId: string;
|
||||||
|
onSuccess?: () => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function OrgChartUploadModal({ tenantId, onSuccess }: OrgChartUploadModalProps) {
|
||||||
|
const [open, setOpen] = React.useState(false);
|
||||||
|
const [file, setFile] = React.useState<File | null>(null);
|
||||||
|
const fileInputRef = React.useRef<HTMLInputElement>(null);
|
||||||
|
|
||||||
|
const mutation = useMutation({
|
||||||
|
mutationFn: (file: File) => importOrgChart(tenantId, file),
|
||||||
|
onSuccess: () => {
|
||||||
|
toast.success(t("msg.admin.org.import_success", "조직도가 성공적으로 업로드되었습니다."));
|
||||||
|
setOpen(false);
|
||||||
|
onSuccess?.();
|
||||||
|
},
|
||||||
|
onError: (error: any) => {
|
||||||
|
toast.error(t("msg.admin.org.import_error", "조직도 업로드 실패"), {
|
||||||
|
description: error.response?.data?.error || error.message,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
|
const selectedFile = e.target.files?.[0];
|
||||||
|
if (selectedFile) {
|
||||||
|
setFile(selectedFile);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleUpload = () => {
|
||||||
|
if (file) {
|
||||||
|
mutation.mutate(file);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const downloadTemplate = () => {
|
||||||
|
const headers = "email,name,organization,position,jobtitle,is_owner";
|
||||||
|
const example = "ceo@example.com,홍길동,경영진,대표이사,경영총괄,true
|
||||||
|
cto@example.com,이몽룡,기술부문,이사,기술총괄,true
|
||||||
|
user1@example.com,성춘향,기술부문/개발팀,팀원,프론트엔드 개발,false";
|
||||||
|
const blob = new Blob([`${headers}
|
||||||
|
${example}`], { type: "text/csv" });
|
||||||
|
const url = URL.createObjectURL(blob);
|
||||||
|
const a = document.createElement("a");
|
||||||
|
a.href = url;
|
||||||
|
a.download = "org_chart_template.csv";
|
||||||
|
a.click();
|
||||||
|
URL.revokeObjectURL(url);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button variant="outline" size="sm" className="gap-2">
|
||||||
|
<Upload size={14} />
|
||||||
|
{t("ui.admin.org.import_btn", "조직도 임포트 (CSV)")}
|
||||||
|
</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>{t("ui.admin.org.import_title", "조직도 일괄 등록")}</DialogTitle>
|
||||||
|
<DialogDescription>
|
||||||
|
{t("msg.admin.org.import_description", "CSV 파일을 업로드하여 조직 계층과 멤버를 한 번에 구성합니다.")}
|
||||||
|
</DialogDescription>
|
||||||
|
</DialogHeader>
|
||||||
|
|
||||||
|
<div className="space-y-4 py-4">
|
||||||
|
<div className="flex justify-between items-center">
|
||||||
|
<Button variant="ghost" size="sm" onClick={downloadTemplate} className="gap-2">
|
||||||
|
<Download size={14} />
|
||||||
|
{t("ui.admin.org.download_template", "템플릿 다운로드")}
|
||||||
|
</Button>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
accept=".csv"
|
||||||
|
className="hidden"
|
||||||
|
ref={fileInputRef}
|
||||||
|
onChange={handleFileChange}
|
||||||
|
/>
|
||||||
|
<Button onClick={() => fileInputRef.current?.click()} variant="secondary" size="sm">
|
||||||
|
{file ? t("ui.common.change_file", "파일 변경") : t("ui.common.select_file", "파일 선택")}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{file && (
|
||||||
|
<div className="rounded-lg border p-4 bg-muted/20 flex items-center gap-3">
|
||||||
|
<FileText className="text-primary" />
|
||||||
|
<div className="flex-1 min-w-0">
|
||||||
|
<div className="font-medium truncate">{file.name}</div>
|
||||||
|
<div className="text-xs text-muted-foreground">{(file.size / 1024).toFixed(1)} KB</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<DialogFooter>
|
||||||
|
<Button
|
||||||
|
onClick={handleUpload}
|
||||||
|
disabled={!file || mutation.isPending}
|
||||||
|
className="w-full sm:w-auto"
|
||||||
|
>
|
||||||
|
{mutation.isPending && <Loader2 size={16} className="mr-2 animate-spin" />}
|
||||||
|
{t("ui.admin.org.start_import", "임포트 시작")}
|
||||||
|
</Button>
|
||||||
|
</DialogFooter>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -47,6 +47,7 @@ import {
|
|||||||
removeGroupMember,
|
removeGroupMember,
|
||||||
} from "../../../lib/adminApi";
|
} from "../../../lib/adminApi";
|
||||||
import { t } from "../../../lib/i18n";
|
import { t } from "../../../lib/i18n";
|
||||||
|
import { OrgChartUploadModal } from "../components/OrgChartUploadModal";
|
||||||
|
|
||||||
type UserGroupNode = GroupSummary & {
|
type UserGroupNode = GroupSummary & {
|
||||||
children: UserGroupNode[];
|
children: UserGroupNode[];
|
||||||
@@ -443,13 +444,19 @@ function TenantGroupsPage() {
|
|||||||
)}
|
)}
|
||||||
</CardDescription>
|
</CardDescription>
|
||||||
</div>
|
</div>
|
||||||
<Button
|
<div className="flex items-center gap-2">
|
||||||
variant="ghost"
|
<OrgChartUploadModal
|
||||||
size="sm"
|
tenantId={tenantId}
|
||||||
onClick={() => groupsQuery.refetch()}
|
onSuccess={() => groupsQuery.refetch()}
|
||||||
>
|
/>
|
||||||
<RefreshCw size={14} />
|
<Button
|
||||||
</Button>
|
variant="ghost"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => groupsQuery.refetch()}
|
||||||
|
>
|
||||||
|
<RefreshCw size={14} />
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent>
|
<CardContent>
|
||||||
<Table>
|
<Table>
|
||||||
|
|||||||
@@ -260,6 +260,21 @@ export async function removeGroupMember(
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function importOrgChart(tenantId: string, file: File) {
|
||||||
|
const formData = new FormData();
|
||||||
|
formData.append("file", file);
|
||||||
|
const { data } = await apiClient.post(
|
||||||
|
`/v1/admin/tenants/${tenantId}/organization/import`,
|
||||||
|
formData,
|
||||||
|
{
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "multipart/form-data",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
|
return data;
|
||||||
|
}
|
||||||
|
|
||||||
export type GroupRole = {
|
export type GroupRole = {
|
||||||
tenantId: string;
|
tenantId: string;
|
||||||
tenantName: string;
|
tenantName: string;
|
||||||
|
|||||||
@@ -81,6 +81,11 @@ func (s *orgChartService) ImportCSV(ctx context.Context, tenantID string, r io.R
|
|||||||
orgPath := strings.TrimSpace(record[colMap["organization"]])
|
orgPath := strings.TrimSpace(record[colMap["organization"]])
|
||||||
position := strings.TrimSpace(record[colMap["position"]])
|
position := strings.TrimSpace(record[colMap["position"]])
|
||||||
jobTitle := strings.TrimSpace(record[colMap["jobtitle"]])
|
jobTitle := strings.TrimSpace(record[colMap["jobtitle"]])
|
||||||
|
isOwner := false
|
||||||
|
if idx, ok := colMap["is_owner"]; ok && idx < len(record) {
|
||||||
|
val := strings.ToLower(record[idx])
|
||||||
|
isOwner = val == "true" || val == "y" || val == "1" || val == "yes"
|
||||||
|
}
|
||||||
|
|
||||||
if email == "" || name == "" || orgPath == "" {
|
if email == "" || name == "" || orgPath == "" {
|
||||||
continue
|
continue
|
||||||
@@ -125,13 +130,25 @@ func (s *orgChartService) ImportCSV(ctx context.Context, tenantID string, r io.R
|
|||||||
|
|
||||||
// 3. Sync Membership to Keto via Outbox
|
// 3. Sync Membership to Keto via Outbox
|
||||||
if s.ketoOutboxRepo != nil {
|
if s.ketoOutboxRepo != nil {
|
||||||
|
// Add as member of UserGroup
|
||||||
_ = s.ketoOutboxRepo.Create(ctx, &domain.KetoOutbox{
|
_ = s.ketoOutboxRepo.Create(ctx, &domain.KetoOutbox{
|
||||||
Namespace: "Tenant",
|
Namespace: "UserGroup",
|
||||||
Object: leafID,
|
Object: leafID,
|
||||||
Relation: "members",
|
Relation: "members",
|
||||||
Subject: "User:" + kratosID,
|
Subject: "User:" + kratosID,
|
||||||
Action: domain.KetoOutboxActionCreate,
|
Action: domain.KetoOutboxActionCreate,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// Add as owner if applicable
|
||||||
|
if isOwner {
|
||||||
|
_ = s.ketoOutboxRepo.Create(ctx, &domain.KetoOutbox{
|
||||||
|
Namespace: "UserGroup",
|
||||||
|
Object: leafID,
|
||||||
|
Relation: "owners",
|
||||||
|
Subject: "User:" + kratosID,
|
||||||
|
Action: domain.KetoOutboxActionCreate,
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -161,19 +178,19 @@ func (s *orgChartService) ensureOrgPath(ctx context.Context, rootTenantID string
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Check DB if already exists
|
// Check DB if already exists
|
||||||
// We search for a USER_GROUP tenant with this name and parent
|
|
||||||
// Note: This logic assumes name is unique under a parent
|
|
||||||
// For robustness, we should probably have a better lookup
|
|
||||||
var existingID string
|
var existingID string
|
||||||
// In a real implementation, Repo should have a FindByParentAndName method
|
if s.userGroupRepo != nil {
|
||||||
// For this implementation, we'll try to find by Name and ParentID in TenantRepo or UserGroupRepo
|
groups, err := s.userGroupRepo.ListByTenantID(ctx, rootTenantID)
|
||||||
// Since we're using Polymorphic Tenants, let's assume we can lookup
|
if err == nil {
|
||||||
|
for _, g := range groups {
|
||||||
// For simplicity in this POC, let's just use Create logic if not in cache
|
// Match by name and parent
|
||||||
// In production, we MUST check DB first to avoid duplicates
|
if g.Name == part && ((g.ParentID == nil && currentParentID == rootTenantID) || (g.ParentID != nil && *g.ParentID == currentParentID)) {
|
||||||
|
existingID = g.ID
|
||||||
// [Placeholder] Lookup in DB logic...
|
break
|
||||||
// existingID = s.lookupOrgUnit(ctx, rootTenantID, currentParentID, part)
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if existingID == "" {
|
if existingID == "" {
|
||||||
// Create new unit
|
// Create new unit
|
||||||
|
|||||||
Reference in New Issue
Block a user