enhance(frontend): 設定のインデックス更新

This commit is contained in:
syuilo 2025-03-25 09:54:23 +09:00
parent 26b2cfe518
commit 600bb34172
2 changed files with 57 additions and 47 deletions

View file

@ -4,53 +4,55 @@ SPDX-License-Identifier: AGPL-3.0-only
--> -->
<template> <template>
<div class="_gaps_m"> <SearchMarker path="/settings/navbar" :label="i18n.ts.navbar" icon="ti ti-list" :keywords="['navbar', 'menu', 'sidebar']">
<FormSlot> <div class="_gaps_m">
<template #label>{{ i18n.ts.navbar }}</template> <FormSlot>
<MkContainer :showHeader="false"> <template #label>{{ i18n.ts.navbar }}</template>
<Sortable <MkContainer :showHeader="false">
v-model="items" <Sortable
itemKey="id" v-model="items"
:animation="150" itemKey="id"
:handle="'.' + $style.itemHandle" :animation="150"
@start="e => e.item.classList.add('active')" :handle="'.' + $style.itemHandle"
@end="e => e.item.classList.remove('active')" @start="e => e.item.classList.add('active')"
> @end="e => e.item.classList.remove('active')"
<template #item="{element,index}"> >
<div <template #item="{element,index}">
v-if="element.type === '-' || navbarItemDef[element.type]" <div
:class="$style.item" v-if="element.type === '-' || navbarItemDef[element.type]"
> :class="$style.item"
<button class="_button" :class="$style.itemHandle"><i class="ti ti-menu"></i></button> >
<i class="ti-fw" :class="[$style.itemIcon, navbarItemDef[element.type]?.icon]"></i><span :class="$style.itemText">{{ navbarItemDef[element.type]?.title ?? i18n.ts.divider }}</span> <button class="_button" :class="$style.itemHandle"><i class="ti ti-menu"></i></button>
<button class="_button" :class="$style.itemRemove" @click="removeItem(index)"><i class="ti ti-x"></i></button> <i class="ti-fw" :class="[$style.itemIcon, navbarItemDef[element.type]?.icon]"></i><span :class="$style.itemText">{{ navbarItemDef[element.type]?.title ?? i18n.ts.divider }}</span>
</div> <button class="_button" :class="$style.itemRemove" @click="removeItem(index)"><i class="ti ti-x"></i></button>
</template> </div>
</Sortable> </template>
</MkContainer> </Sortable>
</FormSlot> </MkContainer>
<div class="_buttons"> </FormSlot>
<MkButton @click="addItem"><i class="ti ti-plus"></i> {{ i18n.ts.addItem }}</MkButton> <div class="_buttons">
<MkButton danger @click="reset"><i class="ti ti-reload"></i> {{ i18n.ts.default }}</MkButton> <MkButton @click="addItem"><i class="ti ti-plus"></i> {{ i18n.ts.addItem }}</MkButton>
<MkButton primary class="save" @click="save"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton> <MkButton danger @click="reset"><i class="ti ti-reload"></i> {{ i18n.ts.default }}</MkButton>
</div> <MkButton primary class="save" @click="save"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
</div>
<MkRadios v-model="menuDisplay"> <MkRadios v-model="menuDisplay">
<template #label>{{ i18n.ts.display }}</template> <template #label>{{ i18n.ts.display }}</template>
<option value="sideFull">{{ i18n.ts._menuDisplay.sideFull }}</option> <option value="sideFull">{{ i18n.ts._menuDisplay.sideFull }}</option>
<option value="sideIcon">{{ i18n.ts._menuDisplay.sideIcon }}</option> <option value="sideIcon">{{ i18n.ts._menuDisplay.sideIcon }}</option>
<option value="top">{{ i18n.ts._menuDisplay.top }}</option> <option value="top">{{ i18n.ts._menuDisplay.top }}</option>
<!-- <MkRadio v-model="menuDisplay" value="hide" disabled>{{ i18n.ts._menuDisplay.hide }}</MkRadio>--> <!-- TODO: サイドバーを完全に隠せるようにすると別途ハンバーガーボタンのようなものをUIに表示する必要があり面倒 --> <!-- <MkRadio v-model="menuDisplay" value="hide" disabled>{{ i18n.ts._menuDisplay.hide }}</MkRadio>--> <!-- TODO: サイドバーを完全に隠せるようにすると別途ハンバーガーボタンのようなものをUIに表示する必要があり面倒 -->
</MkRadios> </MkRadios>
<SearchMarker :keywords="['toggle', 'button', 'sub']"> <SearchMarker :keywords="['navbar', 'sidebar', 'toggle', 'button', 'sub']">
<MkPreferenceContainer k="showNavbarSubButtons"> <MkPreferenceContainer k="showNavbarSubButtons">
<MkSwitch v-model="showNavbarSubButtons"> <MkSwitch v-model="showNavbarSubButtons">
<template #label><SearchLabel>{{ i18n.ts._settings.showNavbarSubButtons }}</SearchLabel></template> <template #label><SearchLabel>{{ i18n.ts._settings.showNavbarSubButtons }}</SearchLabel></template>
</MkSwitch> </MkSwitch>
</MkPreferenceContainer> </MkPreferenceContainer>
</SearchMarker> </SearchMarker>
</div> </div>
</SearchMarker>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

View file

@ -588,10 +588,18 @@ export const searchIndexes: SearchIndexItem[] = [
icon: 'ti ti-dots', icon: 'ti ti-dots',
}, },
{ {
id: 'pOot4giZs', id: '9bNikHWzQ',
label: i18n.ts._settings.showNavbarSubButtons, children: [
keywords: ['toggle', 'button', 'sub'], {
id: 'appYJbpkK',
label: i18n.ts._settings.showNavbarSubButtons,
keywords: ['navbar', 'sidebar', 'toggle', 'button', 'sub'],
},
],
label: i18n.ts.navbar,
keywords: ['navbar', 'menu', 'sidebar'],
path: '/settings/navbar', path: '/settings/navbar',
icon: 'ti ti-list',
}, },
{ {
id: '3icEvyv2D', id: '3icEvyv2D',