cerebrate/templates/element/genericElements/IndexTable/Fields/brood_sync_status.php

170 lines
7.0 KiB
PHP

<?php
$seed = 's-' . mt_rand();
$status = $this->Hash->extract($row, $field['data_path']);
$displayField = $this->Hash->get($row, $field['display_field_data_path']);
if ($status['local'] && $status['up_to_date']) {
$variant = 'success';
$text = __('Ok');
} else if ($status['local'] && !$status['up_to_date']) {
$variant = 'warning';
$text = __('Outdated');
} else {
$variant = 'danger';
$text = __('N/A');
}
echo $this->Bootstrap->badge([
'id' => $seed,
'variant' => $variant,
'text' => $text,
'icon' => ($status['local'] && !$status['up_to_date']) ? 'question-circle' : false,
'title' => $status['title'],
'class' => [
(($status['local'] && !$status['up_to_date']) ? 'cursor-pointer' : ''),
],
]);
?>
<?php if ($status['local'] && !$status['up_to_date']) : ?>
<script>
$(document).ready(function() {
function genTable(status) {
status.forEach(function(row, i) {
status[i][1] = buildTableEntry(status[i][1])
status[i][2] = buildTableEntry(status[i][2])
});
const $table = HtmlHelper.table(
['<?= __('Field name') ?>', '<?= __('Local value') ?>', '<?= __('Remote value') ?>'],
status, {
small: true,
caption: `${status.length} fields`,
}
)
const $container = $('<div>')
const $header = $('<h4>').text('<?= __('Main fields') ?>')
$container.append($header, $table)
return $container[0].outerHTML
}
function genTableForMetafields(status) {
let rearrangedStatus = []
for (const [field, metafieldData] of Object.entries(status)) {
rearrangedChanges = []
const metaTemplate = metafieldData['meta_template']
const metafields = metafieldData['delta']
metafields.forEach(function(metaFields, i) {
const localMetafield = metaFields.local
const remoteMetafield = metaFields.remote
rearrangedChanges.push([
buildTableEntryForMetaField(localMetafield),
buildTableEntryForMetaField(remoteMetafield),
])
})
const $changesTable = HtmlHelper.table(
null,
rearrangedChanges, {
small: true,
borderless: true,
striped: true,
fixed_layout: true,
tableClass: 'mb-0',
}
)
const $field = $('<td>')
.css('min-width', '8em')
.text(field)
const $template = $('<td>')
.css('min-width', '6em')
.append(
$('<span>').text(metaTemplate.name),
$('<sup>').text(`v${metaTemplate.version}`),
)
rearrangedStatus.push([
$template,
$field,
$('<td>').attr('colspan', 2).append($changesTable),
])
}
const $container = $('<div>')
const $header = $('<h4>').text('<?= __('Meta Fields') ?>')
const metafieldAmount = Object.values(status).reduce(function(carry, metaFields) {
return carry + metaFields.length
}, 0)
const $table = HtmlHelper.table(
['<?= __('Template') ?>', '<?= __('Field name') ?>', '<?= __('Local value') ?>', '<?= __('Remote value') ?>'],
// ['<?= __('Field name') ?>', '<?= __('Local value') ?>', '<?= __('Remote value') ?>'],
rearrangedStatus, {
small: true,
caption: `${metafieldAmount} meta-fields`,
}
)
$container.append($header, $table)
return $container[0].outerHTML
}
function buildTableEntry(value) {
let $elem
if (typeof value === 'object') {
$elem = $('<span>')
.html(syntaxHighlightJson(value, 2))
} else {
$elem = $('<pre>')
.text(value)
}
return $elem
}
function buildTableEntryForMetaField(metafieldDifferences) {
if (metafieldDifferences !== null) {
const $container = $('<table>').addClass('table table-borderless table-xs mb-0')
for (const [field, value] of Object.entries(metafieldDifferences)) {
const $entry = $('<tr>')
.append(
$('<th>')
.addClass('fw-normal')
.text(field),
$('<td>')
.append(
$('<pre>')
.addClass('d-inline mb-0')
.text(value)
)
)
$container.append($entry)
}
return $container
}
return $('<span>').html(syntaxHighlightJson(metafieldDifferences))
}
const status = <?= json_encode($status) ?>;
$('#<?= $seed ?>')
.data('sync-status', status)
.click(function() {
const syncStatusData = $(this).data('sync-status')['data']
let rearrangedStatusData = []
for (const [field, values] of Object.entries(syncStatusData)) {
if (field !== 'meta_fields') {
rearrangedStatusData.push([
field,
values.local,
values.remote,
])
}
}
const bodyHtml = genTable(rearrangedStatusData) +
(syncStatusData['meta_fields'] ? genTableForMetafields(syncStatusData['meta_fields']) : '')
const options = {
title: '<?= __('Difference with the remote for `{0}`', $displayField) ?>',
bodyHtml: bodyHtml,
type: 'ok-only',
size: 'xl',
}
UI.modal(options)
})
})
</script>
<?php endif; ?>