Browse Source

기체신고 안내페이지

pull/2/head
김지은 1 year ago
parent
commit
2cfcb38f6c
  1. 36
      src/assets/css/custom.css
  2. 128
      src/views/laanc/Report.js

36
src/assets/css/custom.css

@ -977,4 +977,38 @@ input:-internal-autofill-selected{color:#6e6b7b!important}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{-webkit-text-fill-color:#6e6b7b!important;background:#fff!important} input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active{-webkit-text-fill-color:#6e6b7b!important;background:#fff!important}
.sub-text{margin-top:-14px;margin-bottom:8px;font-weight:400;font-size:1rem;color:#cd5555;display: flex;align-items: center;} .sub-text{margin-top:-14px;margin-bottom:8px;font-weight:400;font-size:1rem;color:#cd5555;display: flex;align-items: center;}
.sub-text .badge{font-weight:400;display:inline-block;margin-left:8px} .sub-text .badge{font-weight:400;display:inline-block;margin-left:8px}
caption {overflow: hidden; line-height: 0;text-indent: -2000px;}
.report-wrap {margin-top:-40px}
.report-table{margin-top:15px;width:100%;}
.report-table thead th{background:#f4f4f4;font-size:1rem}
.report-table thead tr th:first-child{border-left-width:0px;}
.report-table thead tr th:last-child{border-right-width:0px;}
.report-table tbody th{background:#f5f5f5;}
.report-table th,
.report-table td{padding:0.8rem; border:1px solid #ced1d3; letter-spacing:-0.3px; line-height:1.4;vertical-align: middle;}
.report-table th{text-align:center; font-weight:500; color:#333;}
.report-table thead + tbody th{background:transparent; text-align:center;}
.report-table thead + tbody tr td{text-align:center;}
.report-table tbody td{border:1px solid #ced1d3; text-align:left; font-weight:300;}
.report-table thead tr th:last-child,
.report-table tbody tr td:last-child{border-right-width:0px;}
.report-table thead tr th:first-child,
.report-table tbody tr td:first-child,
.report-table tbody tr th:first-child{border-left-width:0px;}
.report-wrap .text-point{text-decoration:underline;color:#8a1c05}
.h5-ti-icon{font-size:1.1875rem;font-weight:500;position: relative;padding-left:20px;color:#555}
.h5-ti-icon::before{content:'';display:inline-block;width:8px;height:8px;transform:rotate(45deg);background:#8a1c05;position: absolute;left:4px;top:6px}
.report-wrap .list-info > li{font-size:1rem; color:#333;font-weight:400}
.report-box-bg .list-info h5{color:#8a1c05;font-weight:500;font-size:1.125rem;}
.report-box-bg .list-info h5 svg{margin-right:4px}
.report-box + .report-box{margin-top:2rem}
.report-box-bg{background:rgba(138, 28, 5, 0.1);padding:1.5rem 1rem;}
.report-box-bg .list-info-text{padding:0 2rem;word-break: keep-all;}
.report-box-bg p.list-info-text{margin:10px 0}
.report-box-bg ul.list-info-text li{margin-top:6px;}
.report-link{margin-bottom:1rem}
.report-link a{font-size:1rem;display:inline-flex;justify-content: center;align-items: center;}
.report-link a svg{margin-left:4px;width:18px;}
.report-link a + a{margin-left:1rem}

128
src/views/laanc/Report.js

@ -2,9 +2,133 @@ import '../../assets/css/custom.css';
import '@styles/react/libs/flatpickr/flatpickr.scss'; import '@styles/react/libs/flatpickr/flatpickr.scss';
import '@styles/react/libs/tables/react-dataTable-component.scss'; import '@styles/react/libs/tables/react-dataTable-component.scss';
import { CustomMainLayout } from '../../components/layout/CustomMainLayout'; import { CustomMainLayout } from '../../components/layout/CustomMainLayout';
import { Info, ExternalLink } from 'react-feather';
import {
Row,
Col,
Button
} from 'reactstrap';
const Report = () => { const Report = () => {
return <CustomMainLayout title={'test'}>dd</CustomMainLayout>; return <CustomMainLayout>
<div className='report-wrap'>
<div className='report-box'>
<h5 className='h5-ti-icon'>초경량비행장치 신고대상</h5>
<table className='report-table'>
<caption>초경량 비행장치 신고대상을 종류, 사업용, 비사업용을 항목별 자세히 안내하는 표입니다.</caption>
<thead>
<tr>
<th colspan="3" scope="col">종류</th>
<th scope="col">사업용</th>
<th scope="col">비사업용</th>
</tr>
</thead>
<tbody>
<tr>
<td rowspan="2" colspan="2">동력비행장치</td>
<td>조종형비행장치</td>
<td rowspan="13">신고필요</td>
<td>신고필요</td>
</tr>
<tr>
<td>체중이동형비행장치</td>
<td>신고필요</td>
</tr>
<tr>
<td colspan="3">행글라이더</td>
<td>신고 불필요</td>
</tr>
<tr>
<td colspan="3">패러글라이더</td>
<td>신고 불필요</td>
</tr>
<tr>
<td colspan="3">기구류</td>
<td>사람이 탑승하는 것은 신고필요</td>
</tr>
<tr>
<td rowspan="4">무인비행장치</td>
<td rowspan="3">무인동력비행장치</td>
<td>무인비행기</td>
<td rowspan="3">
<span className='text-point'>신고필요<br/>*최대이륙중량 2kg초과 </span>
</td>
</tr>
<tr>
<td>무인헬리콥터</td>
</tr>
<tr>
<td>무인멀티콥터</td>
</tr>
<tr>
<td colspan="2">무인비행선</td>
<td>
<span className='text-point'>신고필요<br/> *자체중량12kg초과, 길이 7m 초과 </span>
</td>
</tr>
<tr>
<td rowspan="2" colspan="2">회전익비행장치</td>
<td>초경량헬리콥터</td>
<td>신고필요</td>
</tr>
<tr>
<td>초경량자이로플레인</td>
<td>신고필요</td>
</tr>
<tr>
<td colspan="3">동력패러글라이더</td>
<td>신고필요</td>
</tr>
<tr>
<td colspan="3">낙하산류</td>
<td>신고 불필요</td>
</tr>
</tbody>
</table>
</div>
<div className='report-box'>
<div className='report-box-bg'>
<ul className="list-info">
<li><h5><Info/>신고불필요</h5>
<p className='list-info-text'>
<span className='text-point'>아래 호에 해당하는</span> , , <span className="text-point ">()</span>
</p>
<ul className='list-info-text'>
<li>1. 행글라이더, 패러글라이더 동력을 이용하지 아니하는 비행장치</li>
<li>2. 기구류(사람이 탑승하는 것은 제외)</li>
<li>3. 계류식(繫留式) 무인비행장치</li>
<li>4. 낙하산류</li>
<li>5. 무인동력비행장치 중에서 최대이륙중량이 2킬로그램 이하인 </li>
<li>6. 무인비행선 중에서 연료의 무게를 제외한 자체무게가 12kg이하이고, 길이가 7m 이하인 </li>
<li>7. 연구기관 등이 시험·조사·연구 또는 개발을 위하여 제작한 초경량비행장치</li>
<li>8. 제작자 등이 판매를 목적으로 제작하였으나 판매되지 아니한 것으로서 비행에 사용되지 아니하는 초경량비행장치</li>
<li>9. 군사목적으로 사용되는 초경량비행장치</li>
</ul>
</li>
</ul>
</div>
</div>
<div className='report-box'>
<div className='report-link'>
<a
className='btn btn-primary'
color='primary'
href='https://drone.onestop.go.kr/'
target='_blank'
>
드론원스톱 민원서비스 바로가기<ExternalLink />
</a>
<a
className='btn btn-outline-primary'
color='primary'
href='https://www.onestop.go.kr:8050/sysOnestop/system/member/login.fois?systemId=sysOnestop'
target='_blank'
>
APS 원스탑시스템 바로가기<ExternalLink />
</a>
</div>
</div>
</div>
</CustomMainLayout>;
}; };
export default Report; export default Report;

Loading…
Cancel
Save