#746 견적서 케이블 제품 관련

src/components/estimate/Estimate.jsx

@@ -58,6 +58,9 @@ export default function Estimate({}) {
 
   const [storePriceList, setStorePriceList] = useState([]) //가격표시 option
 
+  const [cableItemList, setCableItemList] = useState([]) //케이블 리스트
+  const [cableItem, setCableItem] = useState('') //케이블 선택값
+
   const [startDate, setStartDate] = useState(new Date())
   const singleDatePickerProps = {
     startDate,
@@ -96,6 +99,7 @@ export default function Estimate({}) {
 
   const initEstimate = (currPid = currentPid) => {
     console.log('🚀 ~ initEstimate ~ currPid:', currPid)
+    setCableItem('')
     closeAll()
     setObjectNo(objectRecoil.floorPlanObjectNo)
 
@@ -107,6 +111,16 @@ export default function Estimate({}) {
       setHonorificCodeList(code1)
     }
 
+    // 케이블제품 공통코드
+    const code2 = findCommonCode(117900)
+    if (code2 != null) {
+      code2.map((item) => {
+        item.value = item.clRefChr1
+        item.label = item.clRefChr2
+      })
+      setCableItemList(code2)
+    }
+
     //아이템 자동완성 목록 가져오기
     const param = {
       saleStoreId: session.storeId,
@@ -551,7 +565,7 @@ export default function Estimate({}) {
   }
 
   const getAbledItems = (items) => {
-    return items.filter((items) => items.paDispOrder === null)
+    return items.filter((items) => items.dispCableFlg !== '1' && items.paDispOrder === null)
   }
 
   const onChangeSelectAll = (e) => {
@@ -684,6 +698,22 @@ export default function Estimate({}) {
     setItemChangeYn(true)
   }
 
+  /* 케이블 select 변경시  */
+  const onChangeDisplayCableItem = (value, itemList) => {
+    //todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
+    if (estimateContextState.estimateType === 'YJSS') {
+      return swalFire({ text: getMessage('estimate.detail.save.requiredEstimateType'), type: 'alert', icon: 'warning' })
+    }
+    itemList.map((item, index) => {
+      if (item.dispCableFlg === '1') {
+        if (value !== '') {
+          onChangeDisplayItem(value, item.dispOrder, index)
+        }
+      }
+    })
+    setCableItem(value)
+  }
+
   // 아이템 자동완성 검색시 아이템 추가/변경시
   const onChangeDisplayItem = (itemId, dispOrder, index) => {
     //todo: 추후 YJSS가 다시 나타날 경우 아래 swalFire 제거 필요
@@ -1679,6 +1709,25 @@ export default function Estimate({}) {
                   {getMessage('estimate.detail.showPrice.pricingBtn')}
                 </button>
               </div>
+              <div className="product-price-wrap ml10">
+                <div className="select-wrap">
+                  <select
+                    className="select-light"
+                    onChange={(e) => {
+                      onChangeDisplayCableItem(e.target.value, estimateContextState.itemList)
+                    }}
+                    value={cableItem}
+                  >
+                    <option value={''}>selected</option>
+                    {cableItemList.length > 0 &&
+                      cableItemList.map((row) => (
+                        <option key={row.clRefChr1} value={row.clRefChr1}>
+                          {row.clRefChr2}
+                        </option>
+                      ))}
+                  </select>
+                </div>
+              </div>
               <div className="product-edit-wrap">
                 <ul className="product-edit-explane">
                   <li className="explane-item item01">
@@ -1758,7 +1807,7 @@ export default function Estimate({}) {
                                 <input
                                   type="checkbox"
                                   id={item?.dispOrder}
-                                  disabled={!!item?.paDispOrder}
+                                  disabled={!!item?.paDispOrder || item.dispCableFlg === '1'}
                                   onChange={() => onChangeSelect(item.dispOrder)}
                                   checked={!!selection.has(item.dispOrder)}
                                 />
@@ -1769,31 +1818,54 @@ export default function Estimate({}) {
                             <td>
                               <div className="form-flex-wrap">
                                 <div className="select-wrap mr5">
-                                  <Select
+                                  {item.dispCableFlg !== '1' ? (
-                                    name="long-value-select1"
+                                    <Select
-                                    instanceId="long-value-select1"
+                                      name="long-value-select1"
-                                    className="react-select-custom"
+                                      instanceId="long-value-select1"
-                                    classNamePrefix="custom"
+                                      className="react-select-custom"
-                                    placeholder="Select"
+                                      classNamePrefix="custom"
-                                    options={originDisplayItemList}
+                                      placeholder="Select"
-                                    onChange={(e) => {
+                                      options={originDisplayItemList}
-                                      if (isObjectNotEmpty(e)) {
+                                      onChange={(e) => {
-                                        onChangeDisplayItem(e.itemId, item.dispOrder, index)
+                                        if (isObjectNotEmpty(e)) {
-                                      }
+                                          onChangeDisplayItem(e.itemId, item.dispOrder, index)
-                                    }}
+                                        }
-                                    menuPlacement={'auto'}
+                                      }}
-                                    getOptionLabel={(x) => x.itemName}
+                                      menuPlacement={'auto'}
-                                    getOptionValue={(x) => x.itemNo}
+                                      getOptionLabel={(x) => x.itemName}
-                                    isClearable={false}
+                                      getOptionValue={(x) => x.itemNo}
-                                    isDisabled={!!item?.paDispOrder}
+                                      isClearable={false}
-                                    value={displayItemList.filter(function (option) {
+                                      isDisabled={!!item?.paDispOrder}
-                                      if (item.itemNo === '') {
+                                      value={displayItemList.filter(function (option) {
-                                        return false
+                                        if (item.itemNo === '') {
-                                      } else {
+                                          return false
-                                        return option.itemId === item.itemId
+                                        } else {
-                                      }
+                                          return option.itemId === item.itemId
-                                    })}
+                                        }
-                                  />
+                                      })}
+                                    />
+                                  ) : (
+                                    <Select
+                                      name="long-value-select11"
+                                      instanceId="long-value-select11"
+                                      className="react-select-custom"
+                                      classNamePrefix="custom"
+                                      placeholder="Select"
+                                      options={cableItemList}
+                                      onChange={(e) => {
+                                        if (isObjectNotEmpty(e)) {
+                                          onChangeDisplayItem(e.clRefChr1, item.dispOrder, index)
+                                        }
+                                      }}
+                                      menuPlacement={'auto'}
+                                      getOptionLabel={(x) => x.clRefChr2}
+                                      getOptionValue={(x) => x.clRefChr1}
+                                      isClearable={false}
+                                      value={cableItemList.filter(function (option) {
+                                        return option.clRefChr1 === item.itemId
+                                      })}
+                                    />
+                                  )}
                                 </div>
                                 {item?.itemChangeFlg === '1' && (
                                   <div className="btn-area">

src/hooks/common/useCommonCode.js

@@ -33,6 +33,8 @@ export const useCommonCode = () => {
         clCode: code.clCode,
         clCodeNm: globalLocale === 'ko' ? code.clCodeNm : code.clCodeJp,
         clPriority: code.clPriority,
+        clRefChr1: code.clRefChr1,
+        clRefChr2: code.clRefChr2,
       }
       return result
     })

src/hooks/floorPlan/estimate/useEstimateController.js

@@ -129,6 +129,7 @@ export const useEstimateController = (planNo, flag) => {
           delFlg: '0', //삭제 플래그 0 삭제하면 1
           addFlg: true,
           paDispOrder: null,
+          dispCableFlg: '0',
         },
       ],
     })