admin/raven-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Browse Source
This commit is contained in:
John Cardinal
2019-12-05 21:11:39 +00:00
parent f85c14e8e1
commit cb691bda68
2 changed files with 111 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
ayanova/src/api/form-custom-template.js
View File

@@ -40,5 +40,25 @@ export default {
resolve();
}
});
},
getFieldTemplateValue(formKey, fieldKey) {
if (fieldKey === undefined) {
throw "ERROR form-custom-template::getFieldTemplateValue -> fieldKey not specified for template for form [" +
formKey +
"]";
}
var template = window.$gz.store.state.formCustomTemplate[formKey];
if (template === undefined) {
throw "ERROR form-custom-template::getFieldTemplateValue -> Store is missing form template for [" +
formKey +
"]";
}
//_https://lodash.com/docs#find
//Note that not every field being requested will exist so it's valid to return undefined
var templateItem = window.$gz._.find(template, ["fld", fieldKey]);
return templateItem;
}
};

196
ayanova/src/views/customize.vue
View File

@@ -12,7 +12,9 @@
READONLY: {{ formState.readOnly }}
<br />
</div> -->
<div>
{{ this.$store.state.formCustomTemplate[formCustomTemplateKey] }}
</div>
<v-row v-if="this.formState.ready">
<v-col>
<v-form ref="form">
@@ -31,15 +33,22 @@
>
</v-col>
<template
v-for="item in this.$store.state.formCustomTemplate[
formCustomTemplateKey
]"
>
<template v-for="item in formAvailableFields">
<v-col :key="item.fld" cols="12" sm="6" lg="4" xl="3" px-2>
<div>
{{ item }}
</div>
<v-card>
<v-card-title>
{{ lt(item.key) }}
</v-card-title>
<v-card-subtitle>
{{ item.key }}
</v-card-subtitle>
<v-checkbox
v-model="item.hideable"
:label="lt('FormFieldVisible')"
:ref="item.key"
:disabled="!canHide(item)"
></v-checkbox>
</v-card>
</v-col>
</template>
</v-row>
@@ -49,6 +58,7 @@
</v-container>
</template>
<script>
//LTDisplay [FieldKey] , Visible, Required, DataType (if custom)
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
/* Xeslint-disable */
////////////////////////////////////////////////////////////////////////////////////////////////////////////
@@ -86,6 +96,10 @@ export default {
created() {
// Fetch as needed
// this.getDataFromApi();
//NOTE: this would normally be in getDataFromAPI but this form doesn't really need that function so doing it here
//modify the menu as necessary
generateMenu(this, false); //default is never read only and passing in this vm
},
data() {
return {
@@ -151,54 +165,34 @@ export default {
lt: function(ltkey) {
return window.$gz.locale.get(ltkey);
},
getDataFromApi() {
this.formState.loading = true;
if (!this.formCustomTemplateKey) {
throw FORM_KEY + "::getDataFromApi -> Missing recordID!";
}
//http://localhost:7575/api/v8/FormCustom/AvailableFields/widget
var url = API_BASE_URL + "AvailableFields/" + this.formCustomTemplateKey;
var vm = this;
window.$gz.form.deleteAllErrorBoxErrors(this);
canHide: function(availableFieldItem) {
//Two things can prevent allowing hide, if the template says it's required and / or if the aviailable fields record
//hideable value is false
var templateSaysRequired = false;
var availableFieldsSayHideable = true;
window.$gz.api
.get(url)
.then(res => {
if (res.error != undefined) {
//Not found?
if (res.error.code == "2010") {
//notify not found error then navigate backwards
window.$gz.dialog
.displayLTErrorMessage("ErrorAPI2010")
.then(() => {
// navigate backwards
vm.$router.go(-1);
});
}
vm.formState.serverError = res.error;
window.$gz.form.setErrorBoxErrors(vm);
} else {
vm.obj = res.data;
//Update the form status
window.$gz.form.setFormState({
vm: vm,
dirty: false,
valid: true,
loading: false,
readOnly: res.readOnly ? true : false
});
//modify the menu as necessary
generateMenu(vm, res.readOnly);
}
})
.catch(function handleGetDataFromAPIError(error) {
//Update the form status
window.$gz.form.setFormState({
vm: vm,
loading: false
});
window.$gz.errorHandler.handleFormError(error, vm);
});
//first check template
var templateItem = window.$gz.formCustomTemplate.getFieldTemplateValue(
this.formCustomTemplateKey,
availableFieldItem.key
);
if (
templateItem &&
templateItem.required !== undefined &&
templateItem.required === "true" //it's text
) {
templateSaysRequired = true;
}
//Now check availableFields collection
if (availableFieldItem.hideable != true) {
availableFieldsSayHideable = false;
}
return (
templateSaysRequired === false && availableFieldsSayHideable === true
);
}
}
};
@@ -245,20 +239,12 @@ function generateMenu(vm) {
// }
function initForm(vm) {
//for now just stub this out, may need to hit another route or something in init later so keep for now
//this is a ten second delay return just to confirm it's really acting like it should
// return new Promise(function(resolve) {
// setTimeout(resolve, 10000);
// });
//for now just return the resolved promise
// return Promise.resolve(null);
return getAvailableFields(vm);
return ensureTemplateIsInStore(vm).then(getAvailableFields(vm));
//return getAvailableFields(vm).then(ensureTemplateIsInStore(vm));
}
////////////////////
//
function getAvailableFields(vm) {
//http://localhost:7575/api/v8/FormCustom/AvailableFields/widget
@@ -272,6 +258,14 @@ function getAvailableFields(vm) {
});
}
////////////////////
//
function ensureTemplateIsInStore(vm) {
return window.$gz.formCustomTemplate.get(
vm.$route.params.formCustomTemplateKey
);
}
/*
OLD (not used, drop)
"ObjectCustomFieldCustomGrid": "Custom Fields",
@@ -311,50 +305,42 @@ LTDisplay [FieldKey] , Visible, Required, DataType (if custom)
Iterate and display in series of boxes (small factor UI)
OnSave sends to server and roundtrips back to refresh local cached copy
Example form available fields
{"data":[
{"key":"WidgetName","propertyName":"Name","hideable":false,"sharedLTKey":false,"custom":false},
{"key":"WidgetSerial","propertyName":"Serial","hideable":true,"sharedLTKey":false,"custom":false},
{"key":"WidgetDollarAmount","propertyName":"DollarAmount","hideable":true,"sharedLTKey":false,"custom":false},
{"key":"WidgetCount","propertyName":"Count","hideable":true,"sharedLTKey":false,"custom":false},
{"key":"WidgetRoles","propertyName":"Roles","hideable":true,"sharedLTKey":false,"custom":false},
{"key":"WidgetStartDate","propertyName":"StartDate","hideable":false,"sharedLTKey":false,"custom":false},
{"key":"WidgetEndDate","propertyName":"EndDate","hideable":false,"sharedLTKey":false,"custom":false},
{"key":"WidgetNotes","propertyName":"Notes","hideable":true,"sharedLTKey":false,"custom":false},
{"key":"Active","propertyName":"Active","hideable":true,"sharedLTKey":true,"custom":false},
{"key":"Tags","propertyName":"Tags","hideable":true,"sharedLTKey":true,"custom":false},
{"key":"WidgetCustom1","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom2","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom3","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom4","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom5","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom6","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom7","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom8","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom9","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom10","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom11","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom12","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom13","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom14","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom15","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true},
{"key":"WidgetCustom16","propertyName":null,"hideable":true,"sharedLTKey":false,"custom":true}],"readOnly":true}
<template>
<div v-if="this.$store.state.formCustomTemplate[formCustomTemplateKey]">
<span class="v-label v-label--active theme--light">
{{ lt("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>
<v-row align-center justify-left row wrap>
<template
v-for="item in this.$store.state.formCustomTemplate[
formCustomTemplateKey
]"
>
<v-col :key="item.fld" cols="12" sm="6" lg="4" xl="3" px-2>
<div>
{{ item }}
</div>
</v-col>
</template>
</v-row>
</div>
</div>
</template>
<!-- Here is what a template object looks like
Example form custom template
"template":"[
{\"fld\":\"WidgetNotes\",\"required\":\"true\"},{\"fld\":\"WidgetCustom1\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"datetime\"},
{\"fld\":\"WidgetCustom2\",\"hide\":\"false\",\"required\":\"true\",\"type\":\"text\"},{\"fld\":\"WidgetCustom3\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"number\"},
{\"fld\":\"WidgetCustom4\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"bool\"},{\"fld\":\"WidgetCustom5\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"currency\"},
{\"fld\":\"WidgetCustom6\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"date\"},{\"fld\":\"WidgetCustom7\",\"hide\":\"false\",\"required\":\"false\",\"type\":\"time\"}]"
Note that it mixes in regular stock form fields that the end user has set to required as well as the custom ones, we identify custom by the presence of the "type" property
-->
*/
</script>