qcast3/qcast-pub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

신규물건 등록 페이지 추가

Browse Source
This commit is contained in:
김창수 2024-10-11 10:51:16 +09:00
parent 63e8ee51b8
commit d99876184a
13 changed files with 523 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
public/static/images/sub/address_search.svg Normal file
View File

@ -0,0 +1,11 @@
<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_4220_3331)">
<path d="M17.8789 17.9736L19.8789 19.9736" stroke="#364864" stroke-width="1.5" stroke-linecap="round"/>
<path d="M9.98926 18.4036C14.6837 18.4036 18.4893 14.5986 18.4893 9.90494C18.4893 5.21124 14.6837 1.40625 9.98926 1.40625C5.29484 1.40625 1.48926 5.21124 1.48926 9.90494C1.48926 14.5986 5.29484 18.4036 9.98926 18.4036Z" stroke="#364864" stroke-width="1.5"/>
</g>
<defs>
<clipPath id="clip0_4220_3331">
<rect width="21" height="21" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 611 B

2
src/app/canvas/page.jsx
View File

@ -69,7 +69,7 @@ export default function CanvasPage() {
<CanvasLayout menuValue={menuValue}/> <CanvasLayout menuValue={menuValue}/>
</div> </div>
{/* 우클릭 context menu */} {/* 우클릭 context menu */}
<CanvasContextMenu/> {/* <CanvasContextMenu/> */}
{/* 패널 배치 집계 */} {/* 패널 배치 집계 */}
{/* <Penal01/> */} {/* <Penal01/> */}

2
src/app/main/page.jsx
View File

@ -41,7 +41,7 @@ export default function MainPage() {
<Footer/> <Footer/>
{/* 비밀번호 변경팝업 */} {/* 비밀번호 변경팝업 */}
<ChangePasswordPop/> {/* <ChangePasswordPop/> */}
</div> </div>
) )
} }

53
src/app/management/newproduct/page.jsx Normal file
View File

@ -0,0 +1,53 @@
import Footer from "@/components/layout/Footer";
import Header from "@/components/layout/Header";
import Image from "next/image";
import Link from "next/link";
import '@/styles/contents.scss';
import '@/styles/grid.scss';
import NewProductTable from "@/components/sub/management/newproduct/NewProductTable";
import FindAddressPop from "@/components/sub/management/newproduct/FindAddressPop";
import DesignRequestPop from "@/components/sub/management/newproduct/DesignRequestPop";
export default function NewProductPage(){
return(
<div className="wrap">
<Header/>
<div className="content">
<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>
<div className="sub-content">
<div className="sub-content-inner">
<NewProductTable/>
</div>
</div>
</div>
<Footer/>
{/* 주소찾기 팝업 */}
{/* <FindAddressPop/> */}
{/* 설계의뢰 불러오기 팝업 */}
<DesignRequestPop/>
</div>
)
}

19
src/components/publishpage/PublishPage.jsx
View File

@ -88,7 +88,7 @@ export default function PublishPage() {
</tr> </tr>
<tr> <tr>
<td className="t-center"><strong>MainPage</strong></td> <td className="t-center"><strong>MainPage</strong></td>
<td><strong className="title"></strong></td> <td><strong className="title">메인</strong></td>
<td><Link href="/main" target="_blank">MainPage</Link></td> <td><Link href="/main" target="_blank">MainPage</Link></td>
<td className="coding_stat_web"> <td className="coding_stat_web">
<span>비밀번호 변경 팝업 추가</span> <span>비밀번호 변경 팝업 추가</span>
@ -97,27 +97,34 @@ export default function PublishPage() {
</tr> </tr>
<tr> <tr>
<td className="t-center" rowSpan={3}><strong>LoginPage</strong></td> <td className="t-center" rowSpan={3}><strong>LoginPage</strong></td>
<td><strong className="title"></strong></td> <td><strong className="title">로그인</strong></td>
<td><Link href="/login" target="_blank">LoginPage</Link></td> <td><Link href="/login" target="_blank">LoginPage</Link></td>
<td className="coding_stat_web"></td> <td className="coding_stat_web"></td>
<td className="t-center">2024-09-23</td> <td className="t-center">2024-09-23</td>
</tr> </tr>
<tr> <tr>
<td><strong className="title"></strong></td> <td><strong className="title">회원가입</strong></td>
<td><Link href="/login/signup" target="_blank">SignUpPage</Link></td> <td><Link href="/login/signup" target="_blank">SignUpPage</Link></td>
<td className="coding_stat_web"></td> <td className="coding_stat_web"></td>
<td className="t-center">2024-10-10</td> <td className="t-center">2024-10-10</td>
</tr> </tr>
<tr> <tr>
<td><strong className="title"></strong></td> <td><strong className="title">회원가입 완료</strong></td>
<td><Link href="/login/signupcomplete" target="_blank">SignUpCompletePage</Link></td> <td><Link href="/login/signupcomplete" target="_blank">SignUpCompletePage</Link></td>
<td className="coding_stat_web"></td> <td className="coding_stat_web"></td>
<td className="t-center">2024-10-10</td> <td className="t-center">2024-10-10</td>
</tr> </tr>
<tr>
<td className="t-center"><strong>신규물건 등록</strong></td>
<td><strong className="title">신규물건 등록</strong></td>
<td><Link href="/management/newproduct" target="_blank">NewProductPage</Link></td>
<td className="coding_stat_web"></td>
<td className="t-center">2024-10-11</td>
</tr>
<tr> <tr>
<td className="t-center" rowSpan={2}><strong>물품 및 도면 관리</strong></td> <td className="t-center" rowSpan={2}><strong>물품 및 도면 관리</strong></td>
<td><strong className="title"></strong></td> <td><strong className="title">물건목록</strong></td>
<td><Link href="/management/productstate" target="_blank">물건현황</Link></td> <td><Link href="/management/productstate" target="_blank">ProductStatePage</Link></td>
<td className="coding_stat_web"></td> <td className="coding_stat_web"></td>
<td className="t-center">2024-09-24</td> <td className="t-center">2024-09-24</td>
</tr> </tr>

111
src/components/sub/management/newproduct/DesignRequestPop.jsx Normal file
View File

@ -0,0 +1,111 @@
import SingleDatePicker from "@/components/common/datepicker/SingleDatePicker";
export default function DesignRequestPop(){
return(
<div className="modal-popup">
<div className="modal-dialog big">
<div className="modal-content">
<div className="modal-header">
<h1 className="title">設計依頼のインポート </h1>
<button className="modal-close">닫기</button>
</div>
<div className="modal-body">
<div className="modal-body-inner">
<div className="design-request-table">
<div className="common-table">
<table>
<colgroup>
<col style={{width : '160px'}}/>
<col />
<col style={{width : '160px'}}/>
<col />
<col style={{width : '160px'}}/>
<col />
</colgroup>
<tbody>
<tr>
<th>設計依頼番号</th>
<td>
<div className="input-wrap">
<input type="text" className="input-light" />
</div>
</td>
<th>案件名</th>
<td>
<div className="input-wrap">
<input type="text" className="input-light" />
</div>
</td>
<th>都道府県</th>
<td>
<div className="input-wrap">
<input type="text" className="input-light" />
</div>
</td>
</tr>
<tr>
<th>販売代理店名</th>
<td>
<div className="input-wrap">
<input type="text" className="input-light" />
</div>
</td>
<th>依頼者名</th>
<td>
<div className="input-wrap">
<input type="text" className="input-light" />
</div>
</td>
<th>状態</th>
<td>
<div className="select-wrap">
<select className="select-light" name="" id="" >
<option>All</option>
</select>
</div>
</td>
</tr>
<tr>
<th>期間検索</th>
<td colSpan={5}>
<div className="form-flex-wrap">
<div className="radio-wrap mr10">
<div className="d-check-radio light mr10">
<input type="radio" name="radio04" id="ra07" />
<label htmlFor="ra07">提出日</label>
</div>
<div className="d-check-radio light">
<input type="radio" name="radio04" id="ra08" />
<label htmlFor="ra08">受付日</label>
</div>
</div>
<div className="date-picker-wrap">
<div className="date-picker" style={{flex: 1}}>
<SingleDatePicker/>
</div>
<span> ~ </span>
<div className="date-picker" style={{flex: 1}}>
<SingleDatePicker/>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div className="design-request-grid">
<div className="design-request-grid-tit">Plan List</div>
</div>
</div>
<div className="footer-btn-wrap">
<button className="btn-origin grey mr5">閉じる</button>
<button className="btn-origin navy ">選択の適用</button>
</div>
</div>
</div>
</div>
</div>
)
}

31
src/components/sub/management/newproduct/FindAddressPop.jsx Normal file
View File

@ -0,0 +1,31 @@
export default function FindAddressPop(){
return(
<div className="modal-popup">
<div className="modal-dialog middle">
<div className="modal-content">
<div className="modal-header">
<h1 className="title">郵便番号 </h1>
<button className="modal-close">닫기</button>
</div>
<div className="modal-body">
<div className="modal-body-inner">
<div className="address-input-wrap">
<input type="text" className="address-input" placeholder='郵便番号の7桁を入力してください。'/>
<button className="search-btn"></button>
</div>
<div className="address-grid">
grid영역
</div>
</div>
<div className="footer-btn-wrap">
<button className="btn-origin grey mr5">閉じる</button>
<button className="btn-origin navy ">住所適用</button>
</div>
</div>
</div>
</div>
</div>
)
}

240
src/components/sub/management/newproduct/NewProductTable.jsx Normal file
View File

@ -0,0 +1,240 @@
export default function NewProductTable(){
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>設計依頼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>
</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>
</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>
</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>
</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>
<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>東京</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 className="mr10">m/s以下</span>
<button className="btn-origin grey">風速選択</button>
</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="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">基軸</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>
</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>
</div>
<div className="sub-right-footer">
<button className="btn-origin navy mr5">商品リスト</button>
<button className="btn-origin grey">一時保存</button>
</div>
</div>
)
}

2
src/components/sub/management/productinfo/ProductInfoTable.jsx
View File

@ -217,7 +217,7 @@ export default function ProductInfoTable(){
</tbody> </tbody>
</table> </table>
</div> </div>
<div className="sub-table-footer"> <div className="sub-center-footer">
<button className="btn-origin grey mr5">商品リスト</button> <button className="btn-origin grey mr5">商品リスト</button>
<button className="btn-origin navy mr5">保存</button> <button className="btn-origin navy mr5">保存</button>
<button className="btn-origin grey">物の削除</button> <button className="btn-origin grey">物の削除</button>

1
src/components/sub/management/productstate/PropertyStatus.jsx
View File

@ -8,6 +8,7 @@ export default function PropertyStatus(){
<h3>物件状況</h3> <h3>物件状況</h3>
</div> </div>
<div className="left-unit-box"> <div className="left-unit-box">
<button className="btn-origin navy mr5">物件登録</button>
<button className="btn-origin navy mr5">照会</button> <button className="btn-origin navy mr5">照会</button>
<button className="btn-origin grey">初期化</button> <button className="btn-origin grey">初期化</button>
</div> </div>

8
src/styles/_contents.scss
View File

@ -596,12 +596,18 @@
.important{ .important{
color: #f00; color: #f00;
} }
.sub-table-footer{ .sub-center-footer{
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
margin-top: 20px; margin-top: 20px;
} }
.sub-right-footer{
display: flex;
align-items: center;
justify-content: flex-end;
margin-top: 20px;
}
.pagination-wrap{ .pagination-wrap{
margin-top: 24px; margin-top: 24px;
} }

52
src/styles/_submodal.scss
View File

@ -17,6 +17,12 @@
z-index:200000; z-index:200000;
margin: 1.5rem auto; margin: 1.5rem auto;
pointer-events: none; pointer-events: none;
&.middle{
width: 800px;
}
&.big{
width: 1000px;
}
.modal-content{ .modal-content{
flex:1; flex:1;
position: relative; position: relative;
@ -144,4 +150,50 @@
padding-left: 10px; padding-left: 10px;
} }
} }
}
// 주소찾기 팝업
.address-input-wrap{
position: relative;
height: 45px;
padding: 0 40px 0 15px;
border-radius: 4px;
border: 1px solid #E9E9E9;
background: #FFF;
margin-bottom: 20px;
input{
width: 100%;
height: 100%;
font-size: 13px;
font-weight: 400;
font-family: "Noto Sans JP" sans-serif;
color: #868686;
&::placeholder{
color: #AEAEAE;
font-size: 13px;
font-weight: 400;
}
}
.search-btn{
position: absolute;
top: 0;
right: 15px;
width: 21px;
height: 100%;
background: url(../../public/static/images/sub/address_search.svg)no-repeat center;
background-size: 21px 21px;
}
}
// 설계의뢰 불러오기
.design-request-table{
margin-bottom: 20px;
}
.design-request-grid{
.design-request-grid-tit{
font-size: 13px;
font-weight: 600;
color: #101010;
margin-bottom: 15px;
}
} }

1
src/styles/_table.scss
View File

@ -89,6 +89,7 @@ table{
color: #697C8F; color: #697C8F;
font-weight: normal; font-weight: normal;
margin-left: 15px; margin-left: 15px;
margin-bottom: 0;
} }
span{ span{
font-size: 13px; font-size: 13px;