견적서 견적 특이사항 열림 닫힘 추가
This commit is contained in:
parent
a9b2764af5
commit
54e0bfde39
3
public/static/images/canvas/estiment_arr.svg
Normal file
3
public/static/images/canvas/estiment_arr.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="11" height="7" viewBox="0 0 11 7" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 1L5.5 5.5L10 1" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 210 B |
@ -87,7 +87,7 @@ export default function CanvasPage() {
|
||||
{/* <Penal04/> */}
|
||||
|
||||
{/* 배치면 초기 설정 */}
|
||||
<PlacementSettingPop/>
|
||||
{/* <PlacementSettingPop/> */}
|
||||
|
||||
{/* 캔버스 기본 셋팅 */}
|
||||
{/* {modalOption.option && <SettingModal01/>} */}
|
||||
|
||||
@ -5,8 +5,10 @@ import FileDownOptionPop from "./estimatepop/FileDownOptionPop";
|
||||
import ProductFeaturesPop from "./estimatepop/ProductFeaturesPop";
|
||||
|
||||
import ReactSelect from "../common/reactselect/ReactSelect";
|
||||
import { useState } from "react";
|
||||
|
||||
export default function CanvasEstimate() {
|
||||
const [hidden, setHidden] = useState(false);
|
||||
return(
|
||||
<div className="sub-content estimate">
|
||||
<div className="sub-content-inner">
|
||||
@ -217,115 +219,123 @@ export default function CanvasEstimate() {
|
||||
<h3 className="product">見積もりの具体的な</h3>
|
||||
<div className="product_tit">製品情報</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-wrap">
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch01" />
|
||||
<label htmlFor="ch01">共通 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch02" />
|
||||
<label htmlFor="ch02">積上げ(YJOD) </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch03" />
|
||||
<label htmlFor="ch03">出力制御の時 (中三電以外)</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch04" />
|
||||
<label htmlFor="ch04">北面設置 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch05" />
|
||||
<label htmlFor="ch05">塩害地域 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch06" />
|
||||
<label htmlFor="ch06">積雪地域 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch07" />
|
||||
<label htmlFor="ch07">屋根材・寸法・レイアウト </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch08" />
|
||||
<label htmlFor="ch08">施工関連 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item act">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch09" />
|
||||
<label htmlFor="ch09">別途費用</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch10" />
|
||||
<label htmlFor="ch10">過積載</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch11" />
|
||||
<label htmlFor="ch11">パワコン・蓄電池 PCS </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch12" />
|
||||
<label htmlFor="ch12">架台</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch13" />
|
||||
<label htmlFor="ch13">Q.SUPREME </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch14" />
|
||||
<label htmlFor="ch14">HEMS</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch15" />
|
||||
<label htmlFor="ch15">概算見積概算見積</label>
|
||||
</div>
|
||||
<div className="left-unit-box">
|
||||
<button className="estimate-arr-btn down mr5" onClick={() => setHidden(false)}></button>
|
||||
<button className="estimate-arr-btn up" onClick={() => setHidden(true)}></button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="calculation-estimate">
|
||||
<dl>
|
||||
<dt>ダイドハント (D Y 4)(DY5)</dt>
|
||||
<dd>・木製垂木の場合、幅38㎜×厚さ40㎜以上、間隔455㎜以下となります。 </dd>
|
||||
<dd>・本見積は概算見積です。詳細設計時、及び構造計算時に材料等の変更の可能性があります。 </dd>
|
||||
<dd>・金具が取付可能と仮定して積算しております。ご注文前に必ず現調シートをご提出頂けます様、お願い致します。 </dd>
|
||||
<dd>・設置基準を満たした屋根面と仮定して積算しております。屋根材固定強度等、施工マニュアルをご参照の上、ご確認ください。</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>ワンカチ </dt>
|
||||
<dd>・風速は46ｍ/sを超える地域は設置不可となります。 </dd>
|
||||
<dd>・屋根材質は鋼板製（JIS A6514規格品の内）として御見積もり作成しております。 </dd>
|
||||
<dd>・屋根材板厚は0.6㎜以上として御見積もり作成しております。</dd>
|
||||
<dd>ピッチ外 ・若し現場で太陽電池モジュール 固定範囲から 両端の金具 がはみ出た 場合は、</dd>
|
||||
<dd>弊社システム保証対象外になりますので充分 ご注意下さい 。"</dd>
|
||||
</dl>
|
||||
<div className={`estimate-check-wrap ${hidden ? 'hide':''}`}>
|
||||
<div className="estimate-check-inner">
|
||||
<div className="special-note-check-wrap">
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch01" />
|
||||
<label htmlFor="ch01">共通 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch02" />
|
||||
<label htmlFor="ch02">積上げ(YJOD) </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch03" />
|
||||
<label htmlFor="ch03">出力制御の時 (中三電以外)</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch04" />
|
||||
<label htmlFor="ch04">北面設置 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch05" />
|
||||
<label htmlFor="ch05">塩害地域 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch06" />
|
||||
<label htmlFor="ch06">積雪地域 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch07" />
|
||||
<label htmlFor="ch07">屋根材・寸法・レイアウト </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch08" />
|
||||
<label htmlFor="ch08">施工関連 </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item act">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch09" />
|
||||
<label htmlFor="ch09">別途費用</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch10" />
|
||||
<label htmlFor="ch10">過積載</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch11" />
|
||||
<label htmlFor="ch11">パワコン・蓄電池 PCS </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch12" />
|
||||
<label htmlFor="ch12">架台</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch13" />
|
||||
<label htmlFor="ch13">Q.SUPREME </label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch14" />
|
||||
<label htmlFor="ch14">HEMS</label>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="special-note-check-item">
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch15" />
|
||||
<label htmlFor="ch15">概算見積概算見積</label>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
<div className="calculation-estimate">
|
||||
<dl>
|
||||
<dt>ダイドハント (D Y 4)(DY5)</dt>
|
||||
<dd>・木製垂木の場合、幅38㎜×厚さ40㎜以上、間隔455㎜以下となります。 </dd>
|
||||
<dd>・本見積は概算見積です。詳細設計時、及び構造計算時に材料等の変更の可能性があります。 </dd>
|
||||
<dd>・金具が取付可能と仮定して積算しております。ご注文前に必ず現調シートをご提出頂けます様、お願い致します。 </dd>
|
||||
<dd>・設置基準を満たした屋根面と仮定して積算しております。屋根材固定強度等、施工マニュアルをご参照の上、ご確認ください。</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt>ワンカチ </dt>
|
||||
<dd>・風速は46ｍ/sを超える地域は設置不可となります。 </dd>
|
||||
<dd>・屋根材質は鋼板製（JIS A6514規格品の内）として御見積もり作成しております。 </dd>
|
||||
<dd>・屋根材板厚は0.6㎜以上として御見積もり作成しております。</dd>
|
||||
<dd>ピッチ外 ・若し現場で太陽電池モジュール 固定範囲から 両端の金具 がはみ出た 場合は、</dd>
|
||||
<dd>弊社システム保証対象外になりますので充分 ご注意下さい 。"</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="table-box-title-wrap">
|
||||
<div className="title-wrap">
|
||||
|
||||
@ -166,6 +166,7 @@ export default function PublishPage() {
|
||||
<ul>
|
||||
<li>2024-11-04</li>
|
||||
<li>*배치면 초기설정 pop 이미지 불러오기 영역 수정</li>
|
||||
<li>*견적서 견적 특이사항 영역 닫힘 열림 추가</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td className="t-center">2024-10-28</td>
|
||||
|
||||
@ -828,22 +828,40 @@
|
||||
}
|
||||
}
|
||||
|
||||
.estimate-arr-btn{
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: #94A0AD url(../../public/static/images/canvas/estiment_arr.svg)no-repeat center;
|
||||
background-size: 11px 7px;
|
||||
border-radius: 2px;
|
||||
&.up{
|
||||
rotate: 180deg;
|
||||
}
|
||||
}
|
||||
.estimate-check-wrap{
|
||||
.estimate-check-inner{
|
||||
display: block;
|
||||
}
|
||||
&.hide{
|
||||
border-bottom: 1px solid #ECF0F4;
|
||||
margin-bottom: 15px;
|
||||
.estimate-check-inner{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.special-note-check-wrap{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
border: 1px solid #ECF0F4;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 30px;
|
||||
.special-note-check-item{
|
||||
padding: 14px 10px;
|
||||
border-right: 1px solid #ECF0F4;
|
||||
border-top: 1px solid #ECF0F4;
|
||||
&:nth-child(5n){
|
||||
border-right: none;
|
||||
}
|
||||
&:nth-child(-n+5){
|
||||
border-top: none;
|
||||
}
|
||||
border: 1px solid #ECF0F4;
|
||||
margin-top: -1px;
|
||||
margin-right: -1px;
|
||||
&.act{
|
||||
background-color: #F7F9FA;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user