@extends('admin.partial.template') @include('admin.settings.sidebar') @section('section') <div class="title"> <h3 class="font-weight-bold">Edit Page</h3> <p class="lead">{{$page->slug}}</p> </div> <hr> <div> <input type="hidden" id="slug" name="slug" value="{{$page->slug}}"> <input class="form-control form-control-lg" id="title" name="title" placeholder="Title"> <p class="small text-muted"> Page URL: <span class="page-url font-weight-bold">{{$page->url()}}</span> {{-- <span class="pl-1"><a href="#" class="font-weight-bold">Edit</a></span> --}} </p> <div id="editor" style="height: 400px"> {!!$page->content!!} </div> <div class="mt-3 d-flex justify-content-between"> <div> <div class="custom-control custom-switch d-inline pr-3"> <input type="checkbox" class="custom-control-input" id="activeSwitch" {{$page->active?'checked="true"':''}}> <label class="custom-control-label font-weight-bold" for="activeSwitch">Active</label> </div> {{-- <a class="btn btn-light font-weight-bold py-0" href="#">Set Expire Date</a> --}} </div> <div> {{-- <a class="btn btn-light font-weight-bold py-0" href="#">Preview</a> --}} <a class="btn btn-outline-danger font-weight-bold py-0 btn-delete" href="#">Delete</a> <a class="btn btn-primary font-weight-bold py-0 btn-save" href="#">Save</a> </div> </div> </div> @endsection @push('styles') <link rel="stylesheet" href="{{mix('css/quill.css')}}"/> <style type="text/css"> .ql-container { box-sizing: border-box; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI", Roboto,Helvetica,Arial,sans-serif; font-size: 16px; height: 100%; margin: 0px; position: relative; } </style> @endpush @push('scripts') <script src="{{mix('js/quill.js')}}"></script> <script> window.editor = new Quill('#editor', { theme: 'snow' }); $('.btn-save').on('click', function(e) { e.preventDefault(); let confirm = window.confirm('Are you sure you want to save this page?'); if(confirm !== true) { return; } let html = editor.container.firstChild.innerHTML; let title = $('#title').val(); let active = $('#activeSwitch')[0].checked; axios.post(window.location.href, { slug: '{{$page->slug}}', title: title, content: html, active: active }).then((res) => { window.location.href = '{{$page->url()}}'; }).catch((err) => { console.log(err) }); }); $('.btn-delete').on('click', function(e) { e.preventDefault(); let confirm = window.confirm('Are you sure you want to delete this page?'); if(confirm == true) { axios.post('/i/admin/settings/pages/delete', { id: '{{$page->id}}' }).then(res => { window.location.href = '/i/admin/settings/pages'; }).catch(err => { swal('Error', 'An error occured!', 'error'); console.log(err); }); } }); $('#title').on('change input', function(e) { e.preventDefault(); let title = this.value.split(' ').join('-').toLowerCase(); }) </script> @endpush