견적서 및 배치면 초기설정 팝업 수정
This commit is contained in:
parent
0addc9cf00
commit
dabb4542ec
6
public/static/images/canvas/img_check_fail.svg
Normal file
6
public/static/images/canvas/img_check_fail.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="elements">
|
||||
<path id="Vector" d="M6.73735 6.73726L11.2628 11.2627M11.2628 6.73726L6.73735 11.2627" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path id="Ellipse 1334" d="M17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17C13.4183 17 17 13.4183 17 9Z" stroke="white"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 431 B |
4
public/static/images/canvas/img_check_success.svg
Normal file
4
public/static/images/canvas/img_check_success.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 9.5L7.5 12L13 6" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17C13.4183 17 17 13.4183 17 9Z" stroke="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 332 B |
4
public/static/images/canvas/img_edit_ico.svg
Normal file
4
public/static/images/canvas/img_edit_ico.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M9.00078 5.7998V12.1998M12.2008 8.9998L5.80078 8.9998" stroke="#141B34" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17 9C17 4.58172 13.4183 1 9 1C4.58172 1 1 4.58172 1 9C1 13.4183 4.58172 17 9 17C13.4183 17 17 13.4183 17 9Z" stroke="#141B34"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 371 B |
@ -1,11 +1,5 @@
|
||||
<svg width="23" height="24" viewBox="0 0 23 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="ico">
|
||||
<circle id="Ellipse 2012" cx="11.5" cy="12" r="11.5" fill="#45576F"/>
|
||||
<g id="elements">
|
||||
<path id="Vector" d="M9.66678 12.8193C9.7612 12.9739 9.87323 13.1202 10.0029 13.2552C10.8079 14.093 12.0349 14.224 12.9718 13.6481C13.1454 13.5414 13.3091 13.4104 13.4582 13.2552L15.6178 11.0076C16.572 10.0145 16.572 8.40447 15.6178 7.41141C14.6637 6.41836 13.1166 6.41836 12.1625 7.41142L11.6868 7.90648" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
|
||||
<path id="Vector_2" d="M10.313 16.0933L9.83718 16.5885C8.88301 17.5816 7.33598 17.5816 6.3818 16.5885C5.42762 15.5955 5.42762 13.9854 6.3818 12.9924L8.54141 10.7448C9.49559 9.75174 11.0426 9.75174 11.9968 10.7448C12.1264 10.8797 12.2384 11.026 12.3328 11.1806" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
|
||||
<path id="Vector_3" d="M17.0003 14.6666H15.6143M13.6669 18L13.6669 16.614" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path id="Vector_4" d="M5 9.33333H6.38593M8.33333 6L8.33333 7.38593" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
</g>
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" fill="white"/>
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" stroke="#0191C9"/>
|
||||
<path d="M13.186 5.7898C12.6312 5.20223 11.7307 5.20223 11.1759 5.7898L6.99193 10.2206C6.03462 11.2344 6.03462 12.8767 6.99193 13.8905C7.94924 14.9043 9.50003 14.9043 10.4573 13.8905L13.9136 10.2303C14.1615 9.96779 14.5663 9.96779 14.8141 10.2303C15.062 10.4928 15.062 10.9214 14.8141 11.1839L11.3578 14.8441C9.90251 16.3853 7.54676 16.3853 6.09147 14.8441C4.63618 13.303 4.63618 10.8082 6.09147 9.26705L10.2754 4.8362C11.3282 3.72127 13.0337 3.72127 14.0865 4.8362C15.1393 5.95114 15.1393 7.75719 14.0865 8.87212L10.0844 13.1103C9.43409 13.799 8.379 13.799 7.72867 13.1103C7.07834 12.4216 7.07834 11.3043 7.72867 10.6156L11.0031 7.14795C11.2509 6.88547 11.6557 6.88547 11.9035 7.14795C12.1514 7.41042 12.1514 7.83906 11.9035 8.10154L8.62913 11.5692C8.47678 11.7305 8.47678 11.9954 8.62913 12.1567C8.78148 12.3181 9.03161 12.3181 9.18396 12.1567L13.186 7.91853C13.7408 7.33096 13.7408 6.37736 13.186 5.7898Z" fill="#0191C9" stroke="white" stroke-width="0.5"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
7
public/static/images/sub/change_ico.svg
Normal file
7
public/static/images/sub/change_ico.svg
Normal file
@ -0,0 +1,7 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" fill="white"/>
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" stroke="#909000"/>
|
||||
<path d="M4 10C4 13.3137 6.68629 16 10 16C13.3137 16 16 13.3137 16 10C16 6.68629 13.3137 4 10 4" stroke="#909000" stroke-linecap="round"/>
|
||||
<path d="M5.58914 5.8473C5.67215 5.75932 5.75769 5.67375 5.84566 5.59071M7.5684 4.43768C7.67731 4.38873 7.78788 4.34282 7.9 4.30005M4.3 7.90005C4.34317 7.78681 4.38955 7.67516 4.43904 7.5652" stroke="#909000" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9.99999 7.59961V12.3996M12.4 9.99961L7.59999 9.99961" stroke="#909000" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 772 B |
@ -1,4 +1,5 @@
|
||||
<svg width="15" height="16" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="7" cy="7.5" r="6.5" fill="white" stroke="#F16A6A"/>
|
||||
<path d="M6.507 9.228L6.276 5.169L6.221 3.629H7.849L7.794 5.169L7.563 9.228H6.507ZM7.035 12.154C6.74167 12.154 6.49967 12.0513 6.309 11.846C6.12567 11.6407 6.034 11.3913 6.034 11.098C6.034 10.79 6.12567 10.537 6.309 10.339C6.49967 10.141 6.74167 10.042 7.035 10.042C7.32833 10.042 7.56667 10.141 7.75 10.339C7.94067 10.537 8.036 10.79 8.036 11.098C8.036 11.3913 7.94067 11.6407 7.75 11.846C7.56667 12.0513 7.32833 12.154 7.035 12.154Z" fill="#F16A6A"/>
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" fill="white"/>
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" stroke="#F16A6A"/>
|
||||
<path d="M9.47136 11.228L9.24036 7.169L9.18536 5.629H10.8134L10.7584 7.169L10.5274 11.228H9.47136ZM9.99936 14.154C9.70602 14.154 9.46402 14.0513 9.27336 13.846C9.09002 13.6407 8.99836 13.3913 8.99836 13.098C8.99836 12.79 9.09002 12.537 9.27336 12.339C9.46402 12.141 9.70602 12.042 9.99936 12.042C10.2927 12.042 10.531 12.141 10.7144 12.339C10.905 12.537 11.0004 12.79 11.0004 13.098C11.0004 13.3913 10.905 13.6407 10.7144 13.846C10.531 14.0513 10.2927 14.154 9.99936 14.154Z" fill="#F16A6A"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 620 B After Width: | Height: | Size: 738 B |
6
public/static/images/sub/open_ico.svg
Normal file
6
public/static/images/sub/open_ico.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" fill="white"/>
|
||||
<rect x="0.5" y="0.5" width="19" height="19" rx="9.5" stroke="#3BBB48"/>
|
||||
<path d="M11.3571 4.95962C10.7174 4.31987 10.3975 4 10 4C9.60251 4 9.28264 4.31987 8.64289 4.95962C8.25899 5.34352 7.87857 5.52175 7.33125 5.52175C6.85336 5.52175 6.17346 5.42907 5.8 5.80567C5.4295 6.17929 5.52177 6.85639 5.52177 7.33123C5.52177 7.87857 5.34352 8.25899 4.95961 8.6429C4.31987 9.28264 4.00001 9.60251 4 9.99999C4.00001 10.3975 4.31988 10.7174 4.95963 11.3571C5.38969 11.7872 5.52177 12.0649 5.52177 12.6687C5.52177 13.1466 5.42908 13.8265 5.80569 14.2C6.17931 14.5705 6.85641 14.4782 7.33124 14.4782C7.91409 14.4782 8.19477 14.5922 8.61074 15.0082C8.96495 15.3624 9.43978 16 10 16C10.5602 16 11.0351 15.3624 11.3893 15.0082C11.8052 14.5922 12.0859 14.4782 12.6688 14.4782C13.1436 14.4782 13.8207 14.5705 14.1943 14.2M15.0404 8.6429C15.6801 9.28264 16 9.60251 16 9.99999C16 10.3975 15.6801 10.7174 15.0404 11.3571C14.6103 11.7871 14.4782 12.0649 14.4782 12.6687C14.4782 13.1466 14.5709 13.8265 14.1943 14.2M14.1943 14.2H14.2" stroke="#3BBB48" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M7.9 8.49998L10 10.6L15.4002 4.59998" stroke="#3BBB48" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
@ -87,10 +87,10 @@ export default function CanvasPage() {
|
||||
{/* <Penal04/> */}
|
||||
|
||||
{/* 배치면 초기 설정 */}
|
||||
{/* <PlacementSettingPop/> */}
|
||||
<PlacementSettingPop/>
|
||||
|
||||
{/* 캔버스 기본 셋팅 */}
|
||||
{modalOption.option && <SettingModal01/>}
|
||||
{/* {modalOption.option && <SettingModal01/>} */}
|
||||
|
||||
{/* 점·선 그리드 설정 */}
|
||||
{/* {modalOption.gridoption && <GridOption/>} */}
|
||||
@ -198,7 +198,7 @@ export default function CanvasPage() {
|
||||
{/* <SizeChange/> */}
|
||||
|
||||
{/* 이미지 크기 조절 */}
|
||||
<ImageSize/>
|
||||
{/* <ImageSize/> */}
|
||||
</div>
|
||||
</div>
|
||||
{menuValue === 5 && <Footer/>}
|
||||
|
||||
@ -1,101 +1,12 @@
|
||||
'use client'
|
||||
|
||||
import { useState } from "react";
|
||||
import SingleDatePicker from "../common/datepicker/SingleDatePicker";
|
||||
import Footer from "../layout/Footer";
|
||||
|
||||
import FileDownOptionPop from "./estimatepop/FileDownOptionPop";
|
||||
import ProductFeaturesPop from "./estimatepop/ProductFeaturesPop";
|
||||
import QGrid from "../common/grid/QGrid";
|
||||
|
||||
const HeaderCheckButton = () => {
|
||||
return(
|
||||
<div className="d-check-box pop no-text">
|
||||
<input type="checkbox" id="ch97" disabled/>
|
||||
<label htmlFor="ch97"></label>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
const CellCheckButton = () => {
|
||||
return(
|
||||
<div className="d-check-box light no-text">
|
||||
<input type="checkbox" id="ch98" />
|
||||
<label htmlFor="ch98"></label>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const CellProductName = () => {
|
||||
return(
|
||||
<div className="form-flex-wrap">
|
||||
<div className="select-box mr5" style={{flex : '1'}}>
|
||||
<select className="select-light black" name="" id="">
|
||||
<option>Re.RISE415</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<button className="btn-origin green">追加、変更資材</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const CellShapePlate = () => {
|
||||
return(
|
||||
<div className="form-flex-wrap">
|
||||
<div className="name">HNW-MC4-CHN30</div>
|
||||
<button className="grid-tip"></button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const CellQuantity = () =>{
|
||||
return(
|
||||
<div className="input-wrap" style={{width: '100%'}}>
|
||||
<input type="text" className="input-light al-r" defaultValue={'20'}/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const CellUnitPrice = () =>{
|
||||
return(
|
||||
<div className="form-flex-wrap">
|
||||
<div className="input-wrap mr5" style={{flex: '1'}}>
|
||||
<input type="text" className="input-light al-r" defaultValue={'278,050'}/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<button className="btn-origin green">OPEN</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
import ReactSelect from "../common/reactselect/ReactSelect";
|
||||
|
||||
export default function CanvasEstimate() {
|
||||
const [gridProps, setGridProps] = useState({
|
||||
gridData: [
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
{ status: "受付", item: "100", unit: "セット", amountExTax: "5,561,000 " },
|
||||
],
|
||||
gridColumns:[
|
||||
{ field: "check", width: 45, cellRenderer: CellCheckButton, headerComponent: HeaderCheckButton, cellStyle: { display: 'flex', alignItems: 'center', justifyContent: 'center' }},
|
||||
{ headerName: "アイテム ", field: "item", width: 100, cellStyle: { textAlign: "right" } },
|
||||
{ headerName: "品番", field: "productName", flex: 1, cellRenderer: CellProductName, cellStyle: { display: 'flex', alignItems: 'center'} },
|
||||
{ headerName: "型板", field: "shapePlate", width: 200, cellRenderer: CellShapePlate, cellStyle: { display: 'flex', alignItems: 'center'} },
|
||||
{ headerName: "数量", field: "quantity", width: 120, cellRenderer: CellQuantity, cellStyle: { display: 'flex', alignItems: 'center'} },
|
||||
{ headerName: "単位", field: "unit", width: 100, },
|
||||
{ headerName: "単価", field: "unitPrice", cellRenderer: CellUnitPrice, cellStyle: { display: 'flex', alignItems: 'center'} },
|
||||
{ headerName: "金額 (税別別) ", field: "amountExTax", cellStyle: { textAlign: "right" }, width: 240, },
|
||||
],
|
||||
isPageable: true,
|
||||
})
|
||||
return(
|
||||
<div className="sub-content estimate">
|
||||
<div className="sub-content-inner">
|
||||
@ -485,18 +396,221 @@ export default function CanvasEstimate() {
|
||||
<button className="btn-origin grey ml5">Pricing</button>
|
||||
</div>
|
||||
<div className="product-edit-wrap">
|
||||
<div className="product-edit-explane">
|
||||
<div className="attachment-required"><span className="ico"></span>添付必須</div>
|
||||
<div className="click-check"><span className="ico"></span>クリックして製品の特異性を確認する</div>
|
||||
</div>
|
||||
<ul className="product-edit-explane">
|
||||
<li className="explane-item item01"><span className="ico"></span>製品価格 OPEN</li>
|
||||
<li className="explane-item item02"><span className="ico"></span>追加, 変更資材</li>
|
||||
<li className="explane-item item03"><span className="ico"></span>添付必須</li>
|
||||
<li className="explane-item item04"><span className="ico"></span>クリックして製品の特異性を確認する</li>
|
||||
</ul>
|
||||
<div className="product-edit-btn">
|
||||
<button className="btn-origin navy mr5"><span className='plus'></span> 製品を追加</button>
|
||||
<button className="btn-origin grey"><span className='minus'></span>製品削除</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='q-grid no-cols'>
|
||||
<QGrid {...gridProps}/>
|
||||
<div className="esimate-table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col width={50}/>
|
||||
<col width={100}/>
|
||||
<col/>
|
||||
<col width={200}/>
|
||||
<col width={100}/>
|
||||
<col width={100}/>
|
||||
<col width={200}/>
|
||||
<col width={240}/>
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<div className="d-check-box pop no-text">
|
||||
<input type="checkbox" id="ch97" disabled/>
|
||||
<label htmlFor="ch97"></label>
|
||||
</div>
|
||||
</th>
|
||||
<th>アイテム</th>
|
||||
<th>品番</th>
|
||||
<th>型板</th>
|
||||
<th>数量</th>
|
||||
<th>単位</th>
|
||||
<th>単価</th>
|
||||
<th>金額 (税別別)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td className="al-c">
|
||||
<div className="d-check-box light no-text">
|
||||
<input type="checkbox" id="ch98" />
|
||||
<label htmlFor="ch98"></label>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">100</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="select-wrap mr5">
|
||||
<ReactSelect/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<span className="tb_ico change_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="name">HNW-MC4-CHN30</div>
|
||||
<div className="icon-wrap">
|
||||
<span className="tb_ico file_check"></span>
|
||||
<button className="grid-tip"></button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width: '100%'}}>
|
||||
<input type="text" className="input-light al-r" defaultValue={'20'}/>
|
||||
</div>
|
||||
</td>
|
||||
<td>セット</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="input-wrap mr5">
|
||||
<input type="text" className="input-light al-r" defaultValue={'278,050'}/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<span className="tb_ico open_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">5,561,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="al-c">
|
||||
<div className="d-check-box light no-text">
|
||||
<input type="checkbox" id="ch98" />
|
||||
<label htmlFor="ch98"></label>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">100</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="select-wrap mr5">
|
||||
<ReactSelect/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<span className="tb_ico change_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="name">HNW-MC4-CHN30</div>
|
||||
<div className="icon-wrap">
|
||||
<button className="grid-tip"></button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width: '100%'}}>
|
||||
<input type="text" className="input-light al-r" defaultValue={'20'}/>
|
||||
</div>
|
||||
</td>
|
||||
<td>セット</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="input-wrap mr5">
|
||||
<input type="text" className="input-light al-r" defaultValue={'278,050'}/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<span className="tb_ico open_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">5,561,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="al-c">
|
||||
<div className="d-check-box light no-text">
|
||||
<input type="checkbox" id="ch98" />
|
||||
<label htmlFor="ch98"></label>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">100</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="select-wrap mr5">
|
||||
<ReactSelect/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<span className="tb_ico change_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="name">HNW-MC4-CHN30</div>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width: '100%'}}>
|
||||
<input type="text" className="input-light al-r" defaultValue={'20'}/>
|
||||
</div>
|
||||
</td>
|
||||
<td>セット</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="input-wrap mr5">
|
||||
<input type="text" className="input-light al-r" defaultValue={'278,050'}/>
|
||||
</div>
|
||||
<div className="btn-area">
|
||||
<span className="tb_ico open_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">5,561,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="al-c">
|
||||
<div className="d-check-box light no-text">
|
||||
<input type="checkbox" id="ch98" />
|
||||
<label htmlFor="ch98"></label>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">100</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="select-wrap ">
|
||||
<ReactSelect/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="name">HNW-MC4-CHN30</div>
|
||||
<div className="icon-wrap">
|
||||
<span className="tb_ico file_check"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="input-wrap" style={{width: '100%'}}>
|
||||
<input type="text" className="input-light al-r" defaultValue={'20'}/>
|
||||
</div>
|
||||
</td>
|
||||
<td>セット</td>
|
||||
<td>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="input-wrap mr5">
|
||||
<input type="text" className="input-light al-r" defaultValue={'278,050'}/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">5,561,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -152,6 +152,22 @@ export default function PlacementSettingPop(){
|
||||
</div> */}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>ファイルを読み込む</th>
|
||||
<td>
|
||||
<div className="flex-box">
|
||||
<button className="img-edit-btn">
|
||||
<span className="img-edit"></span>
|
||||
<span>ファイルの追加</span>
|
||||
</button>
|
||||
<div className="img-name-wrap">
|
||||
<input type="text" className="input-origin al-l" defaultValue={'IMG_Name.PNG'} readOnly/>
|
||||
<span className="img-check suc"></span>
|
||||
<span className="img-check fail"></span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
@ -10,6 +10,11 @@ export default function ReactSelect(){
|
||||
{ label: '敬称選択', value: '3' },
|
||||
{ label: '敬称選択', value: '5' },
|
||||
{ label: '敬称選択', value: '6' },
|
||||
{ label: '敬称選択', value: '7' },
|
||||
{ label: '敬称選択', value: '8' },
|
||||
{ label: '敬称選択', value: '9' },
|
||||
{ label: '敬称選択', value: '10' },
|
||||
{ label: '敬称選択', value: '11' },
|
||||
|
||||
]
|
||||
|
||||
|
||||
@ -143,11 +143,16 @@ export default function PublishPage() {
|
||||
</td>
|
||||
<td className="coding_stat_web"></td>
|
||||
<td className='red al-c'>
|
||||
<ul>
|
||||
<ul className='mb5'>
|
||||
<li>2024-10-28</li>
|
||||
<li>canvas-setting pop 수정</li>
|
||||
<li>이미지 크기조절 pop 추가</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>2024-10-29</li>
|
||||
<li>견적서 하단 테이블 변경</li>
|
||||
<li>배치면 초기 설정 pop 이미지파일 업로드 추가</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td className="t-center">2024-10-28</td>
|
||||
</tr>
|
||||
|
||||
@ -23,6 +23,7 @@
|
||||
left: 0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 46.8px;
|
||||
padding-bottom: 0;
|
||||
background-color: #383838;
|
||||
transition: padding .17s ease-in-out;
|
||||
@ -544,9 +545,9 @@
|
||||
.sub-content{
|
||||
padding-top: 46px;
|
||||
.sub-content-inner{
|
||||
max-width: 1720px;
|
||||
max-width: 1760px;
|
||||
margin: 0 auto;
|
||||
padding-top: 20px;
|
||||
padding: 20px 20px 0;
|
||||
.sub-content-box{
|
||||
margin-bottom: 20px;
|
||||
&:last-child{
|
||||
@ -897,45 +898,63 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 15px;
|
||||
.attachment-required{
|
||||
.explane-item{
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
padding-right: 10px;
|
||||
.ico{
|
||||
width: 23px;
|
||||
height: 23px;
|
||||
span{
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 5px;
|
||||
background: url(../../public/static/images/sub/attachment_ico.svg)no-repeat center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
&::before{
|
||||
&:before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0;
|
||||
left: 0;
|
||||
transform: translateY(-50%);
|
||||
width: 1px;
|
||||
height: 12px;
|
||||
background-color: #D9D9D9;
|
||||
}
|
||||
}
|
||||
.click-check{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #F16A6A ;
|
||||
padding-left: 10px;
|
||||
.ico{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-right: 5px;
|
||||
background: url(../../public/static/images/sub/click_check_ico.svg)no-repeat center;
|
||||
background-size: cover;
|
||||
&:first-child{
|
||||
padding-left: 0;
|
||||
&::before{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:last-child{
|
||||
padding-right: 0;
|
||||
}
|
||||
&.item01{
|
||||
color: #3BBB48;
|
||||
span{
|
||||
background-image: url(../../public/static/images/sub/open_ico.svg);
|
||||
}
|
||||
}
|
||||
&.item02{
|
||||
color: #909000;
|
||||
span{
|
||||
background-image: url(../../public/static/images/sub/change_ico.svg);
|
||||
}
|
||||
}
|
||||
&.item03{
|
||||
color: #0191C9;
|
||||
span{
|
||||
background-image: url(../../public/static/images/sub/attachment_ico.svg);
|
||||
}
|
||||
}
|
||||
&.item04{
|
||||
color: #F16A6A;
|
||||
span{
|
||||
background-image: url(../../public/static/images/sub/click_check_ico.svg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -960,7 +979,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 발전시물레이션
|
||||
|
||||
@ -128,10 +128,3 @@
|
||||
}
|
||||
}
|
||||
|
||||
.grid-tip{
|
||||
display: block;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
background: url(../../public/static/images/sub/grid_tip.svg)no-repeat center;
|
||||
background-size: cover;
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
.wrap{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 1600px;
|
||||
min-width: 1280px;
|
||||
min-height: 100vh;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@ -399,6 +399,12 @@ $alert-color: #101010;
|
||||
color: $pop-color;
|
||||
border-bottom: 1px solid #424242;
|
||||
padding-left: 20px;
|
||||
vertical-align: middle;
|
||||
.flex-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
&:first-child{
|
||||
td,
|
||||
@ -470,6 +476,53 @@ $alert-color: #101010;
|
||||
}
|
||||
}
|
||||
|
||||
.img-edit-btn{
|
||||
flex: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 30px;
|
||||
padding: 0 10px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #101010;
|
||||
background-color: #fff;
|
||||
border-radius: 2px;
|
||||
.img-edit{
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background: url(../../public/static/images/canvas/img_edit_ico.svg)no-repeat center;
|
||||
background-size: cover;
|
||||
margin-right: 5px;
|
||||
}
|
||||
&:hover{
|
||||
background-color: #ebebeb;
|
||||
}
|
||||
}
|
||||
.img-name-wrap{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
margin-left: 10px;
|
||||
input{
|
||||
flex: 1;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.img-check{
|
||||
flex: none;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
&.suc{
|
||||
background-image: url(../../public/static/images/canvas/img_check_success.svg);
|
||||
}
|
||||
&.fail{
|
||||
background-image: url(../../public/static/images/canvas/img_check_fail.svg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 외벽선 그리기
|
||||
.outline-wrap{
|
||||
padding: 24px 0;
|
||||
|
||||
@ -430,4 +430,82 @@ table{
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 견적서 테이블
|
||||
.esimate-table{
|
||||
table{
|
||||
table-layout: fixed;
|
||||
border-collapse: separate;
|
||||
thead{
|
||||
tr{
|
||||
th{
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
padding: 11px 5px;
|
||||
background-color: #5D6A76;
|
||||
&:first-child{
|
||||
border-radius: 4px 0 0 4px;
|
||||
}
|
||||
&:last-child{
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
tbody{
|
||||
tr{
|
||||
td{
|
||||
padding: 5px 10px;
|
||||
font-size: 13px;
|
||||
color: #45576F;
|
||||
font-weight: 400;
|
||||
border-bottom: 1px solid #ECF0F4;
|
||||
.form-flex-wrap{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.input-wrap,
|
||||
.select-wrap{
|
||||
flex: 1;
|
||||
}
|
||||
.btn-area{
|
||||
flex: none;
|
||||
}
|
||||
.icon-wrap{
|
||||
margin-left: auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
}
|
||||
.tb_ico{
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
&.change_check{
|
||||
background-image: url(../../public/static/images/sub/change_ico.svg);
|
||||
}
|
||||
&.file_check{
|
||||
background-image: url(../../public/static/images/sub/attachment_ico.svg);
|
||||
}
|
||||
&.open_check{
|
||||
background-image: url(../../public/static/images/sub/open_ico.svg);
|
||||
}
|
||||
}
|
||||
.grid-tip{
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background: url(../../public/static/images/sub/click_check_ico.svg)no-repeat center;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user