@layout("/common/_container.html"){
<style>
	.box{
		display: flex;
		margin-left: 24px;
		margin-bottom: 10px;
	}

	.button ,button-primary， button-small {
		border: 1px solid #0e9aef;
		width: 200px;height: 100px;
		text-align: center;
		line-height: 100px;
	}

</style>
<div class="container-fluid" style="padding: 0 !important;">
	<div class="row">

		<div class="col-sm-12">
			<div class="row" style="border-style: none none solid; border-color: #e7eaec; border-width: 1px 0px;">
				<ul class="breadcrumb" style="height: 45px; line-height: 45px; padding-left: 20px;">
					@if(language==1){
					<li><a href="#" class="statistics">运营数据总览</a></li>
					<li><a href="#" class="map">车辆地图总览</a></li>
					<li><a href="#" class="order">订单热点图</a></li>
					@}
					@if(language==2){
					<li><a href="#" class="statistics">Overview of operational data</a></li>
					<li><a href="#" class="map">Overview of vehicle map</a></li>
					<li><a href="#" class="order">Order hotspot map</a></li>
					@}
					@if(language==3){
					<li><a href="#" class="statistics">Tinjauan Data Operasional</a></li>
					<li><a href="#" class="map">Gambaran Umum Peta Kendaraan</a></li>
					<li><a href="#" class="order">Pesan peta hotspot</a></li>
					@}

				</ul>
			</div>

			<div class="row content" id="statisticsDiv">
				<div class="form-group" style="height: 80px; padding-top: 20px; background-color: #FFFFFF;margin-bottom: 8px;">
					<div class="col-sm-3">
						<div class="input-group">
							<div class="input-group-btn">
								@if(language==1){
								<button data-toggle="dropdown" class="btn btn-white dropdown-toggle"
										type="button">选择查看范围
								</button>
								@}
								@if(language==2){
								<button data-toggle="dropdown" class="btn btn-white dropdown-toggle"
										type="button">Select viewing range
								</button>
								@}
								@if(language==3){
								<button data-toggle="dropdown" class="btn btn-white dropdown-toggle"
										type="button">Pilih rentang tampilan
								</button>
								@}


							</div>
							<div style="padding-left: 0px;">
								<select class="form-control" id="branchOffice">
									@if(language==1){
									<option value="">----请选择----</option>
									@}
									@if(language==2){
									<option value="">----Please select----</option>
									@}
									@if(language==3){
									<option value="">----Silahkan pilih----</option>
									@}

								</select>
							</div>
						</div>
					</div>
					<div class="col-sm-2">
						@if(language==1){
						<#button name="搜索" icon="fa-search" clickFun="getData()"/>
						@}
						@if(language==2){
						<#button name="Search" icon="fa-search" clickFun="getData()"/>
						@}
						@if(language==3){
						<#button name="Pencarian" icon="fa-search" clickFun="getData()"/>
						@}

					</div>
				</div>
				<div class="col-sm-3">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<div class="pull-right" style="margin-top: -10px;">
								<input type="text" class="layui-input form-control" id="addDate">
							</div>
							@if(language==1){
							<h5>今日运行情况</h5>
							@}
							@if(language==2){
							<h5>Today's operation</h5>
							@}
							@if(language==3){
							<h5>Operasi hari ini</h5>
							@}

						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="newPassengerInfo">0</h1>
							@if(language==1){
							<small>新增用户</small>
							@}
							@if(language==2){
							<small>Newly add users</small>
							@}
							@if(language==3){
							<small>Pengguna Baru</small>
							@}

						</div>
						<div class="ibox-content" onclick="Home.onlineDriver()">
							<h1 class="no-margins" id="newNetcardriver">0</h1>
							@if(language==1){
							<small>在线司机</small>
							@}
							@if(language==2){
							<small>Online driver</small>
							@}
							@if(language==3){
							<small>Pengemudi online</small>
							@}

						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail1">0</h1>
							@if(language==1){
							<small>摩托车订单数</small>
							@}
							@if(language==2){
							<small>Number of motorcycle orders</small>
							@}
							@if(language==3){
							<small>Jumlah pesanan sepeda motor</small>
							@}

						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail4">0</h1>
							@if(language==1){
							<small>同城快送订单</small>
							@}
							@if(language==2){
							<small>Intra-city express delivery of orders</small>
							@}
							@if(language==3){
							<small>Pesanan express dalam kota Express</small>
							@}

						</div>
					</div>
				</div>
				<div class="col-sm-3">
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							@if(language==1){
							<span class="label label-info pull-right">全部</span>
							<h5>运营总数据</h5>
							@}
							@if(language==2){
							<span class="label label-info pull-right">All</span>
							<h5>Total operational data</h5>
							@}
							@if(language==3){
							<span class="label label-info pull-right">Semua</span>
							<h5>Total data operasional</h5>
							@}

						</div>


						@if(language==1){
						<div class="ibox-content">
							<h1 class="no-margins" id="passengerInfoSum">0</h1>
							<small>总用户</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netcarDriverSum">0</h1>
							<small>总司机</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netCarSum">0</h1>
							<small>总车辆</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetailSum">0</h1>
							<small>总订单</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paiceSum">0</h1>
							<small>交易总金额</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paySum">0</h1>
							<small>总收益</small>
						</div>
						@}
						@if(language==2){
						<div class="ibox-content">
							<h1 class="no-margins" id="passengerInfoSum">0</h1>
							<small>Total user</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netcarDriverSum">0</h1>
							<small>Chief driver</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netCarSum">0</h1>
							<small>Total vehicle</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetailSum">0</h1>
							<small>Total order</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paiceSum">0</h1>
							<small>Total transaction amount</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paySum">0</h1>
							<small>Total revenue</small>
						</div>
						@}
						@if(language==3){
						<div class="ibox-content">
							<h1 class="no-margins" id="passengerInfoSum">0</h1>
							<small>Total pengguna</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netcarDriverSum">0</h1>
							<small>Kepala pengemudi</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netCarSum">0</h1>
							<small>Total kendaraan</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetailSum">0</h1>
							<small>Total pemesanan</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paiceSum">0</h1>
							<small>Jumlah transaksi total</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paySum">0</h1>
							<small>Total pendapatan</small>
						</div>
						@}

					</div>
				</div>
				<div class="col-sm-3">
					<div class="ibox float-e-margins">

						@if(language==1){
						<div class="ibox-title">
							<div class="pull-right" style="margin-top: -10px;">
								<input type="text" class="layui-input form-control" id="rangeDate" style="width: 100px">
							</div>
							<h5>运营数据增长查询</h5>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="passengerInfoSum1">0</h1>
							<small>用户增长数</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netcarDriverSum1">0</h1>
							<small>新增司机</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail11">0</h1>
							<small>摩托车订单数</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail41">0</h1>
							<small>同城快送订单数</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paiceSum1">0</h1>
							<small>交易总金额</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paySum1">0</h1>
							<small>总收益</small>
						</div>
						@}
						@if(language==2){
						<div class="ibox-title">
							<div class="pull-right" style="margin-top: -10px;">
								<input type="text" class="layui-input form-control" id="rangeDate" style="width: 100px">
							</div>
							<h5>Search of operational data growth</h5>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="passengerInfoSum1">0</h1>
							<small>User growth</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netcarDriverSum1">0</h1>
							<small>Newly add drivers</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail11">0</h1>
							<small>Number of motorcycle orders</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail41">0</h1>
							<small>Intra-city express delivery of orders</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paiceSum1">0</h1>
							<small>Total transaction amount</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paySum1">0</h1>
							<small>Total revenue</small>
						</div>
						@}
						@if(language==3){
						<div class="ibox-title">
							<div class="pull-right" style="margin-top: -10px;">
								<input type="text" class="layui-input form-control" id="rangeDate" style="width: 100px">
							</div>
							<h5>Pencarian pertumbuhan data operasional</h5>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="passengerInfoSum1">0</h1>
							<small>Pertumbuhan Pengguna</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="netcarDriverSum1">0</h1>
							<small>Pengemudi baru</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail11">0</h1>
							<small>Jumlah pesanan sepeda motor</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="orderDetail41">0</h1>
							<small>Pesanan express dalam kota Express</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paiceSum1">0</h1>
							<small>Jumlah transaksi total</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins" id="paySum1">0</h1>
							<small>Total pendapatan</small>
						</div>
						@}

					</div>
				</div>
				<div class="col-sm-3">
					@if(language==1){
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<span class="label label-danger pull-right">最近30天</span>
							<h5>运营总趋势</h5>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetailSum1" >Loading..</span>
							</h1>
							<small>订单数趋势图</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="passengerInfoSum2">Loading..</span>
							</h1>
							<small>用户注册趋势图</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetail12">Loading..</span>
							</h1>
							<small>摩托车订单趋势图</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetail42">Loading..</span>
							</h1>
							<small>同城快送订单趋势图</small>
						</div>
					</div>
					@}
					@if(language==2){
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<span class="label label-danger pull-right">Last 30 days</span>
							<h5>General operating trend</h5>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetailSum1">Loading..</span>
							</h1>
							<small>Order trend chart</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="passengerInfoSum2">Loading..</span>
							</h1>
							<small>User registration trend chart</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetail12">Loading..</span>
							</h1>
							<small>Motorcycle order trend chart</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetail42">Loading..</span>
							</h1>
							<small>Trend chart of intra-city express delivery orders</small>
						</div>
					</div>
					@}
					@if(language==3){
					<div class="ibox float-e-margins">
						<div class="ibox-title">
							<span class="label label-danger pull-right">30 hari terakhir</span>
							<h5>Tren Operasi Umum</h5>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetailSum1">Loading..</span>
							</h1>
							<small>Grafik tren pesanan</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="passengerInfoSum2">Loading..</span>
							</h1>
							<small>Grafik Tren Pendaftaran Pengguna</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetail12">Loading..</span>
							</h1>
							<small>Grafik tren pesanan sepeda motor</small>
						</div>
						<div class="ibox-content">
							<h1 class="no-margins">
								<span class="dynamicsparkline" id="orderDetail42">Loading..</span>
							</h1>
							<small>Grafik tren pesanan dalam kota yang sama</small>
						</div>
					</div>
					@}

				</div>
			</div>

			<div class="row content" id="mapDiv">
				<div class="form-group" style="height: 80px; padding-top: 20px; background-color: #FFFFFF;margin-bottom: 8px;">

					<div class="col-sm-8">
						<div class="input-group">
							<div class="input-group-btn">
								@if(language==1){
								<button data-toggle="dropdown" class="btn btn-white dropdown-toggle"
										type="button">选择查看范围
								</button>
								@}
								@if(language==2){
								<button data-toggle="dropdown" class="btn btn-white dropdown-toggle"
										type="button">Select viewing range
								</button>
								@}
								@if(language==3){
								<button data-toggle="dropdown" class="btn btn-white dropdown-toggle"
										type="button">Pilih rentang tampilan
								</button>
								@}

							</div>
							<div class="col-sm-4" style="padding-left: 0px;">
								<select class="form-control" id="branchOffice1">
									@if(language==1){
									<option value="">----请选择----</option>
									@}
									@if(language==2){
									<option value="">----Please select----</option>
									@}
									@if(language==3){
									<option value="">----Silahkan pilih----</option>
									@}

								</select>
							</div>
						</div>
					</div>
					<div class="col-sm-2">
						@if(language==1){
						<#button name="搜索" icon="fa-search" clickFun="getData()"/>
						@}
						@if(language==2){
						<#button name="Search" icon="fa-search" clickFun="getData()"/>
						@}
						@if(language==3){
						<#button name="Pencarian" icon="fa-search" clickFun="getData()"/>
						@}
					</div>
				</div>
				<div class="form-group">
					<div class="col-sm-2" style="padding: 0px; height: 47em; overflow: auto">
						<div class="form-group" style="padding: 0px 5px;">
							<div class="col-sm-12">
								<ul class="list-group" id="netcardriver">

								</ul>
							</div>
						</div>
					</div>

					<div class="col-sm-8" style="padding: 0px;">
						<div class="form-group" style="padding: 0px 5px;">
							<div id="map" style="height: 47em;"></div>
						</div>
					</div>



					<div class="col-sm-2" style="padding: 0px; height: 47em; overflow: auto">
						<div class="form-group">
							<div class="col-sm-12" style="padding: 0px 5px;">
								<ul class="list-group" id="order">

								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="row content" id="orderDiv">

				<div class="box">
					@if(language==1){
					<div id="SupendButton-one" type="button" class="button button-primary button-small " onclick=changeColor(this);>
						<p>摩托车订单</p>
					</div>
					<div id="SupendButton-two" type="button" class="button button-primary button-small "  onclick=changeColor1(this);>
						<p>同城快送订单</p>
					</div>
					@}
					@if(language==2){
					<div id="SupendButton-one" type="button" class="button button-primary button-small " onclick=changeColor(this);>
						<p>Motorcycle order</p>
					</div>
					<div id="SupendButton-two" type="button" class="button button-primary button-small "  onclick=changeColor1(this);>
						<p>Intra-city express delivery of orders</p>
					</div>
					@}
					@if(language==3){
					<div id="SupendButton-one" type="button" class="button button-primary button-small " onclick=changeColor(this);>
						<p>Pesanan sepeda motor</p>
					</div>
					<div id="SupendButton-two" type="button" class="button button-primary button-small "  onclick=changeColor1(this);>
						<p>Pesanan express dalam kota Express</p>
					</div>
					@}

				</div>

				<div class="form-group" style="height: 80px; padding-top: 20px; background-color: #FFFFFF;margin-bottom: 8px;">
					<div class="col-sm-8" style="padding: 0px;">
						<div class="form-group" style="padding: 0px 5px;">
							<div id="map1" style="height: 47em;width: 1800px;"></div>
						</div>
					</div>
					<div class="col-sm-12">
						<div id="container_" style="height: 47em;"></div>
					</div>

				</div>
			</div>

		</div>
	</div>
</div>
<script async src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCnvS7Xm3utDjc2fdd5Gvk5E1-bavcrzAA&callback=initMap&v=weekly"></script>
<script src="${ctxPath}/home.js"></script>

<script src="${ctxPath}/js/jquery.sparkline 2.1.2.js"></script>
<script type="text/javascript">
	function changeColor(obj) {
		//清空其它同类按钮选中颜色
		$('div[id^="SupendButton-"]').css("background-color", "transparent");//按钮原来颜色
		//点击后变色
		$(obj).val(1);
		$("#SupendButton-two").val('')
		$(obj).css("background-color", "#0e9aef")

		Home.getAllOrder();
	}
	function changeColor1(obj) {
		//清空其它同类按钮选中颜色
		$('div[id^="SupendButton-"]').css("background-color", "transparent");//按钮原来颜色
		//点击后变色
		$(obj).val(2);
		$("#SupendButton-one").val('')
		$(obj).css("background-color", "#0e9aef")
		Home.getAllOrder();
	}
</script>
@}