@extends('layouts.admin')
@section('page-title')
Dashboard
@endsection

@section('content')

<div class="row mb-3">
  <div class="col-xl-4 col-md-6 mb-4">
      <div class="card h-100">
        <div class="card-body">
          <div class="row no-gutters align-items-center">
            <div class="col mr-2">
              <div class="text-xs font-weight-bold text-uppercase mb-1">Total Gifts</div>
              <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $gift_count }}</div>
            </div>
            <div class="col-auto">
              <i class="fas fa-gift fa-2x text-success"></i>
            </div>
          </div>
        </div>
      </div>
  </div>
  <div class="col-xl-4 col-md-6 mb-4">
    <div class="card h-100">
      <div class="card-body">
        <div class="row no-gutters align-items-center">
          <div class="col mr-2">
            <div class="text-xs font-weight-bold text-uppercase mb-1">Total Users</div>
            <div class="h5 mb-0 font-weight-bold text-gray-800">{{$user_count}}</div>
          </div>
          <div class="col-auto">
            <i class="fas fa-user fa-2x text-success"></i>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="col-xl-4 col-md-6 mb-4">
    <div class="card h-100">
      <div class="card-body">
        <div class="row no-gutters align-items-center">
          <div class="col mr-2">
            <div class="text-xs font-weight-bold text-uppercase mb-1">News Letters</div>
            <div class="h5 mb-0 font-weight-bold text-gray-800">{{$newsletter}}</div>
          </div>
          <div class="col-auto">
            <i class="fas fa-book fa-2x text-success"></i>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<form action="{{ route('save_social_medial') }}" method="POST" enctype="multipart/form-data">
  @csrf
  <h2>Social Media Links</h2>
<div class="row mb-3">

    <div class="col-xl-6 col-md-6 mb-4">
      <label for="">Facebook</label>
      <input type="text" name="facebook" value="{{ $settings->facebook }}" class="form-control">
    </div>
    <div class="col-xl-6 col-md-6 mb-4">
      <label for="">Twitter</label>
      <input type="text" name="tweeter" value="{{ $settings->tweeter }}" class="form-control">
    </div>
    <div class="col-xl-6 col-md-6 mb-4">
      <label for="">Linked In</label>
      <input type="text" name="linkedIn" value="{{ $settings->linkedIn }}" class="form-control">
    </div>
    <div class="col-xl-6 col-md-6 mb-4">
      <label for="">Instagram</label>
      <input type="text" name="instagram" value="{{ $settings->instagram }}" class="form-control">
    </div>
    <div class="col-xl-6 col-md-6 mb-4">
      <label for="">Logo</label>
      <input type="file" name="logo" class="form-control" id="imgInp">
    </div>
    <div class="col-xl-6 col-md-6 mb-4">
      <img src="{{ $settings->logo ? asset($settings->logo) : '' }}"  id="blah" width="525px" height="250px">
    </div>

    <div class="col">
      <button type="submit" class="btn btn-primary">Update</button>
    </div>

</div>
</form>
@endsection

@section('js')
  <script>
    function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#blah').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

    $("#imgInp").change(function(){
        readURL(this);
    });
  </script>
@endsection