<?php
$edited = can_action('57', 'edited');

$miles_active = 1;
$task_timer_id = $this->uri->segment(6);
if ($task_timer_id) {
	$miles_active = 2;
	$milestones_info = get_row('tbl_milestones', array('milestones_id' => $task_timer_id));
}
$kanban = $this->session->userdata('milestone_kanban');
$uri_segment = $this->uri->segment(6);
if (!empty($kanban)) {
	$k_milestone = 'kanban';
} elseif ($uri_segment == 'kanban') {
	$k_milestone = 'kanban';
} else {
	$k_milestone = 'list';
}
if ($k_milestone == 'kanban') {
	$text = 'list';
	$btn = 'purple';
} else {
	$text = 'kanban';
	$btn = 'danger';
}

$project_milestones_data = isset($project_milestones_data) && is_array($project_milestones_data) ? $project_milestones_data : array();
$all_milestones_info = isset($project_milestones_data['all_milestones_info']) ? $project_milestones_data['all_milestones_info'] : array();
$milestone_progress_map = isset($project_milestones_data['milestone_progress_map']) ? $project_milestones_data['milestone_progress_map'] : array();
$kanban_columns = isset($project_milestones_data['kanban_columns']) ? $project_milestones_data['kanban_columns'] : array();
$kanban_items = isset($project_milestones_data['kanban_items']) ? $project_milestones_data['kanban_items'] : array();
$page_size = 6;
$load_label = lang('load_more');
if ($load_label === 'load_more') {
	$load_label = 'Load more';
}
$milestone_total = count($all_milestones_info);
$milestone_completed = 0;
$milestone_overdue = 0;
$today_time = safe_strtotime(date('Y-m-d'));
foreach ($all_milestones_info as $v_milestone_metric) {
	$metric_progress = isset($milestone_progress_map[(string) $v_milestone_metric->milestones_id]) ? (int) $milestone_progress_map[(string) $v_milestone_metric->milestones_id] : 0;
	if ($metric_progress >= 100) {
		$milestone_completed++;
	}
	$metric_due_time = safe_strtotime($v_milestone_metric->end_date);
	if ($metric_due_time && $today_time > $metric_due_time && $metric_progress < 100) {
		$milestone_overdue++;
	}
}
?>

<div class="project-overview-shell space-y-4">
	<div class="flex flex-wrap items-center justify-between gap-2">
		<div>
			<h3 class="text-base font-semibold text-slate-900 dark:text-slate-100"><?= lang('milestones') ?></h3>
			<p class="text-sm text-muted-foreground">Delivery checkpoints, roadmap, and milestone progress.</p>
		</div>
		<div class="flex flex-wrap items-center gap-2">
			<a href="<?= base_url() ?>admin/projects/project_details/<?= $project_details->project_id ?>/milestones/<?= $text ?>"
				class="project-action-btn inline-flex items-center gap-2 px-3 py-2 text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1 hover:border-slate-300">
				<i data-lucide="rotate-ccw" class="h-4 w-4"></i><?= ' ' . lang('switch_to_' . $text) ?>
			</a>
			<?= btn_modal('admin/projects/add_milestone/' . $project_details->project_id, lang('add_milestone'), lang('add_milestone'), 'md', 'plus',  array('class' => 'inline-flex items-center gap-2 rounded-2xl bg-slate-900 mb-1 px-3.5 py-2 text-xs font-semibold text-white shadow-sm hover:bg-slate-800 dark:hover:bg-slate-700')) ?>
		</div>
	</div>

	<div class="grid gap-3 md:grid-cols-2 xl:grid-cols-4">
		<div class="project-kpi-card rounded-xl border border-border bg-card p-4 shadow-sm">
			<div class="flex items-center gap-3">
				<div class="rounded-xl bg-violet-50 p-2.5 text-violet-600 dark:bg-violet-900/30 dark:text-violet-400">
					<i data-lucide="flag" class="h-5 w-5"></i>
				</div>
				<div>
					<div class="text-2xl font-bold text-foreground"><?= (int) $milestone_total ?></div>
					<div class="text-[11px] font-medium uppercase tracking-[0.16em] text-muted-foreground">Roadmap Items</div>
				</div>
			</div>
		</div>

		<div class="project-kpi-card rounded-xl border border-border bg-card p-4 shadow-sm">
			<div class="flex items-center gap-3">
				<div class="rounded-xl bg-emerald-50 p-2.5 text-emerald-600 dark:bg-emerald-900/30 dark:text-emerald-400">
					<i data-lucide="check-circle-2" class="h-5 w-5"></i>
				</div>
				<div>
					<div class="text-2xl font-bold text-foreground"><?= (int) $milestone_completed ?></div>
					<div class="text-[11px] font-medium uppercase tracking-[0.16em] text-muted-foreground"><?= lang('completed') ?></div>
				</div>
			</div>
		</div>

		<div class="project-kpi-card rounded-xl border border-border bg-card p-4 shadow-sm">
			<div class="flex items-center gap-3">
				<div class="rounded-xl bg-amber-50 p-2.5 text-amber-600 dark:bg-amber-900/30 dark:text-amber-400">
					<i data-lucide="layout-grid" class="h-5 w-5"></i>
				</div>
				<div>
					<div class="text-2xl font-bold text-foreground"><?= $k_milestone === 'kanban' ? 'Kanban' : 'List' ?></div>
					<div class="text-[11px] font-medium uppercase tracking-[0.16em] text-muted-foreground">Current View</div>
				</div>
			</div>
		</div>

		<div class="project-kpi-card rounded-xl border border-border bg-card p-4 shadow-sm">
			<div class="flex items-center gap-3">
				<div class="rounded-xl bg-rose-50 p-2.5 text-rose-600 dark:bg-rose-900/30 dark:text-rose-400">
					<i data-lucide="alarm-clock" class="h-5 w-5"></i>
				</div>
				<div>
					<div class="text-2xl font-bold text-rose-600 dark:text-rose-400"><?= (int) $milestone_overdue ?></div>
					<div class="text-[11px] font-medium uppercase tracking-[0.16em] text-muted-foreground"><?= lang('overdue') ?></div>
				</div>
			</div>
		</div>
	</div>

	<?php if ($k_milestone == 'kanban') { ?>
		<div class="project-section-card rounded-2xl border border-border bg-card p-4 shadow-sm">
			<link rel="stylesheet" href="<?= base_url() ?>assets/plugins/kanban/kanban.css" />
			<div class="kanban" data-kanban
				data-sort-url-base="<?= base_url('admin/projects/change_milestones/') ?>"
				data-load-url-base="<?= base_url('admin/projects/load_milestone_tasks/' . $project_details->project_id . '/') ?>"
				data-page-size="<?= (int) $page_size ?>"
				data-load-label="<?= html_escape($load_label) ?>"
				data-columns='<?= html_escape(json_encode($kanban_columns)) ?>'
				data-items='<?= html_escape(json_encode($kanban_items)) ?>'>
				<div class="kanban-board"></div>
			</div>
			<script src="<?= base_url() ?>assets/plugins/kanban/kanban.js"></script>
		</div>
	<?php } else { ?>
		<div class="project-section-card overflow-hidden rounded-2xl border border-border bg-card shadow-sm">
			<div class="flex flex-wrap items-center justify-between gap-3 border-b border-border px-4 py-3">
				<div>
					<h4 class="text-sm font-semibold text-foreground">Milestone Register</h4>
					<p class="text-xs text-muted-foreground">Track roadmap dates, completion, and delivery risk.</p>
				</div>
				<div class="flex flex-wrap gap-2 text-xs">
					<span class="project-summary-chip inline-flex items-center gap-2 px-2.5 py-1 text-slate-700 dark:text-slate-200"><span class="h-2 w-2 rounded-full bg-violet-500"></span><?= (int) $milestone_total ?> total</span>
					<span class="project-summary-chip inline-flex items-center gap-2 px-2.5 py-1 text-slate-700 dark:text-slate-200"><span class="h-2 w-2 rounded-full bg-emerald-500"></span><?= (int) $milestone_completed ?> <?= lang('completed') ?></span>
				</div>
			</div>
			<div class="overflow-x-auto">
				<table class="min-w-full text-sm">
					<thead class="bg-slate-50 text-slate-500 uppercase tracking-wider text-xs dark:bg-slate-900 dark:text-slate-400">
						<tr>
							<th class="px-4 py-3 text-left rounded-tl-2xl"><?= lang('milestone_name') ?></th>
							<th class="px-4 py-3 text-left"><?= lang('start_date') ?></th>
							<th class="px-4 py-3 text-left"><?= lang('due_date') ?></th>
							<th class="px-4 py-3 text-left"><?= lang('progress') ?></th>
							<th class="px-4 py-3 text-left rounded-tr-2xl"><?= lang('action') ?></th>
						</tr>
					</thead>
					<tbody class="bg-white divide-y divide-slate-200 dark:bg-slate-800 dark:divide-slate-700">
						<?php
						if (!empty($all_milestones_info)) {
							foreach ($all_milestones_info as $key => $v_milestones) {
								$progress = isset($milestone_progress_map[(string) $v_milestones->milestones_id]) ? (int) $milestone_progress_map[(string) $v_milestones->milestones_id] : 0;
						?>
								<tr id="table-milestones-<?= $v_milestones->milestones_id ?>">
									<td class="px-4 py-3">
										<a class="text-primary hover:underline dark:text-sky-300" href="#" data-tooltip="<?= html_escape($v_milestones->description) ?>">
											<?= html_escape($v_milestones->milestone_name) ?>
										</a>
									</td>
									<td><?= display_date($v_milestones->start_date) ?></td>
									<td>
										<?php
										$due_date = $v_milestones->end_date;
										$due_time = safe_strtotime($due_date);
										$current_time = safe_strtotime(date('Y-m-d'));
										?>
										<span class="text-slate-700 dark:text-slate-200"><?= display_date($due_date) ?></span>
										<?php if ($current_time > $due_time && $progress < 100) { ?>
											<span class="ml-2 inline-flex rounded-full bg-rose-50 px-2 py-0.5 text-xs text-rose-700 dark:bg-rose-900/40 dark:text-rose-300"><?= lang('overdue') ?></span>
										<?php } ?>
									</td>
									<td>
										<div class="flex items-center gap-2">
											<div class="h-2 w-24 rounded-full bg-slate-100 dark:bg-slate-700">
												<div class="h-2 rounded-full <?= $progress >= 100 ? 'bg-emerald-500' : 'bg-rose-400' ?>" style="width: <?= $progress ?>%"></div>
											</div>
											<span class="text-xs text-slate-500 dark:text-slate-400"><?= $progress ?>%</span>
										</div>
									</td>
									<td>
										<?= btn_modal('admin/projects/add_milestone/' . $project_details->project_id . '/' . $v_milestones->milestones_id, lang('edit'), lang('edit'), 'md', 'plus',  array('class' => 'inline-flex items-center gap-2 rounded-lg bg-slate-900 px-3 py-2 text-xs font-semibold text-white hover:bg-slate-700')) ?>

										<?= ajax_anchor(base_url("admin/projects/delete_milestones/" . $v_milestones->project_id . '/' . $v_milestones->milestones_id), "", array("class" => "", "title" => lang('delete'), "data-fade-out-on-success" => "#table-milestones-" . $v_milestones->milestones_id)); ?>
									</td>
								</tr>
							<?php } ?>
						<?php } else { ?>
							<tr>
								<td colspan="5" class="px-4 py-6 text-center text-sm text-slate-500 dark:text-slate-400"><?= lang('no_data_found') ?></td>
							</tr>
						<?php } ?>
					</tbody>
				</table>
			</div>
		</div>
	<?php } ?>
</div>
