<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>提交订单</title>
<!--/模板/-->
<link rel="stylesheet" href="css/master.css" charset="UTF-8">
<link rel="stylesheet" href="css/ace.min.css" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/font-awesome.min.css" charset="UTF-8">
<link rel="stylesheet" href="css/common_css/pay_order.css" />
<link rel="stylesheet" href="css/datepicker.css" />
<link rel="stylesheet" href="css/daterangepicker.css" />
<link rel="stylesheet" href="css/xcConfirm.css" />
<link rel="stylesheet" type="text/css" href="css/title.css"/>
</head>
<body>
<!--标题-->
<div class="title_top_box">
<div class="title_top_box_left" id=""><img height="45px;" src="images/logo.png"/></div>
<div class="title_top_box_right" id="">
<span class="title_top_box_span1">上海茂悦大酒店</span>
<span class="title_top_box_span2" onclick="login_out()">退出</span>
</div>
</div>
<div class="warp clearfix">
<!--菜单-->
<div class="control-bar"></div>
<!--内容-->
<div class="control-show" style="width: 1100px;min-height: 720px;">
<div class="top_title">提交订单</div>
<div class="line_top"></div>
<div class="select_car_time">选择车次</div>
<div class="tabbable" id="tabbable">
<div class="profile-user-info profile-user-info-striped" style="margin-top: 20px;">
<!--出发日期-->
<div class="profile-info-row" id="go_time">
<div class="profile-info-name">出发日期：</div>
<div class="profile-info-value">[出发日期]</div>
</div>
<!--上下站点-->
<div class="profile-info-row" id="up_and_down_station">
<div class="profile-info-name" style="padding:10px;">上下站点：</div>
<div class="profile-info-value">
<span>[出发地]</span>
<span style="margin-left: 10px;">
<select id="start_area_station" style="width:180px;" onchange="selectStartStationID()">
<option value="0">[出发地站点]</option>
</select>
</span>
<span style="margin-left: 25px;">----</span>
<span style="margin-left: 25px;">[目的地]</span>
<span style="margin-left: 10px;">
<select id="end_area_station" style="width:180px;" onchange="selectEndStationID()">
<option value="0">[目的地站点]</option>
</select>
</span>
</div>
</div>
<!--选择返程-->
<div class="profile-info-row">
<div class="profile-info-name">选择返程：</div>
<div class="profile-info-value">
<div><input type="checkbox" id="ifback" onclick="ifbackSelected(this.checked)" /></div>
<div id="all_back">
<div class="profile-info-value" style="margin-left: -10px;">
<div class="input-group com_span_top" id="calendar" style="width: 130px; float: left;display: none;">
<input id="id-date-picker-1" class="form-control date-picker" onchange="selectBackDate(this.value)" data-date-format="yyyy-mm-dd" type="text" placeholder="返程日期" style="font-size: 12px; height:30px;">
<span class="input-group-addon">
<i class="icon-calendar bigger-110"></i>
</span>
</div>
<div id="select_shift_div" style="float: left;margin-left: 20px;display: none;">
<select id="select_shift" style="width:90px;" onchange="selectShiftInfo()">
<option value="1">请选择</option>
</select>
</div>
<div class="no_info_atten" style="float: left;margin-left: 20px;display: none; color: red; height: 30px;line-height: 30px;">无相关班次信息</div>
</div>
<div style="clear: both;"></div>
<div class="profile-info-value" id="back_info" style="margin-left: -10px;margin-top:8px;display: none;">
<span>[返程出发地]</span>
<span style="margin-left: 10px;">
<select id="start_area_station_back" style="width:180px;" onchange="selectBackStartStationID()">
<option value="0">[返程出发地站点]</option>
</select>
</span>
<span style="margin-left: 25px;">----</span>
<span style="margin-left: 25px;">[返程目的地]</span>
<span style="margin-left: 10px;">
<select id="end_area_station_back" style="width:180px;" onchange="selectBackEndStationID()">
<option value="0">[返程目的地站点]</option>
</select>
</span>
</div>
</div>
</div>
</div>
<!--数 量-->
<div class="profile-info-row">
<div class="profile-info-name">数 量：</div>
<div class="profile-info-value">
<div class="row">
<div class="col-xs-12">
<div class="table-responsive">
<table id="sample-table-1" class="table table-striped table-bordered table-hover" style="width: 500px;">
<thead>
<tr id="has_noback">
<th width="130px">座位等级</th>
<th width="130px">数量</th>
<th width="120px">结算价</th>
<th width="120px">总价</th>
</tr>
<tr id="has_back" style="display: none">
<th width="130px">座位等级</th>
<th width="130px">数量</th>
<th width="120px">往返结算价</th>
<th width="120px">总价</th>
</tr>
</thead>
<tbody id="list">
<tr class="list_info" id="list_info">
<td>[座位等级]</td>
<td id="count">
<select id="count_station" style="width:80px;" onchange="changeTotalPrice()">
<option value="[0]">[-]</option>
</select>
</td>
<td id="price">[价格]</td>
<td id="total"></td>
</tr>
<tr class="list_info" id="list_info_back" style="display: none;">
<td>[座位等级]</td>
<td id="back_count">
<select id="back_count_station" style="width:80px;" onchange="changeBackTotalPrice()">
<option value="[0]">[-]</option>
</select>
</td>
<td id="back_price">[价格]</td>
<td id="back_total"></td>
</tr>
</tbody>
</table>
</div>
<!-- /.table-responsive -->
</div>
<!-- /span -->
</div>
</div>
</div>
</div>
</div>
<div class="select_car_people">联系人信息</div>
<div class="tabbable" >
<div class="profile-user-info profile-user-info-striped" style="margin-top: 20px;">
<!--姓名-->
<div class="profile-info-row" style="margin-left: -10px;">
<div class="profile-info-name">姓 名：</div>
<div class="profile-info-value">
<input id="peo_name" type="text" style="width: 160px; font-size: 13px;"/>
</div>
</div>
<!--手机号-->
<div class="profile-info-row" style="margin-left: -10px;">
<div class="profile-info-name">手机号：</div>
<div class="profile-info-value">
<input type="text" id="peo_tel" style="width: 160px; font-size: 13px;"/>
</div>
</div>
</div>
</div>
<!--乘客人信息-->
<div class="select_car_people">乘客人信息</div>
<div id="all_passenger">
<div class="passenger" id="passenger_info">
<span>乘客1：</span>
<span style="padding-left: 20px;">
<input id="pass_name" type="text" placeholder="姓名" style="font-size: 13px; width: 90px;"/>
</span>
<span>
<input id="pass_tel" type="text" placeholder="证件号" style="font-size: 13px; width: 170px;"/>
</span>
</div>
</div>
<!--保存-->
<div class="line_top" style="margin-top: 55px;"></div>
<div class="save_btn btn-primary" id="save_btn" onclick="saveBtnClicked()">提交</div>
<!--去程提交成功-->
<div class="commit_ticket_go_success" id="commit_ticket_go_success" style="margin-top: 20px;display: none;">
<div style="margin-top: 20px;margin-left: 20px;">
<span class="circle_right" >√</span>
<span style="padding-left: 30px;">提交成功</span>
</div>
<!--去程-->
<div>
<div style="margin-left: 90px;margin-top: 25px;">
<span class="circle">去</span>
<span style="padding-left: 20px;">[去程出发地]（去程出发地站点）</span>
<span style="margin-left: 5px;">-</span>
<span style="margin-left: 10px;">[去程目的地]（去程目的地站点）</span>
</div>
<div>
<hr style="border:1px dashed lightgray; height:0px;margin-left: 90px;width: 630px;">
</div>
<div style="margin-left: 100px;">
<div>出发时间：[yyyy-mm-dd][mm:ss]</div>
<div style="margin-top: 10px;">数量：[座位等级]x[数量]</div>
<div style="margin-top: 10px;">姓名：[姓名]</div>
<div style="margin-top: 10px;">手机号：[手机号]</div>
</div>
</div>
<div>
<hr style="border:1px dashed lightgray; height:0px;margin-left: 90px;width: 630px;">
</div>
<!--订单总额-->
<div>
<div style="margin-left: 90px;margin-top: 5px;">订单总额：[订单总额]</div>
</div>
<div style="margin-left: 80px;margin-top: 25px;margin-bottom: 25px;">
<span style="float: left;margin-bottom: 20px;" class="close_btn btn-primary" onclick="click_cancel(null,'.commit_ticket_go_success')">关闭</span>
<span id="go_pay" style="padding: 5px 10px;float: left;margin-left: 25px;display: none;" class="style_btns btn-primary" onclick="go_pay()" >去支付</span>
</div>
</div>
<!--往返提交成功-->
<div class="commit_ticket_back_success" id="commit_ticket_back_success" style="margin-top: 20px;display: none;">
<div style="margin-top: 20px;margin-left: 20px;">
<span class="circle_right" >√</span>
<span style="padding-left: 30px;">提交成功</span>
</div>
<!--去程-->
<div>
<div style="margin-left: 90px;margin-top: 15px;">
<span class="circle">去</span>
<span style="padding-left: 20px;">[去程出发地]（去程出发地站点）</span>
<span style="margin-left: 5px;">-</span>
<span style="margin-left: 10px;">[去程目的地]（去程目的地站点）</span>
</div>
<div>
<hr style="border:1px dashed lightgray; height:0px;margin-left: 90px;width: 630px;">
</div>
<div style="margin-left: 100px;">
<div>出发时间：[yyyy-mm-dd][mm:ss]</div>
<div style="margin-top: 10px;">数量：[座位等级]x[数量]</div>
</div>
</div>
<!--返程-->
<div>
<div style="margin-left: 90px;margin-top: 25px;">
<span class="circle">返</span>
<span style="padding-left: 20px;">[返程出发地]（返程出发地站点）</span>
<span style="margin-left: 5px;">-</span>
<span style="margin-left: 10px;">[返程目的地]（返程目的地站点）</span>
</div>
<div>
<hr style="border:1px dashed lightgray; height:0px;margin-left: 90px;width: 630px;">
</div>
<div style="margin-left: 100px;">
<div>出发时间：[yyyy-mm-dd][mm:ss]</div>
<div style="margin-top: 10px;">数量：[座位等级]x[数量]</div>
<div style="margin-top: 10px;">姓名：[姓名]</div>
<div style="margin-top: 10px;">手机号：[手机号]</div>
</div>
<div>
<hr style="border:1px dashed lightgray; height:0px;margin-left: 90px;width: 630px;">
</div>
</div>
<!--订单总额-->
<div>
<div style="margin-left: 90px;margin-top: 5px;">订单总额：[订单总额]</div>
</div>
<div style="margin-left: 80px;margin-top: 25px;margin-bottom: 25px;">
<span style="float: left;margin-bottom: 20px;" class="close_btn btn-primary" onclick="click_cancel(null,'.commit_ticket_back_success')">关闭</span>
<span id="go_back_pay" style="padding: 5px 10px;float: left;margin-left: 25px;display: none;" class="style_btns btn-primary" onclick="go_pay()" >去支付</span>
</div>
</div>
<!--蒙板-->
<div class="mask" onclick="hide_all()" style="display: none;top: 0;left: 0;margin: 0px;padding: 0px;width: 100%;height: 100%;position: absolute;z-index: 2;background: #000000;opacity: 0.5;"></div>
</div>
</div>
<!--结束语-->
<div class="end_down">Copyright © 2016 zhizhuchuxing.com. 蜘蛛行网络科技有限公司版权所有</div>
</body>
<script src="js/jquery-2.2.4.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="js/main.js" ></script>
<script src="js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>
<script src="js/bootstrap-datepicker.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$('#id-date-picker-1').datepicker({autoclose:true}).next().on("click", function(){$(this).prev().focus();});
</script>
<script src="js/pay_order.js?version=1" type="text/javascript" charset="utf-8"></script>
<script src="js/master.js"></script>
</html>