ed.brz9.dev/proj/map/asset/js/edit.js

119 lines
2.4 KiB
JavaScript

Vue.component('NewIng',{
template : `
<div class="ingredient__form">
<input v-model="text">
</div>
`,
props : {
obj : Object
},
data () {
return {
name : "name",
fr : "fr",
en : "en",
it : "it",
}
},
methods : {
hello(){
return "hello"
},
}
})
let vm = new Vue({
el: '#root',
data : {
message: "Hello Vue",
editTabMarkerL: "0px",
editTabMarkerW: "0px",
editTabRollXOff: 0,
tabrollw: "300vw",
newIng: {
name: "",
fr: "",
en: "",
it: "",
}
},
methods: {
obj2php: function(obj, dest) {
data = JSON.stringify(obj)
r = new XMLHttpRequest
//r.open("POST", "asset/php/handler.php", true)
r.open("POST", "handler/" + dest, true)
r.setRequestHeader(
"Content-type",
"application/json")
r.send(data)
},
uploadIMG: function(){
let handler = "asset/php/uploader.php"
fetch(handler, {
method: "POST",
body: new FormData(document.getElementById("edit-upload-form"))
})
// .then((response) => response.json())
.then((responseData) => {
console.log(responseData)
console.log(responseData.message)
})
},
saveIng: function() {
if (this.newIng.name !== "") {
ingredients[this.newIng.name] = {
fr: this.newIng.fr,
en: this.newIng.en,
it: this.newIng.it,
}
}
this.obj2php(ingredients, "ing")
},
setEditTab: function(ind) {
let xoff = 0
switch(ind){
case 'ind':
xoff = 0;
break;
case 'resto':
xoff = 1;
break;
case 'upload':
xoff = 2;
break;
default:
xoff = 0;
break;
}
this.editTabRollXOff = xoff
m = document.getElementById("edit-tab-nav-" + ind)
this.editTabMarkerL = m.offsetLeft + "px"
this.editTabMarkerW = m.offsetWidth + "px"
}
},
computed: {
editTabRollTransX: function () {
return "translateX(-" + this.editTabRollXOff + "00vw)";
},
},
created: function(){
console.log("created start")
console.log("created end")
},
mounted: function() {
console.log("mounted start")
this.setEditTab('ing')
console.log("mounted end")
},
updated: function() {
console.log("updated start")
console.log("updated end")
}
})