
<div class="row"
     x-data="order_page_settings">
    <div class="col-lg-12 m-b-10">
        <label class="mb-0 fs-13">{{__("Point Of Sale")}}</label>
        <select name="select_point_of_sale"
                id="select_point_of_sale"
                class="form-control-sm select2p fs-13 mb-0"
                x-model="point_of_sale_id">
            <template x-for="point_of_sale in $store.data_page.billing_desks ">
                <option :value="point_of_sale.id" x-text="point_of_sale.name"></option>
            </template>
        </select>
{{--        <small class="text-muted fs-11">{{__("Point de vente de facturation")}}</small>--}}
    </div>

    <div class="col-lg-12">
        <template x-if="{{getSettingsOf('check_stock_when_ordering_backend')}}">
            <div class="row">
                <div class="col-lg-12 m-b-10">
                    <label class="mb-0 fs-13">{{__("Warehouse Of Stock")}}</label>
                    <select name="select-store"
                            id="select-store"
                            class="form-control-sm select2s fs-13"
                            x-model="warehouse_id">
                        <template x-for="warehouse in $store.data_page.warehouses">
                            <option :value="warehouse.id" x-text="warehouse.name"></option>
                        </template>
                    </select>
{{--                    <small class="text-muted fs-11">{{__("Entrepôt das le quel le stock des produit est débité")}}</small>--}}
                </div>
                <div class="col-lg-12 m-b-10">
                    <div class="custom-control custom-switch-success custom-switch cursor-pointer">
                        <input type="checkbox"
                               x-model="filtered_products_when_warehouse_change"
                               class="custom-control-input cursor-pointer"
                               id="switch-filtered_products_when_warehouse_change">
                        <label class="custom-control-label fs-14 cursor-pointer ms-t-5"
                               for="switch-filtered_products_when_warehouse_change">
                            {{__("Filtered when warehouse change")}}
                        </label>
{{--                        <small class="text-muted fs-11">{{__("Determine si les produits doivent etre filtré en fonction de l'entrepot selectionné")}}</small>--}}
                    </div>
                </div>
            </div>
        </template>
    </div>

</div>


@push('js')

    <script>
        document.addEventListener("alpine:init", e=> {

            Alpine.data('order_page_settings',()=>({

                init (){
                    const alpine = this;

                    alpine.billing_desk_id = alpine.$store.cart.content.billing_desk?.id ?? null;
                    alpine.warehouse_id = alpine.$store.cart.content.warehouse?.id ?? null;

                    console.log("pos = "+alpine.billing_desk_id)
                    console.log("store = "+alpine.warehouse_id)

                    alpine.$watch("warehouse_id" , (value) => {
                        alpine.changeWarehouse(value)
                    });

                    alpine.$watch("billing_desk_id" , (value) => {
                        alpine.changeBillingDesk(value)
                    });
                },

                // warehouse_id : null,
                // point_of_sale_id : null,
                filtered_products_when_warehouse_change : true,

                changeBillingDesk(value){
                    const pos = this.$store.data_page.billing_desks.find(p => p.id.toString() === value.toString());
                    this.$dispatch('cart.order.pos.selected', pos);
                },

                changeWarehouse(value){
                    const warehouse = this.$store.data_page.warehouses.find(w => w.id.toString() === value.toString());

                    if (this.filtered_products_when_warehouse_change){
                        let products_ids = this.$store.data_page.stocks.filter(s=> s.warehouse_id.toString() === value.toString());
                        products_ids = pluck(products_ids,"product_id")
                        this.$store.data_page.products = this.$store.data_page.products.filter(p => products_ids.indexOf(p.id) > -1);
                        // console.log(products_ids,alpine.$store.data_page.products.length)
                    }
                    this.$dispatch('cart.order.warehouse.selected', warehouse);
                }
            }));
        })
    </script>

@endpush
