diff --git a/src/components/main/ChangePasswordPop.jsx b/src/components/main/ChangePasswordPop.jsx index 45685c26..e9355d24 100644 --- a/src/components/main/ChangePasswordPop.jsx +++ b/src/components/main/ChangePasswordPop.jsx @@ -1,10 +1,11 @@ -import React from 'react' +import React, { useState } from 'react' import { useMessage } from '@/hooks/useMessage' import { useForm } from 'react-hook-form' import { sessionStore } from '@/store/commonAtom' import { useRecoilValue, useRecoilState } from 'recoil' import { useAxios } from '@/hooks/useAxios' import { globalLocaleStore } from '@/store/localeAtom' +import { useRouter } from 'next/navigation' export default function ChangePasswordPop() { const globalLocaleState = useRecoilValue(globalLocaleStore) @@ -12,7 +13,7 @@ export default function ChangePasswordPop() { const { patch } = useAxios(globalLocaleState) const { getMessage } = useMessage() const [sessionState, setSessionState] = useRecoilState(sessionStore) - + const router = useRouter() const formInitValue = { password1: '', password2: '', @@ -74,6 +75,8 @@ export default function ChangePasswordPop() { if (res.result.resultCode === 'S') { alert(getMessage('main.popup.login.success')) setSessionState({ ...sessionState, pwdInitYn: 'Y' }) + //메인으로 이동 + router.push('/') } else { alert(res.result.resultMsg) } @@ -154,7 +157,6 @@ export default function ChangePasswordPop() { className="btn-origin grey" onClick={() => { router.push('/login') - setOpen(false) }} > {getMessage('main.popup.login.btn2')} diff --git a/src/components/management/Stuff.jsx b/src/components/management/Stuff.jsx index 02f44561..bc0e6779 100644 --- a/src/components/management/Stuff.jsx +++ b/src/components/management/Stuff.jsx @@ -76,16 +76,7 @@ export default function Stuff() { headerCheckboxSelectionCurrentPageOnly: true, //페이징시 현재 페이지만 체크되도록 checkboxSelection: true, showDisabledCheckboxes: true, - // .centered { - // .ag-header-cell-label { - // justify-content: center !important; - // } - // } cellStyle: { textAlign: 'center' }, - //suppressMovable: true, //헤더 못움직이게 - // width : 100 - // minWidth : 100 - // maxWidth : 100 valueFormatter: function (params) { if (params.value) { return dayjs(params?.value).format('YYYY.MM.DD HH:mm:ss') @@ -96,8 +87,8 @@ export default function Stuff() { }, { field: 'objectNo', + width: '180px', headerName: getMessage('stuff.gridHeader.objectNo'), - // headerClass: 'centered', //_test.scss에 추가 테스트 cellRenderer: function (params) { if (params.data.objectNo) { return ( diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index bca2fd17..9729c1af 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -7,11 +7,16 @@ import Select from 'react-dropdown-select' import Link from 'next/link' import { useAxios } from '@/hooks/useAxios' import { globalLocaleStore } from '@/store/localeAtom' -import { queryStringFormatter, isEmptyArray } from '@/util/common-utils' +import { isEmptyArray } from '@/util/common-utils' import { useMessage } from '@/hooks/useMessage' import { useForm } from 'react-hook-form' import { useRecoilValue } from 'recoil' +import { sessionStore } from '@/store/commonAtom' +import FindAddressPop from './popup/FindAddressPop' +import DesignRequestPop from './popup/DesignRequestPop' export default function StuffDetail() { + const sessionState = useRecoilValue(sessionStore) + const router = useRouter() const searchParams = useSearchParams() const { getMessage } = useMessage() @@ -56,14 +61,18 @@ export default function StuffDetail() { const [prefValue, setPrefValue] = useState('') const [saleStoreList, setSaleStoreList] = useState([]) // 판매점 리스트 const [otherSaleStoreList, setOtherSaleStoreList] = useState([]) + const [originOtherSaleStoreList, setOriginOtherSaleStoreList] = useState([]) const [areaIdList, setAreaIdList] = useState([]) //발전시뮬레이션 리스트 const [windSpeedList, setWindSpeedList] = useState([]) //기준풍속 리스트 const [isFormValid, setIsFormValid] = useState(false) //임시저장, 진짜저장 버튼 컨트롤 - const [buttonValid, setButtonValid] = useState(false) //주소검색 활성화 컨트롤 + const [showButtonValid, setShowButtonValid] = useState(false) //주소검색 활성화 컨트롤 const objectNo = searchParams.get('objectNo') //url에서 물건번호 꺼내서 바로 set + // const [] //1차판매점 자동완성 선택값 + // const [] //2차판매점 자동완성 선택값 + const [editMode, setEditMode] = useState('NEW') const [detailData, setDetailData] = useState({}) @@ -85,15 +94,15 @@ export default function StuffDetail() { // 도도부현API get({ url: '/api/object/prefecture/list' }).then((res) => { if (!isEmptyArray(res)) { - // console.log('도도부현API 결과:::', res) + console.log('도도부현API 결과:::', res) setPrefCodeList(res) } }) - // 판매점목록 API /api/object/saleStore/판매점코드/list - 판매점 목록 조회 // 임시 1차점 판매점코드 saleStoreId=201TES01 // T01 //1차점 : X167 - get({ url: `/api/object/saleStore/X167/list` }).then((res) => { + // get({ url: `/api/object/saleStore/X167/list` }).then((res) => { + get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => { if (!isEmptyArray(res)) { // console.log('판매점 결과:::::', res) setSaleStoreList(res) @@ -111,32 +120,31 @@ export default function StuffDetail() { // 도도부현API get({ url: '/api/object/prefecture/list' }).then((res) => { if (!isEmptyArray(res)) { - // console.log('신규화면 도도부현API 결과:::', res) + console.log('신규화면 도도부현API 결과:::', res) setPrefCodeList(res) } }) - // 판매점목록 API /api/object/saleStore/판매점코드/list - 판매점 목록 조회 // 임시 1차점 판매점코드 saleStoreId=201TES01 // T01 //1차점 : X167 - get({ url: `/api/object/saleStore/X167/list` }).then((res) => { + get({ url: `/api/object/saleStore/T01/list` }).then((res) => { + // get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => { if (!isEmptyArray(res)) { - // console.log('판매점 결과:::::', res) const firstList = res.filter((row) => row.saleStoreLevel === '1') const otherList = res.filter((row) => row.saleStoreLevel !== '1') - // console.log('first:::::', firstList) - // console.log('otherList:::::', otherList) + //1차점 셀렉트박스 setSaleStoreList(firstList) //1차 판매점 자동완성 값 셋팅 - form.setValue('saleStoreId', firstList[0].saleStoreId) + //form.setValue('saleStoreId', firstList[0].saleStoreId) //1차 판매점 번호 셋팅 - form.setValue('saleStoreName', firstList[0].saleStoreId) + form.setValue('saleStoreName', firstList[0]?.saleStoreId) //1차점 아닌 판매점 셀렉트박스 + setOriginOtherSaleStoreList(otherList) setOtherSaleStoreList(otherList) - form.setValue('otherSaleStoreId', otherList[0].saleStoreId) - form.setValue('otherSaleStoreName', otherList[0].saleStoreId) + // form.setValue('otherSaleStoreId', otherList[0].saleStoreId) + form.setValue('otherSaleStoreName', otherList[0]?.saleStoreId) } }) } @@ -144,32 +152,83 @@ export default function StuffDetail() { //1차점 변경 이벤트 const onSelectionChange = (key) => { - if (key == null) { + if (!isEmptyArray(key)) { + setOtherSaleStoreList(otherSaleStoreList) + form.setValue('saleStoreId', key[0].saleStoreId) + form.setValue('saleStoreName', key[0].saleStoreId) + + //선택한 1차점 정보로 2차점 list 추리기 + //長府工産株式会社　大阪支社 + let newOtherSaleStoreList = originOtherSaleStoreList.filter((row) => row.firstAgentId === key[0].saleStoreId) + setOtherSaleStoreList(newOtherSaleStoreList) + } else { + //X누름 form.setValue('saleStoreId', '') form.setValue('saleStoreName', '') - } else { - const name = saleStoreList.find((obj) => obj.saleStoreId === key.target.value).saleStoreName - form.setValue('saleStoreId', key.target.value) - form.setValue('saleStoreName', name) + setOtherSaleStoreList(originOtherSaleStoreList) } } //2차점 변경 이벤트 const onSelectionChange2 = (key) => { - const name = otherSaleStoreList.find((obj) => obj.saleStoreId === key.target.value).saleStoreName - form.setValue('otherSaleStoreId', key.target.value) - form.setValue('otherSaleStoreNm', name) + if (!isEmptyArray(key)) { + form.setValue('otherSaleStoreId', key[0].saleStoreId) + form.setValue('otherSaleStoreId', key[0].saleStoreId) + } else { + form.setValue('otherSaleStoreId', '') + form.setValue('otherSaleStoreId', '') + } } // 우편번호 숫자만 체크 const _zipNo = watch('zipNo') useEffect(() => { if (_zipNo !== '' && _zipNo.length === 7 && !_zipNo.match(/\D/g)) { - setButtonValid(true) + //setButtonValid(true) } else { - setButtonValid(false) + //setButtonValid(false) } }, [_zipNo]) + //팝업에서 넘어온 우편정보 + const setZipInfo = (info) => { + console.log('팝업에서 넘어온 데이타::::::::', info) + + // const params = { + // zipcode: _zipNo, + // } + + // get({ url: `https://zipcloud.ibsnet.co.jp/api/search?${queryStringFormatter(params)}` }).then((res) => { + // //7830060 + // //9302226 + // //0790177 3개짜리 + // if (res.status === 200) { + // if (res.results != null) { + // console.log('주소검색::', res.results) + // // console.log('prefcode::', res.results[0].prefcode) + // // console.log('address::', res.results[0].address2 + res.results[0].address3) + // setPrefValue(res.results[0].prefcode) + // form.setValue('prefId', res.results[0].prefcode) + // form.setValue('prefName', res.results[0].address1) + // form.setValue('address', res.results[0].address2 + res.results[0].address3) + // } else { + // alert('등록된 우편번호에서 주소를 찾을 수 없습니다. 다시 입력해주세요.') + // form.setValue('prefId', '') + // form.setValue('prefName', '') + // form.setValue('address', '') + // form.setValue('zipNo', '') + // setPrefValue('') + // setAreaIdList([]) + // form.setValue('areaId', '') + // // form.setValue('areaName', '') + // setWindSpeedList([]) + // form.setValue('windSpeed', '') + // } + // } else { + // alert(res.message) + // } + // }) + } + //임시저장 저장 버튼 컨트롤 // dispCompanyName: '', //담당자 // objectName: '', //물건명 @@ -201,10 +260,10 @@ export default function StuffDetail() { const _installHeight = watch('installHeight') useEffect(() => { - // console.log('mode:::::', editMode) + console.log('mode:::::', editMode) if (editMode === 'NEW') { const formData = form.getValues() - // console.log('폼::::::::::::', formData) + console.log('폼::::::::::::', formData) let errors = {} if (!_dispCompanyName || _dispCompanyName.trim().length === 0) { errors.dispCompanyName = true @@ -251,7 +310,7 @@ export default function StuffDetail() { errors.installHeight = true } - // console.log('errors::', errors) + console.log('errors::', errors) setIsFormValid(Object.keys(errors).length === 0) } else { // console.log('상세일때 폼체크') @@ -273,49 +332,21 @@ export default function StuffDetail() { // 주소검색 API const onSearchPostNumber = () => { - const params = { - zipcode: _zipNo, - } + console.log('주소검색클릭!!') - get({ url: `https://zipcloud.ibsnet.co.jp/api/search?${queryStringFormatter(params)}` }).then((res) => { - //7830060 - //9302226 - //0790177 3개짜리 - if (res.status === 200) { - if (res.results != null) { - console.log('주소검색::', res.results) - // console.log('prefcode::', res.results[0].prefcode) - // console.log('address::', res.results[0].address2 + res.results[0].address3) - setPrefValue(res.results[0].prefcode) - form.setValue('prefId', res.results[0].prefcode) - form.setValue('prefName', res.results[0].address1) - form.setValue('address', res.results[0].address2 + res.results[0].address3) - } else { - alert('등록된 우편번호에서 주소를 찾을 수 없습니다. 다시 입력해주세요.') - form.setValue('prefId', '') - form.setValue('prefName', '') - form.setValue('address', '') - form.setValue('zipNo', '') - setPrefValue('') - setAreaIdList([]) - form.setValue('areaId', '') - // form.setValue('areaName', '') - setWindSpeedList([]) - form.setValue('windSpeed', '') - } - } else { - alert(res.message) - } - }) + setShowButtonValid(true) } useEffect(() => { + console.log('우편번호검색해서 값이왔어:::::::::::', prefValue) if (prefValue !== '') { // 발전량시뮬레이션 지역 목록 // /api/object/prefecture/도도부현코드/list get({ url: `/api/object/prefecture/${prefValue}/list` }).then((res) => { if (!isEmptyArray(res)) { - // console.log('발전량 시뮬레이션::::::::', res) + console.log('발전량 시뮬레이션::::::::', res) + //res에 areaId추가됨 + // form.setValue('areaId', res[0].areaId) form.setValue('areaId', res[0].prefId) form.setValue('areaName', res[0].prefName) setAreaIdList(res) @@ -404,7 +435,7 @@ export default function StuffDetail() { workName: null, } console.log('임시저장params::', params) - return + // return await post({ url: '/api/object/save-object', data: params }).then((res) => { console.log('res::::::', res) }) @@ -498,18 +529,16 @@ export default function StuffDetail() {
-
- {saleStoreList?.length > 0 && ( - - )} +
+
@@ -526,18 +555,17 @@ export default function StuffDetail() {
-
- {otherSaleStoreList?.length > 0 && ( - - )} +
+
- +
- -
*우편번호 7자리를 입력한 후, 주소검색 버튼을 클릭해 주십시오
+
*주소검색 버튼을 클릭한 후, 도도부현 정보를 선택해주십시오.
@@ -581,20 +601,16 @@ export default function StuffDetail() {
-
- - {/* {prefCodeList?.length > 0 && ( - - )} */} - {/* {prefCodeList?.length > 0 && ( - + {prefCodeList.map((row) => ( + + ))} - )} */} + )}
@@ -644,8 +660,8 @@ export default function StuffDetail() { })}
- m/s이하 - + m/s이하 +
@@ -784,6 +800,8 @@ export default function StuffDetail() { )} )} + {showButtonValid && } + ) } diff --git a/src/components/management/StuffQGrid.jsx b/src/components/management/StuffQGrid.jsx index 4fd6c42d..f9a65052 100644 --- a/src/components/management/StuffQGrid.jsx +++ b/src/components/management/StuffQGrid.jsx @@ -40,7 +40,6 @@ export default function StuffQGrid(props) { suppressMovable: true, resizable: false, suppressSizeToFit: false, - headerClass: 'centered', //_test.scss에 추가 테스트 } }, []) @@ -67,11 +66,7 @@ export default function StuffQGrid(props) { //더블클릭 const onCellDoubleClicked = useCallback((event) => { - // if (event.column.colId === 'company') { - // return - // } else { props.getCellDoubleClicked(event) - // } }, []) //컨텐츠에 따라 컬럼넓이 자동조절 @@ -82,7 +77,6 @@ export default function StuffQGrid(props) { }, []) const onGridReady = useCallback((event) => { - // console.log('event:::', event) // 헤더 사이즈 조정 컬럼에 width값으로 계산 event.api.sizeColumnsToFit() }, []) @@ -92,6 +86,13 @@ export default function StuffQGrid(props) { gridData ? setRowData(gridData) : '' }, [gridData]) + // 임시는 row색깔 구분 + const getRowClass = (row) => { + if (row.data.objectNo.substring(0, 1) === 'T') { + return 'important_row' + } + } + return (
물건 목록이 없습니다.'} + // getRowStyle={getRowStyle} + getRowClass={getRowClass} />
) diff --git a/src/components/management/StuffSearchCondition.jsx b/src/components/management/StuffSearchCondition.jsx index 21b84dd8..19981fc5 100644 --- a/src/components/management/StuffSearchCondition.jsx +++ b/src/components/management/StuffSearchCondition.jsx @@ -260,7 +260,8 @@ export default function StuffSearchCondition() { options={schSelSaleStoreList} value={stuffSearch?.schSelSaleStoreId ? stuffSearch.schSelSaleStoreId : schSelSaleStoreId} labelField="saleStoreName" - valueField="saleStoreName" + valueField="saleStoreId" + searchBy="saleStoreName" onChange={onSelectionChange} clearable={true} onClearAll={handleClear} diff --git a/src/components/management/popup/DesignRequestPop.jsx b/src/components/management/popup/DesignRequestPop.jsx new file mode 100644 index 00000000..ae7fd858 --- /dev/null +++ b/src/components/management/popup/DesignRequestPop.jsx @@ -0,0 +1,5 @@ +import React from 'react' + +export default function DesignRequestPop() { + return
+} diff --git a/src/components/management/popup/FindAddressPop.jsx b/src/components/management/popup/FindAddressPop.jsx new file mode 100644 index 00000000..32ffcfcd --- /dev/null +++ b/src/components/management/popup/FindAddressPop.jsx @@ -0,0 +1,111 @@ +import React, { useEffect, useState } 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 FindAddressPopQGrid from './FindAddressPopQGrid' + +export default function FindAddressPop(props) { + const globalLocaleState = useRecoilValue(globalLocaleStore) + + const { get } = useAxios(globalLocaleState) + const [prefId, setPrefId] = useState('') + const [address1, setAddress1] = useState('') + const [address2, setAddress2] = useState('') + const [address3, setAddress3] = useState('') + const gridRef = useRef() + + const [gridProps, setGridProps] = useState({ + gridData: [], + isPageable: false, + gridColumns: [], + }) + const formInitValue = { + zipNo: '', + } + const { register, setValue, getValues, handleSubmit, resetField, control, watch } = useForm({ + defaultValues: formInitValue, + }) + + const form = { register, setValue, getValues, handleSubmit, resetField, control, watch } + //우편번호 검색 + const searchPostNum = () => { + // //7830060 + // //9302226 + // //0790177 3개짜리 + console.log(watch('zipNo')) + const params = { + zipcode: watch('zipNo'), + } + + get({ url: `https://zipcloud.ibsnet.co.jp/api/search?${queryStringFormatter(params)}` }).then((res) => { + console.log('우편조회 API결과:::::', res) + if (res.status === 200) { + } else { + alert('등록된 우편번호에서 주소를 찾을 수 없습니다. 다시 입력해주세요.') + } + }) + } + // 주소적용 클릭 + const zipInfo = () => { + console.log('주소적용 클릭:::::::::') + // setAddress3('3333') + // setAddress3('4444') + // setAddress3('5555') + props.zipInfo({ + zipNo: '3434343', + address1: '3333', + address2: '4444', + address3: '5555', + }) + + props.setShowButtonValid(false) + } + + //숫자만 + const handleKeyUp = (e) => { + let input = e.target + input.value = input.value.replace(/[^0-9]/g, '') + } + return ( +
+
+
+
+

우편번호 郵便番号

+ +
+
+
+
+ + +
+
+ +
+
+
+ + +
+
+
+
+
+ ) +} diff --git a/src/components/management/popup/FindAddressPopQGrid.jsx b/src/components/management/popup/FindAddressPopQGrid.jsx new file mode 100644 index 00000000..f5b7c2fa --- /dev/null +++ b/src/components/management/popup/FindAddressPopQGrid.jsx @@ -0,0 +1,6 @@ +import React from 'react' + +export default function FindAddressPopGrid(props) { + const { gridData, gridColumns, isPageable = true, gridRef } = props + return
+} diff --git a/src/styles/_grid-detail.scss b/src/styles/_grid-detail.scss index 4cf9d3b2..79a8cb9a 100644 --- a/src/styles/_grid-detail.scss +++ b/src/styles/_grid-detail.scss @@ -1,64 +1,63 @@ -.q-grid{ - height: fit-content; - .ag-theme-quartz { - outline: none; - border: none; - --ag-border-radius: 0px; - --ag-wrapper-border-radius: 0px; - --ag-header-height: 40px; - --ag-header-foreground-color: white; - --ag-header-background-color: #5D6A76; - // --ag-header-cell-hover-background-color: rgb(80, 40, 140); - --ag-header-cell-moving-background-color: #5D6A76; - .ag-root-wrapper{ - outline: none; - border: none; - - } - .ag-header{ - border-bottom: none; - border-radius: 4px; - } - .ag-header-cell{ - font-size: 13px; - color: #fff; - } - .ag-header-cell-label{ - justify-content: center; - } - .ag-header-cell-resize{ - &:after{ - display: none; - } - } - .ag-row{ - border-bottom: 1px solid #ECF0F4; - &:nth-child(2n){ - background-color: #F7F9FA; - } - &.important_row{ - background-color: #e7e7e7; - } - } - .ag-cell{ - font-size: 13px; - color: #45576F; - } - .ag-icon-desc::before, - .ag-icon-asc::before, - .ag-icon-filter::before{ - color: #fff; - } +.q-grid { + height: fit-content; + .ag-theme-quartz { + outline: none; + border: none; + --ag-border-radius: 0px; + --ag-wrapper-border-radius: 0px; + --ag-header-height: 40px; + --ag-header-foreground-color: white; + --ag-header-background-color: #5d6a76; + // --ag-header-cell-hover-background-color: rgb(80, 40, 140); + --ag-header-cell-moving-background-color: #5d6a76; + .ag-root-wrapper { + outline: none; + border: none; } - .copy-ico-wrap{ - display: flex; - align-items: center; - .copy_ico{ - width: 18px; - height: 18px; - background: url(../../public/static/images/sub/copy_grid_ico.svg)no-repeat center; - background-size: cover; - margin-left: 12px; - } + .ag-header { + border-bottom: none; + border-radius: 4px; } -} \ No newline at end of file + .ag-header-cell { + font-size: 13px; + color: #fff; + } + .ag-header-cell-label { + justify-content: center; + } + .ag-header-cell-resize { + &:after { + display: none; + } + } + .ag-row { + border-bottom: 1px solid #ecf0f4; + &:nth-child(2n) { + background-color: #f7f9fa; + } + &.important_row { + background-color: #e7e7e7; + } + } + .ag-cell { + font-size: 13px; + color: #45576f; + } + .ag-icon-desc::before, + .ag-icon-asc::before, + .ag-icon-filter::before { + color: #fff; + } + } + .copy-ico-wrap { + display: flex; + align-items: center; + .copy_ico { + width: 18px; + height: 18px; + background: url(../../public/static/images/sub/copy_grid_ico.svg) no-repeat center; + background-size: cover; + margin-left: 12px; + } + } +}