Edit File: index.blade.php
@extends('admin.layout.master') @section('css') <link rel="stylesheet" type="text/css" href="{{asset('admin/app-assets/vendors/css/tables/datatable/datatables.min.css')}}"> <link rel="stylesheet" type="text/css" href="{{asset('admin/app-assets/vendors/css/tables/datatable/extensions/dataTables.checkboxes.css')}}"> <link rel="stylesheet" type="text/css" href="{{asset('admin/app-assets/css-rtl/pages/data-list-view.css')}}"> <link rel="stylesheet" type="text/css" href="{{asset('admin/app-assets/css-rtl/core/colors/palette-gradient.css')}}"> <link rel="stylesheet" type="text/css" href="{{asset('admin/app-assets/vendors/css/extensions/sweetalert2.min.css')}}"> @endsection @section('content') <div class="row hight-card"> <div class="col-md-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between pb-0"> <h4 class="card-title">{{awtTrans('المستخدمين')}}</h4> </div> <div class="card-content"> <div class="card-body py-0"> <div id="customer-chart"></div> </div> <ul class="list-group list-group-flush customer-info"> <li class="list-group-item d-flex justify-content-between "> <div class="series-info"> <i class="fa fa-circle font-small-3 text-primary"></i> <span class="text-bold-600">{{awtTrans('المستخدمين النشطين')}}</span> </div> <div class="product-result"> <span>{{$activeUsers}}</span> </div> </li> <li class="list-group-item d-flex justify-content-between "> <div class="series-info"> <i class="fa fa-circle font-small-3 text-warning"></i> <span class="text-bold-600">{{awtTrans('المستخدمين الغير النشطين')}}</span> </div> <div class="product-result"> <span>{{$notActiveUsers}}</span> </div> </li> </ul> </div> </div> </div> <div class="col-md-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between pb-0"> <h4 class="card-title">{{awtTrans('المتاجر')}}</h4> </div> <div class="card-content"> <div class="card-body pt-0"> <div class="row"> <div class="col-sm-2 col-12 d-flex flex-column flex-wrap text-center"> <h1 class="font-large-2 text-bold-700 mt-2 mb-0">{{$stores_contracted + $google_stores}}</h1> <small>{{awtTrans('المتاجر')}}</small> </div> <div class="col-sm-10 col-12 d-flex justify-content-center"> <div id="support-tracker-chart"></div> </div> </div> <div class="chart-info d-flex justify-content-between"> <div class="text-center"> <p class="mb-50">{{awtTrans('المتاجر المتعاقدة')}} </p> <span class="font-large-1">{{$stores_contracted}}</span> </div> <div class="text-center"> <p class="mb-50">{{awtTrans(' المتاجر الغير متعاقدة ')}}</p> <span class="font-large-1">{{$google_stores}}</span> </div> </div> </div> </div> </div> </div> <!--<div class="col-lg-4 col-12">--> <!-- <div class="card">--> <!-- <div class="card-header d-flex justify-content-between pb-0">--> <!-- <h4>{{awtTrans('شركات المناديب')}}</h4>--> <!-- </div>--> <!-- <div class="card-content">--> <!-- <div class="card-body">--> <!-- <div id="product-order-chart" class="mb-3"></div>--> <!-- <div class="chart-info d-flex justify-content-between mb-1">--> <!-- <div class="series-info d-flex align-items-center">--> <!-- <i class="fa fa-circle-o text-bold-700 text-primary"></i>--> <!-- <span class="text-bold-600 ml-50">{{awtTrans('شركات المناديب النشطة')}}</span>--> <!-- </div>--> <!-- <div class="product-result">--> <!-- <span>{{$active_companies}}</span>--> <!-- </div>--> <!-- </div>--> <!-- <div class="chart-info d-flex justify-content-between mb-1">--> <!-- <div class="series-info d-flex align-items-center">--> <!-- <i class="fa fa-circle-o text-bold-700 text-warning"></i>--> <!-- <span class="text-bold-600 ml-50">{{awtTrans('شركات المناديب الغير نشطة ')}}</span>--> <!-- </div>--> <!-- <div class="product-result">--> <!-- <span>{{$notActivecompanies}}</span>--> <!-- </div>--> <!-- </div>--> <!-- <div class="chart-info d-flex justify-content-between mb-75">--> <!-- <div class="series-info d-flex align-items-center">--> <!-- <i class="fa fa-circle-o text-bold-700 text-danger"></i>--> <!-- <span class="text-bold-600 ml-50">{{awtTrans('الشركات ')}}</span>--> <!-- </div>--> <!-- <div class="product-result">--> <!-- <span>{{$active_companies + $notActivecompanies}}</span>--> <!-- </div>--> <!-- </div>--> <!-- </div>--> <!-- </div>--> <!-- </div>--> <!--</div>--> <div class="col-lg-6 col-md-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between align-items-end"> <h4 class="card-title">{{awtTrans('الدول والمدن')}}</h4> </div> <div class="card-content"> <div class="card-body pb-0"> <div id="revenue-chart"></div> </div> </div> </div> </div> <!--<div class="col-lg-3 col-12">--> <!-- <div class="card">--> <!-- <div class="card-header d-flex justify-content-between align-items-end">--> <!-- <h4>{{awtTrans('المناديب')}}</h4>--> <!-- </div>--> <!-- <div class="card-content">--> <!-- <div class="card-body pt-0">--> <!-- <div id="session-chart" class="mb-1"></div>--> <!-- <div class="chart-info d-flex justify-content-between mb-1">--> <!-- <div class="series-info d-flex align-items-center">--> <!-- <i class="feather icon-monitor font-medium-2 text-primary"></i>--> <!-- <span class="text-bold-600 mx-50">{{awtTrans('المناديب النشطين')}}</span>--> <!-- </div>--> <!-- <div class="series-result">--> <!-- <span>{{round( ($activeDelegate * 100) / ($activeDelegate + $notActiveDelegate == 0 ? 1 : $activeDelegate + $notActiveDelegate))}}%</span>--> <!-- </div>--> <!-- </div>--> <!-- <div class="chart-info d-flex justify-content-between mb-1">--> <!-- <div class="series-info d-flex align-items-center">--> <!-- <i class="feather icon-tablet font-medium-2 text-warning"></i>--> <!-- <span class="text-bold-600 mx-50">{{awtTrans('المناديب الغير النشطين')}}</span>--> <!-- </div>--> <!-- <div class="series-result">--> <!-- <span>{{round( ($notActiveDelegate * 100) / ($activeDelegate + $notActiveDelegate == 0 ? 1 : $activeDelegate + $notActiveDelegate))}}%</span>--> <!-- </div>--> <!-- </div>--> <!-- </div>--> <!-- </div>--> <!-- </div>--> <!--</div>--> <div class="col-md-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between align-items-end"> <h4 class="mb-0">{{awtTrans('المشرفين')}}</h4> </div> <div class="card-content"> <div class="card-body px-0 pb-0"> <div id="goal-overview-chart" class="mt-75"></div> <div class="row text-center mx-0"> <div class="col-6 border-top border-right d-flex align-items-between flex-column py-1"> <p class="mb-50">{{awtTrans('المشرفين النشطين')}}</p> <p class="font-large-1 text-bold-700">{{round( ($admins_active * 100) / ($admins_active + $admins_blocked == 0 ? 1 : $admins_active + $admins_blocked))}} %</p> </div> <div class="col-6 border-top d-flex align-items-between flex-column py-1"> <p class="mb-50">{{awtTrans('المشرفون المحظورون ')}}</p> <p class="font-large-1 text-bold-700">{{round( ($admins_blocked * 100) / ($admins_active + $admins_blocked == 0 ? 1 : $admins_active + $admins_blocked))}} %</p> </div> </div> </div> </div> </div> </div> <div class="col-lg-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between pb-0"> <h4 class="card-title">{{awtTrans('الطلبات الجديدة')}}</h4> </div> <div class="card-content"> <div class="card-body py-0"> <div id="new-chart"></div> </div> <ul class="list-group list-group-flush customer-info"> <li class="list-group-item d-flex justify-content-between "> <div class="series-info"> <i class="fa fa-circle font-small-3 text-warning"></i> <span class="text-bold-600">{{awtTrans('الطلبات الجديدة')}}</span> </div> <div class="product-result"> <span>{{$new_orders}}</span> </div> </li> </ul> </div> </div> </div> <div class="col-lg-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between pb-0"> <h4 class="card-title">{{awtTrans('الطلبات النشطة')}}</h4> </div> <div class="card-content"> <div class="card-body py-0"> <div id="order-chart"></div> </div> <ul class="list-group list-group-flush customer-info"> <li class="list-group-item d-flex justify-content-between "> <div class="series-info"> <i class="fa fa-circle font-small-3 text-warning"></i> <span class="text-bold-600">{{awtTrans('الطلبات النشطة')}}</span> </div> <div class="product-result"> <span>{{$active_orders}}</span> </div> </li> </ul> </div> </div> </div> <div class="col-lg-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between pb-0"> <h4 class="card-title">{{awtTrans('الطلبات المنتهية')}}</h4> </div> <div class="card-content"> <div class="card-body py-0"> <div id="finish-chart"></div> </div> <ul class="list-group list-group-flush customer-info"> <li class="list-group-item d-flex justify-content-between "> <div class="series-info"> <i class="fa fa-circle font-small-3 text-warning"></i> <span class="text-bold-600">{{awtTrans('الطلبات المنتهية')}}</span> </div> <div class="product-result"> <span>{{$finished_orders}}</span> </div> </li> </ul> </div> </div> </div> <div class="col-lg-6 col-12"> <div class="card"> <div class="card-header d-flex justify-content-between pb-0"> <h4 class="card-title">{{awtTrans('الطلبات الملغية')}}</h4> </div> <div class="card-content"> <div class="card-body py-0"> <div id="cancel-chart"></div> </div> <ul class="list-group list-group-flush customer-info"> <li class="list-group-item d-flex justify-content-between "> <div class="series-info"> <i class="fa fa-circle font-small-3 text-warning"></i> <span class="text-bold-600">{{awtTrans('الطلبات الملغية')}}</span> </div> <div class="product-result"> <span>{{$closed_orders}}</span> </div> </li> </ul> </div> </div> </div> </div> <div class="row"> @foreach($menus as $key => $menu) @php $color = $colores[array_rand($colores)] @endphp <a href="{{$menu['url']}}" class="col-xl-2 col-md-4 col-sm-6"> <div class="card text-center"> <div class="card-content"> <div class="card-body"> <div class="avatar bg-rgba-{{$color}} p-50 m-0 mb-1"> <div class="avatar-content"> <i class="feather {!! $menu['icon'] !!} text-{!! $color !!} font-medium-5"></i> </div> </div> <h2 class="text-bold-700">{{$menu['count']}}</h2> <p class="mb-0 line-ellipsis" style="color: #6e6a6a">{{$menu['name']}}</p> </div> </div> </div> </a> @endforeach </div> <div class="row"> <h3 class="col-12 d-flex mb-2">{{awtTrans('احصائيات الموقع التعريفي')}}</h3> @foreach($introSiteCards as $key => $menu) @php $color = $colores[array_rand($colores)] @endphp <a href="{{$menu['url']}}" class="col-xl-2 col-md-4 col-sm-6"> <div class="card text-center"> <div class="card-content"> <div class="card-body"> <div class="avatar bg-rgba-{{$color}} p-50 m-0 mb-1"> <div class="avatar-content"> <i class="feather {!! $menu['icon'] !!} text-{!! $color !!} font-medium-5"></i> </div> </div> <h2 class="text-bold-700">{{$menu['count']}}</h2> <p class="mb-0 line-ellipsis" style="color: #6e6a6a">{{$menu['name']}}</p> </div> </div> </div> </a> @endforeach </div> @endsection @section('js') <script src="{{asset('admin/charts_functions.js')}}"></script> <script> new ApexCharts( document.querySelector("#support-tracker-chart"), radialBarFunction(['#EA5455'] , ['#7367F0'] , ['Stores'] , [ Math.round( '{{($stores_contracted * 100) / ($google_stores + $stores_contracted == 0 ? 1 : $google_stores + $stores_contracted)}}') ]) ).render(); new ApexCharts( document.querySelector("#customer-chart"), pieChartFunction(['active', 'not active'] , [ Number('{{$activeUsers}}'), Number('{{$notActiveUsers}}')] , ['#7367F0', '#FF9F43']) ).render(); new ApexCharts( document.querySelector("#new-chart"), pieChartFunction(['new', 'total orders'] , [ Number('{{$new_orders}}'), Number('{{$orders}}')] , ['#7367F0', '#FF9F43']) ).render(); new ApexCharts( document.querySelector("#order-chart"), pieChartFunction(['active orders', 'total orders'] , [ Number('{{$active_orders}}'), Number('{{$orders}}')] , ['#7367F0', '#FF9F43']) ).render(); new ApexCharts( document.querySelector("#finish-chart"), pieChartFunction(['finished order', 'total orders'] , [ Number('{{$finished_orders}}'), Number('{{$orders}}')] , ['#7367F0', '#FF9F43']) ).render(); new ApexCharts( document.querySelector("#cancel-chart"), pieChartFunction(['canceled order', 'total orders'] , [ Number('{{$closed_orders}}'), Number('{{$orders}}')] , ['#7367F0', '#FF9F43']) ).render(); var productChart = new ApexCharts( document.querySelector("#product-order-chart"), radialBarFunction2(['#7367F0', '#FF9F43'] , [ '#8F80F9', '#FFC085'] , [ Math.round((Number('{{$active_companies}}') * 100 / (Number('{{$active_companies}}') + Number('{{$notActivecompanies}}')))) , Math.round((Number('{{$notActivecompanies}}') * 100 / (Number('{{$notActivecompanies}}') + Number('{{$active_companies}}'))))] , ['Accepted', 'Pending']) ).render(); var sessionChart = new ApexCharts( document.querySelector("#session-chart"), {{--if( {{$activeDelegate + $notActiveDelegate > 0 }}) {--}} donutFunction([Math.round(Number('{{($activeDelegate * 100) / ($activeDelegate + $notActiveDelegate == 0 ? 1 :$activeDelegate + $notActiveDelegate )}}')), Math.round(Number('{{($notActiveDelegate * 100) / ($activeDelegate + $notActiveDelegate == 0 ? 1 :$activeDelegate + $notActiveDelegate )}}'))], ['Active Delegates', 'Not Active Delegates'], ['#7367F0', '#FF9F43'], ['#A9A2F6', '#ffc085']) ).render(); var goalChart = new ApexCharts( document.querySelector("#goal-overview-chart"), radialBarFunction3([Math.round( Number('{{($admins_active * 100) / ($admins_active + $admins_blocked == 0 ? 1 :$admins_active + $admins_blocked)}}')) , Math.round(Number('{{($admins_blocked * 100) / ($admins_active + $admins_blocked == 0 ? 1 : $admins_active + $admins_blocked)}}'))]) ).render(); var revenueChartoptions = { chart: { height: 270, toolbar: { show: false }, type: 'line', }, stroke: { curve: 'smooth', dashArray: [0, 8], width: [4, 2], }, grid: { borderColor: '#e7e7e7', }, legend: { show: false, }, colors: ['#f29292', '#b9c3cd'], fill: { type: 'gradient', gradient: { shade: 'dark', inverseColors: false, gradientToColors: ['#7367F0', '#b9c3cd'], shadeIntensity: 1, type: 'horizontal', opacityFrom: 1, opacityTo: 1, stops: [0, 100, 100, 100] }, }, markers: { size: 0, hover: { size: 5 } }, xaxis: { labels: { style: { colors: '#b9c3cd', } }, axisTicks: { show: false, }, categories: ['1', '2', '3', '4', '5', '6', '7', '8' ,'9','10','11','12'], axisBorder: { show: false, }, tickPlacement: 'on', }, yaxis: { tickAmount: 5, labels: { style: { color: '#b9c3cd', }, formatter: function (val) { return val > 999 ? (val / 1000).toFixed(1) + 'k' : val; } } }, tooltip: { x: { show: false } }, series: [{ name: "{{awtTrans('البلاد')}}", data: @json($countryArray) } , { name: "{{awtTrans('المدن')}}", data: @json($cityArray) } ], } var revenueChart = new ApexCharts( document.querySelector("#revenue-chart"), revenueChartoptions ).render(); </script> @endsection
Back to File Manager