File: /var/www/vhost/disk-apps/agile-selling-mia/resources/views/home.blade.php
@extends('modules.head')
@section('contenido')
<div class="row">
<div class="col-md-3 col-sm-6 col-xs-12">
<a href="{{url('/deliveryMan')}}" class="card-home">
<div class="info-box">
<span class="info-box-icon bg-aqua">
<i class="fa fa-envelope-o itarget"></i>
</span>
<div class="info-box-content">
<span class="info-box-text">{{ Lang::get('messages.screen_home_tag1')}}</span>
<span class="info-box-number">{{$deliveryMan}}</span>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-xs-12">
<a href="{{url('/orders')}}" class="card-home">
<div class="info-box">
<span class="info-box-icon bg-red">
<i class="ion ion-ios-paperplane-outline itarget"></i>
</span>
<div class="info-box-content">
<span class="info-box-text">{{ Lang::get('messages.screen_home_tag2')}}</span>
<span class="info-box-number" id="cant_transfer">{{$transfer}}</span>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
<!-- fix for small devices only -->
<div class="clearfix visible-sm-block"></div>
<div class="col-md-3 col-sm-6 col-xs-12">
<a href="{{url('/orders')}}" class="card-home">
<div class="info-box">
<span class="info-box-icon bg-green">
<i class="ion ion-ios-cart-outline itarget"></i>
</span>
<div class="info-box-content">
<span class="info-box-text">{{ Lang::get('messages.screen_home_tag3')}}</span>
<span class="info-box-number" id="cant_orders">{{$orders}}</span>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-xs-12">
<a href="{{url('/clients')}}" class="card-home">
<div class="info-box">
<span class="info-box-icon bg-yellow">
<i class="ion ion-ios-people-outline itarget"></i>
</span>
<div class="info-box-content">
<span class="info-box-text">{{ Lang::get('messages.screen_home_tag4')}}</span>
<span class="info-box-number">{{$clients}}</span>
</div>
<!-- /.info-box-content -->
</div>
</a>
<!-- /.info-box -->
</div>
<!-- /.col -->
</div>
<div class="row"
style="margin-bottom: 15px; background-color: #fff; padding-bottom: 8px;padding-top: 8px; margin-right: 0px;margin-left: 0px;">
<div class="col-xs-2" style="display: flex; align-items:center; margin-top: 10px;">
<label style="margin-right:2%;">{{ Lang::get('messages.screen_home_tag5')}}:</label>
<select class="form-control" name="estado" id="select-filter-graphics-year">
@if(count($average)>0)
@foreach($average as $value)
@if($currentYear==$value->year)
<option value="{{$value->year}}" selected="selected"> {{$value->year}}</option>
@else
<option value="{{$value->year}}">
{{$value->year}}
</option>
@endif
@endforeach
@else
<option value="{{$currentYear}}">
{{$currentYear}}
</option>
@endif
</select>
</div>
<div class="col-xs-2" style="display: flex; align-items:center; margin-top: 10px;">
<label style="margin-right:2%;">{{ Lang::get('messages.screen_home_tag6')}}:</label>
<select class="form-control" name="estado" id="select-filter-graphics-month">
<option id="idselected" value="ninguna" selected="selected">{{ Lang::get('messages.screen_home_tag7')}}
</option>
<option value="1">{{ Lang::get('messages.Enero') }}</option>
<option value="2">{{ Lang::get('messages.Febrero') }}</option>
<option value="3">{{ Lang::get('messages.Marzo') }}</option>
<option value="4">{{ Lang::get('messages.Abril') }}</option>
<option value="5">{{ Lang::get('messages.Mayo') }}</option>
<option value="6">{{ Lang::get('messages.Junio') }}</option>
<option value="7">{{ Lang::get('messages.Julio') }}</option>
<option value="8">{{ Lang::get('messages.Agosto') }}</option>
<option value="9">{{ Lang::get('messages.Septiembre') }}</option>
<option value="10">{{ Lang::get('messages.Octubre') }}</option>
<option value="11">{{ Lang::get('messages.Noviembre') }}</option>
<option value="12">{{ Lang::get('messages.Diciembre') }}</option>
</select>
</div>
@if(Auth::user()->rol->id==1 || Auth::user()->rol->id==6)
<div class="col-xs-5" style="display: flex; align-items:center; margin-top: 10px;">
<label style="margin-right:2%;">{{ Lang::get('messages.screen_products_tag55')}}</label>
<select class="form-control" name="estado" id="select-filter-graphics-sucursals">
<option value="todos" selected="selected">{{ Lang::get('messages.screen_home_tag7')}}</option>
@foreach($sucursals as $sucu)
@if(Auth::user()->userInfo->sucursal->id==$sucu->id)
<option value="{{$sucu->id}}">
{{$sucu->name}}
</option>
@else
<option value="{{$sucu->id}}">
{{$sucu->name}}
</option>
@endif
@endforeach
@if($ecommerceVerif == true)
<option value="ec">E-commerce</option>
@endif
</select>
</div>
@endif
<div class="col-xs-2" style="margin-top: 10px;">
<div class="input-group-btn">
<button type="button" class="btn btn-default" id="btn-filter-graphics">
<i class="fa fa-search" style="margin-right:4px;"></i>{{ Lang::get('messages.screen_home_tag8')}}
</button>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="box box-info">
<div class="box-header with-border">
<h3 class="box-title">Usuarios conectados ultimos 7 dias</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body" id="content-chart">
<canvas id="lineChart" width="803" height="401" class="chartjs-render-monitor" style="display: block; width: 803px; height: 401px;"></canvas>
</div>
</div>
</div>
<div class="col-md-6">
<div class="box box-info">
<div class="box-header with-border">
<h3 class="box-title">Usuarios nuevos ultimos 3 meses</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
</div>
</div>
<div class="box-body">
<div class="chart">
<canvas id="lineChartMonth" width="803" height="401" class="chartjs-render-monitor" style="display: block; width: 803px; height: 401px;"></canvas>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-6">
<div class="box box-sucess">
<div class="box-header with-border">
<h3 class="box-title">
<font>
<font>{{ Lang::get('messages.screen_home_tag9')}}</font>
</font>
</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse">
<i class="fa fa-minus"></i>
</button>
</div>
</div>
<div class="box-body" id="content-tiempos">
{{--
<canvas id="myChart" style="height: 204px; width: 409px;" width="409" height="204"></canvas> --}}
<canvas id="tiempos" width="803" height="401" class="chartjs-render-monitor"
style="display: block; width: 803px; height: 401px;"></canvas>
</div>
<!-- /.box-body -->
</div>
</div>
<div class="col-xs-6">
<div class="box box-sucess">
<div class="box-header with-border">
<h3 class="box-title">
<font>
<font>{{ Lang::get('messages.screen_home_tag10')}}</font>
</font>
</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse">
<i class="fa fa-minus"></i>
</button>
</div>
</div>
<div class="box-body" id="content-estado">
<canvas id="estados" width="803" height="401" class="chartjs-render-monitor"
style="display: block; width: 803px; height: 401px;"></canvas>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="box box-sucess">
<div class="box-header with-border">
<h3 class="box-title">
<font>
<font>{{ Lang::get('messages.screen_home_tag11')}}</font>
</font>
</h3>
<div class="box-tools pull-right">
<button type="button" class="btn btn-box-tool" data-widget="collapse">
<i class="fa fa-minus"></i>
</button>
</div>
</div>
<div class="box-body" id="content-ventas">
{{--
<canvas id="myChart" style="height: 204px; width: 409px;" width="409" height="204"></canvas> --}}
<canvas id="ventas" width="803" height="301" class="chartjs-render-monitor"
style="display: block; width: 803px; height: 401px;"></canvas>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
<script src="{{ asset('js/jQuery/jquery-2.2.3.min.js') }}"></script>
<script src="{{ asset('js/chart/Chart.min.js')}}"></script>
<script src="{{ asset('js/bootstrap/js/bootstrap.min.js') }}"></script>
<script src="{{ asset('js/home.js') }}"></script>
<script>
$(function () {
$.ajax({
url: "/chartConnect",
type: "GET",
contentType: "application/json",
headers: {
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
"Content-Type": "application/json",
},
success: function (r) {
if(r.r){
var labels = [];
var data = [];
for (let i = 0; i < r.d.length; i++) {
const item = r.d[i];
labels.push(item.date);
data.push(item.visitors);
}
var ctx3 = document.getElementById("lineChart").getContext("2d");
var chart3 = new Chart(ctx3, {
type: "line",
data: {
labels,
datasets: [
{
label: "Visitas",
data,
datasets: [
{
label: "Digital Goods",
fillColor: "rgba(60,141,188,0.9)",
strokeColor: "rgba(60,141,188,0.8)",
pointColor: "#3b8bba",
pointStrokeColor: "rgba(60,141,188,1)",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(60,141,188,1)",
},
],
},
],
},
});
}
},
});
$.ajax({
url: "/chartRegister",
type: "GET",
contentType: "application/json",
headers: {
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
"Content-Type": "application/json",
},
success: function (r) {
if(r.r){
var labelsMonth = [];
var dataMonth = [];
for (let j = 0; j < r.d.length; j++) {
const value = r.d[j];
labelsMonth.push(getMonth(value.date));
dataMonth.push(value.register);
}
var ctx3 = document.getElementById("lineChartMonth").getContext("2d");
var chart3 = new Chart(ctx3, {
type: "line",
data: {
labels: labelsMonth,
datasets: [
{
label: "Usuarios Nuevos",
data: dataMonth,
datasets: [
{
label: "Digital Goods",
fillColor: "rgba(60,141,188,0.9)",
strokeColor: "rgba(60,141,188,0.8)",
pointColor: "#3b8bba",
pointStrokeColor: "rgba(60,141,188,1)",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(60,141,188,1)",
},
],
},
],
},
});
}
},
});
});
function getMonth(monthNumber){
if(monthNumber && monthNumber != ""){
if(monthNumber == "01"){
return Lang.get("messagesClient.Enero");
}
if(monthNumber == "02"){
return Lang.get("messagesClient.Febrero");
}
if(monthNumber == "03"){
return Lang.get("messagesClient.Marzo");
}
if(monthNumber == "04"){
return Lang.get("messagesClient.Abril");
}
if(monthNumber == "05"){
return Lang.get("messagesClient.Mayo");
}
if(monthNumber == "06"){
return Lang.get("messagesClient.Junio");
}
if(monthNumber == "07"){
return Lang.get("messagesClient.Julio");
}
if(monthNumber == "08"){
return Lang.get("messagesClient.Agosto");
}
if(monthNumber == "09"){
return Lang.get("messagesClient.Septiembre");
}
if(monthNumber == "10"){
return Lang.get("messagesClient.Octubre");
}
if(monthNumber == "11"){
return Lang.get("messagesClient.Noviembre");
}
if(monthNumber == "12"){
return Lang.get("messagesClient.Diciembre");
}
}
return "";
}
</script>
@endsection