@extends('admin.layout.master')
@section('title', 'Create/Update')
<style>
    .ck-editor__editable_inline {
        min-height: 150px;
    }
</style>

@section('content')
    <div class="card sina-card">
        <div class="card-header card-header-s d-flex flex-wrap justify-content-between align-items-center">
            <h4>Admin Notification @if (isset($edit))
                    Update
                @else
                    Create
                @endif
            </h4>
            <div class="d-flex justify-content-end">
                <a href="{{ route('admin.notification.index') }}" class="btn btn-sm btn-primary">List</a>
            </div>
        </div>

        <div class="card-body">
            <form id="form" method="post" action="{{ route('admin.notification.store') }}" name="form"
                enctype="multipart/form-data">
                @csrf
                <input type="hidden" name="id" value="@if (isset($edit)) {{ $edit->id }} @endif">

                <div class="row">
                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        @php
                            $roleIds = explode(',', $edit->role_ids ?? '');
                            $userIds = explode(',', $edit->user_ids ?? '');
                        @endphp
                        <label for="group_id">Roles</label>
                        <select name="roles[]" id="roles" multiple class="form-control select_2">
                            @foreach ($roles as $role)
                                <option value="{{ $role->id }}"
                                    {{ (isset($edit) && in_array($role->id, $roleIds) ? 'selected' : in_array($role->id, old('roles') ?? [])) ? 'selected' : '' }}>
                                    {{ $role->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        <label for="party_id">Users</label>
                        <select name="users[]" id="users" multiple class="form-control select_2">
                            @foreach ($users as $user)
                                <option value="{{ $user->id }}"
                                    {{ (isset($edit) && in_array($user->id, $userIds) ? 'selected' : in_array($user->id, old('users') ?? [])) ? 'selected' : '' }}>
                                    {{ $user->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        <label for="type">Type <span class="text-danger">*</span></label>
                        <select name="type" onchange="handbookDocumentHandler()" id="type"
                            class="form-control select_2" required>
                            <option value="2"
                                @if (isset($edit) && $edit->type == 2) selected @else {{ old('type') == 2 ? 'selected' : '' }} @endif>
                                Normal Notification
                            </option>
                            <option value="1"
                                @if (isset($edit) && $edit->type == 1) selected @else {{ old('type') == 1 ? 'selected' : '' }} @endif>
                                Force Notification
                            </option>
                            <option value="3"
                                @if (isset($edit) && $edit->type == 3) selected @else {{ old('type') == 3 ? 'selected' : '' }} @endif>
                                Closeless Notification
                            </option>
                            <option value="4"
                                @if (isset($edit) && $edit->type == 4) selected @else {{ old('type') == 4 ? 'selected' : '' }} @endif>
                                Handbook Notification
                            </option>
                            <option value="5"
                                @if (isset($edit) && $edit->type == 5) selected @else {{ old('type') == 5 ? 'selected' : '' }} @endif>
                                Document Notification
                            </option>
                        </select>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        <label for="image">Document</label>
                        <input type="file" name="image" class="form-control">
                    </div>

                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        <label for="schedule_start">Schedule Start Time</label>
                        <input type="text" class="form-control date_time_picker" name="schedule_start_time"
                            id="schedule_start_time"
                            value="{{ isset($edit) && $edit->schedule_start_time ? date('d-m-Y H:i', strtotime($edit->schedule_start_time)) : '' }}">
                    </div>
                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        <label for="schedule_end">Schedule End Time</label>
                        <input type="text" class="form-control date_time_picker" name="schedule_end_time"
                            id="schedule_end_time"
                            value="{{ isset($edit) && $edit->schedule_end_time ? date('d-m-Y H:i', strtotime($edit->schedule_end_time)) : '' }}">
                    </div>
                    <div class="col-md-3 col-sm-6 col-12 mb-2">
                        <label for="schedule_start">Status</label>
                        <select name="status" id="status" class="form-control select_2">
                            <option value="1" @if (isset($edit) && $edit->status == 1) selected @endif>
                                Active
                            </option>
                            <option value="0" @if (isset($edit) && $edit->status == 0) selected @endif>
                                Inactive
                            </option>
                        </select>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-6 col-12 mb-2">
                        <label for="message">Message <span class="text-danger">*</span></label>
                        <textarea name="message" id="message" rows="5" class="form-control">{!! $edit->message ?? old('message') !!}</textarea>
                    </div>
                </div>

                <div class="mt-2">
                    <button class="btn-sina-submit" type="submit"><i class="fa fa-save"></i> Send </button>
                </div>
            </form>
        </div>
    </div>
@endsection


<script src="https://cdn.ckeditor.com/ckeditor5/41.2.1/classic/ckeditor.js"></script>
@section('script')
    <script>
        let editorInstance;

        $(document).ready(function() {
            $('.select_2').select2();

            ClassicEditor
                .create(document.querySelector('#message'))
                .then(editor => {
                    editorInstance = editor;
                })
                .catch(error => {
                    console.error(error);
                });

        });

        function handbookDocumentHandler() {
            let handbookOrDocument = "";

            if ($('#type').val() < 4) {
                // editorInstance.setData('');
                return false
            };

            if ($('#type').val() == 4) handbookOrDocument = "handbook";
            else if ($('#type').val() == 5) handbookOrDocument = "document";

            let text =
                `I acknowledge that I have received a copy of the employee ${handbookOrDocument} from Pen Global Limited. I understand that it is my responsibility to read and become familiar with the policies, procedures, and guidelines outlined in the ${handbookOrDocument}. I understand that the ${handbookOrDocument} contains important information about the company's expectations regarding my conduct, performance and responsibilities as an employee. I also understand that the company reserves the right to modify or update the policies at any time, with or without notice. I confirm that I have read the ${handbookOrDocument} in its entirely. I understand the contents and agree to abide by the policies and procedures outlined within.`;

            if (editorInstance) {
                editorInstance.setData(text);
            } else {
                $('#message').val(text);
            }
        }
    </script>
@endsection