수요처관리, 잠재수요처 관리 엑셀 다운로드

This commit is contained in:
jyha00
2025-06-05 13:30:08 +09:00
parent 8cadc99097
commit ca369c3acb
8 changed files with 340 additions and 172 deletions
+152 -81
View File
@@ -3,35 +3,54 @@
import { useWrStore } from "@/app/store";
import { btnClass } from "@/app/store/common/code";
import type { customCoSttnBdst } from "@/app/store/matDmd/coSttn";
import { getCityOrSgg, tableData } from "@/components/lib/func/commom";
import { excelDownload, getCity, getCityOrSgg, tableData } from "@/components/lib/func/commom";
import {
ContentsDiv,
SearchBaseForm,
SearchDiv,
SearchFormLeft,
SearchFormRight,
SearchInput,
SelectBox,
Title,
UiModal,
UiTable,
type ReturnType
type ReturnType,
type SelectDataType
} from "@common/business_components/ui";
import ListDiv from "@common/business_components/ui/list_div";
import { Button } from "@common/components/ui";
import { Button, DatePicker, Label } from "@common/components/ui";
import { useCallback, useEffect, useRef, useState } from "react";
import SdmInsertForm, { type DemandCompType } from "@common/business_components/ui/sdmInsertForm";
import type { objSearchType } from "@/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal";
export default function coSttn() {
export default function CoSttn() {
const [bdstTable, setBdstTable] = useState<customCoSttnBdst[]>();
const [pageNation, setPageNation] = useState(1);
const { code, coSttn, coSttnInit, getDemandCompList,regDemandCompany,demandCompList} = useWrStore((state) => state);
const { coSttnRes } = coSttn;
const [isDmdModal, setIsDmdModal] = useState<{isMoal: boolean, data: DemandCompType}>({isMoal: false, data: {} as DemandCompType})
const [pageNation, setPageNation] = useState(1);
const { code, coSttn, coSttnInit, coSttnSearch, getDemandCompList, regDemandCompany, demandCompList } = useWrStore((state) => state);
const { coSttnRes } = coSttn;
const [isDmdModal, setIsDmdModal] = useState<{ isMoal: boolean, data: DemandCompType }>({ isMoal: false, data: {} as DemandCompType })
const [fromDate, setFromDate] = useState<Date>(new Date());
const [toDate, setToDate] = useState<Date>(new Date());
const [selectSgg, setSelectSgg] = useState<SelectDataType[] | []>()
const [objSearch, setObjSearch] = useState<objSearchType>({ sgg: "", city: "" });
const ref = useRef<ReturnType>({} as ReturnType);
const codeData = getCityOrSgg(ref);
const excelClick = useCallback(() => {
}, []);
const getSelCity = (val: string | number) => {
const cityValue = String(val); // Ensure val is treated as a string
const data = getCity(cityValue, code.sggCd);
setSelectSgg(data);
setObjSearch({ city: cityValue, sgg: '' });
};
const getSgg = (val: string | number) => {
console.log(val);
setObjSearch({ ...objSearch, sgg: String(val) })
};
useEffect(() => {
if (!coSttn.isInit) {
@@ -41,65 +60,117 @@ export default function coSttn() {
useEffect(() => {
if (coSttnRes.length > 0 && code.cityCd.length > 0) {
const data = tableData(coSttnRes, { code });
const chData = data
.map((item: any) => ({
...item
}))
// .filter((item: any) => item !== undefined);
setBdstTable(chData);
}
}, [coSttnRes])
const data = tableData(coSttnRes, { code });
const chData = data
.map((item: any) => ({
...item
}))
// .filter((item: any) => item !== undefined);
setBdstTable(chData);
}
}, [coSttnRes]);
return(
useEffect(() => {
if (coSttn.excelList.length > 0) {
if (coSttn.excelList.length === 0) return;
excelDownload(
coSttn.excelList,
"수요처 관리",
"sample_coSttn.xlsx",
"A1:F1",
2
);
}
}, [coSttn.excelList]);
const excelClick = useCallback(() => {
console.log("??")
coSttnSearch("마인드원", 1);
}, [coSttnSearch]);
return (
<>
<ContentsDiv>
<div className="grid grid-cols-4 gap-4 ">
<div className="col-span-4">
<Title title={"수요처 관리"} />
<SearchBaseForm
selectSidoData={code.cityCd}
selectSigunData={code.sggCd}
selectRegionData={code.rvbsnCd}
selectUnitWaterShedData={code.lgbsnCd}
selectMiddleRegionData={code.mdmbsnCd}
selectEnvPartData={code.lclgvrnmntCd}
rightChildren={
<div>
<SearchDiv>
<SearchFormLeft>
<div className="col-span-10 flex flex-row">
<SelectBox
className="col-span-2 w-1/6 h-full text-2xl"
label="시도"
selectClass={""}
selectArray={code.cityCd || []}
onSelectValue={getSelCity}
/>
<SelectBox
className="col-span-2 w-1/6 h-full text-2xl"
label="시군구"
selectClass={""}
selectArray={selectSgg || []}
onSelectValue={getSgg}
/>
<div className="col-span-5 w-auto">
<div className="flex flex-row items-center">
<Label className="text-xl text-gray-600">수요신청년도</Label>
<div className="flex flex-row w-1/4">
<DatePicker mode={'single'}
selected={fromDate}
onSelect={(date: Date | undefined) => { if (date) setFromDate(date) }} />
<span>~</span>
<DatePicker mode={'single'}
selected={toDate}
onSelect={(date: Date | undefined) => { if (date) setToDate(date) }} />
</div>
</div>
</div>
<SearchInput
className={"text-2xl"}
label="회사명"
textValue={""}
setText={(e) => {
}}
/>
</div>
</SearchFormLeft>
<SearchFormRight
className="w-2/12 mx-5 flex flex-col items-center justify-center space-x-2 ">
<div className="flex flex-row space-x-2">
<Button
className={btnClass}
onClick={() => {
setIsDmdModal({ ...isDmdModal, isMoal:true });
}}
size={"sm"}
onClick={(e) => { }}
>
조회
</Button>
<Button
size={"sm"}
className={btnClass}
onClick={() => {
setIsDmdModal({ ...isDmdModal, isMoal: true });
}}
>
등록
</Button>
<Button
className={btnClass}
onClick={() => {
/* 저장 로직 */
}}
size={"sm"}
className={btnClass}
onClick={() => {
/* 저장 로직 */
}}
>
저장
</Button>
<Button
size={"sm"}
className={`${btnClass} green`}
onClick={excelClick}
>
다운로드
</Button>
</div>
}
leftChildren={undefined}
queryClick={function (returnType: ReturnType): void {
// '{partValue: 'A', sidoValue: '0', sigunValue: '0', regionValue: '0', unitWaterShedValue: '0', …}'
let con;
if (returnType.sigunValue != "0") {
con = returnType.sigunValue;
} else {
con = returnType.sidoValue;
}
// coSttnSearch(1, "20", con);
}}
excelClick={excelClick}
initClick={function (): void {}}
btnClass={btnClass}
ref={ref}
/>
</SearchFormRight>
</SearchDiv>
</div>
</div>
<div className="grid grid-cols-6 gap-4 ">
@@ -111,35 +182,35 @@ export default function coSttn() {
headlist={coSttn.coSttHeadList}
pageSize={20}
total={10000}
cellClick={(index: number | undefined,headId:string)=>{} }
cellClick={(index: number | undefined, headId: string) => { }}
onPageChange={setPageNation}
></UiTable>
</ListDiv>
</div>
</div>
<UiModal
bodyClass={"w-[40vw] max-w-none h-[90vh]"}
open={isDmdModal.isMoal}
onOpenChange={() => {
setIsDmdModal({ isMoal: false, data: {} as DemandCompType });
}}
body={
<SdmInsertForm
selectSidoData={code.cityCd}
selectSigunData={code.sggCd}
dataList={demandCompList}
rtnValue={(searchText: string, pageCnt: number) => {
getDemandCompList(searchText, pageCnt);
}}
rtnInputData={(data) => {
console.log(" rtn data ", data);
regDemandCompany(data as DemandCompType);
setIsDmdModal({ isMoal: false, data: data as DemandCompType });
}}
bodyClassNm={"w-full mx-auto bg-white rounded-lg shadow-md p-6"}
></SdmInsertForm>
}
></UiModal>
<UiModal
bodyClass={"w-[40vw] max-w-none h-[90vh]"}
open={isDmdModal.isMoal}
onOpenChange={() => {
setIsDmdModal({ isMoal: false, data: {} as DemandCompType });
}}
body={
<SdmInsertForm
selectSidoData={code.cityCd}
selectSigunData={code.sggCd}
dataList={demandCompList}
rtnValue={(searchText: string, pageCnt: number) => {
getDemandCompList(searchText, pageCnt);
}}
rtnInputData={(data) => {
console.log(" rtn data ", data);
regDemandCompany(data as DemandCompType);
setIsDmdModal({ isMoal: false, data: data as DemandCompType });
}}
bodyClassNm={"w-full mx-auto bg-white rounded-lg shadow-md p-6"}
></SdmInsertForm>
}
></UiModal>
</ContentsDiv>
</>
+122 -76
View File
@@ -1,109 +1,158 @@
"use client";
import { useWrStore } from "@/app/store";
import { Button } from "@common/components/ui";
import { btnClass } from "@/app/store/common/code";
import ListDiv from "@common/business_components/ui/list_div";
import type { customCoBdst } from "@/app/store/matDmd/coReg";
import {
excelDownload,
getCity,
tableData,
} from "@/components/lib/func/commom";
import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
import type { customCoBdst } from "@/app/store/matDmd/coReg";
import CoRegExcel from "@/components/ui/modal/coReg/coRegExcel/coRegExcel";
import type { objSearchType } from "@/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal";
import CoDetailModal from "@/components/ui/modal/sttn/sttnDetailModal/coDatailModal";
import {
ContentsDiv,
SearchBaseForm,
SearchDiv,
SearchFormLeft,
SearchFormRight,
SearchInput,
SelectBox,
Title,
UiModal,
UiTable,
type ReturnType,
type SelectDataType,
} from "@common/business_components/ui";
import CoDetailModal from "@/components/ui/modal/sttn/sttnDetailModal/coDatailModal";
import CoRegExcel from "@/components/ui/modal/coReg/coRegExcel/coRegExcel";
import ListDiv from "@common/business_components/ui/list_div";
import { Button, DatePicker, Label } from "@common/components/ui";
import { useCallback, useEffect, useRef, useState } from "react";
export default function ldrmntCoSttn() {
export default function LdrmntCoSttn() {
const { code, ldrmntCoSttn } = useWrStore(
(state) => state
(state) => state
);
const { ldrmntCoSttnRes } = ldrmntCoSttn;
const [bdstTable, setBdstTable] = useState<customCoBdst[]>();
const [detailModal, setDetailModal] = useState<{isOpen:boolean,data:customCoBdst|undefined}>({data:undefined,isOpen:false })
const [detailModal, setDetailModal] = useState<{ isOpen: boolean, data: customCoBdst | undefined }>({ data: undefined, isOpen: false })
const [pageNation, setPageNation] = useState(1);
const [isRegExcel, setIsRegExcel] = useState(false);
const [selectSgg, setSelectSgg] = useState<SelectDataType[] | []>()
const [objSearch, setObjSearch] = useState<objSearchType>({ sgg: "", city: "" });
const ref = useRef<ReturnType>({} as ReturnType);
const excelClick = useCallback(() => {
excelDownload(
[[]],
"잠재수요처 관리",
"sample_ldrmntCoSttn.xlsx",
"A1:AL1",
2
);
}, []);
const cellClick=(index:number|undefined, headId: string)=>{
if(index!==undefined && bdstTable!==undefined){
setDetailModal({isOpen:true ,data:bdstTable[index] })
const cellClick = (index: number | undefined, headId: string) => {
if (index !== undefined && bdstTable !== undefined) {
setDetailModal({ isOpen: true, data: bdstTable[index] })
}
}
useEffect(() => {
if (ldrmntCoSttnRes.length > 0 && code.cityCd.length > 0) {
const data = tableData(ldrmntCoSttnRes, { code });
console.log("data", data);
const chData = data
.map((item: any) => ({
...item
}))
.filter((item: any) => item !== undefined);
setBdstTable(chData);
}
}, [code, ldrmntCoSttnRes, ldrmntCoSttn.ldrmntCoSttHeadList]);
const getSelCity = (val: string | number) => {
const cityValue = String(val); // Ensure val is treated as a string
const data = getCity(cityValue, code.sggCd);
setSelectSgg(data);
setObjSearch({ city: cityValue, sgg: '' });
};
return(
const getSgg = (val: string | number) => {
console.log(val);
setObjSearch({ ...objSearch, sgg: String(val) })
};
useEffect(() => {
if (ldrmntCoSttnRes.length > 0 && code.cityCd.length > 0) {
const data = tableData(ldrmntCoSttnRes, { code });
console.log("data", data);
const chData = data
.map((item: any) => ({
...item
}))
.filter((item: any) => item !== undefined);
setBdstTable(chData);
}
}, [code, ldrmntCoSttnRes, ldrmntCoSttn.ldrmntCoSttHeadList]);
return (
<>
<ContentsDiv>
<div className="grid grid-cols-4 gap-4 ">
<div className="col-span-4">
<Title title={"잠재수요처 관리"} />
<SearchBaseForm
selectSidoData={code.cityCd}
selectSigunData={code.sggCd}
selectRegionData={code.rvbsnCd}
selectUnitWaterShedData={code.lgbsnCd}
selectMiddleRegionData={code.mdmbsnCd}
selectEnvPartData={code.lclgvrnmntCd}
rightChildren={
<div>
<SearchDiv>
<SearchFormLeft>
<div className="col-span-10 flex flex-row">
<SelectBox
className="col-span-2 w-1/6 h-full text-2xl"
label="시도"
selectClass={""}
selectArray={code.cityCd || []}
onSelectValue={getSelCity}
/>
<SelectBox
className="col-span-2 w-1/6 h-full text-2xl ml-4"
label="시군구"
selectClass={""}
selectArray={selectSgg || []}
onSelectValue={getSgg}
/>
<SearchInput
className={"text-2xl ml-4"}
label="회사명"
textValue={""}
setText={(e) => {
}}
/>
</div>
</SearchFormLeft>
<SearchFormRight
className="w-2/12 mx-5 flex flex-col items-center justify-center space-x-2 ">
<div className="flex flex-row space-x-2">
<Button
className={btnClass}
onClick={() => setIsRegExcel(!isRegExcel)}
size={"sm"}
onClick={(e) => { }}
>
조회
</Button>
<Button
size={"sm"}
className={btnClass}
onClick={() => { }}
>
엑셀등록
</Button>
<Button
className={btnClass}
onClick={() => {
// 저장 로직
}}
size={"sm"}
className={btnClass}
onClick={() => {
/* 저장 로직 */
}}
>
다운로드
</Button>
<Button
size={"sm"}
className={`${btnClass} green`}
onClick={excelClick}
>
양식받기
</Button>
</div>
}
leftChildren={undefined}
queryClick={function (returnType: ReturnType): void {
// '{partValue: 'A', sidoValue: '0', sigunValue: '0', regionValue: '0', unitWaterShedValue: '0', …}'
let con;
if (returnType.sigunValue != "0") {
con = returnType.sigunValue;
} else {
con = returnType.sidoValue;
}
// ldrmntCoSttnSearch(1, "20", con);
}}
excelClick={excelClick}
initClick={function (): void {}}
btnClass={btnClass}
ref={ref}
/>
</SearchFormRight>
</SearchDiv>
</div>
</div>
<div className="grid grid-cols-6 gap-4 ">
@@ -112,33 +161,30 @@ export default function ldrmntCoSttn() {
<UiTable
headName={[]}
tableData={bdstTable || []}
children={
<HeadMakeColSpan upHeadList={ldrmntCoSttn.ldrmntCoSttNodeList} />
}
headlist={ldrmntCoSttn.ldrmntCoSttHeadList}
pageSize={20}
total={10000}
cellClick={(index: number | undefined,headId:string)=>{cellClick(index ?? undefined,headId)} }
cellClick={(index: number | undefined, headId: string) => { cellClick(index ?? undefined, headId) }}
onPageChange={setPageNation}
></UiTable>
</ListDiv>
</div>
<UiModal
<UiModal
open={detailModal.isOpen}
onOpenChange={()=>{
setDetailModal({...detailModal, isOpen:!detailModal.isOpen})
onOpenChange={() => {
setDetailModal({ ...detailModal, isOpen: !detailModal.isOpen })
}}
bodyClass={"w-[40vw] max-w-none max-h-[calc(100%-70px)]"}
body={<CoDetailModal formObj={detailModal.data}/>}/>
bodyClass={"w-[40vw] max-w-none max-h-[calc(100%-70px)]"}
body={<CoDetailModal formObj={detailModal.data} />} />
<UiModal
bodyClass={"w-[40vw] max-w-none"}
open={isRegExcel}
body={<CoRegExcel></CoRegExcel>}
onOpenChange={setIsRegExcel}
/>
<UiModal
bodyClass={"w-[40vw] max-w-none"}
open={isRegExcel}
body={<CoRegExcel></CoRegExcel>}
onOpenChange={setIsRegExcel}
/>
</div>
</ContentsDiv>
</>
+1 -1
View File
@@ -136,7 +136,7 @@ export default function Home() {
</div>
<div className="col-span-2">
<Button className="w-full">
<Link href="matMng/matDmd/ruseCaseMng">물재이용사례관리</Link>
<Link href="matMng/matDmd/ruseCaseMng">물재이용사례 관리</Link>
</Button>
</div>
</div>
+17
View File
@@ -0,0 +1,17 @@
import type { customCoSttnBdst } from ".";
export const excelCoSttnParsing = (data: customCoSttnBdst[]): string[][] => {
const excelExportData: string[][] = [];
data.forEach((item) => {
excelExportData.push([
String(item.ctpvCd),
String(item.sggCd),
item.dmdCoNm ?? "",
item.daddr ?? "",
String(item.dmdInfoPk ?? ""),
item.telno ?? ""
]);
});
return excelExportData;
};
+35 -2
View File
@@ -2,6 +2,7 @@ import type { CommonTableProps } from "@/app/store/common/type/headder";
import { fetchType, getFetch } from "@/components/lib/api";
import { z } from "zod";
import { coSttHeadListExport, coSttNodeListExport } from "./headList";
import { excelCoSttnParsing } from "./excel";
// 테이블 헤드 리스트
const coSttNodeList = coSttNodeListExport;
@@ -31,7 +32,8 @@ export type coSttnState = {
};
type coSttnActions = {
coSttnInit:(con:string) => void
coSttnInit:(con:string) => void;
coSttnSearch: (txt: string, cnt: number) => void;
};
export type coSttnType = coSttnState & coSttnActions;
@@ -57,7 +59,6 @@ export const coSttnActionsExport: (set: any) => coSttnActions = (
fetchType.WR,
`/reuseFc/request/마인드원/3`
);
console.log(coSttnRes, "ㅠㅠ")
set((state: coSttnState) => {
return {
...state,
@@ -72,5 +73,37 @@ export const coSttnActionsExport: (set: any) => coSttnActions = (
console.log(e)
}
},
coSttnSearch: async (txt: string, cnt: number) => {
try {
const coSttnRes = await getFetch(
fetchType.WR,
`/reuseFc/request/${txt}/${cnt}`
);
if (Number(cnt) > 0) {
const coExcel = excelCoSttnParsing(coSttnRes);
set((state: coSttnState) => {
return {
...state,
coSttn: {
...state.coSttn,
excelList: coExcel,
},
};
});
} else
set((state: coSttnState) => {
return {
...state,
coSttn: {
...state.coSttn,
coSttnRes: coSttnRes,
isInit: false,
},
};
});
} catch (erTxt) {
console.log("error", erTxt);
}
},
}
}
+13 -12
View File
@@ -1,24 +1,25 @@
import type { z } from "zod";
import type { CommonTableProps } from "@/app/store/common/type/headder";
import { coSttNodeListExport, coSttHeadListExport } from "../coSttn/headList";
import type { customCoBdst } from "../../matDmd/coReg";
import type { sttnHeadListType } from "../coSttn/headList";
import { coSttHeadListExport, coSttNodeListExport } from "../coSttn/headList";
import type { customCoSttnBdst } from "../coSttn";
// 테이블 헤드 리스트
const coSttNodeList = coSttNodeListExport;
const coSttHeadList = coSttHeadListExport;
const ldrmntCoSttnRes: customCoBdst[] = [];
const ldrmntCoSttnRes: customCoSttnBdst[] = [];
const ldrmntCoList = {ctpv: "이거머임",
sgg: "01",
coNm: "회사요",
const ldrmntCoList = [{
ctpvCd: "이거머임",
sggCd: "01",
dmdCoNm: "회사요",
bznmNo: "abc123",
addr: "서울 강남구",
telNo: "010-1234-5678"}
dmdInfoPk: "1111",
daddr: "서울 강남구",
telno: "010-1234-5678"
}]
export type ldrmntCoSttnState = {
ldrmntCoSttn: {
ldrmntCoSttnRes: customCoBdst[];
ldrmntCoSttnRes: customCoSttnBdst[];
ldrmntCoSttHeadList: CommonTableProps[];
ldrmntCoSttNodeList: CommonTableProps[];
excelList: [];
@@ -35,7 +36,7 @@ export const ldrmntCoSttnStateExport: ldrmntCoSttnState = {
ldrmntCoSttn: {
ldrmntCoSttHeadList: coSttHeadList,
ldrmntCoSttNodeList: coSttNodeList,
ldrmntCoSttnRes: [ldrmntCoList],
ldrmntCoSttnRes: ldrmntCoList,
excelList: [],
isInit: false,
},
Binary file not shown.
Binary file not shown.