fixed tabs refresh issue
Before Width: | Height: | Size: 519 B After Width: | Height: | Size: 488 B |
Before Width: | Height: | Size: 312 B After Width: | Height: | Size: 303 B |
Before Width: | Height: | Size: 341 B After Width: | Height: | Size: 363 B |
Before Width: | Height: | Size: 550 B After Width: | Height: | Size: 552 B |
Before Width: | Height: | Size: 930 B After Width: | Height: | Size: 979 B |
Before Width: | Height: | Size: 928 B After Width: | Height: | Size: 1,020 B |
103
app/app.scss
|
@ -42,7 +42,8 @@ Page,
|
||||||
Page,
|
Page,
|
||||||
ActionBar,
|
ActionBar,
|
||||||
SearchBar,
|
SearchBar,
|
||||||
TabView,
|
Tabs,
|
||||||
|
TabStripItem,
|
||||||
ListPicker {
|
ListPicker {
|
||||||
color: $gray9;
|
color: $gray9;
|
||||||
background: $gray1;
|
background: $gray1;
|
||||||
|
@ -51,11 +52,6 @@ Page,
|
||||||
MDButton {
|
MDButton {
|
||||||
ripple-color: rgba($gray6, 0.2);
|
ripple-color: rgba($gray6, 0.2);
|
||||||
}
|
}
|
||||||
|
|
||||||
TabView {
|
|
||||||
tab-background-color: $gray1;
|
|
||||||
selected-tab-text-color: $gray9;
|
|
||||||
}
|
|
||||||
.hr {
|
.hr {
|
||||||
border-color: $gray3;
|
border-color: $gray3;
|
||||||
}
|
}
|
||||||
|
@ -63,13 +59,15 @@ Page,
|
||||||
.fieldLabel {
|
.fieldLabel {
|
||||||
background: $gray1;
|
background: $gray1;
|
||||||
}
|
}
|
||||||
.referenceItem,
|
.urlCard,
|
||||||
.recipeText,
|
.textCard,
|
||||||
.overviewItem,
|
.overviewItem,
|
||||||
.recipeItem,
|
.recipeItem {
|
||||||
TextField.combinationToken {
|
|
||||||
background: white;
|
background: white;
|
||||||
}
|
}
|
||||||
|
TextField.combinationToken {
|
||||||
|
background: $gray3;
|
||||||
|
}
|
||||||
|
|
||||||
.sd-item,
|
.sd-item,
|
||||||
.sd-group-header,
|
.sd-group-header,
|
||||||
|
@ -108,15 +106,16 @@ Page,
|
||||||
Page,
|
Page,
|
||||||
ActionBar,
|
ActionBar,
|
||||||
SearchBar,
|
SearchBar,
|
||||||
TabView,
|
Tabs,
|
||||||
|
TabStripItem,
|
||||||
ListPicker {
|
ListPicker {
|
||||||
color: $gray1;
|
color: $gray1;
|
||||||
background: $gray9;
|
background: $gray9;
|
||||||
}
|
}
|
||||||
TabView {
|
// TabView {
|
||||||
tab-background-color: $gray9;
|
// tab-background-color: $gray9;
|
||||||
selected-tab-text-color: $gray1;
|
// selected-tab-text-color: $gray1;
|
||||||
}
|
// }
|
||||||
MDRipple,
|
MDRipple,
|
||||||
MDButton {
|
MDButton {
|
||||||
ripple-color: rgba($gray4, 0.1);
|
ripple-color: rgba($gray4, 0.1);
|
||||||
|
@ -129,8 +128,8 @@ Page,
|
||||||
.fieldLabel {
|
.fieldLabel {
|
||||||
background: $gray9;
|
background: $gray9;
|
||||||
}
|
}
|
||||||
.referenceItem,
|
.urlCard,
|
||||||
.recipeText,
|
.textCard,
|
||||||
.overviewItem,
|
.overviewItem,
|
||||||
.recipeItem,
|
.recipeItem,
|
||||||
TextField.combinationToken {
|
TextField.combinationToken {
|
||||||
|
@ -194,7 +193,7 @@ TabView {
|
||||||
tab-text-color: $gray6;
|
tab-text-color: $gray6;
|
||||||
}
|
}
|
||||||
.inputField {
|
.inputField {
|
||||||
margin-bottom: 14;
|
margin-bottom: 4;
|
||||||
}
|
}
|
||||||
.fieldLabel {
|
.fieldLabel {
|
||||||
font-size: 12;
|
font-size: 12;
|
||||||
|
@ -218,8 +217,8 @@ MDProgress {
|
||||||
// ActionBar
|
// ActionBar
|
||||||
ActionBar {
|
ActionBar {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0 8;
|
padding: 6 8;
|
||||||
height: 64;
|
// height: 64;
|
||||||
GridLayout {
|
GridLayout {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -227,6 +226,9 @@ ActionBar {
|
||||||
MDButton.bx {
|
MDButton.bx {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
&.flip {
|
||||||
|
transform: scaleX(-1);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.title {
|
.title {
|
||||||
padding-left: 12;
|
padding-left: 12;
|
||||||
|
@ -268,7 +270,7 @@ ActionBar {
|
||||||
}
|
}
|
||||||
.sd-group-header {
|
.sd-group-header {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 8 0 8 8;
|
padding: 8;
|
||||||
}
|
}
|
||||||
MDRipple {
|
MDRipple {
|
||||||
border-radius: 4;
|
border-radius: 4;
|
||||||
|
@ -318,9 +320,6 @@ MDButton {
|
||||||
vertical-alignment: center;
|
vertical-alignment: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.noResult {
|
|
||||||
margin-top: 32;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
// -----------------------------
|
// -----------------------------
|
||||||
// Recipe Items
|
// Recipe Items
|
||||||
|
@ -375,18 +374,18 @@ RadListView {
|
||||||
padding: 8;
|
padding: 8;
|
||||||
}
|
}
|
||||||
.main-container {
|
.main-container {
|
||||||
padding: 8 8 128;
|
padding: 8 8 88;
|
||||||
.option {
|
.option {
|
||||||
font-size: 16;
|
font-size: 16;
|
||||||
.bx {
|
.bx {
|
||||||
margin: 16 24 16 16;
|
margin: 11 24 11 16;
|
||||||
}
|
}
|
||||||
.info {
|
.info {
|
||||||
font-size: 12;
|
font-size: 12;
|
||||||
line-height: 4;
|
line-height: 4;
|
||||||
}
|
}
|
||||||
StackLayout {
|
StackLayout {
|
||||||
margin: 16 24 16 0;
|
margin: 9 24 9 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -406,8 +405,7 @@ RadListView {
|
||||||
.viewRecipe {
|
.viewRecipe {
|
||||||
.category,
|
.category,
|
||||||
.time,
|
.time,
|
||||||
.ingredient,
|
.ingredient {
|
||||||
.ingredient-check {
|
|
||||||
font-size: 16;
|
font-size: 16;
|
||||||
}
|
}
|
||||||
.category {
|
.category {
|
||||||
|
@ -440,12 +438,8 @@ RadListView {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.ingredient,
|
.ingredient {
|
||||||
.ingredient-check {
|
|
||||||
line-height: 6;
|
line-height: 6;
|
||||||
padding-bottom: 12;
|
|
||||||
}
|
|
||||||
.ingredient-check {
|
|
||||||
padding-bottom: 0;
|
padding-bottom: 0;
|
||||||
}
|
}
|
||||||
.count {
|
.count {
|
||||||
|
@ -455,54 +449,37 @@ RadListView {
|
||||||
margin: 0 0 0 8;
|
margin: 0 0 0 8;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 99;
|
border-radius: 99;
|
||||||
&.square {
|
|
||||||
clip-path: polygon(
|
|
||||||
5% 0,
|
|
||||||
95% 0,
|
|
||||||
100% 5%,
|
|
||||||
100% 65%,
|
|
||||||
65% 100%,
|
|
||||||
5% 100%,
|
|
||||||
0 95%,
|
|
||||||
0 5%
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.instruction,
|
.instruction {
|
||||||
.note,
|
|
||||||
.reference {
|
|
||||||
font-size: 16;
|
font-size: 16;
|
||||||
line-height: 6;
|
line-height: 6;
|
||||||
padding: 2 0 14 36;
|
padding: 1 0 24 36;
|
||||||
margin: 0 0 0 19;
|
margin: 0 0 0 19;
|
||||||
border-width: 0 0 0 2;
|
border-width: 0 0 0 2;
|
||||||
}
|
}
|
||||||
.instruction.noBorder {
|
.instruction.noBorder {
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
}
|
}
|
||||||
.note {
|
.urlCard {
|
||||||
border-width: 0;
|
|
||||||
}
|
|
||||||
.referenceItem {
|
|
||||||
margin: 8 16;
|
margin: 8 16;
|
||||||
border-radius: 4;
|
border-radius: 4;
|
||||||
font-size: 16;
|
font-size: 16;
|
||||||
.bx {
|
.bx {
|
||||||
font-size: 24;
|
font-size: 24;
|
||||||
}
|
}
|
||||||
.recipeLink {
|
.link {
|
||||||
padding: 16;
|
padding: 13 16 13 11;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
line-height: 6;
|
line-height: 6;
|
||||||
}
|
}
|
||||||
.linkIcon {
|
.linkIcon {
|
||||||
padding: 0 16 0 0;
|
padding: 0 0 0 12;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.recipeText {
|
.textCard {
|
||||||
font-size: 16;
|
font-size: 16;
|
||||||
line-height: 6;
|
line-height: 6;
|
||||||
padding: 16;
|
padding: 13 16;
|
||||||
margin: 8 16;
|
margin: 8 16;
|
||||||
border-radius: 4;
|
border-radius: 4;
|
||||||
}
|
}
|
||||||
|
@ -510,6 +487,7 @@ RadListView {
|
||||||
// -----------------------------
|
// -----------------------------
|
||||||
// FAB
|
// FAB
|
||||||
#btnFabContainer {
|
#btnFabContainer {
|
||||||
|
z-index: 100;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
@ -539,13 +517,10 @@ MDButton.closeBtn {
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
vertical-alignment: top;
|
vertical-alignment: top;
|
||||||
}
|
}
|
||||||
TextField.combinationToken {
|
|
||||||
border-width: 0;
|
|
||||||
}
|
|
||||||
// -----------------------------
|
// -----------------------------
|
||||||
// MEAL PLANNER
|
// MEAL PLANNER
|
||||||
.dayPlan {
|
.dayPlan {
|
||||||
padding: 0;
|
padding: 0 0 88;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
.plansContainer {
|
.plansContainer {
|
||||||
padding: 8 4;
|
padding: 8 4;
|
||||||
|
@ -614,7 +589,7 @@ TextField.combinationToken {
|
||||||
letter-spacing: 0;
|
letter-spacing: 0;
|
||||||
text-transform: none;
|
text-transform: none;
|
||||||
line-height: 6;
|
line-height: 6;
|
||||||
padding: 16 24;
|
padding: 13 24;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
.actionsContainer {
|
.actionsContainer {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<Page @loaded="onPageLoad">
|
<Page @loaded="onPageLoad">
|
||||||
<ActionBar :flat="viewIsScrolled ? false : true">
|
<ActionBar :androidElevation="viewIsScrolled ? 4 : 0">
|
||||||
<GridLayout rows="*" columns="auto, *">
|
<GridLayout rows="*" columns="auto, *">
|
||||||
<MDButton
|
<MDButton
|
||||||
variant="text"
|
variant="text"
|
||||||
|
@ -13,7 +13,7 @@
|
||||||
<Label class="title orkm" text="About" col="1" />
|
<Label class="title orkm" text="About" col="1" />
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</ActionBar>
|
</ActionBar>
|
||||||
<ScrollView scrollBarIndicatorVisible="true" @scroll="onScroll">
|
<ScrollView @scroll="onScroll">
|
||||||
<StackLayout class="main-container">
|
<StackLayout class="main-container">
|
||||||
<StackLayout
|
<StackLayout
|
||||||
horizontalAlignment="center"
|
horizontalAlignment="center"
|
||||||
|
@ -118,9 +118,7 @@ export default {
|
||||||
utils.showDrawer()
|
utils.showDrawer()
|
||||||
},
|
},
|
||||||
onScroll(args) {
|
onScroll(args) {
|
||||||
args.scrollY
|
this.viewIsScrolled = args.scrollY ? true : false
|
||||||
? (this.viewIsScrolled = true)
|
|
||||||
: (this.viewIsScrolled = false)
|
|
||||||
},
|
},
|
||||||
openURL(url) {
|
openURL(url) {
|
||||||
Utils.openUrl(url)
|
Utils.openUrl(url)
|
||||||
|
|
|
@ -169,20 +169,20 @@ export default {
|
||||||
MealPlanner: MealPlanner,
|
MealPlanner: MealPlanner,
|
||||||
topmenu: [
|
topmenu: [
|
||||||
{
|
{
|
||||||
title: "Home",
|
title: "EnRecipes",
|
||||||
component: "EnRecipes",
|
component: "EnRecipes",
|
||||||
icon: "home",
|
icon: "home",
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: "Favorites",
|
|
||||||
component: "Favorites",
|
|
||||||
icon: "heart",
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "Try Later",
|
title: "Try Later",
|
||||||
component: "Try Later",
|
component: "Try Later",
|
||||||
icon: "trylater",
|
icon: "trylater",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "Favorites",
|
||||||
|
component: "Favorites",
|
||||||
|
icon: "heart",
|
||||||
|
},
|
||||||
],
|
],
|
||||||
bottommenu: [
|
bottommenu: [
|
||||||
{
|
{
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<Page @loaded="onPageLoad" @unloaded="releaseBackEvent">
|
<Page @loaded="onPageLoad" @unloaded="releaseBackEvent">
|
||||||
<ActionBar :flat="viewIsScrolled ? false : true">
|
<ActionBar :androidElevation="viewIsScrolled ? 4 : 0">
|
||||||
<GridLayout rows="*" columns="auto, *, auto">
|
<GridLayout rows="*" columns="auto, *, auto">
|
||||||
<MDButton
|
<MDButton
|
||||||
variant="text"
|
variant="text"
|
||||||
|
@ -22,13 +22,8 @@
|
||||||
<MDActivityIndicator col="2" v-if="saving" :busy="saving" />
|
<MDActivityIndicator col="2" v-if="saving" :busy="saving" />
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</ActionBar>
|
</ActionBar>
|
||||||
<ScrollView
|
<ScrollView width="100%" height="100%" @scroll="onScroll">
|
||||||
width="100%"
|
<StackLayout width="100%" padding="0 0 88">
|
||||||
height="100%"
|
|
||||||
@scroll="onScroll"
|
|
||||||
scrollBarIndicatorVisible="true"
|
|
||||||
>
|
|
||||||
<StackLayout width="100%" padding="0 0 128">
|
|
||||||
<AbsoluteLayout>
|
<AbsoluteLayout>
|
||||||
<StackLayout
|
<StackLayout
|
||||||
width="100%"
|
width="100%"
|
||||||
|
@ -133,7 +128,7 @@
|
||||||
returnKeyType="next"
|
returnKeyType="next"
|
||||||
/>
|
/>
|
||||||
<TextField
|
<TextField
|
||||||
width="68"
|
width="60"
|
||||||
col="2"
|
col="2"
|
||||||
v-model="recipeContent.ingredients[index].quantity"
|
v-model="recipeContent.ingredients[index].quantity"
|
||||||
hint="1.00"
|
hint="1.00"
|
||||||
|
@ -141,7 +136,7 @@
|
||||||
returnKeyType="next"
|
returnKeyType="next"
|
||||||
/>
|
/>
|
||||||
<TextField
|
<TextField
|
||||||
width="68"
|
width="76"
|
||||||
col="4"
|
col="4"
|
||||||
v-model="recipeContent.ingredients[index].unit"
|
v-model="recipeContent.ingredients[index].unit"
|
||||||
hint="Unit"
|
hint="Unit"
|
||||||
|
@ -198,66 +193,6 @@
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
|
|
||||||
<StackLayout margin="0 16">
|
<StackLayout margin="0 16">
|
||||||
<Label text="Notes" class="sectionTitle" />
|
|
||||||
<GridLayout
|
|
||||||
columns="*,8,auto"
|
|
||||||
v-for="(note, index) in recipeContent.notes"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<TextView
|
|
||||||
@loaded="focusField($event, 'multiLine')"
|
|
||||||
col="0"
|
|
||||||
:hint="`Note ${index + 1}`"
|
|
||||||
v-model="recipeContent.notes[index]"
|
|
||||||
/>
|
|
||||||
<MDButton
|
|
||||||
variant="text"
|
|
||||||
col="2"
|
|
||||||
class="bx closeBtn"
|
|
||||||
:text="icon.close"
|
|
||||||
@tap="removeNote(index)"
|
|
||||||
/>
|
|
||||||
</GridLayout>
|
|
||||||
<MDButton
|
|
||||||
variant="text"
|
|
||||||
class="text-btn orkm"
|
|
||||||
text="+ ADD NOTE"
|
|
||||||
@tap="addNote"
|
|
||||||
/>
|
|
||||||
<StackLayout class="hr" margin="24 16"></StackLayout>
|
|
||||||
</StackLayout>
|
|
||||||
|
|
||||||
<StackLayout margin="0 16">
|
|
||||||
<Label text="References" class="sectionTitle" />
|
|
||||||
<GridLayout
|
|
||||||
columns="*,8,auto"
|
|
||||||
v-for="(reference, index) in recipeContent.references"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<TextView
|
|
||||||
@loaded="focusField($event, 'multiLine')"
|
|
||||||
col="0"
|
|
||||||
v-model="recipeContent.references[index]"
|
|
||||||
hint="Text or Website/Video URL"
|
|
||||||
/>
|
|
||||||
<MDButton
|
|
||||||
variant="text"
|
|
||||||
col="2"
|
|
||||||
class="bx closeBtn"
|
|
||||||
:text="icon.close"
|
|
||||||
@tap="removeReference(index)"
|
|
||||||
/>
|
|
||||||
</GridLayout>
|
|
||||||
<MDButton
|
|
||||||
variant="text"
|
|
||||||
class="text-btn orkm"
|
|
||||||
text="+ ADD REFERENCE"
|
|
||||||
@tap="addReference"
|
|
||||||
/>
|
|
||||||
<StackLayout class="hr" margin="24 16"></StackLayout>
|
|
||||||
</StackLayout>
|
|
||||||
|
|
||||||
<StackLayout margin="0 16 24">
|
|
||||||
<Label text="Combinations" class="sectionTitle" />
|
<Label text="Combinations" class="sectionTitle" />
|
||||||
<GridLayout
|
<GridLayout
|
||||||
columns="*,8,auto"
|
columns="*,8,auto"
|
||||||
|
@ -284,6 +219,36 @@
|
||||||
text="+ ADD COMBINATION"
|
text="+ ADD COMBINATION"
|
||||||
@tap="showCombinations"
|
@tap="showCombinations"
|
||||||
/>
|
/>
|
||||||
|
<StackLayout class="hr" margin="24 16"></StackLayout>
|
||||||
|
</StackLayout>
|
||||||
|
|
||||||
|
<StackLayout margin="0 16">
|
||||||
|
<Label text="Notes" class="sectionTitle" />
|
||||||
|
<GridLayout
|
||||||
|
columns="*,8,auto"
|
||||||
|
v-for="(note, index) in recipeContent.notes"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
|
<TextView
|
||||||
|
@loaded="focusField($event, 'multiLine')"
|
||||||
|
col="0"
|
||||||
|
hint="Text or URL"
|
||||||
|
v-model="recipeContent.notes[index]"
|
||||||
|
/>
|
||||||
|
<MDButton
|
||||||
|
variant="text"
|
||||||
|
col="2"
|
||||||
|
class="bx closeBtn"
|
||||||
|
:text="icon.close"
|
||||||
|
@tap="removeNote(index)"
|
||||||
|
/>
|
||||||
|
</GridLayout>
|
||||||
|
<MDButton
|
||||||
|
variant="text"
|
||||||
|
class="text-btn orkm"
|
||||||
|
text="+ ADD NOTE"
|
||||||
|
@tap="addNote"
|
||||||
|
/>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
|
@ -310,6 +275,8 @@ import * as Filepicker from "nativescript-plugin-filepicker"
|
||||||
import { ImageCropper } from "nativescript-imagecropper"
|
import { ImageCropper } from "nativescript-imagecropper"
|
||||||
import { mapState, mapActions } from "vuex"
|
import { mapState, mapActions } from "vuex"
|
||||||
|
|
||||||
|
import ViewRecipe from "./ViewRecipe.vue"
|
||||||
|
|
||||||
import ActionDialog from "./modal/ActionDialog.vue"
|
import ActionDialog from "./modal/ActionDialog.vue"
|
||||||
import ActionDialogWithSearch from "./modal/ActionDialogWithSearch.vue"
|
import ActionDialogWithSearch from "./modal/ActionDialogWithSearch.vue"
|
||||||
import ConfirmDialog from "./modal/ConfirmDialog.vue"
|
import ConfirmDialog from "./modal/ConfirmDialog.vue"
|
||||||
|
@ -319,7 +286,13 @@ import ListPicker from "./modal/ListPicker.vue"
|
||||||
import * as utils from "~/shared/utils"
|
import * as utils from "~/shared/utils"
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: ["recipeID", "selectedCategory", "filterFavorites", "filterTrylater"],
|
props: [
|
||||||
|
"recipeID",
|
||||||
|
"selectedCategory",
|
||||||
|
"filterFavorites",
|
||||||
|
"filterTrylater",
|
||||||
|
"navigationFromView",
|
||||||
|
],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
title: "New recipe",
|
title: "New recipe",
|
||||||
|
@ -335,9 +308,8 @@ export default {
|
||||||
},
|
},
|
||||||
ingredients: [],
|
ingredients: [],
|
||||||
instructions: [],
|
instructions: [],
|
||||||
notes: [],
|
|
||||||
references: [],
|
|
||||||
combinations: [],
|
combinations: [],
|
||||||
|
notes: [],
|
||||||
isFavorite: false,
|
isFavorite: false,
|
||||||
tried: true,
|
tried: true,
|
||||||
lastTried: null,
|
lastTried: null,
|
||||||
|
@ -460,9 +432,7 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
onScroll(args) {
|
onScroll(args) {
|
||||||
args.scrollY
|
this.viewIsScrolled = args.scrollY ? true : false
|
||||||
? (this.viewIsScrolled = true)
|
|
||||||
: (this.viewIsScrolled = false)
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// DATA LIST
|
// DATA LIST
|
||||||
|
@ -576,6 +546,17 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
// NAVIGATION HANDLERS
|
// NAVIGATION HANDLERS
|
||||||
|
navigateBackController() {
|
||||||
|
if (this.navigationFromView) {
|
||||||
|
this.$navigateTo(ViewRecipe, {
|
||||||
|
props: {
|
||||||
|
filterTrylater: this.filterTrylater,
|
||||||
|
recipeID: this.recipeID,
|
||||||
|
},
|
||||||
|
backstackVisible: false,
|
||||||
|
})
|
||||||
|
} else this.$navigateBack()
|
||||||
|
},
|
||||||
navigateBack() {
|
navigateBack() {
|
||||||
if (this.hasChanges) {
|
if (this.hasChanges) {
|
||||||
this.blockModal = true
|
this.blockModal = true
|
||||||
|
@ -590,12 +571,12 @@ export default {
|
||||||
}).then((action) => {
|
}).then((action) => {
|
||||||
this.blockModal = false
|
this.blockModal = false
|
||||||
if (action != null && !action) {
|
if (action != null && !action) {
|
||||||
this.$navigateBack()
|
this.navigateBackController()
|
||||||
this.releaseBackEvent()
|
this.releaseBackEvent()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
this.$navigateBack()
|
this.navigateBackController()
|
||||||
this.releaseBackEvent()
|
this.releaseBackEvent()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -722,12 +703,12 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
// INPUT FIELD HANDLERS
|
// INPUT FIELD HANDLERS
|
||||||
fieldDeletionConfirm(item) {
|
fieldDeletionConfirm(title) {
|
||||||
return this.$showModal(ConfirmDialog, {
|
return this.$showModal(ConfirmDialog, {
|
||||||
props: {
|
props: {
|
||||||
title: `Delete ${item}?`,
|
title,
|
||||||
cancelButtonText: "CANCEL",
|
cancelButtonText: "CANCEL",
|
||||||
okButtonText: "DELETE",
|
okButtonText: "REMOVE",
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
@ -740,7 +721,7 @@ export default {
|
||||||
},
|
},
|
||||||
removeIngredient(index) {
|
removeIngredient(index) {
|
||||||
if (this.recipeContent.ingredients[index].item.length) {
|
if (this.recipeContent.ingredients[index].item.length) {
|
||||||
this.fieldDeletionConfirm("ingredient").then((res) => {
|
this.fieldDeletionConfirm("Remove ingredient").then((res) => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.recipeContent.ingredients.splice(index, 1)
|
this.recipeContent.ingredients.splice(index, 1)
|
||||||
}
|
}
|
||||||
|
@ -753,7 +734,7 @@ export default {
|
||||||
},
|
},
|
||||||
removeInstruction(index) {
|
removeInstruction(index) {
|
||||||
if (this.recipeContent.instructions[index].length) {
|
if (this.recipeContent.instructions[index].length) {
|
||||||
this.fieldDeletionConfirm("instruction").then((res) => {
|
this.fieldDeletionConfirm("Remove instruction").then((res) => {
|
||||||
res && this.recipeContent.instructions.splice(index, 1)
|
res && this.recipeContent.instructions.splice(index, 1)
|
||||||
})
|
})
|
||||||
} else this.recipeContent.instructions.splice(index, 1)
|
} else this.recipeContent.instructions.splice(index, 1)
|
||||||
|
@ -783,7 +764,7 @@ export default {
|
||||||
},
|
},
|
||||||
removeCombination(id) {
|
removeCombination(id) {
|
||||||
let index = this.recipeContent.combinations.indexOf(id)
|
let index = this.recipeContent.combinations.indexOf(id)
|
||||||
this.fieldDeletionConfirm("combination").then((res) => {
|
this.fieldDeletionConfirm("Remove combination").then((res) => {
|
||||||
if (res) {
|
if (res) {
|
||||||
this.recipeContent.combinations.splice(index, 1)
|
this.recipeContent.combinations.splice(index, 1)
|
||||||
this.unSyncCombinations.push(id)
|
this.unSyncCombinations.push(id)
|
||||||
|
@ -796,25 +777,12 @@ export default {
|
||||||
},
|
},
|
||||||
removeNote(index) {
|
removeNote(index) {
|
||||||
if (this.recipeContent.notes[index].length) {
|
if (this.recipeContent.notes[index].length) {
|
||||||
this.fieldDeletionConfirm("note").then((res) => {
|
this.fieldDeletionConfirm("Remove note").then((res) => {
|
||||||
if (res) this.recipeContent.notes.splice(index, 1)
|
if (res) this.recipeContent.notes.splice(index, 1)
|
||||||
})
|
})
|
||||||
} else this.recipeContent.notes.splice(index, 1)
|
} else this.recipeContent.notes.splice(index, 1)
|
||||||
},
|
},
|
||||||
|
|
||||||
addReference() {
|
|
||||||
this.recipeContent.references.push("")
|
|
||||||
},
|
|
||||||
removeReference(index) {
|
|
||||||
if (this.recipeContent.references[index].length) {
|
|
||||||
this.fieldDeletionConfirm("reference").then((res) => {
|
|
||||||
if (res) {
|
|
||||||
this.recipeContent.references.splice(index, 1)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
} else this.recipeContent.references.splice(index, 1)
|
|
||||||
},
|
|
||||||
|
|
||||||
// SAVE OPERATION
|
// SAVE OPERATION
|
||||||
clearEmptyFields() {
|
clearEmptyFields() {
|
||||||
if (!this.recipeContent.title)
|
if (!this.recipeContent.title)
|
||||||
|
@ -830,10 +798,9 @@ export default {
|
||||||
}
|
}
|
||||||
clearEmpty("instructions")
|
clearEmpty("instructions")
|
||||||
clearEmpty("notes")
|
clearEmpty("notes")
|
||||||
clearEmpty("references")
|
|
||||||
},
|
},
|
||||||
saveOperation() {
|
saveOperation() {
|
||||||
this.saving = true
|
this.saving = this.modalOpen = true
|
||||||
this.clearEmptyFields()
|
this.clearEmptyFields()
|
||||||
this.recipeContent.lastModified = new Date()
|
this.recipeContent.lastModified = new Date()
|
||||||
if (this.cacheImagePath) {
|
if (this.cacheImagePath) {
|
||||||
|
@ -881,7 +848,7 @@ export default {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.saving = false
|
this.saving = false
|
||||||
}, 100)
|
}, 100)
|
||||||
this.$navigateBack()
|
this.navigateBackController()
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<Page @loaded="onPageLoad">
|
<Page @loaded="onPageLoad">
|
||||||
<ActionBar :flat="viewIsScrolled ? false : true">
|
<ActionBar :androidElevation="viewIsScrolled ? 4 : 0">
|
||||||
<!-- Search Actionbar -->
|
<!-- Search Actionbar -->
|
||||||
<GridLayout
|
<GridLayout
|
||||||
v-if="showSearch"
|
v-if="showSearch"
|
||||||
|
@ -114,12 +114,11 @@
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</v-template>
|
</v-template>
|
||||||
<v-template name="footer">
|
<v-template name="footer">
|
||||||
<StackLayout height="128"></StackLayout>
|
<StackLayout height="80"></StackLayout>
|
||||||
</v-template>
|
</v-template>
|
||||||
</RadListView>
|
</RadListView>
|
||||||
<GridLayout rows="*, auto, *, 88" columns="*" class="emptyStateContainer">
|
<GridLayout rows="*, auto, *, 88" columns="*" class="emptyStateContainer">
|
||||||
<StackLayout
|
<StackLayout
|
||||||
col="0"
|
|
||||||
row="1"
|
row="1"
|
||||||
class="emptyState"
|
class="emptyState"
|
||||||
v-if="
|
v-if="
|
||||||
|
@ -143,20 +142,6 @@
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
<StackLayout
|
<StackLayout
|
||||||
col="0"
|
|
||||||
row="1"
|
|
||||||
class="emptyState"
|
|
||||||
v-if="!filteredRecipes.length && filterFavorites && !searchQuery"
|
|
||||||
>
|
|
||||||
<Label class="bx icon" :text="icon.heartOutline" textWrap="true" />
|
|
||||||
<Label class="title orkm" text="No favorites yet" textWrap="true" />
|
|
||||||
<Label
|
|
||||||
text="Recipes you mark as favorite will be listed here"
|
|
||||||
textWrap="true"
|
|
||||||
/>
|
|
||||||
</StackLayout>
|
|
||||||
<StackLayout
|
|
||||||
col="0"
|
|
||||||
row="1"
|
row="1"
|
||||||
class="emptyState"
|
class="emptyState"
|
||||||
v-if="!filteredRecipes.length && filterTrylater && !searchQuery"
|
v-if="!filteredRecipes.length && filterTrylater && !searchQuery"
|
||||||
|
@ -169,15 +154,21 @@
|
||||||
/>
|
/>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
<StackLayout
|
<StackLayout
|
||||||
col="0"
|
|
||||||
row="1"
|
row="1"
|
||||||
class="emptyState"
|
class="emptyState"
|
||||||
v-if="
|
v-if="!filteredRecipes.length && filterFavorites && !searchQuery"
|
||||||
!filteredRecipes.length &&
|
>
|
||||||
!filterFavorites &&
|
<Label class="bx icon" :text="icon.heartOutline" textWrap="true" />
|
||||||
!filterTrylater &&
|
<Label class="title orkm" text="No favorites yet" textWrap="true" />
|
||||||
selectedCategory
|
<Label
|
||||||
"
|
text="Recipes you mark as favorite will be listed here"
|
||||||
|
textWrap="true"
|
||||||
|
/>
|
||||||
|
</StackLayout>
|
||||||
|
<StackLayout
|
||||||
|
row="1"
|
||||||
|
class="emptyState"
|
||||||
|
v-if="!filteredRecipes.length && !searchQuery && selectedCategory"
|
||||||
>
|
>
|
||||||
<Label class="bx icon" :text="icon.labelOutline" textWrap="true" />
|
<Label class="bx icon" :text="icon.labelOutline" textWrap="true" />
|
||||||
<Label
|
<Label
|
||||||
|
@ -192,20 +183,15 @@
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
<StackLayout
|
<StackLayout
|
||||||
col="0"
|
row="1"
|
||||||
row="0"
|
class="emptyState"
|
||||||
class="emptyState noResult"
|
|
||||||
v-if="!filteredRecipes.length && searchQuery"
|
v-if="!filteredRecipes.length && searchQuery"
|
||||||
>
|
>
|
||||||
<Label class="bx icon" :text="icon.search" textWrap="true" />
|
<Label class="bx icon" :text="icon.search" textWrap="true" />
|
||||||
<Label class="title orkm" text="No recipes found" textWrap="true" />
|
<Label class="title orkm" text="No recipes found" textWrap="true" />
|
||||||
<Label
|
<Label
|
||||||
:text="
|
:text="
|
||||||
`Your search "${searchQuery}" did not match any recipes${
|
`Your search "${searchQuery}" did not match any recipes${noResultFor}`
|
||||||
filterFavorites || filterTrylater || selectedCategory
|
|
||||||
? ' in this category'
|
|
||||||
: ''
|
|
||||||
}`
|
|
||||||
"
|
"
|
||||||
textWrap="true"
|
textWrap="true"
|
||||||
/>
|
/>
|
||||||
|
@ -287,6 +273,12 @@ export default {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
noResultFor() {
|
||||||
|
if (this.selectedCategory) return " in this category"
|
||||||
|
if (this.filterFavorites) return " in your favorites"
|
||||||
|
if (this.filterTrylater) return " in your try later list"
|
||||||
|
return ""
|
||||||
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions(["setCurrentComponentAction", "deleteRecipeAction"]),
|
...mapActions(["setCurrentComponentAction", "deleteRecipeAction"]),
|
||||||
|
@ -337,9 +329,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onScroll(args) {
|
onScroll(args) {
|
||||||
args.scrollOffset
|
this.viewIsScrolled = args.scrollOffset ? true : false
|
||||||
? (this.viewIsScrolled = true)
|
|
||||||
: (this.viewIsScrolled = false)
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// NAVIGATION HANDLERS
|
// NAVIGATION HANDLERS
|
||||||
|
@ -379,6 +369,7 @@ export default {
|
||||||
filterTrylater: this.filterTrylater,
|
filterTrylater: this.filterTrylater,
|
||||||
recipeID,
|
recipeID,
|
||||||
},
|
},
|
||||||
|
backstackVisible: false,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -389,7 +380,7 @@ export default {
|
||||||
props: {
|
props: {
|
||||||
title: "Sort by",
|
title: "Sort by",
|
||||||
list: ["Natural order", "Title", "Duration", "Last modified"],
|
list: ["Natural order", "Title", "Duration", "Last modified"],
|
||||||
height: "225",
|
height: "192",
|
||||||
},
|
},
|
||||||
}).then((action) => {
|
}).then((action) => {
|
||||||
if (action && action !== "Cancel" && this.sortType !== action) {
|
if (action && action !== "Cancel" && this.sortType !== action) {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<Page @loaded="onPageLoad">
|
<Page @loaded="onPageLoad">
|
||||||
<ActionBar :flat="viewIsScrolled ? false : true">
|
<ActionBar flat="true">
|
||||||
<GridLayout rows="*" columns="auto, *, auto">
|
<GridLayout rows="*" columns="auto, *, auto">
|
||||||
<MDButton
|
<MDButton
|
||||||
class="bx left"
|
class="bx left"
|
||||||
|
@ -23,6 +23,7 @@
|
||||||
</ActionBar>
|
</ActionBar>
|
||||||
<GridLayout rows="280, *">
|
<GridLayout rows="280, *">
|
||||||
<RadCalendar
|
<RadCalendar
|
||||||
|
:androidElevation="viewIsScrolled ? 4 : 0"
|
||||||
class="orkm"
|
class="orkm"
|
||||||
row="0"
|
row="0"
|
||||||
ref="calendar"
|
ref="calendar"
|
||||||
|
@ -35,12 +36,7 @@
|
||||||
:eventsViewMode="eventsViewMode"
|
:eventsViewMode="eventsViewMode"
|
||||||
:eventSource="getMealPlans"
|
:eventSource="getMealPlans"
|
||||||
></RadCalendar>
|
></RadCalendar>
|
||||||
<ScrollView
|
<ScrollView row="1" width="100%" height="100%" @scroll="onScroll">
|
||||||
row="1"
|
|
||||||
width="100%"
|
|
||||||
height="100%"
|
|
||||||
scrollBarIndicatorVisible="true"
|
|
||||||
>
|
|
||||||
<StackLayout class="dayPlan">
|
<StackLayout class="dayPlan">
|
||||||
<StackLayout
|
<StackLayout
|
||||||
v-for="(mealType, index) in mealTimes"
|
v-for="(mealType, index) in mealTimes"
|
||||||
|
@ -186,7 +182,7 @@ export default {
|
||||||
dayNameCellStyle.cellBorderColor = this.isLightMode
|
dayNameCellStyle.cellBorderColor = this.isLightMode
|
||||||
? this.color.gray2
|
? this.color.gray2
|
||||||
: this.color.black
|
: this.color.black
|
||||||
dayNameCellStyle.cellTextSize = 12
|
dayNameCellStyle.cellTextSize = 10
|
||||||
dayNameCellStyle.cellAlignment = CalendarCellAlignment.Center
|
dayNameCellStyle.cellAlignment = CalendarCellAlignment.Center
|
||||||
dayNameCellStyle.cellTextFontName = this.appFontMedium
|
dayNameCellStyle.cellTextFontName = this.appFontMedium
|
||||||
monthViewStyle.dayNameCellStyle = dayNameCellStyle
|
monthViewStyle.dayNameCellStyle = dayNameCellStyle
|
||||||
|
@ -200,7 +196,7 @@ export default {
|
||||||
dayCellStyle.cellTextSize = 16
|
dayCellStyle.cellTextSize = 16
|
||||||
dayCellStyle.cellTextColor = this.isLightMode
|
dayCellStyle.cellTextColor = this.isLightMode
|
||||||
? this.color.gray9
|
? this.color.gray9
|
||||||
: this.color.gray2
|
: this.color.gray1
|
||||||
dayCellStyle.cellAlignment = CalendarCellAlignment.Bottom
|
dayCellStyle.cellAlignment = CalendarCellAlignment.Bottom
|
||||||
dayCellStyle.cellBackgroundColor = this.isLightMode
|
dayCellStyle.cellBackgroundColor = this.isLightMode
|
||||||
? this.color.gray1
|
? this.color.gray1
|
||||||
|
@ -328,9 +324,7 @@ export default {
|
||||||
utils.showDrawer()
|
utils.showDrawer()
|
||||||
},
|
},
|
||||||
onScroll(args) {
|
onScroll(args) {
|
||||||
args.scrollY
|
this.viewIsScrolled = args.scrollY ? true : false
|
||||||
? (this.viewIsScrolled = true)
|
|
||||||
: (this.viewIsScrolled = false)
|
|
||||||
},
|
},
|
||||||
getDate(index) {
|
getDate(index) {
|
||||||
let date = new Date()
|
let date = new Date()
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<Page @loaded="onPageLoad">
|
<Page @loaded="onPageLoad">
|
||||||
<ActionBar :flat="viewIsScrolled ? false : true">
|
<ActionBar :androidElevation="viewIsScrolled ? 4 : 0">
|
||||||
<GridLayout rows="*" columns="auto, *">
|
<GridLayout rows="*" columns="auto, *">
|
||||||
<MDButton
|
<MDButton
|
||||||
class="bx left"
|
class="bx left"
|
||||||
|
@ -13,7 +13,7 @@
|
||||||
<Label class="title orkm" text="Settings" col="1" />
|
<Label class="title orkm" text="Settings" col="1" />
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</ActionBar>
|
</ActionBar>
|
||||||
<ScrollView scrollBarIndicatorVisible="true" @scroll="onScroll">
|
<ScrollView @scroll="onScroll">
|
||||||
<StackLayout class="main-container">
|
<StackLayout class="main-container">
|
||||||
<Label text="Interface" class="group-header orkm" />
|
<Label text="Interface" class="group-header orkm" />
|
||||||
<GridLayout columns="auto, *" class="option">
|
<GridLayout columns="auto, *" class="option">
|
||||||
|
@ -128,9 +128,7 @@ export default {
|
||||||
utils.showDrawer()
|
utils.showDrawer()
|
||||||
},
|
},
|
||||||
onScroll(args) {
|
onScroll(args) {
|
||||||
args.scrollY
|
this.viewIsScrolled = args.scrollY ? true : false
|
||||||
? (this.viewIsScrolled = true)
|
|
||||||
: (this.viewIsScrolled = false)
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// THEME SELECTION
|
// THEME SELECTION
|
||||||
|
@ -139,7 +137,7 @@ export default {
|
||||||
props: {
|
props: {
|
||||||
title: "Theme",
|
title: "Theme",
|
||||||
list: ["Light", "Dark"],
|
list: ["Light", "Dark"],
|
||||||
height: "113",
|
height: "96",
|
||||||
},
|
},
|
||||||
}).then((action) => {
|
}).then((action) => {
|
||||||
if (action && action !== "Cancel" && this.appTheme !== action) {
|
if (action && action !== "Cancel" && this.appTheme !== action) {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<Page @loaded="onPageLoad" @unloaded="onPageUnload">
|
<Page @loaded="onPageLoad" @unloaded="onPageUnload">
|
||||||
<ActionBar height="112" margin="0" flat="true">
|
<ActionBar flat="true">
|
||||||
<GridLayout rows="64, 48" columns="auto, *, auto,auto, auto">
|
<GridLayout rows="48" columns="auto, *, auto">
|
||||||
<MDButton
|
<MDButton
|
||||||
variant="text"
|
variant="text"
|
||||||
row="0"
|
row="0"
|
||||||
|
@ -11,10 +11,10 @@
|
||||||
automationText="Back"
|
automationText="Back"
|
||||||
@tap="$navigateBack()"
|
@tap="$navigateBack()"
|
||||||
/>
|
/>
|
||||||
<ScrollView
|
<!-- <ScrollView
|
||||||
row="1"
|
row="0"
|
||||||
col="0"
|
col="1"
|
||||||
colSpan="4"
|
:colSpan="hideActionBar ? 2 : 1"
|
||||||
orientation="horizontal"
|
orientation="horizontal"
|
||||||
scrollBarIndicatorVisible="false"
|
scrollBarIndicatorVisible="false"
|
||||||
>
|
>
|
||||||
|
@ -23,22 +23,8 @@
|
||||||
:text="recipe.title"
|
:text="recipe.title"
|
||||||
verticalAlignment="bottom"
|
verticalAlignment="bottom"
|
||||||
/>
|
/>
|
||||||
</ScrollView>
|
</ScrollView> -->
|
||||||
<FlexboxLayout row="0" col="2" alignItems="center">
|
<FlexboxLayout row="0" col="2" alignItems="center">
|
||||||
<MDButton
|
|
||||||
variant="text"
|
|
||||||
v-if="!busy"
|
|
||||||
class="bx"
|
|
||||||
:text="icon.edit"
|
|
||||||
@tap="editRecipe"
|
|
||||||
/>
|
|
||||||
<MDActivityIndicator v-else :busy="busy" />
|
|
||||||
<MDButton
|
|
||||||
variant="text"
|
|
||||||
class="bx"
|
|
||||||
:text="recipe.isFavorite ? icon.heart : icon.heartOutline"
|
|
||||||
@tap="toggleFavorite"
|
|
||||||
/>
|
|
||||||
<MDButton
|
<MDButton
|
||||||
v-if="!filterTrylater"
|
v-if="!filterTrylater"
|
||||||
variant="text"
|
variant="text"
|
||||||
|
@ -50,23 +36,54 @@
|
||||||
v-else
|
v-else
|
||||||
variant="text"
|
variant="text"
|
||||||
class="bx"
|
class="bx"
|
||||||
:text="icon.share"
|
:text="icon.check"
|
||||||
@tap="shareHandler"
|
@tap="recipeTried"
|
||||||
/>
|
/>
|
||||||
|
<MDButton
|
||||||
|
variant="text"
|
||||||
|
class="bx"
|
||||||
|
:text="recipe.isFavorite ? icon.heart : icon.heartOutline"
|
||||||
|
@tap="toggleFavorite"
|
||||||
|
/>
|
||||||
|
<MDButton
|
||||||
|
variant="text"
|
||||||
|
v-if="!busy"
|
||||||
|
class="bx"
|
||||||
|
:text="icon.edit"
|
||||||
|
@tap="editRecipe"
|
||||||
|
/>
|
||||||
|
<MDActivityIndicator v-else :busy="busy" />
|
||||||
</FlexboxLayout>
|
</FlexboxLayout>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</ActionBar>
|
</ActionBar>
|
||||||
<AbsoluteLayout>
|
<AbsoluteLayout>
|
||||||
<TabView
|
<Tabs
|
||||||
:selectedIndex="selectedTabIndex"
|
|
||||||
@selectedIndexChange="selectedIndexChange"
|
|
||||||
androidElevation="0"
|
|
||||||
width="100%"
|
width="100%"
|
||||||
height="100%"
|
height="100%"
|
||||||
|
:selectedIndex="selectedTabIndex"
|
||||||
|
@selectedIndexChange="selectedIndexChange"
|
||||||
class="viewRecipe"
|
class="viewRecipe"
|
||||||
>
|
>
|
||||||
<TabViewItem title="Overview">
|
<TabStrip :androidElevation="viewIsScrolled ? 4 : 0">
|
||||||
<ScrollView scrollBarIndicatorVisible="true">
|
<TabStripItem>
|
||||||
|
<Label text="Overview"></Label>
|
||||||
|
</TabStripItem>
|
||||||
|
<TabStripItem>
|
||||||
|
<Label text="Ingredients"></Label>
|
||||||
|
</TabStripItem>
|
||||||
|
<TabStripItem>
|
||||||
|
<Label text="Instructions"></Label>
|
||||||
|
</TabStripItem>
|
||||||
|
<TabStripItem>
|
||||||
|
<Label text="Combinations"></Label>
|
||||||
|
</TabStripItem>
|
||||||
|
<TabStripItem>
|
||||||
|
<Label text="Notes"></Label>
|
||||||
|
</TabStripItem>
|
||||||
|
</TabStrip>
|
||||||
|
|
||||||
|
<TabContentItem>
|
||||||
|
<ScrollView @scroll="onScroll">
|
||||||
<StackLayout>
|
<StackLayout>
|
||||||
<StackLayout
|
<StackLayout
|
||||||
width="100%"
|
width="100%"
|
||||||
|
@ -89,7 +106,7 @@
|
||||||
:text="icon.image"
|
:text="icon.image"
|
||||||
/>
|
/>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
<StackLayout margin="16 8 144">
|
<StackLayout margin="16 8 80">
|
||||||
<Label class="category orkm" :text="recipe.category" />
|
<Label class="category orkm" :text="recipe.category" />
|
||||||
<Label
|
<Label
|
||||||
margin="0 8"
|
margin="0 8"
|
||||||
|
@ -102,7 +119,7 @@
|
||||||
<Label :text="` ${formattedTime(recipe.timeRequired)}`" />
|
<Label :text="` ${formattedTime(recipe.timeRequired)}`" />
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
<GridLayout
|
<GridLayout
|
||||||
rows="auto, auto, auto"
|
rows="auto, auto"
|
||||||
columns="*, *"
|
columns="*, *"
|
||||||
class="overviewContainer"
|
class="overviewContainer"
|
||||||
>
|
>
|
||||||
|
@ -150,7 +167,6 @@
|
||||||
textWrap="true"
|
textWrap="true"
|
||||||
/>
|
/>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
|
|
||||||
<GridLayout
|
<GridLayout
|
||||||
class="overviewItem"
|
class="overviewItem"
|
||||||
row="1"
|
row="1"
|
||||||
|
@ -159,48 +175,6 @@
|
||||||
columns="*"
|
columns="*"
|
||||||
>
|
>
|
||||||
<MDRipple rowSpan="2" @tap="selectedTabIndex = 3" />
|
<MDRipple rowSpan="2" @tap="selectedTabIndex = 3" />
|
||||||
<Label row="0" class="bx" :text="icon.note" />
|
|
||||||
<Label
|
|
||||||
row="1"
|
|
||||||
class="itemCount"
|
|
||||||
:text="
|
|
||||||
`${recipe.notes.length} ${
|
|
||||||
recipe.notes.length == 1 ? 'Note' : 'Notes'
|
|
||||||
}`
|
|
||||||
"
|
|
||||||
textWrap="true"
|
|
||||||
/>
|
|
||||||
</GridLayout>
|
|
||||||
<GridLayout
|
|
||||||
class="overviewItem"
|
|
||||||
row="1"
|
|
||||||
col="1"
|
|
||||||
rows="auto, auto"
|
|
||||||
columns="*"
|
|
||||||
>
|
|
||||||
<MDRipple rowSpan="2" @tap="selectedTabIndex = 4" />
|
|
||||||
<Label row="0" class="bx" :text="icon.source" />
|
|
||||||
<Label
|
|
||||||
row="1"
|
|
||||||
class="itemCount"
|
|
||||||
:text="
|
|
||||||
`${recipe.references.length} ${
|
|
||||||
recipe.references.length == 1
|
|
||||||
? 'Reference'
|
|
||||||
: 'References'
|
|
||||||
}`
|
|
||||||
"
|
|
||||||
textWrap="true"
|
|
||||||
/>
|
|
||||||
</GridLayout>
|
|
||||||
<GridLayout
|
|
||||||
class="overviewItem"
|
|
||||||
row="2"
|
|
||||||
col="0"
|
|
||||||
rows="auto, auto"
|
|
||||||
columns="*"
|
|
||||||
>
|
|
||||||
<MDRipple rowSpan="2" @tap="selectedTabIndex = 5" />
|
|
||||||
<Label row="0" class="bx" :text="icon.outline" />
|
<Label row="0" class="bx" :text="icon.outline" />
|
||||||
<Label
|
<Label
|
||||||
row="1"
|
row="1"
|
||||||
|
@ -215,13 +189,33 @@
|
||||||
textWrap="true"
|
textWrap="true"
|
||||||
/>
|
/>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
|
<GridLayout
|
||||||
|
class="overviewItem"
|
||||||
|
row="1"
|
||||||
|
col="1"
|
||||||
|
rows="auto, auto"
|
||||||
|
columns="*"
|
||||||
|
>
|
||||||
|
<MDRipple rowSpan="2" @tap="selectedTabIndex = 4" />
|
||||||
|
<Label row="0" class="bx" :text="icon.note" />
|
||||||
|
<Label
|
||||||
|
row="1"
|
||||||
|
class="itemCount"
|
||||||
|
:text="
|
||||||
|
`${recipe.notes.length} ${
|
||||||
|
recipe.notes.length == 1 ? 'Note' : 'Notes'
|
||||||
|
}`
|
||||||
|
"
|
||||||
|
textWrap="true"
|
||||||
|
/>
|
||||||
|
</GridLayout>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
</TabViewItem>
|
</TabContentItem>
|
||||||
<TabViewItem title="Ingredients">
|
<TabContentItem>
|
||||||
<ScrollView scrollBarIndicatorVisible="true">
|
<ScrollView @scroll="onScroll">
|
||||||
<GridLayout
|
<GridLayout
|
||||||
v-if="!recipe.ingredients.length"
|
v-if="!recipe.ingredients.length"
|
||||||
rows="*, auto, *, 88"
|
rows="*, auto, *, 88"
|
||||||
|
@ -238,7 +232,7 @@
|
||||||
<Label text="to add some ingredients" textWrap="true" />
|
<Label text="to add some ingredients" textWrap="true" />
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
<StackLayout v-else padding="32 16 134">
|
<StackLayout v-else padding="24 16 72">
|
||||||
<AbsoluteLayout class="inputField">
|
<AbsoluteLayout class="inputField">
|
||||||
<TextField
|
<TextField
|
||||||
width="50%"
|
width="50%"
|
||||||
|
@ -265,7 +259,7 @@
|
||||||
:key="index"
|
:key="index"
|
||||||
>
|
>
|
||||||
<check-box
|
<check-box
|
||||||
class="ingredient-check"
|
class="ingredient"
|
||||||
checkPadding="16"
|
checkPadding="16"
|
||||||
fillColor="#ff5200"
|
fillColor="#ff5200"
|
||||||
:text="
|
:text="
|
||||||
|
@ -281,9 +275,9 @@
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
</TabViewItem>
|
</TabContentItem>
|
||||||
<TabViewItem title="Instructions">
|
<TabContentItem>
|
||||||
<ScrollView scrollBarIndicatorVisible="true">
|
<ScrollView @scroll="onScroll">
|
||||||
<GridLayout
|
<GridLayout
|
||||||
v-if="!recipe.instructions.length"
|
v-if="!recipe.instructions.length"
|
||||||
rows="*, auto, *, 88"
|
rows="*, auto, *, 88"
|
||||||
|
@ -300,7 +294,7 @@
|
||||||
<Label text="to add some instructions" textWrap="true" />
|
<Label text="to add some instructions" textWrap="true" />
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
<StackLayout v-else padding="32 16 132">
|
<StackLayout v-else padding="28 16 62">
|
||||||
<GridLayout
|
<GridLayout
|
||||||
columns="auto ,*"
|
columns="auto ,*"
|
||||||
v-for="(instruction, index) in recipe.instructions"
|
v-for="(instruction, index) in recipe.instructions"
|
||||||
|
@ -326,104 +320,9 @@
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
</TabViewItem>
|
</TabContentItem>
|
||||||
<TabViewItem title="Notes">
|
<TabContentItem>
|
||||||
<ScrollView scrollBarIndicatorVisible="true">
|
<ScrollView @scroll="onScroll">
|
||||||
<GridLayout
|
|
||||||
v-if="!recipe.notes.length"
|
|
||||||
rows="*, auto, *, 88"
|
|
||||||
columns="*"
|
|
||||||
class="emptyStateContainer"
|
|
||||||
>
|
|
||||||
<StackLayout col="0" row="1" class="emptyState">
|
|
||||||
<Label class="bx icon" :text="icon.note" textWrap="true" />
|
|
||||||
<StackLayout orientation="horizontal" class="title orkm">
|
|
||||||
<Label text="Use the " />
|
|
||||||
<Label class="bx" :text="icon.edit" />
|
|
||||||
<Label text=" button" />
|
|
||||||
</StackLayout>
|
|
||||||
<Label text="to add some notes" textWrap="true" />
|
|
||||||
</StackLayout>
|
|
||||||
</GridLayout>
|
|
||||||
<StackLayout v-else padding="32 16 132">
|
|
||||||
<GridLayout
|
|
||||||
columns="auto ,*"
|
|
||||||
v-for="(note, index) in recipe.notes"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<Label
|
|
||||||
col="0"
|
|
||||||
colSpan="2"
|
|
||||||
class="note"
|
|
||||||
:text="note"
|
|
||||||
textWrap="true"
|
|
||||||
/>
|
|
||||||
<Label
|
|
||||||
verticalAlignment="top"
|
|
||||||
horizontalAlignment="center"
|
|
||||||
class="count square orkm"
|
|
||||||
col="0"
|
|
||||||
:text="index + 1"
|
|
||||||
/>
|
|
||||||
</GridLayout>
|
|
||||||
</StackLayout>
|
|
||||||
</ScrollView>
|
|
||||||
</TabViewItem>
|
|
||||||
<TabViewItem title="References">
|
|
||||||
<ScrollView scrollBarIndicatorVisible="true">
|
|
||||||
<GridLayout
|
|
||||||
v-if="!recipe.references.length"
|
|
||||||
rows="*, auto, *, 88"
|
|
||||||
columns="*"
|
|
||||||
class="emptyStateContainer"
|
|
||||||
>
|
|
||||||
<StackLayout col="0" row="1" class="emptyState">
|
|
||||||
<Label class="bx icon" :text="icon.source" textWrap="true" />
|
|
||||||
<StackLayout orientation="horizontal" class="title orkm">
|
|
||||||
<Label text="Use the " />
|
|
||||||
<Label class="bx" :text="icon.edit" />
|
|
||||||
<Label text=" button" />
|
|
||||||
</StackLayout>
|
|
||||||
<Label text="to add some references" textWrap="true" />
|
|
||||||
</StackLayout>
|
|
||||||
</GridLayout>
|
|
||||||
<StackLayout v-else padding="10 0 132">
|
|
||||||
<StackLayout
|
|
||||||
v-for="(reference, index) in recipe.references"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<GridLayout
|
|
||||||
v-if="isValidURL(reference)"
|
|
||||||
columns="*, auto"
|
|
||||||
class="referenceItem"
|
|
||||||
androidElevation="1"
|
|
||||||
>
|
|
||||||
<MDRipple
|
|
||||||
colSpan="2"
|
|
||||||
@longPress="copyURL(reference)"
|
|
||||||
@tap="openURL(reference)"
|
|
||||||
/>
|
|
||||||
<Label
|
|
||||||
col="0"
|
|
||||||
verticalAlignment="center"
|
|
||||||
class="recipeLink"
|
|
||||||
:text="reference"
|
|
||||||
textWrap="false"
|
|
||||||
/>
|
|
||||||
<Label col="1" class="bx linkIcon" :text="icon.source" />
|
|
||||||
</GridLayout>
|
|
||||||
<Label
|
|
||||||
v-else
|
|
||||||
class="recipeText"
|
|
||||||
:text="reference"
|
|
||||||
textWrap="true"
|
|
||||||
/>
|
|
||||||
</StackLayout>
|
|
||||||
</StackLayout>
|
|
||||||
</ScrollView>
|
|
||||||
</TabViewItem>
|
|
||||||
<TabViewItem title="Combinations">
|
|
||||||
<ScrollView scrollBarIndicatorVisible="true">
|
|
||||||
<GridLayout
|
<GridLayout
|
||||||
v-if="!recipe.combinations.length"
|
v-if="!recipe.combinations.length"
|
||||||
rows="*, auto, *, 88"
|
rows="*, auto, *, 88"
|
||||||
|
@ -440,42 +339,81 @@
|
||||||
<Label text="to add some combinations" textWrap="true" />
|
<Label text="to add some combinations" textWrap="true" />
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
<StackLayout v-else padding="10 0 132">
|
<StackLayout v-else padding="8 0 80">
|
||||||
<GridLayout
|
<GridLayout
|
||||||
columns="*"
|
columns="auto, *"
|
||||||
v-for="(combination, index) in recipe.combinations"
|
v-for="(combination, index) in recipe.combinations"
|
||||||
:key="index"
|
:key="index"
|
||||||
androidElevation="1"
|
androidElevation="1"
|
||||||
class="referenceItem"
|
class="urlCard"
|
||||||
>
|
>
|
||||||
<MDRipple col="0" @tap="viewCombination(combination)" />
|
<MDRipple colSpan="2" @tap="viewCombination(combination)" />
|
||||||
|
<Label col="0" class="bx linkIcon" :text="icon.food" />
|
||||||
<Label
|
<Label
|
||||||
col="0"
|
col="1"
|
||||||
verticalAlignment="center"
|
verticalAlignment="center"
|
||||||
class="recipeLink"
|
class="link"
|
||||||
:text="getCombinationTitle(combination)"
|
:text="getCombinationTitle(combination)"
|
||||||
textWrap="true"
|
textWrap="true"
|
||||||
/>
|
/>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
</StackLayout>
|
</StackLayout>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
</TabViewItem>
|
</TabContentItem>
|
||||||
</TabView>
|
<TabContentItem>
|
||||||
|
<ScrollView @scroll="onScroll">
|
||||||
|
<GridLayout
|
||||||
|
v-if="!recipe.notes.length"
|
||||||
|
rows="*, auto, *, 88"
|
||||||
|
columns="*"
|
||||||
|
class="emptyStateContainer"
|
||||||
|
>
|
||||||
|
<StackLayout col="0" row="1" class="emptyState">
|
||||||
|
<Label class="bx icon" :text="icon.note" textWrap="true" />
|
||||||
|
<StackLayout orientation="horizontal" class="title orkm">
|
||||||
|
<Label text="Use the " />
|
||||||
|
<Label class="bx" :text="icon.edit" />
|
||||||
|
<Label text=" button" />
|
||||||
|
</StackLayout>
|
||||||
|
<Label text="to add some notes" textWrap="true" />
|
||||||
|
</StackLayout>
|
||||||
|
</GridLayout>
|
||||||
|
<StackLayout v-else padding="8 0 80">
|
||||||
|
<StackLayout v-for="(note, index) in recipe.notes" :key="index">
|
||||||
|
<GridLayout
|
||||||
|
v-if="isValidURL(note)"
|
||||||
|
columns="auto, *"
|
||||||
|
class="urlCard"
|
||||||
|
androidElevation="1"
|
||||||
|
>
|
||||||
|
<MDRipple
|
||||||
|
colSpan="2"
|
||||||
|
@longPress="copyURL(note)"
|
||||||
|
@tap="openURL(note)"
|
||||||
|
/>
|
||||||
|
<Label col="0" class="bx linkIcon" :text="icon.source" />
|
||||||
|
<Label
|
||||||
|
col="1"
|
||||||
|
verticalAlignment="center"
|
||||||
|
class="link"
|
||||||
|
:text="note"
|
||||||
|
textWrap="false"
|
||||||
|
/>
|
||||||
|
</GridLayout>
|
||||||
|
<Label v-else class="textCard" :text="note" textWrap="true" />
|
||||||
|
</StackLayout>
|
||||||
|
</StackLayout>
|
||||||
|
</ScrollView>
|
||||||
|
</TabContentItem>
|
||||||
|
</Tabs>
|
||||||
<GridLayout id="btnFabContainer" rows="*, auto" columns="*, auto">
|
<GridLayout id="btnFabContainer" rows="*, auto" columns="*, auto">
|
||||||
<MDFloatingActionButton
|
|
||||||
row="1"
|
|
||||||
col="1"
|
|
||||||
src="res://check"
|
|
||||||
@tap="recipeTried"
|
|
||||||
v-if="filterTrylater"
|
|
||||||
/>
|
|
||||||
<transition name="dolly" appear>
|
<transition name="dolly" appear>
|
||||||
<MDFloatingActionButton
|
<MDFloatingActionButton
|
||||||
row="1"
|
row="1"
|
||||||
col="1"
|
col="1"
|
||||||
src="res://share"
|
src="res://share"
|
||||||
@tap="shareHandler"
|
@tap="shareHandler"
|
||||||
v-if="!filterTrylater && showFab"
|
v-if="showFab"
|
||||||
/>
|
/>
|
||||||
</transition>
|
</transition>
|
||||||
</GridLayout>
|
</GridLayout>
|
||||||
|
@ -494,6 +432,8 @@ import {
|
||||||
ImageSource,
|
ImageSource,
|
||||||
Screen,
|
Screen,
|
||||||
Utils,
|
Utils,
|
||||||
|
GestureTypes,
|
||||||
|
Tabs,
|
||||||
} from "@nativescript/core"
|
} from "@nativescript/core"
|
||||||
import { Feedback, FeedbackType, FeedbackPosition } from "nativescript-feedback"
|
import { Feedback, FeedbackType, FeedbackPosition } from "nativescript-feedback"
|
||||||
import * as Toast from "nativescript-toast"
|
import * as Toast from "nativescript-toast"
|
||||||
|
@ -517,6 +457,9 @@ export default {
|
||||||
showFab: false,
|
showFab: false,
|
||||||
selectedTabIndex: 0,
|
selectedTabIndex: 0,
|
||||||
currentRecipeID: this.recipeID,
|
currentRecipeID: this.recipeID,
|
||||||
|
viewIsScrolled: false,
|
||||||
|
isScrolled: [false, false, false, false, false, false],
|
||||||
|
hideActionBar: false,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -525,7 +468,9 @@ export default {
|
||||||
return Screen.mainScreen.widthDIPs
|
return Screen.mainScreen.widthDIPs
|
||||||
},
|
},
|
||||||
positiveYieldMultiplier() {
|
positiveYieldMultiplier() {
|
||||||
return this.yieldMultiplier > 0 ? parseFloat(this.yieldMultiplier) : 1
|
return Math.abs(this.yieldMultiplier) > 0
|
||||||
|
? Math.abs(parseFloat(this.yieldMultiplier))
|
||||||
|
: 1
|
||||||
},
|
},
|
||||||
isLightMode() {
|
isLightMode() {
|
||||||
return Application.systemAppearance() === "light"
|
return Application.systemAppearance() === "light"
|
||||||
|
@ -543,8 +488,8 @@ export default {
|
||||||
setTimeout((e) => {
|
setTimeout((e) => {
|
||||||
this.setCurrentComponentAction("ViewRecipe")
|
this.setCurrentComponentAction("ViewRecipe")
|
||||||
}, 500)
|
}, 500)
|
||||||
this.yieldMultiplier = this.recipe.yield.quantity
|
|
||||||
this.showFab = true
|
this.showFab = true
|
||||||
|
this.yieldMultiplier = this.recipe.yield.quantity
|
||||||
this.keepScreenOn(true)
|
this.keepScreenOn(true)
|
||||||
this.syncCombinations()
|
this.syncCombinations()
|
||||||
},
|
},
|
||||||
|
@ -572,6 +517,7 @@ export default {
|
||||||
},
|
},
|
||||||
selectedIndexChange(args) {
|
selectedIndexChange(args) {
|
||||||
this.selectedTabIndex = args.object.selectedIndex
|
this.selectedTabIndex = args.object.selectedIndex
|
||||||
|
this.viewIsScrolled = this.isScrolled[this.selectedTabIndex]
|
||||||
},
|
},
|
||||||
showLastTried() {
|
showLastTried() {
|
||||||
feedback.show({
|
feedback.show({
|
||||||
|
@ -583,7 +529,7 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
roundedQuantity(quantity) {
|
roundedQuantity(quantity) {
|
||||||
return (
|
return Math.abs(
|
||||||
Math.round(
|
Math.round(
|
||||||
(quantity / this.recipe.yield.quantity) *
|
(quantity / this.recipe.yield.quantity) *
|
||||||
this.positiveYieldMultiplier *
|
this.positiveYieldMultiplier *
|
||||||
|
@ -612,7 +558,7 @@ export default {
|
||||||
return h ? (m ? `${h} hr ${m} min` : `${h} hr`) : `${m} min`
|
return h ? (m ? `${h} hr ${m} min` : `${h} hr`) : `${m} min`
|
||||||
},
|
},
|
||||||
isValidURL(string) {
|
isValidURL(string) {
|
||||||
let pattern = new RegExp("^https?|www", "ig")
|
let pattern = new RegExp("^https?|^www", "ig")
|
||||||
return pattern.test(string)
|
return pattern.test(string)
|
||||||
},
|
},
|
||||||
getCombinationTitle(id) {
|
getCombinationTitle(id) {
|
||||||
|
@ -634,13 +580,20 @@ export default {
|
||||||
},
|
},
|
||||||
|
|
||||||
// NAVIGATION HANDLERS
|
// NAVIGATION HANDLERS
|
||||||
|
onScroll(args) {
|
||||||
|
this.viewIsScrolled = this.isScrolled[this.selectedTabIndex] =
|
||||||
|
args.scrollY > 8 ? true : false
|
||||||
|
},
|
||||||
editRecipe() {
|
editRecipe() {
|
||||||
this.showFab = false
|
this.showFab = false
|
||||||
this.busy = true
|
this.busy = true
|
||||||
this.$navigateTo(EditRecipe, {
|
this.$navigateTo(EditRecipe, {
|
||||||
props: {
|
props: {
|
||||||
|
navigationFromView: true,
|
||||||
|
filterTrylater: this.filterTrylater,
|
||||||
recipeID: this.currentRecipeID,
|
recipeID: this.currentRecipeID,
|
||||||
},
|
},
|
||||||
|
backstackVisible: false,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
viewCombination(combination) {
|
viewCombination(combination) {
|
||||||
|
@ -720,13 +673,6 @@ export default {
|
||||||
})
|
})
|
||||||
shareContent += notes
|
shareContent += notes
|
||||||
}
|
}
|
||||||
if (this.recipe.references.length) {
|
|
||||||
let references = `\nReferences:\n\n`
|
|
||||||
this.recipe.references.forEach((e, i) => {
|
|
||||||
references += `${i + 1}. ${e}\n\n`
|
|
||||||
})
|
|
||||||
shareContent += references
|
|
||||||
}
|
|
||||||
let sharenote = "\nCreated and shared via EnRecipes. Get it on F-Droid."
|
let sharenote = "\nCreated and shared via EnRecipes. Get it on F-Droid."
|
||||||
|
|
||||||
shareContent += sharenote
|
shareContent += sharenote
|
||||||
|
@ -775,7 +721,7 @@ export default {
|
||||||
const clipboard = Utils.ad
|
const clipboard = Utils.ad
|
||||||
.getApplicationContext()
|
.getApplicationContext()
|
||||||
.getSystemService(android.content.Context.CLIPBOARD_SERVICE)
|
.getSystemService(android.content.Context.CLIPBOARD_SERVICE)
|
||||||
const clip = android.content.ClipData.newPlainText("Reference URl", url)
|
const clip = android.content.ClipData.newPlainText("URl", url)
|
||||||
clipboard.setPrimaryClip(clip)
|
clipboard.setPrimaryClip(clip)
|
||||||
Toast.makeText("URL Copied").show()
|
Toast.makeText("URL Copied").show()
|
||||||
},
|
},
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<Page>
|
<Page>
|
||||||
<StackLayout class="dialogContainer" :class="appTheme">
|
<StackLayout class="dialogContainer" :class="appTheme">
|
||||||
<Label class="dialogTitle orkm" :text="title" />
|
<Label class="dialogTitle orkm" :text="title" />
|
||||||
<ScrollView width="100%" :height="height ? height : screenHeight - 320">
|
<ScrollView width="100%" :height="height ? height : screenHeight - 256">
|
||||||
<StackLayout>
|
<StackLayout>
|
||||||
<MDButton
|
<MDButton
|
||||||
v-for="(item, index) in list"
|
v-for="(item, index) in list"
|
||||||
|
|
|
@ -104,9 +104,6 @@ export default new Vuex.Store({
|
||||||
// notes: [
|
// notes: [
|
||||||
// "Nutrition Facts: 3/4 cup: 409 calories, 22g fat (12g saturated fat), 61mg cholesterol, 667mg sodium, 41g carbohydrate (3g sugars, 2g fiber), 11g protein.",
|
// "Nutrition Facts: 3/4 cup: 409 calories, 22g fat (12g saturated fat), 61mg cholesterol, 667mg sodium, 41g carbohydrate (3g sugars, 2g fiber), 11g protein.",
|
||||||
// ],
|
// ],
|
||||||
// references: [
|
|
||||||
// "https://www.tasteofhome.com/recipes/mushroom-spinach-risotto/",
|
|
||||||
// ],
|
|
||||||
// isFavorite: false,
|
// isFavorite: false,
|
||||||
// tried: false,
|
// tried: false,
|
||||||
// lastTried: "2020-10-28T18:19:06.528Z",
|
// lastTried: "2020-10-28T18:19:06.528Z",
|
||||||
|
@ -180,7 +177,7 @@ export default new Vuex.Store({
|
||||||
trylaterOutline: "\ue94a",
|
trylaterOutline: "\ue94a",
|
||||||
note: "\ueb04",
|
note: "\ueb04",
|
||||||
copy: "\ue9e6",
|
copy: "\ue9e6",
|
||||||
check: "\ue9ab",
|
check: "\ue9a4",
|
||||||
telegram: "\ueec7",
|
telegram: "\ueec7",
|
||||||
time: "\ueba2",
|
time: "\ueba2",
|
||||||
item: "\ue99d",
|
item: "\ue99d",
|
||||||
|
|