Merge branch 'main' into iipbs/sn/ii
This commit is contained in:
swcho
+3
-1
@@ -5,4 +5,6 @@ NEXT_PUBLIC_SITE_ID=CS
|
||||
NEXT_PUBLIC_SUB_DOMAIN=http://localhost:13000
|
||||
NEXT_PUBLIC_SERVER_API_URL=http://dev.onasys.co.kr:8000
|
||||
NEXT_PUBLIC_LINK_BACKEND_API_HOST=http://rsone.iptime.org:10014
|
||||
NEXT_PUBLIC_TINY_API_KEY=t9nc4z6inquvvd5pq1vea8wcp7lb01qmqseh6egms9vpaju2
|
||||
NEXT_PUBLIC_TINY_API_KEY=t9nc4z6inquvvd5pq1vea8wcp7lb01qmqseh6egms9vpaju2
|
||||
|
||||
NEXT_PUBLIC_SERVER_API_URL2=http://con.mind-one.co.kr:11083/
|
||||
@@ -11,6 +11,18 @@ import {
|
||||
const serverApiUrl =
|
||||
process.env.NEXT_PUBLIC_SERVER_API_URL ?? "http://localhost:3000";
|
||||
|
||||
const serverApiUrl2 =
|
||||
process.env.NEXT_PUBLIC_SERVER_API_URL2 ?? serverApiUrl;
|
||||
|
||||
const serverApiUrl3 =
|
||||
process.env.NEXT_PUBLIC_SERVER_API_URL3 ?? serverApiUrl;
|
||||
|
||||
const serverApiUrl4 =
|
||||
process.env.NEXT_PUBLIC_SERVER_API_URL4 ?? serverApiUrl;
|
||||
|
||||
const serverApiUrl5 =
|
||||
process.env.NEXT_PUBLIC_SERVER_API_URL5 ?? serverApiUrl;
|
||||
|
||||
export function middleware(req: NextRequest) {
|
||||
const pathname = req.nextUrl.pathname;
|
||||
const searchParams = req.nextUrl.searchParams;
|
||||
@@ -52,6 +64,97 @@ export function middleware(req: NextRequest) {
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
if (pathname.startsWith("/sewerage-service")) {
|
||||
const requestHeaders = new Headers(req.headers);
|
||||
const token = req.cookies.get(CLAIM_NAME)?.value;
|
||||
const userId = req.cookies.get(AUTH_USER_ID)?.value;
|
||||
const newUrl = `${serverApiUrl2}${pathname}`;
|
||||
|
||||
if (token) requestHeaders.set(CLAIM_NAME, token);
|
||||
if (userId) requestHeaders.set(AUTH_USER_ID, userId);
|
||||
|
||||
logMessages.push(` Rewritten URL: ${newUrl}`);
|
||||
logMessages.push("\n--------------------------------\n");
|
||||
console.log(logMessages.join("\n"));
|
||||
|
||||
return NextResponse.rewrite(new URL(newUrl), {
|
||||
headers: requestHeaders,
|
||||
});
|
||||
}
|
||||
|
||||
if (pathname.startsWith("/reuse-service")) {
|
||||
const requestHeaders = new Headers(req.headers);
|
||||
const token = req.cookies.get(CLAIM_NAME)?.value;
|
||||
const userId = req.cookies.get(AUTH_USER_ID)?.value;
|
||||
const newUrl = `${serverApiUrl3}${pathname}`;
|
||||
|
||||
if (token) requestHeaders.set(CLAIM_NAME, token);
|
||||
if (userId) requestHeaders.set(AUTH_USER_ID, userId);
|
||||
|
||||
logMessages.push(` Rewritten URL: ${newUrl}`);
|
||||
logMessages.push("\n--------------------------------\n");
|
||||
console.log(logMessages.join("\n"));
|
||||
|
||||
return NextResponse.rewrite(new URL(newUrl), {
|
||||
headers: requestHeaders,
|
||||
});
|
||||
}
|
||||
|
||||
if (pathname.startsWith("/operation-service")) {
|
||||
const requestHeaders = new Headers(req.headers);
|
||||
const token = req.cookies.get(CLAIM_NAME)?.value;
|
||||
const userId = req.cookies.get(AUTH_USER_ID)?.value;
|
||||
const newUrl = `${serverApiUrl4}${pathname}`;
|
||||
|
||||
if (token) requestHeaders.set(CLAIM_NAME, token);
|
||||
if (userId) requestHeaders.set(AUTH_USER_ID, userId);
|
||||
|
||||
logMessages.push(` Rewritten URL: ${newUrl}`);
|
||||
logMessages.push("\n--------------------------------\n");
|
||||
console.log(logMessages.join("\n"));
|
||||
|
||||
return NextResponse.rewrite(new URL(newUrl), {
|
||||
headers: requestHeaders,
|
||||
});
|
||||
}
|
||||
|
||||
if (pathname.startsWith("/ic-service")) {
|
||||
const requestHeaders = new Headers(req.headers);
|
||||
const token = req.cookies.get(CLAIM_NAME)?.value;
|
||||
const userId = req.cookies.get(AUTH_USER_ID)?.value;
|
||||
const newUrl = `${serverApiUrl5}${pathname}`;
|
||||
|
||||
if (token) requestHeaders.set(CLAIM_NAME, token);
|
||||
if (userId) requestHeaders.set(AUTH_USER_ID, userId);
|
||||
|
||||
logMessages.push(` Rewritten URL: ${newUrl}`);
|
||||
logMessages.push("\n--------------------------------\n");
|
||||
console.log(logMessages.join("\n"));
|
||||
|
||||
return NextResponse.rewrite(new URL(newUrl), {
|
||||
headers: requestHeaders,
|
||||
});
|
||||
}
|
||||
|
||||
if (pathname.startsWith("/dc-service")) {
|
||||
const requestHeaders = new Headers(req.headers);
|
||||
const token = req.cookies.get(CLAIM_NAME)?.value;
|
||||
const userId = req.cookies.get(AUTH_USER_ID)?.value;
|
||||
const newUrl = `${serverApiUrl5}${pathname}`;
|
||||
|
||||
if (token) requestHeaders.set(CLAIM_NAME, token);
|
||||
if (userId) requestHeaders.set(AUTH_USER_ID, userId);
|
||||
|
||||
logMessages.push(` Rewritten URL: ${newUrl}`);
|
||||
logMessages.push("\n--------------------------------\n");
|
||||
console.log(logMessages.join("\n"));
|
||||
|
||||
return NextResponse.rewrite(new URL(newUrl), {
|
||||
headers: requestHeaders,
|
||||
});
|
||||
}
|
||||
|
||||
if (pathname.startsWith("/user-service")) {
|
||||
const queryParams = searchParams.toString();
|
||||
const newUrl = `${serverApiUrl}${pathname}${
|
||||
|
||||
@@ -0,0 +1,63 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 538 755">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1 {
|
||||
fill: #fff;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<!-- Generator: Adobe Illustrator 28.7.9, SVG Export Plug-In . SVG Version: 1.2.0 Build 218) -->
|
||||
<g>
|
||||
<g id="Layer_1">
|
||||
<g id="han" data-label-shift="dx,dy">
|
||||
<path class="cls-1" d="M159.2,197l-5,5.8,5.1,3.7,13.2,9.7-7.3,3.5-8.2-1.2-9.4,1.4,1.4,4.9-3.5,7.3,3.8,2.6-.9,4.7,8.9-2.3,4.2-3.7,5.2,4.2-6.1,2.3.9,12,3,7-.9,3.3-.5,1.6,5.4,6.8,5.2,13.4h-3.6c0-.1,6.4,3.8,6.4,3.8l4.8,6h1.2l3.6-5.4,3.6-.6,13.8,5.9,19.7-1.1,4.6-6.5,3-5.2,8.2-1.7,11.7-17.8,7.1,1.9,4.9,10,13.2,9.6,3.8,13-1.4,12.2-.5,9.5,1.6,1.1-.6,1.3v1.1c.1,0-2.2,2.4-2.2,2.4l-17.5,7.4,7.6,19.2,16.3,1.1,8.4,10.8,12.6.6,4.2-5.2-4.6-7.9-9.2-6.2,12.1-7.1,6.4,5.2,1.3-5.6-6.6-6.5,17.5-5.8,4.8,4.4,4.8-2.1-4.7-6.5,4.5-8.8,6.3-.4,4.7-3,8,3,24.1,4.5,11.5-7.8-2.8-6.4,6.5-11.7,10.5-5.5,7.6-7.9,10.2-2.3,13.4,4.6,4.4-8,12.4,8.2,3.4-3.1.2-15.2.4-11.3,13.4-3.2,4.6-.4-1.9,9.9,9.8,4.6,1.6,12.8,12.2,9.2,9.8-8.4,15-8.9-3.7-19-21.8-40.6-5.7-10.6,1.2-6.8-4.9-6.1-4-4.9,1.2-5.2-26.3-33.1-5.8-12.1-7.1-14.9-11.9-20.9-2.9-9.4-2.1-6.7-1.8-5.2-8.7-25.5-8.6-14.4-.9-11-5.2-11-3-6.3-6,6.5-5.2,22.8-9.8,11-5.5,2.8-7.4,3.7-17.1.5-12.7-1.6-8.2,2.3-5.2-3.4-3.4-2.2-18.8-2.3-21.8,4.5-19-3.7-3.5,4.7-11.2-7.3-5.2,4.2-6.1-.7-11.5,3.5-14.1,10.8-3.7,10.1-12.9,9.8-4,7.3-8.5,6.8-2.3,1.9-9.1,4.5-4,18.3-9.2,11.5-14.3,1.2-2.1,30,5.6,1.4,3.3,9.2-1.4,2.7.9,2.6,2.9-.7,1.8,3.2-4.5,2.2,1.7,8.6,3.8,6.9,8.9,3.4Z"/>
|
||||
</g>
|
||||
<g id="yeongsan" data-label-shift="dx,dy">
|
||||
<path class="cls-1" d="M57.4,578.4s.2,1.4.2,2.3.7,1.6.7,1.9.5,1.4.7,2.3c.2.9,1.2,1.2,1.2,1.2h0s.5,1.4.5,1.4c0,0-.5.7-.9,1.4-.5.7,1.6.9,1.6.9l2.8-.7s1.4-.7,1.4-1.2,0,0-.2-.7c-.2-.7-.5-.7-.9-1.2-.5-.5.5-.2.5-.2l.5.2,2.6-.5s.9-.5,1.4-.7c.5-.2-.2-.5-.2-.9s-.2-1.2-.2-1.2l.2-.9v-1.2c0-.5.7-.7.9-1.2.2-.5.5-.7.9-1.2.5-.5,0-.7,0-1.6s-.5-.5-.5-.9-.5,0-.5,0l-.9.5-.9.7s-.2.9-.5,1.2c-.2.2-1.4.2-1.4.2,0,0-.2-.5-1.2-.9-.9-.5,0,0-.5,0s-1.2-.2-1.2-.2c0,0-1.2-.7-1.6-.9-.5-.2-.5-.9-.5-.9h-1.2s-1.9,1.4-2.8,1.9c-.9.5,0,1.2,0,1.2Z"/>
|
||||
<path class="cls-1" d="M45.2,585.7c.2.2,0,.2.7.9.7.7.5,1.6.9,1.6s.2-.5,1.2,0c.9.5,1.4.5,1.9.7.5.2,1.6.9,1.9.9s1.4.7,1.4.9-.2.2,0,.5c.2.2,0,.5.5,1.4.5.9,1.9,2.6,1.9,2.6,0,0-.7.7.5.5,1.2-.2,1.9-.2,1.9-.9s.2-1.2.2-1.4-.2-.2-.5-1.2c-.2-.9-.7-1.6-.7-1.6,0,0,1.2-.2,0-1.2-1.2-.9-.2-1.2-1.2-.9-.9.2-1.9.2-1.9.2-.2-1.2-.2-1.9-.2-1.9l-.5-.5.7-1.4h0c.5,0,.9-.2,1.2-.2s.9-.7.9-.7c0,0,.2-.2,0-.7-.2-.5-.2-.2-.9-.7s-1.6-.7-1.6-.7l-2.1-1.2-1.4-.9c-.7-.2-2.6.9-2.6.9,0,0,.9-.5,0,.7-.9,1.2-2.3,1.9-2.3,1.9,0,0-.2.5,0,.9.2.5,0,1.2.2,1.4Z"/>
|
||||
<path class="cls-1" d="M28.6,585.5s0,.7,1.2.7h2.1c.5,0,.9.7.9.7v1.9l1.2.7s1.4,0,1.9-.5c.5-.5.5-.7.5-.7l-.5-1.4,2.3-.7s.5-.5.7-1.2c.2-.7-.2-1.2,0-2.3.2-1.2,0-2.8,0-2.8,0,0,.9-1.4.9-2.1s1.9-2.6,1.9-2.8h0v-.7h-1.4c-.2,0-1.7.5-2.1.7-.5.2,0,0-.9,1.2s-.2,1.6-.2,1.6l-1.9.5-1.4.7-.9.2s-1.2-.2-2.1-.2-.5.9-.5.9c0,0-1.2,1.4-1.9,1.6-.7.2-.7.7-.7.7,0,0,.9,2.3.9,2.8v.5Z"/>
|
||||
<path class="cls-1" d="M41.7,591.4c-.5.2-.7-1.2-.5,0,.2,1.2,1.2,2.1,1.2,2.1l1.4.9s.9-.2,1.4,0c.5.2.9,0,.9,0l1.9.7v.2s.7-.2.5-1.6c-.2-1.4,0-1.4,0-1.4l-.7-.9-2.6-1.4h0s-2.8-.7-3-.5c-.2.2-.5-.2-.5.2s.5,1.4,0,1.6Z"/>
|
||||
<path class="cls-1" d="M34.2,597.7s0,0,0,0c0,0,0,0,0,0Z"/>
|
||||
<path class="cls-1" d="M45,598.9l-.7-.7-.5-.9s.2-1.4-.2-1.4-1.9-.5-1.9-.5l-1.4-.7h0s-1.4,0-1.4,0c0,0-.9,0-1.2.7-.2.7-.9.5-.9.9s-2.1,1.2-2.5,1.4c0,0,.2.2.4.5.5.7.5,1.4,1.2,1.4s2.1.2,2.3,0c.2-.2.9-.7,1.2-.5.2.2.5.5.5.9s-.5,1.2-.5,1.6.5,0,0,.5c-.5.5.2,1.4.5,1.6.2.2-.7,2.1-.7,2.1,0,0-.5.5-.5.7s1.4.7,1.6,0c.2-.7.7-1.2.9-1.4.2-.2.9-.5.9-.5,0,0-.5.2.7.2s2.1.2,2.1-.5v-1.9s-.2-1.2,0-1.4c.2-.2,0-2.3,0-2.3Z"/>
|
||||
<path class="cls-1" d="M18.5,619.7c.7,0,1.9-.9,2.3,0,.5.9,1.9,2.6,1.9,2.6,0,0,.2-.2,1.4,0,1.2.2,1.2.5,2.1,0,.9-.5,1.4-1.4,1.4-1.4l1.2-1.2,3.3-1.4s-.2-.7-.7-2.1c-.5-1.4-.7-2.1-.7-2.1,0,0,1.2.2.5-.9-.7-1.2-.9-1.9-.9-1.9l-.5-1.6h0s-.7-.9-.7-.9l-2.1.2s-.2,1.2,0,1.9c.2.7.2.9,0,1.4-.2.5-.7-.5-1.2,0-.5.5-2.3.2-2.3.2h-1.2l-.9,1.4-1.2.9-2.3.9-2.1,1.4s-.5,0,0,.9c.5.9,2.1,1.6,2.8,1.6Z"/>
|
||||
<path class="cls-1" d="M33.1,624h-.9l-1.4-.7-2.1.7s-.9,1.2-.9,1.6.7,1.9,1.4,2.3c.7.5,1.6.7,1.9,1.6.2.9.2,1.9.2,1.9,0,0,1.9.7,2.3-.7.5-1.4.2-2.3.7-2.6.5-.2,1.9-1.6,1.9-1.6,0,0-.5-.5.7-.5s1.6-.5,1.6-.7v-1.9l-.9-.9h.9l.7-.9s.2-.7,0-1.2c-.2-.5-.5-1.9-.5-1.9l-2.6.5h0l-1.4,1.4-.5.9s.2.9,0,1.2c-.2.2-1.2,1.4-1.2,1.4Z"/>
|
||||
<path class="cls-1" d="M65.6,620.2l1.9-.7-2.1-2.6-3.5-1.9h0s-3.3.7-3.3.7l1.6,2.1.9,1.4s-.5.5-.9.9c-.5.5-1.6.7-1.6.7,0,0-.5.5-.5.9s-.9,0-2.1.7c-1.2.7-4.5,1.9-4.5,1.9h-.9c.9,0,1.6,2.6,2.3,2.6h3.1s-.2-.5.9-.7c1.2-.2,2.6-1.2,2.6-1.2,1.4.2,2.3-.7,3,.5.7,1.2,1.4.9,1.6,1.4.2.5,1.2,2.1,1.2,2.1l-.7,2.6s1.2.9,1.6.7c.5-.2,1.9-1.4,1.9-1.4l.9-1.9s-.5-1.4,0-1.9c.5-.5-1.6-1.4-1.6-1.4l-2.8-.7-1.9-2.6v-1.2l2.8-1.2Z"/>
|
||||
<path class="cls-1" d="M64.2,635.5v-1.6s-3.3,1.4-3.3,1.6.9,1.6.9,1.6h1.6l.7-1.6Z"/>
|
||||
<path class="cls-1" d="M59.8,639.2c0,1.2.5,2.8,1.2,3,.7.2,1.6,0,1.6,0v-3l-1.6-.9s-1.2-.2-1.2.9Z"/>
|
||||
<path class="cls-1" d="M38.4,638.3c1.2,0,2.8-4.5,2.8-4.5v-1.4h0s-3.5,0-3.5,0l-2.1,1.4-3.5.7s-.2,1.9,1.4,1.9.7-.1.6-.2c0,0,.3,0,.6.2,1.6.5,3.3.7,3.3,1.2s-.7.7.5.7Z"/>
|
||||
<path class="cls-1" d="M15.4,630.1h0s0,0,0,0h0Z"/>
|
||||
<path class="cls-1" d="M7,642.7c.2-.5,1.2-.7,1.2-1.4s-1.6-2.6-.5-3.1c1.2-.5,2.6-.9,2.8-1.2.2-.2,1.2-.7,1.6-.5s.9.9.9.9l1.4-.5.5-.9s.2-.9.5-1.4c.2-.5.7-1.9.7-1.9v-1.2l-.7-1.6c-.3.2-2.6,2.1-2.8,2.3-.2.2-3,1.2-3.3,1.2s-3.1.2-3.1.2l-3.8.5-2.6,1.9,1.9,2.1s-.2,1.9,0,2.1c.2.2-.5,1.2.5,1.6.9.5,1.6.9,1.6.9,0,0,2.8.2,3-.2Z"/>
|
||||
<path class="cls-1" d="M16.6,649.1c0-.7-1.2-1.6-1.2-1.6l-.7-.7-.9-.9s-.2-1.2-.2-1.4-.7-.9-.7-.9c0,0-2.3.2-2.3.5s-.7.7-.7.7c0,0-.2.7-1.6.7s-2.8-.5-2.6,0c.2.5-.2.9-.2,1.6s-.5,1.9-.5,1.9v1.2s.2,1.2.7,1.4c.5.2,1.2.5,1.4.7.2.2,1.4.9,1.2,1.4-.2.5,2.3.2,2.3.2l.5-.5c.2-.2,1.9-1.2,1.9-1.2,0,0,0-.9.5-.9s3.3-.5,3.3-.5v-1.6Z"/>
|
||||
<polygon class="cls-1" points="12.9 643.4 12.9 643.4 12.9 643.4 12.9 643.4"/>
|
||||
<path class="cls-1" d="M27.7,639.9c.5.5,1.4,1.6,2.1,1.9.7.2,1.2.5,1.4,1.2.2.7.2,1.4.5,2.1.2.7,1.9.7,1.9,1.2s.5-.2,1.4,0c.9.2.2-.2,1.6,1.2,1.4,1.4,2.3,2.1,2.6,2.6.2.5.9,0,.9,0l1.2-.9s-.2-1.6,0-1.6.2-2.1.2-2.3-.5-2.3-.5-2.3c0,0-1.2-1.4-1.4-1.4s-2.1-.7-2.1-.7l-1.2-1.2-.9-1.2-1.4-.5h0l-3.7-.7h-2.1l-1.2,1.6s.2.7.7,1.2Z"/>
|
||||
<path class="cls-1" d="M32.6,663.4c.5.2,2.3.5,2.8.5s1.6-.2,1.9-.5c.2-.2.9-.2,1.6-.2s3.5.2,3.5.2c0,0,.5-.7.2-1.4-.2-.7-.9-1.4-.9-1.4l-.2-.7-.7-.5.7-1.2v-.9s-.7-.5-1.4-.5-1.4.2-1.4-.2-.9-1.9-.9-1.9l-1.4.7h0c-.9.5-1.9.7-2.1.9-.2.2-3.3.2-3.1.7.2.5.7,1.2.9,1.4.2.2.9,1.6.9,1.6,0,0-.5,1.6-.5,1.9s-.5,1.2,0,1.4Z"/>
|
||||
<path class="cls-1" d="M21.3,670.4c0-.2,0-1.4.5-1.6.5-.2.7-.5.7-.7s-.7-1.2-.7-1.4-1.2-1.2-1.2-1.2l-.5-1.2-.2-1.2-.2-1.9h0s-.9-1.9-1.2-1.9-1.4-.2-1.4,0-.5.9-.5.9v.7c0,.2-.2.7,0,1.2.2.5-.2,1.4,0,1.6.2.2.2.7.5,1.4.2.7.7,1.2.7,1.4s-.2,1.2-.2,1.2c0,0-.5-.7-.5.5s-1.9,1.9-.5,2.1c1.4.2,2.8.5,3,.5s1.6-.2,1.6-.5Z"/>
|
||||
<path class="cls-1" d="M27.4,673s-.5-.9,0-1.6c.3-.5.5-.9.7-1.2.2-.5.9-.5.9-.9s.5-2.3,0-2.8c-.5-.5-.9-1.6-1.4-2.3-.5-.7-.2-.9-1.2-1.6-.9-.7-1.9-1.2-1.9-1.2l-1.2.2h0s-.7,2.1-.7,2.3.2,2.3.7,2.6c.5.2,1.6,1.4,1.9,1.9.2.5.2,1.2.2,1.6s-.7,2.1-.9,2.1,0,0-1.2.5c-1.2.5-2.6.2-3,.9-.5.7-1.2,1.4-1.2,1.4v1.4c0,.2-.2.7.5.7s2.3-.2,2.8-.5c.5-.2,1.4-.7,1.4-.7l2.3-2.1,1.2-.7Z"/>
|
||||
<path class="cls-1" d="M63.7,683.1c-.2-.5-1.4-2.1-1.4-2.1l-.5-.9s0-1.6-.9-1.9c-.9-.2-3-.2-3-.2l-1.6-2.3s-1.4-2.6-1.6-2.6-1.4,0-2.1-.2c-.7-.2-2.6-1.2-2.6-1.2l-.9.7c.2.7,1.6,2.8,1.6,2.8l1.2,2.3-.5,1.9s-1.9.5-2.3.5h-3s-.5-.7-.7.7c-.2,1.4-2.6,2.6-2.6,2.6h-3s-.9,1.6-.9,2.1-6.1,3.1-6.1,3.1l-1.9,2.6-1.9.5s-.5.7-.5.9-1.2,1.6-1.2,1.6h-.7s-2.3.5-2.3.9.5,1.6.5,2.1v1.6s0,1.6.2,1.6,1.4.7,1.4.7l.7,1.2s.5.2.5.5.7,1.2.7,1.2l1.2,1.2s-.5,1.6,0,2.1c.5.5.9.5,1.4.7.5.2,4.2.7,4.2.7,0,0,1.9.2,2.1.5.2.2,1.4.5,2.1,0,.7-.5,7-1.6,7-1.6,0,0-.7-.9,0-1.2.7-.2,1.9-.5,3-1.4,1.2-.9,3.7-1.2,3.7-1.2,0,0-.5-1.2.2-1.6.7-.5,2.6-2.1,2.8-2.1s2.1,1.4,2.1,1.4c0,0-.7.7.5.7s1.4-.5,1.9-2.1c.5-1.6,1.9-2.3,1.9-2.3l.5-.7s-.5-.5,0-1.6c.5-1.2.9-2.6.9-2.6v-3.5s-.5,0,.5-.5c.9-.5,2.1-2.3,1.4-3.1-.7-.7-1.6-1.9-1.9-2.3Z"/>
|
||||
<polygon class="cls-1" points="49 672.3 49 672.3 49 672.3 49 672.3"/>
|
||||
<path class="cls-1" d="M93.5,737.5c-2.3-1.2-4.2-2.3-4.2-2.3h-1.9l-1.2,3.5s1.4,0,1.2.9c-.2.9-1.6.5-1.2,1.6.5,1.2-.5.7,1.6,1.6,2.1.9,2.8,1.9,3.7.9.9-.9,1.9-2.6,1.9-2.6h0l.7-1.2s1.6-1.4-.7-2.6Z"/>
|
||||
<path class="cls-1" d="M86.2,745l-2.8-1.9s-2.8,2.6-2.8,3.1-2.1,3.3-1.6,4,1.2,1.6,2.8,1.6,3.3-1.6,5.4-2.6c2.1-.9,2.8-2.3,3.7-1.9.9.5,2.1-.5,2.1-.5h0l-1.9-1.2-4.9-.7Z"/>
|
||||
<path class="cls-1" d="M101.7,742h0l-3.5,1.2s-.9,1.2-.9,1.6.5,2.6.5,2.6c0,0-.5.5-.5,1.6v2.3s1.2,3.1,2.1,3.5c.9.5,2.6-.5,3.1-1.9.5-1.4-.9-5.6-.9-5.6,0,0-2.8-1.2-2.1-1.4.7-.2,2.8-.5,3.1-.5s.9-.7.9-.7l-.7-2.8h-.9Z"/>
|
||||
<path class="cls-1" d="M115.1,720.4l-1.2-1.6-.5-1.6h0v-2.6l-2.1-3.3s-1.6-1.2-1.9-1.6c-.2-.5-3-2.3-3-2.1s-2.3,2.3-2.3,2.6-3.7,2.8-3.7,2.8c0,0,1.2,4,1.2,4.2s-1.9.2-.5,1.9c1.4,1.6,5.9,2.1,5.9,2.1,0,0,.2-1.4.5.5.2,1.9-.5,2.8-.5,3.1s1.2,1.2,2.6,1.2,3.3-.2,3.5,0c.2.2,3.5.5,3.5.5,0,0,.2,0,0-2.1-.2-2.1-1.4-3.8-1.4-3.8Z"/>
|
||||
<path class="cls-1" d="M125.6,711.9c.5,0,1.4-1.9,1.4-1.9,0,0-.5-.7.9-.5,1.4.2.9,0,1.6.5.7.5,1.2.5,1.4.5s1.2-.7.5-1.4c-.7-.7-1.4-.9-1.9-1.6-.5-.7-.5-2.6-.5-2.6,0,0-.5-1.4-.7-1.4h-2.8l-.9.9h0c-.7,0-3.5-.7-3.5-.7l-.5,2.8-2.1,1.4s-.9.5-.5,1.2c.5.7.9,1.2.7,1.6-.2.5-1.6,0-1.4.7.2.7,1.6,1.9,1.6,1.9,0,0-.7,1.2-.7,1.6s.9,1.4,1.4,1.4,1.9-2.1,1.9-2.1c0,0,.5-.9.9-1.2.5-.2,2.1-1.2,2.1-1.2h.9Z"/>
|
||||
<path class="cls-1" d="M141.5,712.4c0-.2-.9-.5-1.2-.7-.2-.2-1.6-.7-1.6-.7l-3-.9h-1.7s-.7,2.1-.7,2.3-.5,1.2,0,1.4c.5.2,2.1.7,2.1.7v1.2c0,.5-.7.7.5,1.2,1.2.5,4.2-.5,4.2-.5h2.6s.9-1.4.5-1.9c-.5-.5-1.6-1.9-1.6-2.1Z"/>
|
||||
<path class="cls-1" d="M128.6,725.1s.2-.2.5,0c.2.2,1.4-.5,1.4-.5,0,0-.2-.5.5-.5s1.9.5,1.9.5c0,0,.7-.2.9-.7.2-.5-.2-.9,0-1.4.2-.5,0-1.6,0-1.6l-.7-1.6s-.9-.2-1.4-.2-1.2-.2-1.2-.2l-.5-.2-.9-.7h0s-2.3-.2-2.6.5c-.2.7-.7,1.6-.9,1.9-.2.2-1.9.9-1.9.9l1.4,1.4s.2.7,1.2,1.2c.9.5,2.3,1.4,2.3,1.4Z"/>
|
||||
<path class="cls-1" d="M121.1,719.9c-.3-.3-.7-.5-1.2-.5h0c-.6,0-1.1.6-1.2,1.2,0,.4.2.8.5,1.2.1.2.3.5.7.7.5.3,1.4.6,1.6.2.2-.2,0-.5-.2-1.6,0-.7,0-.9-.2-1.2Z"/>
|
||||
<path class="cls-1" d="M137.3,747.6c-.9-.5-1.9-.9-1.9-.9l-.5-1.2.9-1.2.2-2.3-4.2-.5-2.1.5h0s-1.2,2.1-1.4,2.6c-.2.5-2.1,1.9-2.1,2.1s0,.7-.2,1.4c-.2.7-.9,1.9,0,2.3.9.5,2.1.7,2.1.7,0,0,2.6-1.4,2.8-.7.2.7.2,1.2,1.2,1.9.9.7,2.1.9,2.3.9s.2-1.2.9-1.4c.7-.2,2.6-1.9,2.6-1.9,0,0,.2-1.9-.7-2.3Z"/>
|
||||
<path class="cls-1" d="M267.1,679.6s.5-.5,0-1.6c-.5-1.2-.7-2.1-.7-2.1l-.7-1.2-.5-1.4s-.5-.5-.2-1.2c.2-.7,0-2.6,0-2.6l-.2-.7.7-.9h0c.2-.2.5-2.1.5-2.1l-3.3-2.3s-1.4.9-1.2,1.9c.2.9.9,2.1.9,2.6s.2,1.6,0,2.1c-.2.5-.9,1.2-.9,1.4s-.7,1.4-.9,1.9c-.2.5-2.8,1.9-2.8,1.9,0,0-1.9,1.9-1.9,2.1s-1.2.2-.7,1.6c.5,1.4.5,3.3.5,3.3,0,0-1.2.9-.5,1.6.7.7,1.4,1.6,2.8,2.1,1.4.5,4.2,1.6,4.2,1.6l3.1.5s2.3-.9,1.9-1.4c-.5-.5-1.6-1.4-1.6-1.4l-.5-1.2s0-1.2.5-1.9,1.6-2.6,1.6-2.6Z"/>
|
||||
<polygon class="cls-1" points="279.4 600.4 279.4 586.1 272 579.9 262.7 571.1 261.3 561.5 254.5 559.9 251.7 557.3 244.7 562.9 243.5 566.9 235.1 563.3 234.4 553 235.1 535.7 240.9 533.6 245.9 532.1 247.1 523.8 256.9 510.3 248.3 507 239.9 515.4 232.7 509.4 238.7 493.8 231.6 486.6 229.2 475.8 217.2 472.2 206.4 484.2 205.2 493.8 195.7 486.6 186.1 495 186.1 502.2 176.5 510.6 159.8 515.4 157.4 523.8 140.6 521.4 127.4 517.8 124.5 512.7 119.4 508.3 115.3 512.5 110.2 512.4 96.4 517.8 89.3 530 84.4 535 85.6 538.3 88.3 540.1 87.2 541.1 82.3 539.9 76.8 551.3 72.3 553.6 67.3 564.8 76.6 566.5 73.6 571.4 75.3 574.4 80.6 583.9 85.4 585.9 85.4 589.7 80 596 78.4 589.4 69.9 588.5 68.8 590 71.3 593.4 75.4 595.9 74.3 598.4 69.7 600 68.7 603.3 63 605.4 61.9 611.5 67.8 615.5 70.4 613.1 73.2 605.9 74.3 613.6 75.3 626.5 69.7 634.5 69.7 639.2 68.1 643.4 67.8 644.3 80.4 650.4 92.7 661.4 89.3 661.9 86.5 659.8 85.6 664 79 654.2 69.4 650 67.8 656.3 70.6 661.9 74.3 663.3 77.1 670.4 72.7 669.9 66.1 661.5 62.9 648.1 58.5 642.1 51.9 654.2 55.1 668.3 59.6 674.6 61.9 673.9 65.8 676.6 67.1 680.5 69.9 680.2 72.7 677.9 79 686.6 77.7 698.2 82.8 699.7 79.7 706.7 76.6 709.9 77.4 712.1 82.5 712.8 82.7 721.2 93.1 719.9 97.3 713.3 97.1 709.8 112.1 701.6 110.7 695.9 117.2 694.3 120.8 688.2 120.2 673.4 122.8 671.1 124.7 675.1 124.5 684.5 122.4 694.3 125.7 699.9 130.4 702.1 134.8 704.2 136.9 700.4 143.5 702.3 145.8 697.6 149.1 698.3 148.3 688.6 152.1 687 152.9 684.2 151.7 682 155 673 162 671.1 167.4 666.2 174.9 662.4 179.6 664 183.8 662.6 187.1 655.8 192.4 654.7 194.6 657.2 202.1 657.2 202.7 663.8 200.6 669.2 196 669.8 194.8 663.8 189.6 664 187.5 671.6 189.1 675.6 185.9 681.9 181.9 681.2 183.1 676 181.4 674.3 176 692.2 189.2 694.5 191.7 701.4 195.5 706.3 203.9 704.4 207.4 697.8 213.3 694.1 214.2 689.9 209.3 687.1 210 684 218 684.7 221 686.6 224.2 683.9 222.7 674.6 209.2 661.4 209.5 657 212.8 653.7 210.5 650.9 215.4 646.2 211.9 643.7 213.5 642.5 216.5 642.5 222 642.5 227.6 640.4 228.1 635.9 230.9 638 231.2 641.7 231.8 647.4 236.2 650.7 238.4 657 234.6 663.8 232.6 672.3 234.9 676.9 238.7 676.9 243.5 679.8 244.5 675.1 243.3 671.1 245.9 662.9 249.9 659.4 255 664.1 261.6 661 262.3 655.8 265.1 651.9 267 645.5 264.6 642 261.1 642.5 257.9 642 248 646 246.3 642 239.9 634.6 244.2 626.8 246.3 631 251.6 632.8 262.5 623.5 278.8 628.6 285.4 617.2 285.4 607.6 279.4 600.4"/>
|
||||
</g>
|
||||
<g id="nakdong" data-label-shift="dx,dy">
|
||||
<path class="cls-1" d="M405.4,649.3l-2.1-.2-1.6,1.2-.9,1.6-1.2.2-.9-.5v-1.2l.2-.9,1.4-.9.9-.7v-.9l.9-.9.7-1.2-.2-1.6-.2-1.4.5-3v-1.9l-1.6-1.6-.9-.9.2-1.9.7-2.8h0c0,0,1.6-.5,1.6-.5,0,0,1.2-.9,1.2-1.2s.2-.7.2-.7l-.2-.9-1.4-.9-1.9-.7-1.6.2-1.2.5-.9,1.2-.7,1.2-.2,1.2.5,1.9v.9l-.5.7-.7.2-1.2.2-.9.5-.5.5-.2,1.2-.2.5h-1.4l-1.4.5s-.9.2-1.2.2-.7.7-.7.7l-1.2.5h-1.4c-.2,0-.7.2-.7.2l-.5.5v.5l.2.7s.7.7.9.7,0,.7,0,.7l.2.9v.7l.2.9.5.5.7.5s.5.5.7.5.2.7.2.7c0,0,.5.7.5.9v2.1h-.2s-.7-.2-.9-.2-.5-.5-.5-.5l-.9-.7h-.9l-.9-.5-.5-.7-.7-1.2-.7-.5-.5-.2-.5.2-.7.7-.7.2h-.9l-1.4-.9-1.4-.9-1.4-.7h-1.2l-.5.2-.7.9-.5.7-1.2.7s-.2,0-.5.2c-.2.2-.7.5-.7.5l-.5.7-.7,1.2-.5,1.2-.9.9v3.3l1.2,1.4s.7,1.4.7,1.6.2,1.4.2,1.4l.7,1.2.7,1.6,1.6.2,1.4-.9.7-1.2.7-.7h2.6l1.4-1.2.9-1.6.7-.9.7-.5.5.5.5.7v2.6s.5.5.7.5,0,.7,0,.7l-.7,1.2-1.2,1.9-.5.7-.2.5-.2.5-.9.5-1.2.2-1.4.2-.7.5-.5.5-.2.7,1.4.5.5.5v.7l.5.5.7.2h1.2l2.1.2.7.5.2.7-.2.5-.7.5s-.9.7-1.2.7-.5.9-.5.9l-.2.7.2.9v.7l.9.2.9.7,1.2.2v.9l-.2.2-.9.5-1.4.5-.7.2-.5.7v.9l.5.7s.5.5.7.5,1.4.2,1.4.2c0,0,1.4.2,1.6.2s.9-.5.9-.5l1.2-.5,1.2-.7.5-.7v-.7l.2-1.2s.5-.9.5-1.2.9-.5.9-.5l1.4-.2.2-.7-.9-.9-.7-1.4.5-1.6v-1.2l.7-.7,1.6-.2,1.6-.2.7-.9.2-1.2v-2.1l.7-.7,1.9.2,1.6-.2.5,2.1,1.2,1.4,2.1.9,1.6-.7.2-1.2-.2-1.2-1.6-1.2-.7-1.4.2-1.2-1.2-.7-.9-.9.5-1.4h1.9c.2,0,.7-.5.7-.5l.7-.9v-1.6h.9c.2,0,.7-.5.7-.5l.2-1.4s.2-.5.7-.7c.5-.2,0-1.4,0-1.4v-1.4Z"/>
|
||||
<path class="cls-1" d="M330.3,650.8v-1.2l-.9-.5h0s-4.2-1.2-4.2-.9-2.8,0-2.8,0l-1.4.9s-.2.7-.2.9.2,1.2.2,1.2l.5.2.9.7,2.8.5h1.9l.9-.7.9-.7.9-.2.5-.2Z"/>
|
||||
<polygon class="cls-1" points="333.8 654.8 332.6 654.1 332.2 652.9 331.7 652.7 331 652.9 329.8 653.9 329.6 654.8 329.1 656 329.1 657.6 329.4 659 329.8 659.7 330.8 659.7 331.9 659.5 332.4 659 333.8 659 335 658.8 335.2 657.8 335.2 656.9 334.7 655.7 333.8 654.8"/>
|
||||
<polygon class="cls-1" points="308 649.2 307.6 648.4 307.6 647.5 308 646.3 308.7 645.2 308.7 644.2 308.3 644 307.3 643.5 306.4 642.8 305.5 641.9 304.7 641.2 303.1 641.4 302.2 642.8 302.2 644.7 301.2 645.2 300.8 644.2 300.5 642.6 301 641.4 301.7 639.8 302.4 638.4 303.6 637.2 303.6 636.5 303.3 635.8 302.6 635.8 301 636 299.8 637 298.4 638.1 298.2 639.5 297.3 640 295.6 640.9 294.7 642.4 293.5 643.5 293.3 644.9 293.3 645.9 293.5 647 294.2 648.2 295.4 648.4 297 649.2 299.4 649.2 301.2 648.7 303.1 649.2 304.1 649.9 306.2 651 307.8 652 308.3 651.7 309.4 651.7 309.7 651 309.2 650.3 308 649.2"/>
|
||||
<path class="cls-1" d="M305.2,653.4l-1.2-.5-.9-.7-.7-.2h-2.1l-1.6-.2-.9-.7h-1.6l-1.2,1.2-1.6,1.2-.9.7v.7l-1.4-.2-.5-1.2-.9-1.4-.2-.7-.5-.9-1.2-.5-1.2-.5-.5-.5s-.2-.5-.2-.7-.2-1.2-.2-1.2v-.5c0-.2-.7-.7-.7-.7l-.2-.7-.5-1.2-.2-1.4.7-.9.2-.9,1.6-.2.7-.5.5-.2.2-.7.2-1.2.5-.5.7-.9v-.7l-.2-1.2-.5-1.4.2-1.4-2.1-1.4h-3.1l-1.9.2-1.4,1.2-.9,1.4-.5,1.2-.5,1.4v.7l-1.6.5-.9.5-.7.9s.2.5,0,.7c-.2.2-1.2.9-1.2.9v1.4l-.5,1.2-.7.5-.9.5-.2.9v1.4l.2,1.2-.2,1.4.5,1.6.5,1.9,1.2,1.9h0v1.6l.2,1.4.7.9.9.7.2.7-.2.7-.9.9-.9.7-.5.7-.2.7,1.2.7.7.5,1.4.7v.7l.2,1.2.5.9.9.5.9-.2h1.9l1.2-.2.9-.5.9-.9v-1.4l-.5-.9-.2-1.4.2-.7.7-.5,1.9-.2,1.2-.9h2.3l.5.9v.7s-.5.7-.5.9-.2,1.2-.2,1.2l-.5,1.4v.5l-.2.9.2.5.2.5.2,1.2v1.2l.5.9,2.1.2,2.3.7,1.6-.2,1.2.2.9-.7s.5.5.7.5.5.9.5.9l1.6.7,1.6.2h.7l.2-1.2-.2-1.4-.7-.7-.2-.9v-1.2l.5-.5.9-.9.7-.2.5-.5v-2.3s-.5-2.1-.5-2.3v-.9l.2-1.2.5-1.4s-.2-.9,0-.9.7-.7.7-.7l.7-.5.2-.9-.2-.9-1.2-.5Z"/>
|
||||
<polygon class="cls-1" points="533.7 451.9 529.9 457.3 516.8 465.7 509.4 457.5 516.6 447.7 513.8 417.3 513.1 408.8 521.3 392.4 522.9 355.1 523.6 353.3 531.1 333.9 526.2 315.4 526.2 282.1 519.8 263.8 504.8 272.7 495 281.2 482.8 272 481.1 259.2 471.4 254.5 473.3 244.6 468.7 245 455.3 248.2 454.9 259.5 454.7 274.8 451.4 277.9 438.9 269.7 434.5 277.6 421.1 273 410.9 275.3 403.3 283.3 392.8 288.8 386.2 300.5 389 306.9 377.6 314.7 353.5 310.3 345.4 307.2 340.7 310.3 334.5 310.7 330 319.5 334.6 326 329.8 328.1 325 323.7 307.5 329.5 314.2 336 312.9 341.5 306.5 336.4 294.4 343.5 303.6 349.6 308.1 357.5 304 362.7 314.1 371.6 316.5 383.6 314.1 388.4 326.1 392 323.3 402.6 325.2 414.4 315.5 413.8 315 423.6 307.5 439.1 298 443 298.5 447.6 301.2 454.4 296.8 462.5 286.2 472.3 276.7 473.4 269.4 480.7 267.1 483.1 264.5 485.8 256.9 505.2 256.9 510.3 247.1 523.8 245.9 532.1 240.9 533.6 235.1 535.7 234.4 553 235.1 563.3 243.5 566.9 244.7 562.9 251.7 557.3 254.5 559.9 261.3 561.5 262.7 571.1 272 579.9 279.4 586.1 279.4 600.4 285.4 607.6 285.4 617.2 278.8 628.6 282.6 628.4 288.8 622.6 289.3 620.3 291.9 621.5 292.3 624.3 296.3 623 298.7 624.3 301.6 622.6 298.9 615.9 301.2 614.9 303.4 615.5 304.7 611.2 309.9 609.7 307.1 614.2 306.9 625.2 305.5 632.3 314.8 637.2 317 641.5 318.3 642.1 322.4 640.3 325.1 641.7 326.8 641.4 329.4 634.9 335.5 635.5 338.5 640.5 342.8 638.4 346.2 633 347.4 636.3 348.6 639.8 343.1 642.3 344.4 645.9 349.4 647.4 351.4 645.9 353.5 647.7 353.3 655.5 347.7 654.1 346.2 655.7 351 659.7 353.7 666.6 356.3 667.8 358.7 665.9 359.9 659.7 358.5 655.6 361.6 654.2 365.6 646.5 363.1 643.5 360.7 647.8 358.5 646.8 361.3 632.3 361.1 630.7 361 629.5 368.3 628 371.4 624.3 365.9 619.1 357.2 620.8 355.4 623.6 351.9 624.1 354.8 618.5 361.5 616.3 367.3 614.4 366.1 610.6 379 609.8 381.7 611.6 383.5 619.4 389.9 616.8 383.5 596.4 387.2 591.5 388.9 592.4 387.7 599.2 390.1 604.4 394.7 605 398 608.8 399.5 604.8 401.5 606.5 400.5 612.2 406.2 614.7 414 613.3 414.9 615.6 420.1 616.2 424.6 617.3 428.8 614.1 432.5 616.6 438.5 610.1 436.6 622.3 438 626.7 441.3 625.8 442.5 620.6 445.7 622.8 453.5 612.9 457 616.4 461.6 616.6 461.7 613.8 459.8 610.5 463.1 606.6 469.9 608.2 480.9 594.4 480.7 591.3 485.5 581.8 491 579.8 494.6 576.1 498.5 573.7 497.1 571.8 499.6 567.6 499.9 561.3 498 558.2 504.1 554 504 546.1 505.5 548.8 506.9 554.5 511.6 551.2 514.6 544.4 514.4 537.4 515.8 532.7 513.9 528 514 525.4 524.7 493.4 527.1 486.2 527.8 477.8 535.1 466.5 538 455.6 533.7 451.9"/>
|
||||
</g>
|
||||
<g id="geum" data-label-shift="dx,dy">
|
||||
<path class="cls-1" d="M298,443l9.5-3.9,7.5-15.6.5-9.8,9.7.6-1.9-11.8,2.8-10.6-12-3.6,2.4-4.8-2.4-12-10.1-8.9-12.6-.6-8.4-10.8-16.3-1.1-7.6-19.2,17.5-7.4,2.3-2.4v-1.1c-.1,0,.4-1.3.4-1.3l-1.6-1.1.5-9.5,1.4-12.2-3.8-13-13.2-9.6-4.9-10-7.1-1.9-11.7,17.8-8.2,1.7-3,5.2-4.6,6.5-19.7,1.1-13.8-5.9-3.6.6-3.6,5.4h-1.2l-4.8-6-6.4-3.9-5-.2-9.1-18.5-5.4,3-2.4-5.7-11.4-2.8-11.7-9.2h-3.9c0,.1-3.4,4.8-3.4,4.8l1,6.2,2.1,5.4-1.2.8-4.4-7.5-6.7-3.2-6.3-.3-5.2,3.3,5.9,3.4-3.6,2.2,5.3,4.4,2.5.8.4,3-6.5,6.1-8.7,11.2-4-1.9,6.4-13.5-1.6-1.9,1.1-7.9-2.1-3-4.7,14.5-3,1.8-3.8-5.7-4.4,2.7.5,8.4-1.5,1.7-3.3-.8-4.2,3.2-5.1,13.8.5,1.5,3.9-.2.2-6.5,5.6,2.5,2.8,5.3-7.4,2.4v3c0,0,5.9,1.2,5.9,1.2l4.3-1.5,2.1-3.3,4-.3-1.4,6,4.1,3.7-2.4,9.4,4.3,6.1,1.1,27,11.6,2.1-6.6-26.7,2.3-4.1-6.3-4.9,1.7-1.9,1-6.9,2-1.5,2.2,9,4.4,3.2,3.1-1.9,3.1-6.1,1.8,1.5-1.9,8.6,2,14.4,1.9,13.7-2.8,6.5,8.2,7.8v2.1l-6.9,2.9,2.9,21.8-1.6,1.9-5.9,6.7,1.3,2.7,3.3-2.7,8.2,2.8,6.2,7.7-1.2,2.8,5.1,13.1,5.6,3.1-19.1.5-1.8,3.3,6.4,3.1-.6,10.7,7.3,2.8,3-3.3,8.9,1.9,9.4-3.4.3,1.4.2.9-3.1,5.4-5.1-.9-9.4,3.5,6.8,6.4,4.3,1.4-.2,5.6-20.6-5.8-6.4,13.7-18.1,10.4-1.9,6.6,5.9,4.7h19.9s3.8,4.2,3.8,4.2l-.5,3.4,3,5.1,13.2,3.6,16.8,2.4,2.4-8.4,16.8-4.8,9.6-8.4v-7.2l9.6-8.4,9.6,7.2,1.2-9.6,10.8-12,12,3.6,2.4,10.8,7.2,7.2-6,15.6,7.2,6,8.4-8.4,8.6,3.3v-5.1s7.6-19.4,7.6-19.4l12.2-12.4,9.6-1.1,10.5-9.8,4.5-8.1-2.7-6.8-.6-4.6Z"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 219 KiB |
@@ -0,0 +1 @@
|
||||
export { BoardApi } from "../api/board-service";
|
||||
@@ -0,0 +1,60 @@
|
||||
import { client } from "@/shared/api";
|
||||
import { ENDPOINT } from "@/shared/config";
|
||||
import type {
|
||||
Board,
|
||||
BoardFormData,
|
||||
BoardList,
|
||||
BoardParams,
|
||||
BoardPopupList,
|
||||
BoardPopupParams,
|
||||
BoardService,
|
||||
} from "../model/board-interface";
|
||||
|
||||
export class BoardApiService implements BoardService {
|
||||
public async getBoardList(params?: BoardParams): Promise<BoardList> {
|
||||
const response = await client.get<BoardList>(
|
||||
`${ENDPOINT.BOARD_SERVICE.BBS}`,
|
||||
{ params },
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async getBoardPopupList(
|
||||
params: BoardPopupParams,
|
||||
): Promise<BoardPopupList> {
|
||||
const response = await client.get<BoardPopupList>(
|
||||
`${ENDPOINT.BOARD_SERVICE.BBS}`,
|
||||
{ params },
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async getBoardInfo(bbsId: string): Promise<Board> {
|
||||
const response = await client.get<Board>(
|
||||
`${ENDPOINT.BOARD_SERVICE.BBS}/${bbsId}`,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async createBoard(data: BoardFormData): Promise<Board> {
|
||||
const response = await client.post<Board>(
|
||||
`${ENDPOINT.BOARD_SERVICE.BBS}`,
|
||||
data,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async updateBoard(bbsId: string, data: BoardFormData): Promise<Board> {
|
||||
const response = await client.put<Board>(
|
||||
`${ENDPOINT.BOARD_SERVICE.BBS}/${bbsId}`,
|
||||
data,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async deleteBoard(bbsId: string): Promise<void> {
|
||||
await client.delete(`${ENDPOINT.BOARD_SERVICE.BBS}/${bbsId}`);
|
||||
}
|
||||
}
|
||||
|
||||
export const BoardApi = new BoardApiService();
|
||||
@@ -0,0 +1,17 @@
|
||||
import { client } from "@/shared/api";
|
||||
import { ENDPOINT } from "@/shared/config";
|
||||
import type {
|
||||
BoardTemplate,
|
||||
BoardTemplateService,
|
||||
} from "../model/board-template-interface";
|
||||
|
||||
export class BoardTemplateApiService implements BoardTemplateService {
|
||||
public async getBoardTemplate(bbsTypeCd: string): Promise<BoardTemplate> {
|
||||
const response = await client.get<BoardTemplate>(
|
||||
`${ENDPOINT.BOARD_SERVICE.BBS_TEMPLATES}/${bbsTypeCd}`,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
}
|
||||
|
||||
export const BoardTemplateApi = new BoardTemplateApiService();
|
||||
@@ -0,0 +1,11 @@
|
||||
export { BoardApi } from "./api/board-service";
|
||||
export {
|
||||
boardFormSchema,
|
||||
BOARD_POSTING_CODE,
|
||||
type Board,
|
||||
type BoardFormData,
|
||||
type BoardParams,
|
||||
type BoardPopup,
|
||||
type BoardPostingCode,
|
||||
} from "./model/board-interface";
|
||||
export { BoardTemplateApi } from "./api/board-template-service";
|
||||
@@ -0,0 +1,99 @@
|
||||
import { z } from "zod";
|
||||
import type { PageableList, PageableParams } from "@/shared/model";
|
||||
import type { BbsType } from "@/shared/store";
|
||||
|
||||
export const BOARD_POSTING_CODE = {
|
||||
팝업게시: "01",
|
||||
상단게시: "02",
|
||||
기간게시: "03",
|
||||
} as const;
|
||||
|
||||
export type BoardPostingCode =
|
||||
(typeof BOARD_POSTING_CODE)[keyof typeof BOARD_POSTING_CODE];
|
||||
|
||||
export interface BoardParams extends PageableParams {
|
||||
keywordType?: string;
|
||||
keyword?: string;
|
||||
bbsId?: number;
|
||||
bbsTypeCd?: string;
|
||||
bbsNm?: string;
|
||||
bbsExpln?: string;
|
||||
rfrncUseYn?: string;
|
||||
atflUseYn?: string;
|
||||
atflMaxCnt?: number;
|
||||
atflMaxFileSz?: number;
|
||||
ansUseYn?: string;
|
||||
cmntUseYn?: string;
|
||||
dgstfnEvlUseYn?: string;
|
||||
smsUseYn?: string;
|
||||
upndFixUseYn?: string;
|
||||
pstgPrdUseYn?: string;
|
||||
popupUseYn?: string;
|
||||
delYn?: string;
|
||||
}
|
||||
|
||||
export interface BoardPopupParams extends PageableParams {
|
||||
bbsNm?: string;
|
||||
}
|
||||
|
||||
export interface Board {
|
||||
bbsId: number;
|
||||
bbsTypeCd: BbsType;
|
||||
bbsTypeNm: string;
|
||||
bbsNm: string;
|
||||
bbsExpln: string;
|
||||
rfrncUseYn: string;
|
||||
atflUseYn: string;
|
||||
atflMaxCnt: number;
|
||||
atflMaxFileSz: number;
|
||||
ansUseYn: string;
|
||||
ansUseAuthrt: string;
|
||||
cmntUseYn: string;
|
||||
dgstfnEvlUseYn: string;
|
||||
smsUseYn: string;
|
||||
upndFixUseYn: string;
|
||||
pstgPrdUseYn: string;
|
||||
popupUseYn: string;
|
||||
delYn: string;
|
||||
useYn: string;
|
||||
prvcIndctYn: string;
|
||||
mdfcnDt: string;
|
||||
mdfrNm: string;
|
||||
}
|
||||
|
||||
export interface BoardPopup extends Board {
|
||||
pstCnt: number;
|
||||
}
|
||||
|
||||
export const boardFormSchema = z.object({
|
||||
bbsTypeCd: z.string(),
|
||||
bbsNm: z.string(),
|
||||
bbsExpln: z.string(),
|
||||
rfrncUseYn: z.string(),
|
||||
atflUseYn: z.string(),
|
||||
atflMaxCnt: z.number().nullish(),
|
||||
atflMaxFileSz: z.number().nullish(),
|
||||
ansUseYn: z.string(),
|
||||
ansUseAuthrt: z.string().nullish(),
|
||||
cmntUseYn: z.string(),
|
||||
dgstfnEvlUseYn: z.string(),
|
||||
smsUseYn: z.string(),
|
||||
upndFixUseYn: z.string(),
|
||||
pstgPrdUseYn: z.string(),
|
||||
popupUseYn: z.string(),
|
||||
useYn: z.string(),
|
||||
prvcIndctYn: z.string(),
|
||||
});
|
||||
|
||||
export type BoardList = PageableList<Board>;
|
||||
export type BoardPopupList = PageableList<BoardPopup>;
|
||||
export type BoardFormData = z.infer<typeof boardFormSchema>;
|
||||
|
||||
export interface BoardService {
|
||||
getBoardList: (params: BoardParams) => Promise<BoardList>;
|
||||
getBoardPopupList: (params: BoardPopupParams) => Promise<BoardPopupList>;
|
||||
getBoardInfo: (bbsId: string) => Promise<Board>;
|
||||
createBoard: (data: BoardFormData) => Promise<Board>;
|
||||
updateBoard: (bbsId: string, data: BoardFormData) => Promise<Board>;
|
||||
deleteBoard: (bbsId: string) => Promise<void>;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
export interface BoardTemplate {
|
||||
bbsTypeCd: string;
|
||||
rfrncUseYn: string;
|
||||
atflUseYn: string;
|
||||
atflMaxCnt: number;
|
||||
atflMaxFileSz: number;
|
||||
ansUseYn: string;
|
||||
cmntUseYn: string;
|
||||
dgstfnEvlUseYn: string;
|
||||
smsUseYn: string;
|
||||
upndFixUseYn: string;
|
||||
pstgPrdUseYn: string;
|
||||
popupUseYn: string;
|
||||
regDt: string;
|
||||
rgtr: string;
|
||||
mdfcnDt: string;
|
||||
mdfr: string;
|
||||
rgtrNm: string;
|
||||
mdfrNm: string;
|
||||
}
|
||||
|
||||
export interface BoardTemplateService {
|
||||
getBoardTemplate: (bbsTypeCd: string) => Promise<BoardTemplate>;
|
||||
}
|
||||
@@ -0,0 +1,97 @@
|
||||
import { client } from "@/shared/api";
|
||||
import { ENDPOINT } from "@/shared/config";
|
||||
import {
|
||||
postFormSchema,
|
||||
postUpdateFormSchema,
|
||||
type Post,
|
||||
type MovePost,
|
||||
type DeletePost,
|
||||
type PostInfo,
|
||||
type PostList,
|
||||
type MyPostList,
|
||||
type PostParams,
|
||||
type MyPostParams,
|
||||
type PostFormData,
|
||||
type PostUpdateFormData,
|
||||
type PostService,
|
||||
} from "../model/post-interface";
|
||||
|
||||
export class PostApiService implements PostService {
|
||||
public async getPostList(
|
||||
bbsId: number,
|
||||
params: PostParams,
|
||||
): Promise<PostList> {
|
||||
const response = await client.get<PostList>(
|
||||
`${ENDPOINT.BOARD_SERVICE.POSTS}/${bbsId}`,
|
||||
{ params },
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async getMyPostList(
|
||||
params?: MyPostParams,
|
||||
): Promise<MyPostList> {
|
||||
const response = await client.get<MyPostList>(
|
||||
`${ENDPOINT.BOARD_SERVICE.POSTS}/mypost`,
|
||||
{ params },
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async getPostInfo(bbsId: number, pstNo: number): Promise<PostInfo> {
|
||||
const response = await client.get<PostInfo>(
|
||||
`${ENDPOINT.BOARD_SERVICE.POSTS}/${bbsId}/${pstNo}`,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async createPost(data: PostFormData): Promise<Post> {
|
||||
const validatedData = postFormSchema.parse(data);
|
||||
const response = await client.post<Post>(
|
||||
`${ENDPOINT.BOARD_SERVICE.POSTS}`,
|
||||
validatedData,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async updatePost(
|
||||
bbsId: number,
|
||||
pstNo: number,
|
||||
data: PostUpdateFormData,
|
||||
): Promise<Post> {
|
||||
const validatedData = postUpdateFormSchema.parse(data);
|
||||
const response = await client.put<Post>(
|
||||
`${ENDPOINT.BOARD_SERVICE.POSTS}/${bbsId}/${pstNo}`,
|
||||
validatedData,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
|
||||
public async deletePost(
|
||||
bbsId: number,
|
||||
pstNo: number,
|
||||
delRsn?: string,
|
||||
): Promise<void> {
|
||||
await client.delete(`${ENDPOINT.BOARD_SERVICE.POSTS}/${bbsId}/${pstNo}`, {
|
||||
params: { delRsn },
|
||||
});
|
||||
}
|
||||
|
||||
public async softDeletePost(data: DeletePost[]): Promise<void> {
|
||||
await client.post(`${ENDPOINT.BOARD_SERVICE.POSTS}/softDeleteSels`, data);
|
||||
}
|
||||
|
||||
public async hardDeletePost(data: DeletePost[]): Promise<void> {
|
||||
await client.post(`${ENDPOINT.BOARD_SERVICE.POSTS}/hardDeleteSels`, data);
|
||||
}
|
||||
|
||||
public async movePost(data: MovePost[]): Promise<void> {
|
||||
await client.post(`${ENDPOINT.BOARD_SERVICE.POSTS}/movePstByBbsId`, data);
|
||||
}
|
||||
|
||||
public async restorePost(data: DeletePost[]): Promise<void> {
|
||||
await client.post(`${ENDPOINT.BOARD_SERVICE.POSTS}/restoreSels`, data);
|
||||
}
|
||||
}
|
||||
|
||||
export const PostApi = new PostApiService();
|
||||
@@ -0,0 +1,17 @@
|
||||
export { PostApi } from "./api/post-service";
|
||||
export {
|
||||
postFormSchema,
|
||||
postUpdateFormSchema,
|
||||
type Post,
|
||||
type MyPost,
|
||||
type MovePost,
|
||||
type DeletePost,
|
||||
type PostList,
|
||||
type PostParams,
|
||||
type MyPostParams,
|
||||
type PostFormData,
|
||||
type PostUpdateFormData,
|
||||
type PostService,
|
||||
} from "./model/post-interface";
|
||||
export { deleteReasonMessages } from "./model/delete-reason-messages";
|
||||
export { PostPageGuard } from "./lib/post-page-guard";
|
||||
@@ -0,0 +1,39 @@
|
||||
import { useEffect } from "react";
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { usePathname, useRouter } from "next/navigation";
|
||||
import { BoardApi } from "@/entities/board/@x/post";
|
||||
import { useAlertStore, useMenuStore } from "@/shared/lib";
|
||||
|
||||
function PostPageGuard({
|
||||
bbsId,
|
||||
children,
|
||||
}: {
|
||||
bbsId: string;
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const pathname = usePathname();
|
||||
const alert = useAlertStore((state) => state.setMessage);
|
||||
const setBbsInfo = useMenuStore((state) => state.setBbsInfo);
|
||||
|
||||
const { data: boardInfo, isLoading } = useQuery({
|
||||
queryKey: [bbsId],
|
||||
queryFn: () => BoardApi.getBoardInfo(bbsId),
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (!boardInfo) return;
|
||||
setBbsInfo(boardInfo);
|
||||
}, [boardInfo]);
|
||||
|
||||
if (!isLoading && pathname && boardInfo) {
|
||||
if (!pathname.includes(boardInfo.bbsTypeCd.toLowerCase())) {
|
||||
alert("잘못된 경로로 접속하였습니다.", router.back);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
return children;
|
||||
}
|
||||
|
||||
export { PostPageGuard };
|
||||
@@ -0,0 +1,11 @@
|
||||
export const deleteReasonMessages = {
|
||||
"저작권 침해":
|
||||
"타인의 저작물을 허락 없이 게시하는 경우 저작권 침해로 간주되어 삭제될 수 있습니다.",
|
||||
명예훼손: "타인의 명예를 훼손하는 내용의 게시물은 삭제될 수 있습니다.",
|
||||
"개인정보 노출": "타인의 개인정보를 노출하는 게시물도 삭제될 수 있습니다.",
|
||||
"불법 정보 유통":
|
||||
"불법적인 상품이나 서비스를 판매하거나 홍보하는 게시물은 삭제될 수 있습니다.",
|
||||
"욕설 및 비방":
|
||||
"심한 욕설이나 비방, 모욕적인 내용이 포함된 게시물은 삭제될 수 있습니다.",
|
||||
"광고성 정보": "지나치게 광고성이 짙은 게시물은 삭제될 수 있습니다.",
|
||||
};
|
||||
@@ -0,0 +1,119 @@
|
||||
import { z } from "zod";
|
||||
import type { PageableList, PageableParams } from "@/shared/model";
|
||||
|
||||
export interface PostParams extends PageableParams {
|
||||
keywordType?: string;
|
||||
keyword?: string;
|
||||
popupYn?: string;
|
||||
upndFixYn?: string;
|
||||
prdPstgYn?: string;
|
||||
siteId?: string;
|
||||
bbsTypeCd?: string;
|
||||
ansUseYn?: string;
|
||||
}
|
||||
|
||||
export interface MyPostParams extends PageableParams {
|
||||
keywordType?: string;
|
||||
keyword?: string;
|
||||
bbsId?: number | null;
|
||||
delYn?: string;
|
||||
frDateYmd?: string;
|
||||
toDateYmd?: string;
|
||||
}
|
||||
|
||||
export interface Post {
|
||||
rowNo: number;
|
||||
bbsId: number;
|
||||
pstNo: number;
|
||||
pstTtl: string;
|
||||
pstCn: string;
|
||||
inqNocs: number;
|
||||
rfrncUrl: string;
|
||||
popupYn: string;
|
||||
upndFixYn: string;
|
||||
prdPstgYn: string;
|
||||
rootPath: string;
|
||||
pstPath: string;
|
||||
ansPstn: number;
|
||||
wrtrNm: string;
|
||||
wrtrCplc: string;
|
||||
atflCd: string;
|
||||
regDt: string;
|
||||
rgtrNm: string;
|
||||
cmntCnt: number;
|
||||
}
|
||||
|
||||
export interface MyPost extends Post {
|
||||
bbsNm: string;
|
||||
bbsTypeCd: string;
|
||||
}
|
||||
|
||||
export interface PostInfo extends Post {
|
||||
pstCn: string;
|
||||
rgtr: string;
|
||||
mdfcnDt: string;
|
||||
mdfr: string;
|
||||
}
|
||||
|
||||
export interface MovePost {
|
||||
fromBbsId: number;
|
||||
toBbsId?: number;
|
||||
pstNo: number;
|
||||
}
|
||||
|
||||
export interface DeletePost {
|
||||
bbsId: number;
|
||||
pstNo: number;
|
||||
delRsn?: string;
|
||||
}
|
||||
|
||||
const postEtcSchema = z.object({
|
||||
bbsPstgTypeCd: z.string(),
|
||||
pstgPrdSeCd: z.string(),
|
||||
pstgBgngDt: z.string().nullish(),
|
||||
pstgEndDt: z.string().nullish(),
|
||||
});
|
||||
|
||||
export const postFormSchema = z.object({
|
||||
bbsId: z.number(),
|
||||
pstTtl: z.string().nonempty(),
|
||||
pstCn: z.string().nullish(),
|
||||
rfrncUrl: z.string().nullish(),
|
||||
popupYn: z.string().nullish(),
|
||||
popupYnEtc: z.array(postEtcSchema).nullish(),
|
||||
upndFixYn: z.string().nullish(),
|
||||
upndFixYnEtc: z.array(postEtcSchema).nullish(),
|
||||
prdPstgYn: z.string().nullish(),
|
||||
prdPstgYnEtc: z.array(postEtcSchema).nullish(),
|
||||
pstPswd: z.string(),
|
||||
wrtrNm: z.string().nullish(),
|
||||
wrtrCplc: z.string().nullish(),
|
||||
atflCd: z.string().nullish(),
|
||||
parentPstNo: z.number().nullish(),
|
||||
});
|
||||
|
||||
export const postUpdateFormSchema = postFormSchema.omit({
|
||||
bbsId: true,
|
||||
parentPstNo: true,
|
||||
});
|
||||
|
||||
export type PostList = PageableList<Post>;
|
||||
export type MyPostList = PageableList<MyPost>;
|
||||
export type PostFormData = z.infer<typeof postFormSchema>;
|
||||
export type PostUpdateFormData = z.infer<typeof postUpdateFormSchema>;
|
||||
|
||||
export interface PostService {
|
||||
getPostList(bbsId: number, params: PostParams): Promise<PostList>;
|
||||
getMyPostList(params: MyPostParams): Promise<MyPostList>;
|
||||
getPostInfo(bbsId: number, pstNo: number): Promise<PostInfo>;
|
||||
createPost(data: PostFormData): Promise<Post>;
|
||||
updatePost(
|
||||
bbsId: number,
|
||||
pstNo: number,
|
||||
data: PostUpdateFormData,
|
||||
): Promise<Post>;
|
||||
deletePost(bbsId: number, pstNo: number, delRsn?: string): Promise<void>;
|
||||
softDeletePost(data: DeletePost[]): Promise<void>;
|
||||
hardDeletePost(data: DeletePost[]): Promise<void>;
|
||||
movePost(data: MovePost[]): Promise<void>;
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
import { client } from "@/shared/api";
|
||||
import { ENDPOINT } from "@/shared/config";
|
||||
import type { Dashboard, DashboardService } from "../model/dashboard-interface";
|
||||
|
||||
export class DashboardApiService implements DashboardService {
|
||||
public async getDashboard(): Promise<Dashboard> {
|
||||
const response = await client.get<Dashboard>(
|
||||
ENDPOINT.CMS_SERVICE.DASHBOARD,
|
||||
);
|
||||
return response.data;
|
||||
}
|
||||
}
|
||||
|
||||
export const DashboardApi = new DashboardApiService();
|
||||
@@ -0,0 +1,212 @@
|
||||
#mapArea {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.stage {
|
||||
--map-inset: 7.5%;
|
||||
aspect-ratio: 0.72/1;
|
||||
width: 100%;
|
||||
max-height: 100%;
|
||||
position: relative;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.bgLayer {
|
||||
position: absolute;
|
||||
inset: var(--map-inset);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1;
|
||||
width: calc(100% - var(--map-inset) * 2);
|
||||
height: calc(100% - var(--map-inset) * 2);
|
||||
background-image: url("/images/region_map_bg.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: center center;
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
image-rendering: crisp-edges;
|
||||
image-rendering: pixelated;
|
||||
opacity: 0.7;
|
||||
filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.02));
|
||||
pointer-events: none;
|
||||
min-height: 200px;
|
||||
}
|
||||
|
||||
.svgLayer {
|
||||
position: absolute;
|
||||
inset: var(--map-inset);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
width: calc(100% - var(--map-inset) * 2);
|
||||
height: calc(100% - var(--map-inset) * 2);
|
||||
}
|
||||
|
||||
.svgLayer > svg {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
image-rendering: -webkit-optimize-contrast;
|
||||
image-rendering: crisp-edges;
|
||||
shape-rendering: geometricPrecision;
|
||||
}
|
||||
|
||||
/* SVG 스타일을 위한 컨테이너 */
|
||||
.svgContainer :global(svg) :global(path) {
|
||||
fill: rgba(0, 150, 255, 0.2) !important;
|
||||
stroke: #0066cc;
|
||||
stroke-width: 1;
|
||||
vector-effect: non-scaling-stroke;
|
||||
}
|
||||
|
||||
.svgContainer :global(svg) :global(.cls-1) {
|
||||
fill: rgba(0, 150, 255, 0.2) !important;
|
||||
stroke: #0066cc;
|
||||
stroke-width: 1;
|
||||
vector-effect: non-scaling-stroke;
|
||||
}
|
||||
|
||||
.svgContainer :global(svg) :global(.basin) {
|
||||
opacity: 0;
|
||||
pointer-events: all;
|
||||
transition: opacity 0.15s ease;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.svgContainer :global(svg) :global(.basin.active),
|
||||
.svgContainer :global(svg) :global(.basin:hover) {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.svgContainer :global(svg) :global(.basin) :global(path),
|
||||
.svgContainer :global(svg) :global(.basin) :global(polygon),
|
||||
.svgContainer :global(svg) :global(.basin) :global(polyline) {
|
||||
fill: rgba(0, 209, 209, 0.5);
|
||||
stroke: #399AC3;
|
||||
stroke-width: 1.3;
|
||||
vector-effect: non-scaling-stroke;
|
||||
}
|
||||
|
||||
/* 팝업 + 배지 */
|
||||
.popup {
|
||||
position: absolute;
|
||||
width: 300px;
|
||||
height: 150px;
|
||||
min-width: 220px;
|
||||
background: #fff;
|
||||
border: 1px solid #e5e7eb;
|
||||
border-radius: 10px;
|
||||
box-shadow:
|
||||
0 12px 24px rgba(0, 0, 0, 0.18),
|
||||
0 2px 0 rgba(0, 0, 0, 0.05);
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transform: translate(-50%, -8px) scale(0.98);
|
||||
transition:
|
||||
opacity 0.12s,
|
||||
visibility 0.12s,
|
||||
transform 0.12s;
|
||||
pointer-events: none;
|
||||
z-index: 10;
|
||||
}
|
||||
.popup.show {
|
||||
opacity: 1 !important;
|
||||
visibility: visible !important;
|
||||
transform: translate(-50%, -12px) scale(1) !important;
|
||||
}
|
||||
|
||||
.show {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
.popup .head {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
background: #d1ecfa;
|
||||
border-bottom: 1px solid #c8e4f3;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
}
|
||||
.popup .head > div {
|
||||
padding: 10px 12px;
|
||||
text-align: center;
|
||||
}
|
||||
.popup .body {
|
||||
padding: 6px 10px 8px;
|
||||
}
|
||||
.popup td {
|
||||
padding: 8px 10px;
|
||||
border-bottom: 1px solid #eef2f7;
|
||||
font-size: 14px;
|
||||
}
|
||||
.popup .arrow {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: -8px;
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 10px solid transparent;
|
||||
border-right: 10px solid transparent;
|
||||
border-top: 10px solid #fff;
|
||||
filter: drop-shadow(0 1px 0 rgba(0, 0, 0, 0.1));
|
||||
}
|
||||
.badge {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
padding: 6px 10px;
|
||||
border-radius: 8px;
|
||||
background: #1e40af;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
transform: translate(-50%, -50%);
|
||||
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: opacity 0.12s, visibility 0.12s;
|
||||
}
|
||||
.badge.show {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
/* 권역 라벨 */
|
||||
.labelsLayer {
|
||||
position: absolute;
|
||||
inset: var(--map-inset);
|
||||
pointer-events: none;
|
||||
z-index: 3;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.basinLabel {
|
||||
position: absolute;
|
||||
transform: translate(-50%, -50%);
|
||||
pointer-events: none;
|
||||
padding: 6px 12px;
|
||||
border-radius: 6px;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
background: #ffffffee;
|
||||
border: 2px solid #d0d0d0;
|
||||
white-space: nowrap;
|
||||
min-width: 60px;
|
||||
text-align: center;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
.basinLabel.active {
|
||||
background: #006bf8;
|
||||
color: #fff;
|
||||
border-color: #96c3ff;
|
||||
box-shadow: 0 4px 12px rgba(0, 107, 248, 0.3);
|
||||
}
|
||||
@@ -0,0 +1,425 @@
|
||||
import React, { useEffect, useRef } from "react";
|
||||
import styles from "./KoreaBasinMap.module.css"; // 추가
|
||||
|
||||
const SVG_URL = "/images/region_map.svg"; // public 폴더에 region_map.svg 위치 필요
|
||||
|
||||
const MANUAL_LABEL_POS = {
|
||||
han: { x: 0.52, y: 0.14 },
|
||||
geum: { x: 0.28, y: 0.47 },
|
||||
nakdong: { x: 0.64, y: 0.47 },
|
||||
yeongsan: { x: 0.18, y: 0.77 },
|
||||
};
|
||||
|
||||
const BASIN_DATA = {
|
||||
han: {
|
||||
name: "한강",
|
||||
colTitle: "시설수",
|
||||
rows: [
|
||||
["500m³ 미만", 100000000],
|
||||
["500m³ 이상", 100000000],
|
||||
],
|
||||
},
|
||||
geum: {
|
||||
name: "금강",
|
||||
colTitle: "시설수",
|
||||
rows: [
|
||||
["500m³ 미만", 100000000],
|
||||
["500m³ 이상", 100000000],
|
||||
],
|
||||
},
|
||||
nakdong: {
|
||||
name: "낙동강",
|
||||
colTitle: "시설수",
|
||||
rows: [
|
||||
["500m³ 미만", 100000000],
|
||||
["500m³ 이상", 100000000],
|
||||
],
|
||||
},
|
||||
yeongsan: {
|
||||
name: "영산강",
|
||||
colTitle: "시설수",
|
||||
rows: [
|
||||
["500m³ 미만", 100000000],
|
||||
["500m³ 이상", 100000000],
|
||||
],
|
||||
},
|
||||
};
|
||||
|
||||
const BASIN_IDS = [
|
||||
{ key: "han", labels: ["한강", "han"] },
|
||||
{ key: "geum", labels: ["금강", "geum"] },
|
||||
{ key: "nakdong", labels: ["낙동강", "nakdong"] },
|
||||
{ key: "yeongsan", labels: ["영산강", "yeongsan"] },
|
||||
];
|
||||
|
||||
function fmt(n: number) {
|
||||
return new Intl.NumberFormat("ko-KR").format(n);
|
||||
}
|
||||
|
||||
export function KoreaBasinMap() {
|
||||
const stageRef = useRef<HTMLDivElement>(null);
|
||||
const svgLayerRef = useRef<HTMLDivElement>(null);
|
||||
const labelsLayerRef = useRef<HTMLDivElement>(null);
|
||||
const popupRef = useRef<HTMLDivElement>(null);
|
||||
const badgeRef = useRef<HTMLDivElement>(null);
|
||||
const rowsRef = useRef<HTMLTableSectionElement>(null);
|
||||
const colTitleRef = useRef<HTMLTableCellElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
let svg: SVGSVGElement | null = null;
|
||||
let gs: SVGGElement[] = [];
|
||||
let labels: HTMLDivElement[] = [];
|
||||
|
||||
console.log("Loading SVG from:", SVG_URL);
|
||||
fetch(SVG_URL)
|
||||
.then((r) => {
|
||||
console.log("SVG fetch response:", r.status, r.statusText);
|
||||
if (!r.ok) throw new Error(`HTTP error! status: ${r.status}`);
|
||||
return r.text();
|
||||
})
|
||||
.then((txt) => {
|
||||
console.log("SVG content loaded, length:", txt.length);
|
||||
if (!svgLayerRef.current) {
|
||||
console.error("svgLayerRef.current is null");
|
||||
return;
|
||||
}
|
||||
svgLayerRef.current.innerHTML = txt;
|
||||
svg = svgLayerRef.current.querySelector("svg");
|
||||
if (!svg) {
|
||||
console.error("SVG element not found in loaded content");
|
||||
return;
|
||||
}
|
||||
console.log("SVG element found:", svg);
|
||||
|
||||
// viewBox/크기 세팅
|
||||
if (!svg.hasAttribute("viewBox")) {
|
||||
const bb = svg.getBBox();
|
||||
svg.setAttribute(
|
||||
"viewBox",
|
||||
[bb.x, bb.y, bb.width, bb.height].join(" "),
|
||||
);
|
||||
}
|
||||
const vb = (svg.getAttribute("viewBox") || "").split(/\s+/).map(Number);
|
||||
if (vb.length === 4 && vb[3]! > 0 && stageRef.current) {
|
||||
stageRef.current!.style.aspectRatio = String(vb[2]! / vb[3]!);
|
||||
}
|
||||
svg!.setAttribute("preserveAspectRatio", "xMidYMid meet");
|
||||
svg.style.width = "100%";
|
||||
svg.style.height = "100%";
|
||||
|
||||
// 1) 지도 그룹 수집
|
||||
gs = [];
|
||||
console.log("Looking for basin groups in SVG...");
|
||||
BASIN_IDS.forEach((item) => {
|
||||
let g: SVGGElement | null = null;
|
||||
for (const id of item.labels) {
|
||||
g = svg!.getElementById(id) as SVGGElement | null;
|
||||
if (g) {
|
||||
console.log(`Found group for ${item.key} with id '${id}':`, g);
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (!g) {
|
||||
console.warn(`No group found for ${item.key} with labels:`, item.labels);
|
||||
return;
|
||||
}
|
||||
g.classList.add("basin");
|
||||
(g as SVGGElement & { dataset: { key: string; label: string } }).dataset.key = item.key;
|
||||
(g as SVGGElement & { dataset: { key: string; label: string } }).dataset.label = item.labels[0] || '';
|
||||
|
||||
// 패스에 기본 스타일 적용
|
||||
const paths = g.querySelectorAll('path');
|
||||
paths.forEach((path) => {
|
||||
path.style.fill = 'rgba(0, 150, 255, 0.2)';
|
||||
path.style.stroke = '#0066cc';
|
||||
path.style.strokeWidth = '1';
|
||||
path.style.vectorEffect = 'non-scaling-stroke';
|
||||
});
|
||||
|
||||
gs.push(g);
|
||||
});
|
||||
console.log(`Found ${gs.length} basin groups`);
|
||||
|
||||
// 각 유역 그룹의 패스 정보 확인
|
||||
gs.forEach((g, index) => {
|
||||
const paths = g.querySelectorAll('path');
|
||||
console.log(`Group ${index} (${(g as SVGGElement & { dataset: { key: string } }).dataset.key}):`, {
|
||||
element: g,
|
||||
pathCount: paths.length,
|
||||
paths: Array.from(paths).map(p => ({
|
||||
className: p.className.baseVal,
|
||||
d: p.getAttribute('d')?.substring(0, 50) + '...'
|
||||
}))
|
||||
});
|
||||
});
|
||||
|
||||
// 2) 함수들 먼저 정의
|
||||
const clear = () => {
|
||||
gs.forEach((el) => el.classList.remove("active"));
|
||||
if (popupRef.current) {
|
||||
if (styles.show) {
|
||||
popupRef.current.classList.remove(styles.show);
|
||||
}
|
||||
popupRef.current.style.opacity = "0";
|
||||
popupRef.current.style.visibility = "hidden";
|
||||
}
|
||||
if (badgeRef.current) {
|
||||
if (styles.show) {
|
||||
badgeRef.current.classList.remove(styles.show);
|
||||
}
|
||||
badgeRef.current.style.opacity = "0";
|
||||
badgeRef.current.style.visibility = "hidden";
|
||||
}
|
||||
labels.forEach((l) => l.classList.remove("active"));
|
||||
};
|
||||
|
||||
function showFor(g: SVGGElement) {
|
||||
console.log("showFor called for:", g);
|
||||
const key = (g as SVGGElement & { dataset: { key: string; label: string } }).dataset.key;
|
||||
const data = (BASIN_DATA as Record<string, { name: string; colTitle: string; rows: (string | number)[][] }>)[key] || {
|
||||
name: (g as SVGGElement & { dataset: { label: string } }).dataset.label,
|
||||
colTitle: "",
|
||||
rows: [],
|
||||
};
|
||||
console.log("Data for popup:", data);
|
||||
|
||||
if (badgeRef.current) badgeRef.current.textContent = data.name;
|
||||
if (colTitleRef.current)
|
||||
colTitleRef.current.textContent = data.colTitle || "???";
|
||||
if (rowsRef.current)
|
||||
rowsRef.current.innerHTML = data.rows
|
||||
.map(
|
||||
(r: (string | number)[]) =>
|
||||
`<tr><td>${r[0]}</td><td style="text-align:right">${fmt(Number(r[1]) || 0)}</td></tr>`,
|
||||
)
|
||||
.join("");
|
||||
|
||||
if (!stageRef.current) return;
|
||||
const sRect = stageRef.current.getBoundingClientRect(),
|
||||
r = g.getBoundingClientRect();
|
||||
const cx = (r.left + r.right) / 2 - sRect.left;
|
||||
const ty = r.top - sRect.top;
|
||||
|
||||
console.log("Popup position:", { cx, ty });
|
||||
|
||||
if (badgeRef.current) {
|
||||
badgeRef.current.style.left = cx + "px";
|
||||
badgeRef.current.style.top = ty + 24 + "px";
|
||||
}
|
||||
if (popupRef.current) {
|
||||
popupRef.current.style.left = cx + "px";
|
||||
popupRef.current.style.top = ty + 6 + "px";
|
||||
popupRef.current.style.opacity = "1";
|
||||
popupRef.current.style.visibility = "visible";
|
||||
if (styles.show) {
|
||||
popupRef.current.classList.add(styles.show);
|
||||
}
|
||||
console.log("Added show class to popup:", popupRef.current.classList.toString());
|
||||
}
|
||||
if (badgeRef.current && styles.show) {
|
||||
badgeRef.current.classList.add(styles.show);
|
||||
}
|
||||
|
||||
if (popupRef.current) {
|
||||
const pRect = popupRef.current.getBoundingClientRect();
|
||||
const x = Math.max(
|
||||
12 + pRect.width / 2,
|
||||
Math.min(cx, sRect.width - 12 - pRect.width / 2),
|
||||
);
|
||||
popupRef.current.style.left = x + "px";
|
||||
if (badgeRef.current) badgeRef.current.style.left = x + "px";
|
||||
}
|
||||
}
|
||||
|
||||
function showForWithLabel(g: SVGGElement) {
|
||||
console.log("showForWithLabel called for:", g);
|
||||
showFor(g);
|
||||
const idx = gs.indexOf(g);
|
||||
labels.forEach((l) => l.classList.remove("active"));
|
||||
if (idx >= 0) labels[idx]!.classList.add("active");
|
||||
}
|
||||
|
||||
// 3) 라벨 DOM 생성
|
||||
labels = [];
|
||||
if (labelsLayerRef.current) {
|
||||
labelsLayerRef.current.innerHTML = "";
|
||||
gs.forEach((g) => {
|
||||
const el = document.createElement("div");
|
||||
el.className = styles.basinLabel || '';
|
||||
el.textContent = (g as SVGGElement & { dataset: { label: string } }).dataset.label || '';
|
||||
labelsLayerRef.current!.appendChild(el);
|
||||
labels.push(el);
|
||||
});
|
||||
}
|
||||
|
||||
// 3) 라벨 위치
|
||||
function positionLabels() {
|
||||
if (!stageRef.current || !svg) return;
|
||||
const sRect = stageRef.current.getBoundingClientRect();
|
||||
const inset =
|
||||
parseFloat(
|
||||
getComputedStyle(stageRef.current).getPropertyValue(
|
||||
"--map-inset",
|
||||
) || "0",
|
||||
) / 100;
|
||||
const left = sRect.width * inset,
|
||||
top = sRect.height * inset;
|
||||
const w = sRect.width * (1 - inset * 2),
|
||||
h = sRect.height * (1 - inset * 2);
|
||||
const [vx, vy, vw, vh] = (
|
||||
svg!.getAttribute("viewBox") || "0 0 100 100"
|
||||
)
|
||||
.split(/\s+/)
|
||||
.map(Number);
|
||||
|
||||
const svgRect = svg.getBoundingClientRect();
|
||||
const stageRect = stageRef.current.getBoundingClientRect();
|
||||
const offsetX = svgRect.left - stageRect.left - left;
|
||||
const offsetY = svgRect.top - stageRect.top - top;
|
||||
|
||||
gs.forEach((g, i) => {
|
||||
const key = (g as SVGGElement & { dataset: { key: string } }).dataset.key;
|
||||
const manual = (MANUAL_LABEL_POS as Record<string, { x?: number; y?: number; px?: number; py?: number }>)[key];
|
||||
let px, py;
|
||||
if (
|
||||
manual &&
|
||||
(("x" in manual && "y" in manual) ||
|
||||
("px" in manual && "py" in manual))
|
||||
) {
|
||||
if ("px" in manual) {
|
||||
px = left + (manual.px || 0) + offsetX;
|
||||
py = top + (manual.py || 0) + offsetY;
|
||||
} else {
|
||||
px = left + w * (manual.x || 0) + offsetX;
|
||||
py = top + h * (manual.y || 0) + offsetY;
|
||||
}
|
||||
} else {
|
||||
const b = g.getBBox();
|
||||
const cx = b.x + b.width / 2,
|
||||
cy = b.y + b.height / 2;
|
||||
px = ((cx - vx!) / vw!) * w + left + offsetX;
|
||||
py = ((cy - vy!) / vh!) * h + top + offsetY;
|
||||
}
|
||||
labels[i]!.style.left = `${px}px`;
|
||||
labels[i]!.style.top = `${py + 18}px`;
|
||||
});
|
||||
}
|
||||
|
||||
// 4) 상호작용 (함수들은 이미 위에서 정의됨)
|
||||
gs.forEach((g) => {
|
||||
g.addEventListener("mouseenter", () => {
|
||||
clear();
|
||||
g.classList.add("active");
|
||||
showForWithLabel(g);
|
||||
});
|
||||
g.addEventListener("mousemove", () => {
|
||||
if (g.classList.contains("active")) showForWithLabel(g);
|
||||
});
|
||||
g.addEventListener("mouseleave", clear);
|
||||
g.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
clear();
|
||||
g.classList.add("active");
|
||||
showForWithLabel(g);
|
||||
});
|
||||
});
|
||||
if (stageRef.current) {
|
||||
stageRef.current.addEventListener("mouseleave", clear);
|
||||
stageRef.current.addEventListener("click", () => clear());
|
||||
}
|
||||
|
||||
// 5) 실행
|
||||
positionLabels();
|
||||
window.addEventListener("resize", positionLabels);
|
||||
new window.ResizeObserver(positionLabels).observe(stageRef.current!);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("Error loading SVG:", error);
|
||||
if (svgLayerRef.current)
|
||||
svgLayerRef.current.innerHTML =
|
||||
`<div style="display: flex; align-items: center; justify-content: center; height: 100%; color: #666; font-size: 14px;">지도를 불러올 수 없습니다. (${error.message})</div>`;
|
||||
});
|
||||
|
||||
// cleanup
|
||||
return () => {
|
||||
window.removeEventListener("resize", () => {});
|
||||
};
|
||||
}, []);
|
||||
|
||||
// 스타일은 필요에 따라 tailwind, css 등으로 커스터마이즈하세요.
|
||||
return (
|
||||
<div
|
||||
ref={stageRef}
|
||||
id="stage"
|
||||
style={
|
||||
{
|
||||
width: "100%",
|
||||
height: "560px",
|
||||
position: "relative",
|
||||
zIndex: 20,
|
||||
"--map-inset": "0",
|
||||
} as React.CSSProperties
|
||||
}
|
||||
>
|
||||
<div
|
||||
className={styles.bgLayer}
|
||||
id="bgLayer"
|
||||
/>
|
||||
<div
|
||||
ref={svgLayerRef}
|
||||
id="svgLayer"
|
||||
className={`${styles.svgLayer} ${styles.svgContainer}`}
|
||||
style={{ width: "100%", height: "100%" }}
|
||||
/>
|
||||
<div
|
||||
ref={labelsLayerRef}
|
||||
id="labelsLayer"
|
||||
className={styles.labelsLayer}
|
||||
style={{
|
||||
position: "absolute",
|
||||
left: 0,
|
||||
top: 0,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
pointerEvents: "none",
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
ref={badgeRef}
|
||||
id="badge"
|
||||
className={styles.badge}
|
||||
style={{ position: "absolute", zIndex: 10, display: "block" }}
|
||||
/>
|
||||
<div
|
||||
ref={popupRef}
|
||||
id="popup"
|
||||
className={styles.popup}
|
||||
style={{
|
||||
position: "absolute",
|
||||
zIndex: 20,
|
||||
background: "#fff",
|
||||
border: "1px solid #ccc",
|
||||
borderRadius: 8,
|
||||
padding: 12,
|
||||
minWidth: 160,
|
||||
boxShadow: "0 2px 8px #0002",
|
||||
display: "block",
|
||||
opacity: 0,
|
||||
visibility: "hidden",
|
||||
}}
|
||||
>
|
||||
<table style={{ width: "100%" }}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>구분</th>
|
||||
<th ref={colTitleRef} id="colTitle">
|
||||
시설수
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody ref={rowsRef} id="rows"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,172 @@
|
||||
import { type ChartData, type ChartOptions } from "chart.js";
|
||||
|
||||
const commonData = {
|
||||
labels: ["1", "2", "3", "4", "5", "6", "7"],
|
||||
datasets: [
|
||||
{
|
||||
fill: true,
|
||||
pointRadius: 0,
|
||||
tension: 0.5,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const commonOptions = {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
legend: {
|
||||
display: false,
|
||||
},
|
||||
},
|
||||
scales: {
|
||||
x: {
|
||||
display: false,
|
||||
},
|
||||
y: {
|
||||
display: false,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export const chartData: Record<
|
||||
string,
|
||||
{ data: ChartData<"line" | "bar">; options: ChartOptions<"line" | "bar"> }
|
||||
> = {
|
||||
memberChartData: {
|
||||
data: {
|
||||
...commonData,
|
||||
datasets: [
|
||||
{
|
||||
...commonData.datasets[0],
|
||||
data: [8, 10, 7, 12, 9, 13, 12],
|
||||
borderColor: "rgba(255, 255, 255, 0.6)",
|
||||
backgroundColor: "rgba(255, 255, 255, 0.1)",
|
||||
},
|
||||
],
|
||||
},
|
||||
options: {
|
||||
...commonOptions,
|
||||
scales: {
|
||||
...commonOptions.scales,
|
||||
y: {
|
||||
...commonOptions.scales.y,
|
||||
min: 5,
|
||||
max: 15,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
postChartData: {
|
||||
data: {
|
||||
...commonData,
|
||||
datasets: [
|
||||
{
|
||||
...commonData.datasets[0],
|
||||
data: [5200, 5350, 5450, 5520, 5600, 5650, 5678],
|
||||
borderColor: "rgba(86, 138, 255, 1)",
|
||||
backgroundColor: "rgba(86, 138, 255, 0.1)",
|
||||
},
|
||||
],
|
||||
},
|
||||
options: {
|
||||
...commonOptions,
|
||||
},
|
||||
},
|
||||
visitorChartData: {
|
||||
data: {
|
||||
...commonData,
|
||||
datasets: [
|
||||
{
|
||||
...commonData.datasets[0],
|
||||
data: [1800, 2100, 1950, 2300, 2150, 2250, 2345],
|
||||
borderColor: "rgba(149, 131, 252)",
|
||||
backgroundColor: "rgba(149, 131, 252, 0.1)",
|
||||
},
|
||||
],
|
||||
},
|
||||
options: {
|
||||
...commonOptions,
|
||||
},
|
||||
},
|
||||
apiChartData: {
|
||||
data: {
|
||||
...commonData,
|
||||
datasets: [
|
||||
{
|
||||
...commonData.datasets[0],
|
||||
data: [41000, 42500, 43200, 44100, 44800, 45200, 45678],
|
||||
borderColor: "rgba(220, 103, 206)",
|
||||
backgroundColor: "rgba(220, 103, 206, 0.1)",
|
||||
},
|
||||
],
|
||||
},
|
||||
options: {
|
||||
...commonOptions,
|
||||
},
|
||||
},
|
||||
siteAccessChartData: {
|
||||
data: {
|
||||
labels: Array.from({ length: 24 }, (_, i) =>
|
||||
i.toString().padStart(2, "0"),
|
||||
),
|
||||
datasets: [],
|
||||
},
|
||||
options: {
|
||||
...commonOptions,
|
||||
plugins: {
|
||||
legend: {
|
||||
position: "top",
|
||||
},
|
||||
tooltip: {
|
||||
mode: "index",
|
||||
intersect: false,
|
||||
},
|
||||
},
|
||||
scales: {
|
||||
x: {
|
||||
title: {
|
||||
text: "시간대",
|
||||
},
|
||||
},
|
||||
y: {
|
||||
title: {
|
||||
text: "접속자 수",
|
||||
},
|
||||
beginAtZero: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
menuAccessChartData: {
|
||||
data: {
|
||||
labels: [],
|
||||
datasets: [],
|
||||
},
|
||||
options: {
|
||||
...commonOptions,
|
||||
plugins: {
|
||||
legend: {
|
||||
position: "top",
|
||||
},
|
||||
tooltip: {
|
||||
mode: "index",
|
||||
intersect: false,
|
||||
},
|
||||
},
|
||||
scales: {
|
||||
x: {
|
||||
title: {
|
||||
text: "메뉴명",
|
||||
},
|
||||
},
|
||||
y: {
|
||||
title: {
|
||||
text: "접속 횟수",
|
||||
},
|
||||
beginAtZero: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,32 @@
|
||||
export interface SiteStatisticsContent {
|
||||
siteId: string;
|
||||
siteNm: string;
|
||||
accessHour: string;
|
||||
accessCnt: number;
|
||||
}
|
||||
|
||||
export interface MenuStatisticsContent {
|
||||
menuCd: number;
|
||||
menuNm: string;
|
||||
accessCnt: number;
|
||||
}
|
||||
|
||||
export interface Dashboard {
|
||||
memberTotCnt: number;
|
||||
memberTodayCnt: number;
|
||||
pstTotCnt: number;
|
||||
pstTodayCnt: number;
|
||||
accessTodayCnt: number;
|
||||
accessBefDayPer: number;
|
||||
apiTodayCnt: number;
|
||||
waitMemberCnt: number;
|
||||
waitCntnCnt: number;
|
||||
notiList: [];
|
||||
schdlList: [];
|
||||
siteAccessList: SiteStatisticsContent[];
|
||||
menuAccessList: MenuStatisticsContent[];
|
||||
}
|
||||
|
||||
export interface DashboardService {
|
||||
getDashboard(): Promise<Dashboard>;
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
import dayjs from "dayjs";
|
||||
import type { ColumnDef } from "@tanstack/react-table";
|
||||
import { Badge } from "@common/components";
|
||||
import type { Post, MyPost } from "@/entities/post";
|
||||
|
||||
const noticePostTableColumns: ColumnDef<Post>[] = [
|
||||
{
|
||||
header: "번호",
|
||||
cell: ({ row, table }) => {
|
||||
if (row.original.upndFixYn === "Y") {
|
||||
return (
|
||||
<Badge
|
||||
color="orange"
|
||||
className="flex size-8 items-center justify-center"
|
||||
>
|
||||
<i className="diveicon di-volume-up-fill" />
|
||||
</Badge>
|
||||
);
|
||||
}
|
||||
const totalRows = table.getRowCount();
|
||||
const currentPage = table.getState().pagination.pageIndex;
|
||||
const pageSize = table.getState().pagination.pageSize;
|
||||
return totalRows - (currentPage * pageSize + row.index);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "pstTtl",
|
||||
header: "제목",
|
||||
},
|
||||
{
|
||||
accessorKey: "wrtrNm",
|
||||
header: "작성자",
|
||||
},
|
||||
{
|
||||
accessorKey: "regDt",
|
||||
header: "작성일",
|
||||
cell: ({ row }) => dayjs(row.original.regDt).format("YYYY-MM-DD"),
|
||||
},
|
||||
{
|
||||
accessorKey: "inqNocs",
|
||||
header: "조회수",
|
||||
},
|
||||
];
|
||||
|
||||
const myPostTableColumns: ColumnDef<MyPost>[] = [
|
||||
{
|
||||
header: "번호",
|
||||
cell: ({ row, table }) => {
|
||||
const totalRows = table.getRowCount();
|
||||
const currentPage = table.getState().pagination.pageIndex;
|
||||
const pageSize = table.getState().pagination.pageSize;
|
||||
return totalRows - (currentPage * pageSize + row.index);
|
||||
},
|
||||
},
|
||||
{
|
||||
accessorKey: "pstTtl",
|
||||
header: "제목",
|
||||
},
|
||||
{
|
||||
accessorKey: "wrtrNm",
|
||||
header: "작성자",
|
||||
},
|
||||
{
|
||||
accessorKey: "regDt",
|
||||
header: "작성일",
|
||||
cell: ({ row }) => dayjs(row.original.regDt).format("YYYY-MM-DD"),
|
||||
},
|
||||
{
|
||||
accessorKey: "inqNocs",
|
||||
header: "조회수",
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
export { noticePostTableColumns, myPostTableColumns };
|
||||
@@ -1,9 +1,36 @@
|
||||
"use client";
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { tokenManager } from '@/entities/auth/lib/token-manager';
|
||||
import { client } from '@/shared/api';
|
||||
import { ENDPOINT } from '@/shared/config';
|
||||
import { useEffect, useState } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { tokenManager } from "@/entities/auth/lib/token-manager";
|
||||
import { client } from "@/shared/api";
|
||||
import { ENDPOINT } from "@/shared/config";
|
||||
import { KoreaBasinMap } from "../lib/KoreaBasinMap";
|
||||
import {
|
||||
Chart as ChartJS,
|
||||
CategoryScale,
|
||||
LinearScale,
|
||||
PointElement,
|
||||
LineElement,
|
||||
BarElement,
|
||||
Filler,
|
||||
Legend,
|
||||
Tooltip,
|
||||
ArcElement,
|
||||
} from "chart.js";
|
||||
import { Doughnut } from "react-chartjs-2";
|
||||
|
||||
// Chart.js 등록
|
||||
ChartJS.register(
|
||||
CategoryScale,
|
||||
LinearScale,
|
||||
PointElement,
|
||||
LineElement,
|
||||
BarElement,
|
||||
Filler,
|
||||
Legend,
|
||||
Tooltip,
|
||||
ArcElement
|
||||
);
|
||||
|
||||
interface UserInfo {
|
||||
email?: string;
|
||||
@@ -14,124 +41,258 @@ interface UserInfo {
|
||||
|
||||
function DashboardPage() {
|
||||
const [userInfo, setUserInfo] = useState<UserInfo | null>(null);
|
||||
const [error, setError] = useState('');
|
||||
const [error, setError] = useState("");
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
const fetchUserInfo = async () => {
|
||||
console.log('fetchUserInfo called');
|
||||
|
||||
const fetchUserInfo = async () => {
|
||||
console.log("fetchUserInfo called");
|
||||
|
||||
try {
|
||||
// tokenManager를 통해 토큰 확인
|
||||
const accessToken = tokenManager.getToken('Authorization');
|
||||
const userId = tokenManager.getToken('token-id');
|
||||
|
||||
const accessToken = tokenManager.getToken("Authorization");
|
||||
const userId = tokenManager.getToken("token-id");
|
||||
|
||||
if (!accessToken || !userId) {
|
||||
console.log('No tokens found, redirecting to login');
|
||||
setError('로그인이 필요합니다.');
|
||||
router.push('/auth/login');
|
||||
console.log("No tokens found, redirecting to login");
|
||||
setError("로그인이 필요합니다.");
|
||||
router.push("/auth/login");
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('Fetching user info with userId:', userId);
|
||||
|
||||
console.log("Fetching user info with userId:", userId);
|
||||
|
||||
// client를 사용하여 API 호출 (자동 토큰 처리)
|
||||
const response = await client.get(`${ENDPOINT.USER_SERVICE.USERS}/${userId}`);
|
||||
|
||||
const response = await client.get(
|
||||
`${ENDPOINT.USER_SERVICE.USERS}/${userId}`,
|
||||
);
|
||||
|
||||
if (response.data) {
|
||||
console.log('User info received:', response.data);
|
||||
console.log("User info received:", response.data);
|
||||
setUserInfo(response.data);
|
||||
} else {
|
||||
setError('사용자 정보를 불러올 수 없습니다.');
|
||||
setError("사용자 정보를 불러올 수 없습니다.");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching user info:', error);
|
||||
if (error instanceof Error && error.message.includes('401')) {
|
||||
setError('인증이 만료되었습니다. 다시 로그인해주세요.');
|
||||
console.error("Error fetching user info:", error);
|
||||
if (error instanceof Error && error.message.includes("401")) {
|
||||
setError("인증이 만료되었습니다. 다시 로그인해주세요.");
|
||||
tokenManager.clearAuthToken();
|
||||
router.push('/auth/login');
|
||||
router.push("/auth/login");
|
||||
} else {
|
||||
setError('네트워크 오류가 발생했습니다.');
|
||||
setError("네트워크 오류가 발생했습니다.");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
fetchUserInfo();
|
||||
}, [router]);
|
||||
|
||||
const handleLogout = () => {
|
||||
console.log('Logging out...');
|
||||
console.log("Logging out...");
|
||||
// localStorage 정리
|
||||
localStorage.removeItem('tempToken');
|
||||
localStorage.removeItem("tempToken");
|
||||
// tokenManager를 통해 쿠키 정리
|
||||
tokenManager.clearAuthToken();
|
||||
router.push('/auth/logout');
|
||||
router.push("/auth/logout");
|
||||
};
|
||||
|
||||
const handleChangePassword = () => {
|
||||
router.push('/otp?next=change-password');
|
||||
const handleChangePassword = () => {
|
||||
router.push("/otp?next=change-password");
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="p-6">
|
||||
<div className="flex flex-col gap-1">
|
||||
{/* 첫번째 라인 */}
|
||||
<div className="grid grid-cols-7 gap-1">
|
||||
{/* 총 회원수 카드 */}
|
||||
<div className="card card-border h-80 !p-0 col-span-2">
|
||||
|
||||
|
||||
<div className="grid grid-cols-8 gap-1">
|
||||
{/* 첫번쨰 열 */}
|
||||
<div className="col-span-2 h-250 !p-0">
|
||||
{/* 전국 하수처리시설 가동률 */}
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">전국 하수처리시설 가동률</h3>
|
||||
</div>
|
||||
<div className="h-60 p-4">
|
||||
<Doughnut
|
||||
data={{
|
||||
datasets: [{
|
||||
data: [75, 25], // 75% 가동률
|
||||
backgroundColor: ['#00DFE5', '#f5f5f5'],
|
||||
borderWidth: 0
|
||||
}]
|
||||
}}
|
||||
options={{
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
cutout: '70%',
|
||||
circumference: 180, // 반원
|
||||
rotation: -90, // 왼쪽에서 시작
|
||||
plugins: {
|
||||
legend: {
|
||||
display: false
|
||||
},
|
||||
tooltip: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
}}
|
||||
plugins={[{
|
||||
id: 'centerText',
|
||||
afterDraw: (chart) => {
|
||||
const ctx = chart.ctx;
|
||||
const centerX = chart.width / 2;
|
||||
const centerY = chart.height / 2;
|
||||
|
||||
// 가동률 텍스트
|
||||
ctx.save();
|
||||
ctx.font = 'bold 24px Arial';
|
||||
ctx.fillStyle = '#00DFE5';
|
||||
ctx.textAlign = 'center';
|
||||
ctx.textBaseline = 'middle';
|
||||
ctx.fillText('75%', centerX, centerY + 10);
|
||||
|
||||
// 라벨 텍스트
|
||||
ctx.font = '12px Arial';
|
||||
ctx.fillStyle = '#666';
|
||||
ctx.fillText('가동률', centerX, centerY + 30);
|
||||
ctx.restore();
|
||||
}
|
||||
}]}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 오수관로 및 우수관로 현황 */}
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">오수관로 및 우수관로 현황</h3>
|
||||
</div>
|
||||
<div className="h-60 p-4"></div>
|
||||
</div>
|
||||
|
||||
{/* 하수처리수 재이용 */}
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">하수처리수 재이용</h3>
|
||||
</div>
|
||||
<div className="h-60 p-4"></div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 전체 게시물 카드 */}
|
||||
<div className="card card-border h-80 !p-0 col-span-2">
|
||||
|
||||
{/* 두번쨰 열 */}
|
||||
<div className="col-span-2 h-250 !p-0">
|
||||
{/* 하수처리시설(개소) */}
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">하수처리시설(개소)</h3>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-1 h-60 !p-0">
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground text-center">
|
||||
<h3 className="text-l font-medium" style={{textAlign: "center", width: "100%"}}>500㎥ 미만(개소)</h3>
|
||||
</div>
|
||||
<div style={{fontSize: "38px", textAlign: "center", fontWeight: "600", lineHeight: "1.2", color: "#0ec58a", padding: "2px 0"}}>3,567 <span style={{fontSize: "14px", color: "#000000"}}>개소</span></div>
|
||||
</div>
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground text-center">
|
||||
<h3 className="text-l font-medium" style={{textAlign: "center", width: "100%"}}>500㎥ 이상(개소)</h3>
|
||||
</div>
|
||||
<div style={{fontSize: "38px", textAlign: "center", fontWeight: "600", lineHeight: "1.2", color: "#0ec58a", padding: "2px 0"}}>767 <span style={{fontSize: "14px", color: "#000000"}}>개소</span></div>
|
||||
</div>
|
||||
<div className="col-span-2" style={{width: "100%", textAlign: "right"}}>기준년월 : 2025.09 </div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 노후하수관로현황 */}
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">노후하수관로현황</h3>
|
||||
</div>
|
||||
<div className="h-70 p-4">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 재이용시설(개소) */}
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">재이용시설(개소)</h3>
|
||||
</div>
|
||||
<div className="h-70 p-4">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 오늘 접속자 수 카드 */}
|
||||
<div className="card card-border h-80 !p-0 col-span-2">
|
||||
|
||||
|
||||
{/* 지도영역 */}
|
||||
<div className="col-span-3 h-200 !p-0 relative z-10">
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">유역별 정보</h3>
|
||||
</div>
|
||||
<KoreaBasinMap />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 사용자 정보 카드 */}
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
<h2 className="text-2xl mb-6">사용자 정보</h2>
|
||||
{error && <div className="text-red-500 mb-4">{error}</div>}
|
||||
{userInfo ? (
|
||||
<div className="mb-4">
|
||||
<div><b>아이디:</b> {userInfo.userId}</div>
|
||||
<div><b>이메일:</b> {userInfo.email || userInfo.userId}</div>
|
||||
<div><b>이름:</b> {userInfo.userName || '-'}</div>
|
||||
<div><b>2FA 활성화:</b> {userInfo.twoFactorEnabled ? '예' : '아니오'}</div>
|
||||
<div className="card card-border col-span-1 h-80 p-10">
|
||||
<h2 className="mb-6 text-2xl">사용자 정보</h2>
|
||||
{error && <div className="mb-4 text-red-500">{error}</div>}
|
||||
{userInfo ? (
|
||||
<div className="mb-4">
|
||||
<div>
|
||||
<b>아이디:</b> {userInfo.userId}
|
||||
</div>
|
||||
) : (
|
||||
!error && <div>사용자 정보를 불러오는 중...</div>
|
||||
)}
|
||||
<button className="btn w-full mb-2" onClick={handleLogout}>로그아웃</button>
|
||||
<button className="btn w-full" onClick={handleChangePassword}>패스워드 변경</button>
|
||||
</div>
|
||||
<div>
|
||||
<b>이메일:</b> {userInfo.email || userInfo.userId}
|
||||
</div>
|
||||
<div>
|
||||
<b>이름:</b> {userInfo.userName || "-"}
|
||||
</div>
|
||||
<div>
|
||||
<b>2FA 활성화:</b>{" "}
|
||||
{userInfo.twoFactorEnabled ? "예" : "아니오"}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
!error && <div>사용자 정보를 불러오는 중...</div>
|
||||
)}
|
||||
<button className="btn mb-2 w-full" onClick={handleLogout}>
|
||||
로그아웃
|
||||
</button>
|
||||
<button className="btn w-full" onClick={handleChangePassword}>
|
||||
패스워드 변경
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 두번째 라인 */}
|
||||
<div className="grid grid-cols-2 gap-1">
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
<div className="grid grid-cols-4 gap-1">
|
||||
<div className="card card-border"id="grouping-statistics">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">지원현황</h3>
|
||||
</div>
|
||||
<div className="h-70 p-4">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">자료관 자료현황</h3>
|
||||
</div>
|
||||
<div className="h-70 p-4">
|
||||
</div>
|
||||
</div>
|
||||
<div className="card card-border">
|
||||
<div className="card-header text-foreground">
|
||||
<h3 className="text-2xl font-medium">공지사항</h3>
|
||||
</div>
|
||||
<div className="h-70 p-4">
|
||||
</div>
|
||||
</div>
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{/* 배너 영역 */}
|
||||
<div className="card card-border">
|
||||
|
||||
{/* 세번째 라인 */}
|
||||
<div className="grid grid-cols-2 gap-1">
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
</div>
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 네번째 라인 */}
|
||||
<div className="grid grid-cols-2 gap-1">
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
</div>
|
||||
<div className="card card-border h-80 p-10 col-span-1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -139,4 +300,4 @@ function DashboardPage() {
|
||||
);
|
||||
}
|
||||
|
||||
export { DashboardPage };
|
||||
export { DashboardPage };
|
||||
|
||||
@@ -69,6 +69,17 @@ export const ENDPOINT = {
|
||||
POSTS_COMMENTS: "/board-service/api/v1/posts-cmnts",
|
||||
POST_EVALUATION: "/board-service/api/v1/pstEvl",
|
||||
},
|
||||
SEWERAGE_SERVICE: {
|
||||
PPL_COUNTS: "/sewerage-service/api/v1/ms/pplCounts",
|
||||
OLD_PPL_COUNTS: "/sewerage-service/api/v1/ms/oldPplCounts",
|
||||
},
|
||||
IC_SERVICE: {
|
||||
GROUPING_STATISTICS: "/ic-service/api/v1/nti/grouping-statistics",
|
||||
},
|
||||
DC_SERVICE: {
|
||||
DATA_STATUS: "/dc-service/api/v1/dc/dataStatus",
|
||||
},
|
||||
|
||||
};
|
||||
|
||||
export const JWT_EXPIRATION_TIME = 1800000;
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
NEXT_PUBLIC_SITE_ID = DM
|
||||
NEXT_PUBLIC_PORT = 11035
|
||||
NEXT_PUBLIC_PROXY_HOST = http://con.mind-one.co.kr:11035
|
||||
NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000/api/v1
|
||||
NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000/operation-service/api/v1
|
||||
NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_PROXY_HOST = https://reuse.hasuon.or.kr
|
||||
NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/api/v1
|
||||
NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
|
||||
NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
|
||||
NEXT_PUBLIC_GEOSERVER_URL = http://172.29.143.87:8080/geoserver
|
||||
NEXT_PUBLIC_LX_GEOSERVER_URL = http://172.29.143.87:8080/geoserver_swl
|
||||
@@ -11,9 +11,9 @@ NEXT_PUBLIC_CLAIM_NAME = Authorization
|
||||
NEXT_PUBLIC_AUTH_USER_ID = token-id
|
||||
NEXT_PUBLIC_ACCESS_TOKEN = access-token
|
||||
NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
|
||||
NEXT_PUBLIC_REUSE_API_URL=http://con.mind-one.co.kr:11080/api/v1
|
||||
NEXT_PUBLIC_REUSE_API_URL= http://apigateway.iipbs-was.svc.cluster.local:8000/reuse-service/api/v1
|
||||
NEXT_PUBLIC_NGII_URL = http://10.98.25.94:18080/openapi/Gettile.do?apiKey=BDE2BEF39DAFEC293AB6730150F222AC
|
||||
NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000/sewerage-service/api
|
||||
NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/sewerage-service/api
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -22,7 +22,10 @@ interface WrStatusChartProps {
|
||||
|
||||
export default function WrStatusPage() {
|
||||
|
||||
const { dmStatus, getDmStatusData} = useDmStore((state) => state);
|
||||
|
||||
|
||||
|
||||
const { Common, dmStatus, getDmStatusData,initializeCommonData} = useDmStore((state) => state);
|
||||
const { statusData,facilityTotals ,chartData} = dmStatus;
|
||||
const [selectedRegion, setSelectedRegion] = useState<string | null>(null);
|
||||
const [hoveredRegion, setHoveredRegion] = useState<string | null>(null);
|
||||
@@ -33,7 +36,6 @@ export default function WrStatusPage() {
|
||||
{ label: '하수', color: '#FF6B6B', key: 'sewage' },
|
||||
{ label: '빗물', color: '#4ECDC4', key: 'rainwater' },
|
||||
{ label: '중수도', color: '#45B7D1', key: 'reclaimed' },
|
||||
{ label: '온배수', color: '#FED16A', key: 'thermal' },
|
||||
];
|
||||
const facilityTotalsColor = ['#FF6B6B', '#4ECDC4', '#45B7D1', '#FED16A'];
|
||||
const defaultYear= '2023'
|
||||
@@ -47,6 +49,11 @@ export default function WrStatusPage() {
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
initializeCommonData();
|
||||
}, [initializeCommonData]);
|
||||
|
||||
const createDonutMarker = useCallback((svg: SVGSVGElement, x: number, y: number, name: string, values: number[]) => {
|
||||
const colors = ['#FF6B6B', '#4ECDC4', '#45B7D1', '#FED16A'];
|
||||
const radius = 26;
|
||||
@@ -142,8 +149,9 @@ export default function WrStatusPage() {
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
getDmStatusData(defaultYear);
|
||||
},[])
|
||||
if(Common.selectSidoData&&Common.selectSidoData.length>0)
|
||||
getDmStatusData(Common.selectSidoData);
|
||||
},[Common.selectSidoData])
|
||||
|
||||
|
||||
|
||||
@@ -219,8 +227,8 @@ export default function WrStatusPage() {
|
||||
chartConfig : chartConfig,
|
||||
chartData : chartData,
|
||||
chartTitle : '',
|
||||
chartClassName : "h-[300px] w-full",
|
||||
graphSize : 40,
|
||||
chartClassName : "w-full h-[350px] ",
|
||||
graphSize : 10,
|
||||
yFieldText : '시설(개소)',
|
||||
showLegend : true
|
||||
}
|
||||
@@ -321,7 +329,6 @@ export default function WrStatusPage() {
|
||||
<th className="text-[12px] font-semibold px-4 py-2">하수재이용시설</th>
|
||||
<th className="text-[12px] font-semibold px-4 py-2">빗물이용시설</th>
|
||||
<th className="text-[12px] font-semibold px-4 py-2">중수도시설</th>
|
||||
<th className="text-[12px] font-semibold px-4 py-2">온배수시설</th>
|
||||
{/* <th className="text-[12px] font-semibold px-4 py-2">하수(이용량,천𝓂³/년)</th>
|
||||
<th className="text-[12px] font-semibold px-4 py-2">빗물(이용량,천𝓂³/년)</th>
|
||||
<th className="text-[12px] font-semibold px-4 py-2">중수도(이용량,천𝓂³/년)</th>
|
||||
@@ -338,7 +345,6 @@ export default function WrStatusPage() {
|
||||
<td className="text-[12px]">{row.sewage}</td>
|
||||
<td className="text-[12px]">{row.rainwater}</td>
|
||||
<td className="text-[12px]">{row.reclaimed}</td>
|
||||
<td className="text-[12px]">{row.thermal}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import type { DmStatusChartType, DmStatusDataType, RegionData, } from "../store/wrStatus/type";
|
||||
import type { RegionData, } from "../store/wrStatus/type";
|
||||
|
||||
|
||||
|
||||
@@ -43,7 +43,7 @@ export const regionIdMap: Record<string, string> = {
|
||||
};
|
||||
|
||||
|
||||
const makeRegion = (region: string) => {
|
||||
export const makeRegion = (region: string) => {
|
||||
if (region === '서울특별시') return '서울'
|
||||
if (region === '부산광역시') return '부산'
|
||||
if (region === '대구광역시') return '대구'
|
||||
@@ -56,19 +56,10 @@ const makeRegion = (region: string) => {
|
||||
if (region === '강원특별자치도') return '강원'
|
||||
if (region === '충청북도') return '충북'
|
||||
if (region === '충청남도') return '충남'
|
||||
if (region === '전라북도') return '전북'
|
||||
if (region === '전북특별자치도') return '전북'
|
||||
if (region === '전라남도') return '전남'
|
||||
if (region === '경상북도') return '경북'
|
||||
if (region === '경상남도') return '경남'
|
||||
if (region === '제주특별자치도') return '제주'
|
||||
return region;
|
||||
}
|
||||
export const changeStatusMapData= (data: DmStatusDataType[]) : DmStatusChartType[]=> {
|
||||
return data.map((item) => ({
|
||||
label: makeRegion(item.region??''),
|
||||
하수: item.sewage.split('(')[0]?.replaceAll(',','') ??'',
|
||||
빗물: item.rainwater.split('(')[0]?.replaceAll(',','')??'',
|
||||
중수도: item.reclaimed.split('(')[0]?.replaceAll(',','') ??'',
|
||||
온배수: item.thermal.split('(')[0]?.replaceAll(',','') ??'',
|
||||
}));
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
"use client"
|
||||
"use client";
|
||||
import "./globals.css";
|
||||
|
||||
export default function RootLayout({
|
||||
@@ -6,15 +6,13 @@ export default function RootLayout({
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
|
||||
return (
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<title>물재이용 대민</title>
|
||||
</head>
|
||||
<body>
|
||||
{children}
|
||||
</body>
|
||||
<body>{children}</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -214,7 +214,7 @@ const selectMiddleRegionData: SelectDataType[] = [
|
||||
// 시도 API 호출 함수 추가
|
||||
const fetchSidoData = async (): Promise<SelectDataType[]> => {
|
||||
try {
|
||||
const res = await getFetch(fetchType.COMMON, '/addr/city');
|
||||
const res = await getFetch(fetchType.FO, '/addr/city');
|
||||
const data = res.data;
|
||||
selectSidoData = [
|
||||
{ text: "전체", val: '0'},
|
||||
@@ -233,7 +233,7 @@ const fetchSidoData = async (): Promise<SelectDataType[]> => {
|
||||
// 시군구 API 호출 함수 추가
|
||||
const fetchSigunData = async (): Promise<SelectDataType[]> => {
|
||||
try {
|
||||
const res = await getFetch(fetchType.COMMON, '/addr/sgg');
|
||||
const res = await getFetch(fetchType.FO, '/addr/sgg');
|
||||
const data = res.data;
|
||||
selectSigunData = [
|
||||
{ text: "전체", val: '0' },
|
||||
@@ -253,7 +253,7 @@ const fetchSigunData = async (): Promise<SelectDataType[]> => {
|
||||
// 권역 API 호출 함수 추가
|
||||
const fetchRegionData = async (): Promise<SelectDataType[]> => {
|
||||
try {
|
||||
const res = await getFetch(fetchType.COMMON, '/addr/sarea');
|
||||
const res = await getFetch(fetchType.FO, '/addr/sarea');
|
||||
const data = res.data;
|
||||
return [
|
||||
{ text: "전체", val: '0'},
|
||||
@@ -271,7 +271,7 @@ const fetchRegionData = async (): Promise<SelectDataType[]> => {
|
||||
// 중권역 API 호출 함수 추가
|
||||
const fetchMiddleRegionData = async (): Promise<SelectDataType[]> => {
|
||||
try {
|
||||
const res = await getFetch(fetchType.COMMON, '/addr/midArea');
|
||||
const res = await getFetch(fetchType.FO, '/addr/midArea');
|
||||
const data = res.data;
|
||||
return [
|
||||
{ text: "전체", val: '0' },
|
||||
@@ -290,7 +290,7 @@ const fetchMiddleRegionData = async (): Promise<SelectDataType[]> => {
|
||||
// 단위유역 API 호출 함수 추가
|
||||
const fetchUnitWaterShedData = async (): Promise<SelectDataType[]> => {
|
||||
try {
|
||||
const res = await getFetch(fetchType.COMMON, '/addr/largeArea');
|
||||
const res = await getFetch(fetchType.FO, '/addr/largeArea');
|
||||
const data = res.data;
|
||||
return [
|
||||
{ text: "전체", val: '0' },
|
||||
@@ -309,7 +309,7 @@ const fetchUnitWaterShedData = async (): Promise<SelectDataType[]> => {
|
||||
// 환경청 데이터
|
||||
const fetchEnvPartData = async (): Promise<envPartSelectDataType[]> => {
|
||||
try {
|
||||
const res = await getFetch(fetchType.COMMON, '/addr/govArea');
|
||||
const res = await getFetch(fetchType.FO, '/addr/govArea');
|
||||
const data = res.data;
|
||||
selectEnvPartData = [
|
||||
{ text: "전체", val: '0', adstDliStrCd: '' },
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { getFetch } from "@/components/ui/api";
|
||||
import { fetchType, getFetch } from "@/components/ui/api";
|
||||
import { DEV_URL_FO } from "@/components/ui/config";
|
||||
import type { FacilityInfo, SubsInfo } from "./type";
|
||||
|
||||
const checkWrRegList = async () => {
|
||||
const wrRegList = await getFetch("wr", `/reuseFc/pubFc`);
|
||||
const wrRegList = await getFetch(fetchType.WR, `/reuseFc/pubFc`);
|
||||
return wrRegList;
|
||||
};
|
||||
|
||||
|
||||
@@ -1,12 +1,14 @@
|
||||
import { changeStatusMapData } from "@/app/common/comFunction";
|
||||
import { fetchType, getFetch } from "@/components/ui/api";
|
||||
import type {
|
||||
DmStatusDataType,
|
||||
DmStatusChartType,
|
||||
DmStatusBoardType,
|
||||
} from "./type";
|
||||
import type { SelectDataType } from "../common";
|
||||
import { makeRegion } from "@/app/common/comFunction";
|
||||
|
||||
export type DmStatusActions = {
|
||||
getDmStatusData(year: string): void;
|
||||
getDmStatusData(cityCd: SelectDataType[]): void;
|
||||
};
|
||||
|
||||
export type DmStatusType = {
|
||||
@@ -28,32 +30,89 @@ export type DmStatusStore = DmStatusType & DmStatusActions;
|
||||
|
||||
export const DmStatusReducer = (set: any): DmStatusActions => {
|
||||
return {
|
||||
getDmStatusData: async (year: string) => {
|
||||
const data = await getFetch(fetchType.WR, "/daemin/" + year);
|
||||
let isData:DmStatusDataType[] =[]
|
||||
if(data.data&&data.data.length>0){
|
||||
isData=data.data
|
||||
}else{
|
||||
fetch(`data/wrStatusData.json`).then((res) => res.json()).then((json) => isData=json)//만약 백엔드에서 못가져올경우 방어책
|
||||
}
|
||||
getDmStatusData: async (cityCd: SelectDataType[]) => {
|
||||
const data = await getFetch(fetchType.FO, "/dashBoard/daemin");
|
||||
|
||||
const orgin: DmStatusDataType[] = isData;
|
||||
const chartData = changeStatusMapData(orgin);
|
||||
const dataSum = data.data.reduce(
|
||||
(acc: DmStatusDataType, item: DmStatusDataType) => {
|
||||
acc.sewage = (
|
||||
parseInt(acc.sewage.replaceAll(",", "")) +
|
||||
parseInt(item.sewage.replaceAll(",", ""))
|
||||
).toLocaleString();
|
||||
acc.rainwater = (
|
||||
parseInt(acc.rainwater.replaceAll(",", "")) +
|
||||
parseInt(item.rainwater.replaceAll(",", ""))
|
||||
).toLocaleString();
|
||||
acc.reclaimed = (
|
||||
parseInt(acc.reclaimed.replaceAll(",", "")) +
|
||||
parseInt(item.reclaimed.replaceAll(",", ""))
|
||||
).toLocaleString();
|
||||
acc.sewageCnt = (
|
||||
parseInt(acc.sewageCnt.replaceAll(",", "")) +
|
||||
parseInt(item.sewageCnt.replaceAll(",", ""))
|
||||
).toLocaleString();
|
||||
acc.rainwaterCnt = (
|
||||
parseInt(acc.rainwaterCnt.replaceAll(",", "")) +
|
||||
parseInt(item.rainwaterCnt.replaceAll(",", ""))
|
||||
).toLocaleString();
|
||||
acc.reclaimedCnt = (
|
||||
parseInt(acc.reclaimedCnt.replaceAll(",", "")) +
|
||||
parseInt(item.reclaimedCnt.replaceAll(",", ""))
|
||||
).toLocaleString();
|
||||
return acc;
|
||||
},
|
||||
{
|
||||
region: "합계",
|
||||
sewage: "0",
|
||||
rainwater: "0",
|
||||
reclaimed: "0",
|
||||
sewageCnt: "0",
|
||||
rainwaterCnt: "0",
|
||||
reclaimedCnt: "0",
|
||||
}
|
||||
);
|
||||
data.data.unshift(dataSum);
|
||||
|
||||
console.log("dataSum ", dataSum);
|
||||
const facilityTotals = [
|
||||
"하수재이용시설" + "(총" + orgin[0]?.sewage.split("(")[0] + "개소)",
|
||||
"빗물재이용시설" + "(총" + orgin[0]?.rainwater.split("(")[0] + "개소)",
|
||||
"중수도재이용시설" +
|
||||
"(총" +
|
||||
orgin[0]?.reclaimed.split("(")[0] +
|
||||
"개소)",
|
||||
"온배수재이용시설" + "(총" + orgin[0]?.thermal.split("(")[0] + "개소)",
|
||||
"하수재이용시설" + "(총" + dataSum?.sewageCnt + "개소)",
|
||||
"빗물재이용시설" + "(총" + dataSum?.rainwaterCnt + "개소)",
|
||||
"중수도재이용시설" + "(총" + dataSum?.reclaimedCnt + "개소)",
|
||||
];
|
||||
|
||||
const boardData: DmStatusBoardType[] = data.data.map(
|
||||
(item: DmStatusDataType) => {
|
||||
const regionText = cityCd.find((city) => item.region === city.val);
|
||||
const sewage = item.sewage;
|
||||
const rainwater = item.rainwater;
|
||||
const reclaimed = item.reclaimed;
|
||||
const sewageCnt = item.sewageCnt;
|
||||
const rainwaterCnt = item.rainwaterCnt;
|
||||
const reclaimedCnt = item.reclaimedCnt;
|
||||
|
||||
return {
|
||||
region: regionText ? regionText.text : item.region,
|
||||
sewage: sewageCnt + "(" + sewage + ")",
|
||||
rainwater: rainwaterCnt + "(" + rainwater + ")",
|
||||
reclaimed: reclaimedCnt + "(" + reclaimed + ")",
|
||||
};
|
||||
}
|
||||
);
|
||||
|
||||
const chartData = data.data.map((item) => ({
|
||||
label: makeRegion(
|
||||
cityCd.find((city) => item.region === city.val)?.text ?? ""
|
||||
),
|
||||
하수: item.sewage,
|
||||
빗물: item.rainwater,
|
||||
중수도: item.reclaimed,
|
||||
}));
|
||||
|
||||
set((state: DmStatusType) => ({
|
||||
...state,
|
||||
dmStatus: {
|
||||
...state.dmStatus,
|
||||
statusData: data.data,
|
||||
statusData: boardData,
|
||||
chartData: chartData,
|
||||
facilityTotals: facilityTotals,
|
||||
},
|
||||
|
||||
@@ -3,9 +3,17 @@ export type DmStatusDataType = {
|
||||
sewage: string;
|
||||
rainwater: string;
|
||||
reclaimed: string;
|
||||
thermal: string;
|
||||
sewageCnt:string
|
||||
rainwaterCnt:string
|
||||
reclaimedCnt:string
|
||||
};
|
||||
|
||||
export type DmStatusBoardType = {
|
||||
region: string;
|
||||
sewage: string;
|
||||
rainwater: string;
|
||||
reclaimed: string;
|
||||
};
|
||||
|
||||
export type DmStatusFcltType = {
|
||||
sewageFclt: string;
|
||||
@@ -21,7 +29,6 @@ export type DmStatusChartType = {
|
||||
하수: string,
|
||||
빗물: string,
|
||||
중수도: string,
|
||||
온배수: string,
|
||||
}
|
||||
|
||||
export type RegionData = {
|
||||
|
||||
@@ -3,7 +3,8 @@ import { DEV_URL_FO, DEV_URL_WR } from "../config";
|
||||
|
||||
export const fetchType = {
|
||||
COMMON: "common",
|
||||
WR: "wr"
|
||||
WR: "wr",
|
||||
FO:'fo'
|
||||
};
|
||||
|
||||
interface RequestParams {
|
||||
@@ -11,7 +12,7 @@ interface RequestParams {
|
||||
}
|
||||
|
||||
export const getFetch = async (type: string, url: string) => {
|
||||
const baseUrl = type === fetchType.COMMON ? DEV_URL_FO : DEV_URL_WR;
|
||||
const baseUrl = type === fetchType.FO ? DEV_URL_FO : DEV_URL_WR;
|
||||
const response = await fetch(baseUrl + url, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
|
||||
@@ -15,11 +15,11 @@
|
||||
|
||||
NEXT_PUBLIC_SITE_ID = FO
|
||||
NEXT_PUBLIC_PORT = 3000
|
||||
NEXT_PUBLIC_PROXY_HOST = https://fo.hasuon.or.kr
|
||||
# NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_SERVER_API_URL = https://fo.hasuon.or.kr/operation-service/api/v1
|
||||
NEXT_PUBLIC_FO_SERVER_API_URL = https://apigateway.hasuon.or.kr/operation-service/api/v1
|
||||
NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_PROXY_HOST = https://larva.hasuon.or.kr
|
||||
# NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
|
||||
NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
|
||||
NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
|
||||
NEXT_PUBLIC_GEOSERVER_URL = http://172.29.143.87:8080/geoserver
|
||||
NEXT_PUBLIC_LX_GEOSERVER_URL = http://172.29.143.87:8080/geoserver_swl
|
||||
@@ -27,6 +27,6 @@ NEXT_PUBLIC_CLAIM_NAME = Authorization
|
||||
NEXT_PUBLIC_AUTH_USER_ID = token-id
|
||||
NEXT_PUBLIC_ACCESS_TOKEN = access-token
|
||||
NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
|
||||
NEXT_PUBLIC_WR_SERVER_API_URL = https://fo.hasuon.or.kr/reuse-service/api/v1
|
||||
NEXT_PUBLIC_WR_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/reuse-service/api/v1
|
||||
|
||||
NEXT_PUBLIC_SEWERAGE_API_URL = https://fo.hasuon.or.kr/sewerage-service/api
|
||||
NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/sewerage-service/api
|
||||
@@ -0,0 +1,4 @@
|
||||
export default function CommaToNumber (data: any){
|
||||
const rtnValue = data&&data.toString().trim()!=''&&data!=undefined?Number(data.toString().replaceAll(',','')):'';
|
||||
return rtnValue;
|
||||
}
|
||||
@@ -159,7 +159,7 @@ export default function DashBoard() {
|
||||
const excelData1 = planFcltyList.map((item) => {
|
||||
return [
|
||||
item.item,
|
||||
item.provisionalApproval,
|
||||
Number(item.provisionalApproval.toString().replaceAll(',',''))?Number(item.provisionalApproval.toString().replaceAll(',','')):item.provisionalApproval,
|
||||
item.now,
|
||||
item.stepOne,
|
||||
item.stepTwo,
|
||||
@@ -171,23 +171,24 @@ export default function DashBoard() {
|
||||
// operationalStatusList를 2차원 배열로 변환
|
||||
const excelData2 = operationalStatusList.map((item, index) => {
|
||||
const baseData = [
|
||||
item.yearAvg,
|
||||
item.yearMax,
|
||||
item.yearMin,
|
||||
item.summerAll,
|
||||
item.summerThree,
|
||||
item.summerRain,
|
||||
item.winterAll,
|
||||
item.winterSunnyAvg,
|
||||
item.winterSunnyMax,
|
||||
item.winterSunnyMin,
|
||||
item.groundWaterAvg,
|
||||
item.groundWaterSummer,
|
||||
item.groundWaterWinter
|
||||
Number(item.yearAvg?.replaceAll(',','')),
|
||||
Number(item.yearMax?.replaceAll(',','')),
|
||||
Number(item.yearMin?.replaceAll(',','')),
|
||||
Number(item.summerAll?.replaceAll(',','')),
|
||||
Number(item.summerThree?.replaceAll(',','')),
|
||||
Number(item.summerRain?.replaceAll(',','')),
|
||||
Number(item.winterAll?.replaceAll(',','')),
|
||||
Number(item.winterSunnyAvg?.replaceAll(',','')),
|
||||
Number(item.winterSunnyMax?.replaceAll(',','')),
|
||||
Number(item.winterSunnyMin?.replaceAll(',','')),
|
||||
Number(item.groundWaterAvg?.replaceAll(',','').replaceAll('%','')),
|
||||
Number(item.groundWaterSummer?.replaceAll(',','').replaceAll('%','')),
|
||||
Number(item.groundWaterWinter?.replaceAll(',','').replaceAll('%',''))
|
||||
];
|
||||
|
||||
// index가 0일 때만 rdi와 rdiRain 추가
|
||||
return index === 0 ? [...baseData, item.rdi, item.rdiRain] : baseData;
|
||||
console.log(item.rdiRain);
|
||||
return index === 0 ? [...baseData, item.rdi&&item.rdi.toString().trim()!=''?Number(item.rdi.toString().replaceAll(',','')):'', item.rdiRain&&item.rdiRain.toString().trim()!=''?Number(item.rdiRain.toString().replaceAll(',','')):''] : baseData;
|
||||
});
|
||||
|
||||
const sheetParameter = [
|
||||
|
||||
@@ -5,16 +5,17 @@
|
||||
*/
|
||||
|
||||
"use client"
|
||||
import CommaToNumber from "@/app/components/common/CommaToNumber";
|
||||
import { roundNumber } from "@/app/components/common/DataForm";
|
||||
import UnderComment from "@/app/components/common/UnderComment";
|
||||
import { useFoStore } from "@/app/store";
|
||||
import type { FacilityWaterQltyProps, modalExcelType } from "@/app/store/facilityWaterQlty";
|
||||
import { downloadExcel, UITab, UiTable } from "@common/business_components/ui";
|
||||
import { downloadExcelFormat, UITab, UiTable } from "@common/business_components/ui";
|
||||
import { Button, TabsContent } from "@common/components/ui";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import type { ReturnType } from "../../../../components/common/FacilityTermModalHeader";
|
||||
import FacilityTermModalHeader from "../../../../components/common/FacilityTermModalHeader";
|
||||
import { HeadMakeColSpan } from "../HeadMakeColSpan";
|
||||
import { roundNumber } from "@/app/components/common/DataForm";
|
||||
import UnderComment from "@/app/components/common/UnderComment";
|
||||
|
||||
const commentArrayChungchun = [
|
||||
"청천시 : 강우량이 3mm미만의 날"
|
||||
@@ -355,22 +356,29 @@ export default function WaterQualityModal({fcltyName='', facilityCd='', searchYe
|
||||
copyYearList.forEach((item) => {
|
||||
excelDownList.push({
|
||||
날짜: item.msrDt,
|
||||
"유입BOD(mg/L)": item.inflAssctBfrWqltBod,
|
||||
"유입TOC(COD)(mg/L)": item.inflAssctBfrWqltToc,
|
||||
"유입SS(mg/L)": item.inflAssctBfrWqltSs,
|
||||
"유입TN(mg/L)": item.inflAssctBfrWqltTn,
|
||||
"유입TP(mg/L)": item.inflAssctBfrWqltTp,
|
||||
"유출BOD(mg/L)": item.efflWqltBod,
|
||||
"유출TOC(COD)(mg/L)": item.efflWqltToc,
|
||||
"유출SS(mg/L)": item.efflWqltSs,
|
||||
"유출TN(mg/L)": item.efflWqltTn,
|
||||
"유출TP(mg/L)": item.efflWqltTp,
|
||||
/* "강우량(mm/일)": item.infoRnDay?item.infoRnDay.toString():"0.0", */
|
||||
"유입BOD(mg/L)": CommaToNumber(item.inflAssctBfrWqltBod),
|
||||
"유입TOC(COD)(mg/L)": CommaToNumber(item.inflAssctBfrWqltToc),
|
||||
"유입SS(mg/L)": CommaToNumber(item.inflAssctBfrWqltSs),
|
||||
"유입TN(mg/L)": CommaToNumber(item.inflAssctBfrWqltTn),
|
||||
"유입TP(mg/L)": CommaToNumber(item.inflAssctBfrWqltTp),
|
||||
"유출BOD(mg/L)": CommaToNumber(item.efflWqltBod),
|
||||
"유출TOC(COD)(mg/L)": CommaToNumber(item.efflWqltToc),
|
||||
"유출SS(mg/L)": CommaToNumber(item.efflWqltSs),
|
||||
"유출TN(mg/L)": CommaToNumber(item.efflWqltTn),
|
||||
"유출TP(mg/L)": CommaToNumber(item.efflWqltTp),
|
||||
"강우량(mm/일)": CommaToNumber(item.infoRnDay?item.infoRnDay.toString():"0.0"),
|
||||
});
|
||||
});
|
||||
}
|
||||
if (excelDownList && excelDownList.length > 0) {
|
||||
downloadExcel({ data: JSON.parse(JSON.stringify(excelDownList)), fileName: searchYear+'년 '+fcltyName + ' 수질현황', sheetNameArray: [fcltyName + ' 수질현황'], headerRange: 'A1:K1' });
|
||||
downloadExcelFormat(
|
||||
{ data: JSON.parse(JSON.stringify(excelDownList))
|
||||
, fileName: searchYear+'년 '+fcltyName + ' 수질현황'
|
||||
, sheetNameArray: [fcltyName + ' 수질현황']
|
||||
, headerRange: 'A1:L1'
|
||||
, decimalArray1: [1,2,3,6,7,8,11]
|
||||
, decimalArray3: [4,5,9,10]
|
||||
});
|
||||
} else if (prevExcelListRef.current && prevExcelListRef.current.length > 0) {
|
||||
alert('다운받을 데이터가 없습니다.');
|
||||
}
|
||||
|
||||
@@ -8,12 +8,12 @@
|
||||
|
||||
import { useFoStore } from "@/app/store";
|
||||
import type { TableUpperProps } from "@/app/store/common";
|
||||
import { ContentsDiv, downloadExcel, MainDiv, SearchBaseForm, SearchInput, SelectBox, Title, UiModal, UiTable, type ReturnType } from "@common/business_components";
|
||||
import type { FacilityWaterQltyProps } from "@/app/store/facilityWaterQlty";
|
||||
import { ContentsDiv, downloadExcelFormat, MainDiv, SearchBaseForm, SearchInput, SelectBox, Title, UiModal, UiTable, type ReturnType } from "@common/business_components";
|
||||
import ListDiv from "@common/business_components/ui/list_div";
|
||||
import LoadingOverlay from "@common/business_components/ui/loadingBar";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import WaterQualityModal from "./modal/page";
|
||||
import type { FacilityWaterQltyProps } from "@/app/store/facilityWaterQlty";
|
||||
import LoadingOverlay from "@common/business_components/ui/loadingBar";
|
||||
|
||||
export default function ProcessFacilitySearch() {
|
||||
const { Common
|
||||
@@ -144,12 +144,23 @@ export default function ProcessFacilitySearch() {
|
||||
|
||||
useEffect(() => {
|
||||
if (excelList && excelList.length > 0) {
|
||||
downloadExcel({
|
||||
downloadExcelFormat(
|
||||
{
|
||||
data: excelList as unknown as JSON[],
|
||||
fileName: '시설별 수질현황',
|
||||
sheetNameArray: ['시설별 수질현황'],
|
||||
headerRange: 'A1:T1',
|
||||
decimalArray1:[10,11,12,15,16,17],
|
||||
decimalArray3:[13,14,18,19]
|
||||
}
|
||||
);
|
||||
|
||||
/* downloadExcel({
|
||||
data: excelList as unknown as JSON[],
|
||||
fileName: '시설별 수질현황',
|
||||
sheetNameArray: ['시설별 수질현황'],
|
||||
headerRange: 'A1:T1'
|
||||
});
|
||||
}); */
|
||||
}
|
||||
}, [excelList]);
|
||||
|
||||
|
||||
@@ -15,6 +15,7 @@ import type { ReturnType } from "../../../../components/common/FacilityTermModal
|
||||
import { roundUp } from "@/app/store/common";
|
||||
import { roundNumber } from "@/app/components/common/DataForm";
|
||||
import UnderComment from "@/app/components/common/UnderComment";
|
||||
import CommaToNumber from "@/app/components/common/CommaToNumber";
|
||||
|
||||
const tabList = [
|
||||
{ value: 'tab_term_year', label: '연간' },
|
||||
@@ -186,11 +187,11 @@ export default function FlowRateModal(props: { fcltyName: string; facilityCd: st
|
||||
copyYearList.forEach((item) => {
|
||||
excelDownList.push({
|
||||
"날짜": item.msrDt,
|
||||
"총유입량(m³/일)": item.totInflAmnt,
|
||||
"하수유입량(m³/일)": item.inflAmnt,
|
||||
"연계처리량(m³/일)": item.sumFlow,
|
||||
"총인반류수량(m³/일)": item.returnAmnt,
|
||||
"방류량(m³/일)": item.efflAmnt,
|
||||
"총유입량(m³/일)": CommaToNumber(item.totInflAmnt),
|
||||
"하수유입량(m³/일)": CommaToNumber(item.inflAmnt),
|
||||
"연계처리량(m³/일)": CommaToNumber(item.sumFlow),
|
||||
"총인반류수량(m³/일)": CommaToNumber(item.returnAmnt),
|
||||
"방류량(m³/일)": CommaToNumber(item.efflAmnt),
|
||||
/* "강우량(mm/일)": item.infoRnDay, */
|
||||
});
|
||||
});
|
||||
|
||||
@@ -7,12 +7,12 @@
|
||||
"use client"
|
||||
import { useFoStore } from "@/app/store";
|
||||
import type { TableUpperProps } from "@/app/store/common";
|
||||
import { ContentsDiv, downloadExcel, MainDiv, SearchBaseForm, SearchInput, SelectBox, Title, UiModal, UiTable, type ReturnType } from "@common/business_components";
|
||||
import type { ExcelType } from "@/app/store/flowRate";
|
||||
import { ContentsDiv, downloadExcelFormat, MainDiv, SearchBaseForm, SearchInput, SelectBox, Title, UiModal, UiTable, type ReturnType } from "@common/business_components";
|
||||
import ListDiv from "@common/business_components/ui/list_div";
|
||||
import LoadingOverlay from "@common/business_components/ui/loadingBar";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
import FlowRateModal from "./modal/page";
|
||||
import type { ExcelType } from "@/app/store/flowRate";
|
||||
import LoadingOverlay from "@common/business_components/ui/loadingBar";
|
||||
|
||||
export default function ProcessFacilitySearch() {
|
||||
const {Common
|
||||
@@ -140,7 +140,7 @@ export default function ProcessFacilitySearch() {
|
||||
|
||||
useEffect(() => {
|
||||
if (excelList && excelList.length > 0) {
|
||||
downloadExcel({ data: JSON.parse(JSON.stringify(excelList)), fileName: '시설별 유량현황', sheetNameArray: ['시설별 유량현황'], headerRange: 'A1:O1' });
|
||||
downloadExcelFormat({ data: JSON.parse(JSON.stringify(excelList)), fileName: '시설별 유량현황', sheetNameArray: ['시설별 유량현황'], headerRange: 'A1:O1', decimalArray0: [9,10,11,12,13,14] });
|
||||
} else if (prevExcelListRef.current && prevExcelListRef.current.length > 0) {
|
||||
alert('다운받을 데이터가 없습니다.');
|
||||
}
|
||||
|
||||
@@ -5,10 +5,9 @@
|
||||
*/
|
||||
|
||||
"use client"
|
||||
import { roundNumber } from "@/app/components/common/DataForm";
|
||||
import { useFoStore } from "@/app/store";
|
||||
import type { TableUpperProps } from "@/app/store/dashboard";
|
||||
import { downloadExcel, filePickedBlobArray, UITab, UiTable } from "@common/business_components/ui";
|
||||
import { downloadExcelFormat, filePickedBlobArray, UITab, UiTable } from "@common/business_components/ui";
|
||||
import ListDiv from "@common/business_components/ui/list_div";
|
||||
import {
|
||||
TabsContent
|
||||
@@ -118,7 +117,7 @@ export default function ProcessFacilityInfoModal(props: ModalType) {
|
||||
{ value: 'common_info', label: '기본정보' },
|
||||
{ value: 'history_info', label: '이력정보' },
|
||||
];
|
||||
const fctCpc = props.fctCpc ? props.fctCpc.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : '';
|
||||
const fctCpc = props.fctCpc ? Number(props.fctCpc).toLocaleString() : '';
|
||||
const upHeadListPlanInfoChange = headMakeList(upHeadListPlanInfo, 2);
|
||||
const upHeadListFcltyHistInfoChange = headMakeList(upHeadListFcltyHistInfo, 3);
|
||||
const upHeadListFcltyWaterQltyInfoChange = headMakeList(upHeadListFcltyWaterQltyInfo, 4);
|
||||
@@ -137,12 +136,12 @@ export default function ProcessFacilityInfoModal(props: ModalType) {
|
||||
"준공일": item.cmplDt,
|
||||
"시운전완료일": item.trlrnCmplDt,
|
||||
"가동개시일": item.rnDt,
|
||||
"시설용량(m³/일)": roundNumber(item.fctCpc,0),
|
||||
"시설용량(m³/일)": item.fctCpc&&item.fctCpc.toString().trim()!=''?Number(item.fctCpc.toString().replaceAll(',','')):'',
|
||||
});
|
||||
});
|
||||
}
|
||||
if (excelDownList && excelDownList.length > 0) {
|
||||
downloadExcel({ data: JSON.parse(JSON.stringify(excelDownList)), fileName: props.fcltyName + ' 시설이력관리', sheetNameArray: [props.fcltyName + ' 시설이력관리'], headerRange: 'A1:I1' });
|
||||
downloadExcelFormat({ data: JSON.parse(JSON.stringify(excelDownList)), fileName: props.fcltyName + ' 시설이력관리', sheetNameArray: [props.fcltyName + ' 시설이력관리'], headerRange: 'A1:I1' });
|
||||
} else if (gridListFcltyHistInfo.length == 0) {
|
||||
alert('다운받을 데이터가 없습니다.');
|
||||
}
|
||||
@@ -223,9 +222,9 @@ export default function ProcessFacilityInfoModal(props: ModalType) {
|
||||
<thead>
|
||||
<TableRow className="">
|
||||
<TableHead className="w-1/6">{'시설명'}</TableHead>
|
||||
<TableCell className="w-1/6">{props.fcltyName}</TableCell>
|
||||
<TableHead className="w-1/6">{'시설구분'}</TableHead>
|
||||
<TableCell className="w-1/6">{props.bscFctClsNm}</TableCell>
|
||||
<TableCell className="w-1/6" colSpan={3}>{props.fcltyName}</TableCell>
|
||||
{/* <TableHead className="w-1/6">{'시설구분'}</TableHead>
|
||||
<TableCell className="w-1/6">{props.bscFctClsNm}</TableCell> */}
|
||||
<TableHead className="w-1/6">{'시설용량(m³/일)'}</TableHead>
|
||||
<TableCell className="w-1/6">{fctCpc}</TableCell>
|
||||
</TableRow>
|
||||
|
||||
@@ -210,12 +210,13 @@ export default function ProcessFacilitySearch() {
|
||||
const cellClick = (index: number) => {
|
||||
const facility = processFacilityList[index];
|
||||
if (facility) {
|
||||
const fctCpc = String(facility.fctCpc).replace(/,/g, "").trim();
|
||||
setModalFcltyNm(facility.bscFctNm);
|
||||
setModalFcltyCd(facility.bscFctCd);
|
||||
setModalSido(facility.sido);
|
||||
setModalGugun(facility.gugun);
|
||||
setModalAddr(facility.daddr);
|
||||
setModalFctCpc(Number(facility.fctCpc));
|
||||
setModalFctCpc(Number(fctCpc));
|
||||
setModalTrtFrfNm(facility.trtFrfNm);
|
||||
setModalRnDt(facility.rnDt);
|
||||
setModalCmplDt(facility.cmplDt);
|
||||
|
||||
@@ -53,9 +53,9 @@ export type planFcltyListProps = {
|
||||
export type OperationalStatusListProps = {
|
||||
flowRate : string,
|
||||
waterQlty : string,
|
||||
yearAvg : number | string | '',
|
||||
yearMax : number | string | '',
|
||||
yearMin : number | string | '',
|
||||
yearAvg : number | '',
|
||||
yearMax : number | '',
|
||||
yearMin : number | '',
|
||||
summerAll : number | string | '',
|
||||
summerThree : number | string | '',
|
||||
summerRain : number | string | '',
|
||||
@@ -1246,9 +1246,7 @@ const changeValue=(operationalStatus, data, keyTxt = 'INFL_AMNT')=>{
|
||||
operationalStatus.winterSunnyAvg = data.winterSunny ? (keyTxt.includes('_TP') || keyTxt.includes("_TN"))? data.winterSunny?Number(Math.round(data.winterSunny["AVG_" + keyTxt] * 1000) / 1000).toFixed(3).toString():'': data.winterSunny["AVG_" + keyTxt] : '';
|
||||
operationalStatus.winterSunnyMax = data.winterSunny ? (keyTxt.includes('_TP') || keyTxt.includes("_TN"))? data.winterSunny?Number(Math.round(data.winterSunny["MAX_" + keyTxt] * 1000) / 1000).toFixed(3).toString():'': data.winterSunny["MAX_" + keyTxt] : '';
|
||||
// 지하수
|
||||
operationalStatus.groundWaterAvg = 10;
|
||||
operationalStatus.groundWaterSummer = 11;
|
||||
operationalStatus.groundWaterWinter = 12;
|
||||
|
||||
// 오염물질
|
||||
// RDII 추정 = 하절기(6~8월) 중 최저 유입 BOD일때 유입유량 x ((동절기 청천시 유입BOD - 하절기(6~8월) 중 최저 유입BOD) / (동절기 청천시 유입BOD))
|
||||
const summerLowFlow = data.summerBod && data.summerBod.INFL_AMNT && data.summerBod.INFL_AMNT != 'null' ? Number(data.summerBod.INFL_AMNT) : 0;
|
||||
|
||||
@@ -3,6 +3,7 @@ import DataForm, { roundNumber } from "@/app/components/common/DataForm";
|
||||
import type { TableUpperProps } from "../dashboard";
|
||||
import CalcRainEffect from "@/app/components/common/CalcRainEffect";
|
||||
import { COD_YEAR } from "../common";
|
||||
import CommaToNumber from "@/app/components/common/CommaToNumber";
|
||||
export type { TableUpperProps };
|
||||
|
||||
/**====================================
|
||||
@@ -70,17 +71,17 @@ export interface ExcelType {
|
||||
시군구: string,
|
||||
시설이름: string,
|
||||
주소: string,
|
||||
"시설용량(m³/일)": number,
|
||||
"유입BOD(mg/L)": string | '',
|
||||
"유입TOC(mg/L)": string | '',
|
||||
"유입SS(mg/L)": string | '',
|
||||
"유입TN(mg/L)": string | '',
|
||||
"유입TP(mg/L)": string | '',
|
||||
"유출BOD(mg/L)": string | '',
|
||||
"유출TOC(mg/L)": string | '',
|
||||
"유출SS(mg/L)": string | '',
|
||||
"유출TN(mg/L)": string | '',
|
||||
"유출TP(mg/L)": string | '',
|
||||
"시설용량(m³/일)": number | '',
|
||||
"유입BOD(mg/L)": number | '',
|
||||
"유입TOC(mg/L)": number | '',
|
||||
"유입SS(mg/L)": number | '',
|
||||
"유입TN(mg/L)": number | '',
|
||||
"유입TP(mg/L)": number | '',
|
||||
"유출BOD(mg/L)": number | '',
|
||||
"유출TOC(mg/L)": number | '',
|
||||
"유출SS(mg/L)": number | '',
|
||||
"유출TN(mg/L)": number | '',
|
||||
"유출TP(mg/L)": number | '',
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -104,17 +105,17 @@ export interface WaterQualityHistoryResponse {
|
||||
|
||||
export type modalExcelType = {
|
||||
날짜: string;
|
||||
"유입BOD(mg/L)": string;
|
||||
"유입TOC(COD)(mg/L)": string;
|
||||
"유입SS(mg/L)": string;
|
||||
"유입TN(mg/L)": string;
|
||||
"유입TP(mg/L)": string;
|
||||
"유출BOD(mg/L)": string;
|
||||
"유출TOC(COD)(mg/L)": string;
|
||||
"유출SS(mg/L)": string;
|
||||
"유출TN(mg/L)": string;
|
||||
"유출TP(mg/L)": string;
|
||||
/* "강우량(mm/일)": string; */
|
||||
"유입BOD(mg/L)": number | '';
|
||||
"유입TOC(COD)(mg/L)": number | '';
|
||||
"유입SS(mg/L)": number | '';
|
||||
"유입TN(mg/L)": number | '';
|
||||
"유입TP(mg/L)": number | '';
|
||||
"유출BOD(mg/L)": number | '';
|
||||
"유출TOC(COD)(mg/L)": number | '';
|
||||
"유출SS(mg/L)": number | '';
|
||||
"유출TN(mg/L)": number | '';
|
||||
"유출TP(mg/L)": number | '';
|
||||
"강우량(mm/일)": number | '';
|
||||
}
|
||||
|
||||
/**====================================
|
||||
@@ -486,17 +487,17 @@ export const facilityWaterQltyReducer = (set: (fn: (state: FacilityWaterQltyType
|
||||
시군구: item.sggNm,
|
||||
시설이름: item.bscFctNm,
|
||||
주소: item.addr,
|
||||
"시설용량(m³/일)": item.fctCpc,
|
||||
"유입BOD(mg/L)": item.inflAssctBfrWqltBod,
|
||||
"유입TOC(mg/L)": item.inflAssctBfrWqltToc,
|
||||
"유입SS(mg/L)": item.inflAssctBfrWqltSs,
|
||||
"유입TN(mg/L)": item.inflAssctBfrWqltTn,
|
||||
"유입TP(mg/L)": item.inflAssctBfrWqltTp,
|
||||
"유출BOD(mg/L)": item.efflWqltBod,
|
||||
"유출TOC(mg/L)": item.efflWqltToc,
|
||||
"유출SS(mg/L)": item.efflWqltSs,
|
||||
"유출TN(mg/L)": item.efflWqltTn,
|
||||
"유출TP(mg/L)": item.efflWqltTp,
|
||||
"시설용량(m³/일)": CommaToNumber(item.fctCpc),
|
||||
"유입BOD(mg/L)": CommaToNumber(item.inflAssctBfrWqltBod),
|
||||
"유입TOC(mg/L)": CommaToNumber(item.inflAssctBfrWqltToc),
|
||||
"유입SS(mg/L)": CommaToNumber(item.inflAssctBfrWqltSs),
|
||||
"유입TN(mg/L)": CommaToNumber(item.inflAssctBfrWqltTn),
|
||||
"유입TP(mg/L)": CommaToNumber(item.inflAssctBfrWqltTp),
|
||||
"유출BOD(mg/L)": CommaToNumber(item.efflWqltBod),
|
||||
"유출TOC(mg/L)": CommaToNumber(item.efflWqltToc),
|
||||
"유출SS(mg/L)": CommaToNumber(item.efflWqltSs),
|
||||
"유출TN(mg/L)": CommaToNumber(item.efflWqltTn),
|
||||
"유출TP(mg/L)": CommaToNumber(item.efflWqltTp),
|
||||
});
|
||||
});
|
||||
}else{
|
||||
|
||||
@@ -3,6 +3,7 @@ import type { TableUpperProps } from "../dashboard";
|
||||
import DataForm, { roundNumber } from "@/app/components/common/DataForm";
|
||||
import CalcRainEffect from "@/app/components/common/CalcRainEffect";
|
||||
import { fetchFacilityWaterQltyListHist } from "../facilityWaterQlty";
|
||||
import CommaToNumber from "@/app/components/common/CommaToNumber";
|
||||
|
||||
/**====================================
|
||||
* Store - 타입
|
||||
@@ -300,11 +301,11 @@ export const flowRateSearchReducer:(set:(fn: (state: FlowRateSearchType) => Flow
|
||||
시설이름: item.bscFctNm,
|
||||
주소: item.daddr,
|
||||
"시설용량(m³/일)": item.fctCpc,
|
||||
"총유입량(m³/일)": item.totInflAmnt,
|
||||
"하수유입량(m³/일)": item.inflAmnt,
|
||||
"연계처리량(m³/일)": item.sumFlow,
|
||||
"총인반류수량(m³/일)": item.returnAmnt,
|
||||
"방류량(m³/일)": item.efflAmnt,
|
||||
"총유입량(m³/일)": CommaToNumber(item.totInflAmnt),
|
||||
"하수유입량(m³/일)": CommaToNumber(item.inflAmnt),
|
||||
"연계처리량(m³/일)": CommaToNumber(item.sumFlow),
|
||||
"총인반류수량(m³/일)": CommaToNumber(item.returnAmnt),
|
||||
"방류량(m³/일)": CommaToNumber(item.efflAmnt),
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@ NEXT_PUBLIC_AUTH_USER_ID = token-id
|
||||
NEXT_PUBLIC_ACCESS_TOKEN = access-token
|
||||
NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
|
||||
NEXT_PUBLIC_PORT = 3000
|
||||
NEXT_PUBLIC_PROXY_HOST = https://sn.hasuon.or.kr
|
||||
NEXT_PUBLIC_PROXY_HOST = https://lion.hasuon.or.kr
|
||||
NEXT_PUBLIC_GEOSERVER_URL = http://172.29.143.87:8080/geoserver
|
||||
NEXT_PUBLIC_LX_GEOSERVER_URL = http://172.29.143.87:8080/geoserver_swl
|
||||
NEXT_PUBLIC_NGII_URL = http://10.98.25.94:18080/openapi/Gettile.do?apiKey=BDE2BEF39DAFEC293AB6730150F222AC
|
||||
|
||||
+6
-10
@@ -1,9 +1,9 @@
|
||||
NEXT_PUBLIC_SITE_ID = WR
|
||||
NEXT_PUBLIC_PORT = 3000
|
||||
NEXT_PUBLIC_PROXY_HOST = http://wr.hasuon.or.kr
|
||||
NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_FO_SERVER_API_URL = https://wr.hasuon.or.kr/operation-service/api/v1
|
||||
NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_PROXY_HOST = https://tiger.hasuon.or.kr
|
||||
NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
|
||||
NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
|
||||
NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
|
||||
NEXT_PUBLIC_GEOSERVER_URL = http://172.29.143.87:8080/geoserver
|
||||
NEXT_PUBLIC_LX_GEOSERVER_URL = http://172.29.143.87:8080/geoserver_swl
|
||||
@@ -11,13 +11,9 @@ NEXT_PUBLIC_CLAIM_NAME = Authorization
|
||||
NEXT_PUBLIC_AUTH_USER_ID = token-id
|
||||
NEXT_PUBLIC_ACCESS_TOKEN = access-token
|
||||
NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
|
||||
NEXT_PUBLIC_WR_SERVER_API_URL = https://wr.hasuon.or.kr/reuse-service/api/v1
|
||||
NEXT_PUBLIC_SEWERAGE_API_URL = https://wr.hasuon.or.kr/sewerage-service/api
|
||||
NEXT_PUBLIC_WR_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/reuse-service/api/v1
|
||||
NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/sewerage-service/api
|
||||
NEXT_PUBLIC_NGII_URL = http://10.98.25.94:18080/openapi/Gettile.do?apiKey=BDE2BEF39DAFEC293AB6730150F222AC
|
||||
#NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000/api/v1
|
||||
#NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000/operation-service/api/v1
|
||||
#NEXT_PUBLIC_GEOSERVER_URL = https://hasudo.geo.rsonesoft.com/geoserver
|
||||
#NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-dev.svc.cluster.local:8000/sewerage-service/api
|
||||
|
||||
|
||||
NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
|
||||
|
||||
@@ -6,6 +6,10 @@ type ExcelDownloadProps = {
|
||||
fileName: string;
|
||||
sheetNameArray: string[];
|
||||
headerRange?: string;
|
||||
decimalArray0? : number[];
|
||||
decimalArray1? : number[];
|
||||
decimalArray2? : number[];
|
||||
decimalArray3? : number[];
|
||||
}
|
||||
|
||||
export const downloadExcel = ({ data, fileName = new Date().getTime().toString() + '.xlsx', sheetNameArray = ["Sheet1"], headerRange='A1:V3'}: ExcelDownloadProps) => {
|
||||
@@ -15,6 +19,45 @@ export const downloadExcel = ({ data, fileName = new Date().getTime().toString()
|
||||
excelStyle(XLSX.write(workbook, { bookType: "xlsx", type: "buffer" }), headerRange, fileName);
|
||||
};
|
||||
|
||||
export const downloadExcelFormat = ({ data, fileName = new Date().getTime().toString() + '.xlsx', sheetNameArray = ["Sheet1"], headerRange='A1:V3', decimalArray0=[], decimalArray1=[], decimalArray2=[], decimalArray3=[]}: ExcelDownloadProps) => {
|
||||
const worksheet = XLSX.utils.json_to_sheet(Array.isArray(data) ? data : [data]);
|
||||
const workbook = XLSX.utils.book_new();
|
||||
XLSX.utils.book_append_sheet(workbook, worksheet, sheetNameArray[0]);
|
||||
console.log('decimalArray0 : ', decimalArray0);
|
||||
const headerEnd = XLSX.utils.decode_range(headerRange).e.r; // 0-based index
|
||||
const startRow = headerEnd + 1;
|
||||
|
||||
// 🔹 전체 범위
|
||||
const range = XLSX.utils.decode_range(worksheet["!ref"] as string);
|
||||
|
||||
const chaneValue = (array: number[], decimal: number) => {
|
||||
for (let row = startRow; row <= range.e.r; row++) {
|
||||
if(array.length>0){
|
||||
for(let idx=0; idx<array.length; idx++){
|
||||
const cellAddr = XLSX.utils.encode_cell({ r: row, c: Number(array[idx]) });
|
||||
const cell = worksheet[cellAddr];
|
||||
if (cell && typeof cell.v === "number") {
|
||||
if(decimal===1){
|
||||
cell.z = "#,##0.0"; // 소수점 3자리
|
||||
}else if(decimal===2){
|
||||
cell.z = "#,##0.00";
|
||||
}else if(decimal===3){
|
||||
cell.z = "#,##0.000";
|
||||
}else{
|
||||
cell.z = "#,##0"; // 기본 천단위 콤마
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
chaneValue(decimalArray0, 0);
|
||||
chaneValue(decimalArray1, 1);
|
||||
chaneValue(decimalArray2, 2);
|
||||
chaneValue(decimalArray3, 3);
|
||||
excelStyle(XLSX.write(workbook, { bookType: "xlsx", type: "buffer" }), headerRange, fileName);
|
||||
};
|
||||
|
||||
export type SheetParameter = {
|
||||
data: any[][];
|
||||
headerNum: number;
|
||||
|
||||
Reference in New Issue
Block a user