add custom apps sorting
This commit is contained in:
parent
7d82c78581
commit
84c620637e
|
@ -116,6 +116,7 @@
|
|||
|
||||
.side-menu-setting-row {
|
||||
display: table;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.side-menu-setting-label {
|
||||
|
|
|
@ -95,6 +95,7 @@ class JsController extends Controller
|
|||
{
|
||||
$topMenuApps = $this->config->getAppValueArray('top-menu-apps', '[]');
|
||||
$topSideMenuApps = $this->config->getAppValueArray('top-side-menu-apps', '[]');
|
||||
$topMenuAppsOrder = $this->config->getAppValueArray('top-menu-apps-order', '[]');
|
||||
$targetBlankApps = $this->config->getAppValueArray('target-blank-apps', '[]');
|
||||
$useAvatar = $this->config->getAppValueBool('use-avatar', '0');
|
||||
$isForced = $this->config->getAppValueBool('force', '0');
|
||||
|
@ -164,6 +165,7 @@ class JsController extends Controller
|
|||
'avatar' => $avatar,
|
||||
'top-menu-apps' => $topMenuApps,
|
||||
'top-side-menu-apps' => $topSideMenuApps,
|
||||
'top-menu-apps-order' => $topMenuAppsOrder,
|
||||
'target-blank-apps' => $targetBlankApps,
|
||||
'settings' => $settings,
|
||||
'logo' => $this->themingDefaults->getLogo(),
|
||||
|
|
|
@ -105,4 +105,23 @@ class AppRepository
|
|||
|
||||
return $visibleApps;
|
||||
}
|
||||
|
||||
public function getTopMenuOrderedApps()
|
||||
{
|
||||
$apps = $this->getVisibleApps();
|
||||
$orders = $this->config->getAppValueArray('top-menu-apps-order', '[]');
|
||||
|
||||
usort($apps, function ($a, $b) use ($orders) {
|
||||
$ak = array_keys($orders, $a['id'])[0] ?? null;
|
||||
$bk = array_keys($orders, $b['id'])[0] ?? null;
|
||||
|
||||
if ($ak === null || $bk === null) {
|
||||
return ($a['name'] < $b['name']) ? -1 : 1;
|
||||
}
|
||||
|
||||
return $ak < $bk ? -1 : 1;
|
||||
});
|
||||
|
||||
return $apps;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -159,9 +159,11 @@ class Admin implements ISettings
|
|||
'force' => $this->config->getAppValue('force', '0'),
|
||||
'target-blank-apps' => $this->config->getAppValueArray('target-blank-apps', '[]'),
|
||||
'top-menu-apps' => $this->config->getAppValueArray('top-menu-apps', '[]'),
|
||||
'top-menu-apps-order' => $this->config->getAppValueArray('top-menu-apps-order', '[]'),
|
||||
'top-side-menu-apps' => $this->config->getAppValueArray('top-side-menu-apps', '[]'),
|
||||
'default-enabled' => $this->config->getAppValue('default-enabled', '1'),
|
||||
'apps' => $this->appRepository->getVisibleApps(),
|
||||
'top-menu-ordered-apps' => $this->appRepository->getTopMenuOrderedApps(),
|
||||
'apps-categories-custom' => $this->config->getAppValueArray('apps-categories-custom', '[]'),
|
||||
'categories-order-type' => $this->config->getAppValue('categories-order-type', 'default'),
|
||||
'categories-order' => $this->config->getAppValueArray('categories-order', '[]'),
|
||||
|
|
|
@ -27,7 +27,9 @@
|
|||
:key="app.id"
|
||||
:data-app-id="app.id"
|
||||
class="app-menu-entry"
|
||||
:class="{ 'app-menu-entry__active': app.active }">
|
||||
:class="{ 'app-menu-entry__active': app.active }"
|
||||
:style="makeStyle(app)"
|
||||
>
|
||||
<a :href="app.href"
|
||||
:class="{ 'has-unread': app.unread > 0 }"
|
||||
:aria-label="appLabel(app)"
|
||||
|
@ -78,10 +80,17 @@ export default {
|
|||
mounted() {
|
||||
const ncApps = loadState('core', 'apps', {})
|
||||
this.apps = {}
|
||||
let orders = {}
|
||||
|
||||
Array.from(window.topMenuAppsOrder).forEach((app, order) => {
|
||||
orders[app] = order + 1
|
||||
})
|
||||
|
||||
|
||||
Array.from(window.topMenuApps).forEach((id) => {
|
||||
if (ncApps.hasOwnProperty(id)) {
|
||||
this.apps[id] = ncApps[id]
|
||||
this.apps[id].order = orders[id] || null
|
||||
}
|
||||
})
|
||||
|
||||
|
@ -122,6 +131,11 @@ export default {
|
|||
}
|
||||
this.appLimit = appCount
|
||||
},
|
||||
makeStyle(app) {
|
||||
if (app.order !== null) {
|
||||
return `order: ${app.order}`
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
18
src/admin.js
18
src/admin.js
|
@ -257,4 +257,22 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
})
|
||||
} catch (e) {
|
||||
}
|
||||
|
||||
sortable('#top-menu-apps-order-list .side-menu-setting-list', {
|
||||
placeholderClass: 'side-menu-setting-list-drop'
|
||||
})
|
||||
|
||||
try {
|
||||
sortable('#top-menu-apps-order-list .side-menu-setting-list')[0].addEventListener('sortstop', (e) => {
|
||||
let value = []
|
||||
|
||||
for (let item of document.querySelectorAll('#top-menu-apps-order-list .side-menu-setting-list-item')) {
|
||||
console.log(item.getAttribute('data-id'))
|
||||
value.push(item.getAttribute('data-id'))
|
||||
}
|
||||
|
||||
document.querySelector('input[name="top-menu-apps-order"]').value = JSON.stringify(value)
|
||||
})
|
||||
} catch (e) {
|
||||
}
|
||||
})
|
||||
|
|
|
@ -25,6 +25,7 @@ if ($_['always-displayed']) {
|
|||
const targetBlankApps = <?php echo json_encode($_['target-blank-apps']) ?>
|
||||
|
||||
window.topMenuApps = <?php echo json_encode($_['top-menu-apps']), "\n"; ?>
|
||||
window.topMenuAppsOrder = <?php echo json_encode($_['top-menu-apps-order']), "\n"; ?>
|
||||
window.topSideMenuApps = <?php echo json_encode($_['top-side-menu-apps']); ?>
|
||||
|
||||
<?php if ($display === 'big-menu'): ?>
|
||||
|
|
|
@ -829,6 +829,33 @@ $labelReset = 'Reset to default';
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="side-menu-setting-row">
|
||||
<div class="side-menu-setting-label">
|
||||
<?php p($l->t('Customize sorting')); ?>
|
||||
</div>
|
||||
<div class="side-menu-setting-form">
|
||||
<a class="side-menu-toggler" data-target="#top-menu-apps-order-list" href="#_">
|
||||
🖱️ <?php p($l->t($labelShowHideApps)); ?>
|
||||
</a>
|
||||
|
||||
<div id="top-menu-apps-order-list" style="display: none">
|
||||
<ul class="side-menu-setting-list">
|
||||
<?php foreach ($_['top-menu-ordered-apps'] as $key => $app): ?>
|
||||
<li data-id="<?php echo $app['id']; ?>" class="side-menu-setting-list-item">
|
||||
<span class="arrow">
|
||||
⇅
|
||||
</span>
|
||||
|
||||
<?php echo p($l->t($app['name'])); ?>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<input type="hidden" value='<?php echo json_encode(array_keys($_['top-menu-apps-order'])) ?>' name="top-menu-apps-order" class="side-menu-setting">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
Loading…
Reference in a new issue