From e5c180225fda37ccd74b544b1c1d8e01e46ea98e Mon Sep 17 00:00:00 2001 From: basssy Date: Tue, 15 Oct 2024 16:29:45 +0900 Subject: [PATCH] =?UTF-8?q?=EB=AC=BC=EA=B1=B4=ED=98=84=ED=99=A9=20?= =?UTF-8?q?=EC=84=A4=EA=B3=84=EC=9D=98=EB=A2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/management/StuffDetail.jsx | 23 +- .../management/StuffSearchCondition.jsx | 43 ++-- .../management/popup/PlanRequestPop.jsx | 215 ++++++++++++++---- .../management/popup/PlanRequestPopQGrid.jsx | 60 +++++ src/locales/ja.json | 36 ++- src/locales/ko.json | 37 ++- src/store/planReqAtom.js | 22 ++ 7 files changed, 364 insertions(+), 72 deletions(-) create mode 100644 src/components/management/popup/PlanRequestPopQGrid.jsx create mode 100644 src/store/planReqAtom.js diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index 474e0413..b64f2a23 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -455,10 +455,12 @@ export default function StuffDetail() { - {getMessage('stuff.detail.designNo')} + {getMessage('stuff.detail.planReqNo')}
-
+
+ +
@@ -770,7 +772,7 @@ export default function StuffDetail() {
- * 필수 입력항목 + * {getMessage('stuff.detail.required')}
@@ -778,6 +780,21 @@ export default function StuffDetail() { + + + + + +
{getMessage('stuff.detail.planReqNo')} +
+
+ +
+ +
+
diff --git a/src/components/management/StuffSearchCondition.jsx b/src/components/management/StuffSearchCondition.jsx index f88cf3cc..df2d74c8 100644 --- a/src/components/management/StuffSearchCondition.jsx +++ b/src/components/management/StuffSearchCondition.jsx @@ -42,7 +42,6 @@ export default function StuffSearchCondition() { const resetStuffRecoil = useResetRecoilState(stuffSearchState) const [stuffSearch, setStuffSearch] = useRecoilState(stuffSearchState) const [objectNo, setObjectNo] = useState('') //물건번호 - // const [saleStoreId, setSaleStoreId] = useState('') //판매대리점ID 세션에서 가져와서세팅 const [address, setAddress] = useState('') //물건주소 const [objectName, setobjectName] = useState('') //물건명 const [saleStoreName, setSaleStoreName] = useState('') //판매대리점명 @@ -116,6 +115,7 @@ export default function StuffSearchCondition() { ref.current.state.values = [] } } + //판매대리점 자동완성 변경 const onSelectionChange = (key) => { if (!isEmptyArray(key)) { @@ -146,19 +146,19 @@ export default function StuffSearchCondition() {
-

물건현황

+

{getMessage('stuff.search.title')}

@@ -174,13 +174,13 @@ export default function StuffSearchCondition() { - 물건번호 + {getMessage('stuff.search.schObjectNo')}
{ setObjectNo(e.target.value) @@ -189,29 +189,28 @@ export default function StuffSearchCondition() { />
- 판매대리점명 + {getMessage('stuff.search.schSaleStoreName')}
{ - //setSaleStoreId(e.target.value) setSaleStoreName(e.target.value) setStuffSearch({ ...stuffSearch, code: 'S', schSaleStoreName: e.target.value }) }} />
- 물건주소 + {getMessage('stuff.search.schAddress')}
{ setAddress(e.target.value) @@ -222,13 +221,13 @@ export default function StuffSearchCondition() { - 물건명 + {getMessage('stuff.search.schObjectName')}
{ setobjectName(e.target.value) @@ -237,13 +236,13 @@ export default function StuffSearchCondition() { />
- 견적처 + {getMessage('stuff.search.schDispCompanyName')}
{ setDispCompanyName(e.target.value) @@ -252,7 +251,7 @@ export default function StuffSearchCondition() { />
- 판매대리점 선택 + {getMessage('stuff.search.schSelSaleStoreId')} {schSelSaleStoreList?.length > 0 && ( { setReceiveUser(e.target.value) @@ -286,7 +285,7 @@ export default function StuffSearchCondition() { />
- 기간검색 + {getMessage('stuff.search.period')}
@@ -302,7 +301,7 @@ export default function StuffSearchCondition() { setStuffSearch({ ...stuffSearch, code: 'S', schDateType: e.target.value }) }} /> - +
- +
diff --git a/src/components/management/popup/PlanRequestPop.jsx b/src/components/management/popup/PlanRequestPop.jsx index 9eee76a3..66bea1d4 100644 --- a/src/components/management/popup/PlanRequestPop.jsx +++ b/src/components/management/popup/PlanRequestPop.jsx @@ -1,15 +1,21 @@ -import React, { useState } from 'react' +import React, { useState, useRef, useEffect } from 'react' import { useForm } from 'react-hook-form' import { queryStringFormatter } from '@/util/common-utils' import { useAxios } from '@/hooks/useAxios' import { globalLocaleStore } from '@/store/localeAtom' -import { useRecoilValue } from 'recoil' +import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil' import FindAddressPopQGrid from './FindAddressPopQGrid' import { useMessage } from '@/hooks/useMessage' import { isNotEmptyArray } from '@/util/common-utils' import SingleDatePicker from '@/components/common/datepicker/SingleDatePicker' import dayjs from 'dayjs' +import PlanRequestPopQGrid from './PlanRequestPopQGrid' +import { sessionStore } from '@/store/commonAtom' +import { planReqSearchState } from '@/store/planReqAtom' +import Select from 'react-dropdown-select' export default function PlanRequestPop(props) { + const sessionState = useRecoilValue(sessionStore) + const globalLocaleState = useRecoilValue(globalLocaleStore) const { get } = useAxios(globalLocaleState) @@ -29,41 +35,89 @@ export default function PlanRequestPop(props) { setStartDate: setEndDate, } + const ref = useRef() + const resetPlanReqRecoil = useResetRecoilState(planReqSearchState) + + const [planReqSearch, setPlanReqSearch] = useRecoilState(planReqSearchState) + const [schPlanReqNo, setSchPlanReqNo] = useState('') //설계의뢰번호 + const [schTitle, setSchTitle] = useState('') //안건명 + const [schAddress, setSchAddress] = useState('') //도도부현 + const [schSaleStoreName, setSchSaleStoreName] = useState('') //판매대리점명 + const [schPlanReqName, setSchPlanReqName] = useState('') //의뢰자명 + const [schPlanStatCd, setSchPlanStatCd] = useState('') //상태코드 + const [schDateGbn, setSchDateGbn] = useState('S') //기간구분코드(S/R) + + //초기화 + const resetRecoil = () => {} + + //초기화 눌렀을 때 자동완성도.. + const handleClear = () => { + if (ref.current.state.dropDown) { + ref.current.methods.dropDown() + } else { + ref.current.state.values = [] + } + } + + useEffect(() => { + setStartDate(planReqSearch?.schStartDt ? planReqSearch.schStartDt : dayjs(new Date()).add(-3, 'month').format('YYYY-MM-DD')) + setEndDate(planReqSearch?.schEndDt ? planReqSearch.schEndDt : dayjs(new Date()).format('YYYY-MM-DD')) + }, [planReqSearch]) + const [gridProps, setGridProps] = useState({ gridData: [], isPageable: false, gridColumns: [ { - field: 'address1', - headerName: getMessage('stuff.addressPopup.gridHeader.address1'), + field: 'planStatName', + headerName: getMessage('stuff.planReqPopup.gridHeader.planStatName'), minWidth: 150, checkboxSelection: true, showDisabledCheckboxes: true, }, { - field: 'address2', - headerName: getMessage('stuff.addressPopup.gridHeader.address2'), + field: 'planReqNo', + headerName: getMessage('stuff.planReqPopup.gridHeader.planReqNo'), minWidth: 150, }, { - field: 'address3', - headerName: getMessage('stuff.addressPopup.gridHeader.address3'), + field: 'saleStoreId', + headerName: getMessage('stuff.planReqPopup.gridHeader.saleStoreId'), + minWidth: 150, + }, + { + field: 'saleStoreName', + headerName: getMessage('stuff.planReqPopup.gridHeader.saleStoreName'), + minWidth: 150, + }, + { + field: 'title', + headerName: getMessage('stuff.planReqPopup.gridHeader.title'), + minWidth: 150, + }, + { + field: 'address1', + headerName: getMessage('stuff.planReqPopup.gridHeader.address1'), + minWidth: 150, + }, + { + field: 'houseCntName', + headerName: getMessage('stuff.planReqPopup.gridHeader.houseCntName'), + minWidth: 150, + }, + { + field: 'planReqName', + headerName: getMessage('stuff.planReqPopup.gridHeader.planReqName'), + minWidth: 150, + }, + { + field: 'submitDt', + headerName: getMessage('stuff.planReqPopup.gridHeader.submitDt'), minWidth: 150, }, ], }) - //검색필드 - const formInitValue = { - //zipNo: '', - } - - const { register, setValue, getValues, handleSubmit, resetField, control, watch } = useForm({ - defaultValues: formInitValue, - }) - - const form = { register, setValue, getValues, handleSubmit, resetField, control, watch } - return (
@@ -89,68 +143,131 @@ export default function PlanRequestPop(props) { - 설계의뢰번호 / 設計依頼番号 + {getMessage('stuff.planReqPopup.search.planReqNo')}
- + { + setSchPlanReqNo(e.target.value) + setPlanReqSearch({ ...planReqSearch, schPlanReqNo: e.target.value }) + }} + />
- 안건명 / 案件名 + {getMessage('stuff.planReqPopup.search.title')}
- + { + setSchTitle(e.target.value) + setPlanReqSearch({ ...planReqSearch, schTitle: e.target.value }) + }} + />
- 도도부현 / 都道府県 + {getMessage('stuff.planReqPopup.search.address1')}
- + { + setSchAddress(e.target.value) + setPlanReqSearch({ ...planReqSearch, schAddress: e.target.value }) + }} + />
- 판매대리점명 / 販売代理店名 + {getMessage('stuff.planReqPopup.search.saleStoreName')}
- + { + setSchSaleStoreName(e.target.value) + setPlanReqSearch({ ...planReqSearch, schSaleStoreName: e.target.value }) + }} + />
- 의뢰자명 / 依頼者名 + {getMessage('stuff.planReqPopup.search.planReqName')}
- + { + setSchPlanReqName(e.target.value) + setPlanReqSearch({ ...planReqSearch, schPlanReqName: e.target.value }) + }} + />
- 상태 / 状態 + {getMessage('stuff.planReqPopup.search.planStatName')}
- 기간검색 / 期間検索 + {getMessage('stuff.planReqPopup.search.period')}
- - + { + setSchDateGbn(e.target.value) + setPlanReqSearch({ ...planReqSearch, schDateGbn: e.target.value }) + }} + /> +
- - + { + setSchDateGbn(e.target.value) + setPlanReqSearch({ ...planReqSearch, schDateGbn: e.target.value }) + }} + /> +
-
-
- -
- ~ -
- -
+
+
+
+ +
+ ~ +
+
@@ -160,6 +277,16 @@ export default function PlanRequestPop(props) {
+
+
Plan List
+ +
+
+
+ +
diff --git a/src/components/management/popup/PlanRequestPopQGrid.jsx b/src/components/management/popup/PlanRequestPopQGrid.jsx new file mode 100644 index 00000000..8f29cdbe --- /dev/null +++ b/src/components/management/popup/PlanRequestPopQGrid.jsx @@ -0,0 +1,60 @@ +import React from 'react' +import { useCallback, useEffect, useMemo, useState } from 'react' +import { AgGridReact } from 'ag-grid-react' + +import 'ag-grid-community/styles/ag-grid.css' +import 'ag-grid-community/styles/ag-theme-quartz.css' + +export default function PlanRequestPopQGrid(props) { + const { gridData, gridColumns, isPageable = true } = props + + const [rowData, setRowData] = useState(null) + + const [gridApi, setGridApi] = useState(null) + + const [colDefs, setColDefs] = useState(gridColumns) + + const defaultColDef = useMemo(() => { + return { + flex: 1, + minWidth: 100, + sortable: false, + suppressMovable: false, + resizable: false, + suppressSizeToFit: false, + } + }, []) + + const rowBuffer = 100 + + useEffect(() => { + gridData ? setRowData(gridData) : '' + }, [gridData]) + + const rowSelection = useMemo(() => { + return { mode: 'singleRow', enableClickSelection: true } + }, []) + + const onGridReady = useCallback( + (params) => { + setGridApi(params.api) + gridData ? setRowData(gridData) : '' + }, + [gridData], + ) + + return ( +
+ +
+ ) +} diff --git a/src/locales/ja.json b/src/locales/ja.json index abdfc11c..f3e2c650 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -392,7 +392,7 @@ "stuff.addressPopup.btn2": "住所適用", "stuff.planReqPopup.title": "設計依頼のインポート", "stuff.detail.required": "必須入力項目", - "stuff.detail.designNo": "設計依頼No.", + "stuff.detail.planReqNo": "設計依頼No.", "stuff.detail.dispCompanyName": "担当者", "stuff.detail.objectStatusId": "物品区分/物件名", "stuff.detail.objectStatus0": "新築", @@ -417,6 +417,40 @@ "stuff.detail.conType0": "余剰", "stuff.detail.conType1": "全量", "stuff.detail.remarks": "メモ", + "stuff.planReqPopup.gridHeader.planStatName": "상태", + "stuff.planReqPopup.gridHeader.planReqNo": "설계의뢰 번호", + "stuff.planReqPopup.gridHeader.saleStoreId": "판매대리점ID", + "stuff.planReqPopup.gridHeader.saleStoreName": "판매대리점명", + "stuff.planReqPopup.gridHeader.title": "안건명", + "stuff.planReqPopup.gridHeader.address1": "도도부현", + "stuff.planReqPopup.gridHeader.houseCntName": "설치가옥수", + "stuff.planReqPopup.gridHeader.planReqName": "의뢰자명", + "stuff.planReqPopup.gridHeader.submitDt": "설계의뢰 제출일", + "stuff.planReqPopup.search.planReqNo": "設計依頼番号", + "stuff.planReqPopup.search.title": "案件名", + "stuff.planReqPopup.search.address1": "都道府県", + "stuff.planReqPopup.search.saleStoreName": "販売代理店名", + "stuff.planReqPopup.search.planReqName": "依頼者名", + "stuff.planReqPopup.search.planStatName": "状態", + "stuff.planReqPopup.search.period": "期間検索", + "stuff.planReqPopup.search.schDateGbnS": "提出日", + "stuff.planReqPopup.search.schDateGbnR": "受付日", + "stuff.planReqPopup.btn1": "閉じる", + "stuff.planReqPopup.btn2": "選択の適用", + "stuff.search.title": "物件状況", + "stuff.search.btn1": "物件登録", + "stuff.search.btn2": "照会", + "stuff.search.btn3": "初期化", + "stuff.search.schObjectNo": "品番", + "stuff.search.schSaleStoreName": "販売代理店名", + "stuff.search.schAddress": "商品アドレス", + "stuff.search.schObjectName": "商品名", + "stuff.search.schDispCompanyName": "見積もり", + "stuff.search.schSelSaleStoreId": "販売代理店の選択", + "stuff.search.schReceiveUser": "担当者", + "stuff.search.period": "期間検索", + "stuff.search.schDateTypeU": "更新日", + "stuff.search.schDateTypeR": "登録日", "length": "長さ", "height": "高さ", "output": "出力", diff --git a/src/locales/ko.json b/src/locales/ko.json index 3e37918b..00edeaaf 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -396,7 +396,7 @@ "stuff.addressPopup.btn2": "주소적용", "stuff.planReqPopup.title": "설계의뢰 불러오기", "stuff.detail.required": "필수 입력항목", - "stuff.detail.designNo": "설계의뢰No.", + "stuff.detail.planReqNo": "설계의뢰No.", "stuff.detail.dispCompanyName": "담당자", "stuff.detail.objectStatusId": "물건구분/물건명", "stuff.detail.objectStatus0": "신축", @@ -420,7 +420,40 @@ "stuff.detail.conType": "계약조건", "stuff.detail.conType0": "잉여", "stuff.detail.conType1": "전량", - "stuff.detail.remarks": "메모", + "stuff.planReqPopup.gridHeader.planStatName": "상태", + "stuff.planReqPopup.gridHeader.planReqNo": "설계의뢰 번호", + "stuff.planReqPopup.gridHeader.saleStoreId": "판매대리점ID", + "stuff.planReqPopup.gridHeader.saleStoreName": "판매대리점명", + "stuff.planReqPopup.gridHeader.title": "안건명", + "stuff.planReqPopup.gridHeader.address1": "도도부현", + "stuff.planReqPopup.gridHeader.houseCntName": "설치가옥수", + "stuff.planReqPopup.gridHeader.planReqName": "의뢰자명", + "stuff.planReqPopup.gridHeader.submitDt": "설계의뢰 제출일", + "stuff.planReqPopup.search.planReqNo": "설계의뢰번호", + "stuff.planReqPopup.search.title": "안건명", + "stuff.planReqPopup.search.address1": "도도부현", + "stuff.planReqPopup.search.saleStoreName": "판매대리점명", + "stuff.planReqPopup.search.planReqName": "의뢰자명", + "stuff.planReqPopup.search.planStatName": "상태", + "stuff.planReqPopup.search.period": "기간검색", + "stuff.planReqPopup.search.schDateGbnS": "제출일", + "stuff.planReqPopup.search.schDateGbnR": "접수일", + "stuff.planReqPopup.btn1": "닫기", + "stuff.planReqPopup.btn2": "선택적용", + "stuff.search.title": "물건현황", + "stuff.search.btn1": "신규등록", + "stuff.search.btn2": "조회", + "stuff.search.btn3": "초기화", + "stuff.search.schObjectNo": "물건번호", + "stuff.search.schSaleStoreName": "판매대리점명", + "stuff.search.schAddress": "물건주소", + "stuff.search.schObjectName": "물건명", + "stuff.search.schDispCompanyName": "견적처", + "stuff.search.schSelSaleStoreId": "판매대리점 선택", + "stuff.search.schReceiveUser": "담당자", + "stuff.search.period": "기간검색", + "stuff.search.schDateTypeU": "갱신일", + "stuff.search.schDateTypeR": "등록일", "length": "길이", "height": "높이", "output": "출력", diff --git a/src/store/planReqAtom.js b/src/store/planReqAtom.js new file mode 100644 index 00000000..717d506e --- /dev/null +++ b/src/store/planReqAtom.js @@ -0,0 +1,22 @@ +import { atom } from 'recoil' +import dayjs from 'dayjs' +import { v1 } from 'uuid' +export const planReqSearchState = atom({ + key: `planReqSearchState/${v1()}`, + default: { + saleStoreId: '', //판매점ID 세션 + saleStoreLevel: '', //판매점레벨 세션 + schPlanReqNo: '', //설계의뢰 번호 + schTitle: '', //안건명 + schAddress: '', //도도부현 + schSaleStoreName: '', //판매대리점명 + schPlanReqName: '', //의뢰자명 + schPlanStatCd: '', //상태코드 + schDateGbn: 'S', //기간구분코드(S/R) + schStartDt: dayjs(new Date()).add(-3, 'month').format('YYYY-MM-DD'), //시작일 + schEndDt: dayjs(new Date()).format('YYYY-MM-DD'), //종료일 + startRow: 1, + endRow: 100, + }, + dangerouslyAllowMutability: true, +})