물건 등록화면
This commit is contained in:
parent
82f3af907f
commit
c3f56caaa6
@ -14,6 +14,7 @@ import { useRecoilValue } from 'recoil'
|
||||
import { sessionStore } from '@/store/commonAtom'
|
||||
import FindAddressPop from './popup/FindAddressPop'
|
||||
import PlanRequestPop from './popup/PlanRequestPop'
|
||||
import WindSelectPop from './popup/WindSelectPop'
|
||||
export default function StuffDetail() {
|
||||
const sessionState = useRecoilValue(sessionStore)
|
||||
|
||||
@ -43,7 +44,6 @@ export default function StuffDetail() {
|
||||
prefName: '',
|
||||
address: '', //주소
|
||||
areaId: '', //발전량시뮬레이션지역id
|
||||
// areaName: '', //발전량시뮬레이션지역명
|
||||
windSpeed: '', //기준풍속
|
||||
verticalSnowCover: '', //수직적설량NEW
|
||||
coldRegionFlg: false, //한랭지대책시행(true : 1 / false : 0)
|
||||
@ -68,10 +68,11 @@ export default function StuffDetail() {
|
||||
|
||||
const [areaIdList, setAreaIdList] = useState([]) //발전시뮬레이션 리스트
|
||||
|
||||
const [windSpeedList, setWindSpeedList] = useState([]) //기준풍속 리스트
|
||||
// const [windSpeedList, setWindSpeedList] = useState([]) //기준풍속 리스트 팝업으로이동
|
||||
const [isFormValid, setIsFormValid] = useState(false) //임시저장, 진짜저장 버튼 컨트롤
|
||||
const [showAddressButtonValid, setShowAddressButtonValid] = useState(false) //주소검색팝업 활성화 컨트롤
|
||||
const [showDesignRequestButtonValid, setShowDesignRequestButtonValid] = useState(false) //설계의뢰팝업 활성화 컨트롤
|
||||
const [showWindSpeedButtonValid, setShowWindSpeedButtonValid] = useState(false) //풍속선택팝업 활성화 컨트롤
|
||||
const objectNo = searchParams.get('objectNo') //url에서 물건번호 꺼내서 바로 set
|
||||
|
||||
const [editMode, setEditMode] = useState('NEW')
|
||||
@ -208,6 +209,14 @@ export default function StuffDetail() {
|
||||
form.setValue('zipNo', info.zipNo)
|
||||
}
|
||||
|
||||
//팝업에서 넘어온 설계의뢰 정보
|
||||
const setPlanReqInfo = (info) => {}
|
||||
|
||||
//팝업에서 넘어온 바람정보
|
||||
const setWindSppedInfo = (info) => {
|
||||
form.setValue('windSpeed', info.windSpeed)
|
||||
}
|
||||
|
||||
//임시저장 저장 버튼 컨트롤
|
||||
// dispCompanyName: '', //담당자
|
||||
// objectName: '', //물건명
|
||||
@ -307,6 +316,16 @@ export default function StuffDetail() {
|
||||
setShowDesignRequestButtonValid(true)
|
||||
}
|
||||
|
||||
// 풍속선택 팝업 오픈
|
||||
const onSearchWindSpeedPopOpen = () => {
|
||||
const prefName = form.watch('prefName')
|
||||
if (prefName === '') {
|
||||
alert(getMessage('stuff.windSelectPopup.error.message1'))
|
||||
} else {
|
||||
setShowWindSpeedButtonValid(true)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (prefValue !== '') {
|
||||
// 발전량시뮬레이션 지역 목록
|
||||
@ -326,18 +345,18 @@ export default function StuffDetail() {
|
||||
form.setValue('areaId', e.target.value)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (!isEmptyArray(areaIdList)) {
|
||||
let _prefName = form.watch('prefName')
|
||||
// console.log('기준풍속 가져오는 API', _prefName)
|
||||
get({ url: `/api/object/windSpeed/${_prefName}/list` }).then((res) => {
|
||||
// console.log('res::', res)
|
||||
if (!isEmptyArray(res)) {
|
||||
setWindSpeedList(res)
|
||||
}
|
||||
})
|
||||
}
|
||||
}, [areaIdList])
|
||||
// useEffect(() => {
|
||||
// if (!isEmptyArray(areaIdList)) {
|
||||
// let _prefName = form.watch('prefName')
|
||||
// // console.log('기준풍속 가져오는 API', _prefName)
|
||||
// get({ url: `/api/object/windSpeed/${_prefName}/list` }).then((res) => {
|
||||
// // console.log('res::', res)
|
||||
// if (!isEmptyArray(res)) {
|
||||
// setWindSpeedList(res)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// }, [areaIdList])
|
||||
|
||||
//필수값 다 입력했을때
|
||||
const onValid = (data) => {
|
||||
@ -643,7 +662,10 @@ export default function StuffDetail() {
|
||||
</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{ width: '200px' }}>
|
||||
<div className="input-wrap mr5">
|
||||
<input type="text" className="input-light" readOnly value={form.watch('windSpeed')} {...register('windSpeed')} />
|
||||
</div>
|
||||
{/* <div className="select-wrap mr10" style={{ width: '200px' }}>
|
||||
<select className="select-light" name="windSpeed" {...register('windSpeed')}>
|
||||
{windSpeedList.map((row) => {
|
||||
return (
|
||||
@ -653,9 +675,11 @@ export default function StuffDetail() {
|
||||
)
|
||||
})}
|
||||
</select>
|
||||
</div>
|
||||
</div> */}
|
||||
<span className="mr10">{getMessage('stuff.detail.windSpeedSpan')}</span>
|
||||
<button className="btn-origin grey">{getMessage('stuff.detail.btn.windSpeedPop')}</button>
|
||||
<button className="btn-origin grey" onClick={onSearchWindSpeedPopOpen}>
|
||||
{getMessage('stuff.detail.btn.windSpeedPop')}
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@ -803,7 +827,7 @@ export default function StuffDetail() {
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
물건구분/물건명 <span className="importatn">*</span>
|
||||
{getMessage('stuff.detail.objectStatusId')} <span className="importatn">*</span>
|
||||
</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
@ -906,7 +930,12 @@ export default function StuffDetail() {
|
||||
</>
|
||||
)}
|
||||
{showAddressButtonValid && <FindAddressPop setShowAddressButtonValid={setShowAddressButtonValid} zipInfo={setZipInfo} />}
|
||||
{showDesignRequestButtonValid && <PlanRequestPop setShowDesignRequestButtonValid={setShowDesignRequestButtonValid} />}
|
||||
{showDesignRequestButtonValid && (
|
||||
<PlanRequestPop setShowDesignRequestButtonValid={setShowDesignRequestButtonValid} planReqInfo={setPlanReqInfo} />
|
||||
)}
|
||||
{showWindSpeedButtonValid && (
|
||||
<WindSelectPop setShowWindSpeedButtonValid={setShowWindSpeedButtonValid} prefName={form.watch('prefName')} windSpeedInfo={setWindSppedInfo} />
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@ -68,6 +68,7 @@ export default function FindAddressPop(props) {
|
||||
if (isNotEmptyArray(res.results)) {
|
||||
setGridProps({ ...gridProps, gridData: res.results })
|
||||
} else {
|
||||
alert(getMessage('stuff.addressPopup.error.message1'))
|
||||
setGridProps({ ...gridProps, gridData: [] })
|
||||
}
|
||||
} else {
|
||||
@ -80,7 +81,7 @@ export default function FindAddressPop(props) {
|
||||
const applyAddress = () => {
|
||||
// console.log('주소적용 클릭:::::::::', prefId, address1, address2, address3, zipNo)
|
||||
if (prefId == null) {
|
||||
alert('stuff.addressPopup.error.message2')
|
||||
alert(getMessage('stuff.addressPopup.error.message2'))
|
||||
} else {
|
||||
props.zipInfo({
|
||||
zipNo: zipNo,
|
||||
@ -99,6 +100,10 @@ export default function FindAddressPop(props) {
|
||||
const handleKeyUp = (e) => {
|
||||
let input = e.target
|
||||
input.value = input.value.replace(/[^0-9]/g, '')
|
||||
|
||||
if (e.key === 'Enter') {
|
||||
searchPostNum()
|
||||
}
|
||||
}
|
||||
|
||||
//그리드에서 선택한 우편정보
|
||||
|
||||
@ -12,7 +12,6 @@ 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)
|
||||
|
||||
|
||||
115
src/components/management/popup/WindSelectPop.jsx
Normal file
115
src/components/management/popup/WindSelectPop.jsx
Normal file
@ -0,0 +1,115 @@
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useAxios } from '@/hooks/useAxios'
|
||||
import { globalLocaleStore } from '@/store/localeAtom'
|
||||
import { useRecoilValue } from 'recoil'
|
||||
import { isEmptyArray, isNotEmptyArray } from '@/util/common-utils'
|
||||
export default function WindSelectPop(props) {
|
||||
const globalLocaleState = useRecoilValue(globalLocaleStore)
|
||||
const { promiseGet } = useAxios(globalLocaleState)
|
||||
const [windSpeedList, setWindSpeedList] = useState([])
|
||||
const [windSpeed, setWindSpeed] = useState(null)
|
||||
const { getMessage } = useMessage()
|
||||
|
||||
//선택한 라디오 값 세팅
|
||||
const handleChangeRadio = (e) => {
|
||||
setWindSpeed(e.target.value)
|
||||
}
|
||||
|
||||
//적용
|
||||
const applyWindSpeed = () => {
|
||||
if (windSpeed == null) {
|
||||
alert(getMessage('stuff.windSelectPopup.error.message2'))
|
||||
} else {
|
||||
props.windSpeedInfo({ windSpeed: windSpeed })
|
||||
|
||||
//팝업닫기
|
||||
props.setShowWindSpeedButtonValid(false)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (props.prefName !== '') {
|
||||
promiseGet({ url: `/api/object/windSpeed/${props.prefName}/list` }).then((res) => {
|
||||
if (res.status === 200) {
|
||||
if (!isEmptyArray(res.data)) {
|
||||
setWindSpeedList(res.data)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}, [props])
|
||||
|
||||
return (
|
||||
<div className="modal-popup">
|
||||
<div className="modal-dialog middle">
|
||||
<div className="modal-content">
|
||||
<div className="modal-header">
|
||||
<h1 className="title">{getMessage('stuff.windSelectPopup.title')}</h1>
|
||||
<button className="modal-close" onClick={() => props.setShowWindSpeedButtonValid(false)}>
|
||||
닫기
|
||||
</button>
|
||||
</div>
|
||||
<div className="modal-body">
|
||||
<div className="modal-body-inner">
|
||||
<div className="common-table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style={{ width: '70px' }} />
|
||||
<col />
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>{getMessage('stuff.windSelectPopup.search.address1')}</th>
|
||||
<td>
|
||||
<div className="input-wrap">
|
||||
<input type="text" className="input-light" defaultValue={props.prefName} readOnly />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div className="wind-table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th style={{ width: '50px' }}>{getMessage('stuff.windSelectPopup.table.selected')}</th>
|
||||
<th style={{ width: '110px' }}>{getMessage('stuff.windSelectPopup.table.windspeed')}</th>
|
||||
<th>Remarks</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{windSpeedList.map((row, index) => {
|
||||
// console.log('row:::', row)
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="al-c">
|
||||
<div className="d-check-radio light no-text">
|
||||
<input type="radio" value={row.windSpeed} name="windS" id={row.windSpeed} onChange={handleChangeRadio} />
|
||||
<label htmlFor={row.windSpeed}></label>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-c">{row.windSpeed}</td>
|
||||
<td>{row.remarks}</td>
|
||||
</tr>
|
||||
)
|
||||
})}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-btn-wrap">
|
||||
<button className="btn-origin grey mr5" onClick={() => props.setShowWindSpeedButtonValid(false)}>
|
||||
{getMessage('stuff.windSelectPopup.btn1')}
|
||||
</button>
|
||||
<button className="btn-origin navy" onClick={applyWindSpeed}>
|
||||
{getMessage('stuff.windSelectPopup.btn2')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@ -508,6 +508,14 @@
|
||||
"stuff.search.period": "期間検索",
|
||||
"stuff.search.schDateTypeU": "更新日",
|
||||
"stuff.search.schDateTypeR": "登録日",
|
||||
"stuff.windSelectPopup.title": "風速選択",
|
||||
"stuff.windSelectPopup.table.selected": "選択",
|
||||
"stuff.windSelectPopup.table.windspeed": "風速",
|
||||
"stuff.windSelectPopup.error.message1": "住所を先に検索してください",
|
||||
"stuff.windSelectPopup.error.message2": "風速を選択してください。",
|
||||
"stuff.windSelectPopup.search.address1": "県",
|
||||
"stuff.windSelectPopup.btn1": "閉じる",
|
||||
"stuff.windSelectPopup.btn2": "選択",
|
||||
"length": "長さ",
|
||||
"height": "高さ",
|
||||
"output": "出力",
|
||||
|
||||
@ -513,6 +513,14 @@
|
||||
"stuff.search.period": "기간검색",
|
||||
"stuff.search.schDateTypeU": "갱신일",
|
||||
"stuff.search.schDateTypeR": "등록일",
|
||||
"stuff.windSelectPopup.title": "풍속선택",
|
||||
"stuff.windSelectPopup.table.selected": "선택",
|
||||
"stuff.windSelectPopup.table.windspeed": "풍속",
|
||||
"stuff.windSelectPopup.error.message1": "주소를 먼저 검색해주세요.",
|
||||
"stuff.windSelectPopup.error.message2": "풍속을 선택해주세요.",
|
||||
"stuff.windSelectPopup.search.address1": "현",
|
||||
"stuff.windSelectPopup.btn1": "닫기",
|
||||
"stuff.windSelectPopup.btn2": "선택",
|
||||
"length": "길이",
|
||||
"height": "높이",
|
||||
"output": "출력",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user