{% extends "grievance/admin/base.html" %}
{% set path = "dashboard" %}
{% set subpath = "dashboard" %}
{% block content %}
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
  <!-- Content Header (Page header) -->
  {% with messages = get_flashed_messages() %}
  {% if messages %}
    <ul class=flashes>
    {% for message in messages %}
      <h2><b><center style="color:green">{{ message }}</center></b></h2>
    {% endfor %}
    </ul>
  {% endif %}
{% endwith %}

<!-- Start::app-content -->
        <div class="main-content app-content">
            <div class="container-fluid">

                <!-- Start::page-header -->

                <div class="d-md-flex d-block align-items-center justify-content-between my-4 page-header-breadcrumb">
                    <div>
                        <p class="fw-semibold fs-18 mb-0">Welcome back, {{adminDict.userName}} !</p>
                        <!-- <span class="fs-semibold text-muted">Track your sales activity, leads and deals here.</span> -->
                    </div>
                </div>

                 <!-- End::page-header -->
                                    <div class="row">
                                    <div class="col-xxl-4 col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                        <div class="card custom-card">
                                            <div class="card-body">
                                                <div class="d-flex flex-wrap align-items-top">
                                                    <div class="me-3 lh-1">
                                                        <span class="avatar avatar-lg bg-primary">
                                                            <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zM9 4h2v5l-1-.75L9 9V4zm9 16H6V4h1v9l3-2.25L13 13V4h5v16z"/></svg>
                                                        </span>
                                                    </div>
                                                    <div>
                                                        <p class="mb-1 text-muted">All Grievance Count</p>
                                                        <h5 class="fw-semibold mb-2">{{adminDict.grievancesCount}}</h5>
                                                        <!-- <p class="fs-11 text-muted mb-0"><span class="text-success fw-semibold">0.25%<i class="ri-arrow-up-s-line align-middle mx-1"></i></span> This month</p> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-xxl-4 col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                        <div class="card custom-card">
                                            <div class="card-body">
                                                <div class="d-flex flex-wrap align-items-top">
                                                    <div class="me-3 lh-1">
                                                        <span class="avatar avatar-lg bg-primary">
                                                            <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zM9 4h2v5l-1-.75L9 9V4zm9 16H6V4h1v9l3-2.25L13 13V4h5v16z"/></svg>
                                                        </span>
                                                    </div>
                                                    <div>
                                                        <p class="mb-1 text-muted">Pending Grievance Count</p>
                                                        <h5 class="fw-semibold mb-2">{{adminDict.grievancesPendingCount}}</h5>
                                                        <!-- <p class="fs-11 text-muted mb-0"><span class="text-success fw-semibold">0.25%<i class="ri-arrow-up-s-line align-middle mx-1"></i></span> This month</p> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                        <div class="card custom-card">
                                            <div class="card-body">
                                                <div class="d-flex flex-wrap align-items-top">
                                                    <div class="me-3 lh-1">
                                                        <span class="avatar avatar-lg bg-primary">
                                                            <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zM9 4h2v5l-1-.75L9 9V4zm9 16H6V4h1v9l3-2.25L13 13V4h5v16z"/></svg>
                                                        </span>
                                                    </div>
                                                    <div>
                                                        <p class="mb-1 text-muted">Accepted Grievance Count</p>
                                                        <h5 class="fw-semibold mb-2">{{adminDict.grievancesAcceptCount}}</h5>
                                                        <!-- <p class="fs-11 text-muted mb-0"><span class="text-success fw-semibold">0.25%<i class="ri-arrow-up-s-line align-middle mx-1"></i></span> This month</p> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                        <div class="card custom-card">
                                            <div class="card-body">
                                                <div class="d-flex flex-wrap align-items-top">
                                                    <div class="me-3 lh-1">
                                                        <span class="avatar avatar-lg bg-primary">
                                                            <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M18 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zM9 4h2v5l-1-.75L9 9V4zm9 16H6V4h1v9l3-2.25L13 13V4h5v16z"/></svg>
                                                        </span>
                                                    </div>
                                                    <div>
                                                        <p class="mb-1 text-muted">Rejected Grievance Count</p>
                                                        <h5 class="fw-semibold mb-2">{{adminDict.grievancesRejectCount}}</h5>
                                                        <!-- <p class="fs-11 text-muted mb-0"><span class="text-success fw-semibold">0.25%<i class="ri-arrow-up-s-line align-middle mx-1"></i></span> This month</p> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                        <div class="card custom-card">
                                            <div class="card-body">
                                                <div class="d-flex flex-wrap align-items-top">
                                                    <div class="me-3 lh-1">
                                                        <span class="avatar avatar-lg bg-secondary">
                                                            <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0,0h24v24H0V0z" fill="none"/><g><path d="M19.5,3.5L18,2l-1.5,1.5L15,2l-1.5,1.5L12,2l-1.5,1.5L9,2L7.5,3.5L6,2v14H3v3c0,1.66,1.34,3,3,3h12c1.66,0,3-1.34,3-3V2 L19.5,3.5z M15,20H6c-0.55,0-1-0.45-1-1v-1h10V20z M19,19c0,0.55-0.45,1-1,1s-1-0.45-1-1v-3H8V5h11V19z"/><rect height="2" width="6" x="9" y="7"/><rect height="2" width="2" x="16" y="7"/><rect height="2" width="6" x="9" y="10"/><rect height="2" width="2" x="16" y="10"/></g></svg>
                                                        </span>
                                                    </div>
                                                    <div>
                                                        <p class="mb-1 text-muted">Departments Count</p>
                                                        <h5 class="fw-semibold mb-2">{{adminDict.departmentsCount}}</h5>
                                                        <!-- <p class="fs-11 text-muted mb-0"><span class="text-success fw-semibold">0.74%<i class="ri-arrow-up-s-line align-middle mx-1"></i></span> This month</p> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-xl-4 col-lg-4 col-md-4 col-sm-4 col-12">
                                        <div class="card custom-card">
                                            <div class="card-body">
                                                <div class="d-flex flex-wrap align-items-top">
                                                    <div class="me-3 lh-1">
                                                        <span class="avatar avatar-lg bg-success">
                                                            <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><path d="M0,0h24v24H0V0z" fill="none"/></g><g><g><path d="M21.41,11.41l-8.83-8.83C12.21,2.21,11.7,2,11.17,2H4C2.9,2,2,2.9,2,4v7.17c0,0.53,0.21,1.04,0.59,1.41l8.83,8.83 c0.78,0.78,2.05,0.78,2.83,0l7.17-7.17C22.2,13.46,22.2,12.2,21.41,11.41z M12.83,20L4,11.17V4h7.17L20,12.83L12.83,20z"/><circle cx="6.5" cy="6.5" r="1.5"/></g></g></svg>
                                                        </span>
                                                    </div>
                                                    <div>
                                                        <p class="mb-1 text-muted">Grievance Departments Users Count</p>
                                                        <h5 class="fw-semibold mb-2">{{adminDict.grievancesDeparmentsUsersCount}}</h5>
                                                        <!-- <p class="fs-11 text-muted mb-0"><span class="text-success fw-semibold">1.52%<i class="ri-arrow-up-s-line align-middle mx-1"></i></span> This month</p> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                            <!-- <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                                <div class="card custom-card">
                                    <div class="card-body">
                                        <div class="d-flex flex-wrap align-items-top">
                                            <div class="me-3 lh-1">
                                                <span class="avatar avatar-lg bg-warning">
                                                    <svg class="svg-white" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><path d="M12,2C6.48,2,2,6.48,2,12s4.48,10,10,10s10-4.48,10-10S17.52,2,12,2z M12,20c-4.41,0-8-3.59-8-8c0-4.41,3.59-8,8-8 s8,3.59,8,8C20,16.41,16.41,20,12,20z M12.89,11.1c-1.78-0.59-2.64-0.96-2.64-1.9c0-1.02,1.11-1.39,1.81-1.39 c1.31,0,1.79,0.99,1.9,1.34l1.58-0.67c-0.15-0.44-0.82-1.91-2.66-2.23V5h-1.75v1.26c-2.6,0.56-2.62,2.85-2.62,2.96 c0,2.27,2.25,2.91,3.35,3.31c1.58,0.56,2.28,1.07,2.28,2.03c0,1.13-1.05,1.61-1.98,1.61c-1.82,0-2.34-1.87-2.4-2.09L8.1,14.75 c0.63,2.19,2.28,2.78,3.02,2.96V19h1.75v-1.24c0.52-0.09,3.02-0.59,3.02-3.22C15.9,13.15,15.29,11.93,12.89,11.1z"/></g></svg>
                                                </span>
                                            </div>
                                            <div>
                                                <p class="mb-1 text-muted">Total Revenue</p>
                                                <h5 class="fw-semibold mb-2">$7,63,129.09</h5>
                                                <p class="fs-11 text-muted mb-0"><span class="text-danger fw-semibold">0.124%<i class="ri-arrow-down-s-line align-middle mx-1"></i></span> This month</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div> -->

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- End::row-1 -->

            </div>
        </div>
        <!-- End::app-content -->

  

  </section>


<script type="text/javascript" src="https://cdn.canvasjs.com/jquery.canvasjs.min.js"></script>
</div>
     {%endblock%}