

<div class="card block" x-data="order_details($store.cart.content)">
    <div class="card-body p-2">
        <div class="col-lg-12 form-group">
            <h4 class="block-title">

                <span class="float-left">
                    <i class="fa fa-shopping-cart text-success"></i>
                   {{__("Cart")}}
                </span>

                <span class="float-right">
                    <template x-if="$store.cart.count > 0">
                      <span class="badge fs-10 m-l-2 badge-danger" x-text="formatNumber($store.cart.count)"></span>
                   </template>
                </span>
            </h4>
        </div>


        <div class="col-lg-12">
            <div class="row" x-data="order_displayed">
                <template x-if="visible">
                    <div class="cards" x-show="true" x-transition >
                        <div class="col-lg-12 m-b-20">
                            <div class="float-right">
                                <button type="button" class="ml-2 mb-1 close btn btn-smz rounded-pill"
                                        @click="closeDisplayedOrder"
                                        aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                        </div>
                        <div class="col-lg-12" id="block-display-draft-item">
                            <div x-data="order_details(order_disp,{storage:'draft',editable : false})">
                                @include("backend.orders.create.blocs.order.order-details")
                            </div>
                        </div>
                    </div>
                </template>

                <template x-if="!visible">
                   <div>
                       @include('backend.orders.create.blocs.order.order-details')
                   </div>
                </template>
            </div>

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

@push("js")
    <script>

        document.addEventListener('alpine:init', () => {

            Alpine.data("switch",() => ({
                is_checked : true,
            }));


            Alpine.store('cart', {
                init (){
                   const content = this.content ;

                   // Par defaut le panier est ce qui se trouve dans le localStorage
                   if(content){
                        if ("customer" in content)  this.customer = content.customer;
                        if ("allTotal" in content)   this.allTotal = content.allTotal ;
                        if ("config" in content)   this.config = content.config ;
                        if ("items" in content)   this.items = content.items ;
                        if ("reference" in content)   this.ref = content.ref ;
                        if ("point_of_sale" in content)   this.point_of_sale = content.point_of_sale ;
                        if ("warehouse" in content)   this.warehouse = content.warehouse ;
                        if ("admin" in content)   this.admin = content.admin ;
                   }

                    const alpine = this;

                },

                customer : null,
                point_of_sale : null,
                warehouse : null,
                ref : null,
                admin : @json($admin),
                items :  [],
                config: {},
                allTotal: {},

                get count () {
                    return this.items.length
                }  ,

                get content  () {
                    return JSON.parse(localStorage.getItem("CART")) ?? {};
                },
                setCart ( cart = {}){
                    localStorage.setItem("CART",JSON.stringify(cart))

                    if ("customer" in cart)  this.customer = cart.customer;
                    if ("allTotal" in cart)   this.allTotal = cart.allTotal ;
                    if ("config" in cart)   this.config = cart.config ;
                    if ("items" in cart)   this.items = cart.items ;
                    if ("billing_desk" in cart)   this.billing_desk = cart.billing_desk ;
                    if ("warehouse" in cart)   this.warehouse = cart.warehouse ;

                    console.log(cart)
                },
            });


        });
    </script>
@endpush
