basics

cookbook/templates/edit_internal_recipe_v2.html

@@ -0,0 +1,38 @@
+{% extends "base.html" %}
+{% load render_bundle from webpack_loader %}
+{% load static %}
+{% load i18n %}
+{% load l10n %}
+
+{% block title %}{% trans 'Edit Recipe' %}{% endblock %}
+
+{% block extra_head %}
+
+{% endblock %}
+
+{% block content %}
+
+    <div id="app" >
+        <edit-internal-recipe></edit-internal-recipe>
+    </div>
+
+
+{% endblock %}
+
+
+{% block script %}
+    {% if debug %}
+        <script src="{% url 'js_reverse' %}"></script>
+    {% else %}
+        <script src="{% static 'django_js_reverse/reverse.js' %}"></script>
+    {% endif %}
+
+    <script type="application/javascript">
+
+        window.CUSTOM_LOCALE = '{{ request.LANGUAGE_CODE }}'
+
+
+    </script>
+
+    {% render_bundle 'edit_internal_recipe' %}
+{% endblock %}

cookbook/views/edit.py

@@ -57,7 +57,7 @@ def internal_recipe_update(request, pk):
     recipe_instance = get_object_or_404(Recipe, pk=pk, space=request.space)
 
     return render(
-        request, 'forms/edit_internal_recipe.html', {'recipe': recipe_instance}
+        request, 'edit_internal_recipe_v2.html', {'recipe': recipe_instance}
     )
 
 

vue/src/apps/RecipeEditView/RecipeEditView.vue

@@ -0,0 +1,48 @@
+<template>
+  <div id="app" >
+
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import {BootstrapVue} from 'bootstrap-vue'
+
+import 'bootstrap-vue/dist/bootstrap-vue.css'
+
+import {ResolveUrlMixin} from "@/utils/utils";
+
+Vue.use(BootstrapVue)
+
+export default {
+  name: 'RecipeSearchView',
+  mixins: [ResolveUrlMixin],
+  components: {},
+  data() {
+    return {
+
+    }
+
+  },
+  computed: {
+
+  },
+  mounted() {
+
+    this.$i18n.locale = window.CUSTOM_LOCALE
+  },
+  watch: {
+
+  },
+  methods: {
+
+  }
+}
+
+</script>
+
+<style src="vue-multiselect/dist/vue-multiselect.min.css"></style>
+
+<style>
+
+</style>

vue/src/apps/RecipeEditView/main.js

@@ -0,0 +1,10 @@
+import Vue from 'vue'
+import App from './RecipeEditView'
+import i18n from '@/i18n'
+
+Vue.config.productionTip = false
+
+new Vue({
+    i18n,
+    render: h => h(App),
+}).$mount('#app')

vue/vue.config.js

@@ -29,6 +29,10 @@ const pages = {
         entry: './src/apps/ModelListView/main.js',
         chunks: ['chunk-vendors']
     },
+    'edit_internal_recipe': {
+        entry: './src/apps/RecipeEditView/main.js',
+        chunks: ['chunk-vendors']
+    },
 }
 
 module.exports = {

vue/webpack-stats.json

@@ -1,119 +1,130 @@
 {
   "status": "done",
   "assets": {
-    "../../templates/sw.js": {
-      "name": "../../templates/sw.js",
-      "path": "../../templates/sw.js"
-    },
-    "css/chunk-vendors.css": {
-      "name": "css/chunk-vendors.css",
-      "path": "css/chunk-vendors.css"
-    },
     "js/chunk-vendors.js": {
       "name": "js/chunk-vendors.js",
-      "path": "js/chunk-vendors.js"
+      "path": "js\\chunk-vendors.js",
+      "publicPath": "http://localhost:8080/js/chunk-vendors.js"
+    },
+    "js/edit_internal_recipe.js": {
+      "name": "js/edit_internal_recipe.js",
+      "path": "js\\edit_internal_recipe.js",
+      "publicPath": "http://localhost:8080/js/edit_internal_recipe.js"
     },
     "js/import_response_view.js": {
       "name": "js/import_response_view.js",
-      "path": "js/import_response_view.js"
-    },
-    "css/model_list_view.css": {
-      "name": "css/model_list_view.css",
-      "path": "css/model_list_view.css"
+      "path": "js\\import_response_view.js",
+      "publicPath": "http://localhost:8080/js/import_response_view.js"
     },
     "js/model_list_view.js": {
       "name": "js/model_list_view.js",
-      "path": "js/model_list_view.js"
+      "path": "js\\model_list_view.js",
+      "publicPath": "http://localhost:8080/js/model_list_view.js"
     },
     "js/offline_view.js": {
       "name": "js/offline_view.js",
-      "path": "js/offline_view.js"
+      "path": "js\\offline_view.js",
+      "publicPath": "http://localhost:8080/js/offline_view.js"
     },
     "js/recipe_search_view.js": {
       "name": "js/recipe_search_view.js",
-      "path": "js/recipe_search_view.js"
+      "path": "js\\recipe_search_view.js",
+      "publicPath": "http://localhost:8080/js/recipe_search_view.js"
     },
     "js/recipe_view.js": {
       "name": "js/recipe_view.js",
-      "path": "js/recipe_view.js"
+      "path": "js\\recipe_view.js",
+      "publicPath": "http://localhost:8080/js/recipe_view.js"
     },
     "js/supermarket_view.js": {
       "name": "js/supermarket_view.js",
-      "path": "js/supermarket_view.js"
+      "path": "js\\supermarket_view.js",
+      "publicPath": "http://localhost:8080/js/supermarket_view.js"
     },
     "js/user_file_view.js": {
       "name": "js/user_file_view.js",
-      "path": "js/user_file_view.js"
+      "path": "js\\user_file_view.js",
+      "publicPath": "http://localhost:8080/js/user_file_view.js"
     },
     "recipe_search_view.html": {
       "name": "recipe_search_view.html",
-      "path": "recipe_search_view.html"
+      "path": "recipe_search_view.html",
+      "publicPath": "http://localhost:8080/recipe_search_view.html"
     },
     "recipe_view.html": {
       "name": "recipe_view.html",
-      "path": "recipe_view.html"
+      "path": "recipe_view.html",
+      "publicPath": "http://localhost:8080/recipe_view.html"
     },
     "offline_view.html": {
       "name": "offline_view.html",
-      "path": "offline_view.html"
+      "path": "offline_view.html",
+      "publicPath": "http://localhost:8080/offline_view.html"
     },
     "import_response_view.html": {
       "name": "import_response_view.html",
-      "path": "import_response_view.html"
+      "path": "import_response_view.html",
+      "publicPath": "http://localhost:8080/import_response_view.html"
     },
     "supermarket_view.html": {
       "name": "supermarket_view.html",
-      "path": "supermarket_view.html"
+      "path": "supermarket_view.html",
+      "publicPath": "http://localhost:8080/supermarket_view.html"
     },
     "user_file_view.html": {
       "name": "user_file_view.html",
-      "path": "user_file_view.html"
+      "path": "user_file_view.html",
+      "publicPath": "http://localhost:8080/user_file_view.html"
     },
     "model_list_view.html": {
       "name": "model_list_view.html",
-      "path": "model_list_view.html"
+      "path": "model_list_view.html",
+      "publicPath": "http://localhost:8080/model_list_view.html"
+    },
+    "edit_internal_recipe.html": {
+      "name": "edit_internal_recipe.html",
+      "path": "edit_internal_recipe.html",
+      "publicPath": "http://localhost:8080/edit_internal_recipe.html"
     },
     "manifest.json": {
       "name": "manifest.json",
-      "path": "manifest.json"
+      "path": "manifest.json",
+      "publicPath": "http://localhost:8080/manifest.json"
     }
   },
   "chunks": {
     "recipe_search_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
       "js/recipe_search_view.js"
     ],
     "recipe_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
       "js/recipe_view.js"
     ],
     "offline_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
       "js/offline_view.js"
     ],
     "import_response_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
       "js/import_response_view.js"
     ],
     "supermarket_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
       "js/supermarket_view.js"
     ],
     "user_file_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
       "js/user_file_view.js"
     ],
     "model_list_view": [
-      "css/chunk-vendors.css",
       "js/chunk-vendors.js",
-      "css/model_list_view.css",
       "js/model_list_view.js"
+    ],
+    "edit_internal_recipe": [
+      "js/chunk-vendors.js",
+      "js/edit_internal_recipe.js"
     ]
-  }
+  },
+  "publicPath": "http://localhost:8080/"
 }