<div class="top-pad"></div>

<div class="content-padding">

	<h1 class="left title"><i class="fa fa-car"></i>Order Details</h1>
	<div class="ticket-status-top">
		<div class="ticket-status-open">{{order.status.status}}</div>
	</div>
	<div class="divider"></div>
	<div class="bar-loader bar-loader-search" ng-class="{'bar-loader-loading': loading}"></div>

	<div class="support-boxes">

		<? /* orde details */ ?>
		<div class="support-box-wrap box-content2" ng-if="order.id_order">
			<div class="support-box-wrap-header">
				<h1>Order #{{order.id_order}}</h1>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">
				<div class="field-container">
					<div class="field-row">
						<div class="field-key">Pay / Type</div>
						<div class="field-value">{{order.pay_type | capitalize}} / {{order.delivery_type | capitalize}}</div>
					</div>
					<div class="field-row">
						<div class="field-key">Placed At</div>
						<div class="field-value">

							<span ng-if="order.restaurant.timezone != account.user.timezone">
								{{order.date | convertimeformat:order.restaurant.timezone:'MMMM Do YYYY, h:mm:ss a'}}
								&nbsp;(<span class="listview-bold">{{order.date | convertimeformat:order.restaurant.timezone:'z'}}</span>)
								<br>
							</span>
							{{order.date | convertimeformat:account.user.timezone:'MMMM Do YYYY, h:mm:ss a'}}
							&nbsp;(<span class="listview-bold">{{order.date | convertimeformat:account.user.timezone:'z'}}</span>)
							<div ng-if="!order._outsideOf24h" class="listview-smaller">
								(<span am-time-ago="order.date"></span>)
							</div>
						</div>
					</div>
					<div class="field-row" ng-if="order.date_delivery">
						<div class="field-key">Desired Delivery Time</div>
						<div class="field-value">
							<span ng-if="order.restaurant.timezone != account.user.timezone">
								{{order.date_delivery | convertimeformat:order.restaurant.timezone:'MMMM Do YYYY, h:mm:ss a'}}
								&nbsp;(<span class="listview-bold">{{order.date_delivery | convertimeformat:order.restaurant.timezone:'z'}}</span>)
								<br>
							</span>
							{{order.date_delivery | convertimeformat:account.user.timezone:'MMMM Do YYYY, h:mm:ss a'}}
							&nbsp;(<span class="listview-bold">{{order.date_delivery | convertimeformat:account.user.timezone:'z'}}</span>)
							<span class="tag tag-purple" ng-if="order.date_delivery">Pre ordered</span>
						</div>
					</div>
					<div class="field-row">
						<div class="field-key">Status</div>
						<div class="field-value">
							<span ng-if="order.status">
								<span class="tag tag-red" ng-if="order.status.status == 'new'">New</span>
								<span class="tag tag-green" ng-if="order.status.status == 'accepted'">Accepted</span>
								<span class="tag tag-blue" ng-if="order.status.status == 'pickedup'">Pickedup</span>
								<span class="tag tag-purple" ng-if="order.status.status == 'delivered'">Delivered</span>
								<br/>
								<span ng-if="!order.status._outside_of_24h" class="listview-smaller">
									<span am-time-ago="order.status.timestamp*1000"></span>
								</span>
								<span ng-if="order.status._outside_of_24h" class="listview-smaller">
									{{order.status._date_formatted}}
								</span>
							</span>
							<span ng-if="!order.status">{{order.confirmed ? 'Confirmed' : 'Placed'}}</span>
						</div>
					</div>
					<div class="field-row" ng-if="order.pay_type == 'card'">
						<div class="field-key">{{order.processor == 'stripe' ? 'Stripe' : 'Balanced'}}</div>
						<div class="field-value">
							<a ng-if="order.processor == 'balanced'" href="https://dashboard.balancedpayments.com/#/marketplaces/MP2BldrjHz0NLH3st95JbeR0/debits/{{order.txn}}" target="_blank">{{order.txn}}</a>
							<a ng-if="order.processor == 'stripe'" href="https://dashboard.stripe.com/payments/{{order.txn}}" target="_blank">{{order.txn}}</a>
						</div>
					</div>
					<div class="field-row">
						<div class="field-key">User Agent</div>
						<div class="field-value">
							{{order.agent}}
						</div>
					</div>
					<div class="field-row">
						<div class="field-key">Informed ETA</div>
						<div class="field-value">
							{{order.informed_eta}}
						</div>
					</div>

					<div class="field-row" ng-if="order.status.status != 'delivered' && eta.time">
						<div class="field-key">ETA</div>
						<div class="field-value">
							{{eta.time | formatPrice}} minutes
						</div>
					</div>
					<div class="field-row" ng-if="order.refunded">
						<div class="field-key">Refunded</div>
						<div class="field-value">
							<span class="tag tag-green" ng-show="!order.refunded_partial">{{order.refunded_status}}</span>
							<span class="tag tag-orange" ng-show="order.refunded_partial">{{order.refunded_status}}</span>
						</div>
					</div>

					<div class="field-row" ng-if="order.refunded_partial">
						<div class="field-key">Refunded Amount</div>
						<div class="field-value">
							${{order.refunded_amount | number:2}}
						</div>
					</div>

					<div class="field-row" ng-if="order.refunded">
						<div class="field-key">Refunded Reason</div>
						<div class="field-value">
							{{order.refunded_reason}}
						</div>
					</div>

					<div ng-if="order.delivery_service && ( order.refunded || ( order.status && order.status.status == 'canceled' ) )" class="field-row link no-underline">
						<div class="field-key">
							Do Not Pay Driver Anything
						</div>
						<div class="field-value">
							<label class="switch-wrap">
								<input type="checkbox" ng-click="do_not_pay_driver()" class="switch" ng-model="order.do_not_pay_driver"/><div></div>
							</label>
						</div>
					</div>
					<div class="field-row link no-underline" ng-if="order.refunded || ( order.status && order.status.status == 'canceled' )">
						<div class="field-key">
							Pay restaurant despite refund <br>(e.g. this refund was our fault)
						</div>
						<div class="field-value">
							<label class="switch-wrap">
								<input type="checkbox" ng-click="do_not_pay_restaurant()" class="switch" ng-model="order.do_not_pay_restaurant"/><div></div>
							</label>
						</div>
					</div>

					<div class="field-row link no-underline">
						<div class="field-key">
							Receipt
						</div>
						<div class="field-value">
							<a href="/vieworder/{{order.uuid}}/customer" target="_blank">Customer Receipt</a>
						</div>
					</div>
				</div>

				<br><br>
				<div class="double-cols">
					<button title="Refund Order" class="button button-empty button-border button-orange" ng-class="{'button-disabled': isRefunding || order.refunded || !order.user.id_user }" ng-click="refund()"><i class="fa fa-heart"></i><span class="label"> Refund</span></button>
					<button title="Issue Gift Card" ng-click="creditDialog( order.id_user );" class="button button-empty button-border button-orange"><i class="fa fa-gift"></i><span class="label">&nbsp;Gift Card</span></button>
				</div>
				<div class="tripple-cols">
					<button title="Text Drivers" ng-class="{'button-disabled': !order.delivery_service}" ng-click="text_drivers();" class="button button-empty button-border button-green"><i class="fa fa-mobile"></i><span class="label"> Drivers</span></button>
					<button title="Resend Driver Notifiction" ng-click="resend_notification_drivers();" class="button button-empty button-border button-green" ng-class="{'button-disabled': isDriverNotifying || !order.delivery_service || (order.delivery_service && ( order.status.status == 'pickedup' || order.status.status == 'accepted' || order.status.status == 'delivered' || order.status.status == 'transfered' ))}"><i class="fa fa-car"></i><span class="label"> Notify</span></button>
					<button title="Resend Restaurant Notification" ng-click="resend_notification();" class="button button-empty button-border button-blue" ng-class="{'button-disabled': isRestaurantNotifying || order.confirmed || (order.restaurant.delivery_service && !order.restaurant.formal_relationship && !order.restaurantorder_notifications_sent)}"><i class="fa fa-coffee"></i><span class="label"> Notify</span></button>
				</div>
				<div class="divider"></div>
			</div>
		</div>

		<div class="support-box-wrap box-content2" ng-if="order.notes">
			<div class="support-box-wrap-header">
				<h1>Notes</h1>
				<div class="divider"></div>
			</div>
			<div class="no-box-content-color">
				<br>
				<p>{{order.notes}}</p>
			</div>
		</div>

		<div class="support-box-wrap box-content2" ng-show="order.campus_cash">
			<div class="support-box-wrap-header">
				<h1>Campus Cash <span ng-show="order.campus_cash_charged"> Already Charged</span></h1>
				<div class="divider"></div>
			</div>
			<div class="divider"></div>
			<div class="no-box-content-color">
				<div class="field-container">
					<div class="field-row" ng-show="order.campus_cash_charged && order.campus_cash_charged_info">
						<div class="field-key">{{order.campus_cash_charged_info.name}}</div>
						<div class="field-value">
							by {{order.campus_cash_charged_info.date}}
						</div>
					</div>
					<div class="field-row" ng-hide="order.campus_cash_charged && order.campus_cash_charged_info">
						<div class="field-key">
							Mark as already charged
						</div>
						<div class="field-value">
							<label class="switch-wrap">
								<input type="checkbox" ng-click="mark_cash_card_charged()" class="switch" ng-disabled="order.campus_cash_charged" ng-model="order.campus_cash_charged"/><div></div>
							</label>
						</div>
					</div>
				</div>
				<br>
				<div ng-hide="order.campus_cash_charged">
					<button class="button button-empty button-border button-blue" ng-click="campus_cash()">
						<i class="fa fa-credit-card" ng-show="!campus_cash_retrieving"></i>
						<i class="fa fa-spinner fa-pulse" ng-show="campus_cash_retrieving"></i>
						<span class="label">&nbsp;&nbsp;Show Student ID</span>
					</button>
					<br>
				</div>
				<br>
			</div>


			<div class="divider"></div>
		</div>

		<? /* delivery status */ ?>
		<div class="support-box-wrap box-content2" ng-if="order.status && order.delivery_service">
			<div class="support-box-wrap-header">
				<h1>Delivery Status</h1>
				<div class="support-box-header-actions-wrap">
					<div class="support-box-header-actions">
						<a href="" ng-click="changeOrderStatus()"><button class="button button-small button-empty button-green"><i class="fa fa-cog"></i>&nbsp;&nbsp;Update</button></a>
					</div>
				</div>
				<div class="divider"></div>
			</div>
			<div class="divider"></div>
			<div class="no-box-content-color" ng-if="order.actions.length">
				<table align="right" class="basic-table detail">
					<tr>
						<td class="topitem itemname">Driver / Status</td>
						<td class="topitem itemname" ng-if="!order.actions_today">Date</td>
						<td class="topitem order-contents-item-qty">Time</td>
					</tr>
					<tr ng-repeat="action in order.actions" title="{{action.note}}">
						<td class="fooditem dish-name" nowrap="">
							<span class="tag tag-red no-wrap" ng-if="action.type == 'delivery-text-5min'">5 min</span>
							<span class="tag tag-red no-wrap" ng-if="action.type == 'delivery-rejected'">Rejected</span>
							<span class="tag tag-black no-wrap" ng-if="action.type == 'delivery-canceled'">Canceled</span>
							<span class="tag tag-green no-wrap" ng-if="action.type == 'delivery-accepted'">Accepted</span>
							<span class="tag tag-blue no-wrap" ng-if="action.type == 'delivery-pickedup'">Pickedup</span>
							<span class="tag tag-purple no-wrap" ng-if="action.type == 'delivery-delivered'">Delivered</span>
							<span class="tag tag-green no-wrap" ng-if="action.type == 'force-commission-payment'">Force Commission</span>
							<br>
							<a href="/staff/{{action.admin.login}}">{{action.admin.name}}</a><br>
							<a href ng-click="callText(action.admin.phone)" class="listview-smaller">{{action.admin.phone | formatPhone}}</a>
						</td>
						<td class="fooditem dish-name" nowrap="nowrap" ng-if="!order.actions_today">
								{{action.date | convertimeformat:order.restaurant.timezone:'MMMM Do YYYY'}}
						</td>
						<td class="fooditem dish-name" nowrap="nowrap">
							<span ng-if="order.restaurant.timezone != account.user.timezone">
								{{action.date | convertimeformat:order.restaurant.timezone:'h:mm:ss a'}}
								&nbsp;(<span class="listview-bold">{{order.date | convertimeformat:order.restaurant.timezone:'z'}}</span>)
								<br>
							</span>
								{{action.date | convertimeformat:account.user.timezone:'h:mm:ss a'}}
							&nbsp;(<span class="listview-bold">{{order.date | convertimeformat:account.user.timezone:'z'}}</span>)
						</td>
					</tr>
					<tr><td>	</td></tr>
				</table>
			</div>
			<div class="divider"></div>
		</div>

		<? /* contents */ ?>
		<ng-include src="'/assets/view/orders-order-contents.html'"></ng-include>

		<? /* customer */ ?>
		<div class="support-box-wrap box-content2" ng-if="order.user.id_user">
			<div class="support-box-wrap-header">
				<h1>Customer #{{order.user.id_user}}</h1>
				<div class="support-box-header-actions-wrap">
					<div class="support-box-header-actions">
						<a href="/customer/edit/{{order.user.id_user}}"><button class="button button-small button-empty button-green"><i class="fa fa-pencil"></i>&nbsp;&nbsp;Edit</button></a>
						<a href="/customer/{{order.user.id_user}}"><button class="button button-small button-empty button-green"><i class="fa fa-eye"></i>&nbsp;&nbsp;View</button></a>
					</div>
				</div>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">
				<div class="field-container">
					<div class="field-row">
						<div class="field-key">Name</div>
						<div class="field-value">
							{{order.user.name}}
							<span ng-if="order.user.name != order.name">( ordered as <i>{{order.name}}</i> )</span>
						</div>
					</div>
					<div class="field-row">
						<div class="field-key">Phone</div>
						<div class="field-value"><a href ng-click="callText(order.user.phone)">{{order.user.phone | formatPhone}}</a></div>
					</div>
					<div class="field-row">
						<div class="field-key">Address</div>
						<div class="field-value"><a href ng-click="routeAddress(order.user.address)">{{order.user.address}}</a></div>
					</div>
				</div>
			</div>
		</div>

		<? /* restaurant */ ?>
		<div class="support-box-wrap box-content2" ng-if="order.restaurant.id_restaurant">
			<div class="support-box-wrap-header">
				<h1>Restaurant #{{order.restaurant.id_restaurant}}</h1>
				<div class="support-box-header-actions-wrap">
					<div class="support-box-header-actions">
						<a href="/restaurant/{{order.restaurant.id_restaurant}}"><button class="button button-small button-empty button-green"><i class="fa fa-eye"></i>&nbsp;&nbsp;View</button></a>
					</div>
				</div>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">
				<div class="field-container">
					<div class="field-row">
						<div class="field-key">Name</div>
						<div class="field-value">{{order.restaurant.name}}</div>
					</div>
					<div class="field-row">
						<div class="field-key">Phone</div>
						<div class="field-value"><a href ng-click="callText(order.restaurant.phone)">{{order.restaurant.phone | formatPhone}}</a></div>
					</div>
					<div class="field-row">
						<div class="field-key">Address</div>
						<div class="field-value"><a href ng-click="routeAddress(order.restaurant.address)">{{order.restaurant.address}}</a></div>
					</div>
				</div>
			</div>
		</div>

		<? /* driver */ ?>
		<div class="support-box-wrap box-content2" ng-if="order._driver_id">
			<div class="support-box-wrap-header">
				<h1>Driver #{{order._driver_id}}</h1>
				<div class="support-box-header-actions-wrap">
					<div class="support-box-header-actions">
						<a href="/staff/{{order._driver_id}}"><button class="button button-small button-empty button-green"><i class="fa fa-eye"></i>&nbsp;&nbsp;View</button></a>
					</div>
				</div>
				<div class="divider"></div>
			</div>

			<div class="no-box-content-color">
				<div class="field-container">
					<div class="field-row">
						<div class="field-key">Name</div>
						<div class="field-value">{{order._driver_name}}</div>
					</div>
					<div class="field-row">
						<div class="field-key">Phone</div>
						<div class="field-value"><a href ng-click="callText(order._driver_phone)">{{order._driver_phone | formatPhone}}</a></div>
					</div>
					<div class="field-row">
						<div class="field-key">Deliveries</div>
						<div class="field-value">&nbsp;{{order.driver.deliveries.length}}</div>
					</div>
					<div class="field-row">
						<div class="field-key">Shift ends in</div>
						<div class="field-value">
							<span ng-if="order.driver.working">{{order.driver.shift_ends/60/60 | formatPrice}} hours</span>
							<span ng-if="!order.driver.working">Shift ended</span>
						</div>
					</div>
					<div class="field-row" ng-if="order.status.status == 'accepted' || order.status.status == 'pickedup'">
						<div class="field-key">Distance</div>
						<div class="field-value">
							{{eta.distance | formatPrice}} miles
						</div>
					</div>
				</div>

			</div>
		</div>

	</div>

	<div class="support-box-wrap box-content2" ng-if="order._driver_id">
		<div class="support-box-wrap-header">
			<h1>Location</h1>
			<div class="support-box-header-actions">
				<span class="tag tag-red">BETA</span>
			</div>
			<div class="divider"></div>
		</div>
		<div ng-if="!order.driver.location" class="no-box-content-color">
			<br>
			<p>Driver isn't sharing location - you should probably contact them and ask them to</p>
		</div>
		<div ng-if="order.driver.location">
			<map center="false" zoom="12" class="maps-map" map-type-control="false" style="height: 230px;" options="{streetViewControl: false}">
				<traffic-layer ng-if="order.status.status != 'delivered'"></traffic-layer>
			</map>
		</div>
		<div class="divider"></div>


	</div>

</div>

<ng-include src="'/assets/view/orders-order-delivery-status-form.html'"></ng-include>
<ng-include src="'/assets/view/orders-send-text-drivers.html'"></ng-include>
