enrecipes/app/components/settings/Reset.vue

110 lines
2.5 KiB
Vue
Raw Normal View History

2021-03-21 17:02:04 +00:00
<template>
2021-06-15 11:04:42 +00:00
<Page @loaded="pgLoad" actionBarHidden="true">
<RGridLayout :rtl="RTL" rows="*, auto" columns="auto, *">
2021-05-25 14:32:53 +00:00
<OptionsList title="rest" :items="items" :action="resetListItems" />
2021-04-12 18:09:48 +00:00
<GridLayout
2021-05-25 14:32:53 +00:00
:hidden="toast"
2021-04-12 18:09:48 +00:00
row="1"
2021-06-15 11:04:42 +00:00
class="appbar rtl"
@loaded="abLoad"
2021-04-12 18:09:48 +00:00
columns="auto, *"
>
2021-04-01 10:55:35 +00:00
<Button class="ico" :text="icon.back" @tap="$navigateBack()" />
</GridLayout>
2021-06-15 11:04:42 +00:00
<Toast :onload="tbLoad" :toast="toast" :action="hideToast" />
</RGridLayout>
2021-03-21 17:02:04 +00:00
</Page>
</template>
<script>
2021-06-15 11:04:42 +00:00
import { Observable } from "@nativescript/core";
2021-03-21 17:02:04 +00:00
import { localize } from "@nativescript/localize";
import { mapState, mapActions } from "vuex";
2021-04-12 18:09:48 +00:00
import * as utils from "~/shared/utils";
2021-05-25 14:32:53 +00:00
import OptionsList from "../sub/OptionsList";
import Toast from "../sub/Toast";
2021-06-15 11:04:42 +00:00
let barTimer;
2021-03-21 17:02:04 +00:00
export default {
2021-05-25 14:32:53 +00:00
components: { OptionsList, Toast },
2021-04-12 18:09:48 +00:00
data() {
return {
2021-06-15 11:04:42 +00:00
toast: 0,
appbar: 0,
toastbar: 0,
2021-04-12 18:09:48 +00:00
};
},
2021-03-21 17:02:04 +00:00
computed: {
2021-06-15 11:04:42 +00:00
...mapState(["icon", "RTL"]),
2021-03-21 17:02:04 +00:00
items() {
return [
2021-04-01 10:55:35 +00:00
{},
2021-03-21 17:02:04 +00:00
{
2021-05-25 14:32:53 +00:00
type: "list",
icon: "reset",
2021-06-15 11:04:42 +00:00
rtl: 1,
2021-03-21 17:02:04 +00:00
title: "restCuiL",
2021-05-25 14:32:53 +00:00
data: "cuisines",
2021-03-21 17:02:04 +00:00
},
{
2021-05-25 14:32:53 +00:00
type: "list",
icon: "reset",
2021-06-15 11:04:42 +00:00
rtl: 1,
2021-03-21 17:02:04 +00:00
title: "restCatL",
2021-05-25 14:32:53 +00:00
data: "categories",
2021-03-21 17:02:04 +00:00
},
{
2021-05-25 14:32:53 +00:00
type: "list",
icon: "reset",
2021-06-15 11:04:42 +00:00
rtl: 1,
2021-03-21 17:02:04 +00:00
title: "restYUL",
2021-05-25 14:32:53 +00:00
data: "yieldUnits",
2021-03-21 17:02:04 +00:00
},
{
2021-05-25 14:32:53 +00:00
type: "list",
icon: "reset",
2021-06-15 11:04:42 +00:00
rtl: 1,
2021-03-21 17:02:04 +00:00
title: "restUL",
2021-05-25 14:32:53 +00:00
data: "units",
2021-03-21 17:02:04 +00:00
},
2021-06-15 11:04:42 +00:00
{
type: "info",
title: "restInfo",
},
2021-04-01 10:55:35 +00:00
{},
2021-03-21 17:02:04 +00:00
];
},
},
methods: {
...mapActions(["resetListItemsAction"]),
2021-06-15 11:04:42 +00:00
pgLoad({ object }) {
2021-05-25 14:32:53 +00:00
object.bindingContext = new Observable();
2021-03-21 17:02:04 +00:00
},
2021-06-15 11:04:42 +00:00
abLoad({ object }) {
2021-05-22 08:56:31 +00:00
this.appbar = object;
},
2021-06-15 11:04:42 +00:00
tbLoad({ object }) {
this.toastbar = object;
},
2021-03-21 17:02:04 +00:00
// RESET
resetListItems(listName) {
this.resetListItemsAction(listName);
2021-05-22 08:56:31 +00:00
this.showToast();
},
showToast() {
2021-06-15 11:04:42 +00:00
this.animateBar(this.appbar, 0).then(() => {
this.toast = localize("restDone");
this.animateBar(this.toastbar, 1);
2021-04-12 18:09:48 +00:00
});
2021-06-15 11:04:42 +00:00
utils.timer(5, (val) => !val && this.hideToast());
2021-03-21 17:02:04 +00:00
},
2021-06-15 11:04:42 +00:00
hideToast() {
this.animateBar(this.toastbar, 0).then(() => {
this.toast = null;
this.animateBar(this.appbar, 1);
});
2021-05-22 08:56:31 +00:00
},
2021-03-21 17:02:04 +00:00
},
};
</script>