@extends('includes.layout')
@section('content')
    @php
        $resww = DB::table('comm_mail_templates')->where('show_hide', '0')->get();
        $resww333 = '';
        if($_GET['id'] ?? '' && $_GET['id'] != ''){
            $resww333 = DB::table('comm_mail_templates')->where('id', $_GET['id'])->get();
        }
    @endphp

    <div class="p-4 text-center w-full overflow-y-auto" style="height:40rem">
        <h1 class="text-2xl font-semibold">Mail Template Create</h1>
    <br>
    <nav aria-label="breadcrumb" class="mx-auto text-left leading-10 w-1/2 h-auto">
    <ol class="flex flex-wrap items-center w-full px-4 py-2 rounded-md bg-blue-gray-50 bg-opacity-60">
        <li
        class="flex items-center font-sans text-sm antialiased font-normal leading-normal transition-colors duration-300 cursor-pointer text-blue-gray-900 hover:text-light-blue-500">
        <a href="/settings" class="opacity-60">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" viewBox="0 0 20 20"
            fill="currentColor">
            <path
                d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z">
            </path>
            </svg>
        </a>
        <span
            class="mx-2 font-sans text-sm antialiased font-normal leading-normal pointer-events-none select-none text-blue-gray-500">
            /
        </span>
        </li>
        <li
        class="flex items-center font-sans text-sm antialiased font-normal leading-normal transition-colors duration-300 cursor-pointer text-blue-gray-900 hover:text-light-blue-500">
        <a href="/Content" class="opacity-60">
            <span>
                Content
            </span>
        </a>
        </li>
    </ol>
    </nav>
  


  <form id="editform" class="mx-auto text-left leading-10 w-1/2 h-auto" method="POST" onsubmit="saveButton(event)"> 
            <label for="name" class="block mb-2 text-sm font-medium text-gray-900 darks:text-white">Name</label>
            <input type="text" id="name" value="{{$resww333[0]->name ?? ''}}" autocomplete="off" aria-describedby="helper-text-explanation" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5  darks:bg-gray-700 darks:border-gray-600 darks:placeholder-gray-400 darks:text-white darks:focus:ring-blue-500 darks:focus:border-blue-500" placeholder="Name *" required>
            <label for="message" class="block mb-2 text-sm font-medium text-gray-900 darks:text-white">Content</label>
            <textarea id="message1" rows="4" class="block p-2.5 w-full h-40 text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 darks:bg-gray-700 darks:border-gray-600 darks:placeholder-gray-400 darks:text-white darks:focus:ring-blue-500 darks:focus:border-blue-500" placeholder="Content *" required>@php echo $resww333[0]->temp ?? ''; @endphp</textarea>


            

            <div>&nbsp;</div>
            <button
                class="align-middle select-none font-sans font-bold text-center uppercase transition-all disabled:opacity-50 disabled:shadow-none disabled:pointer-events-none text-xs py-3 px-6 rounded-lg bg-gray-900 text-white shadow-md shadow-gray-900/10 hover:shadow-lg hover:shadow-gray-900/20 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none"
                type="submit" id="autoescale">Save</button>
        </form>  
      <div>&nbsp;</div>

        <div class="w-full flex justify-center">
            <div class="relative overflow-x-auto shadow-md sm:rounded-lg w-3/4">
                <table class="w-full text-sm text-left rtl:text-right text-gray-500 darks:text-gray-400">
                    <thead class="text-xs text-gray-700 uppercase bg-gray-50 darks:bg-gray-700 darks:text-gray-400 sticky top-0">
                        <tr>
                            <th scope="col" class="px-6 py-3">
                                Name
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Content
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Modify
                            </th>
                        </tr>
                    </thead>
                    <tbody class="overflow-y-auto">
                        @foreach($resww as $items)
                            <tr class="odd:bg-white odd:darks:bg-gray-900 even:bg-gray-50 even:darks:bg-gray-800 border-b darks:border-gray-700">
                                <th scope="row" class="px-6 py-3 font-medium text-gray-900 whitespace-nowrap darks:text-white">
                                    {{$items->name}}
                                </th>
                                <td class="px-6 py-3">
                                    {{$items->temp}}
                                </td>
                                <td class="px-6 py-3 cursor-pointer" >
                                    <div class="flex items-center gap-3">
                                        <button Onclick="Fun_edit({{$items->id}})" title="edit" class="select-none rounded-lg bg-gray-900 py-1 px-4 text-center align-middle font-sans text-xs font-bold text-white shadow-md shadow-gray-900/10 transition-all hover:shadow-lg hover:shadow-gray-900/20 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none" type="button">
                                            Edit
                                        </button>
                                        <button Onclick="Fun_Removet({{$items->id}})" title="Trash" class="select-none rounded-lg bg-gray-900 py-1 px-4 text-center align-middle font-sans text-xs font-bold text-white shadow-md shadow-gray-900/10 transition-all hover:shadow-lg hover:shadow-gray-900/20 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none" type="button">
                                            Remove
                                        </button>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>  
            <script>
                function saveButton(event) {
                    event.preventDefault();
                    var text = $('#autoescale').text();

                    const name = $("#name").val();
                    const content = $("#message1").val();
                    alert(content);
                    $.ajax({
                        type: "post",
                        url: "{{ route('autonomous-level') }}",
                        headers: {
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        data: {
                            ref: text == 'Save' ? 'mail_temp' : 'mail_temp_up',
                            name: name,
                            content: content,
                            ids: ''
                        },
                        success: function(response) {
                            alert(response.message);
                            $("#name").val('');
                            $("#message").val('');
                            if(response.message == 'Template Updated successfully') {
                                window.location.href = 'https://smarthub.rn-test.com/Content'
                            }else {
                                location.reload();
                            }
                        },
                        error: function() {
                            console.error("Error occurred during the AJAX request.");
                        }
                    });
                }
                function Fun_edit(id) {
                    window.location.href = 'https://smarthub.rn-test.com/Content?id='+id
                }

                function Fun_Removet(id) {
                    $.ajax({
                        type: "post",
                        url: "{{ route('autonomous-level') }}",
                        headers: {
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        data: {
                            ref: 'mail_temp_remove',
                            id: id
                        },
                        success: function(response) {
                            alert(response.message);
                                location.reload();
                        },
                        error: function() {
                            console.error("Error occurred during the AJAX request.");
                        }
                    });
                }
            </script>
        </div>
    </div>
@endsection