@extends('layouts/master',['activePage' => 'dashboard', 'titlePage' => __('Dashboard')])

@section('title', 'Academy Dashboard - Apps')

@section('vendor-style')
<!-- Vendors CSS -->
    <link rel="stylesheet" href="../../assets/vendor/libs/node-waves/node-waves.css" />
    <link rel="stylesheet" href="../../assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.css" />
    <link rel="stylesheet" href="../../assets/vendor/libs/typeahead-js/typeahead.css" />
    <link rel="stylesheet" href="../../assets/vendor/libs/datatables-bs5/datatables.bootstrap5.css" />
    <link rel="stylesheet" href="../../assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.css" />
    <link rel="stylesheet" href="../../assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.css" />
    <link rel="stylesheet" href="../../assets/vendor/libs/apex-charts/apex-charts.css" />
@endsection

@section('vendor-script')
 <!-- Vendors JS -->
    <script src="../../assets/vendor/libs/moment/moment.js"></script>
    <script src="../../assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js"></script>
    <script src="../../assets/vendor/libs/apex-charts/apexcharts.js"></script>

@endsection

@section('page-script')
<!-- Page JS -->
    <!--<script src="../../assets/js/app-academy-dashboard.js"></script>-->
@endsection

@section('content')
 

 <!-- Content -->

            <div class="container-xxl flex-grow-1 container-p-y">
              <!-- Hour chart  -->
              <!-- Welcome Card -->
<div class="card bg-transparent shadow-none my-4 border-0">
  <div class="card-body row p-0 pb-3">
    <div class="col-12 col-md-8 card-separator">
      <div class="d-flex align-items-center">
        <div class="avatar avatar-md me-3">
          <span class="avatar-initial rounded-circle bg-label-primary">
            @if(auth()->user()->gender == 'female')
              👩🏻
            @elseif(auth()->user()->gender == 'male')
              👨🏻
            @else
              👋🏻
            @endif
          </span>
        </div>
        <div>
          <h3 class="mb-1">
            @php
              date_default_timezone_set('Asia/Yangon');
$hour = date('H');
if ($hour < 12) {
    echo 'Good morning';
} elseif ($hour < 17) {
    echo 'Good afternoon';
} else {
    echo 'Good evening';
}
            @endphp
            , {{ auth()->user()->name }}!
          </h3>
          <p class="mb-0">
            @php
              $greetings = [
                "Your progress this week looks great! Keep it up!",
                "You're doing awesome work! Here's what's happening today:",
                "Great to see you! Let's check your dashboard updates.",
                "Welcome back! Ready to create something amazing today?",
                "Looking sharp today! Here's your current stats:"
              ];
              echo $greetings[array_rand($greetings)];
            @endphp
          </p>
        </div>
      </div>
    </div>
    <div class="col-12 col-md-4 pt-3 pt-md-0 text-center text-md-end">
      <div class="dropdown">
        <button class="btn btn-outline-primary" type="button">
          <i class="ti ti-calendar me-1"></i>
          {{ now()->format('l, F j') }}
        </button>
        
      </div>
    </div>
  </div>
</div>

              <!-- Hour chart End  -->
                <div class="row">
                    
                    <!-- Subscribers Card -->
<div class="col-sm-6 col-lg-3 mb-4">
    <div class="card card-border-shadow-primary">
        <div class="card-body">
            <div class="d-flex align-items-center mb-2 pb-1">
                <div class="avatar me-2">
                    <span class="avatar-initial rounded bg-label-primary">
                        <i class="ti ti-users ti-md"></i>
                    </span>
                </div>
                <h4 class="ms-1 mb-0">{{ $subscriberCount }}</h4>
            </div>
            <p class="mb-1">Total Subscribers</p>
            <p class="mb-0">
                <span class="fw-medium me-1 {{ $subscriberGrowth >= 0 ? 'text-success' : 'text-danger' }}">
                    {{ $subscriberGrowth >= 0 ? '+' : '' }}{{ $subscriberGrowth }}%
                </span>
                <small class="text-muted">than last week</small>
            </p>
        </div>
    </div>
</div>

<!-- Service Posts Card -->
<div class="col-sm-6 col-lg-3 mb-4">
    <div class="card card-border-shadow-warning">
        <div class="card-body">
            <div class="d-flex align-items-center mb-2 pb-1">
                <div class="avatar me-2">
                    <span class="avatar-initial rounded bg-label-warning">
                        <i class="ti ti-file-text ti-md"></i>
                    </span>
                </div>
                <h4 class="ms-1 mb-0">{{ $servicePostCount }}</h4>
            </div>
            <p class="mb-1">Service Posts</p>
            <p class="mb-0">
                <span class="fw-medium me-1 {{ $serviceGrowth >= 0 ? 'text-success' : 'text-danger' }}">
                    {{ $serviceGrowth >= 0 ? '+' : '' }}{{ $serviceGrowth }}%
                </span>
                <small class="text-muted">than last week</small>
            </p>
        </div>
    </div>
</div>

<!-- Regular Posts Card -->
<div class="col-sm-6 col-lg-3 mb-4">
    <div class="card card-border-shadow-info">
        <div class="card-body">
            <div class="d-flex align-items-center mb-2 pb-1">
                <div class="avatar me-2">
                    <span class="avatar-initial rounded bg-label-info">
                        <i class="ti ti-news ti-md"></i>
                    </span>
                </div>
                <h4 class="ms-1 mb-0">{{ $postCount }}</h4>
            </div>
            <p class="mb-1">Active Posts</p>
            <p class="mb-0">
                <span class="fw-medium me-1 {{ $postGrowth >= 0 ? 'text-success' : 'text-danger' }}">
                    {{ $postGrowth >= 0 ? '+' : '' }}{{ $postGrowth }}%
                </span>
                <small class="text-muted">than last week</small>
            </p>
        </div>
    </div>
</div>
<div class="col-sm-6 col-lg-3 mb-4">
    <div class="card card-border-shadow-success">
        <div class="card-body">
            <div class="d-flex align-items-center mb-2 pb-1">
                <div class="avatar me-2">
                    <span class="avatar-initial rounded bg-label-success">
                        <i class="ti ti-folders ti-md"></i>
                    </span>
                </div>
                <h4 class="ms-1 mb-0">{{ $projectPostCount }}</h4>
            </div>
            <p class="mb-1">Active Projects</p>
            <p class="mb-0">
                <span class="fw-medium me-1 {{ $projectGrowth >= 0 ? 'text-success' : 'text-danger' }}">
                    {{ $projectGrowth >= 0 ? '+' : '' }}{{ is_numeric($projectGrowth) ? $projectGrowth : '∞' }}%
                </span>
                <small class="text-muted">than last week</small>
            </p>
        </div>
    </div>
</div>

                    
                    
                
              </div>
              
              <div class="row mb-4">
    <div class="col-12">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0">Quick Actions</h5>
                <small class="text-muted">One-click access to common tasks</small>
            </div>
            <div class="card-body">
                <div class="row g-4">
                    <!-- Add Post -->
                    <div class="col-sm-6 col-md-3">
                        <div class="card h-100 cursor-pointer quick-action-card" 
                             onclick="window.location.href='{{ route('posts.create') }}'">
                            <div class="card-body text-center">
                                <div class="avatar avatar-md mx-auto mb-3">
                                    <span class="avatar-initial rounded-circle bg-label-primary">
                                        <i class="ti ti-news ti-lg"></i>
                                    </span>
                                </div>
                                <h5 class="mb-1">Add Post</h5>
                                <p class="text-muted mb-0">Create new blog post</p>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Add Service -->
                    <div class="col-sm-6 col-md-3">
                        <div class="card h-100 cursor-pointer quick-action-card" 
                             onclick="window.location.href='{{ route('services.create') }}'">
                            <div class="card-body text-center">
                                <div class="avatar avatar-md mx-auto mb-3">
                                    <span class="avatar-initial rounded-circle bg-label-warning">
                                        <i class="ti ti-file-text ti-lg"></i>
                                    </span>
                                </div>
                                <h5 class="mb-1">Add Service</h5>
                                <p class="text-muted mb-0">Create new service</p>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Add Client -->
                    <div class="col-sm-6 col-md-3">
                        <div class="card h-100 cursor-pointer quick-action-card" 
                             onclick="window.location.href='{{ route('clients.create') }}'">
                            <div class="card-body text-center">
                                <div class="avatar avatar-md mx-auto mb-3">
                                    <span class="avatar-initial rounded-circle bg-label-success">
                                        <i class="ti ti-user-plus ti-lg"></i>
                                    </span>
                                </div>
                                <h5 class="mb-1">Add Client</h5>
                                <p class="text-muted mb-0">Register new client</p>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Add Project -->
                    <div class="col-sm-6 col-md-3">
                        <div class="card h-100 cursor-pointer quick-action-card" 
                             onclick="window.location.href='{{ route('projects.create') }}'">
                            <div class="card-body text-center">
                                <div class="avatar avatar-md mx-auto mb-3">
                                    <span class="avatar-initial rounded-circle bg-label-info">
                                        <i class="ti ti-folders ti-lg"></i>
                                    </span>
                                </div>
                                <h5 class="mb-1">Add Project</h5>
                                <p class="text-muted mb-0">Create new project</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
             

            </div>
            <!-- / Content -->

@endsection