Files
website/volume/www/website/www/app/Resources/views/company/dashboard.html.twig
T
2021-03-10 11:33:09 +01:00

582 lines
26 KiB
Twig
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{# {% extends 'company/base_dashboard_company.html.twig' %} #}
{% extends 'admin/base_dashboard.html.twig' %}
{% block dashContent %}
<div class="row bg-bordered p-20">
{# <div class="col s3">
<h5 class="blue-text no-margin-top">Volumes des visites</h5>
</div>
<div class="col s9 choiceMonthWrapper right-align">
{% set thisYear = "now"|date("Y") %}
{% set thisMonth = "now"|date("m") %}
{% set thisDay = "now"|date("d") %}
{% set dateTextMoins = "now -1 Month"|date("d-m-Y") %}
{% set dateText = "now"|date("d-m-Y") %}
<input id="choiceMonth" type="text" name="daterange" value="{{ dateTextMoins }} au {{ dateText }}" />
<i class="fa fa-refresh fa-spin fa-fw"></i>
<span class="sr-only">Loading...</span>
</div>
<div class="col s12">
<canvas id="nb_visits" width="600" height="300"></canvas>
</div>
<div class="col s6 countLegend">
<p><span class="btn-countVisitsAds">&nbsp;</span>Nombre de visites de vos annonces</p>
<p><span class="btn-countVisitsCompany">&nbsp;</span>Nombre de visites de la page entreprise</p>
</div>
<div class="col s6 countBlock">
<span class="btn-countVisitsAds"><span class="countVisitsAds"></span>&nbsp;visites</span>
<span class="btn-countVisitsCompany"><span class="countVisitsCompany"></span>&nbsp;visites</span>
</div> #}
</div>
<div id="donutChart-wrapper" class="row bg-bordered p-20">
{# <div class="col s6">
<h5 class="blue-text no-margin-top">Répartition des visites</h5>
<canvas id="donught_visits" width="300" height="300"></canvas>
</div>
<div class="col s6 donutLegend countLegend">
<p><span class="btn-count btn-countVisitsTalentByCompany">&nbsp;</span>Visites de talents</p>
<p><span class="btn-count btn-countVisitsCompanyByCompany">&nbsp;</span>Visites d'entreprises</p>
<p><span class="btn-count btn-countVisitsAnonymByCompany">&nbsp;</span>Visites d'internautes non-inscrits</p>
</div> #}
</div>
{% if app.user.company.brandname == null %}
<div class=" container-fluid container-fixed-lg bg-white">
<div class="card card-transparent">
<div class="card-body">
<i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
Vous n'avez pas encore complété le profil de votre entreprise. <br>
Ces informations sont importantes au bon fonctionnement de la plateforme, nous vous invitons
<a href="{{ path('company_profile') }}">à les remplir ici. <i class="fa fa-link" aria-hidden="true"></i></a>
</div>
</div>
<script>
document.location.href = "/entreprise/me/profil";
</script>
{# {{ render("/entreprise/me/profil") }} #}
</div>
{% endif %}
<!-- START JUMBOTRON -->
<div class="jumbotron" data-pages="parallax">
<div class=" container-fluid container-fixed-lg sm-p-l-0 sm-p-r-0">
<div class="inner" style="transform: translateY(0px); opacity: 1;">
<!-- START BREADCRUMB -->
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="https://recruteur.talentstube.com/entreprise/me/">Accueil</a></li>
</ol>
<!-- END BREADCRUMB -->
</div>
</div>
</div>
<!-- END JUMBOTRON -->
<!--Boutons actions Tableau de bord -->
<div class=" container-fluid container-fixed-lg bloc-tdb">
<!-- START card -->
<div class="col-lg-12">
<div class="card card-default container">
<div class="row">
<div class="col-md">
<a href="{{path('company_ad_create')}}">
<button class="card-action" type="button">
<span class="material-icons">movie_creation</span>
<div class="row lien-fleche" style="justify-content: center; align-items: center">
<h6 class="col-10">Créer une offre demploi vidéo</h6>
<span class="material-icons col-2 fleche">arrow_right_alt</span>
</div>
</button>
</a>
</div>
<div class="col-md" type="button">
<a href="{{path('company_ad')}}">
<button class="card-action" style="" type="button">
<span class="material-icons" style="">work</span>
<div class="row lien-fleche" style="justify-content: center; align-items: center">
<h6 class="col-10">Gérer mes offres demploi</h6>
<span class="material-icons col-2 fleche">arrow_right_alt</span>
</div>
</button>
</a>
</div>
<div class="col-md" type="button">
<a href="{{path('company_answer_list')}}">
<button class="card-action" style="" type="button">
<span class="material-icons" style="">face</span>
<div class="row lien-fleche" style="justify-content: center; align-items: center">
<h6 class="col-10">Gérer mes candidatures</h6>
<span class="material-icons col-2 fleche">arrow_right_alt</span>
</div>
</button>
</a>
</div>
</div>
</div>
</div>
</div>
<!--Fin Boutons actions Tableau de bord -->
<!--Blocs statistiques Tableau de bord -->
<div class=" container-fluid container-fixed-lg bloc-tdb">
<!-- START card -->
<div class="col-lg-12">
<div class="card card-default container">
<div class="row">
<div class="col-lg text-card">
<div class="bloc-stats">
<span class="font-montserrat fs-11 all-caps">Nombre total de candidats</span>
<h3 class="bold no-margin p-b-5"><a class="bold no-margin p-b-5"
href="{{ path('company_answer_list') }}">{{nbAnswersSended}}</a></h3>
<span class="fs-12 ">Nouveaux candidats</span>
<h4 class="bold no-margin" class=""><a class="bold no-margin"
href="{{ path('company_answer_list') }}">+{{nbAnswersSended}}</a></h4>
</div>
</div>
<div class="col-lg text-card">
<div class="bloc-stats">
<span class="font-montserrat fs-11 all-caps">Visites de la page entreprise</span>
<h3 class="bold no-margin p-b-5">{{ records.totalRecordsCompany }}</h3>
<div class="row">
<div class="col-sm vertical-border" border-right: 1px solid white;>
<span class="fs-12">7 derniers jours</span>
<h4 class="bold no-margin">+{{ records7days.totalRecordsCompany }}</h4>
</div>
<div class="col-sm">
<span class="fs-12">30 derniers jours</span>
<h4 class="bold no-margin" style="opacity:0.75">+{{ records30days.totalRecordsCompany }}
</h4>
</div>
</div>
</div>
</div>
<div class="col-lg text-card">
<div class="bloc-stats">
<span class="font-montserrat fs-11 all-caps">Vues globales des offres demploi</span>
<h3 class="bold no-margin p-b-5">{{ records.totalRecords-records.totalRecordsCompany }}</h3>
<div class="row">
<div class="col-sm vertical-border">
<span class="fs-12">7 derniers jours</span>
<h4 class="bold no-margin">
+{{ records7days.totalRecords-records7days.totalRecordsCompany }}</h4>
</div>
<div class="col-sm">
<span class="fs-12">30 derniers jours</span>
<h4 class="bold no-margin" style="opacity:0.75">+{{ records30days.totalRecordsCompany }}
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Fin Blocs statistiques Tableau de bord -->
<!-- START CONTAINER FLUID -->
<!-- START CONTAINER FLUID -->
{# <div class=" container-fluid container-fixed-lg bg-white">
<!-- START card -->
<div class="card card-transparent">
<div class="card-header ">
<div class="card-title">Statistiques</div>
</div>
<div class="row">
<div class="col-lg-12 col-xl-12 col-xlg-12">
<div class="col-md-12 m-b-10" style="display:flex;">
<!-- Nombre de candidatures vidéo - START WIDGET D3 widget_graphTileFlat-->
<div class="widget-8 card m-r-15 widget-loader-bar card-header card-background-1">
<div class="container-xs-height">
<!--full-height-->
<div class="">
<!--row-xs-height -->
<div class="col-xs-height col-top">
<div class="">
<!--card-header top-left top-right -->
<div class="card-title text-card">
<span class="font-montserrat fs-11 all-caps">Nombre total de
candidats</span>
</div>
</div>
</div>
</div>
<div class="row-xs-height">
<div class="col-xs-height col-top relative">
<div class="row full-height">
<div class="col-sm-12 text-card">
<h3 class="bold no-margin p-b-5 text-card"><a
class="bold no-margin p-b-5 text-card"
href="{{ path('company_answer_list') }}">{{nbAnswersSended}}</a>
</h3>
</div>
<div class="col-sm-8">
<div
class="p-l-0 full-height d-flex flex-column justify-content-between text-card">
<p class="small m-t-5 m-b-0">
<span class="fs-12 ">Nouveaux candidats</span>
</p>
<h4 class="bold no-margin"><a class="bold no-margin"
href="{{ path('company_answer_list') }}">+{{nbAnswersSended}}</a>
</h4>
</div>
</div>
<!--<div class="col-sm-5">
<div class="p-l-0 full-height d-flex flex-column justify-content-between text-card">
<p class="small m-t-5 m-b-0">
<span class="fs-12 ">30 derniers jours</span>
</p>
<h4 class="bold no-margin" style="opacity:0.75">+48</h4>
</div>
</div>-->
</div>
<!--<div class="widget-8-chart line-chart" data-line-color="white" data-points="true" data-point-color="warning" data-stroke-width="2">
</div>-->
</div>
</div>
</div>
</div>
<!-- END WIDGET -->
<!-- Nombre de visite page entreprise vidéo - START WIDGET D3 widget_graphTileFlat-->
<div class="widget-8 card m-r-15 widget-loader-bar card-header card-background-2">
<div class="container-xs-height">
<div class="">
<!--row-xs-height -->
<div class="col-xs-height col-top">
<div class="">
<!--card-header top-left top-right -->
<div class="card-title text-card">
<span class="font-montserrat fs-11 all-caps">Visites de la page
entreprise</span>
</div>
</div>
</div>
</div>
<div class="row-xs-height">
<div class="col-xs-height col-top relative">
<div class="row full-height">
<div class="col-sm-12 text-card">
<h3 class="bold no-margin p-b-5 text-card">{{ records.totalRecordsCompany }}
</h3>
</div>
<div class="col-sm-5 vertical-border">
<div
class="p-l-0 full-height d-flex flex-column justify-content-between text-card">
<p class="small m-t-5 m-b-0">
<span class="fs-12 ">7 derniers jours</span>
</p>
<h4 class="bold no-margin">+{{ records7days.totalRecordsCompany }}</h4>
</div>
</div>
<div class="col-sm-5">
<div
class="p-l-0 full-height d-flex flex-column justify-content-between text-card">
<p class="small m-t-5 m-b-0">
<span class="fs-12 ">30 derniers jours</span>
</p>
<h4 class="bold no-margin" style="opacity:0.75">
+{{ records30days.totalRecordsCompany }}</h4>
</div>
</div>
</div>
<!--<div class="widget-8-chart line-chart" data-line-color="white" data-points="true" data-point-color="warning" data-stroke-width="2">
</div>-->
</div>
</div>
</div>
</div>
<!-- END WIDGET -->
<!-- Nombre de visites global offres d'emploi --START WIDGET D3 widget_graphTileFlat-->
<div class="widget-8 card no-margin widget-loader-bar card-header card-background-3">
<div class="container-xs-height">
<div class="">
<!--row-xs-height -->
<div class="col-xs-height col-top">
<div class="">
<!--card-header top-left top-right -->
<div class="card-title text-card">
<span class="font-montserrat fs-11 all-caps">Vues globales des offres
demploi</span>
</div>
</div>
</div>
</div>
<div class="row-xs-height">
<div class="col-xs-height col-top relative">
<div class="row full-height">
<div class="col-sm-12 text-card">
<h3 class="bold no-margin p-b-5 text-card">
{{ records.totalRecords-records.totalRecordsCompany }}</h3>
</div>
<div class="col-sm-5 vertical-border">
<div
class="p-l-0 full-height d-flex flex-column justify-content-between text-card">
<p class="small m-t-5 m-b-0">
<span class="fs-12 ">7 derniers jours</span>
</p>
<h4 class="bold no-margin">
+{{ records7days.totalRecords-records7days.totalRecordsCompany }}
</h4>
</div>
</div>
<div class="col-sm-5">
<div
class="p-l-0 full-height d-flex flex-column justify-content-between text-card">
<p class="small m-t-5 m-b-0">
<span class="fs-12 ">30 derniers jours</span>
</p>
<h4 class="bold no-margin" style="opacity:0.75">
+{{ records30days.totalRecords-records30days.totalRecordsCompany }}
</h4>
</div>
</div>
</div>
<!--<div class="widget-8-chart line-chart" data-line-color="white" data-points="true" data-point-color="warning" data-stroke-width="2">
</div>-->
</div>
</div>
</div>
</div>
<!-- END WIDGET -->
</div>
</div>
</div>
</div>
<!--class="col-lg-8 sm-p-b-10 md-p-b-10"-->
</div> #}
<!-- END card -->
{% endblock %}
{% block javascripts %}
{{ parent() }}
{# <script src="{{ asset('/js/vendors/Chart.bundle.min.js') }}"></script> #}
<script type="text/javascript">
var currentMonth = '{{ "now"|date("m") }}';
var arrayRecords; {
#
var ctx, myChart, arrayCurrentsLabel, arrayCurrentsAdsValues, arrayCurrentsCompanyValues, donughtRecords;#
}
var sumVisitsAds = 0;
var sumCompanyValues = 0;
{
#
function loadChartData() {
setArrayValues();
myChart.update();
myDoughnutChart.update();
}#
}
{
#
function getChartData(date1, date2) {
$.ajax({
type: "POST",
url: '{{ path("company_ajax_dashboard") }}',
data: 'date1=' + date1 + '&date2=' + date2,
dataType: "json",
success: function (data) {
arrayRecords = data.lineRecords;
donughtRecords = data.donughtRecords;
myDoughnutChart.data.datasets[0].data = donughtRecords;
loadChartData();
$('.fa-refresh').hide();
},
error: function (data) {
$('.fa-refresh').hide();
}
});
}#
}
{
#
document.addEventListener("DOMContentLoaded", function (event) {
$('.fa-refresh').hide();
getChartData(0, 0);
configDatePicker = {
applyBtnClass: 'btn btn-default',
format: 'DD-MM-YYYY',
separator: ' au ',
endDate: new Date(),
maxDays: 365
}
$('#choiceMonth').dateRangePicker(configDatePicker).bind('datepicker-apply', function (event, obj) {
$('.fa-refresh').show();
var month1 = obj.date1.getMonth();
var day1 = obj.date1.getDate();
var year1 = obj.date1.getFullYear();
var month2 = obj.date2.getMonth();
var day2 = obj.date2.getDate();
var year2 = obj.date2.getFullYear();
var date1 = (month1 + 1) + "/" + day1 + "/" + year1 + " 00:00:01";
var date2 = (month2 + 1) + "/" + day2 + "/" + year2 + " 23:59:59";
getChartData(date1, date2);
});
$('.apply-btn').attr('value', 'Valider');
});#
}
{
#
function setArrayValues() {
arrayCurrentsLabel = [];
arrayCurrentsAdsValues = [];
arrayCurrentsCompanyValues = [];
arrayRecords['labels'].forEach(function (element, index) {
var date = element.split("-");
var dateAffiche = date[2] + "-" + date[1] + "-" + date[0];
arrayCurrentsLabel.push(dateAffiche);
arrayCurrentsAdsValues.push(arrayRecords['datasetsAd'][index]);
arrayCurrentsCompanyValues.push(arrayRecords['datasetsCompany'][index]);
});
myChart.data.labels = arrayCurrentsLabel;
myChart.data.datasets[0].data = arrayCurrentsAdsValues;
myChart.data.datasets[1].data = arrayCurrentsCompanyValues;
if (arrayCurrentsAdsValues.length > 0) {
sumVisitsAds = arrayCurrentsAdsValues.reduce(function (memo, val) {
let value = val || 0;
if (value != null) {
return memo + value;
}
});
} else {
sumVisitsAds = 0;
}
if (arrayCurrentsCompanyValues.length > 0) {
sumCompanyValues = arrayCurrentsCompanyValues.reduce(function (memo, val) {
let value = val || 0;
if (value != null) {
return memo + value;
}
});
} else {
sumCompanyValues = 0;
}
$('.countVisitsAds').html(sumVisitsAds);
$('.countVisitsCompany').html(sumCompanyValues);
}
var dataLine = {
datasets: [{
label: "Nombre de visite d'annonce par jour",
fill: false,
fontColor: "rgba(39,139,231,1)",
backgroundColor: "rgba(39,139,231,1)",
borderColor: "rgba(39,139,231,1)"
}, {
label: "Nombre de visite de votre page entreprise",
fill: false,
fontColor: "#F9C339",
backgroundColor: "#F9C339",
borderColor: "#F9C339"
}]
};
var ctx = document.getElementById("nb_visits");
var myChart = new Chart(ctx, {
type: 'line',
data: dataLine,
options: {
legend: {
display: false
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'Date'
}
}],
yAxes: [{
ticks: {
min: 0
},
scaleLabel: {
display: true,
labelString: 'Valeur'
}
}]
}
}
});
var dataDonught = {
labels: [
"Visites de talents",
"Visites d'entreprises",
"Visites d'internautes non inscrit"
],
datasets: [{
data: donughtRecords,
backgroundColor: [
"#FF6384",
"#36A2EB",
"#FFCE56"
],
hoverBackgroundColor: [
"#FF6384",
"#36A2EB",
"#FFCE56"
]
}]
};
var ctxDonught = document.getElementById("donught_visits");
var myDoughnutChart = new Chart(ctxDonught, {
type: 'doughnut',
data: dataDonught,
options: {
legend: {
display: false,
},
animation: {
animateScale: true
}
}
});#
}
</script>
{% endblock %}