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>
|
<template>
|
||||||
<Page @loaded="onPageLoad" actionBarHidden="true">
|
<Page @loaded="pgLoad" actionBarHidden="true">
|
||||||
<GridLayout rows="*, auto" columns="*">
|
<GridLayout rows="*, auto" columns="*">
|
||||||
<ScrollView
|
<ScrollView
|
||||||
@scroll="!edit && onScroll($event)"
|
@scroll="!edit && svLoad($event)"
|
||||||
rowSpan="2"
|
rowSpan="2"
|
||||||
scrollBarIndicatorVisible="false"
|
scrollBarIndicatorVisible="false"
|
||||||
>
|
>
|
||||||
|
@ -24,6 +24,7 @@
|
||||||
<Button class="ico navBtn" :text="icon.left" @tap="prevMonth" />
|
<Button class="ico navBtn" :text="icon.left" @tap="prevMonth" />
|
||||||
<Label
|
<Label
|
||||||
class="monthName"
|
class="monthName"
|
||||||
|
@touch="touchMonthYearPicker"
|
||||||
col="1"
|
col="1"
|
||||||
colSpan="5"
|
colSpan="5"
|
||||||
:text="$options.filters.L(mNames[month]) + ' ' + year"
|
:text="$options.filters.L(mNames[month]) + ' ' + year"
|
||||||
|
@ -91,7 +92,7 @@
|
||||||
col="1"
|
col="1"
|
||||||
class="ico x"
|
class="ico x"
|
||||||
:text="icon.x"
|
:text="icon.x"
|
||||||
@tap="removeRecipe(recipeID, mealType)"
|
@tap="removeRecipe(mealType, recipeID)"
|
||||||
/>
|
/>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
|
@ -100,7 +101,7 @@
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
<GridLayout
|
<GridLayout
|
||||||
row="1"
|
row="1"
|
||||||
@loaded="onAppBarLoad"
|
@loaded="abLoad"
|
||||||
class="appbar"
|
class="appbar"
|
||||||
:hidden="showUndo"
|
:hidden="showUndo"
|
||||||
columns="auto, *, auto, auto"
|
columns="auto, *, auto, auto"
|
||||||
|
@ -125,7 +126,8 @@
|
||||||
:count="countdown"
|
:count="countdown"
|
||||||
:msg="snackMsg"
|
:msg="snackMsg"
|
||||||
:undo="undoDel"
|
:undo="undoDel"
|
||||||
:action="hideUndoBar"
|
:action="hideBar"
|
||||||
|
:onload="sbLoad"
|
||||||
/>
|
/>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</Page>
|
</Page>
|
||||||
|
@ -137,8 +139,9 @@ import { mapState, mapActions } from "vuex";
|
||||||
import ViewRecipe from "./ViewRecipe";
|
import ViewRecipe from "./ViewRecipe";
|
||||||
import MPSettings from "./settings/MPSettings";
|
import MPSettings from "./settings/MPSettings";
|
||||||
import ActionWithSearch from "./modals/ActionWithSearch";
|
import ActionWithSearch from "./modals/ActionWithSearch";
|
||||||
|
import MonthYearPicker from "./modals/MonthYearPicker";
|
||||||
import SnackBar from "./sub/SnackBar";
|
import SnackBar from "./sub/SnackBar";
|
||||||
let undoTimer;
|
let barTimer;
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
|
@ -164,21 +167,23 @@ export default {
|
||||||
"December",
|
"December",
|
||||||
],
|
],
|
||||||
month: 0,
|
month: 0,
|
||||||
today: null,
|
date: null,
|
||||||
edit: false,
|
edit: false,
|
||||||
scrollPos: 1,
|
scrollPos: 1,
|
||||||
appbar: null,
|
appbar: null,
|
||||||
|
snackbar: null,
|
||||||
countdown: 5,
|
countdown: 5,
|
||||||
snackMsg: null,
|
snackMsg: null,
|
||||||
showUndo: false,
|
showUndo: false,
|
||||||
undo: false,
|
undo: false,
|
||||||
MPSettings: MPSettings,
|
MPSettings: MPSettings,
|
||||||
|
temp: 0,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState(["icon", "recipes", "mealPlans", "mondayFirst"]),
|
...mapState(["icon", "recipes", "mealPlans", "mondayFirst"]),
|
||||||
todaysTime() {
|
todaysTime() {
|
||||||
return new Date(this.year, this.month, this.today, 0).getTime();
|
return new Date(this.year, this.month, this.date, 0).getTime();
|
||||||
},
|
},
|
||||||
getRecipes() {
|
getRecipes() {
|
||||||
if (this.mealPlans.length) {
|
if (this.mealPlans.length) {
|
||||||
|
@ -200,11 +205,16 @@ export default {
|
||||||
let m = this.month;
|
let m = this.month;
|
||||||
let ds = new Date(y, m + 1, 0).getDate();
|
let ds = new Date(y, m + 1, 0).getDate();
|
||||||
let fd = new Date(y, m, 1).getDay();
|
let fd = new Date(y, m, 1).getDay();
|
||||||
|
let ld = new Date(y, m, ds).getDay();
|
||||||
if (this.mondayFirst) fd -= 1;
|
if (this.mondayFirst) fd -= 1;
|
||||||
let days = new Array(fd).fill(0);
|
let days = new Array(fd).fill(0);
|
||||||
for (let i = 1; i <= ds; i++) {
|
// let prevDays = Array.from(
|
||||||
days.push(i);
|
// { 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;
|
return days;
|
||||||
},
|
},
|
||||||
isExactlyToday() {
|
isExactlyToday() {
|
||||||
|
@ -212,7 +222,7 @@ export default {
|
||||||
return (
|
return (
|
||||||
this.year == d.getFullYear() &&
|
this.year == d.getFullYear() &&
|
||||||
this.month == d.getMonth() &&
|
this.month == d.getMonth() &&
|
||||||
this.today == d.getDate()
|
this.date == d.getDate()
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
mealTimesWithRecipes() {
|
mealTimesWithRecipes() {
|
||||||
|
@ -227,15 +237,18 @@ export default {
|
||||||
"addMealPlanAction",
|
"addMealPlanAction",
|
||||||
"deleteMealPlanAction",
|
"deleteMealPlanAction",
|
||||||
]),
|
]),
|
||||||
onPageLoad({ object }) {
|
pgLoad({ object }) {
|
||||||
object.bindingContext = new Observable();
|
object.bindingContext = new Observable();
|
||||||
this.setComponent("MealPlanner");
|
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;
|
this.appbar = object;
|
||||||
},
|
},
|
||||||
onScroll(args) {
|
sbLoad({ object }) {
|
||||||
|
this.snackbar = object;
|
||||||
|
},
|
||||||
|
svLoad(args) {
|
||||||
let scrollUp;
|
let scrollUp;
|
||||||
let y = args.scrollY;
|
let y = args.scrollY;
|
||||||
if (y) {
|
if (y) {
|
||||||
|
@ -286,6 +299,7 @@ export default {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// CALENDAR
|
// CALENDAR
|
||||||
prevMonth() {
|
prevMonth() {
|
||||||
if (this.month == 0) {
|
if (this.month == 0) {
|
||||||
|
@ -305,7 +319,7 @@ export default {
|
||||||
let d = new Date();
|
let d = new Date();
|
||||||
this.year = d.getFullYear();
|
this.year = d.getFullYear();
|
||||||
this.month = d.getMonth();
|
this.month = d.getMonth();
|
||||||
this.today = d.getDate();
|
this.date = d.getDate();
|
||||||
this.showAppBar();
|
this.showAppBar();
|
||||||
},
|
},
|
||||||
isToday(date) {
|
isToday(date) {
|
||||||
|
@ -317,26 +331,44 @@ export default {
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
isActive(date) {
|
isActive(date) {
|
||||||
return this.today == date;
|
return this.date == date;
|
||||||
},
|
},
|
||||||
hasPlans(date) {
|
hasPlans(date) {
|
||||||
let d = new Date(this.year, this.month, date, 0).getTime();
|
let d = new Date(this.year, this.month, date, 0).getTime();
|
||||||
return this.mealPlans.filter((e) => e.date == d).length;
|
return this.mealPlans.filter((e) => e.date == d).length;
|
||||||
},
|
},
|
||||||
setToday(date) {
|
setToday(date) {
|
||||||
if (date) this.today = date;
|
if (date) this.date = date;
|
||||||
},
|
|
||||||
newMealPlan(date, type, title) {
|
|
||||||
this.addMealPlanAction({
|
|
||||||
date: date ? date : this.todaysTime,
|
|
||||||
type,
|
|
||||||
title,
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
toggleEditMode() {
|
toggleEditMode() {
|
||||||
this.edit = !this.edit;
|
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
|
// DATA HANDLERS
|
||||||
|
newMealPlan({ date, type, title, index, inDB }) {
|
||||||
|
this.addMealPlanAction({
|
||||||
|
date: date ? date : this.todaysTime,
|
||||||
|
type,
|
||||||
|
title,
|
||||||
|
index,
|
||||||
|
inDB,
|
||||||
|
});
|
||||||
|
},
|
||||||
addRecipe(type) {
|
addRecipe(type) {
|
||||||
let filteredRecipes = this.recipes.filter((e) =>
|
let filteredRecipes = this.recipes.filter((e) =>
|
||||||
this.getRecipes[type] ? !this.getRecipes[type].includes(e.id) : true
|
this.getRecipes[type] ? !this.getRecipes[type].includes(e.id) : true
|
||||||
|
@ -346,64 +378,84 @@ export default {
|
||||||
title: "selRec",
|
title: "selRec",
|
||||||
recipes: filteredRecipes,
|
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 date = this.todaysTime;
|
||||||
|
let index = this.mealPlans.findIndex(
|
||||||
|
(e) => e.date == date && e.type == type && e.title == title
|
||||||
|
);
|
||||||
let mealPlan = {
|
let mealPlan = {
|
||||||
date,
|
date,
|
||||||
type,
|
type,
|
||||||
title,
|
title,
|
||||||
|
index,
|
||||||
};
|
};
|
||||||
|
let temp;
|
||||||
|
this.temp = temp = mealPlan;
|
||||||
this.deleteMealPlanAction(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) {
|
showUndoBar(message) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
clearTimeout(undoTimer);
|
this.animateBar(this.appbar, 0).then(() => {
|
||||||
this.showUndo = true;
|
this.showUndo = true;
|
||||||
this.snackMsg = message;
|
this.snackMsg = message;
|
||||||
this.countdown = 5;
|
this.countdown = 5;
|
||||||
|
this.animateBar(this.snackbar, 1).then(() => {
|
||||||
let a = 5;
|
let a = 5;
|
||||||
undoTimer = setInterval(() => {
|
clearInterval(barTimer);
|
||||||
|
barTimer = setInterval(() => {
|
||||||
if (this.undo) {
|
if (this.undo) {
|
||||||
this.showUndo = this.undo = false;
|
this.hideBar();
|
||||||
clearTimeout(undoTimer);
|
|
||||||
resolve(true);
|
resolve(true);
|
||||||
}
|
}
|
||||||
this.countdown = Math.round((a -= 0.1));
|
this.countdown = Math.round((a -= 0.1));
|
||||||
if (this.countdown < 1) {
|
if (this.countdown < 1) {
|
||||||
this.showUndo = false;
|
this.hideBar();
|
||||||
clearTimeout(undoTimer);
|
|
||||||
reject(true);
|
reject(true);
|
||||||
}
|
}
|
||||||
}, 100);
|
}, 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() {
|
undoDel() {
|
||||||
this.undo = true;
|
this.undo = true;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
//HELPERS
|
||||||
|
touchMonthYearPicker({ object, action }) {
|
||||||
|
object.className = action.match(/down|move/)
|
||||||
|
? "monthName fade"
|
||||||
|
: "monthName";
|
||||||
|
if (action == "up") this.openMonthYearPicker();
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -311,5 +311,14 @@
|
||||||
"hours": "hours",
|
"hours": "hours",
|
||||||
"seconds": "seconds",
|
"seconds": "seconds",
|
||||||
"tmrRm": "Timer removed",
|
"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