login form refactor/split v-container

This commit is contained in:
hay-kot 2021-02-24 21:32:26 -09:00
commit c8e90f759d
19 changed files with 232 additions and 202 deletions

View file

@ -31,10 +31,8 @@
<LanguageMenu /> <LanguageMenu />
</v-app-bar> </v-app-bar>
<v-main> <v-main>
<v-container>
<AddRecipeFab /> <AddRecipeFab />
<router-view></router-view> <router-view></router-view>
</v-container>
<FlashMessage :position="'right bottom'"></FlashMessage> <FlashMessage :position="'right bottom'"></FlashMessage>
</v-main> </v-main>
</v-app> </v-app>

View file

@ -5,13 +5,14 @@ const prefix = baseURL + "categories";
const categoryURLs = { const categoryURLs = {
get_all: `${prefix}`, get_all: `${prefix}`,
get_category: (category) => `${prefix}/${category}`, get_category: category => `${prefix}/${category}`,
delete_category: (category) => `${prefix}/${category}`, delete_category: category => `${prefix}/${category}`,
}; };
export default { export default {
async get_all() { async get_all() {
let response = await apiReq.get(categoryURLs.get_all); let response = await apiReq.get(categoryURLs.get_all);
console.log("All Cats", response.data);
return response.data; return response.data;
}, },
async get_recipes_in_category(category) { async get_recipes_in_category(category) {

View file

@ -1,6 +1,6 @@
<template> <template>
<div class="text-center"> <div class="text-center">
<v-dialog v-model="dialog" width="500"> <v-dialog v-model="dialog" width="500px">
<LoginForm @logged-in="dialog = false" /> <LoginForm @logged-in="dialog = false" />
</v-dialog> </v-dialog>
</div> </div>

View file

@ -1,8 +1,7 @@
<template> <template>
<div> <v-card width="500px">
<v-card max-width="500px">
<v-divider></v-divider> <v-divider></v-divider>
<v-app-bar dark color="primary mt-n1"> <v-app-bar dark color="primary" class="mt-n1">
<v-icon large left v-if="!loading"> <v-icon large left v-if="!loading">
mdi-account mdi-account
</v-icon> </v-icon>
@ -88,7 +87,6 @@
</v-btn> </v-btn>
</v-card-actions> --> </v-card-actions> -->
</v-card> </v-card>
</div>
</template> </template>
<script> <script>
@ -129,12 +127,14 @@ export default {
} catch { } catch {
this.error = true; this.error = true;
} }
if (key.status != 200) this.error = true; if (key.status != 200) {
else { this.error = true;
this.$emit("logged-in"); this.loading = false;
} else {
this.clear(); this.clear();
}
this.$store.commit("setToken", key.data.access_token); this.$store.commit("setToken", key.data.access_token);
this.$emit("logged-in");
}
let user = await api.users.self(); let user = await api.users.self();
this.$store.commit("setUserData", user); this.$store.commit("setUserData", user);

View file

@ -76,7 +76,6 @@
<v-btn color="success" @click="save" text :disabled="meals.length == 0"> <v-btn color="success" @click="save" text :disabled="meals.length == 0">
{{ $t("general.save") }} {{ $t("general.save") }}
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-row> </v-row>
</v-card> </v-card>
@ -118,6 +117,7 @@ export default {
}, },
async mounted() { async mounted() {
let settings = await api.settings.requestAll(); let settings = await api.settings.requestAll();
console.log("Settings", settings.planCategories);
this.items = await api.recipes.getAllByCategory(settings.planCategories); this.items = await api.recipes.getAllByCategory(settings.planCategories);
}, },

View file

@ -1,5 +1,5 @@
<template> <template>
<div class="text-center"> <v-container class="text-center">
<v-row> <v-row>
<v-col cols="2"></v-col> <v-col cols="2"></v-col>
<v-col> <v-col>
@ -12,7 +12,7 @@
</v-col> </v-col>
<v-col cols="2"></v-col> <v-col cols="2"></v-col>
</v-row> </v-row>
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <v-container>
<AdminSidebar /> <AdminSidebar />
<v-slide-x-transition hide-on-leave> <v-slide-x-transition hide-on-leave>
<router-view></router-view> <router-view></router-view>
@ -23,7 +23,7 @@
</a> </a>
</v-col> </v-col>
</v-footer> --> </v-footer> -->
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <v-container>
<CategorySidebar /> <CategorySidebar />
<CardSection <CardSection
:sortable="true" :sortable="true"
@ -9,7 +9,7 @@
@sort="sortAZ" @sort="sortAZ"
@sort-recent="sortRecent" @sort-recent="sortRecent"
/> />
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <v-container>
<CategorySidebar /> <CategorySidebar />
<CardSection <CardSection
:sortable="true" :sortable="true"
@ -9,7 +9,7 @@
@sort="sortAZ" @sort="sortAZ"
@sort-recent="sortRecent" @sort-recent="sortRecent"
/> />
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,8 +1,8 @@
<template> <template>
<div> <v-container>
<LastRecipe /> <LastRecipe />
<LogFile class="mt-2" /> <LogFile class="mt-2" />
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <v-container>
<CategorySidebar /> <CategorySidebar />
<CardSection <CardSection
v-if="showRecent" v-if="showRecent"
@ -17,7 +17,7 @@
@sort="sortAZ(index)" @sort="sortAZ(index)"
@sort-recent="sortRecent(index)" @sort-recent="sortRecent(index)"
/> />
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,9 +1,12 @@
<template> <template>
<v-row justify="start" height="100%"> <v-container fill-height class="text-center">
<v-col align="center"> <v-row>
<LoginForm /> <v-flex class="d-flex justify-center" width="500px">
</v-col> <LoginForm @logged-in="redirectMe" class="ma-1" />
</v-flex>
</v-row> </v-row>
<v-row></v-row>
</v-container>
</template> </template>
<script> <script>
@ -12,6 +15,25 @@ export default {
components: { components: {
LoginForm, LoginForm,
}, },
computed: {
viewScale() {
switch (this.$vuetify.breakpoint.name) {
case "xs":
return true;
case "sm":
return true;
default:
return false;
}
},
},
methods: {
redirectMe() {
if (this.$route.query.redirect) {
this.$router.push(this.$route.query.redirect);
} else this.$router.push({ path: "/" });
},
},
}; };
</script> </script>

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <v-container>
<EditPlan <EditPlan
v-if="editMealPlan" v-if="editMealPlan"
:meal-plan="editMealPlan" :meal-plan="editMealPlan"
@ -25,8 +25,8 @@
> >
<v-card class="mt-1"> <v-card class="mt-1">
<v-card-title> <v-card-title>
{{ $d( new Date(mealplan.startDate), 'short' ) }} - {{ $d(new Date(mealplan.startDate), "short") }} -
{{ $d( new Date(mealplan.endDate), 'short' ) }} {{ $d(new Date(mealplan.endDate), "short") }}
</v-card-title> </v-card-title>
<v-list nav> <v-list nav>
<v-list-item-group color="primary"> <v-list-item-group color="primary">
@ -43,7 +43,9 @@
</v-list-item-avatar> </v-list-item-avatar>
<v-list-item-content> <v-list-item-content>
<v-list-item-title v-text="meal.name"></v-list-item-title> <v-list-item-title v-text="meal.name"></v-list-item-title>
<v-list-item-subtitle v-text="$d( new Date(meal.date), 'short' )" > <v-list-item-subtitle
v-text="$d(new Date(meal.date), 'short')"
>
</v-list-item-subtitle> </v-list-item-subtitle>
</v-list-item-content> </v-list-item-content>
</v-list-item> </v-list-item>
@ -79,7 +81,7 @@
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -1,4 +1,5 @@
<template> <template>
<v-container>
<v-card :loading="isLoading"> <v-card :loading="isLoading">
<v-img v-if="image" height="400" :src="image"> <v-img v-if="image" height="400" :src="image">
<template v-slot:placeholder> <template v-slot:placeholder>
@ -36,6 +37,7 @@
@upload="getImage" @upload="getImage"
/> />
</v-card> </v-card>
</v-container>
</template> </template>
<script> <script>

View file

@ -1,4 +1,5 @@
<template> <template>
<v-container>
<v-card id="myRecipe"> <v-card id="myRecipe">
<v-img <v-img
height="400" height="400"
@ -53,6 +54,7 @@
@upload="getImageFile" @upload="getImageFile"
/> />
</v-card> </v-card>
</v-container>
</template> </template>
<script> <script>

View file

@ -1,5 +1,5 @@
<template> <template>
<div> <v-container>
<v-row justify="center"> <v-row justify="center">
<v-col cols="1"> </v-col> <v-col cols="1"> </v-col>
<v-col> <v-col>
@ -30,7 +30,7 @@
/> />
</v-col> </v-col>
</v-row> </v-row>
</div> </v-container>
</template> </template>
<script> <script>

View file

@ -6,10 +6,16 @@ import Migration from "@/pages/Admin/Migration";
import Profile from "@/pages/Admin/Profile"; import Profile from "@/pages/Admin/Profile";
import ManageUsers from "@/pages/Admin/ManageUsers"; import ManageUsers from "@/pages/Admin/ManageUsers";
import Settings from "@/pages/Admin/Settings"; import Settings from "@/pages/Admin/Settings";
import { store } from "../store";
export default { export default {
path: "/admin", path: "/admin",
component: Admin, component: Admin,
beforeEnter: (to, _from, next) => {
if (store.getters.getIsLoggedIn) {
next();
} else next({ path: "/login", query: { redirect: to.fullPath } });
},
children: [ children: [
{ {
path: "", path: "",

View file

@ -1,6 +1,3 @@
// import utils from "@/utils";
// import Vue from "vue";
// import Vuetify from "./plugins/vuetify";
import { vueApp } from "../main"; import { vueApp } from "../main";

View file

@ -79,7 +79,7 @@ def filter_by_category(categories: list, session: Session = Depends(generate_ses
in_category = [ in_category = [
db.categories.get(session, slugify(cat), limit=1) for cat in categories db.categories.get(session, slugify(cat), limit=1) for cat in categories
] ]
in_category = [cat.get("recipes") for cat in in_category] in_category = [cat.get("recipes") for cat in in_category if cat]
in_category = [item for sublist in in_category for item in sublist] in_category = [item for sublist in in_category for item in sublist]
return in_category return in_category