properly integrated bottom nav
This commit is contained in:
@ -18,7 +18,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3" v-for="book in filteredBooks" :key="book.id">
|
||||
<div style="padding-bottom: 55px">
|
||||
<div class="mb-3" v-for="book in filteredBooks" :key="book.id">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<b-card class="d-flex flex-column" v-hover v-on:click="openBook(book.id)">
|
||||
@ -54,8 +55,17 @@
|
||||
></cookbook-slider>
|
||||
</transition>
|
||||
|
||||
<bottom-navigation-bar></bottom-navigation-bar>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<bottom-navigation-bar>
|
||||
<template #custom_create_functions>
|
||||
<a class="dropdown-item" @click="createNew()"><i
|
||||
class="fa fa-book"></i> {{$t("Create")}}</a>
|
||||
<div class="dropdown-divider" ></div>
|
||||
</template>
|
||||
</bottom-navigation-bar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div id="app" style="margin-bottom: 4vh">
|
||||
<div id="app">
|
||||
<b-alert :show="!online" dismissible class="small float-up" variant="warning">{{ $t("OfflineAlert") }}</b-alert>
|
||||
|
||||
<div class="row float-top w-100">
|
||||
@ -470,30 +470,6 @@
|
||||
</b-tab>
|
||||
</b-tabs>
|
||||
|
||||
<transition name="slided-fade">
|
||||
<div class="row fixed-bottom p-2 b-1 border-top text-center d-flex d-md-none"
|
||||
style="background: rgba(255, 255, 255, 0.6);width: 105%;" v-if="current_tab === 0">
|
||||
<div class="col-6">
|
||||
<a class="btn btn-block btn-success shadow-none" @click="entrymode = !entrymode; "
|
||||
><i class="fas fa-cart-plus"></i>
|
||||
{{ $t("New_Entry") }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<b-dropdown id="dropdown-dropup" block dropup variant="primary" class="shadow-none">
|
||||
<template #button-content><i class="fas fa-download"></i> {{ $t("Export") }}</template>
|
||||
<DownloadPDF dom="#shoppinglist" name="shopping.pdf" :label="$t('download_pdf')"
|
||||
icon="far fa-file-pdf"/>
|
||||
<DownloadCSV :items="csvData" :delim="settings.csv_delim" name="shopping.csv"
|
||||
:label="$t('download_csv')" icon="fas fa-file-csv"/>
|
||||
<CopyToClipboard :items="csvData" :settings="settings" :label="$t('copy_to_clipboard')"
|
||||
icon="fas fa-clipboard-list"/>
|
||||
<CopyToClipboard :items="csvData" :settings="settings" format="table"
|
||||
:label="$t('copy_markdown_table')" icon="fab fa-markdown"/>
|
||||
</b-dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
<b-popover target="id_filters_button" triggers="click" placement="bottomleft" :title="$t('Filters')">
|
||||
<div>
|
||||
<b-form-group v-bind:label="$t('GroupBy')" label-for="popover-input-1" label-cols="6" class="mb-1">
|
||||
@ -590,7 +566,26 @@
|
||||
<shopping-modal v-if="new_recipe.id" :recipe="new_recipe" :servings="parseInt(add_recipe_servings)"
|
||||
:modal_id="new_recipe.id" @finish="finishShopping" :list_recipe="new_recipe.list_recipe"/>
|
||||
|
||||
<bottom-navigation-bar></bottom-navigation-bar>
|
||||
<bottom-navigation-bar>
|
||||
<template #custom_create_functions>
|
||||
|
||||
<a class="dropdown-item" @click="entrymode = !entrymode; "
|
||||
><i class="fas fa-cart-plus"></i>
|
||||
{{ $t("New_Entry") }}
|
||||
</a>
|
||||
|
||||
<DownloadPDF dom="#shoppinglist" name="shopping.pdf" :label="$t('download_pdf')"
|
||||
icon="far fa-file-pdf fa-fw"/>
|
||||
<DownloadCSV :items="csvData" :delim="settings.csv_delim" name="shopping.csv"
|
||||
:label="$t('download_csv')" icon="fas fa-file-csv fa-fw"/>
|
||||
<CopyToClipboard :items="csvData" :settings="settings" :label="$t('copy_to_clipboard')"
|
||||
icon="fas fa-clipboard-list fa-fw"/>
|
||||
<CopyToClipboard :items="csvData" :settings="settings" format="table"
|
||||
:label="$t('copy_markdown_table')" icon="fab fa-markdown fa-fw"/>
|
||||
|
||||
<div class="dropdown-divider"></div>
|
||||
</template>
|
||||
</bottom-navigation-bar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -926,7 +921,7 @@ export default {
|
||||
* get the number of entries left in the sync queue for entry check events
|
||||
* @returns {Promise<Number>} promise resolving to the number of entries left
|
||||
*/
|
||||
getSyncQueueLength: function (){
|
||||
getSyncQueueLength: function () {
|
||||
const wb = new Workbox('/service-worker.js');
|
||||
wb.register();
|
||||
return wb.messageSW({type: 'BGSYNC_COUNT_QUEUE'}).then((r) => {
|
||||
@ -1071,26 +1066,26 @@ export default {
|
||||
this.loading = true
|
||||
}
|
||||
this.genericAPI(this.Models.SHOPPING_LIST, this.Actions.LIST, params).then((results) => {
|
||||
if (!autosync) {
|
||||
if (results.data?.length) {
|
||||
this.items = results.data
|
||||
} else {
|
||||
console.log("no data returned")
|
||||
}
|
||||
this.loading = false
|
||||
if (!autosync) {
|
||||
if (results.data?.length) {
|
||||
this.items = results.data
|
||||
} else {
|
||||
if (!this.auto_sync_blocked) {
|
||||
this.getSyncQueueLength().then((r) => {
|
||||
if (r === 0){
|
||||
this.mergeShoppingList(results.data)
|
||||
} else {
|
||||
this.auto_sync_running = false
|
||||
this.replaySyncQueue()
|
||||
}
|
||||
})
|
||||
}
|
||||
console.log("no data returned")
|
||||
}
|
||||
})
|
||||
this.loading = false
|
||||
} else {
|
||||
if (!this.auto_sync_blocked) {
|
||||
this.getSyncQueueLength().then((r) => {
|
||||
if (r === 0) {
|
||||
this.mergeShoppingList(results.data)
|
||||
} else {
|
||||
this.auto_sync_running = false
|
||||
this.replaySyncQueue()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
if (!autosync) {
|
||||
StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
|
||||
|
@ -5,14 +5,14 @@
|
||||
<div class="flex-column" v-if="show_button_1">
|
||||
<slot name="button_1">
|
||||
<a class="nav-link bottom-nav-link p-0" v-bind:href="resolveDjangoUrl('view_search')">
|
||||
<i class="fas fa-fw fa-book " style="font-size: 1.5em"></i><br/><small>Recipes</small></a> <!-- TODO localize -->
|
||||
<i class="fas fa-fw fa-book " style="font-size: 1.5em"></i><br/><small>{{ $t('Recipes') }}</small></a> <!-- TODO localize -->
|
||||
</slot>
|
||||
|
||||
</div>
|
||||
<div class="flex-column" v-if="show_button_2">
|
||||
<slot name="button_2">
|
||||
<a class="nav-link bottom-nav-link p-0" v-bind:href="resolveDjangoUrl('view_plan')">
|
||||
<i class="fas fa-calendar-alt" style="font-size: 1.5em"></i><br/><small>Plans</small></a> <!-- TODO localize -->
|
||||
<i class="fas fa-calendar-alt" style="font-size: 1.5em"></i><br/><small>{{ $t('Meal_Plan') }}</small></a>
|
||||
</slot>
|
||||
|
||||
</div>
|
||||
@ -28,14 +28,14 @@
|
||||
</slot>
|
||||
|
||||
<a class="dropdown-item" v-bind:href="cl.url" v-for="cl in create_links" v-bind:key="cl.label">
|
||||
<i :class="cl.icon"></i> {{ cl.label }}
|
||||
<i :class="cl.icon + ' fa-fw'"></i> {{ cl.label }}
|
||||
</a>
|
||||
<div class="dropdown-divider" v-if="create_links.length > 0"></div>
|
||||
|
||||
<a class="dropdown-item" v-bind:href="resolveDjangoUrl('new_recipe')"><i
|
||||
class="fas fa-plus"></i> Create</a> <!-- TODO localize -->
|
||||
class="fas fa-fw fa-plus"></i> {{ $t('Create Recipe') }}</a>
|
||||
<a class="dropdown-item" v-bind:href="resolveDjangoUrl('data_import_url')"><i
|
||||
class="fas fa-file-import"></i> Import</a> <!-- TODO localize -->
|
||||
class="fas fa-fw fa-file-import"></i> {{ $t('Import Recipe') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</slot>
|
||||
@ -44,14 +44,14 @@
|
||||
<div class="flex-column" v-if="show_button_3">
|
||||
<slot name="button_3">
|
||||
<a class="nav-link bottom-nav-link p-0" v-bind:href="resolveDjangoUrl('view_shopping')">
|
||||
<i class="fas fa-shopping-cart" style="font-size: 1.5em"></i><br/><small>Shopping</small></a> <!-- TODO localize -->
|
||||
<i class="fas fa-shopping-cart" style="font-size: 1.5em"></i><br/><small>{{ $t('Shopping_list') }}</small></a>
|
||||
</slot>
|
||||
</div>
|
||||
<div class="flex-column">
|
||||
|
||||
<slot name="button_4" v-if="show_button_4">
|
||||
<a class="nav-link bottom-nav-link p-0" v-bind:href="resolveDjangoUrl('view_books')">
|
||||
<i class="fas fa-book-open" style="font-size: 1.5em"></i><br/><small>Books</small></a> <!-- TODO localize -->
|
||||
<i class="fas fa-book-open" style="font-size: 1.5em"></i><br/><small>{{ $t('Books') }}</small></a> <!-- TODO localize -->
|
||||
</slot>
|
||||
|
||||
</div>
|
||||
|
@ -476,5 +476,7 @@
|
||||
"Use_Plural_Unit_Simple": "Use plural form for unit dynamically",
|
||||
"Use_Plural_Food_Always": "Use plural form for food always",
|
||||
"Use_Plural_Food_Simple": "Use plural form for food dynamically",
|
||||
"plural_usage_info": "Use the plural form for units and food inside this space."
|
||||
"plural_usage_info": "Use the plural form for units and food inside this space.",
|
||||
"Create Recipe": "Create Recipe",
|
||||
"Import Recipe": "Import Recipe"
|
||||
}
|
||||
|
Reference in New Issue
Block a user