@extends('layouts.app')
@section('title', $page_title)

@section('content')
<div class="row">
    <div class="col-xl-12">
        <div class="card custom-card">
            <div class="card-body">
                <a href="javascript:;" onclick="viewModal('modal', '{{route('notes.create')}}');">
                    <button type="button" class="btn btn-primary my-2">{{__('app.add_note')}}</button>
                </a>
            </div>
            @forelse($notes as $note)
            <div class="row">
            <div class="col-md-12 px-4 py-2">
                <div class="card custom-card shadow-none mb-0 shadow-none border">
                    <div class="card-body p-4" style="background-color: #FFF9C4;">
                        <div class="ribbon-6 ribbon-left ribbon-success">{{$note->title}}</div>
                        <div class="card-subtitle fw-semibold mb-2 text-end text-primary">{{\App\Http\Helper\Helper::datetimeDisplay($note->created_at)}}</div>
                        <span class="pt-4 text-primary">{{$note->content}}</span>
                        <div class="mt-1 text-end">
                            <button class="btn btn-info btn-sm" onclick="pinNote('{{route('note.pin', [$note->id])}}', '{{$note->title}}', 0)" style="{{$note->is_pinned ? '' : 'display:none'}}">{{__('app.unpin')}}</button>
                            <button class="btn btn-secondary btn-sm" onclick="pinNote('{{route('note.pin', [$note->id])}}', '{{$note->title}}', 1)" style="{{$note->is_pinned ? 'display:none' : ''}}">{{__('app.pin_to_dashboard')}}</button>
                            <a href="javascript:;" onclick="viewModal('modal', '{{route('notes.edit', [$note->id])}}');"><button class="btn btn-primary btn-sm">{{__('app.edit')}}</button></a>
                            <button class="btn btn-danger btn-sm" onclick="deleteNote('{{route('notes.destroy', [$note->id])}}', '{{__('app.note_delete_confirm_msg')}}')">{{__('app.delete')}}</button>
                        </div>
                    </div>
                </div>
            </div>
            </div>
            @empty
                <div class="col-md-12 text-center my-5">{{__('app.no_record_found')}}</div>
            @endforelse
        </div>
    </div>
</div>
@include('includes.datatables')
@endsection