From 14bb8e9e604ca250ec2ff85267b8546d0a9a5715 Mon Sep 17 00:00:00 2001 From: bicochan Date: Tue, 22 Apr 2025 20:13:12 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=EC=A1=B0=EC=A7=81=EB=8F=84=20=EC=86=8C?= =?UTF-8?q?=EC=86=8D=EC=9B=90=20=ED=8F=BC=20=EC=9E=91=EC=97=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/entities/user-organization/index.ts | 2 ++ .../model/user-organization-interface.ts | 23 +++++++++++-------- apps/cs/src/pages/menu/lib/utils.ts | 19 ++++++++------- .../menu/ui/organization-search-dialog.tsx | 8 +++---- apps/cs/src/pages/menu/ui/type-menu-form.tsx | 4 ++-- .../organization/ui/organization-page.tsx | 4 +++- .../ui/user-organization-section.tsx | 13 ++++++----- 7 files changed, 42 insertions(+), 31 deletions(-) diff --git a/apps/cs/src/entities/user-organization/index.ts b/apps/cs/src/entities/user-organization/index.ts index df4ed2321..19cd76682 100644 --- a/apps/cs/src/entities/user-organization/index.ts +++ b/apps/cs/src/entities/user-organization/index.ts @@ -2,7 +2,9 @@ export { UserOrganizationApi } from "./api/user-organization-service"; export { userOrganizationFormSchema, type TreeUserOrganization, + type TreeUser, type UserOrganizationFormData, + type UserOrganizationPayloadData, type User, type SearchUser, } from "./model/user-organization-interface"; diff --git a/apps/cs/src/entities/user-organization/model/user-organization-interface.ts b/apps/cs/src/entities/user-organization/model/user-organization-interface.ts index bbacd1a10..f9198549b 100644 --- a/apps/cs/src/entities/user-organization/model/user-organization-interface.ts +++ b/apps/cs/src/entities/user-organization/model/user-organization-interface.ts @@ -53,21 +53,24 @@ export interface TreeUserOrganization { children: TreeUserOrganization[]; } +export const userOrganizationPayloadSchema = z.object({ + mode: z.string(), + ognzSn: z.number(), + userUnqId: z.string(), + jbpsSeCd: z.string(), + jbgdSeCd: z.string(), + sortSeq: z.number(), +}); + export const userOrganizationFormSchema = z.object({ - userOrganization: z.array( - z.object({ - mode: z.string(), - ognzSn: z.number(), - userUnqId: z.string(), - jbpsSeCd: z.string(), - jbgdSeCd: z.string(), - sortSeq: z.number(), - }), - ), + userOrganization: z.array(userOrganizationPayloadSchema), }); export type UserOrganizationList = PageableList; export type SearchUserList = PageableList; +export type UserOrganizationPayloadData = z.infer< + typeof userOrganizationPayloadSchema +>; export type UserOrganizationFormData = z.infer< typeof userOrganizationFormSchema >; diff --git a/apps/cs/src/pages/menu/lib/utils.ts b/apps/cs/src/pages/menu/lib/utils.ts index 09dd2a8a9..f6d13be33 100644 --- a/apps/cs/src/pages/menu/lib/utils.ts +++ b/apps/cs/src/pages/menu/lib/utils.ts @@ -1,5 +1,8 @@ import type { DropOptions, NodeModel } from "@minoru/react-dnd-treeview"; -import type { UserOrganization, User } from "@/entities/user-organization"; +import type { + TreeUserOrganization, + TreeUser, +} from "@/entities/user-organization"; import type { TreeMenu, TreeNode } from "../model/menu-interface"; export const generateMenuTreeData = ( @@ -108,11 +111,11 @@ export const handleNodeTextChange = }; export const generateUserOrganizationTreeData = ( - organizations: UserOrganization[], -): NodeModel[] => { - return organizations.reduce[]>( + organizations: TreeUserOrganization[], +): NodeModel[] => { + return organizations.reduce[]>( (acc, org) => { - const orgNode: NodeModel = { + const orgNode: NodeModel = { id: org.ognzSn, parent: org.upOgnzSn ?? 0, text: org.ognzNm, @@ -145,9 +148,9 @@ export const generateUserOrganizationTreeData = ( }; export const filterUserOrganizationTreeDataByKeyword = ( - treeData: NodeModel[], + treeData: NodeModel[], keyword: string, -): NodeModel[] => { +): NodeModel[] => { return Array.from( treeData.reduce((matchedNodes, node) => { if (!node.text.includes(keyword)) return matchedNodes; @@ -163,6 +166,6 @@ export const filterUserOrganizationTreeDataByKeyword = ( } return matchedNodes; - }, new Set>()), + }, new Set>()), ); }; diff --git a/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx b/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx index 8478533fa..14eccbf98 100644 --- a/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx +++ b/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx @@ -21,8 +21,8 @@ import { import { cn } from "@common/components/lib"; import { UserOrganizationApi, - type User, type TreeUserOrganization, + type TreeUser, } from "@/entities/user-organization"; import { ENDPOINT } from "@/shared/config"; import { @@ -30,10 +30,10 @@ import { generateUserOrganizationTreeData, } from "../lib/utils"; -type TreeModel = TreeUserOrganization | User; +type TreeModel = TreeUserOrganization | TreeUser; interface OrganizationSearchDialogProps { - handleUserSelect: (user: User) => void; + handleUserSelect: (user: TreeUser) => void; } function OrganizationSearchDialog({ @@ -53,7 +53,7 @@ function OrganizationSearchDialog({ const handleSelectNode = (node: NodeModel) => { setSelectedNode(node); - handleUserSelect(node.data as User); + handleUserSelect(node.data as TreeUser); }; useEffect(() => { diff --git a/apps/cs/src/pages/menu/ui/type-menu-form.tsx b/apps/cs/src/pages/menu/ui/type-menu-form.tsx index 085506ce6..1f0483d1b 100644 --- a/apps/cs/src/pages/menu/ui/type-menu-form.tsx +++ b/apps/cs/src/pages/menu/ui/type-menu-form.tsx @@ -15,7 +15,7 @@ import { } from "@common/components"; import type { BoardPopup } from "@/entities/board"; import type { Contents } from "@/entities/content"; -import type { User } from "@/entities/user-organization"; +import type { TreeUser } from "@/entities/user-organization"; import { FormItem, FormControl, FormField } from "@/shared/ui/form"; import type { MenuFormData, MenuType } from "../model/menu-interface"; import { OrganizationSearchDialog } from "./organization-search-dialog"; @@ -37,7 +37,7 @@ function TypeMenuForm({ form, menuType }: TypeMenuFormProps) { form.setValue("menuLnkgSnNm", content.contsTtl); }; - const handleUserSelect = (user: User) => { + const handleUserSelect = (user: TreeUser) => { form.setValue("menuPicUserUnqId", user.userUnqId); form.setValue("menuPicUserUnqIdNm", user.userNm); }; diff --git a/apps/cs/src/pages/organization/ui/organization-page.tsx b/apps/cs/src/pages/organization/ui/organization-page.tsx index a0979db53..fb920dbfc 100644 --- a/apps/cs/src/pages/organization/ui/organization-page.tsx +++ b/apps/cs/src/pages/organization/ui/organization-page.tsx @@ -227,7 +227,9 @@ function OrganizationPage() { handleUpdate={updateOrganization} handleDelete={deleteOrganization} /> - + {selectedOrganization?.ognzSn && ( + + )} ); diff --git a/apps/cs/src/pages/organization/ui/user-organization-section.tsx b/apps/cs/src/pages/organization/ui/user-organization-section.tsx index 3bdfe4f19..7e7eaa2a0 100644 --- a/apps/cs/src/pages/organization/ui/user-organization-section.tsx +++ b/apps/cs/src/pages/organization/ui/user-organization-section.tsx @@ -31,7 +31,7 @@ type UserOrganizationSectionProps = { function UserOrganizationSection({ ognzSn }: UserOrganizationSectionProps) { const [userList, setUserList] = useState([]); - const { data } = useQuery({ + const { data: userOrganizationList } = useQuery({ queryKey: [ENDPOINT.CMS_SERVICE.USER_ORGANIZATION, ognzSn], queryFn: () => UserOrganizationApi.getUserOrganizationList({ ognzSn: ognzSn! }), @@ -53,7 +53,7 @@ function UserOrganizationSection({ ognzSn }: UserOrganizationSectionProps) { resolver: zodResolver(userOrganizationFormSchema), values: { userOrganization: [ - ...(data?.content ?? []).map((user) => ({ + ...userList.map((user) => ({ mode: user.mode, ognzSn: user.ognzSn, userUnqId: user.userUnqId, @@ -64,14 +64,13 @@ function UserOrganizationSection({ ognzSn }: UserOrganizationSectionProps) { ], }, }); - const { append } = useFieldArray({ control: form.control, name: "userOrganization", }); const table = useReactTable({ - data: data?.content ?? [], + data: userList, columns: createColumns( form, (props) => , @@ -109,8 +108,9 @@ function UserOrganizationSection({ ognzSn }: UserOrganizationSectionProps) { }; useEffect(() => { - if (data?.content) setUserList(data.content); - }, [data]); + if (userOrganizationList?.content) + setUserList(userOrganizationList.content); + }, [userOrganizationList]); return (
@@ -134,6 +134,7 @@ function UserOrganizationSection({ ognzSn }: UserOrganizationSectionProps) { type CodeSelectProps = React.ComponentPropsWithoutRef & { codeData?: ICode[]; }; + const CodeSelect = ({ codeData, ...props }: CodeSelectProps) => { if (!codeData) return null;