michael/enrecipes
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

formatted

Browse source
This commit is contained in:
Vishnu Raghav B 2020-09-15 23:34:33 +05:30
parent 85e0fcbe7f
commit fe6d6d1d60
8 changed files with 134 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
app/components/App.vue
View file

@ -55,7 +55,9 @@
:key="index" :key="index"
orientation="horizontal" orientation="horizontal"
class="drawer-item orkm" class="drawer-item orkm"
:class="{ 'selected-drawer-item': selectedCategory == item }" :class="{
'selected-drawer-item': selectedCategory == item,
}"
> >
<Label class="bx" :text="icon.label" margin="0 24 0 0" /> <Label class="bx" :text="icon.label" margin="0 24 0 0" />
<Label :text="item" /> <Label :text="item" />
@ -71,7 +73,9 @@
:key="index" :key="index"
orientation="horizontal" orientation="horizontal"
class="drawer-item orkm" class="drawer-item orkm"
:class="{ 'selected-drawer-item': currentComponent == item.title }" :class="{
'selected-drawer-item': currentComponent == item.title,
}"
> >
<Label class="bx" :text="item.icon" margin="0 24 0 0" /> <Label class="bx" :text="item.icon" margin="0 24 0 0" />
<Label :text="item.title" /> <Label :text="item.title" />
@ -127,7 +131,7 @@
col="1" col="1"
/> />
<Label <Label
v-if="!filterFavorites && currentComponent == 'EnRecipes'" v-if="currentComponent == 'EnRecipes'"
color="#000000" color="#000000"
class="bx" class="bx"
:text="icon.search" :text="icon.search"
@ -156,6 +160,7 @@
:selectedCategory="selectedCategory" :selectedCategory="selectedCategory"
:searchQuery="searchQuery" :searchQuery="searchQuery"
:filterFavorites="filterFavorites" :filterFavorites="filterFavorites"
:highlight="highlight"
/> />
</GridLayout> </GridLayout>
</Page> </Page>
@ -288,6 +293,14 @@ export default {
}, },
}, },
methods: { methods: {
highlight(args) {
console.log(args.object.className)
let temp = args.object.className
args.object.className = `${temp} option-highlight`
setTimeout(() => {
args.object.className = temp
}, 100)
},
setSelectedCategory(e) { setSelectedCategory(e) {
this.selectedCategory = e.item this.selectedCategory = e.item
console.log(e) console.log(e)

72
app/components/EnRecipes.vue
View file

@ -1,7 +1,50 @@
<template> <template>
<AbsoluteLayout> <AbsoluteLayout>
<ScrollView scrollBarIndicatorVisible="false" width="100%" height="100%"> <ScrollView scrollBarIndicatorVisible="false" width="100%" height="100%">
<StackLayout> <StackLayout v-if="filteredRecipes.length">
<!-- <RadListView
ref="listView"
for="item in filteredRecipes"
swipeActions="true"
@itemSwipeProgressStarted="onSwipeStarted"
>
<v-template>
<StackLayout class="item p-t-10" orientation="vertical">
<Label :text="item.name" class="nameLabel"></Label>
<Label :text="item.description" class="descriptionLabel"></Label>
</StackLayout>
</v-template>
<v-template name="itemswipe">
<GridLayout columns="auto, *, auto" backgroundColor="White">
<StackLayout
id="mark-view"
col="0"
class="swipe-item left"
orientation="horizontal"
@tap="onLeftSwipeClick"
>
<Label
text="mark"
verticalAlignment="center"
horizontalAlignment="center"
/>
</StackLayout>
<StackLayout
id="delete-view"
col="2"
class="swipe-item right"
orientation="horizontal"
@tap="onRightSwipeClick"
>
<Label
text="delete"
verticalAlignment="center"
horizontalAlignment="center"
/>
</StackLayout>
</GridLayout>
</v-template>
</RadListView>-->
<GridLayout <GridLayout
v-for="recipe in filteredRecipes" v-for="recipe in filteredRecipes"
:key="recipe.id" :key="recipe.id"
@ -24,6 +67,16 @@
</GridLayout> </GridLayout>
<StackLayout height="128"></StackLayout> <StackLayout height="128"></StackLayout>
</StackLayout> </StackLayout>
<Label
v-else
class="recipe-list-item"
horizontalAlignment="center"
:text="
`Your search '${searchQuery}' did not match any recipes in this category.`
"
textAlignment="center"
textWrap="true"
/>
</ScrollView> </ScrollView>
<GridLayout id="btnFabContainer" rows="*,88" columns="*,88"> <GridLayout id="btnFabContainer" rows="*,88" columns="*,88">
<Label <Label
@ -58,16 +111,21 @@ export default {
}, {}) }, {})
}, },
filteredRecipes() { filteredRecipes() {
if (this.selectedCategory) if (this.selectedCategory) {
return this.recipesByCategory[this.selectedCategory] return this.recipesByCategory[this.selectedCategory].filter((e) => {
else { if (e.title.toLowerCase().includes(this.searchQuery)) return e
})
} else if (this.filterFavorites) {
console.log("fav")
return this.recipes.filter((e) => { return this.recipes.filter((e) => {
if (this.filterFavorites) { if (e.isFavorite) {
if (e.isFavorite) return e
} else {
if (e.title.toLowerCase().includes(this.searchQuery)) return e if (e.title.toLowerCase().includes(this.searchQuery)) return e
} }
}) })
} else {
return this.recipes.filter((e) => {
if (e.title.toLowerCase().includes(this.searchQuery)) return e
})
} }
}, },
}, },

12
app/components/Favorites.vue
View file

@ -1,12 +0,0 @@
<template>
<AbsoluteLayout>
<Label text="Favorites" textWrap="true" />
</AbsoluteLayout>
</template>
<script>
export default {};
</script>
<style>
</style>

8
app/components/Settings.vue
View file

@ -35,6 +35,7 @@
import { Menu } from "nativescript-menu" import { Menu } from "nativescript-menu"
import * as permissions from "nativescript-permissions" import * as permissions from "nativescript-permissions"
export default { export default {
props: ["highlight"],
data() { data() {
return { return {
icon: { icon: {
@ -75,6 +76,7 @@ export default {
}, },
methods: { methods: {
selectThemes(args) { selectThemes(args) {
this.highlight(args)
let btn = args.object let btn = args.object
Menu.popup({ Menu.popup({
view: btn, view: btn,
@ -89,6 +91,7 @@ export default {
.catch(console.log) .catch(console.log)
}, },
selectBackupDir(args) { selectBackupDir(args) {
this.highlight(args)
let btn = args.object let btn = args.object
permissions permissions
.requestPermission(android.Manifest.permission.WRITE_EXTERNAL_STORAGE) .requestPermission(android.Manifest.permission.WRITE_EXTERNAL_STORAGE)
@ -101,6 +104,7 @@ export default {
}, },
backupData(args) { backupData(args) {
let btn = args.object let btn = args.object
this.highlight(args)
permissions permissions
.requestPermission(android.Manifest.permission.WRITE_EXTERNAL_STORAGE) .requestPermission(android.Manifest.permission.WRITE_EXTERNAL_STORAGE)
.then(() => { .then(() => {
@ -112,6 +116,7 @@ export default {
}, },
restoreData(args) { restoreData(args) {
let btn = args.object let btn = args.object
this.highlight(args)
permissions permissions
.requestPermission(android.Manifest.permission.WRITE_EXTERNAL_STORAGE) .requestPermission(android.Manifest.permission.WRITE_EXTERNAL_STORAGE)
.then(() => { .then(() => {
@ -125,6 +130,9 @@ export default {
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.option-highlight {
background-color: #eeeeee;
}
.group-header { .group-header {
padding: 12; padding: 12;
color: #ff7043; color: #ff7043;

2
app/main.js
View file

@ -1,5 +1,6 @@
import Vue from "nativescript-vue" import Vue from "nativescript-vue"
import App from "./components/App" import App from "./components/App"
// import RadListView from "nativescript-ui-listview/vue"
Vue.registerElement( Vue.registerElement(
"CheckBox", "CheckBox",
@ -11,6 +12,7 @@ Vue.registerElement(
}, },
} }
) )
// Vue.use('RadListView')
// import VueDevtools from 'nativescript-vue-devtools' // import VueDevtools from 'nativescript-vue-devtools'
// import { TNSFontIcon, fonticon } from 'nativescript-fonticon' // import { TNSFontIcon, fonticon } from 'nativescript-fonticon'

50
package-lock.json generated
View file

@ -1515,6 +1515,11 @@
"readable-stream": "^2.0.6" "readable-stream": "^2.0.6"
} }
}, },
"arg": {
"version": "4.1.3",
"resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
"integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA=="
},
"arity-n": { "arity-n": {
"version": "1.0.4", "version": "1.0.4",
"resolved": "https://registry.npmjs.org/arity-n/-/arity-n-1.0.4.tgz", "resolved": "https://registry.npmjs.org/arity-n/-/arity-n-1.0.4.tgz",
@ -2079,8 +2084,7 @@
"buffer-from": { "buffer-from": {
"version": "1.1.1", "version": "1.1.1",
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz", "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
"integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A==", "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
"dev": true
}, },
"buffer-xor": { "buffer-xor": {
"version": "1.0.3", "version": "1.0.3",
@ -2919,6 +2923,11 @@
"integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=", "integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA=",
"dev": true "dev": true
}, },
"diff": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
"integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A=="
},
"diffie-hellman": { "diffie-hellman": {
"version": "5.0.3", "version": "5.0.3",
"resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz", "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
@ -4638,6 +4647,11 @@
} }
} }
}, },
"make-error": {
"version": "1.3.6",
"resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
"integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
},
"map-age-cleaner": { "map-age-cleaner": {
"version": "0.1.3", "version": "0.1.3",
"resolved": "https://registry.npmjs.org/map-age-cleaner/-/map-age-cleaner-0.1.3.tgz", "resolved": "https://registry.npmjs.org/map-age-cleaner/-/map-age-cleaner-0.1.3.tgz",
@ -5191,11 +5205,6 @@
"mkdirp": "^0.5.1" "mkdirp": "^0.5.1"
} }
}, },
"nativescript-material-icons": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/nativescript-material-icons/-/nativescript-material-icons-1.0.3.tgz",
"integrity": "sha1-d/qP23jsCR3EpqeFTnaF6iiVAIw="
},
"nativescript-menu": { "nativescript-menu": {
"version": "1.1.6", "version": "1.1.6",
"resolved": "https://registry.npmjs.org/nativescript-menu/-/nativescript-menu-1.1.6.tgz", "resolved": "https://registry.npmjs.org/nativescript-menu/-/nativescript-menu-1.1.6.tgz",
@ -5216,6 +5225,15 @@
"resolved": "https://registry.npmjs.org/nativescript-ui-core/-/nativescript-ui-core-4.0.0.tgz", "resolved": "https://registry.npmjs.org/nativescript-ui-core/-/nativescript-ui-core-4.0.0.tgz",
"integrity": "sha512-YbGZApyI84RGSevCmXVD18yGov7/RJyLcIXXx6p2y4WM41hL+uRxyUak/9qLP2vwSSy0bCZKXFoyYwsIcf8EoA==" "integrity": "sha512-YbGZApyI84RGSevCmXVD18yGov7/RJyLcIXXx6p2y4WM41hL+uRxyUak/9qLP2vwSSy0bCZKXFoyYwsIcf8EoA=="
}, },
"nativescript-ui-listview": {
"version": "9.0.2",
"resolved": "https://registry.npmjs.org/nativescript-ui-listview/-/nativescript-ui-listview-9.0.2.tgz",
"integrity": "sha512-FoybUHhD+cHsxQKf9EVyY1f/UWBkqb/B77+aSR6dwyPvRGSYymiEKRemsjBosWwgbOH3oy6gBaHOioYhxHE0AA==",
"requires": {
"nativescript-ui-core": "~4.0.0",
"ts-node": "^8.10.2"
}
},
"nativescript-ui-sidedrawer": { "nativescript-ui-sidedrawer": {
"version": "8.0.1", "version": "8.0.1",
"resolved": "https://registry.npmjs.org/nativescript-ui-sidedrawer/-/nativescript-ui-sidedrawer-8.0.1.tgz", "resolved": "https://registry.npmjs.org/nativescript-ui-sidedrawer/-/nativescript-ui-sidedrawer-8.0.1.tgz",
@ -7182,7 +7200,6 @@
"version": "0.5.19", "version": "0.5.19",
"resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.19.tgz", "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.19.tgz",
"integrity": "sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw==", "integrity": "sha512-Wonm7zOCIJzBGQdB+thsPar0kYuCIzYvxZwlBa87yi/Mdjv7Tip2cyVbLj5o0cFPN4EVkuTwb3GDDyUx2DGnGw==",
"dev": true,
"requires": { "requires": {
"buffer-from": "^1.0.0", "buffer-from": "^1.0.0",
"source-map": "^0.6.0" "source-map": "^0.6.0"
@ -7755,6 +7772,18 @@
} }
} }
}, },
"ts-node": {
"version": "8.10.2",
"resolved": "https://registry.npmjs.org/ts-node/-/ts-node-8.10.2.tgz",
"integrity": "sha512-ISJJGgkIpDdBhWVu3jufsWpK3Rzo7bdiIXJjQc0ynKxVOVcg2oIrf2H2cejminGrptVc6q6/uynAHNCuWGbpVA==",
"requires": {
"arg": "^4.1.0",
"diff": "^4.0.1",
"make-error": "^1.1.1",
"source-map-support": "^0.5.17",
"yn": "3.1.1"
}
},
"tslib": { "tslib": {
"version": "1.10.0", "version": "1.10.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz", "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.10.0.tgz",
@ -8484,6 +8513,11 @@
"camelcase": "^5.0.0", "camelcase": "^5.0.0",
"decamelize": "^1.2.0" "decamelize": "^1.2.0"
} }
},
"yn": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
"integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q=="
} }
} }
} }

2
package.json
View file

@ -18,10 +18,10 @@
"@nativescript/theme": "^2.2.1", "@nativescript/theme": "^2.2.1",
"@nstudio/nativescript-checkbox": "^1.0.0", "@nstudio/nativescript-checkbox": "^1.0.0",
"nativescript-fonticon": "^2.0.2", "nativescript-fonticon": "^2.0.2",
"nativescript-material-icons": "^1.0.3",
"nativescript-menu": "^1.1.6", "nativescript-menu": "^1.1.6",
"nativescript-permissions": "^1.3.9", "nativescript-permissions": "^1.3.9",
"nativescript-popup": "^1.5.0", "nativescript-popup": "^1.5.0",
"nativescript-ui-listview": "^9.0.2",
"nativescript-ui-sidedrawer": "^8.0.1", "nativescript-ui-sidedrawer": "^8.0.1",
"nativescript-vue": "^2.6.1", "nativescript-vue": "^2.6.1",
"tns-core-modules": "^6.5.1", "tns-core-modules": "^6.5.1",

39
tsconfig.json
View file

@ -1,39 +0,0 @@
{
"compilerOptions": {
"target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
"module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
"lib": [
"dom", "es2015"
], /* Specify library files to be included in the compilation. */
"sourceMap": true, /* Generates corresponding '.map' file. */
"noEmitHelpers": true,
"importHelpers": true, /* Import emit helpers from 'tslib'. */
"moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
"baseUrl": ".", /* Base directory to resolve non-absolute module names. */
"paths": {
"@/*": [
"app/*"
]
}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
"typeRoots": [
"types"
], /* List of folders to include type definitions from. */
"types": [
"node"
], /* Type declaration files to be included in compilation. */
"allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
"esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
"experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */
"emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */
"skipLibCheck": true
},
"include": [
"app",
"types"
],
"exclude": [
"node_modules",
"platforms"
]
}