commit
67ac56eeb5
@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=f3046ccee6deb672cb42",
|
"/js/vue/Authentication/app.js": "/js/vue/Authentication/app.js?id=a9b91ee3057962cbaa3b",
|
||||||
"/js/vue/Home/app.js": "/js/vue/Home/app.js?id=60c658b3e0d3bf77cf19",
|
"/js/vue/Home/app.js": "/js/vue/Home/app.js?id=5fc35fa922f55540736b",
|
||||||
"/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=d7b53e717be729233749",
|
"/js/vue/Modules/CRM/app.js": "/js/vue/Modules/CRM/app.js?id=636ba5f2c7316a1d9f37",
|
||||||
"/js/vue/Modules/Reservation/app.js": "/js/vue/Modules/Reservation/app.js?id=03c06477f0ef6f223599",
|
"/js/vue/Modules/Reservation/app.js": "/js/vue/Modules/Reservation/app.js?id=e1f69f3ef11f9a3008b2",
|
||||||
"/js/vue/User/app.js": "/js/vue/User/app.js?id=a0f854cd48d4c6d1e185"
|
"/js/vue/User/app.js": "/js/vue/User/app.js?id=425bb0a5b3b37feaf6a7"
|
||||||
}
|
}
|
||||||
|
@ -1,34 +1,159 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<element-factory v-for="(element, key) in elements" :element="element" :key="key"></element-factory>
|
<element-factory
|
||||||
</div>
|
v-for="(element, key) in elements"
|
||||||
|
:element="element"
|
||||||
|
:values="values"
|
||||||
|
:key="element.id"
|
||||||
|
></element-factory>
|
||||||
|
<button @click="register">click me</button>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import Factory from './FactoryPattern'
|
import Factory from "./FactoryPattern";
|
||||||
export default {
|
export default {
|
||||||
components:{
|
components: {
|
||||||
'element-factory' : Factory
|
"element-factory": Factory
|
||||||
|
},
|
||||||
|
data: () => ({
|
||||||
|
elements: [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
type: "wm-text_input",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "Hi",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "Hello",
|
||||||
|
color: "red"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
type: "wm-form",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "salam",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
type: "wm-number_input",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "salam",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
type: "wm-form",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "Form",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
type: "wm-switch",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "switch",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 6,
|
||||||
|
type: "wm-text_input",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "salam",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 7,
|
||||||
|
type: "wm-text_input",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "salam",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 8,
|
||||||
|
type: "wm-textarea",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "salam",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 9,
|
||||||
|
type: "wm-text_input",
|
||||||
|
width: "pa-2",
|
||||||
|
label: "salam",
|
||||||
|
placeholder: "placeholder",
|
||||||
|
hint: "hint",
|
||||||
|
color: "red"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// values: {},
|
||||||
|
values:{
|
||||||
|
'input_1': 'saeid',
|
||||||
|
'input_2': {
|
||||||
|
'input_3' : 5,
|
||||||
|
'input_4' : {
|
||||||
|
'input_5': 'true',
|
||||||
|
'input_6': 'khobi'
|
||||||
|
},
|
||||||
|
'input_7': 'na',
|
||||||
|
},
|
||||||
|
'input_8': 'shoma khobi \n man khobam',
|
||||||
|
'input_9': 'hossein',
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
props: {
|
||||||
|
// elements: {
|
||||||
|
// type: Array,
|
||||||
|
// required: true
|
||||||
|
// },
|
||||||
|
// values:{
|
||||||
|
// required: false
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
setDefaultValue(elements, values = {}) {
|
||||||
|
for (const key in elements) {
|
||||||
|
if (elements.hasOwnProperty(key)) {
|
||||||
|
if (elements[key].type == "wm-form") {
|
||||||
|
values["input_" + elements[key].id] = this.setDefaultValue(elements[key].children);
|
||||||
|
} else {
|
||||||
|
values["input_" + elements[key].id] = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return values;
|
||||||
|
},
|
||||||
|
register(){
|
||||||
|
console.log(this.values);
|
||||||
|
|
||||||
|
}
|
||||||
},
|
},
|
||||||
data: () => ({
|
created() {
|
||||||
elements:[
|
// this.values = this.setDefaultValue(this.elements);
|
||||||
{type:"wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red" },
|
},
|
||||||
{type: "wm-form", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red", children: [
|
// watch: {
|
||||||
{type:"wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red" },
|
// values() {
|
||||||
{type:"wm-form", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red", children: [
|
// if (!this.values || this.values.length == 0) {
|
||||||
{type: "wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red"},
|
// this.values = this.setDefaultValue(this.elements);
|
||||||
{type: "wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red"},
|
// }
|
||||||
]},
|
// }
|
||||||
{type:"wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red" },
|
// }
|
||||||
]},
|
};
|
||||||
{type:"wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red"},
|
|
||||||
{type:"wm-input", width: "pa-2", label:"salam", placeholder: "placeholder", hint:"hint", color:"red" },
|
|
||||||
]
|
|
||||||
}),
|
|
||||||
props:{
|
|
||||||
// elements: {
|
|
||||||
// type: Array,
|
|
||||||
// required: true
|
|
||||||
// }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
Loading…
Reference in new issue