@extends('template.layout')
@section('style')
@endsection

@section('content')
    <div class="container">


        <div class="row">



            <div class="col-md-8">

                @if ($errors->any())
                    <div class="alert alert-danger alert-dismissible fade show" role="alert">

                        <ul class="list-unstyled m-0 p-0">
                            @foreach ($errors->all() as $error)
                                <li>
                                    <strong> {{ $error }}</strong>
                                </li>
                            @endforeach

                        </ul>
                        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                    </div>
                @endif




                <div class="card">
                    <div class="card-header"><strong>Edit Salesman</strong></div>
                    <div class="card-body">
                        <a class="btn btn btn-outline-info  mb-3" href="{{ url()->previous() }}"><i class="bi bi-skip-backward-circle pr-1"></i> Back</a>

                        <form method="POST" action="{{ url('salesman/update/'.$salesman->id) }}" enctype="multipart/form-data">
                            @csrf
                            @method('PUT')

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Branch : </label>
                                <div class="col-sm-8">
                                    <select name="branch" class="form-select">
                                        <option value="0">--Select One--</option>
                                        @foreach ($branches as $branch)
                                            <option value="{{ $branch->id }}"
                                                {{ $branch->id == $salesman->branch_id ? 'selected' : '' }}>
                                                {{ $branch->name }}</option>
                                        @endforeach

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






                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Name : </label>
                                <div class="col-sm-8">
                                    <input type="text" name="name" class="form-control" value="{{ $salesman->name }}">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">NIC : </label>
                                <div class="col-sm-8">
                                    <input type="text" name="nic" class="form-control" value="{{ $salesman->nic }}">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Date of Birth : </label>
                                <div class="col-sm-8">
                                    <input type="date" name="dob" class="form-control" value="{{ $salesman->dob }}">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Email : </label>
                                <div class="col-sm-8">
                                    <input type="email" name="email" class="form-control"
                                        value="{{ $salesman->email }}">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Mobile : </label>
                                <div class="col-sm-8">
                                    <input type="text" name="mobile" class="form-control"
                                        value="{{ $salesman->mobile }}">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Land : </label>
                                <div class="col-sm-8">
                                    <input type="text" name="land" class="form-control"
                                        value="{{ $salesman->land }}">
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Address : </label>
                                <div class="col-sm-8">
                                    <textarea class="form-control" name="address" id="" cols="30" rows="4">{{ $salesman->address }}</textarea>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Note : </label>
                                <div class="col-sm-8">
                                    <textarea class="form-control" name="note" id="" cols="30" rows="4">{{ $salesman->note }}</textarea>
                                </div>
                            </div>


                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Picture : </label>
                                <div class="col-sm-8">
                                    <input class="form-control" type="file" name="picture" id="picture">
                                    <img class="img img-thumbnail mt-3" id="picture_preview"
                                        src="{{ $salesman->profile_picture_name == '' || $salesman->profile_picture_name == null ? asset('storage/images/default/sample-image-profile.jpg') : asset('storage/' . $salesman->profile_picture_name) }}"
                                        alt="" width="150" height="150">
                                    <div class="form-check mt-1">
                                        <input type="checkbox" class="form-check-input" id="picture_remove"
                                            name="picture_remove"
                                            {{ $salesman->profile_picture_name == null || $salesman->profile_picture_name == '' ? 'disabled' : '' }}>
                                        <label class="form-check-label text-danger" for="picture_remove">Remove
                                            Image</label>
                                    </div>
                                </div>
                            </div>



                            <div class="form-group row">
                                <label for="name" class="col-sm-4 col-form-label">Documents : </label>
                                <div class="col-sm-4">
                                    <input class="form-control" type="file" name="document_1" id="document_1">

                                    @if (count($salesman->images) > 0)
                                        <img class="img img-thumbnail mt-3" id="document_1_preview"
                                            src="{{ $salesman->images[0]->image_name == '' || $salesman->images[0]->image_name == null ? asset('storage/images/default/sample-image-document.jpg') : asset('storage/' . $salesman->images[0]->image_name) }}"
                                            alt="" width="150" height="150">
                                        <div class="form-check mt-1">
                                            <input type="checkbox" class="form-check-input" id="document_1_remove"
                                                name="document_1_remove"
                                                {{ $salesman->images[0]->image_name == null || $salesman->images[0]->image_name == '' ? 'disabled' : '' }}>
                                            <label class="form-check-label text-danger" for="picture_remove">Remove
                                                Image</label>
                                        </div>
                                    @else
                                        <img class="img img-thumbnail mt-3" id="document_1_preview"
                                            src="{{ asset('storage/images/default/sample-image-document.jpg') }}"
                                            alt="" width="150" height="150">
                                        <div class="form-check mt-1">
                                            <input type="checkbox" class="form-check-input" id="document_1_remove"
                                                name="document_1_remove" disabled>
                                            <label class="form-check-label text-danger" for="picture_remove">Remove
                                                Image</label>
                                        </div>
                                    @endif


                                </div>
                                <div class="col-sm-4">
                                    <input class="form-control" type="file" name="document_2" id="document_2">
                                     @if (count($salesman->images) > 1)
                                        <img class="img img-thumbnail mt-3" id="document_2_preview"
                                            src="{{ $salesman->images[1]->image_name == '' || $salesman->images[1]->image_name == null ? asset('storage/images/default/sample-image-document.jpg') : asset('storage/' . $salesman->images[1]->image_name) }}"
                                            alt="" width="150" height="150">
                                        <div class="form-check mt-1">
                                            <input type="checkbox" class="form-check-input" id="document_2_remove"
                                                name="document_2_remove"
                                                {{ $salesman->images[1]->image_name == null || $salesman->images[1]->image_name == '' ? 'disabled' : '' }}>
                                            <label class="form-check-label text-danger" for="picture_remove">Remove
                                                Image</label>
                                        </div>
                                    @else
                                        <img class="img img-thumbnail mt-3" id="document_2_preview"
                                            src="{{ asset('storage/images/default/sample-image-document.jpg') }}"
                                            alt="" width="150" height="150">
                                        <div class="form-check mt-1">
                                            <input type="checkbox" class="form-check-input" id="document_2_remove"
                                                name="document_2_remove" disabled>
                                            <label class="form-check-label text-danger" for="picture_remove">Remove
                                                Image</label>
                                        </div>
                                    @endif

                            </div>



                            <div class="form-group row mt-5">
                                <label for="name" class="col-sm-4 col-form-label"> </label>
                                <div class="col-sm-8">
                                    <div class="d-flex gap-2">
                                    <button class="btn btn-primary" id="btn-edit" type="submit">Update</button>
    </form>

                                      <form action="{{ url('salesman/delete/' . $salesman->id) }}" method="POST">
                                            @csrf
                                            @method('DELETE')
                                            <button class="btn btn-danger btn-delete" type="submit">Delete</button>
                                        </form>
                                        </div>

                                </div>
                            </div>


                    
                    </div>
                </div>



            </div>
            <div class="col-md-4"></div>
        </div>



    </div>
@endsection

@section('script')
    <script>
        // profile picture preview before upload
        document.getElementById('picture').addEventListener('change', function(event) {
            const file = event.target.files[0];
            if (file) {
                const preview = document.getElementById('picture_preview');
                preview.src = URL.createObjectURL(file);
                preview.style.display = "block";
            }
        });

         document.getElementById('document_1').addEventListener('change', function(event) {
            const file = event.target.files[0];
            if (file) {
                const preview = document.getElementById('document_1_preview');
                preview.src = URL.createObjectURL(file);
                preview.style.display = "block";
            }
        });


         document.getElementById('document_2').addEventListener('change', function(event) {
            const file = event.target.files[0];
            if (file) {
                const preview = document.getElementById('document_2_preview');
                preview.src = URL.createObjectURL(file);
                preview.style.display = "block";
            }
        });


 //edit confirmation message
              $('#btn-edit').click(function(e) {
            e.preventDefault();
            var form = $(this).closest('form');
            //alert('aaa');
            Swal.fire({
                title: "Are you sure to update Salesman data ?",
                text: "You won't be able to revert this!",
                icon: "warning",
                showCancelButton: true,
                confirmButtonColor: "#3085d6",
                cancelButtonColor: "#d33",
                confirmButtonText: "Yes, update it!"
            }).then((result) => {
                if (result.isConfirmed) {
                    // Swal.fire({
                    //   title: "Deleted!",
                    //   text: "Your file has been deleted.",
                    //   icon: "success"
                    // });
                    form.submit();
                }
            });

        });

           //delete confirmation message
        $('.btn-delete').click(function(e) {
            e.preventDefault();
            var form = $(this).closest('form');
            //alert('aaa');
            Swal.fire({
                title: "Are you sure to delete Salesman data ?",
                text: "You won't be able to revert this!",
                icon: "warning",
                showCancelButton: true,
                confirmButtonColor: "#3085d6",
                cancelButtonColor: "#d33",
                confirmButtonText: "Yes, delete it!"
            }).then((result) => {
                if (result.isConfirmed) {
                    // Swal.fire({
                    //   title: "Deleted!",
                    //   text: "Your file has been deleted.",
                    //   icon: "success"
                    // });
                    form.submit();
                }
            });

        });

    </script>
@endsection