Merge Q-CAST-III-MR-139: 물건현황 화면 작업

2024-10-21 07:59:59 +00:00 · 2024-10-21 07:59:59 +00:00 · 5be1561373
commit 5be1561373
parent aa486480f4 220e6fe8c2
9 changed files with 195 additions and 191 deletions
--- a/src/app/management/stuff/detail/page.jsx
+++ b/src/app/management/stuff/detail/page.jsx
@ -1,36 +1,12 @@
 import React from 'react'
-import Link from 'next/link'
-import Image from 'next/image'
 import '@/styles/contents.scss'
+import StuffSubHeader from '@/components/management/StuffSubHeader'
 import StuffHeader from '@/components/management/StuffHeader'
 import StuffDetail from '@/components/management/StuffDetail'
 export default function ManagementStuffDetailPage() {
  return (
    <>
-      <div className="sub-header">
-        <div className="sub-header-inner">
-          <ul className="sub-header-title-wrap">
-            <li className="title-item">
-              <Link className="sub-header-title" href={'#'}>
-                商品情報
-              </Link>
-            </li>
-          </ul>
-          <ul className="sub-header-location">
-            <li className="location-item">
-              <span className="home">
-                <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
-              </span>
-            </li>
-            <li className="location-item">
-              <span>物品及び図面管理</span>
-            </li>
-            <li className="location-item">
-              <span>商品情報</span>
-            </li>
-          </ul>
-        </div>
-      </div>
+      <StuffSubHeader type={'detail'} />
      <div className="sub-content">
        <div className="sub-content-inner">
          <div className="sub-content-box">
--- a/src/app/management/stuff/page.jsx
+++ b/src/app/management/stuff/page.jsx
@ -1,31 +1,13 @@
 import StuffSearchCondition from '@/components/management/StuffSearchCondition'
 import Stuff from '@/components/management/Stuff'
+import StuffSubHeader from '@/components/management/StuffSubHeader'
 import { initCheck } from '@/util/session-util'
-import Image from 'next/image'
 import '@/styles/contents.scss'
 export default async function ManagementStuffPage() {
  await initCheck()
-
  return (
    <>
-      <div className="sub-header">
-        <div className="sub-header-inner">
-          <h1 className="sub-header-title">物品及び図面管理</h1>
-          <ul className="sub-header-location">
-            <li className="location-item">
-              <span className="home">
-                <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
-              </span>
-            </li>
-            <li className="location-item">
-              <span>物品及び図面管理</span>
-            </li>
-            <li className="location-item">
-              <span>新規物件登録</span>
-            </li>
-          </ul>
-        </div>
-      </div>
+      <StuffSubHeader type={'list'} />
      <div className="sub-content">
        <div className="sub-content-inner">
          <div className="sub-content-box">
--- a/src/app/management/stuff/tempdetail/page.jsx
+++ b/src/app/management/stuff/tempdetail/page.jsx
@ -1,35 +1,11 @@
 import React from 'react'
-import Link from 'next/link'
-import Image from 'next/image'
+import StuffSubHeader from '@/components/management/StuffSubHeader'
 import '@/styles/contents.scss'
 import StuffDetail from '@/components/management/StuffDetail'
 export default function ManagementStuffDetailPage() {
  return (
    <>
-      <div className="sub-header">
-        <div className="sub-header-inner">
-          <ul className="sub-header-title-wrap">
-            <li className="title-item">
-              <Link className="sub-header-title" href={'#'}>
-                商品情報
-              </Link>
-            </li>
-          </ul>
-          <ul className="sub-header-location">
-            <li className="location-item">
-              <span className="home">
-                <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
-              </span>
-            </li>
-            <li className="location-item">
-              <span>物品及び図面管理</span>
-            </li>
-            <li className="location-item">
-              <span>商品情報</span>
-            </li>
-          </ul>
-        </div>
-      </div>
+      <StuffSubHeader type={'temp'} />
      <div className="sub-content">
        <div className="sub-content-inner">
          <div className="sub-content-box">
--- a/src/components/management/StuffDetail.jsx
+++ b/src/components/management/StuffDetail.jsx
@ -30,6 +30,7 @@ export default function StuffDetail() {
  //form
  const formInitValue = {
    // 물건번호 T...(임시) R...(진짜)
+    planReqNo: '', //설계의뢰No
    dispCompanyName: '', //담당자
    objectStatusId: '0', //물건구분(신축:0 기축 : 1)
    objectName: '', //물건명
@ -70,7 +71,6 @@ export default function StuffDetail() {

  const [areaIdList, setAreaIdList] = useState([]) //발전시뮬레이션 리스트

-  // const [windSpeedList, setWindSpeedList] = useState([]) //기준풍속 리스트 팝업으로이동
  const [isFormValid, setIsFormValid] = useState(false) //임시저장, 진짜저장 버튼 컨트롤
  const [showAddressButtonValid, setShowAddressButtonValid] = useState(false) //주소검색팝업 활성화 컨트롤
  const [showDesignRequestButtonValid, setShowDesignRequestButtonValid] = useState(false) //설계의뢰팝업 활성화 컨트롤
@ -109,7 +109,7 @@ export default function StuffDetail() {
      // 임시 1차점 판매점코드 saleStoreId=201TES01
      // T01
      //1차점 : X167 T01
-      // get({ url: `/api/object/saleStore/TEMP02/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)) {
          const firstList = res.filter((row) => row.saleStoreLevel === '1')
@ -142,8 +142,8 @@ export default function StuffDetail() {
      // 임시 1차점 판매점코드 saleStoreId=201TES01
      // T01
      //1차점 : X167
-      get({ url: `/api/object/saleStore/T01/list` }).then((res) => {
-        // get({ url: `/api/object/saleStore/${sessionState?.storeId}/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)) {
          const firstList = res.filter((row) => row.saleStoreLevel === '1')
          const otherList = res.filter((row) => row.saleStoreLevel !== '1')
@ -208,7 +208,7 @@ export default function StuffDetail() {

  //팝업에서 넘어온 우편정보
  const setZipInfo = (info) => {
-    // console.log('팝업에서 넘어온 데이타::::::::', info)
+    console.log('팝업에서 넘어온 우편 데이타::::::::', info)
    setPrefValue(info.prefId)
    form.setValue('prefId', info.prefId)
    form.setValue('prefName', info.address1)
@ -218,14 +218,33 @@ export default function StuffDetail() {

  //팝업에서 넘어온 설계의뢰 정보로 바꾸기
  const setPlanReqInfo = (info) => {
-    console.log('팝업에서 넘어온 설계의뢰 정보::: ', info)
-    //building : 신축 기축
-    //planReqName : 물건명
-    //zipNo : 우편번호
-    //도도부현 :address1 주소 : address2 미세팅
-    //기준풍속 팝업열려면 setPrefValue(info.prefId) 필요
-    //기준풍속 :
-    // form.setValue('dispCompanyName', info.planReqName)
+    form.setValue('planReqNo', info.planReqNo)
+    form.setValue('objectStatusId', info.building)
+    form.setValue('objectName', info.planReqName)
+    form.setValue('zipNo', info.zipNo)
+    form.setValue('address', info.address2)
+    // console.log('팝업에서 넘어온 설계의뢰 정보::: ', info)
+
+    prefCodeList.map((row) => {
+      if (row.prefName == info.address1) {
+        setPrefValue(row.prefId)
+        form.setValue('prefId', row.prefId)
+        form.setValue('prefName', info.address1)
+      }
+    })
+
+    if (info.saleStoreLevel === '1') {
+      setSelOptions(info.saleStoreId)
+      form.setValue('saleStoreId', info.saleStoreName)
+    } else {
+      console.log('설계의뢰 정보가 2차점인경우::::::::::::', info)
+    }
+    form.setValue('windSpeed', info.windSpeed)
+    form.setValue('verticalSnowCover', info.verticalSnowCover)
+    form.setValue('surfaceType', info.surfaceType)
+    //설치 높이 installHeight
+
+    form.setValue('remarks', info.remarks)
  }

  //팝업에서 넘어온 바람정보
@ -475,7 +494,7 @@ export default function StuffDetail() {
                    <td>
                      <div className="flx-box">
                        <div className="input-wrap mr5" style={{ width: '200px' }}>
-                          <input type="text" className="input-light" readOnly />
+                          <input type="text" className="input-light" readOnly value={form.watch('planReqNo')} />
                        </div>
                        <Button className="btn-origin grey" onClick={onSearchDesignRequestPopOpen}>
                          {getMessage('stuff.planReqPopup.title')}
@ -556,6 +575,7 @@ export default function StuffDetail() {
                            getOptionValue={(x) => x.saleStoreId}
                            isClearable={true}
                            value={saleStoreList.filter(function (option) {
+                              // console.log('1차점::::::', selOptions)
                              return option.saleStoreId === selOptions
                            })}
                          />
@ -591,6 +611,10 @@ export default function StuffDetail() {
                            getOptionValue={(x) => x.saleStoreId}
                            isDisabled={form.watch('saleStoreId') !== '' ? false : true}
                            isClearable={true}
+                            value={otherSaleStoreList.filter(function (option) {
+                              // console.log('2차점::::::', option)
+                              // return option.saleStoreId === selOptions
+                            })}
                          />
                        </div>
                        <div className="input-wrap" style={{ width: '216px' }}>
@ -630,13 +654,6 @@ export default function StuffDetail() {
                      <div className="flx-box">
                        <div className="select-wrap" style={{ width: '200px' }}>
                          {prefCodeList?.length > 0 && (
-                            // <select className="select-light" name="prefName" {...register('prefId')} disabled>
-                            //   {prefCodeList.map((row) => (
-                            //     <option key={row.prefId} value={row.prefId}>
-                            //       {row.prefName}
-                            //     </option>
-                            //   ))}
-                            // </select>
                            <Select
                              id="long-value-select3"
                              instanceId="long-value-select3"
@ -666,21 +683,6 @@ export default function StuffDetail() {
                    </th>
                    <td>
                      <div className="select-wrap" style={{ width: '200px' }}>
-                        {/* <select
-                          className="select-light"
-                          name="areaId"
-                          disabled={areaIdList?.length > 0 ? false : true}
-                          onChange={handleAreaIdOnChange}
-                        >
-                          {areaIdList.map((row) => {
-                            return (
-                              <option key={row.prefName} value={row.prefId}>
-                                {row.prefName}
-                              </option>
-                            )
-                            })}
-                            </select>
-                          */}
                        <Select
                          id="long-value-select4"
                          instanceId="long-value-select4"
@ -709,17 +711,6 @@ export default function StuffDetail() {
                        <div className="input-wrap mr10">
                          <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 (
-                                <option key={row.windSpeed} value={row.windSpeed}>
-                                  {row.windSpeed}
-                                </option>
-                              )
-                            })}
-                          </select>
-                        </div> */}
                        <span className="mr10">{getMessage('stuff.detail.windSpeedSpan')}</span>
                        <Button className="btn-origin grey" onClick={onSearchWindSpeedPopOpen}>
                          {getMessage('stuff.detail.btn.windSpeedPop')}
@ -824,7 +815,7 @@ export default function StuffDetail() {
                  NEW 화면 저장
                </Button>
              )}
-              <Link href="/management/stuff">
+              <Link href="/management/stuff" scroll={false}>
                <button type="button" className="btn-origin grey">
                  NEW화면 물건목록이동
                </button>
--- a/src/components/management/StuffSubHeader.jsx
+++ b/src/components/management/StuffSubHeader.jsx
@ -0,0 +1,81 @@
+'use client'
+
+import { useEffect } from 'react'
+import Link from 'next/link'
+import Image from 'next/image'
+import { useMessage } from '@/hooks/useMessage'
+import { useRouter, useSearchParams } from 'next/navigation'
+import { stuffSearchState } from '@/store/stuffAtom'
+import { useSetRecoilState } from 'recoil'
+
+export default function StuffSubHeader({ type }) {
+  const { getMessage } = useMessage()
+  const router = useRouter()
+
+  const setSchObjectNo = useSetRecoilState(stuffSearchState)
+  useEffect(() => {
+    window.scrollTo(0, 0)
+  }, [])
+
+  const searchParams = useSearchParams()
+  const objectNo = searchParams.get('objectNo') //url에서 물건번호 꺼내서 바로 set
+
+  // url에 물건번호로 도면작성화면으로 이동
+  const moveFloorPlan = () => {
+    setSchObjectNo(objectNo)
+
+    router.push('/floor-plan')
+  }
+
+  return (
+    <div className="sub-header">
+      <div className="sub-header-inner">
+        {type === 'list' && (
+          <Link href={'#'}>
+            <h1 className="sub-header-title">{getMessage('header.menus.management')}</h1>
+          </Link>
+        )}
+        {type === 'temp' && (
+          <ul className="sub-header-title-wrap">
+            <li className="title-item">
+              <Link className="sub-header-title" href={'#'}>
+                {getMessage('stuff.temp.subTitle')}
+              </Link>
+            </li>
+          </ul>
+        )}
+        {type === 'detail' && (
+          <ul className="sub-header-title-wrap">
+            <li className="title-item">
+              <Link className="sub-header-title" href={'#'}>
+                {getMessage('stuff.temp.subTitle')}
+              </Link>
+            </li>
+            <li className="title-item">
+              <a className="sub-header-title" onClick={moveFloorPlan}>
+                <span className="icon drawing"></span>
+                {getMessage('plan.menu.plan.drawing')}
+              </a>
+            </li>
+          </ul>
+        )}
+
+        {type !== 'detail' && (
+          <ul className="sub-header-location">
+            <li className="location-item">
+              <span className="home">
+                <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
+              </span>
+            </li>
+            <li className="location-item">
+              <span>{getMessage('header.menus.management')}</span>
+            </li>
+            <li className="location-item">
+              <span>{getMessage('header.menus.management.stuff')}</span>
+            </li>
+          </ul>
+        )}
+      </div>
+    </div>
+  )
+}
--- a/src/components/management/popup/PlanRequestPop.jsx
+++ b/src/components/management/popup/PlanRequestPop.jsx
@ -1,16 +1,12 @@
-import React, { useState, useRef, useEffect } from 'react'
-import { useForm } from 'react-hook-form'
+import React, { useState, useRef } from 'react'
 import { useAxios } from '@/hooks/useAxios'
 import { globalLocaleStore } from '@/store/localeAtom'
-import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil'
-import FindAddressPopQGrid from './FindAddressPopQGrid'
+import { useRecoilValue } from 'recoil'
 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 { isObjectNotEmpty, queryStringFormatter } from '@/util/common-utils'

 import Select from 'react-select'
@ -24,7 +20,7 @@ export default function PlanRequestPop(props) {

  const [planReqObject, setPlanReqObject] = useState({})

-  const { get, promiseGet } = useAxios(globalLocaleState)
+  const { promiseGet } = useAxios(globalLocaleState)

  const { getMessage } = useMessage()
  //Select ref
@ -43,9 +39,6 @@ export default function PlanRequestPop(props) {
    setStartDate: setEndDate,
  }

-  const resetPlanReqRecoil = useResetRecoilState(planReqSearchState)
-
-  const [planReqSearch, setPlanReqSearch] = useRecoilState(planReqSearchState)
  const [schPlanReqNo, setSchPlanReqNo] = useState('') //설계의뢰번호
  const [schTitle, setSchTitle] = useState('') //안건명
  const [schAddress, setSchAddress] = useState('') //도도부현
@ -66,7 +59,6 @@ export default function PlanRequestPop(props) {
    setEndDate(dayjs(new Date()).format('YYYY-MM-DD'))
    setSchPlanStatCd('')
    handleClear() //셀렉트 자동완성 초기화
-    resetPlanReqRecoil()
  }

  //셀렉트 자동완성 초기화
@ -82,22 +74,12 @@ export default function PlanRequestPop(props) {
    // console.log('E::::::::', key)
    if (isObjectNotEmpty(key)) {
      setSchPlanStatCd(key.value)
-      setPlanReqSearch({
-        ...planReqSearch,
-        schPlanStatCd: key.value,
-      })
    } else {
      //X누름
      setSchPlanStatCd('')
-      setPlanReqSearch({ ...planReqSearch, schPlanStatCd: '' })
    }
  }

-  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 onSubmit = (page, type) => {
    const params = {
@ -105,13 +87,13 @@ export default function PlanRequestPop(props) {
      // saleStoreLevel: '1',
      saleStoreId: props?.otherSaleStoreId ? props.otherSaleStoreId : props.saleStoreId,
      saleStoreLevel: props?.otherSaleStoreLevel ? props.otherSaleStoreLevel : props.saleStoreLevel,
-      schPlanReqNo: planReqSearch?.schPlanReqNo ? planReqSearch.schPlanReqNo : schPlanReqNo,
-      schTitle: planReqSearch?.schTitle ? planReqSearch.schTitle : schTitle,
-      schAddress: planReqSearch?.schAddress ? planReqSearch.schAddress : schAddress,
-      schSaleStoreName: planReqSearch?.schSaleStoreName ? planReqSearch.schSaleStoreName : schSaleStoreName,
-      schPlanReqName: planReqSearch?.schPlanReqName ? planReqSearch.schPlanReqName : schPlanReqName,
-      schPlanStatCd: planReqSearch?.schPlanStatCd ? planReqSearch.schPlanStatCd : schPlanStatCd,
-      schDateGbn: planReqSearch?.schDateGbn ? planReqSearch.schDateGbn : schDateGbn,
+      schPlanReqNo: schPlanReqNo,
+      schTitle: schTitle,
+      schAddress: schAddress,
+      schSaleStoreName: schSaleStoreName,
+      schPlanReqName: schPlanReqName,
+      schPlanStatCd: schPlanStatCd,
+      schDateGbn: schDateGbn,
      schStartDt: dayjs(startDate).format('YYYY-MM-DD'),
      schEndDt: dayjs(endDate).format('YYYY-MM-DD'),
      startRow: type === 'S' ? (1 - 1) * pageSize + 1 : (page - 1) * pageSize + 1,
@ -122,7 +104,6 @@ export default function PlanRequestPop(props) {
    } else {
      setPageNo(page)
    }
-    // console.log(params)

    const apiUrl = `/api/object/planReq/list?${queryStringFormatter(params)}`
    promiseGet({ url: apiUrl }).then((res) => {
@ -142,16 +123,51 @@ export default function PlanRequestPop(props) {
  }
  // 페이징 현재페이지 변경
  const handleChangePage = (page) => {
-    setPlanReqSearch({
-      ...planReqSearch,
-      startRow: (page - 1) * pageSize + 1,
-      endRow: page * pageSize,
-    })
    setPageNo(page)

    onSubmit(page, 'P')
  }

+  //페이지 갯수 변경 이벤트
+  const onChangePerPage = (e) => {
+    const params = {
+      // saleStoreId: 'T100',
+      // saleStoreLevel: '1',
+      saleStoreId: props?.otherSaleStoreId ? props.otherSaleStoreId : props.saleStoreId,
+      saleStoreLevel: props?.otherSaleStoreLevel ? props.otherSaleStoreLevel : props.saleStoreLevel,
+      schTitle: schTitle,
+      schAddress: schAddress,
+      schPlanReqNo: schPlanReqNo,
+      schSaleStoreName: schSaleStoreName,
+      schPlanReqName: schPlanReqName,
+      schPlanStatCd: schPlanStatCd,
+      schDateGbn: schDateGbn,
+      schStartDt: dayjs(startDate).format('YYYY-MM-DD'),
+      schEndDt: dayjs(endDate).format('YYYY-MM-DD'),
+      startRow: (1 - 1) * e.target.value + 1,
+      endRow: 1 * e.target.value,
+    }
+
+    setPageSize(e.target.value)
+    setPageNo(1)
+
+    const apiUrl = `/api/object/planReq/list?${queryStringFormatter(params)}`
+    promiseGet({ url: apiUrl }).then((res) => {
+      if (res.status === 200) {
+        if (isNotEmptyArray(res.data.data)) {
+          setGridProps({ ...gridProps, gridData: res.data.data, gridCount: res.data.data[0].totCnt })
+          setTotalCount(res.data.data[0].totCnt)
+        } else {
+          setGridProps({ ...gridProps, gridData: [], gridCount: 0 })
+          setTotalCount(0)
+        }
+      } else {
+        setGridProps({ ...gridProps, gridData: [], gridCount: 0 })
+        setTotalCount(0)
+      }
+    })
+  }
+
  const [gridProps, setGridProps] = useState({
    gridData: [],
    isPageable: false,
@ -292,10 +308,9 @@ export default function PlanRequestPop(props) {
                            <input
                              type="text"
                              className="input-light"
-                              value={planReqSearch?.schPlanReqNo ? planReqSearch?.schPlanReqNo : schPlanReqNo}
+                              value={schPlanReqNo}
                              onChange={(e) => {
                                setSchPlanReqNo(e.target.value)
-                                setPlanReqSearch({ ...planReqSearch, schPlanReqNo: e.target.value })
                              }}
                            />
                          </div>
@ -306,10 +321,9 @@ export default function PlanRequestPop(props) {
                            <input
                              type="text"
                              className="input-light"
-                              value={planReqSearch?.schTitle ? planReqSearch?.schTitle : schTitle}
+                              value={schTitle}
                              onChange={(e) => {
                                setSchTitle(e.target.value)
-                                setPlanReqSearch({ ...planReqSearch, schTitle: e.target.value })
                              }}
                            />
                          </div>
@ -320,10 +334,9 @@ export default function PlanRequestPop(props) {
                            <input
                              type="text"
                              className="input-light"
-                              value={planReqSearch?.schAddress ? planReqSearch?.schAddress : schAddress}
+                              value={schAddress}
                              onChange={(e) => {
                                setSchAddress(e.target.value)
-                                setPlanReqSearch({ ...planReqSearch, schAddress: e.target.value })
                              }}
                            />
                          </div>
@ -336,10 +349,9 @@ export default function PlanRequestPop(props) {
                            <input
                              type="text"
                              className="input-light"
-                              value={planReqSearch?.schSaleStoreName ? planReqSearch?.schSaleStoreName : schSaleStoreName}
+                              value={schSaleStoreName}
                              onChange={(e) => {
                                setSchSaleStoreName(e.target.value)
-                                setPlanReqSearch({ ...planReqSearch, schSaleStoreName: e.target.value })
                              }}
                            />
                          </div>
@ -350,10 +362,9 @@ export default function PlanRequestPop(props) {
                            <input
                              type="text"
                              className="input-light"
-                              value={planReqSearch?.schPlanReqName ? planReqSearch?.schPlanReqName : schPlanReqName}
+                              value={schPlanReqName}
                              onChange={(e) => {
                                setSchPlanReqName(e.target.value)
-                                setPlanReqSearch({ ...planReqSearch, schPlanReqName: e.target.value })
                              }}
                            />
                          </div>
@ -386,11 +397,10 @@ export default function PlanRequestPop(props) {
                                  type="radio"
                                  name="radio04"
                                  id="ra07"
-                                  checked={planReqSearch?.schDateGbn === 'S' ? true : false}
+                                  checked={schDateGbn === 'S' ? true : false}
                                  value={'S'}
                                  onChange={(e) => {
                                    setSchDateGbn(e.target.value)
-                                    setPlanReqSearch({ ...planReqSearch, schDateGbn: e.target.value })
                                  }}
                                />
                                <label htmlFor="ra07">{getMessage('stuff.planReqPopup.search.schDateGbnS')}</label>
@ -400,11 +410,10 @@ export default function PlanRequestPop(props) {
                                  type="radio"
                                  name="radio04"
                                  id="ra08"
-                                  checked={planReqSearch?.schDateGbn === 'R' ? true : false}
+                                  checked={schDateGbn === 'R' ? true : false}
                                  value={'R'}
                                  onChange={(e) => {
                                    setSchDateGbn(e.target.value)
-                                    setPlanReqSearch({ ...planReqSearch, schDateGbn: e.target.value })
                                  }}
                                />
                                <label htmlFor="ra08">{getMessage('stuff.planReqPopup.search.schDateGbnR')}</label>
@ -427,7 +436,16 @@ export default function PlanRequestPop(props) {
                </div>
              </div>
              <div className="design-request-grid">
-                <div className="design-request-grid-tit">Plan List</div>
+                <div className="design-request-count">
+                  <div className="design-request-grid-tit">Plan List</div>
+                  <div className="select-wrap">
+                    <select className="select-light" name="" id="" onChange={onChangePerPage}>
+                      <option>20</option>
+                      <option>40</option>
+                      <option>60</option>
+                    </select>
+                  </div>
+                </div>
                <PlanRequestPopQGrid {...gridProps} getSelectedRowdata={getSelectedRowdata} />
                <div className="pagination-wrap">
                  <QPagination pageNo={pageNo} pageSize={pageSize} pagePerBlock={10} totalCount={totalCount} handleChangePage={handleChangePage} />
--- a/src/locales/ja.json
+++ b/src/locales/ja.json
@ -459,6 +459,7 @@
  "stuff.addressPopup.btn1": "閉じる",
  "stuff.addressPopup.btn2": "住所適用",
  "stuff.planReqPopup.title": "設計依頼のインポート",
+  "stuff.temp.subTitle": "商品情報",
  "stuff.detail.required": "必須入力項目",
  "stuff.detail.planReqNo": "設計依頼No.",
  "stuff.detail.dispCompanyName": "担当者",
--- a/src/locales/ko.json
+++ b/src/locales/ko.json
@ -464,6 +464,7 @@
  "stuff.addressPopup.btn1": "닫기",
  "stuff.addressPopup.btn2": "주소적용",
  "stuff.planReqPopup.title": "설계의뢰 불러오기",
+  "stuff.temp.subTitle" : "물건정보",
  "stuff.detail.required": "필수 입력항목",
  "stuff.detail.planReqNo": "설계의뢰No.",
  "stuff.detail.dispCompanyName": "담당자",
--- a/src/store/planReqAtom.js
+++ b/src/store/planReqAtom.js
@ -1,22 +0,0 @@
-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: 20,
-  },
-  dangerouslyAllowMutability: true,
-})