The htmlContainer is a form field control that can be used for setting up custom Vue component as a template for the control.
The "Template" attribute is required in order to have the htmlContainer use it for displaying the Vue template.
eg. "contact-template".
Vue Components(Templates) can be defined externally from the ClientLogic repository and can be used to build custom VueComponents that can be used as Template attribute values.
<template> <div > <header> <a @click="callAkiomaCode('$ akioma.osiv.stamm.OpenVersicherter(eventSource); ')"><h3>{{fullName}}</h3></a> </header> </div> </template> <script> import mixinAkioma from '@/mixins/mixinGlobalAkioma'; export default { mixins: [ mixinAkioma ], props: { dataSource:{ type: Object }, datasourceNamespace: { type: Object }, currentRecord: { type: Object }, controller: { type:Object } }, mounted() { console.log(this.$props); }, computed: { fullName(){ if(this.currentRecord.stamm_nr_nachname || this.currentRecord.vorname) return `${this.currentRecord.stamm_nr_nachname} ${this.currentRecord.vorname}`; else return ''; } } } </script> |
Vue components will be exported inside the custom index.js file:
export { default as ContactTemplate } from './ContactTemplate'; |
Build script that can be used from custom ClientLogic repository to rebuild the Template files:
npm run build:templates |