@extends('layouts.app')
@section('content')
    <div class="container-fluid">
        <div class="row h-100vh align-items-center">
            <div class="col-md-10 col-lg-9 col-sm-12 m-auto">
                @role('root|admin')
                    <form action="{{ route('fcm.update') }}" method="POST">
                        @csrf
                        @method('put')
                    @endrole
                    <div class="card shadow-sm">
                        <div class="card-header bg-custom py-2">
                            <h3 class="text-white m-0">FCM Configuration</h3>
                        </div>
                        <div class="card-body pb-3">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="mb-2">
                                        <label class="mb-0 text-dark">
                                            FCM Server Key <span class="text-danger">*</span>
                                        </label>
                                        <input type="text" name="fcm_key" class="form-control"
                                            value="{{ config('app.fcm_server_key') }}" required/>
                                        @error('fcm_key')
                                            <small class="text-danger d-block">{{ $message }}</small>
                                        @enderror
                                    </div>
                                </div>

                            </div>
                        </div>
                        <div class="card-footer bg-white py-3 ">
                            <div class="d-flex justify-content-end">
                                <button class="btn btn-lg btn-custom rounded-0">Save And Update</button>
                            </div>
                        </div>
                        @role('root|admin')
                    </form>
                @endrole
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        var previewLogoFile = function(event) {
            var reader = new FileReader();
            reader.onload = function() {
                var output = document.getElementById('logoPreview');
                output.src = reader.result;
            };
            reader.readAsDataURL(event.target.files[0]);
        };

        var previewFavIco = function(event) {
            var reader = new FileReader();
            reader.onload = function() {
                var output = document.getElementById('favionPreview');
                output.src = reader.result;
            };
            reader.readAsDataURL(event.target.files[0]);
        };

        var previewSignature = function(event) {
            var reader = new FileReader();
            reader.onload = function() {
                var output = document.getElementById('signaturePreview');
                output.src = reader.result;
            };
            reader.readAsDataURL(event.target.files[0]);
        };
    </script>
@endpush