Skip to content
Snippets Groups Projects
Commit ecf57523 authored by baldwinlouie's avatar baldwinlouie Committed by Yas Naoi
Browse files

Issue #3252127 by baldwinlouie, yas: Convert K8s Project Cost Comparison chart to use DataTables

parent 3f2461bb
No related branches found
No related tags found
No related merge requests found
......@@ -10,6 +10,7 @@
labels: {
info: '',
},
footer: dataTable.classList.contains('show-footer') ? true: false,
paging: false,
perPage: 9999,
perPageSelect: false,
......@@ -49,7 +50,8 @@
});
dataTable.on('datatable.sort', function (column, direction) {
let headers = dataTable.table.querySelectorAll('th');
// Be more specific with th selector.
let headers = dataTable.table.querySelectorAll('thead tr th');
// Remove both classes since we have no way of keeping track.
headers.forEach(function (tableHeader) {
let span = tableHeader.querySelector('span');
......
......@@ -5,8 +5,6 @@ namespace Drupal\k8s\Plugin\Block;
use Drupal\Component\Utility\Html;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Url;
use Drupal\Core\StringTranslation\TranslatableMarkup;
use Drupal\Core\Utility\TableSort;
use Drupal\k8s\Controller\K8sCostsControllerBase;
/**
......@@ -171,12 +169,12 @@ class K8sProjectCostComparisonBlock extends K8sBaseBlock {
// Get row data.
$rows = [];
// Add Total row.
// Add Total footer.
$first_col_key = empty($cloud_project)
? 'k8s_cloud_project'
: 'k8s_cluster';
$rows[] = [
$footer = [
'data' => [
$first_col_key => [
'data' => [
......@@ -257,11 +255,11 @@ class K8sProjectCostComparisonBlock extends K8sBaseBlock {
// Add the total values to the first row.
if (empty($cloud_project) && !$display_cluster) {
$rows[0]['data']['k8s_cluster'] = '';
$footer['data']['k8s_cluster'] = '';
}
foreach ($cost_types ?: [] as $cost_type) {
$precision = $cost_type === 'on_demand_hourly' ? 4 : 2;
$rows[0]['data'][$cost_type] = [
$footer['data'][$cost_type] = [
'data' => $this->k8sService->formatCosts($cost_total[$cost_type], $total_costs[$cost_type], $precision),
'class' => ['total-costs'],
];
......@@ -271,64 +269,17 @@ class K8sProjectCostComparisonBlock extends K8sBaseBlock {
if (empty($cloud_project)) {
$headers['k8s_cloud_project'] = [
'data' => $this->t('Project Content'),
'field' => 'k8s_cloud_project',
];
}
if (!empty($cloud_project) || !$display_cluster) {
$headers['k8s_cluster'] = [
'data' => $this->t('K8s Cluster'),
'field' => 'k8s_cluster',
];
}
foreach ($cost_type_list ?: [] as $cost_type => $label) {
$headers[$cost_type] = ['data' => "$label ($)", 'field' => $cost_type];
$headers[$cost_type] = ['data' => "$label ($)"];
}
// Use table sort to get the sort asc/desc.
$sort = TableSort::getSort($headers, $this->request);
// Use table sort to get the order by.
$order_field = TableSort::getOrder($headers, $this->request)['sql'];
// Get sort and order parameters.
if (empty($sort)) {
$sort = 'asc';
}
if (empty($order_field)) {
$order_field = empty($cloud_project)
? 'k8s_cloud_project'
: 'k8s_cluster';
}
$total_label = $this->t('Total')->__toString();
// Sort data.
usort($rows, static function ($a, $b) use ($sort, $order_field, $total_label, $first_col_key) {
$result = 1;
if ($a['data'][$first_col_key]['data']['#title'] instanceof TranslatableMarkup
&& $a['data'][$first_col_key]['data']['#title']->__toString() === $total_label) {
return -1;
}
if ($sort === 'desc') {
$result *= -1;
}
if ($order_field === 'k8s_cloud_project' && $a['data'][$order_field]['data']['#title'] === $b['data'][$order_field]['data']['#title']) {
$order_field = 'k8s_cluster';
$result = 1;
}
if ($order_field === 'k8s_cloud_project' || $order_field === 'k8s_cluster') {
$result *= $a['data'][$order_field]['data']['#title'] < $b['data'][$order_field]['data']['#title'] ? -1 : 1;
}
else {
$value_a = floatval($a['data'][$order_field]['value']);
$value_b = floatval($b['data'][$order_field]['value']);
$result *= $value_a < $value_b ? -1 : 1;
}
return $result;
});
$items_per_page_options = cloud_get_views_items_options();
$items_per_page_options['All'] = '- All -';
......@@ -351,6 +302,14 @@ class K8sProjectCostComparisonBlock extends K8sBaseBlock {
'#type' => 'table',
'#header' => $headers,
'#rows' => $current_rows_chunk,
'#footer' => [
$footer,
],
'#attributes' => [
'class' => [
'show-footer',
],
],
];
$duration_label = $duration_list[$duration];
......@@ -362,6 +321,17 @@ class K8sProjectCostComparisonBlock extends K8sBaseBlock {
'#title' => $this->t('Project') . " $duration_label Cost List",
'#open' => TRUE,
'#id' => $block_id,
// Attach DataTables.
'#attached' => [
'library' => [
'cloud/datatables',
],
],
'#attributes' => [
'class' => [
'simple-datatable',
],
],
];
$build['k8s_project_cost_comparison']['container'] = [
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment