
<div class="row">
    <div class="col-lg-12 form-group">
        <div class="row m-b-5" >
            <div class="col">
                <div class="float-left">
                    <div class="m-b-1">
                        <img src="{{url("img/logo-bw.png")}}" alt="Owner Logo" style="height: 50px; width:150px;">
                    </div>
                </div>
            </div>
        </div>

        <div class="row m-b-10">
            <div class="col-6">
                <div class="float-left">
                    <div class="fs-12 order-head-info text-uppercasezz">{{__("Billing Desk")}} :
                        <strong class="cursor-pointer text-blue text-underline"
                                @click="changeOrderSetting($el,{
                                               fields : ['billing_desk_id'],
                                               message : '{{__('Change Billing Desk')}}',
                                               mode : 'set-billing-desk',
                                               })">
                            <span  x-text="billing_desk?.name ?? '---'"></span>
                            <span class="fa fa-pencil"></span>
                        </strong>
                    </div>
                    @if(getSettingsOf("check_stock_when_ordering_backend"))
                        <div class="fs-12 order-head-info text-uppercasezz">{{__("Warehouse Of Stock")}} :
                            <strong class="cursor-pointer text-blue text-underline"
                                    @click="changeOrderSetting($el,{
                                               fields : ['warehouse_id'],
                                               message : '{{__('Change Warehouse Of Stock')}}',
                                               mode : 'set-warehouse',
                                               })">
                                <span  x-text="warehouse?.name ?? '---'"></span>
                                <span class="fa fa-pencil"></span>
                            </strong>
                        </div>
                    @endif
                    <div class="fs-12 order-head-info text-uppercasezz">{{__("Cashier")}} : <strong x-text="order.admin.full_name"></strong></div>
                </div>
            </div>

            <div class="col-6" x-data="block_customers">
               <div class="float-right">
                   <div class="row">
                       <div class="col-lg-12">
                           <h6 class="m-b-1 fs-13">
                               <strong class="float-left">{{__("Customer")}}</strong>
                               <span class="float-right">
                                    <button class="btn btn-outline-success btn-sm p-s1 fs-12"
                                            style="height: 20px; padding-top: 1px;"
                                            @click="addCustomer">
                                        <i class="fa fa-user-plus  fs-10"></i>
                                    </button>
                                   <template x-if="$store.cart.customer && !active">
                                       <button class="btn btn-outline-primary p-s1 fs-12"
                                               style="height: 20px; padding-top: 1px;"
                                               @click="selectCustomer(null); active = true">
                                           <i class="fa fa-pencil fs-10"></i>
                                        </button>
                                   </template>
                                </span>
                           </h6>
                       </div>
                       <div class="col-lg-12">
                           @include("backend.orders.create.blocs.customer1")
                       </div>
                   </div>
               </div>

            </div>

{{--            <template x-if="filled(customer)">--}}
{{--                <div class="col-6">--}}
{{--                    <div class="m-b-2d float-right" >--}}
{{--                        <h6 class="m-b-1 fs-13"><strong>{{__("Customer Infos")}}</strong></h6>--}}
{{--                        <div class="fs-11 order-head-info">{{__("Full Name ")}} : <strong x-text="customer.full_name ?? '---'"></strong></div>--}}
{{--                        <div class="fs-11 order-head-info">{{__('Email')}} : <strong x-text="customer.email ?? '---'"></strong></div>--}}
{{--                        <div class="fs-11 order-head-info">{{__('Phone')}} : <strong x-text="customer.phone ?? '---'"></strong></div>--}}
{{--                        <div>Address : <strong x-text="$store.cart.customer.full_default_address"></strong></div>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </template>--}}
        </div>

          <div class="row m-b-10">
              <div class="col-lg-12">
                  <table class="table table-borderesd table-condensed" id="table-cart" style="width: 100%">
                      <thead>
                          <tr>
                              <th class="left fs-12">{{__("Product")}}</th>
                              <th class="right fs-12">{{__("Price")}}</th>
                              <th class="right fs-12">{{__("Amount")}}</th>
                              <template x-if="editable">
                                  <th class="right fs-12 d-print-none" width="2%">---</th>
                              </template>
                          </tr>
                      </thead>
                      <tbody>
                      <template x-for="(item,index) in items" :key="index">
                          <tr class="fs-12">
                              <template x-if="editable">
                                  <td class="fs-12">
                                            <span>
                                                <span x-text="formatNumber(item.qty)"></span>
                                                <span> x </span>
                                                <span class="text-uppercase" x-text="item.name"></span>
                                            </span>
                                      <template x-if="editable">
                                                <span class="text-success text-underline cursor-pointer float-right"
                                                      @click="updateQty($el,item)">
                                                    <span class="fa fa-pencil"></span>
                                                </span>
                                      </template>
                                  </td>
                              </template>
                              <template x-if="!editable">
                                  <td class="fs-12">
                                            <span class="text-black">
                                                <span x-text="formatNumber(item.qty)"></span>
                                                <span> x </span>
                                                <span class="text-uppercase" x-text="item.name"></span>
                                            </span>
                                  </td>
                              </template>

                              <td class="fs-12 right"> <span x-text="formatNumber(item.price)"></span></td>
                              <td class="fs-12 right">
                                  <span x-text="formatNumber(item.amount)"></span>
                              </td>
                              <template x-if="editable">
                                  <td class="fs-12 right d-print-none">
                                      <div class="pull-right">
                                          <small class="text-danger btn btn-sm"
                                                 @click="deleteItem(item)">
                                              <i class="fa fa-times"></i>
                                          </small>
                                      </div>
                                  </td>
                              </template>
                          </tr>
                      </template>
                          <template x-if="!count">
                              <tr>
                                  <td colspan="4" class="center">
                                      <x-not-found>
                                          <x-slot name="title">{{__("No Item in order.")}}</x-slot>
                                          <template x-if="stored_in_cart">
                                              <x-slot name="desc">
                                                  <p>{{__("For add product in order, you may to click on any item in products list")}}</p>
                                              </x-slot>
                                          </template>
                                      </x-not-found>
                                  </td>
                              </tr>
                          </template>
                      </tbody>
                  </table>
                  <template x-if="count">
                      <table class="table">
                          <thead>
                              <template x-for="total in Object.values(allTotal)">
                                  <template x-if="total.visible">
                                      <tr>
                                          <th :class="total.className" class="left" x-text="total.label"></th>
                                          <th :class="total.className" class="right" x-text="formatNumber(arround(total.value,2),currency)"></th>
                                      </tr>
                                  </template>
                              </template>
                          </thead>
                      </table>
                  </template>

              </div>
          </div>
        <template x-if="count">
            <div class="row m-b-10" >
                <div class="col-lg-12 m-b-10 d-print-none">
                    <div class="p-2 d-flex justify-content-between  border border-dark rounded-sm ">
                        <div class="custom-control custom-switch cursor-pointer">
                            <input type="checkbox"
                                   x-model="order.config.payment_required"
                                   :disabled="(!editable || !payable)"
                                   class="custom-control-input cursor-pointer"
                                   id="switch-payment-required">
                            <label class="custom-control-label fs-14 cursor-pointer"
                                   for="switch-payment-required">
                                <span>
                                    {{__("Payment")}}
                                </span>
                                <template x-if="!payable">
                                    <strong class="m-l-2 text-red fs-9">[{{__("BLOCKED")}}]</strong>
                                </template>
                            </label>
                        </div>

                        <div class="custom-control custom-switch cursor-pointer">
                            <input type="checkbox"
                                   x-model="order.config.uses_order_setting"
                                   :disabled="!editable"
                                   class="custom-control-input cursor-pointer"
                                   id="switch-uses-order-setting">
                            <label class="custom-control-label fs-14 cursor-pointer"
                                   for="switch-uses-order-setting">{{__("Setting Order")}}</label>
                        </div>

                        <div class="custom-control custom-switch cursor-pointer">
                            <input type="checkbox"
                                   x-model="order.config.is_draft"
                                   :disabled="!editable"
                                   class="custom-control-input cursor-pointer"
                                   id="switch-order-is-draft">
                            <label class="custom-control-label fs-14 cursor-pointer"
                                   for="switch-order-is-draft">{{__("Draft")}}</label>
                        </div>
                    </div>
                </div>

                <div class="col-lg-12 m-b-10 d-print-none">
                    <template x-if="payable && order.config?.payment_required">
                        <div class="row">
                            <template x-for="(type,index) in payment_types" :key="index">
                                <div class="col col-sm-69 col-lg-3o col-xs-6p m-b-5" >
                                    <div class="cursor-pointer p-2 btn-select-payment-method"
                                         :class = "type.code === payment_type_selected ? 'active' : ''">
                                        <div class="row">
                                            <div class="col-12">
                                                <div class="row">
                                                    <div class="col">
                                                        <div class="custom-control custom-radio mr-sm-1 cursor-pointer">
                                                            <input type="radio"
                                                                   x-model="payment_type_selected"
                                                                   :value="type.code"
                                                                   :disabled="type.disabled"
                                                                   class="custom-control-input"
                                                                   :id="'radio-'+index" />
                                                            <label class="custom-control-label fs-12 cursor-pointer"
                                                                   :for="'radio-'+index">
                                                            </label>

                                                        </div>
                                                    </div>
                                                    <div class="col">
                                                        <template x-if="type.disabled">
                                                            <marquee>
                                                                <div class="text-blue fs-10">{{__('Comming Soon')}}</div>
                                                            </marquee>
                                                        </template>
                                                    </div>
                                                </div>

                                            </div>
                                            <div class="col-12">
                                              <div class="float-right">
                                                  <center>
                                                      <div class="fs-25  type-icon m-b-1" :class="type.icon"></div>
                                                      <div class="fs-11 type-name m-b-0" x-text="type.name"></div>
                                                  </center>
                                              </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </template>
                        </div>
                    </template>
                </div>

                <div class="col-lg-12 m-b-10 d-print-none">
                    <template x-if="count && filled(customer)">
                        <div class="col-lg-12s d-print-none">
                            <div class="row">
                                <template x-if="payable && order.config?.payment_required">
                                    <div class="form-group"
                                         x-data="{get visible() { return (config.is_draft && savable)}}"
                                         :class="visible ? 'col-lg-12 col-sm-12' : 'col-lg-12 col-sm-12'">
                                        <button class="btn btn-success rounded-sm btn-block text-uppercase btn-action-action-order"
                                                :disabled="!payment_type_selected"
                                                @click="await payOrder()">
                                            <span x-text="uses_manual_payment ? '{{__("Create Payment")}}' : '{{__("Process to Pay")}}'"></span>
                                            <i class="m-l-2 fa fa-money-bill-alt"></i>
                                        </button>
                                    </div>
                                </template>
{{--                                <h2 x-text="savable"></h2>--}}
{{--                                <h2 x-text="payable"></h2>--}}
{{--                                <h2 x-text="order.config.payment_required"></h2>--}}
                                <template x-if="(savable) && (!payable || !order.config.payment_required)">
                                    <div class="form-group"
                                         x-data="{get visible() { return (config.is_draft && savable)}}"
                                         :class="visible ? 'col-lg-12 col-sm-12' : 'col-lg-12 col-sm-12'">
                                        <button  class="btn btn-success rounded-sm btn-block text-uppercase btn-action-action-order"
                                                 @click="saveOrder()">
                                            {{__("Save Order")}}
                                            <i class="m-l-2 fa fa-send-o"></i>
                                        </button>
                                    </div>
                                </template>

                                <template  x-if="config.is_draft && savable">
                                    <div class="form-group"
                                         x-data="{get visible() { return ( ( (savable || !payable) && !order.config.payment_required) || (order.config?.payment_required))}}"
                                         :class="visible ? 'col-lg-12 col-sm-12' : 'col-lg-12 col-sm-12'">
                                        <button  class="btn btn-dark rounded-sm btn-block text-uppercase btn-action-action-order"
                                                 x-transition
                                                 @click="copyToDraft">
                                            {{__("Copy to Draft")}}
                                            <i class="m-l-2 fa fa-archway"></i>
                                        </button>
                                    </div>
                                </template>
                                <div class="col-lg-12 col-sm-12 form-group">

                                </div>
                            </div>
                        </div>
                    </template>
                </div>
            </div>
        </template>
    </div>
</div>







