add.html 15.6 KB
<link href="/pages/base/section/css/addmap.css" rel="stylesheet" type="text/css" />
<div class="page-head">
	<div class="page-title">
		<h1>$$$$$${txt-2452}</h1>
	</div>
</div>

<ul class="page-breadcrumb breadcrumb">
	<li><a href="/pages/home.html" data-pjax>$$$$$${txt-3807}</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">$$$$$${txt-2398}</span> <i class="fa fa-circle"></i></li>
	<li><a href="/pages/base/section/list.html" data-pjax>$$$$$${txt-2405}</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">$$$$$${txt-2452}</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">$$$$$${txt-2452}
				 <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/section/list.html" style="float: right;padding: 4px 23px;" data-pjax=""><i class="fa fa-reply"></i> $$$$$${txt-3869}</a>
			</div>
		</div>
	</div>
	<div class="portlet-body form">
		<!-- START FORM -->
		<form class="form-horizontal" id="submit_section_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> $$$$$${txt-789} </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> $$$$$${txt-2798} </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> $$$$$${txt-2405} </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> $$$$$${txt-3982} </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>
							$$$$$${txt-135}
						</div>
						<div class="alert alert-success display-none">
							<button class="close" data-dismiss="alert"></button> 
							Your form validation is successful! 
						</div>
						
						<!-- $$$$$${txt-789} -->
                       	<div class="tab-pane active" id="tab1">
                       		<h3 class="block"> $$$$$${txt-789} </h3>
							<!-- 路段名称 -->
							<div class="form-group">
								<label class="col-md-3 control-label"><span class="required"> * </span>$$$$$${txt-2850}:</label>
								<div class="col-md-9">
									<input type="text" class="form-control input-medium" id="sectionName1" name="sectionName1">
								</div>
							</div>
                      		<!-- 起始交叉路名 -->
							<div class="form-group">
								<label class="col-md-3 control-label"><span class="required"> * </span>$$$$$${txt-4484}:</label>
								<div class="col-md-9">
									<input type="text" class="form-control input-medium" id="stationStartInput" name="stationStart">
								</div>
							</div>
							<!-- 结束交叉路名 -->
							<div class="form-group">
								<label class="col-md-3 control-label"><span class="required"> * </span>$$$$$${txt-4483}:</label>
								<div class="col-md-9">
									<input type="text" class="form-control input-medium" id="stationEndInput" name="stationEnd">
								</div>
							</div>
							<!-- 新增方式 -->
							<div class="form-group">
								<label class="col-md-3 control-label"><span class="required"> * </span> 
									$$$$$${txt-2801}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
								</label>
								<div class="col-md-9">
									<div class="icheck-list">
										<label>
											<input type="radio" class="icheck" name="baseRes" value="0" checked> $$$$$${txt-2865}
										</label>
										<label >
											<input type="radio" class="icheck" name="baseRes" value="1" > $$$$$${txt-2862}
										</label>
									</div>
								</div>
							 </div>
                        </div>
                        
                        <!-- 路段位置 -->
                        <div class="tab-pane" id="tab2">
                        	<h3 class="block">  $$$$$${txt-2798}  </h3>
                            <div id="sectionBmap_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"> $$$$$${txt-2874}
									        <i class="fa fa-angle-down"></i>
									</a>
								    <ul class="dropdown-menu pull-right" style="min-width:100px">
								        <li>
								            <a href="javascript:;" id="openDrawingManager"><i class="fa fa-pencil"></i> $$$$$${txt-4014} </a>
								        </li>
								        <li>
								            <a href="javascript:;" id = "closeDrawingManager"> <i class="fa fa-reply"></i> $$$$$${txt-4015} </a>
								        </li>
								         
								    </ul>
							    </div>
                            </div>
                        </div>
                        
                        <!-- 路段信息 -->
                        <div class="tab-pane" id="tab3">
                        	<h3 class="block"> $$$$$${txt-2405} </h3>
							<input type="hidden" name="id" id="sectionId" />
							<input type="hidden" name="bsectionVectorWkt" id="bsectionVectorInput" />
							<!-- 路段名称 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
		          						<span class="required"> * </span> $$$$$${txt-2850}:
		                    		</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="sectionName" id="sectionNameInput" placeholder="$$$$$${txt-2850}">
									</div>
								</div>
							</div>

							<!-- 路段编码 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> $$$$$${txt-3355}:
									</label>
									<div class="col-md-6">
										<input type="text" class="form-control"  name="sectionCode" id="sectionCodeInput" readonly="readonly">
									</div>
								</div>
							</div>

							<!-- 交叉道路 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> $$$$$${txt-2851}:
									</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="crosesRoad" id="crosesRoadInput" placeholder="$$$$$${txt-2851}">
									</div>
								</div>
							</div>

							<!-- 道路类型 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> $$$$$${txt-2793}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<select name="sectionType" class="form-control">
											<option value="">$$$$$${txt-1088}</option>
											<option value="$$$$$${txt-2860}">$$$$$${txt-2860}</option>
											<option value="$$$$$${txt-3569}">$$$$$${txt-3569}</option>
											<option value="$$$$$${txt-2859}">$$$$$${txt-2859}</option>
										</select>
									</div>
								</div>
							</div>

							<!-- 东西向 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> $$$$$${txt-3778}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<select name="ewDirection" class="form-control">
											<option value="">$$$$$${txt-1566}</option>
											<option value="0">$$$$$${txt-4261}</option>
											<option value="1">$$$$$${txt-4262}</option>
										</select>
									</div>
								</div>
							</div>
							<!-- 南北向 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> $$$$$${txt-3776}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<select name="snDirection" class="form-control">
											<option value="">$$$$$${txt-1565}</option>
											<option value="0">$$$$$${txt-4258}</option>
											<option value="1">$$$$$${txt-4259}</option>
										</select>
									</div>
								</div>
							</div>
							<!-- 限速 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3"> <span class="required"> * </span> $$$$$${txt-3361}:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="speedLimit" id="speedLimitInput">
										<span class="help-block">$$$$$${txt-2057}</span>
									</div>
								</div>
							</div>
							<!-- 路段时长 -->
							<!--<div class="form-body">
                                <div class="form-group">
                                    <label class="col-md-3 control-label">路段历时:</label>
                                    <div class="col-md-6">
                                        <input type="text" class="form-control" name="sectionTime" id="sectionTimeInput" placeholder="路段时长">
                                        <span class="help-block">单位:分钟(min)</span>
                                    </div>
                                </div>
                            </div>-->
							<!-- 路段距离 -->
							<div class="form-body">
								<div class="form-group">
									<label class="col-md-3 control-label">$$$$$${txt-2823}:</label>
									<div class="col-md-6">
										<input type="text" class="form-control" name="sectionDistance" id="sectionDistanceInput" >
										<span class="help-block">$$$$$${txt-2058}</span>
									</div>
								</div>
							</div>
                        </div>
                        
                        <!-- 确定提交资料信息 -->
                        <div class="tab-pane" id="tab4">
                           <h3 class="block"> $$$$$${txt-513} </h3>
                           
                           <h4 class="form-section"> $$$$$${txt-2405} </h4>
                           <div class="form-group">
                               <label class="control-label col-md-3">$$$$$${txt-2850}:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="sectionName"> </p>
                               </div>
                           </div>
                           
                           <div class="form-group">
                              <label class="control-label col-md-3">$$$$$${txt-3355}:</label>
                              <div class="col-md-4">
                                  <p class="form-control-static" data-display="sectionCode"> </p>
                              </div>
                           </div>
                           
                           <div class="form-group">
                               <label class="control-label col-md-3">$$$$$${txt-2851}:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="crosesRoad"> </p>
                               </div>
                           </div>

							<div class="form-group">
								<label class="control-label col-md-3">$$$$$${txt-2793}:</label>
								<div class="col-md-4">
									<p class="form-control-static" data-display="sectionType"> </p>
								</div>
							</div>
                           
                           <div class="form-group">
                               <label class="control-label col-md-3">$$$$$${txt-3778}:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="ewDirection"> </p>
                               </div>
                           </div>

							<div class="form-group">
                               <label class="control-label col-md-3">$$$$$${txt-3776}:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="snDirection"> </p>
                               </div>
                           </div>
                           
                           <div class="form-group">
                               <label class="control-label col-md-3">$$$$$${txt-3361}:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="speedLimit"> </p>
                               </div>
                           </div>
                           
                           <div class="form-group">
                               <label class="control-label col-md-3">$$$$$${txt-3360}:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="sectionDistance"> </p>
                               </div>
                           </div>
							<!-- <div class="form-group">
								<label class="control-label col-md-3">路段历时:</label>
								<div class="col-md-4">
									<p class="form-control-static" data-display="sectionTime"> </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> $$$$$${txt-4188} </a>
                         <a href="javascript:;" class="btn btn-outline green button-next"> $$$$$${txt-3756}
                             <i class="fa fa-angle-right"></i>
                         </a>
                         <a href="javascript:;" class="btn green button-submit" style="display: none;" id="submintBtn"> $$$$$${txt-4173}
                             <i class="fa fa-check"></i>
                         </a>
                     </div>
                 </div>
              </div>
        	</div>
        </form>
		<!-- END FORM-->
	</div>
</div>
<!-- 函数方法JS类库 -->
<script src="/pages/base/section/js/add-input-function.js"></script>
<!-- 表单向导JS类库 -->
<script src="/pages/base/section/js/add-form-wizard.js"></script>
<!-- 地图JS类库 -->
<script src="/pages/base/section/js/add-vmap-world.js"></script>
<!-- 表单元素事件JS类库 -->
<script src="/pages/base/section/js/add-form-events.js"></script>
<!-- reload事件 -->
<script src="/pages/base/section/js/add-form-reload.js"></script>
<script src="/assets/js/eventproxy.js"></script>