Files
raven-client/ayanova/src/components/custom-fields-control.vue
2019-07-17 21:53:27 +00:00

80 lines
2.3 KiB
Vue

<template>
<div v-if="this.$store.state.formCustomTemplate[formKey]">
<span class="v-label v-label--active theme--light">
{{ this.$gzlocale.get("ObjectCustomFieldCustomGrid") }}
</span>
<div>
<h5>FORMKEY: {{ formKey }}</h5>
<h5>TEMPLATE: {{ this.$store.state.formCustomTemplate[formKey] }}</h5>
<h5>CUSTOM FIELD DATA:</h5>
<span class="caption">
{{ value }}
</span>
</div>
<hr />
<div>
<template v-for="item in this.$store.state.formCustomTemplate[formKey]">
<span :key="item.fld">
[{{ item.type }}]
</span>
</template>
</div>
</div>
</template>
<script>
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
/* Xeslint-disable */
////////////////////////////////////////////////////////////////////////////////////////////////////////////
/**
* v-if="item.hide == false"
*
* TODO: have the template, have the custom field data, now just need to show it all properly and update the fragment of json when changes made which then updates the
* parent object.
*
* 1) read the template
* 2) Generate the controls dynamically based on the template
* 3) bind to the data somehow (might have to warp the data to fit the controls in some cases due to changed template design)
* 4) Profit$
*
*/
export default {
data() {
return {
obj: { blah: "blah", rhubarb: "rhubarb" }
};
},
props: {
value: String,
formKey: String //used to grab template from store
},
watch: {
value(val) {
//this ensures the parent form gets the onchange event
//not actually sure why there are two here but it worked with the datetime picker so I replicated it here
this.$emit("input", val);
this.$emit("change", val);
}
},
methods: {},
beforeCreate() {
//check pre-requisites exist just in case
if (this.$gzdevmode()) {
if (!this.$_) {
throw "custom-fields-control: $_ (lodash) is required and missing";
}
if (!this.$gzlocale) {
throw "custom-fields-control: $gzlocale is required and missing";
}
}
},
created() {
if (this.$gzdevmode()) {
if (!this.formKey) {
throw "custom-fields-control: formKey property is required and missing";
}
}
}
};
</script>