<div class="b-cart" >
	<div class="container"  ng-controller="orderCtrl" ng-init="initOrder()">
		<div class="row b-info-restaurant" ng-include="'views/part/info-restaurant.html?ver=4'"></div>

		<div class="row title-cart"  ng-show="CartInfo.ResultCount != '0'" ng-hide="orderEnd">
			<div class="col-xs-12 text-center">
				<h1 class="title">{{getLocale('Drawing up of an order')}}</h1>
			</div>
		</div>

		<div class="row"  ng-show="CartInfo.ResultCount != '0' && noDelivery">
			<div class="col-xs-12 text-center">
				<p class="title">{{getLocale('Amounts not enough to order')}} </p><br />
				<a ng-href="#/cart" class="btn">{{getLocale('Back to cart')}}</a>
			</div>
		</div>

		<div class="row" ng-show="orderProcess">
			<div class="col-xs-12">
				<div class="b-load m-load-catalog text-center" >
					<div class="load-circle"></div>
					<p>{{getLocale('Save order')}}</p>
				</div>
			</div>
		</div>

		<form class="row b-page-form" name="finalOrderForm" action="#" ng-hide="orderEnd || orderProcess || noDelivery" novalidate >
			<div class="col-xs-12">
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="firstName">{{getLocale('First name')}}<span class="star">*</span></label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<input id="firstName" type="text" name="firstName" class="h-full-width h-input" ng-class="{ 'error-field': finalOrderForm.firstName.$invalid && formValidCheck }" ng-model="finalOrder.firstName" required />
							<p class="error-message error-message-field" ng-show="finalOrderForm.firstName.$invalid && formValidCheck">{{getLocale('Error. Empty field')}}</p>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="lastName">{{getLocale('Last name')}}<span class="star">*</span></label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<input id="lastName" type="text" name="lastName" class="h-full-width h-input" ng-class="{ 'error-field': finalOrderForm.lastName.$invalid && formValidCheck }" ng-model="finalOrder.lastName" required />
							<p class="error-message error-message-field" ng-show="finalOrderForm.lastName.$invalid && formValidCheck">{{getLocale('Error. Empty field')}}</p>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="phone">{{getLocale('Phone')}}<span class="star">*</span></label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<input id="phone" type="text" name="phone" class="h-full-width h-input"
								   ng-class="{ 'error-field': finalOrderForm.phone.$invalid && formValidCheck }" ng-model="finalOrder.phone" required
								   mask="{{ maskPhone }}" restrict="reject"  />
							<div ng-show="finalOrderForm.phone.$invalid && formValidCheck">
								<p class="error-message error-message-field" ng-show="finalOrder.phone.length == 0">{{getLocale('Error. Empty field')}}</p>
								<p class="error-message error-message-field" ng-show="finalOrder.phone.length != 0 && finalOrderForm.phone.$invalid">{{getLocale('Error. Phone no valid')}}</p>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="email">{{getLocale('Email')}}<span class="star">*</span></label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<input id="email" type="email" pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$" name="email" class="h-full-width h-input" ng-class="{ 'error-field': finalOrderForm.email.$invalid && formValidCheck }" ng-model="finalOrder.email" required />
							<div ng-show="finalOrderForm.email.$invalid && formValidCheck">
								<p class="error-message error-message-field" ng-show="finalOrder.email.length == 0 || finalOrder.email == ''">{{getLocale('Error. Empty field')}}</p>
								<p class="error-message error-message-field" ng-show="finalOrder.email.length != 0 && finalOrderForm.email.$error.pattern">{{getLocale('Error. Email no valid')}}</p>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label>{{getLocale('Payment')}} </label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<div class="radio-item-row">
								<input type="radio" id="payment-cash"  ng-model="finalOrder.payment" name="Payment" value="0" checked />
								<label for="payment-cash">{{getLocale('Cash')}}</label>
							</div>
							<div class="radio-item-row">
								<input type="radio" id="payment-cart-courier"  ng-model="finalOrder.payment" name="Payment" value="1" />
								<label for="payment-cart-courier">{{getLocale('Bank card')}}</label>
							</div>
							<div class="radio-item-row">
								<input type="radio" id="payment-online"  ng-model="finalOrder.payment" name="Payment" value="2" />
								<label for="payment-online">{{getLocale('Pay now online')}}</label>
							</div>
						</div>
					</div>
				</div>
				<!--<div class="row" ng-show="finalOrder.payment == 2 && PaySystem.length">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label>{{getLocale('Payment system')}} </label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<div class="radio-item-row" ng-repeat="item in PaySystem">
								<input type="radio" id="{{ item.id }}"  ng-model="finalOrder.paymentSystem" name="paymentSystem" value="{{ $index  }}"  />
								<label for="{{ item.id }}">
									<img ng-src="assets/img/{{ item.id }}-logo.png" alt="{{ getLocale(item.id) }}" />
								</label>
							</div>
						</div>
					</div>
				</div>-->

				<div class="row" ng-show="finalOrder.payment == '0'">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="short-change">{{getLocale('Short change')}}, {{ Currency | lowercase }}.</label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<!--<input type="text" ng-model="finalOrder.shortChange"  mask='9' mask-repeat='6' validate="false" restrict="reject" ui-hide-group-sep />-->

							<select id="short-change" class="h-full-width h-input" ng-model="finalOrder.shortChange" >
								<option value=""></option>
								<option value="{{item}}" ng-repeat="item in shortChangeArray">{{ item }}</option>
							</select>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="type-delivery">{{getLocale('Type delivery')}}</label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<input id="type-delivery" type="text" class="h-full-width h-readonly h-input"  ng-model="finalOrder.typeDelivery"  readonly />
						</div>
					</div>
				</div>
				<div class="row" ng-if="UserInfo.typeDelivery == 'delivery'">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="address-delivery">{{getLocale('Address delivery')}}</label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<textarea id="address-delivery" style="resize: none" class="h-full-width h-readonly h-input" ng-model="finalOrder.addressDelivery" readonly></textarea>
						</div>
					</div>
				</div>
				<div class="row" ng-if="UserInfo.typeDelivery == 'restaurant'">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label for="address-restaurant">{{getLocale('Address restaurant')}}</label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<input id="address-restaurant" type="text" class="h-full-width h-input h-readonly" ng-model="finalOrder.addressRestaurant" readonly />
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label ng-if="UserInfo.typeDelivery == 'delivery'">{{getLocale('Time delivery')}}</label>
							<label ng-if="UserInfo.typeDelivery == 'restaurant'">{{getLocale('Time for self-delivery')}}</label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<div class="radio-item">
								<input type="radio" id="timeDelivery1"  ng-model="finalOrder.timeDelivery" name="timeDelivery" value="now" checked />
								<label for="timeDelivery1">{{getLocale('In the near future')}}</label>
							</div>
							<div class="radio-item">
								<input type="radio" id="timeDelivery2"  ng-model="finalOrder.timeDelivery" ng-change="showSelectTime()" name="timeDelivery" value="select" />
								<label for="timeDelivery2">{{getLocale('Show time')}}</label>
							</div>
							<div class="radio-item"  ng-show="finalOrder.timeDelivery == 'select'">
								<select ng-model="finalOrder.timeDeliveryHour" >
									<option value=""></option>
									<option value="{{time.value}}" ng-repeat="time in deliveryAllHours" ng-disabled="time.disabled">{{time.value}}</option>
								</select>
							</div>
							<div class="radio-item"  ng-show="finalOrder.timeDelivery == 'select'">
								<select ng-model="finalOrder.timeDeliveryMinutes">
									<option value="00">00</option>
									<option value="30">30</option>
								</select>
							</div>
						</div>
					</div>
				</div>

				<div class="row" >
					<div class="col-sm-4 text-right">
						<div class="form-group">
							<label>{{getLocale('Comment to the order')}}</label>
						</div>
					</div>
					<div class="col-sm-6">
						<div class="form-group">
							<textarea ng-model="finalOrder.comment" class="h-full-width text-area h-input"></textarea>
						</div>
					</div>
				</div>
				<div class="row" >
					<div class="col-sm-6 col-sm-offset-4 wrapper-check-rules">
						<div class="form-group">
							<input id="rules" name="rules" type="checkbox" ng-model="finalOrder.rules" required  />
							<label for="rules">{{getLocale('I agree with the user agreement')}}</label><br />
							<a href="javascript: void(0);" class="show-rules" ng-click="showRules()">{{getLocale('Show user agreement')}}</a>
						</div>
						<p class="error-message" ng-show="finalOrderForm.rules.$invalid && formValidCheck">
							{{getLocale('Terms of Service Not accepted')}}
						</p>
					</div>
				</div>
				<div class="row" ng-show="formValidCheck && finalOrderForm.$invalid">
					<div class="col-sm-6 col-sm-offset-4 col-xs-12 ">
						<p class="error-message">{{ getLocale('Errors when filling in the form') }}</p>
					</div>
				</div>
				<div class="row" >
					<div class="col-sm-3 col-sm-offset-2 col-xs-6 wrapper-buttons-order">
						<a ng-href="#/cart" class="btn">{{getLocale('Back to cart')}}</a>
					</div>
					<div class="col-sm-3 text-right col-xs-4 wrapper-buttons-order">
						<a href="javascript: void(0);" ng-click="calcOrder()"
						   ng-class="{'disabled-btn': !finalOrderForm.$valid }" class="btn btn-green">
							{{getLocale('Calculate order')}}
						</a>
					</div>
					<div class="col-sm-3 text-right col-xs-6 wrapper-buttons-order">
						<a href="javascript: void(0);" ng-click="saveOrder()"
						   ng-class="{'disabled-btn': !finalOrderForm.$valid }" class="btn btn-green">
							{{getLocale('Finalize order')}}
						</a>
					</div>
				</div>
			</div>
		</form>


		<div class="modal modal-danger b-modal show m-modal-rules" ng-show="showRulesSwitch"  >
			<div class="modal-dialog">
				<div class="modal-content item-table">
					<div class="item-row wrapper-modal-header">
						<div class="modal-header">
							<button type="button" class="close" ng-click="showRulesSwitch = false" aria-label="Close"><span aria-hidden="true">×</span></button>
							<h4 class="modal-title">{{getLocale('User agreement')}}</h4>
						</div>
					</div>
					<div class="modal-body item-row">
						<div class="wrapper-body item-cell">
							<div class="wrapper-scroll" ng-bind-html="sce.trustAsHtml(resultAgreement)">
								{{ resultAgreement }}
							</div>
						</div>
					</div>
					<div class="item-row wrapper-modal-footer">
						<div class="modal-footer">
							<button type="button" class="btn btn-outline pull-right" ng-click="showRulesSwitch = false">{{getLocale('Close')}}</button>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="row" ng-show="UserInfo.restaurantInfo.status == 'Inactive' && isActiveDelivery()">
			<div class="col-sm-8 col-sm-offset-2 text-center">
				<div class="success-message">
					<p class="text">{{ getLocale('Restaurant service is not active') }}</p>
					<a class="more-order" ng-href="#/catalog">{{ getLocale('Back to catalog') }}</a>
				</div>
			</div>
		</div>
		<div class="row" ng-show="!isActiveDelivery() && UserInfo.restaurantInfo.status == 'Active'">
			<div class="col-sm-8 col-sm-offset-2 text-center">
				<div class="success-message">
					<p class="text">{{ getLocale('Delivery is not working now') }}</p>
					<a class="more-order" ng-href="#/catalog">{{ getLocale('Back to catalog') }}</a>
				</div>
			</div>
		</div>

		<div class="row" ng-show="orderEnd && statusRequest == 'Ok'">
			<div class="col-sm-8 col-sm-offset-2 text-center">
				<div class="success-message">
					<p class="text success text-title">{{ getLocale('Order successfully issued') }}</p>

					<p class="text">{{ getLocale('Order number') }} <span class="number">№ {{ paramOrder.numberOrder }}</span></p>
					<p ng-if="UserInfo.typeDelivery == 'delivery' && paramOrder.travel_time" class="text">{{ getLocale('Delivery time') }}: <span class="number"> {{ paramOrder.travel_time }} {{ getLocale('min.') }}</span></p>
					<p ng-if="UserInfo.typeDelivery == 'delivery' && paramOrder.addressDelivery" class="text">{{ getLocale('Delivery address') }}: <span class="number"> {{ paramOrder.addressDelivery }}</span></p>
					<p ng-if="paramOrder.rest_phone" class="text">{{ getLocale('Restaurant Phone') }}: <span class="number"> {{ paramOrder.rest_phone }}</span></p>

					<div class="wrapper-price">
						<p class="text" ng-if="paramOrder.resultSum && paramOrder.resultSum != paramOrder.resultSumOrder">{{ getLocale('Order cost') }}: {{ paramOrder.resultSum | filterPrice | filterNumeric }} {{ Currency }} </p>
						<p class="text" ng-if="paramOrder.discountSumOrder">{{ getLocale('Discount') }}: {{ paramOrder.discountSumOrder | filterPrice | filterNumeric }} {{ Currency }}</p>
						<p class="text" ng-if="UserInfo.restaurantInfo.delivery_price && orderType">{{ getLocale('Delivery costs') }}: {{ UserInfo.restaurantInfo.delivery_price | filterNumeric }} {{ Currency }}</p>
						<p class="text" ng-if="paramOrder.resultSumOrder">{{ getLocale('Total price') }}: {{ paramOrder.resultSumOrder | filterPrice | filterNumeric }} {{ Currency }}</p>
					</div>

					<p class="text" ng-hide="finalOrder.payment == 2"><a class="more-order" ng-href="#/">{{ getLocale('Order more') }}</a></p>

					<div class="pay-online" ng-show="finalOrder.payment == 2" >
						<p class="text-center title-top">{{ getLocale('Send test query') }}</p>

						<p class="text-center warning">{{ getLocale('Warning test pay') }}</p>
						<div class="payment-text-wrapper">
							<div ng-repeat="item in payments" class="payment-test">
								<div class="row" >
									<div class="col-sm-4 text-right">
										<div class="form-group">
											<label for="currency-{{$index}}">{{ getLocale('Currency ID') }}</label>
										</div>
									</div>

									<div class="col-sm-6">
										<div class="form-group">
											<select ng-model="payments[$index].currency_id"  id="currency-{{$index}}" class="h-full-width h-input" ng-if="currencyAll.length" ng-change="currencyChange($index)">
												<option value=""></option>
												<option value="{{ currencyItem.curid }}" ng-repeat="currencyItem in currencyAll">{{ currencyItem.name }} ({{ currencyItem.curid }})</option>
											</select>
											<input ng-model="payments[$index].currency_id"  id="currency-{{$index}}" class="h-full-width h-input" ng-if="!currencyAll.length" />
										</div>
									</div>
									<div class="col-sm-2">
										<a class="btn btn-success" ng-if="$index > 0" ng-click="deleteTestPay($index)">Удалить</a>
									</div>
								</div>

								<div class="row">
									<div class="col-sm-4 text-right">
										<div class="form-group">
											<label for="extpay-{{$index}}">{{ getLocale('Extpay ID') }}</label>
										</div>
									</div>
									<div class="col-sm-6">
										<div class="form-group">
											<input id="extpay-{{$index}}" type="text" class="h-full-width  h-input" ng-model="payments[$index].extpay_id"  />
										</div>
									</div>
								</div>

								<div class="row">
									<div class="col-sm-4 text-right">
										<div class="form-group">
											<label for="amount-{{$index}}">{{ getLocale('Amount') }}</label>
										</div>
									</div>
									<div class="col-sm-6">
										<div class="form-group">
											<input id="amount-{{$index}}" type="text" class="h-full-width  h-input" ng-model="payments[$index].amount"  />
										</div>
									</div>
								</div>

								<div class="row">
									<div class="col-sm-4 text-right">
										<div class="form-group">
											<label for="promised-{{$index}}">{{ getLocale('TypeAmount') }}</label>
										</div>
									</div>
									<div class="col-sm-6">
										<div class="form-group">
											<select ng-model="payments[$index].promised"  id="promised-{{$index}}" class="h-full-width h-input">
												<option value="false">{{ getLocale('Prepay') }}</option>
												<option value="true">{{ getLocale('Promised') }}</option>
											</select>
										</div>
									</div>
								</div>

							</div>
						</div>
						<div class="row">
							<div class="col-sm-6 col-sm-offset-4 text-left">
								<a class="btn" ng-click="addPayTest()">Добавить еще</a>
								<a class="btn btn-success" ng-click="paySendTest()">Отправить</a>
							</div>
						</div>
						<div class="message">
							<div class="error" ng-show="textErrorPay">
								<p>Ошибка</p>
								<div>{{ textErrorPay }}</div>
							</div>
							<div class="success" ng-show="textSuccessPay">
								<p>Успешно отправлено</p>
							</div>
							<div  ng-show="textPay">
								<p>{{textPay}}...</p>
							</div>
						</div>
					</div>


					<!--<div class="b-go-pay" ng-show="onlinePay.type == 'ASSIST'">
						<form dynamic-form-action="onlinePay.urlAction" action="" method="post">
							<input type="hidden" name="Merchant_ID" value="{{ onlinePay.merchantId }}" />
							<input type="hidden" name="OrderNumber" value="{{ onlinePay.orderNumber }}" />

							<input type="hidden" name="OrderAmount" value="{{ onlinePay.resultSumOrder }}" />
							<input type="hidden" name="OrderCurrency" value="{{ onlinePay.currency }}" />

							<input type="hidden" name="FirstName" value="{{ finalOrder.firstName }}" />
							<input type="hidden" name="LastName" value="{{ finalOrder.lastName }}" />
							<input type="hidden" name="Email" value="{{ finalOrder.email }}" />
							<input type="hidden" name="MobilePhone" value="{{ finalOrder.phone }}" />
							<input type="hidden" name="URL_RETURN_OK" value="{{ onlinePay.urlReturnSuccess }}" />
							<input type="hidden" name="URL_RETURN_NO" value="{{ onlinePay.urlReturnError }}" />

							<input type="submit" class="btn btn-green" value="{{getLocale('Pay now')}}">
						</form>
					</div>-->
				</div>
			</div>
		</div>
		<div class="row" ng-show="orderEnd && statusRequest == 'Err'">
			<div class="col-sm-8 col-sm-offset-2 text-center">
				<div class="error-message-block">
					<p class="text title">{{ getLocale('An error occurred while processing the order') }}</p>
					<p class="text desc">{{ getLocale('Contact your administrator or try again later') }}</p>
					<p class="text">{{ getLocale('Code error') }}: <b>{{ codeError }}</b></p>
					<p class="text">{{ textError }}</p>
					<p class="text">{{ detailsError }}</p>
					<a class="more-order" ng-href="#/cart">{{ getLocale('Back to cart') }}</a>
				</div>
			</div>
		</div>


		<p class="status-order" ng-if="statusOrder">{{ getLocale('Status order') }}: <span class="big">{{ statusOrder }}</span></p>

		<div class="row hidden-map" ng-class="{ 'show-map': showMap }">
			<p class="error-get-coord" ng-if="statusCourierCoord == 'error' && showDetailError">{{ getLocale('Error for get coordinates') }}</p>

			<div class="col-sm-8 col-sm-offset-2">
				<p class="map-title text-center">{{getLocale('Courier location on the map')}}</p>
				<div id="map" class="b-map support-load"></div>
			</div>
		</div>
	</div>
</div>
