Merge remote-tracking branch 'origin/main' into main
This commit is contained in:
commit
88a8f01ec5
2 changed files with 129 additions and 68 deletions
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<Page @loaded="onPageLoad" actionBarHidden="true">
|
||||
<Page @loaded="pgLoad" actionBarHidden="true">
|
||||
<GridLayout rows="*, auto" columns="*">
|
||||
<ScrollView
|
||||
@scroll="!edit && onScroll($event)"
|
||||
@scroll="!edit && svLoad($event)"
|
||||
rowSpan="2"
|
||||
scrollBarIndicatorVisible="false"
|
||||
>
|
||||
|
@ -24,6 +24,7 @@
|
|||
<Button class="ico navBtn" :text="icon.left" @tap="prevMonth" />
|
||||
<Label
|
||||
class="monthName"
|
||||
@touch="touchMonthYearPicker"
|
||||
col="1"
|
||||
colSpan="5"
|
||||
:text="$options.filters.L(mNames[month]) + ' ' + year"
|
||||
|
@ -91,7 +92,7 @@
|
|||
col="1"
|
||||
class="ico x"
|
||||
:text="icon.x"
|
||||
@tap="removeRecipe(recipeID, mealType)"
|
||||
@tap="removeRecipe(mealType, recipeID)"
|
||||
/>
|
||||
</GridLayout>
|
||||
</StackLayout>
|
||||
|
@ -100,7 +101,7 @@
|
|||
</ScrollView>
|
||||
<GridLayout
|
||||
row="1"
|
||||
@loaded="onAppBarLoad"
|
||||
@loaded="abLoad"
|
||||
class="appbar"
|
||||
:hidden="showUndo"
|
||||
columns="auto, *, auto, auto"
|
||||
|
@ -125,7 +126,8 @@
|
|||
:count="countdown"
|
||||
:msg="snackMsg"
|
||||
:undo="undoDel"
|
||||
:action="hideUndoBar"
|
||||
:action="hideBar"
|
||||
:onload="sbLoad"
|
||||
/>
|
||||
</GridLayout>
|
||||
</Page>
|
||||
|
@ -137,8 +139,9 @@ import { mapState, mapActions } from "vuex";
|
|||
import ViewRecipe from "./ViewRecipe";
|
||||
import MPSettings from "./settings/MPSettings";
|
||||
import ActionWithSearch from "./modals/ActionWithSearch";
|
||||
import MonthYearPicker from "./modals/MonthYearPicker";
|
||||
import SnackBar from "./sub/SnackBar";
|
||||
let undoTimer;
|
||||
let barTimer;
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
@ -164,21 +167,23 @@ export default {
|
|||
"December",
|
||||
],
|
||||
month: 0,
|
||||
today: null,
|
||||
date: null,
|
||||
edit: false,
|
||||
scrollPos: 1,
|
||||
appbar: null,
|
||||
snackbar: null,
|
||||
countdown: 5,
|
||||
snackMsg: null,
|
||||
showUndo: false,
|
||||
undo: false,
|
||||
MPSettings: MPSettings,
|
||||
temp: 0,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState(["icon", "recipes", "mealPlans", "mondayFirst"]),
|
||||
todaysTime() {
|
||||
return new Date(this.year, this.month, this.today, 0).getTime();
|
||||
return new Date(this.year, this.month, this.date, 0).getTime();
|
||||
},
|
||||
getRecipes() {
|
||||
if (this.mealPlans.length) {
|
||||
|
@ -200,11 +205,16 @@ export default {
|
|||
let m = this.month;
|
||||
let ds = new Date(y, m + 1, 0).getDate();
|
||||
let fd = new Date(y, m, 1).getDay();
|
||||
let ld = new Date(y, m, ds).getDay();
|
||||
if (this.mondayFirst) fd -= 1;
|
||||
let days = new Array(fd).fill(0);
|
||||
for (let i = 1; i <= ds; i++) {
|
||||
days.push(i);
|
||||
}
|
||||
// let prevDays = Array.from(
|
||||
// { length: fd },
|
||||
// (e, k) => k + new Date(!m ? y - 1 : y, m, 0).getDate() - fd + 1
|
||||
// );
|
||||
// let days = prevDays;
|
||||
for (let i = 1; i <= ds; i++) days.push(i);
|
||||
// for (let i = 1; i <= 6 - ld; i++) days.push(i);
|
||||
return days;
|
||||
},
|
||||
isExactlyToday() {
|
||||
|
@ -212,7 +222,7 @@ export default {
|
|||
return (
|
||||
this.year == d.getFullYear() &&
|
||||
this.month == d.getMonth() &&
|
||||
this.today == d.getDate()
|
||||
this.date == d.getDate()
|
||||
);
|
||||
},
|
||||
mealTimesWithRecipes() {
|
||||
|
@ -227,15 +237,18 @@ export default {
|
|||
"addMealPlanAction",
|
||||
"deleteMealPlanAction",
|
||||
]),
|
||||
onPageLoad({ object }) {
|
||||
pgLoad({ object }) {
|
||||
object.bindingContext = new Observable();
|
||||
this.setComponent("MealPlanner");
|
||||
if (!this.today || this.today === new Date().getDate()) this.goToToday();
|
||||
if (!this.date || this.date === new Date().getDate()) this.goToToday();
|
||||
},
|
||||
onAppBarLoad({ object }) {
|
||||
abLoad({ object }) {
|
||||
this.appbar = object;
|
||||
},
|
||||
onScroll(args) {
|
||||
sbLoad({ object }) {
|
||||
this.snackbar = object;
|
||||
},
|
||||
svLoad(args) {
|
||||
let scrollUp;
|
||||
let y = args.scrollY;
|
||||
if (y) {
|
||||
|
@ -286,6 +299,7 @@ export default {
|
|||
});
|
||||
}
|
||||
},
|
||||
|
||||
// CALENDAR
|
||||
prevMonth() {
|
||||
if (this.month == 0) {
|
||||
|
@ -305,7 +319,7 @@ export default {
|
|||
let d = new Date();
|
||||
this.year = d.getFullYear();
|
||||
this.month = d.getMonth();
|
||||
this.today = d.getDate();
|
||||
this.date = d.getDate();
|
||||
this.showAppBar();
|
||||
},
|
||||
isToday(date) {
|
||||
|
@ -317,26 +331,44 @@ export default {
|
|||
);
|
||||
},
|
||||
isActive(date) {
|
||||
return this.today == date;
|
||||
return this.date == date;
|
||||
},
|
||||
hasPlans(date) {
|
||||
let d = new Date(this.year, this.month, date, 0).getTime();
|
||||
return this.mealPlans.filter((e) => e.date == d).length;
|
||||
},
|
||||
setToday(date) {
|
||||
if (date) this.today = date;
|
||||
},
|
||||
newMealPlan(date, type, title) {
|
||||
this.addMealPlanAction({
|
||||
date: date ? date : this.todaysTime,
|
||||
type,
|
||||
title,
|
||||
});
|
||||
if (date) this.date = date;
|
||||
},
|
||||
toggleEditMode() {
|
||||
this.edit = !this.edit;
|
||||
},
|
||||
openMonthYearPicker() {
|
||||
this.$showModal(MonthYearPicker, {
|
||||
props: {
|
||||
title: "gtD",
|
||||
monthNames: this.mNames,
|
||||
currentM: this.month,
|
||||
currentY: this.year,
|
||||
},
|
||||
}).then((res) => {
|
||||
if (res) {
|
||||
this.month = res.month;
|
||||
this.year = res.year;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// DATA HANDLERS
|
||||
newMealPlan({ date, type, title, index, inDB }) {
|
||||
this.addMealPlanAction({
|
||||
date: date ? date : this.todaysTime,
|
||||
type,
|
||||
title,
|
||||
index,
|
||||
inDB,
|
||||
});
|
||||
},
|
||||
addRecipe(type) {
|
||||
let filteredRecipes = this.recipes.filter((e) =>
|
||||
this.getRecipes[type] ? !this.getRecipes[type].includes(e.id) : true
|
||||
|
@ -346,64 +378,84 @@ export default {
|
|||
title: "selRec",
|
||||
recipes: filteredRecipes,
|
||||
},
|
||||
}).then((title) => title && this.newMealPlan(null, type, title));
|
||||
}).then(
|
||||
(title) =>
|
||||
title &&
|
||||
this.newMealPlan({ date: 0, type, title, index: null, inDB: true })
|
||||
);
|
||||
},
|
||||
removeRecipe(title, type) {
|
||||
deleteTempFromDB() {
|
||||
if (this.temp) {
|
||||
this.temp.inDB = 1;
|
||||
this.deleteMealPlanAction(this.temp);
|
||||
this.temp = 0;
|
||||
}
|
||||
},
|
||||
removeRecipe(type, title) {
|
||||
this.deleteTempFromDB();
|
||||
let date = this.todaysTime;
|
||||
let index = this.mealPlans.findIndex(
|
||||
(e) => e.date == date && e.type == type && e.title == title
|
||||
);
|
||||
let mealPlan = {
|
||||
date,
|
||||
type,
|
||||
title,
|
||||
index,
|
||||
};
|
||||
let temp;
|
||||
this.temp = temp = mealPlan;
|
||||
this.deleteMealPlanAction(mealPlan);
|
||||
this.showUndoBar("recRm").then(() => this.newMealPlan(date, type, title));
|
||||
this.showUndoBar("recRm")
|
||||
.then(() => this.newMealPlan({ date, type, title, index }))
|
||||
.catch(() => {
|
||||
temp.inDB = 1;
|
||||
console.log("deleting inDB after catch: ", temp);
|
||||
this.deleteMealPlanAction(temp);
|
||||
});
|
||||
},
|
||||
showUndoBar(message) {
|
||||
return new Promise((resolve, reject) => {
|
||||
clearTimeout(undoTimer);
|
||||
this.showUndo = true;
|
||||
this.snackMsg = message;
|
||||
this.countdown = 5;
|
||||
let a = 5;
|
||||
undoTimer = setInterval(() => {
|
||||
if (this.undo) {
|
||||
this.showUndo = this.undo = false;
|
||||
clearTimeout(undoTimer);
|
||||
resolve(true);
|
||||
}
|
||||
this.countdown = Math.round((a -= 0.1));
|
||||
if (this.countdown < 1) {
|
||||
this.showUndo = false;
|
||||
clearTimeout(undoTimer);
|
||||
reject(true);
|
||||
}
|
||||
}, 100);
|
||||
this.animateBar(this.appbar, 0).then(() => {
|
||||
this.showUndo = true;
|
||||
this.snackMsg = message;
|
||||
this.countdown = 5;
|
||||
this.animateBar(this.snackbar, 1).then(() => {
|
||||
let a = 5;
|
||||
clearInterval(barTimer);
|
||||
barTimer = setInterval(() => {
|
||||
if (this.undo) {
|
||||
this.hideBar();
|
||||
resolve(true);
|
||||
}
|
||||
this.countdown = Math.round((a -= 0.1));
|
||||
if (this.countdown < 1) {
|
||||
this.hideBar();
|
||||
reject(true);
|
||||
}
|
||||
}, 100);
|
||||
});
|
||||
});
|
||||
});
|
||||
},
|
||||
hideUndoBar({ object }) {
|
||||
object
|
||||
.animate({
|
||||
opacity: 0,
|
||||
translate: { x: 0, y: 64 },
|
||||
duration: 250,
|
||||
curve: CoreTypes.AnimationCurve.ease,
|
||||
})
|
||||
.then(() => {
|
||||
this.showUndo = false;
|
||||
this.appbar.translateY = 64;
|
||||
this.appbar.animate({
|
||||
translate: { x: 0, y: 0 },
|
||||
duration: 250,
|
||||
curve: CoreTypes.AnimationCurve.ease,
|
||||
});
|
||||
object.opacity = 1;
|
||||
object.translateY = 0;
|
||||
clearTimeout(undoTimer);
|
||||
});
|
||||
hideBar() {
|
||||
clearInterval(barTimer);
|
||||
this.animateBar(this.snackbar, 0).then(() => {
|
||||
this.showUndo = this.undo = false;
|
||||
this.animateBar(this.appbar, 1);
|
||||
});
|
||||
},
|
||||
undoDel() {
|
||||
this.undo = true;
|
||||
},
|
||||
|
||||
//HELPERS
|
||||
touchMonthYearPicker({ object, action }) {
|
||||
object.className = action.match(/down|move/)
|
||||
? "monthName fade"
|
||||
: "monthName";
|
||||
if (action == "up") this.openMonthYearPicker();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -311,5 +311,14 @@
|
|||
"hours": "hours",
|
||||
"seconds": "seconds",
|
||||
"tmrRm": "Timer removed",
|
||||
"notifSetg": "Notification settings"
|
||||
"notifSetg": "Notification settings",
|
||||
"random": "Random",
|
||||
"gtD": "Go to date",
|
||||
"cwewt": "Cook with ease with timers!",
|
||||
"prstTU": "Preset time updated",
|
||||
"wDBy": "%1$s was delayed by %2$s",
|
||||
"texp": "%s timers expired",
|
||||
"dismiss": "Dismiss",
|
||||
"dismissAll": "Dismiss all timers",
|
||||
"ttv": "Tap to view"
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue