<!-- DataTables -->
<link rel="stylesheet"
	  href="<?= base_url('<link rel="stylesheet" 
	href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap.min.css">') ?>">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css"/>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css">
<link rel="stylesheet" href="<?= base_url('bower_components/toastr/toastr.css') ?>">

<?php

use Brick\Money\Money;

$context = new \Brick\Money\Context\AutoContext();
?>

<div class="content-wrapper">
	<!-- Content Header (Page header) -->
	<section class="content-header">

		<h1>
			Nano crédit <?= $network . ' - ' . $country; ?>
		</h1>
		<?php
		

		if ($alert == "ok") {

			if (!$success == "ok") {
				?>
				<div class='alert alert-danger alert-dismissible col-xs-6'>
					<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button>
					<h4><i class='icon fa fa-ban'></i> Erreur!</h4>
					<?= $message; ?>
				</div>

				<?php
			} else {
				?>
				<div class="alert alert-success alert-dismissible col-xs-6">
					<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
					<h4><i class="icon fa fa-check"></i> Success!</h4>
					<?= $message; ?>
				</div>

				<?php
			}
		}
		?>

	</section>

	<section class="content">
		<div class="row">
			<div class="col-lg-4 col-xs-6">
				<div class="small-box bg-green-active">
					<div class="inner">
						<h3><?= Money::of(round($CE, 2), $currency_code, $context)->formatTo('fr_FR') ?></h3>
						<p><?= $this->lang->line('borrowing_capacity') ?></p>
					</div>
					<div class="icon">
						<i class="ion ion-cash"></i>
					</div>
				</div>
			</div>

			<div class="col-lg-4 col-xs-6">
				<div class="small-box bg-red">
					<div class="inner">
						<h3><?= Money::of(round($group->limite_credit, 2), $currency_code, $context)->formatTo('fr_FR') ?></h3>
						<p><?= $this->lang->line('credit_limit') ?></p>
					</div>
					<div class="icon">
						<i class="ion ion-cash"></i>
					</div>
				</div>
			</div>

			<div class="col-lg-4 col-xs-6">
				<div class="small-box bg-blue-active">
					<div class="inner">
						<h3><?= $group->nombre_utilisateurs ?></h3>
						<p><?= $this->lang->line('number_of_members') ?></p>
					</div>
					<div class="icon">
						<i class="fa fa-group"></i>
					</div>
				</div>
			</div>

		</div>

		<div class="row">
			<div class="col-lg-3 col-xs-6">
				<div class="small-box bg-green">
					<div class="inner">
						<h4><strong><?=$group->createur ?></strong></h4>
						<p><?= $this->lang->line('creator') ?></p>
					</div>
				</div>
			</div>

			<div class="col-lg-3 col-xs-6">
				<div class="small-box bg-blue">
					<div class="inner">
						<h4><strong><?=$group->sponsor1 ?></strong></h4>
						<p>Sponsor 1</p>
					</div>
				</div>
			</div>

			<div class="col-lg-3 col-xs-6">
				<div class="small-box bg-blue">
					<div class="inner">
						<h4><strong><?=$group->sponsor2 ?></strong></h4>
						<p>Sponsor 2</p>
					</div>
				</div>
			</div>

			<div class="col-lg-3 col-xs-6">
				<div class="small-box bg-blue">
					<div class="inner">
						<h4><strong><?=$group->sponsor3 ?></strong></h4>
						<p>Sponsor 3</p>
					</div>
				</div>
			</div>

		</div>

		<div class="row">
			<div class="col-xs-12">
				<div class="box">
					<div class="box-header">
						<h3 class="box-title">
							<?= $this->lang->line('group_members') . ' - ' .  $group->nom?></h3>

					</div>
					<div class="box-body" style="overflow-x:auto;">
						<table id="example1" class="table table-bordered table-striped">
							<thead>
							<tr>
								<?php
								echo "<th>" . 'Role' . "</th>
											<th>" . $this->lang->line('Nom') . "</th>
											<th>" . $this->lang->line('Téléphone') . "</th>
											<th>" . $this->lang->line('Adresse') . "</th>
											<th>" . $this->lang->line('principal_account') . "</th>
											<th>" . $this->lang->line('credit_account') . "</th>
											<th>" . $this->lang->line('savings_account') . "</th>
											<th>" . $this->lang->line('subscription_date') . "</th>";

								?>
							</tr>
							</thead>
							<tbody>
							<?php
							if ($members) {
							foreach ($members->result() as $row) { ?>
							<tr>
								<?php
								if ($row->role == 'creator') {
									?>
									<td>
										<span class="label label-success"><?= $this->lang->line('creator') ?></span>
									</td>
									<?php
								} else if ($row->role == 'sponsor') {
									?>
									<td>
										<span class="label label-primary">Sponsor</span>
									</td>
									<?php
								} else {
									?>

									<td>
										<span class="label label-info"><?= $this->lang->line('Membre') ?></span>
									</td>

									<?php
								}
								?>

								<?php
								echo "
		                                                    <td>" . $row->lastname . ' ' . $row->firstname . "</td>
		                                                      <td>" . $row->phone . "</td>
		                                                        <td>" . $row->adresse . "</td>
		                                                   <td>" . Money::of(round($row->balance, 2), $currency_code, $context)->formatTo('fr_FR') . "</td>
		                                                      <td>" . Money::of(round($row->balance_credit, 2), $currency_code, $context)->formatTo('fr_FR') . "</td>
														 <td>" . Money::of(round($row->balance_epargne, 2), $currency_code, $context)->formatTo('fr_FR') . "</td>
		                                				  <td>" . $row->date_adhesion . "</td>
		                                	</tr>";
								?>
								<?php
								}
								?>
								<?php
								}
								?>
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</div>
	</section>
</div>
<!-- jQuery 2.2.4 -->
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<!-- Bootstrap 3.3.7 -->
<script src="<?= base_url('bower_components/bootstrap/dist/js/bootstrap.min.js') ?>"></script>
<!-- DataTables -->
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap.min.js"></script>
<!-- Slimscroll -->
<script src="<?= base_url('bower_components/jquery-slimscroll/jquery.slimscroll.min.js') ?>"></script>
<!-- FastClick -->
<script src="<?= base_url('bower_components/fastclick/lib/fastclick.js') ?>"></script>
<!-- AdminLTE App -->
<script src="<?= base_url('dist/js/adminlte.min.js') ?>"></script>
<!-- AdminLTE for demo purposes -->
<script src="<?= base_url('dist/js/demo.js') ?>"></script>

<script src="<?= base_url('bower_components/moment/min/moment.min.js') ?>"></script>
<script src="<?= base_url('bower_components/bootstrap-daterangepicker/daterangepicker.js') ?>"></script>
<script src="<?= base_url('bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js') ?>"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
<!-- ChartJS -->
<script src="<?= base_url('bower_components/chart.js/Chart.js') ?>"></script>
<script src="<?= base_url('bower_components/toastr/toastr.js') ?>"></script>
<script src="<?= base_url('dist/js/sweetalert2.js') ?>"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment-with-locales.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/plug-ins/1.10.20/dataRender/datetime.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.colVis.min.js"></script>
<script>
	$(function () {
		const lang = "<?= $this->session->userdata('site_lang') ?>";
		const format = lang === 'french' ? 'fr' : 'en';
		moment.updateLocale(moment.locale(format), {invalidDate: ""});

		var table = $('#example1').DataTable({
			"aaSorting": [[7, "desc"]],
			"columnDefs": [{
				targets: [7],
				render: $.fn.dataTable.render.moment('YYYY-MM-DD HH:mm:ss', 'D MMMM YYYY HH:mm:ss', format)
			}],
			dom: 'Bfrtip',
			"buttons": [
				'pageLength',
				{
					extend: 'excelHtml5',
					title: "<?= $this->lang->line('group_members') . ' - ' .  $group->nom?>",
					customizeData: function (data) {
						for (var i = 0; i < data.body.length; i++) {
							for (var j = 0; j < data.body[i].length; j++) {
								// data.body[i][j] = '\u200C' + data.body[i][j];
								if ([4, 5, 6].includes(j)) {
									// Get the value and strip the non numeric characters
									// var value = $(this).text();
									value = data.body[i][j].replace(',', ".")
									data.body[i][j] = Number(value.replace(/[^0-9\.-]+/g, ""));
								}
							}
						}
					},
					trim: false
				},
				{
					extend: 'csvHtml5',
					title: "<?= $this->lang->line('group_members') . ' - ' .  $group->nom?>",
					trim: false
				},
				{
					extend: 'pdfHtml5',
					orientation: 'landscape',
					pageSize: 'LEGAL',
					title: "<?= $this->lang->line('group_members') . ' - ' .  $group->nom?>",
					trim: false
				},
				// 'colvis'
			]
		});

	})
</script>

<script>
	toastr.options.closeButton = true;
	toastr.options.closeMethod = 'fadeOut';
	toastr.options.closeDuration = 5000;
	toastr.options.closeEasing = 'swing';

</script>
<!-- Page script -->
<!--<script src="--><?php //echo base_url('dist/js/custom.js') ?><!--"></script>-->
