Files
monpas/application/views/monpas/compactsop/omvangcompact.php
T
2021-07-10 16:25:16 +02:00

323 lines
12 KiB
PHP

<link rel="stylesheet" type="text/css" href="<?php echo $this->config->item('vendor_url'); ?>/css/chart.css" />
<script type="text/javascript" src="<?php echo $this->config->item('vendor_url'); ?>/js_lib/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo $this->config->item('vendor_url'); ?>/js_lib/Highcharts/code/highcharts.js"></script>
<div class="sopOnderdeelBlok">
<div class="sopTitelHolder " >
<?php if($naam): ?>
<p class="sopTitel"><?php echo $naam ?></p>
<?php endif ?>
<?php if (!isset($data[1]) ): ?>
<div class="col-xs-12 sopTitel" style="width: 350px;">
<p class=" subTitel1" ><?php echo $data[0]->aantallen->naam?></p>
<span class="subTitel2">Totaal aantal leerlingen: <?php echo $data[0]->aantallen->aantal ?></span>
</div>
<?php else : ?>
<div class="col-xs-6 sopTitel" style="width: 175px;">
<p class=" subTitel1" ><?php echo $data[0]->aantallen->naam?></p>
<span class="subTitel2">Totaal aantal leerlingen: <?php echo $data[0]->aantallen->aantal ?></span>
</div>
<div class="col-xs-6 sopTitel" style="width: 175px; display: inline-block; ">
<p class="subTitel1"><?php echo $data[1]->aantallen->naam?></p>
<span class="subTitel2">Totaal aantal leerlingen: <?php echo $data[1]->aantallen->aantal;
?></span>
</div>
<?php endif ?>
</div>
<div class="sopKaderGrafiek" style="margin-top: 0; padding-top: 0;">
<?php if ((!$data[0]->tlvs && !isset($data[1] ))|| (!$data[0]->tlvs && isset($data[1]) && !$data[1]->tlvs )):?>
<div class="col-xs-12" style="margin-top: 0; padding-top: 0; text-align: center">
<span class="subTitel2" style="padding: 0">Geen TLVs</span>
</div>
<?php elseif(! isset($data[1])) : ?>
<div class="col-xs-12" style="margin-top: 0; padding-top: 0; text-align: center">
<span class="subTitel2" style="padding: 0">TLVs per zorgzwaarte</span>
</div>
<div class="col-xs-12" style="border: 1px #ff0000; margin: 0; padding: 0">
<div id="tlvs" style="width: 300px; height: 150px;">
</div>
</div>
<?php else: ?>
<div class="col-xs-12" style="margin-top: 0; padding-top: 0; text-align: center">
<span class="subTitel2" style="padding: 0">TLVs per zorgzwaarte</span>
</div>
<div class="col-xs-6" style="border: 1px #ff0000; margin: 0; padding: 0">
<?php if($data[0]->tlvs) : ?>
<div id="tlvs" style="width: 175px; height: 150px; margin: 0 auto; padding: 0">
</div>
<?php else : ?>
<div class="subTitel2" style="width: 175px; text-align: center; padding-top: 50px;">Geen TLVs</div>
<?php endif ?>
</div>
<div class="col-xs-6" style="border: 1px #ff0000; margin: 0; padding: 0">
<?php if($data[1]->tlvs) : ?>
<div id="tlvsII" style="width: 175px; height: 150px; margin: 0 auto;padding: 0">
</div>
<?php else : ?>
<div class="subTitel2" style="width: 175px; text-align: center; padding-top: 50px;">Geen TLVs</div>
<?php endif ?>
</div>
<?php endif ?>
<?php if ((!$data[0]->arrangementen && !isset($data[1] ))|| (!$data[0]->arrangementen && isset($data[1]) && !$data[1]->arrangementen )):?>
<div class="col-xs-12" style="margin-top: 0; padding-top: 0; text-align: center">
<span class="subTitel2" style="padding: 0">Geen arrangementen</span>
</div>
<?php elseif(! isset($data[1])) : ?>
<div class="col-xs-12" style="margin-top:0 ; padding-top: 0; text-align: center">
<span class="subTitel2" style="padding: 0">Leerlingen per arrangement</span>
</div>
<div class="col-xs-12" style="border: 1px #ff0000; margin: 0 auto ; padding: 0">
<div id="arrs" style="width: 300px; height: 150px;">
</div>
</div>
<?php else: ?>
<div class="col-xs-12" style="margin-top: 0; padding-top: 0; text-align: center">
<span class="subTitel2" style="padding: 0">Leerlingen per arrangement</span>
</div>
<div class="col-xs-6" style="border: 1px #ff0000; margin: 0; padding: 0">
<?php if($data[0]->arrangementen) : ?>
<div id="arrs" style="width: 175px; height: 150px; margin: 0 auto; padding: 0">
</div>
<?php else : ?>
<div class="subTitel2" style="width: 175px; text-align: center; padding-top: 50px;">Geen arrangementen</div>
<?php endif ?>
</div>
<div class="col-xs-6" style="border: 1px #ff0000; margin: 0 auto; padding: 0">
<?php if($data[1]->arrangementen) : ?>
<div id="arrsII" style="width: 175px; height: 150px; margin: 0 auto; padding: 0">
</div>
<?php else : ?>
<div class="subTitel2" style="width: 175px; text-align: center; padding-top: 50px;">Geen arrangementen</div>
<?php endif ?>
</div>
<?php endif ?>
</div>
<script>
// Build the chart
$(function(){
<?php if(($data[0]->tlvs)) : ?>
var pieID = 'tlvs';
var aantallen = [
<?php foreach($data[0]->tlvs as $tlv): ?>
<?php if($tlv->zwaarte == 'HOOG'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') so hoog',
y: <?= intval($tlv->aantal) ?>,
color: '#4d9900'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'MIDDEN'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') so midden',
y: <?= intval($tlv->aantal) ?>,
color: '#66cc00'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'LAAG'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') so laag',
y: <?= intval($tlv->aantal) ?>,
color: '#d9ffb3'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'ZWAAR'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') sbo zwaar',
y: <?= intval($tlv->aantal) ?>,
color: '#005c99'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'LICHT'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') sbo licht',
y: <?= intval($tlv->aantal) ?>,
color: '#99d6ff'
},
<?php endif; ?>
<?php endforeach; ?>
]
maakPie(pieID, aantallen);
<?php endif ?>
<?php if(isset($data[1] ) && $data[1]->tlvs) : ?>
var pieID = 'tlvsII'
var aantallen2 = [
<?php foreach($data[1]->tlvs as $tlv): ?>
<?php if($tlv->zwaarte == 'HOOG'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') so hoog',
y: <?= intval($tlv->aantal) ?>,
color: '#4d9900'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'MIDDEN'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') so midden',
y: <?= intval($tlv->aantal) ?>,
color: '#66cc00'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'LAAG'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') so laag',
y: <?= intval($tlv->aantal) ?>,
color: '#d9ffb3'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'ZWAAR'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') sbo zwaar',
y: <?= intval($tlv->aantal) ?>,
color: '#005c99'
},
<?php endif; ?>
<?php if($tlv->zwaarte == 'LICHT'): ?>
{
name: '(' + <?=$tlv->aantal?> + ') sbo licht',
y: <?= intval($tlv->aantal) ?>,
color: '#99d6ff'
},
<?php endif; ?>
<?php endforeach; ?>
]
maakPie(pieID, aantallen2);
<?php endif ?>
<?php if($data[0]->arrangementen) : ?>
var pieID = 'arrs';
var arrs = [];
<?php $llnoverig = 0; ?>
var overigearrs = false;
<?php foreach($data[0]->arrangementen as $index => $arr): ?>
<?php if($index > 11) : ?>
<?php $llnoverig = $llnoverig + intval($arr->aantal)?>
overigearrs = true
<?php else: ?>
arrs.push({
name: '<?='(' .$arr->aantal .')'. $arr->leeftijd . ':'.$arr->naamkort ?>',
y: <?= intval($arr->aantal) ?>,
//color: '<?//= $arr->kleur ?>//'
})
<?php endif ?>
<?php endforeach; ?>
if(overigearrs){
arrs.push({
name: 'overig',
y: <?= intval($llnoverig) ?>,
color: '#e6e6e6'
})
}
maakPie(pieID, arrs);
<?php endif ?>
<?php $llnoverig = 0; ?>
var overigearrs = false;
<?php if(isset($data[1]) && $data[1]->arrangementen) : ?>
var pieID = 'arrsII';
var arrs2 = []
<?php foreach($data[1]->arrangementen as $index => $arr): ?>
<?php if($index > 11) : ?>
<?php $llnoverig = $llnoverig + intval($arr->aantal)?>
overigearrs = true
<?php else: ?>
arrs2.push({
name: '<?='(' .$arr->aantal .')'. $arr->leeftijd . ':'.$arr->naamkort ?>',
y: <?= intval($arr->aantal) ?>,
//color: '<?//= $arr->kleur ?>//'
})
<?php endif ?>
<?php endforeach; ?>
if(overigearrs){
arrs.push({
name: 'overig',
y: <?= intval($llnoverig) ?>,
color: '#e6e6e6'
})
}
maakPie(pieID, arrs2);
<?php endif ?>
});
function maakPie(pieID, punten) {
Highcharts.chart(pieID, {
chart: {
backgroundColor: 'transparent',
plotBorderWidth: null,
plotShadow: false,
type: 'pie',
margin: [0,-10, 0, -80]
},
title: {
text: null,
margin: 0,
},
credits: {
enabled: false
},
plotOptions: {
pie: {
// allowPointSelect: true,
size: 95,
padding: 0,
// cursor: 'pointer',
dataLabels: {
enabled: false,
},
showInLegend: true,
},
},
legend: {
itemStyle: {
fontWeight: '200',
fontSize: '8px',
},
align: 'right',
symbolPadding: 1,
padding: 0,
verticalAlign: 'top',
floating: true,
x: 10,
y: 0,
width: 80,
itemWidth: 80,
itemDistance: 0,
},
series: [{
name: 'tlvs',
// colorByPoint: true,
data: punten
}]
});
}
</script>
</div>