@extends('operations.layout.mainlayout')

@section('content')
{{--    @if(session('role') != 4 && session('role') != 8)--}}
{{--        {{exit("<h1>Unauthorized access</h1>")}}--}}
{{--    @endif--}}
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid card">
            <div class="row mb-2">
                <div class="col-sm-6 card-body">
                    <h1 class="m-0 text-dark" style="color: #e35a80!important;">Price List</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">

                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">

                    <!-- /.card -->

                    <div class="card">

                        <!-- /.card-header -->
                        <div class="card-body">
                            <table id="prices-lists-table" class="table table-bordered table-striped">
                                <thead>
                                <tr>
                                    <th>Price List ID</th>
                                    <th>Price List EN Name</th>
                                    <th>Price List AR Name</th>
                                    <th>Price List Type</th>

                                    @permission('mange_administration_price_list') <th>Action</th> @endpermission
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($lists as $list)
                                <tr>
                                    <td style="width: 10%"><a href="/operations/price-list/{{$list->ID}}">{{$list->ID}}</a></td>
                                    <td style="width: 20%">{{$list->NAME_EN}}</td>
                                    <td style="width: 20%">{{$list->NAME_AR}}</td>
                                    <td style="width: 20%">{{$list->TYPE}}</td>
                                    <td style="width: 30%">
                                        @permission('mange_administration_price_list')    <button class="btn btn-info clone-price-list" data-id="{{$list->ID}}" data-toggle="modal" data-target="#modal-lg">Clone</button> @endpermission
                                        <a target="_blank" href="/operations/price-list/{{$list->ID}}/export" type="button" class="btn btn-success ml-2" style="color:#fff !important"> Export </a>
                                        <button class="btn btn-success import-price-list ml-2" data-id="{{$list->ID}}" data-toggle="modal" data-target="#import-list-modal">Import</button>
                                        <button class="btn btn-secondary import-price-list ml-2" data-id="{{$list->ID}}" data-toggle="modal" data-target="#template-list-modal">Template</button>
                                        <a class="btn btn-danger ml-2 remove-price-list" data-id="{{$list->ID}}" type="button" style="color:#fff !important">Remove</a>
                                    </td>
                                </tr>
                                @endforeach
                                </tbody>
                            </table>
                            <div class="row">
                          
                                <div class="col mt-4" style="text-align: center">
                                    @permission('mange_administration_price_list')
                                    <a class="btn btn-info" href="/operations/price-list/0">Add New Price List</a>
                                    @endpermission
                                </div>
                            </div>

                        </div>
                        <!-- /.card-body -->
                    </div>
                    <!-- /.card -->
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </div>
        <!-- /.container-fluid -->
    </section>
    <!-- /.content -->
</div>
<!-- /.content-wrapper -->

<div class="modal fade" id="modal-lg">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">  
                    <h3 class="modal-title">Clone Price List</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="collection-form" method="post"  action="/operations/samples/">
                    <div class="modal-body">
                        <div class="row">
                        <input type="hidden" name="list_id" id="list_id" value=""/>
                            <div class="col" style="text-align: center;">
                                <div class="alert alert-danger alert-danger-hospital" role="alert" style="display: none;"></div>
                            </div>
                        </div>
                        <div class="row">
                        <div class="col-md-6">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Name En</p>
                                <input required type="text" class="form-control"  id="list_name_en" name="list_name_en" value="">
                            </div>
                            <div class="col-md-6">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Name Ar</p>
                                <input required type="text" class="form-control"  id="list_name_ar" name="list_name_ar" value="">
                            </div>
                        </div>
                        <div class="row" style="margin-top:20px">
                        <div class="col-md-6">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Type</p>
                                <select required name="list_type" id="list_type" class="form-control">
                                     <option>Sales</option>
                                     <option>Contracts</option>
                               </select>
                            </div>
                            <div class="col-md-6">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Price Percent</p>
                                <input required type="number" class="form-control" placeholder="%" id="list_price_percent" name="list_price_percent" value="">                            </div>
                        </div>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button style="width:130px;" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <button style="width:130px;color:#fff" id="clone-price-list-tests"  type="button" class="btn btn-info">Save</button>
                    </div>
                </form>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <div class="modal fade" id="import-list-modal">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">  
                    <h3 class="modal-title">Import Price List</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form>
                    <div class="modal-body">
                        <div class="row">
                        <input type="hidden" name="list_id" id="list_id" value=""/>
                            <div class="col" style="text-align: center;">
                                <div class="alert alert-danger alert-danger-hospital" role="alert" style="display: none;"></div>
                            </div>
                        </div>
                        <div class="row" style="margin-top:20px">
                        <div class="col-6">
                            <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Upload Price List</p>
                            <input style="padding:3px" class="form-control" name="import-file" id="import-file" type="file" />
                        </div>
                            </div>
                   
                    </div>
                 
                  
                    <div class="modal-footer justify-content-between">
                    <button style="width:130px;" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button style="width:130px;color:#fff" id="import-price-list-tests"  type="button" class="btn btn-info">Import</button>
                    </div>
                </form>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <div class="modal fade" id="template-list-modal">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">  
                    <h3 class="modal-title">Download Template Price List</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form>
                    <div class="modal-body">
                        <div class="row">
                        <input type="hidden" name="list_id" id="list_id" value=""/>
                            <div class="col" style="text-align: center;">
                                <div class="alert alert-danger alert-danger-hospital" role="alert" style="display: none;"></div>
                            </div>
                        </div>
                        <div class="row">
                    <div class="col-md-6">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Select Processing Branch</p>
                                <select required id="processing_hospital_id" name="processing_hospital_id" class="form-control">
                                <option value="">Select Processing Branch</option>
                                                    @foreach($primary_hospitals as $primary)
                                                        <option value="{{$primary->ID}}">{{$primary->NAME_EN}}</option>
                                                    @endforeach
                               </select>
                            </div>
                       
                    </div>
                    </div>
                    <div class="modal-footer justify-content-between">
                    <button style="width:130px;" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button id="template-price-list" type="button" class="btn btn-secondary" >Download Template</button>
                    </div>
                </form>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
@endsection
@section('footer-scripts')
    <script>
        $(document).on('click', '.remove-price-list', function() {
            const id = $(this).data('id');
            if (confirm('Are you sure you want to delete this price list?')) {
                $.ajax({
                    url: `/operations/price-list/${id}`,
                    type: 'DELETE',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function(response) {
                        toastr.success("The price list was successfully deleted.");
                        location.reload();
                    },
                    error: function(xhr) {
                        toastr.error('An error occurred while deleting the price list.');
                    }
                });
            }
        });

    </script>
@endsection