@extends("agentportal.layouts.layout")

@section("title", trans("message_lang.LBL_OPERATOR_DETAILS"))

@section("content")
<div class="content d-flex flex-column flex-column-fluid" id="kt_content">
    <!--begin::Entry-->
    <div class="d-flex flex-column-fluid">
        <!--begin::Container-->
        <div class="container">
            <!--begin::Card-->
            <div class="card card-custom">
                <div class="card-header">
                    <div class="card-title">
                        <h3 class="card-label">{!! trans("message_lang.LBL_OPERATOR_DETAILS") !!} - {{ $operator->operatorName ?? "" }}</h3>
                    </div>
                    <div class="card-toolbar">
                        <a href="{{ route('agentportal.multiservice-configs.index') }}" class="btn btn-primary btn-sm">
                            {!! trans('message_lang.BTN_BACK') !!}
                        </a>
                    </div>
                </div>
                <div class="card-body">

                    <!-- operator info -->
                    <div class="mb-4 shadow-sm p-3">
                        <h3>{!! trans('message_lang.LBL_OPERATOR_DETAILS') !!}</h3>
                        
                        <div class="row mb-2">
                            <!-- details column -->
                            <div class="col-12 col-lg-6">
                                <table class="table table-sm table-borderless">
                                    <tbody>
                                        <tr class="w-25">
                                            <td>{!! trans('message_lang.LBL_OPERATOR_NAME') !!}</td>
                                            <td>
                                                <strong>{{ $operator->operatorName }}</strong>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>{!! trans('message_lang.LBL_PARTNER_OPERATOR_ID') !!}</td>
                                            <td>
                                                <strong>{{ $operator->partnerOperatorId }}</strong>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>{!! trans('message_lang.LBL_COUNTRY') !!}</td>
                                            <td>
                                                <strong>{{ $countries->where('sortname', $operator->countryCode)->first()->name }}</strong>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>{!! trans('message_lang.LBL_STATUS') !!}</td>
                                            <td>
                                                <strong>{{ $operatorStatuses[$operator->serviceStatus] }}</strong>
                                                <div>
                                                    @if ($operator->serviceStatus == 1)
                                                    <a href="{{ route('agentportal.multiservice-configs.toggle-operator-status', [base64_encode($operator->id)]) }}" role="button" class="btn btn-sm btn-danger">{!! trans('message_lang.LBL_TURN_SERVICE_OFF') !!}</a>
                                                    @else
                                                    <a href="{{ route('agentportal.multiservice-configs.toggle-operator-status', [base64_encode($operator->id)]) }}" role="button" class="btn btn-sm btn-success">{!! trans('message_lang.LBL_TURN_SERVICE_ON') !!}</a>
                                                    @endif
                                                </div>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>

                            <!-- logo section -->
                            <div class="col-12 col-lg-6">
                                <img src="{{ isset($operator->logoUrl) ? URL::to('/').$operator->logoUrl : URL::to('/').'/public/uploads/default/100_no_img.jpg' }}" alt="no logo" style="width: 100%; height: auto">
                            </div>

                        </div>

                    </div>
                    <!-- end operator details -->

                    <!--begin: operator products -->
                    <div class="shadow-sm p-3">
                        <div class="row mb-3">
                            <div class="col-9">
                                <h3>{!! trans('message_lang.LBL_PRODUCT_DETAILS') !!}</h3>
                            </div>
                            <div class="col-3" style="text-align: right">
                                <a href="{{ route('agentportal.multiservice-configs.add-operator-product', [base64_encode($operator->id)]) }}" role="button" class="btn btn-sm btn-primary">
                                    {!! trans('message_lang.BTN_ADD_PRODUCT') !!}
                                </a>
                            </div>
                        </div>
                        <table class="table table-sm table-bordered">
                            <thead>
                                <tr>
                                    <th>{!! trans('message_lang.LBL_PRODUCT_NAME') !!}</th>
                                    <th>{!! trans('message_lang.LBL_PRODUCT_ID') !!}</th>
                                    <th>{!! trans('message_lang.LBL_STATUS') !!}</th>
                                    <th>{!! trans('message_lang.LBL_ACTION') !!}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($operatorProducts as $product)
                                    <tr>
                                        <td>{{ $product->productName }}</td>
                                        <td>{{ $product->productId }}</td>
                                        <td>{{ $productStatuses[$product->productStatus] }}</td>
                                        <td>
                                            <button id="productDeleteBtn{{ $product->id }}" onclick="deleteProduct({{ $product->id }})"  class="btn btn-sm btn-danger" role="button">
                                                {!! trans('message_lang.BTN_DELETE') !!}
                                            </button>
                                            @if ($product->productStatus == 1)
                                            <a href="{{ route('agentportal.multiservice-configs.toggle-product-status', [base64_encode($product->id)]) }}" role="button" class="btn btn-sm btn-dark">{!! trans('message_lang.LBL_TURN_SERVICE_OFF') !!}</a>
                                            @else
                                            <a href="{{ route('agentportal.multiservice-configs.toggle-product-status', [base64_encode($product->id)]) }}" role="button" class="btn btn-sm btn-light">{!! trans('message_lang.LBL_TURN_SERVICE_ON') !!}</a>
                                            @endif
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="4" style="text-align: center">
                                            no product found
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                    <!--end: operator products-->
                </div>
            </div>
            <!--end::Card-->
        </div>
        <!--end::Container-->
    </div>
    <!--end::Entry-->
</div>
@endsection

@section("page_script")
<script type="text/javascript">
    function deleteProduct(productId)
    {
        // get the value
        const product = $(`#productDeleteBtn${productId}`).val();

        // confirm deletion for the product
        let message = "Are you sure you want to delete this product";
        if(!confirm(message)) {
            window.location.reload();
            return;
        }

        // submit the delete request to the backend
        let url = `{{ route('agentportal.multiservice-configs.delete-operator-product') }}`;
        $.ajax({
            url: url,
            type: "delete",
            dataType: "json",
            data: {
                productId: productId,
                _token: "{{csrf_token()}}"
            },
            success: (res) => {
                alert(res.message);
                window.location.reload();
            }
        })
    }
</script>
@endsection