연계 리스트 검색 조건 추가

apps/cs/src/entities/link/model/link-interface.ts

@@ -191,6 +191,7 @@ export interface LinkSearchParam extends PageableParams {
     startDate?: string;
     endDate?: string;
     isSucc?: string;
+    linkClfsCd?: string;
 }
 
 export type LinkFormData = z.infer<typeof linkFormSchema>;

apps/cs/src/pages/link/ui/link-page.tsx

@@ -4,7 +4,7 @@ import "@common/assets/styles/grid.css";
 
 import { useState } from "react";
 import { useRouter } from "next/navigation";
-import { Button, Input, Label, LoadingWithAnimation } from "@common/components";
+import { Button, Input, Label, LoadingWithAnimation, Select, SelectTrigger, SelectContent, SelectItem, SelectValue } from "@common/components";
 import { getCoreRowModel } from "@tanstack/react-table";
 import { LinkApi, type Link, type LinkSearchParam } from "@/entities/link";
 import { useQuery } from "@tanstack/react-query";
@@ -18,10 +18,12 @@ function LinkPage() {
 
     const [linkSn, setLinkSn] = useState<string>('');
     const [linkNm, setLinkNm] = useState<string>('');
+    const [linkClfsCd, setLinkClfsCd] = useState<string>('');
 
     const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
         linkSn: '',
-        linkNm: ''
+        linkNm: '',
+        linkClfsCd: '',
     });
 
     const query = useQuery({
@@ -32,10 +34,12 @@ function LinkPage() {
     const handleResetSearchParam = () => {
         setLinkSn('');
         setLinkNm('');
+        setLinkClfsCd('ALL');
         setLinkSearchParam({
             ...linkSearchParam,
             linkSn: '',
             linkNm: '',
+            linkClfsCd: 'ALL',
         });
     };
 
@@ -44,7 +48,8 @@ function LinkPage() {
         setLinkSearchParam({
             ...linkSearchParam,
             linkSn,
-            linkNm
+            linkNm,
+            linkClfsCd,
         });
     };
 
@@ -100,6 +105,24 @@ function LinkPage() {
                         onChange={(e) => setLinkNm(e.target.value)}
                         autoComplete="off"
                     />
+                    <Label htmlFor="linkClfsCd" className="mr-2 text-label">
+                        연계 분류
+                    </Label>
+                    <Select onValueChange={(e) => setLinkClfsCd(e)} value={linkClfsCd}>
+                        <SelectTrigger id="linkClfsCd" className="w-[20rem] mr-4">
+                            <SelectValue placeholder="전체"></SelectValue>
+                        </SelectTrigger>
+                        <SelectContent>
+                            <SelectItem value="ALL">전체</SelectItem>
+                            <SelectItem value="link0001">TIBERO 데이터베이스</SelectItem>
+                            <SelectItem value="link0002">ORACLE 데이터베이스</SelectItem>
+                            <SelectItem value="link0003">공공데이터 포털 API</SelectItem>
+                            <SelectItem value="link0004">한강홍수통제소 API</SelectItem>
+                            <SelectItem value="link0005">기상청 API</SelectItem>
+                            <SelectItem value="link0006">국가지하수정보센터 API</SelectItem>
+                            <SelectItem value="link0007">행정정보공동이용센터 연계</SelectItem>
+                        </SelectContent>
+                    </Select>
                     <Button color="green" className="h-[3.2rem]" type="button" onClick={handleResetSearchParam}>
                         초기화
                     </Button>