settings wip

vue/src/components/CookbookEditCard.vue

@@ -5,7 +5,7 @@
                 {{ book_copy.icon }} {{ book_copy.name }}
                 <span class="float-right text-primary" @click="editOrSave"><i class="fa" v-bind:class="{ 'fa-pen': !editing, 'fa-save': editing }" aria-hidden="true"></i></span>
             </h5>
-            <b-badge class="font-weight-normal mr-1" v-for="u in book_copy.shared" v-bind:key="u.id" variant="primary" pill>{{ u.username }}</b-badge>
+            <b-badge class="font-weight-normal mr-1" v-for="u in book_copy.shared" v-bind:key="u.id" variant="primary" pill>{{ u.display_name }}</b-badge>
         </b-card-header>
         <b-card-body class="p-4">
             <div class="form-group" v-if="editing">
@@ -25,7 +25,7 @@
                     @change="book_copy.shared = $event.val"
                     parent_variable="book.shared"
                     :initial_selection="book.shared"
-                    :label="'username'"
+                    :label="'display_name'"
                     :model="Models.USER_NAME"
                     style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
                     v-bind:placeholder="$t('Share')"

vue/src/components/MealPlanEditModal.vue

@@ -64,7 +64,7 @@
                                         required
                                         @change="entryEditing.shared = $event.val"
                                         parent_variable="entryEditing.shared"
-                                        :label="'username'"
+                                        :label="'display_name'"
                                         :model="Models.USER_NAME"
                                         style="flex-grow: 1; flex-shrink: 1; flex-basis: 0"
                                         v-bind:placeholder="$t('Share')"

vue/src/components/Settings/APISettingsComponent.vue

@@ -0,0 +1,59 @@
+<template>
+    <div v-if="user_preferences !== undefined">
+
+
+    </div>
+</template>
+
+<script>
+import {ApiApiFactory} from "@/utils/openapi/api";
+import {StandardToasts} from "@/utils/utils";
+
+import axios from "axios";
+
+axios.defaults.xsrfCookieName = 'csrftoken'
+axios.defaults.xsrfHeaderName = "X-CSRFTOKEN"
+
+export default {
+    name: "APISettingsComponent",
+    props: {
+        user_id: Number,
+    },
+    data() {
+        return {
+            user_preferences: undefined,
+            languages: [],
+        }
+    },
+    mounted() {
+        this.user_preferences = this.preferences
+        this.languages = window.AVAILABLE_LANGUAGES
+        this.loadSettings()
+    },
+    methods: {
+        loadSettings: function () {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.retrieveUserPreference(this.user_id.toString()).then(result => {
+                this.user_preferences = result.data
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
+            })
+        },
+        updateSettings: function (reload) {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.partialUpdateUserPreference(this.user_id.toString(), this.user_preferences).then(result => {
+                StandardToasts.makeStandardToast(this, StandardToasts.SUCCESS_UPDATE)
+                if (reload !== undefined) {
+                    location.reload()
+                }
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
+            })
+        },
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

vue/src/components/Settings/AccountSettingsComponent.vue

@@ -0,0 +1,78 @@
+<template>
+    <div v-if="user !== undefined">
+
+        <b-form-input v-model="user.username" @change="updateUser(false)" disabled></b-form-input>
+        <b-form-input v-model="user.first_name" @change="updateUser(false)"></b-form-input>
+        <b-form-input v-model="user.last_name" @change="updateUser(false)"></b-form-input>
+    </div>
+</template>
+
+<script>
+import {ApiApiFactory} from "@/utils/openapi/api";
+import {StandardToasts} from "@/utils/utils";
+
+import axios from "axios";
+
+axios.defaults.xsrfCookieName = 'csrftoken'
+axios.defaults.xsrfHeaderName = "X-CSRFTOKEN"
+
+export default {
+    name: "AccountSettingsComponent",
+    props: {
+        user_id: Number,
+    },
+    data() {
+        return {
+            user_preferences: undefined,
+            user: undefined,
+            languages: [],
+        }
+    },
+    mounted() {
+        this.user_preferences = this.preferences
+        this.languages = window.AVAILABLE_LANGUAGES
+        this.loadSettings()
+    },
+    methods: {
+        loadSettings: function () {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.retrieveUserPreference(this.user_id.toString()).then(result => {
+                this.user_preferences = result.data
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
+            })
+            apiFactory.retrieveUser(this.user_id.toString()).then(result => {
+                this.user = result.data
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
+            })
+        },
+        updateSettings: function (reload) {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.partialUpdateUserPreference(this.user_id.toString(), this.user_preferences).then(result => {
+                StandardToasts.makeStandardToast(this, StandardToasts.SUCCESS_UPDATE)
+                if (reload !== undefined) {
+                    location.reload()
+                }
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
+            })
+        },
+        updateUser: function (reload) {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.partialUpdateUser(this.user_id.toString(), this.user).then(result => {
+                StandardToasts.makeStandardToast(this, StandardToasts.SUCCESS_UPDATE)
+                if (reload) {
+                    location.reload()
+                }
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
+            })
+        },
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

vue/src/components/Settings/MealPlanSettingsComponent.vue

@@ -0,0 +1,59 @@
+<template>
+    <div v-if="user_preferences !== undefined">
+
+
+    </div>
+</template>
+
+<script>
+import {ApiApiFactory} from "@/utils/openapi/api";
+import {StandardToasts} from "@/utils/utils";
+
+import axios from "axios";
+
+axios.defaults.xsrfCookieName = 'csrftoken'
+axios.defaults.xsrfHeaderName = "X-CSRFTOKEN"
+
+export default {
+    name: "MealPlanSettingsComponent",
+    props: {
+        user_id: Number,
+    },
+    data() {
+        return {
+            user_preferences: undefined,
+            languages: [],
+        }
+    },
+    mounted() {
+        this.user_preferences = this.preferences
+        this.languages = window.AVAILABLE_LANGUAGES
+        this.loadSettings()
+    },
+    methods: {
+        loadSettings: function () {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.retrieveUserPreference(this.user_id.toString()).then(result => {
+                this.user_preferences = result.data
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
+            })
+        },
+        updateSettings: function (reload) {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.partialUpdateUserPreference(this.user_id.toString(), this.user_preferences).then(result => {
+                StandardToasts.makeStandardToast(this, StandardToasts.SUCCESS_UPDATE)
+                if (reload !== undefined) {
+                    location.reload()
+                }
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
+            })
+        },
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

vue/src/components/Settings/SearchSettingsComponent.vue

@@ -0,0 +1,59 @@
+<template>
+    <div v-if="user_preferences !== undefined">
+
+
+    </div>
+</template>
+
+<script>
+import {ApiApiFactory} from "@/utils/openapi/api";
+import {StandardToasts} from "@/utils/utils";
+
+import axios from "axios";
+
+axios.defaults.xsrfCookieName = 'csrftoken'
+axios.defaults.xsrfHeaderName = "X-CSRFTOKEN"
+
+export default {
+    name: "SearchSettingsComponent",
+    props: {
+        user_id: Number,
+    },
+    data() {
+        return {
+            user_preferences: undefined,
+            languages: [],
+        }
+    },
+    mounted() {
+        this.user_preferences = this.preferences
+        this.languages = window.AVAILABLE_LANGUAGES
+        this.loadSettings()
+    },
+    methods: {
+        loadSettings: function () {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.retrieveUserPreference(this.user_id.toString()).then(result => {
+                this.user_preferences = result.data
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
+            })
+        },
+        updateSettings: function (reload) {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.partialUpdateUserPreference(this.user_id.toString(), this.user_preferences).then(result => {
+                StandardToasts.makeStandardToast(this, StandardToasts.SUCCESS_UPDATE)
+                if (reload !== undefined) {
+                    location.reload()
+                }
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
+            })
+        },
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

vue/src/components/Settings/ShoppingSettingsComponent.vue

@@ -0,0 +1,59 @@
+<template>
+    <div v-if="user_preferences !== undefined">
+
+
+    </div>
+</template>
+
+<script>
+import {ApiApiFactory} from "@/utils/openapi/api";
+import {StandardToasts} from "@/utils/utils";
+
+import axios from "axios";
+
+axios.defaults.xsrfCookieName = 'csrftoken'
+axios.defaults.xsrfHeaderName = "X-CSRFTOKEN"
+
+export default {
+    name: "ShoppingSettingsComponent",
+    props: {
+        user_id: Number,
+    },
+    data() {
+        return {
+            user_preferences: undefined,
+            languages: [],
+        }
+    },
+    mounted() {
+        this.user_preferences = this.preferences
+        this.languages = window.AVAILABLE_LANGUAGES
+        this.loadSettings()
+    },
+    methods: {
+        loadSettings: function () {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.retrieveUserPreference(this.user_id.toString()).then(result => {
+                this.user_preferences = result.data
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
+            })
+        },
+        updateSettings: function (reload) {
+            let apiFactory = new ApiApiFactory()
+            apiFactory.partialUpdateUserPreference(this.user_id.toString(), this.user_preferences).then(result => {
+                StandardToasts.makeStandardToast(this, StandardToasts.SUCCESS_UPDATE)
+                if (reload !== undefined) {
+                    location.reload()
+                }
+            }).catch(err => {
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_UPDATE, err)
+            })
+        },
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

vue/src/components/ShoppingLineItem.vue

@@ -385,7 +385,7 @@ export default {
             return [item?.recipe_mealplan?.mealplan_note, item?.ingredient_note].filter(String)
         },
         formatOneCreatedBy: function (item) {
-            return [this.$t("Added_by"), item?.created_by.username, "@", this.formatDate(item.created_at)].join(" ")
+            return [this.$t("Added_by"), item?.created_by.display_name, "@", this.formatDate(item.created_at)].join(" ")
         },
         openRecipeCard: function (e, item) {
             this.genericAPI(this.Models.RECIPE, this.Actions.FETCH, {id: item.recipe_mealplan.recipe}).then((result) => {