This commit is contained in:
vabene1111 2021-01-11 16:19:37 +01:00
parent cb913f6cea
commit 02aec7d6d6
16 changed files with 178 additions and 106 deletions

View File

@ -378,8 +378,6 @@
<script src="{% url 'javascript-catalog' %}"></script>
<script src="{% static 'vue/components/Toast.js' %}" type="application/javascript"></script>
<script type="application/javascript">
moment.locale('{{request.LANGUAGE_CODE}}');
@ -389,7 +387,6 @@
let app = new Vue({
delimiters: ['[[', ']]'],
el: '#app',
mixin: [toast_mixin],
data: {
start_date: undefined,
start_offset: 0,
@ -431,7 +428,14 @@
//this.makeToast('success', 'this actually works', 'success')
},
methods: {
makeToast: function (title, message, variant = null) {
this.$bvToast.toast(message, {
title: title,
variant: variant,
toaster: 'b-toaster-top-center',
solid: true
})
},
updatePlan: function () {
this.dates = [];
for (var i = 0; i <= (this.number_of_days - 1); i++) {

View File

@ -6,7 +6,7 @@
</div>
{% render_bundle 'chunk-vendors' %}
{% render_bundle 'vue_app_01' %}
{% render_bundle 'recipe_view' %}
<script>

View File

@ -8,8 +8,10 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"bootstrap-vue": "^2.21.2",
"core-js": "^3.6.5",
"vue": "^3.0.0"
"vue": "^2.6.11",
"vue-template-compiler": "^2.6.12"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",

View File

@ -1,25 +0,0 @@
<template>
<HelloWorld msg="Test"/>
</template>
<script>
import HelloWorld from './components/HelloWorld.vue'
export default {
name: 'App',
components: {
HelloWorld
}
}
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>

View File

@ -0,0 +1,49 @@
<template>
<div id="app">
<h1>Recipe View</h1>
{{ recipe }}
</div>
</template>
<script>
import Vue from 'vue'
import {BootstrapVue} from 'bootstrap-vue'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import {makeToast} from "@/utils/utils.js";
Vue.use(BootstrapVue)
export default {
name: 'App',
components: {},
data() {
return {
recipe: undefined
}
},
mounted() {
makeToast("Error", "Error", "danger")
this.loadRecipe(5)
},
methods: {
loadRecipe: function (recipe_id) {
fetch(`/api/recipe/${recipe_id}`).then((response) => {
this.recipe = response.data;
}).catch((err) => {
console.log(err)
})
}
}
}
</script>
<style>
</style>

View File

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

View File

@ -1,14 +0,0 @@
<template>
<div class="hello">
<h1>{{ msg }}</h1>
</div>
</template>
<script>
export default {
name: 'TestComponent',
props: {
msg: String
}
}
</script>

View File

@ -0,0 +1,27 @@
<template>
</template>
<script>
import Vue from 'vue'
import {BootstrapVue} from 'bootstrap-vue'
Vue.use(BootstrapVue)
export default {
name: "ToastComponent",
methods: {
this.$bvToast.toast(message, {
title: title,
variant: variant,
toaster: 'b-toaster-top-center',
solid: true
})
}
}
</script>
<style scoped>
</style>

View File

@ -1,4 +0,0 @@
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')

View File

@ -1,3 +0,0 @@
export function myOtherTestFunction(n) {
return n
}

View File

@ -1,9 +0,0 @@
export {myOtherTestFunction} from './test.js'
import TestComponent from './components/TestComponent'
export function myCustomTestFunction(x) {
console.log(x)
return x
}

0
vue/src/utils/api.js Normal file
View File

11
vue/src/utils/utils.js Normal file
View File

@ -0,0 +1,11 @@
import { BToast } from 'bootstrap-vue'
export function makeToast(title, message, variant = null) {
let toaster = new BToast()
toaster.$bvToast.toast(message, {
title: title,
variant: variant,
toaster: 'b-toaster-top-center',
solid: true
})
}

View File

@ -1,12 +1,8 @@
const BundleTracker = require("webpack-bundle-tracker");
const pages = {
'vue_app_01': {
entry: './src/main.js',
chunks: ['chunk-vendors']
},
'util': {
entry: './src/utils.js',
'recipe_view': {
entry: './src/apps/RecipeView/main.js',
chunks: ['chunk-vendors']
},
}

View File

@ -1 +1 @@
{"status":"done","publicPath":"http://localhost:8080/","chunks":{"chunk-vendors":[{"name":"js/chunk-vendors.js","publicPath":"http://localhost:8080/js/chunk-vendors.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\chunk-vendors.js"}],"util":[{"name":"js/util.js","publicPath":"http://localhost:8080/js/util.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\util.js"}],"vue_app_01":[{"name":"js/vue_app_01.js","publicPath":"http://localhost:8080/js/vue_app_01.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\vue_app_01.js"},{"name":"vue_app_01.3d20274fdb25a102c86d.hot-update.js","publicPath":"http://localhost:8080/vue_app_01.3d20274fdb25a102c86d.hot-update.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\vue_app_01.3d20274fdb25a102c86d.hot-update.js"}]},"error":"ModuleError","message":"Module Error (from ./node_modules/eslint-loader/index.js):\n\nF:\\Developement\\Django\\recipes\\vue\\src\\components\\HelloWorld.vue\n 17:5 error Unexpected mutation of \"msg\" prop vue/no-mutating-props\n\n✖ 1 problem (1 error, 0 warnings)\n"}
{"status":"done","publicPath":"http://localhost:8080/","chunks":{"chunk-vendors":[{"name":"js/chunk-vendors.js","publicPath":"http://localhost:8080/js/chunk-vendors.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\chunk-vendors.js"}],"recipe_view":[{"name":"js/recipe_view.js","publicPath":"http://localhost:8080/js/recipe_view.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\recipe_view.js"},{"name":"recipe_view.500c161c00c1013409a2.hot-update.js","publicPath":"http://localhost:8080/recipe_view.500c161c00c1013409a2.hot-update.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\recipe_view.500c161c00c1013409a2.hot-update.js"}]},"error":"ModuleError","message":"Module Error (from ./node_modules/eslint-loader/index.js):\n\nF:\\Developement\\Django\\recipes\\vue\\src\\utils\\utils.js\n 2:1 error 'Vue' is not defined no-undef\n\n✖ 1 problem (1 error, 0 warnings)\n"}

View File

@ -900,6 +900,15 @@
resolved "https://registry.npm.taobao.org/@nodelib/fs.stat/download/@nodelib/fs.stat-1.1.3.tgz?cache=0&sync_timestamp=1609074653238&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40nodelib%2Ffs.stat%2Fdownload%2F%40nodelib%2Ffs.stat-1.1.3.tgz#2b5a3ab3f918cca48a8c754c08168e3f03eba61b"
integrity sha1-K1o6s/kYzKSKjHVMCBaOPwPrphs=
"@nuxt/opencollective@^0.3.2":
version "0.3.2"
resolved "https://registry.yarnpkg.com/@nuxt/opencollective/-/opencollective-0.3.2.tgz#83cb70cdb2bac5fad6f8c93529e7b11187d49c02"
integrity sha512-XG7rUdXG9fcafu9KTDIYjJSkRO38EwjlKYIb5TQ/0WDbiTUTtUtgncMscKOYzfsY86kGs05pAuMOR+3Fi0aN3A==
dependencies:
chalk "^4.1.0"
consola "^2.15.0"
node-fetch "^2.6.1"
"@soda/friendly-errors-webpack-plugin@^1.7.1":
version "1.8.0"
resolved "https://registry.npm.taobao.org/@soda/friendly-errors-webpack-plugin/download/@soda/friendly-errors-webpack-plugin-1.8.0.tgz?cache=0&sync_timestamp=1607927625608&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40soda%2Ffriendly-errors-webpack-plugin%2Fdownload%2F%40soda%2Ffriendly-errors-webpack-plugin-1.8.0.tgz#84751d82a93019d5c92c0cf0e45ac59087cd2240"
@ -1403,30 +1412,6 @@
resolved "https://registry.npm.taobao.org/@vue/preload-webpack-plugin/download/@vue/preload-webpack-plugin-1.1.2.tgz#ceb924b4ecb3b9c43871c7a429a02f8423e621ab"
integrity sha1-zrkktOyzucQ4ccekKaAvhCPmIas=
"@vue/reactivity@3.0.5":
version "3.0.5"
resolved "https://registry.npm.taobao.org/@vue/reactivity/download/@vue/reactivity-3.0.5.tgz?cache=0&sync_timestamp=1609362209031&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vue%2Freactivity%2Fdownload%2F%40vue%2Freactivity-3.0.5.tgz#e3789e4d523d845f9ae0b4d770e2b45594742fd2"
integrity sha1-43ieTVI9hF+a4LTXcOK0VZR0L9I=
dependencies:
"@vue/shared" "3.0.5"
"@vue/runtime-core@3.0.5":
version "3.0.5"
resolved "https://registry.npm.taobao.org/@vue/runtime-core/download/@vue/runtime-core-3.0.5.tgz?cache=0&sync_timestamp=1609359965550&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vue%2Fruntime-core%2Fdownload%2F%40vue%2Fruntime-core-3.0.5.tgz#da6331d5f300d5794e9e0ebdc8a8bd72a9e19962"
integrity sha1-2mMx1fMA1XlOng69yKi9cqnhmWI=
dependencies:
"@vue/reactivity" "3.0.5"
"@vue/shared" "3.0.5"
"@vue/runtime-dom@3.0.5":
version "3.0.5"
resolved "https://registry.npm.taobao.org/@vue/runtime-dom/download/@vue/runtime-dom-3.0.5.tgz?cache=0&sync_timestamp=1609359965737&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vue%2Fruntime-dom%2Fdownload%2F%40vue%2Fruntime-dom-3.0.5.tgz#1ce2c9c449e26ab06963da0064096e882a7a8935"
integrity sha1-HOLJxEniarBpY9oAZAluiCp6iTU=
dependencies:
"@vue/runtime-core" "3.0.5"
"@vue/shared" "3.0.5"
csstype "^2.6.8"
"@vue/shared@3.0.5":
version "3.0.5"
resolved "https://registry.npm.taobao.org/@vue/shared/download/@vue/shared-3.0.5.tgz?cache=0&sync_timestamp=1609359965878&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vue%2Fshared%2Fdownload%2F%40vue%2Fshared-3.0.5.tgz#c131d88bd6713cc4d93b3bb1372edb1983225ff0"
@ -2028,6 +2013,22 @@ boolbase@^1.0.0, boolbase@~1.0.0:
resolved "https://registry.npm.taobao.org/boolbase/download/boolbase-1.0.0.tgz#68dff5fbe60c51eb37725ea9e3ed310dcc1e776e"
integrity sha1-aN/1++YMUes3cl6p4+0xDcwed24=
bootstrap-vue@^2.21.2:
version "2.21.2"
resolved "https://registry.yarnpkg.com/bootstrap-vue/-/bootstrap-vue-2.21.2.tgz#ec38f66c3a2205becccddb6158a991d96509ed0b"
integrity sha512-0Exe+4MZysqhZNXIKf4TzkvXaupxh9EHsoCRez0o5Dc0J7rlafayOEwql63qXv74CgZO8E4U8ugRNJko1vMvNw==
dependencies:
"@nuxt/opencollective" "^0.3.2"
bootstrap ">=4.5.3 <5.0.0"
popper.js "^1.16.1"
portal-vue "^2.1.7"
vue-functional-data-merge "^3.1.0"
"bootstrap@>=4.5.3 <5.0.0":
version "4.5.3"
resolved "https://registry.yarnpkg.com/bootstrap/-/bootstrap-4.5.3.tgz#c6a72b355aaf323920be800246a6e4ef30997fe6"
integrity sha512-o9ppKQioXGqhw8Z7mah6KdTYpNQY//tipnkxppWhPbiSWdD+1raYsnhwEZjkTHYbGee4cVQ0Rx65EhOY/HNLcQ==
brace-expansion@^1.1.7:
version "1.1.11"
resolved "https://registry.npm.taobao.org/brace-expansion/download/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
@ -2642,6 +2643,11 @@ connect-history-api-fallback@^1.6.0:
resolved "https://registry.npm.taobao.org/connect-history-api-fallback/download/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc"
integrity sha1-izIIk1kwjRERFdgcrT/Oq4iPl7w=
consola@^2.15.0:
version "2.15.0"
resolved "https://registry.yarnpkg.com/consola/-/consola-2.15.0.tgz#40fc4eefa4d2f8ef2e2806147f056ea207fcc0e9"
integrity sha512-vlcSGgdYS26mPf7qNi+dCisbhiyDnrN1zaRbw3CSuc2wGOMEGGPsp46PdRG5gqXwgtJfjxDkxRNAgRPr1B77vQ==
console-browserify@^1.1.0:
version "1.2.0"
resolved "https://registry.npm.taobao.org/console-browserify/download/console-browserify-1.2.0.tgz#67063cef57ceb6cf4993a2ab3a55840ae8c49336"
@ -2983,11 +2989,6 @@ csso@^4.0.2:
dependencies:
css-tree "^1.1.2"
csstype@^2.6.8:
version "2.6.14"
resolved "https://registry.npm.taobao.org/csstype/download/csstype-2.6.14.tgz#004822a4050345b55ad4dcc00be1d9cf2f4296de"
integrity sha1-AEgipAUDRbVa1NzAC+HZzy9Clt4=
cyclist@^1.0.1:
version "1.0.1"
resolved "https://registry.npm.taobao.org/cyclist/download/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9"
@ -3000,6 +3001,11 @@ dashdash@^1.12.0:
dependencies:
assert-plus "^1.0.0"
de-indent@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
integrity sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=
debug@2.6.9, debug@^2.2.0, debug@^2.3.3:
version "2.6.9"
resolved "https://registry.npm.taobao.org/debug/download/debug-2.6.9.tgz?cache=0&sync_timestamp=1607566782124&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fdebug%2Fdownload%2Fdebug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
@ -4293,7 +4299,7 @@ hash.js@^1.0.0, hash.js@^1.0.3:
inherits "^2.0.3"
minimalistic-assert "^1.0.1"
he@1.2.x:
he@1.2.x, he@^1.1.0:
version "1.2.0"
resolved "https://registry.npm.taobao.org/he/download/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
integrity sha1-hK5l+n6vsWX922FWauFLrwVmTw8=
@ -5639,6 +5645,11 @@ no-case@^2.2.0:
dependencies:
lower-case "^1.1.1"
node-fetch@^2.6.1:
version "2.6.1"
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052"
integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw==
node-forge@^0.10.0:
version "0.10.0"
resolved "https://registry.npm.taobao.org/node-forge/download/node-forge-0.10.0.tgz?cache=0&sync_timestamp=1599010928186&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnode-forge%2Fdownload%2Fnode-forge-0.10.0.tgz#32dea2afb3e9926f02ee5ce8794902691a676bf3"
@ -6222,6 +6233,16 @@ pnp-webpack-plugin@^1.6.4:
dependencies:
ts-pnp "^1.1.6"
popper.js@^1.16.1:
version "1.16.1"
resolved "https://registry.yarnpkg.com/popper.js/-/popper.js-1.16.1.tgz#2a223cb3dc7b6213d740e40372be40de43e65b1b"
integrity sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==
portal-vue@^2.1.7:
version "2.1.7"
resolved "https://registry.yarnpkg.com/portal-vue/-/portal-vue-2.1.7.tgz#ea08069b25b640ca08a5b86f67c612f15f4e4ad4"
integrity sha512-+yCno2oB3xA7irTt0EU5Ezw22L2J51uKAacE/6hMPMoO/mx3h4rXFkkBkT4GFsMDv/vEe8TNKC3ujJJ0PTwb6g==
portfinder@^1.0.26:
version "1.0.28"
resolved "https://registry.npm.taobao.org/portfinder/download/portfinder-1.0.28.tgz#67c4622852bd5374dd1dd900f779f53462fac778"
@ -8203,6 +8224,11 @@ vue-eslint-parser@^7.3.0:
esquery "^1.0.1"
lodash "^4.17.15"
vue-functional-data-merge@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/vue-functional-data-merge/-/vue-functional-data-merge-3.1.0.tgz#08a7797583b7f35680587f8a1d51d729aa1dc657"
integrity sha512-leT4kdJVQyeZNY1kmnS1xiUlQ9z1B/kdBFCILIjYYQDqZgLqCLa0UhjSSeRX6c3mUe6U5qYeM8LrEqkHJ1B4LA==
vue-hot-reload-api@^2.3.0:
version "2.3.4"
resolved "https://registry.npm.taobao.org/vue-hot-reload-api/download/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2"
@ -8236,19 +8262,23 @@ vue-style-loader@^4.1.0, vue-style-loader@^4.1.2:
hash-sum "^1.0.2"
loader-utils "^1.0.2"
vue-template-compiler@^2.6.12:
version "2.6.12"
resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.12.tgz#947ed7196744c8a5285ebe1233fe960437fcc57e"
integrity sha512-OzzZ52zS41YUbkCBfdXShQTe69j1gQDZ9HIX8miuC9C3rBCk9wIRjLiZZLrmX9V+Ftq/YEyv1JaVr5Y/hNtByg==
dependencies:
de-indent "^1.0.2"
he "^1.1.0"
vue-template-es2015-compiler@^1.9.0:
version "1.9.1"
resolved "https://registry.npm.taobao.org/vue-template-es2015-compiler/download/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
integrity sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=
vue@^3.0.0:
version "3.0.5"
resolved "https://registry.npm.taobao.org/vue/download/vue-3.0.5.tgz?cache=0&sync_timestamp=1609359675074&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue%2Fdownload%2Fvue-3.0.5.tgz#de1b82eba24abfe71e0970fc9b8d4b2babdc3fe1"
integrity sha1-3huC66JKv+ceCXD8m41LK6vcP+E=
dependencies:
"@vue/compiler-dom" "3.0.5"
"@vue/runtime-dom" "3.0.5"
"@vue/shared" "3.0.5"
vue@^2.6.11:
version "2.6.12"
resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.12.tgz#f5ebd4fa6bd2869403e29a896aed4904456c9123"
integrity sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg==
watchpack-chokidar2@^2.0.1:
version "2.0.1"