Qselect 수정 및 배치면 초기설정 팝업 select disabled 추가

src/app/canvas/page.jsx

@@ -83,13 +83,13 @@ export default function CanvasPage() {
                     {/* <CanvasContextMenu/> */}
                     
                     {/* 패널 배치 집계 */}
-                    <Penal01/>
+                    {/* <Penal01/> */}
-                    <Penal02/>
+                    {/* <Penal02/> */}
-                    <Penal03/>
+                    {/* <Penal03/> */}
-                    <Penal04/>
+                    {/* <Penal04/> */}
 
                     {/* 배치면 초기 설정 */}
-                    {/* <PlacementSettingPop/> */}
+                    <PlacementSettingPop/>
 
                     {/* 캔버스 기본 셋팅 */}
                     {/* {modalOption.option && <SettingModal01/>} */}
@@ -106,7 +106,7 @@ export default function CanvasPage() {
                     {/* <PropertiesSetting/> */}
 
                     {/* 지붕형상 설정 */}
-                    {/* <RoofShapeOption/> */}
+                    <RoofShapeOption/>
 
                     {/* 지붕형상 수동 설정 */}
                     {/* <ManualRoofShape/> */}
@@ -135,7 +135,7 @@ export default function CanvasPage() {
                     {/* <SlopeOption/> */}
 
                     {/* 배치면 그리기 */}
-                    {/* <ArrangementSetting/> */}
+                    <ArrangementSetting/>
 
                     {/* 면형상 배치 */}
                     {/* <PlaneShapeOption/> */}
@@ -158,13 +158,13 @@ export default function CanvasPage() {
                     {/* <DrawingFlow/> */}
 
                     {/* 지붕모듈선택 */}
-                    {/* <RoofModuleOption/> */}
+                    <RoofModuleOption/>
 
                     {/* 육지붕모듈 선택 */}
                     {/* <HexagonalRoofOption/> */}
 
                     {/* 회로 및 가대설정 */}
-                    {/* <CircuitStandSetting/> */}
+                    <CircuitStandSetting/>
 
                     {/* 모듈 부가기능 */}
 

src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx

@@ -95,7 +95,7 @@ export default function PlacementSettingPop(){
                                             <div className="flex-ment">
                                                 <span>垂木の間隔</span>
                                                 <div className="grid-select no-flx" style={{width: '160px'}}>
-                                                    <Qselect title={'세로 455mm이하'} option={SelectOption04}/>
+                                                    <Qselect title={'세로 455mm이하'} option={SelectOption04} disabled={true}/>
                                                 </div>
                                             </div>
                                         </div>

src/components/common/select/Qselect.jsx

@@ -1,11 +1,18 @@
 'use client'
 import { useState } from "react"
 
-export default function Qselect({title, option}){
+export default function Qselect({title, option, disabled}){
     const [selectAct, setSelectAct] = useState(false);
 
+    const disabledCheck = () => {
+        if(disabled){
+            setSelectAct(false)
+        }else{
+            setSelectAct(!selectAct);
+        }
+    }
     return(
-        <div className={`sort-select ${selectAct ? 'active' : ''}`} onClick={() => setSelectAct(!selectAct)}>
+        <div className={`sort-select ${selectAct ? 'active' : ''} ${disabled ? 'disabled' : ''}`} onClick={disabledCheck}>
             <p>{title}</p>
             <ul className="select-item-wrap">
                 {option.map((el, idx) => (

src/components/publishpage/PublishPage.jsx

@@ -253,6 +253,7 @@ export default function PublishPage() {
                       (지붕형상 수동 설정, 배치면 그리기, 외벽선 작성, 오브젝트 배치, 동선이동 형 올림 내림, 지붕형상 설정, 지붕모듈 설정, 보조선 작성, 처마∙케라바 변경, 외벽선 편집 및 오프셋, 각 변 속성 변경, 실측치 설정	)
                     </li>
                     <li>*패널 배치 집계 수정</li>
+                    <li>*Qselect 컴포넌트 수정 및 배치면 초기설정 selelct disabled 추가</li>
                   </ul>
                 </td>
                 <td className="t-center">2024-10-28</td>

src/styles/_reset.scss

@@ -414,6 +414,15 @@ button{
             transform: translateY(-50%) rotate(-180deg);
         }
     }
+    &.disabled{
+        cursor: default;
+        p{
+            color: #aaa;
+        }
+        &::after{
+            opacity: 0.7;
+        }
+    }
 }
 
 .select-light{