물건 상세 페이지 수정
This commit is contained in:
parent
d99876184a
commit
427b546d61
4
public/static/images/sub/information_help.svg
Normal file
4
public/static/images/sub/information_help.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="22" height="23" viewBox="0 0 22 23" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M20.9598 10.4707C21.0134 11.3009 21.0134 12.1606 20.9598 12.9908C20.6856 17.2332 17.3536 20.6124 13.1706 20.8905C11.7435 20.9853 10.2536 20.9851 8.8294 20.8905C8.33896 20.8579 7.8044 20.7408 7.34401 20.5512C6.83177 20.3402 6.5756 20.2347 6.44544 20.2507C6.31527 20.2668 6.1264 20.406 5.74868 20.6846C5.08268 21.1757 4.24367 21.5284 2.99943 21.4981C2.37026 21.4828 2.05568 21.4751 1.91484 21.235C1.77401 20.9949 1.94941 20.6625 2.30021 19.9978C2.78674 19.0758 3.09501 18.0202 2.62791 17.1745C1.82343 15.9665 1.1401 14.5359 1.04024 12.9908C0.986587 12.1606 0.986587 11.3009 1.04024 10.4707C1.31441 6.22831 4.64639 2.84907 8.8294 2.57101C10.0318 2.49108 10.2812 2.4785 11.5 2.53362" stroke="#45576F" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M20.9996 5C20.9996 6.933 19.4326 8.5 17.4996 8.5C15.5666 8.5 13.9996 6.933 13.9996 5C13.9996 3.067 15.5666 1.5 17.4996 1.5C19.4326 1.5 20.9996 3.067 20.9996 5Z" stroke="#45576F" stroke-width="1.5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -129,10 +129,10 @@ export default function PublishPage() {
|
||||
<td className="t-center">2024-09-24</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong className="title"></strong></td>
|
||||
<td><Link href="/management/productinfo" target="_blank">물건정보</Link></td>
|
||||
<td><strong className="title">물건정보</strong></td>
|
||||
<td><Link href="/management/productinfo" target="_blank">ProductInfoPage</Link></td>
|
||||
<td className="coding_stat_web"></td>
|
||||
<td className="t-center">2024-09-12</td>
|
||||
<td className="t-center">2024-10-11</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
|
||||
@ -181,7 +181,7 @@ export default function NewProductTable(){
|
||||
</div>
|
||||
<div className="d-check-radio light">
|
||||
<input type="radio" name="radio02" id="ra04" />
|
||||
<label htmlFor="ra04">基軸</label>
|
||||
<label htmlFor="ra04">II</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-check-box light mr5">
|
||||
|
||||
@ -2,222 +2,260 @@ export default function ProductInfoTable(){
|
||||
return(
|
||||
<div className="sub-table-box">
|
||||
<div className="promise-gudie"><span className="important">*</span> 必須入力項目</div>
|
||||
<div className="infomation-table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style={{width: '200px'}}/>
|
||||
<col />
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>担当者 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width : '500px'}}>
|
||||
<input type="text" className="input-light" defaultValue='Kim Ji Young'/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>物品区分/物件名 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio01" id="ra01" />
|
||||
<label htmlFor="ra01">新築</label>
|
||||
<div className="infomation-wrap">
|
||||
<div className="infomation-table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style={{width: '200px'}}/>
|
||||
<col />
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>設計依頼No.</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="input-wrap mr5" style={{width : '200px'}}>
|
||||
<input type="text" className="input-light" defaultValue='1000000002' readOnly/>
|
||||
</div>
|
||||
<button className="btn-origin grey">設計依頼のインポート</button>
|
||||
</div>
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02">基軸</label>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>担当者 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width : '500px'}}>
|
||||
<input type="text" className="input-light" defaultValue='Kim Ji Young'/>
|
||||
</div>
|
||||
<div className="input-wrap mr5" style={{width : '545px'}}>
|
||||
<input type="text" className="input-light" defaultValue='jy0619_0625'/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>物品区分/物件名 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio01" id="ra01" />
|
||||
<label htmlFor="ra01">新築</label>
|
||||
</div>
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02">基軸</label>
|
||||
</div>
|
||||
<div className="input-wrap mr5" style={{width : '545px'}}>
|
||||
<input type="text" className="input-light" defaultValue='jy0619_0625'/>
|
||||
</div>
|
||||
<div className="select-wrap" style={{width : '120px'}}>
|
||||
<select className="select-light" name="" id="" >
|
||||
<option>案件</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="select-wrap" style={{width : '120px'}}>
|
||||
<select className="select-light" name="" id="" >
|
||||
<option>案件</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>商品名 ふりがな</th>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width : '789px'}}>
|
||||
<input type="text" className="input-light" />
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>商品名 ふりがな</th>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width : '789px'}}>
|
||||
<input type="text" className="input-light" />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
<div className="flx-box">
|
||||
<div className="title">
|
||||
一次販売店名/ID <span className="important">*</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
<div className="flx-box">
|
||||
<div className="title">
|
||||
一次販売店名/ID <span className="important">*</span>
|
||||
</div>
|
||||
<div className="tooltips"></div>
|
||||
</div>
|
||||
<div className="tooltips"></div>
|
||||
</div>
|
||||
</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr5" style={{width : '567px'}}>
|
||||
</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr5" style={{width : '567px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>選択</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="input-wrap" style={{width : '216px'}}>
|
||||
<input type="text" className="input-light" readOnly/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
<div className="flx-box">
|
||||
<div className="title">
|
||||
二次販売店名/ID <span className="important">*</span>
|
||||
</div>
|
||||
<div className="tooltips"></div>
|
||||
</div>
|
||||
</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr5" style={{width : '567px'}}>
|
||||
<select className="select-light" name="" id="" >
|
||||
<option>選択</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="input-wrap" style={{width : '216px'}}>
|
||||
<input type="text" className="input-light" readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>郵便番号 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="input-wrap mr5" style={{width : '200px'}}>
|
||||
<input type="text" className="input-light" readOnly/>
|
||||
</div>
|
||||
<button className="btn-origin grey">住所検索</button>
|
||||
<div className="guide">※ 郵便番号7桁を入力した後、アドレス検索ボタンをクリックしてください</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>都道府県 / 住所 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="input-wrap mr5" style={{width : '200px'}}>
|
||||
<input type="text" className="input-light" readOnly/>
|
||||
</div>
|
||||
<div className="input-wrap mr5" style={{width : '580px'}}>
|
||||
<input type="text" className="input-light" />
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>発電量シミュレーション地域 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="select-wrap" style={{width : '200px'}} >
|
||||
<select className="select-light" name="" id="" disabled>
|
||||
<option>INTERPLUG TEST</option>
|
||||
<option>東京</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="input-wrap" style={{width : '216px'}}>
|
||||
<input type="text" className="input-light" defaultValue={'201TES01'} readOnly/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>基準風速 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>40</option>
|
||||
</select>
|
||||
</div>
|
||||
<span className="mr10">m/s以下</span>
|
||||
<button className="btn-origin grey">風速選択</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>
|
||||
<div className="flx-box">
|
||||
<div className="title">
|
||||
二次販売店名/ID <span className="important">*</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>垂直説説 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>40</option>
|
||||
</select>
|
||||
</div>
|
||||
<span className="mr10">cm</span>
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch01" />
|
||||
<label htmlFor="ch01">寒冷地対策施行</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="tooltips"></div>
|
||||
</div>
|
||||
</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr5" style={{width : '567px'}}>
|
||||
<select className="select-light" name="" id="" disabled>
|
||||
<option>INTERPLUG TEST</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>面調図区分 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="radio-wrap flx-box" style={{width: '239px'}}>
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio02" id="ra03" />
|
||||
<label htmlFor="ra03">III・IV</label>
|
||||
</div>
|
||||
<div className="d-check-radio light">
|
||||
<input type="radio" name="radio02" id="ra04" />
|
||||
<label htmlFor="ra04">II</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="d-check-box light mr5">
|
||||
<input type="checkbox" id="ch02" />
|
||||
<label htmlFor="ch02">塩害地域用アイテムの使用</label>
|
||||
</div>
|
||||
<div className="tooltips"></div>
|
||||
</div>
|
||||
<div className="input-wrap" style={{width : '216px'}}>
|
||||
<input type="text" className="input-light" defaultValue={'201TES01'} readOnly/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>設置高さ <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
<span>m</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>郵便番号 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="input-wrap mr5" style={{width : '200px'}}>
|
||||
<input type="text" className="input-light" defaultValue={'1050013'}/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>契約条件</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio03" id="ra05" />
|
||||
<label htmlFor="ra05">余剰</label>
|
||||
</div>
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio03" id="ra06" />
|
||||
<label htmlFor="ra06">全量</label>
|
||||
</div>
|
||||
</div>
|
||||
<button className="btn-origin grey">住所検索</button>
|
||||
<div className="guide">※ 郵便番号7桁を入力した後、アドレス検索ボタンをクリックしてください</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>都道府県 / 住所 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="input-wrap mr5" style={{width : '200px'}}>
|
||||
<input type="text" className="input-light" defaultValue={'東京'} readOnly/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>メモ</th>
|
||||
<td>
|
||||
<div className="input-wrap">
|
||||
<input type="text" className="input-light" />
|
||||
</div>
|
||||
<div className="input-wrap mr5" style={{width : '580px'}}>
|
||||
<input type="text" className="input-light" defaultValue={'ミスマス秒'} />
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>発電量シミュレーション地域 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="select-wrap" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>東京</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>基準風速 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>40</option>
|
||||
</select>
|
||||
</div>
|
||||
<span>m/s以下</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>垂直説説 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>40</option>
|
||||
</select>
|
||||
</div>
|
||||
<span className="mr10">cm</span>
|
||||
<div className="d-check-box light">
|
||||
<input type="checkbox" id="ch01" />
|
||||
<label htmlFor="ch01">寒冷地対策施行</label>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>面調図区分 <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio02" id="ra03" />
|
||||
<label htmlFor="ra03">III・IV</label>
|
||||
</div>
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio02" id="ra04" />
|
||||
<label htmlFor="ra04">基軸</label>
|
||||
</div>
|
||||
<div className="d-check-box light mr5">
|
||||
<input type="checkbox" id="ch02" />
|
||||
<label htmlFor="ch02">塩害地域用アイテムの使用</label>
|
||||
</div>
|
||||
<div className="tooltips"></div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>設置高さ <span className="important">*</span></th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="select-wrap mr10" style={{width : '200px'}}>
|
||||
<select className="select-light" name="" id="">
|
||||
<option>5</option>
|
||||
</select>
|
||||
</div>
|
||||
<span>m</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>契約条件</th>
|
||||
<td>
|
||||
<div className="flx-box">
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio03" id="ra05" />
|
||||
<label htmlFor="ra05">余剰</label>
|
||||
</div>
|
||||
<div className="d-check-radio light mr10">
|
||||
<input type="radio" name="radio03" id="ra06" />
|
||||
<label htmlFor="ra06">全量</label>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>メモ</th>
|
||||
<td>
|
||||
<div className="input-wrap">
|
||||
<input type="text" className="input-light" />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div className="sub-center-footer">
|
||||
<div className="table-box-title-wrap">
|
||||
<div className="title-wrap">
|
||||
<h3>プランリスト</h3>
|
||||
<ul className="info-wrap">
|
||||
<li>全体 <span className="red">28</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="information-help-wrap">
|
||||
<div className="information-help-tit-wrap">
|
||||
<div className="help-tit-icon"></div>
|
||||
<div className="help-tit">ヘルプ</div>
|
||||
</div>
|
||||
<div className="information-help-guide">
|
||||
<span>1.発注は同一品番基準1件のみ可能です。</span>
|
||||
<span>2. [Excelダウンロード]は、見積書、図面、シミュレーション結果をExcelファイルとして一度にダウンロードします。</span>
|
||||
<span>3.プラン情報をダブルクリックすると図面作成画面に移動します。</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="information-grid">
|
||||
grid 영역
|
||||
</div>
|
||||
<div className="sub-right-footer">
|
||||
<button className="btn-origin grey mr5">商品リスト</button>
|
||||
<button className="btn-origin navy mr5">保存</button>
|
||||
<button className="btn-origin grey">物の削除</button>
|
||||
|
||||
@ -613,6 +613,10 @@
|
||||
}
|
||||
}
|
||||
|
||||
.infomation-wrap{
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.infomation-box-wrap{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -857,3 +861,44 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 물건상세
|
||||
.information-help-wrap{
|
||||
display: flex;
|
||||
padding: 24px;
|
||||
background-color: #F4F4F4;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 15px;
|
||||
.information-help-tit-wrap{
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 40px;
|
||||
border-right: 1px solid #E0E0E3;
|
||||
.help-tit-icon{
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
margin-right: 10px;
|
||||
background: #fff url(../../public/static/images/sub/information_help.svg)no-repeat center;
|
||||
background-size: 20px 20px;
|
||||
}
|
||||
.help-tit{
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #45576F;
|
||||
}
|
||||
}
|
||||
.information-help-guide{
|
||||
padding-left: 40px;
|
||||
span{
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
margin-bottom: 7px;
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user