add.html 16.4 KB
<link href="/pages/base/carpark/css/carpark-add.css" rel="stylesheet" type="text/css" />
<div class="page-head">
	<div class="page-title">
		<h1>Add</h1>
	</div>
</div>

<ul class="page-breadcrumb breadcrumb">
	<li><a href="/pages/home.html" data-pjax>Home page</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">Basic information</span> <i class="fa fa-circle"></i></li>
	<li><a href="/pages/base/carpark/list.html" data-pjax>Parking lot</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">Add</span></li>
</ul>

<div class="portlet light bordered" id="form-wizard-info">
	<div class="portlet-title">
		<div class="caption">
			<i class="icon-equalizer font-red-sunglo"></i> 
			<span class="caption-subject font-red-sunglo bold uppercase">Add
				 <span class="step-title"> 1 - 4 </span>
				 <i class="fa fa-question-circle tipso-animation" style="color: rgba(158, 158, 158, 0.49);"></i>
			</span>
		</div>
		
		<div class="actions">
			<div class="btn-group btn-group-devided" data-toggle="buttons">
				<a class="btn btn-circle default" href="/pages/base/carpark/list.html" style="float: right;padding: 4px 23px;" data-pjax=""><i class="fa fa-reply"></i> Back</a>
			</div>
		</div>
	</div>
	<div class="portlet-body form">
	
		<!-- START FORM -->
		<form class="form-horizontal" id="submit_carpark_form"  action="/" method="POST" novalidate="novalidate">
			<div class="form-wizard">
				<div class="form-body">
					<ul class="nav nav-pills nav-justified steps">
						<li class="active">
							<a href="#tab1" data-toggle="tab" class="step" aria-expanded="true">
								<span class="number"> 1 </span>
								<span class="desc">
								<i class="fa fa-check"></i> Parking lot location method </span>
							</a>
						</li>
						<li>
							<a href="#tab2" data-toggle="tab" class="step">
								<span class="number"> 2 </span>
								<span class="desc">
								<i class="fa fa-check"></i> Location parking lot </span>
							</a>
						</li>
						<li>
							<a href="#tab3" data-toggle="tab" class="step active">
								<span class="number"> 3 </span>
								<span class="desc">
								<i class="fa fa-check"></i> Parking lot info </span>
							</a>
						</li>
						<li>
							<a href="#tab4" data-toggle="tab" class="step">
								<span class="number"> 4 </span>
								<span class="desc">
								<i class="fa fa-check"></i> Confirm and submit </span>
							</a>
						</li>
					</ul>
					
					<!-- 进度条 -->
					<div id="bar" class="progress progress-striped" role="progressbar">
						<div class="progress-bar progress-bar-success" style="width: 25%;"></div>
					</div>
					
					<div class="tab-content">
						<div class="alert alert-danger display-hide">
							<button class="close" data-close="alert"></button>
							Your input is incorrect, please check the input items below
						</div>
						<div class="alert alert-success display-none">
							<button class="close" data-dismiss="alert"></button> 
							Your form validation is successful! 
						</div>
						
						<!-- Select station add method -->
                       	<div class="tab-pane active" id="tab1">
                       		<h3 class="block"> Parking lot location method </h3>
                      		<!--Parking lot name -->
							<div class="form-group" id="formRequ">
								<label class="col-md-3 control-label"><span class="required"> * </span>Parking lot name&nbsp;&nbsp;&nbsp;:</label>
								<div class="col-md-9">
									<input type="text" class="form-control input-medium" id="parkNamebooxtInput" name="parkNamebooxt" placeholder="Enter parking lot name">
								</div>
							</div>
							<!-- Add method -->
							<div class="form-group">
								<label class="col-md-3 control-label"><span class="required"> * </span>Location method:</label>
								<div class="col-md-9">
									<div class="icheck-list">
										<label>
												<input type="radio" class="icheck" name="baseRes" value=0 checked> System generated
										</label>
										<label >
											<input type="radio" class="icheck" name="baseRes" value=1 > Manual drawing
										</label>
									</div>
								</div>
							 </div>
                        </div>
                        <!--停车场位置 -->
                        <div class="tab-pane" id="tab2">
                        	<h3 class="block"> Location parking lot  </h3>
                            <div id="addCarParkbmap_basic"></div>
                            <div class="leftUtils">
								<div class="btn-group" style="left: 100px;">
								    <a class="btn btn-sm green-seagreen dropdown-toggle" style="width: 98px;" href="javascript:;" data-toggle="dropdown" aria-expanded="false"> Drawing tools
								        <i class="fa fa-angle-down"></i>
								    </a>
								    <ul class="dropdown-menu pull-right" style="min-width:100px">
								        <li>
								            <a href="javascript:;" id="oppenDrawingManager"><i class="fa fa-pencil"></i> Open </a>
								        </li>
								        <li>
								            <a href="javascript:;" id = "closeDrawingManager"> <i class="fa fa-reply"></i> Close </a>
								        </li>
								         
								    </ul>
								</div>
							</div>
                        </div>
                        <!--停车场信息 -->
                        <div class="tab-pane" id="tab3">
                        	<h3 class="block"> Parking lot </h3>
							<input type="hidden" name="bParkPoint" id="bParkPointInput" />
							<input type="hidden" name="gParkPoint" id="gParkPointInput" />
							<input type="hidden" name="dbType" id="dbTypeInput" value="b"/>
							<!-- Parking lot name -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
		          						<span class="required"> * </span> Parking lot name&nbsp;&nbsp;&nbsp; :
		                    		</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="parkName" id="parkNameInput" placeholder="Enter parking lot name" readonly="readonly">
									</div>
								</div>
							</div>
							<!-- 停车场编码 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
		          						<span class="required"> * </span>Parking lot code&nbsp;&nbsp;&nbsp;:
		                    		</label>
									<div class="col-md-6">
										<input type="text" class="form-control"  name="parkCode" id="parkCodeInput" placeholder="Enter parking lot code">
									</div>
								</div>
							</div>
							<!-- WGS84 coordinates -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label"><span class="required"> * </span>WGS84 coordinates:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="bCenterPoint" id="bCenterPointInput" readonly="readonly" placeholder="Enter the WGS84 coordinates">
									</div>
								</div>
							</div>
					
							<!-- Geometry type -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label"><span class="required"> * </span>Geometry type:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="shapesType" id="shapesTypeSelect" readonly="readonly" placeholder="Enter the geometry type">
									</div>
								</div>
							</div>
							<!-- Circle radius -->
							<div class="form-body" id="radiusGroup">
								<div class="form-group">
									<label class="col-md-3 control-label"><span class="required"> * </span> Circle radius&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="radius" id="radiusInput" placeholder="Enter the circle radius">
									</div>
								</div>
							</div>
							<!-- 是否撤销 -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label"><span class="required"> * </span>Is Destroyed&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
									<div class="col-md-6">
										<select name="destroy" class="form-control" id="destroySelect">
											<option value="">Select</option>
											<option value="0">No</option>
											<option value="1">Yes</option>
										</select>
									</div>
								</div>
							</div>
							<!-- Area -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label">Area&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="area" id="areaInput" placeholder="Enter the area">
										<span class="help-block">Unit: square meters(㎡)</span>
									</div>
								</div>
							</div>
							<!-- 所属公司 -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label"><span class="required"> * </span>Company&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
									<div class="col-md-6">
										<select name="company" class="form-control" style="width:100%" id="companySelect"></select>
									</div>
								</div>
							</div>
							<!-- Branch company -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label"><span class="required"> * </span>Branch company&nbsp;&nbsp;&nbsp;:</label>
									<div class="col-md-6">
										<select name="brancheCompany" class="form-control" style="width:100%" id="brancheCompanySelect">
										</select>
									</div>
								</div>
							</div>
							<!-- 版本号 -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label">Version&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="versions" value='1' Readonly placeholder="Enter the version number">
									</div>
								</div>
							</div>
							<!-- Description -->
			                <div class="form-group">
			                	<label class="control-label col-md-3"> Description&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: </label>
		                 		<div class="col-md-6">
		                     		<textarea class="form-control" rows="3" name="descriptions" id="descriptionsTextarea" placeholder="Description"></textarea>
		                    	</div>
			                </div>
                        	 
                        </div>
                        <!-- 确定提交资料信息 -->
                        <div class="tab-pane" id="tab4">
                           <h3 class="block"> Confirm the parking lot information you will be submit </h3>
                           <h4 class="form-section"> Coordinates </h4>
                           <div class="form-group">
                               <label class="control-label col-md-3"> Geometry type: </label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="shapesType"> </p>
                               </div>
                           </div>
                           <div class="form-group">
                               <label class="control-label col-md-3"> Circle radius&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: </label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="radius"> </p>
                               </div>
                           </div> 
                           
                           <div class="form-group">
                               <label class="control-label col-md-3"> WGS84 coordinates: </label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="bCenterPoint"> </p>
                               </div>
                           </div> 
                           <h4 class="form-section"> Parking lot </h4>
                           <div class="form-group">
                               <label class="control-label col-md-3">Parking lot name&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="parkName"> </p>
                               </div>
                           </div>
                           <div class="form-group">
                              <label class="control-label col-md-3">Parking lot code&nbsp;&nbsp;&nbsp;:</label>
                              <div class="col-md-4">
                                  <p class="form-control-static" data-display="parkCode"> </p>
                              </div>
                           </div>
                           <div class="form-group">
                               <label class="control-label col-md-3">State&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="destroy"> </p>
                               </div>
                           </div>
                           <div class="form-group">
                              <label class="control-label col-md-3">Area&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                              <div class="col-md-4">
                                  <p class="form-control-static" data-display="area"> </p>
                              </div>
                           </div>
                           <div class="form-group">
                               <label class="control-label col-md-3">Company&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="company"> </p>
                               </div>
                           </div>
                           <div class="form-group">
                               <label class="control-label col-md-3">Branch company&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="brancheCompany"> </p>
                               </div>
                           </div>
                            <div class="form-group">
                               <label class="control-label col-md-3">Version&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="versions"> </p>
                               </div>
                           </div>
                           <div class="form-group">
                               <label class="control-label col-md-3">Description&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="descriptions"> </p>
                               </div>
                           </div>
                        </div>
                   </div>
              </div>
              <div class="form-actions">
                 <div class="row">
                     <div class="col-md-offset-3 col-md-9">
                         <a href="javascript:;" class="btn default button-previous disabled" style="display: none;">
                             <i class="fa fa-angle-left"></i>Back </a>
                         <a href="javascript:;" class="btn btn-outline green button-next"> Next
                             <i class="fa fa-angle-right"></i>
                         </a>
                         <a href="javascript:;" class="btn green button-submit" style="display: none;" id="submintBtn"> Submit
                             <i class="fa fa-check"></i>
                         </a>
                     </div>
                 </div>
              </div>
        	</div>
        </form>
		<!-- END FORM-->
	</div>
</div>
<!-- 函数方法JS类库 -->
<script src="/pages/base/carpark/js/add-input-function.js"></script>
<!-- 表单向导JS类库 -->
<script src="/pages/base/carpark/js/add-form-wizard.js"></script>
<!-- reload事件 -->
<script src="/pages/base/carpark/js/add-form-reload.js"></script>
<!-- 地图JS类库 -->
<script src="/pages/base/carpark/js/add-vmap-world.js"></script>
<!-- 表单元素事件JS类库 -->
<script src="/pages/base/carpark/js/add-form-events.js"></script>