add.html 12.7 KB
<link href="/pages/base/station/css/addmap.css" rel="stylesheet" type="text/css" />
<!-- 片段标题title容器 -->
<div class="page-head">
	<div class="page-title">
		<h1>添加站点</h1>
	</div>
</div>
<ul class="page-breadcrumb breadcrumb">
	<li><a href="/pages/home.html" data-pjax>首页</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">基础信息</span> <i class="fa fa-circle"></i></li>
	<li><a href="/pages/base/station/list.html" data-pjax>站点信息</a> <i class="fa fa-circle"></i></li>
	<li><span class="active">添加站点</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">添加站点
				 <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/station/list.html" style="float: right;padding: 4px 23px;" data-pjax=""><i class="fa fa-reply"></i> 退出</a>
			</div>
		</div>
	</div>
	<div class="portlet-body form">
		<!-- START FORM 表单容器 -->
		<form class="form-horizontal" id="submit_station_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> 站点名称 </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> 站点位置 </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> 站点信息 </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> 确认 </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>
							您的输入有误,请检查下面的输入项
						</div>
						<div class="alert alert-success display-none">
							<button class="close" data-dismiss="alert"></button> 
							 验证成功! 
						</div>
						<!-- 选择添加站点方式 -->
                       	<div class="tab-pane active" id="tab1">
                       		<h3 class="block"> 站点名称 </h3>
                      		<!-- 站点名称 -->
							<div class="form-group" id="formRequ">
								<label class="col-md-3 control-label"><span class="required"> * </span>站点名称:</label>
								<div class="col-md-9">
									<input type="text" class="form-control input-medium" id="stationName">
								</div>
							</div>
                        </div>
                        <!-- 站点位置 -->
                        <div class="tab-pane" id="tab2">
                        	<h3 class="block">  站点位置  </h3>
                            <div id="stationbmap_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"> 绘制工具
								        <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> 打开 </a>
								        </li>
								        <li>
								            <a href="javascript:;" id = "closeDrawingManager"> <i class="fa fa-reply"></i> 关闭 </a>
								        </li>
								    </ul>
								</div>
							</div>-->
                        </div>
                        <!-- 站点信息 -->
                        <div class="tab-pane" id="tab3">
                        	<h3 class="block"> 站点信息 </h3>
							<!-- 站点名称 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> 站点名称&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<input type="text" class="form-control" name="stationName" placeholder="站点名称"/>
										<input type="hidden" id="centerPointWkt" name="centerPointWkt" />
									</div>
								</div>
							</div>
							<!-- 行业编码 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										行业编码&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<input type="text" class="form-control" name="standardStationCode" placeholder="行业编码"/>
									</div>
								</div>
							</div>
							<!-- 东西向 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> 东西向&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<select name="ewDirection" class="form-control">
											<option value="">-- 请选择东西向 --</option>
											<option value="0">东->西</option>
											<option value="1">西->东</option>
										</select>
									</div>
								</div>
							</div>
							<!-- 南北向 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										<span class="required"> * </span> 南北向&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<select name="snDirection" class="form-control">
											<option value="">-- 请选择南北向 --</option>
											<option value="0">南->北</option>
											<option value="1">北->南</option>
										</select>
									</div>
								</div>
							</div>
							<!-- 所在路段 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										所在路段&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<input type="text" name="roadCoding" class="form-control" readonly/>
									</div>
								</div>
							</div>
							<!-- 地址 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										地址&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<input type="text" name="address" class="form-control"/>
									</div>
								</div>
							</div>
							<!-- 途经线路 -->
							<div class="form-body">
								<div class="form-group">
									<label class="control-label col-md-3">
										途经线路&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:
									</label>
									<div class="col-md-7">
										<textarea name="passLines" class="form-control" rows="3"/>
									</div>
								</div>
							</div>
                        </div>
                        
                        <!-- 确定提交资料信息 -->
                        <div class="tab-pane" id="tab4">
                           <h3 class="block"> 确认您提交的站点信息 </h3>
                           <h4 class="form-section"> 地理位置 </h4>
                           <div class="form-group">
                               <label class="control-label col-md-3"> 百度坐标点: </label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="centerPointWkt"> </p>
                               </div>
                           </div> 
                           <h4 class="form-section"> 站点信息 </h4>
                           <div class="form-group">
                               <label class="control-label col-md-3">站点名称 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="stationName"> </p>
                               </div>
                           </div>
                           
                           <div class="form-group">
                              <label class="control-label col-md-3">行业编码&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                              <div class="col-md-4">
                                  <p class="form-control-static" data-display="standardStationCode"> </p>
                              </div>
                           </div>
                             <div class="form-group">
                               <label class="control-label col-md-3">东西向&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</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">南北向&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</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">所在路段&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="roadCoding"> </p>
                               </div>
                           </div>
                           
                            <div class="form-group">
                               <label class="control-label col-md-3">地址&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="address"> </p>
                               </div>
                           </div>
                           
                           <div class="form-group">
                               <label class="control-label col-md-3">途经线路&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</label>
                               <div class="col-md-4">
                                   <p class="form-control-static" data-display="passLines"> </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> 返回 </a>
                         <a href="javascript:;" class="btn btn-outline green button-next"> 下一步
                             <i class="fa fa-angle-right"></i>
                         </a>
                         <a href="javascript:;" class="btn green button-submit" style="display: none;" id="submintBtn"> 提交
                             <i class="fa fa-check"></i>
                         </a>
                     </div>
                 </div>
              </div>
        	</div>
        </form>
		<!-- END FORM-->
	</div>
</div>
<!-- 表单元素事件JS类库 -->
<script src="/pages/base/station/js/add-form-events.js"></script>
<!-- 函数方法JS类库 -->
<script src="/pages/base/station/js/add-input-function.js"></script>
<!-- 表单向导JS类库 -->
<script src="/pages/base/station/js/add-form-wizard.js"></script>
<!-- 地图JS类库 -->
<script src="/pages/base/station/js/add-vmap-world.js"></script>
<!-- reload事件 -->
<script src="/pages/base/station/js/add-form-reload.js"></script>