Skip to content
Snippets Groups Projects

Sprint/201922

Merged Marcel Nellesen requested to merge Sprint/201922 into master
7 files
+ 592
140
Compare changes
  • Side-by-side
  • Inline

Files

+ 97
25
<template>
<div class="InputComboxbox">
<b-form-group
v-bind:class="{ mandatory: this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] !== undefined && formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] >= 1 }"
v-bind:class="{ mandatory: checkField(formFieldInformation,'http://www.w3.org/ns/shacl#minCount') && formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] >= 1 }"
:label-for="cssid"
label-cols-sm="3"
label-align-sm="right"
:label="label"
>
<b-row>
<b-col>
<multiselect
v-if="(this.formFieldInformation['http://www.w3.org/ns/shacl#maxCount'] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0] !== undefined && formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0]['value'] !== undefined && formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0]['value'] === 1)"
v-if="checkField(formFieldInformation,'http://www.w3.org/ns/shacl#maxCount') && formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0]['value'] === 1"
:id="cssid"
:options="selectableOptions"
v-model="selectedOptions"
@@ -16,11 +18,10 @@
:hide-selected="true"
label="name"
track-by="name"
:required="this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] !== undefined && formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] >= 1"
:disabled="this.formFieldInformation['https://purl.org/coscine/fixedValue'] !== undefined &&
this.formFieldInformation['https://purl.org/coscine/fixedValue'][0] !== undefined &&
this.formFieldInformation['https://purl.org/coscine/fixedValue'][0]['value'] !== undefined"
:required="checkField(formFieldInformation,'http://www.w3.org/ns/shacl#minCount') && formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] >= 1"
:disabled="disabledMode || locked"
@input="input"
@change="input"
></multiselect>
<multiselect
v-else
@@ -32,12 +33,19 @@
label="name"
track-by="name"
:max="this.formFieldInformation['http://www.w3.org/ns/shacl#maxCount'] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0] !== undefined && formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0]['value'] !== undefined ? parseInt(formFieldInformation['http://www.w3.org/ns/shacl#maxCount'][0]['value']) : maxNumberOfSelectedObjects"
:disabled="this.formFieldInformation['https://purl.org/coscine/fixedValue'] !== undefined &&
this.formFieldInformation['https://purl.org/coscine/fixedValue'][0] !== undefined &&
this.formFieldInformation['https://purl.org/coscine/fixedValue'][0]['value'] !== undefined"
:required="this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0] !== undefined && this.formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] !== undefined && formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] >= 1"
:disabled="disabledMode || locked"
:required="checkField(formFieldInformation,'http://www.w3.org/ns/shacl#minCount') && formFieldInformation['http://www.w3.org/ns/shacl#minCount'][0]['value'] >= 1"
@input="input"
@change="input"
></multiselect>
</b-col>
<b-col v-if="fixedValueMode" class="lock-colum col-sm-2">
<b-button :disabled="disabledMode || !checkField(formData,nodeName) || (checkField(formData,nodeName) && formData[nodeName][0]['value'] ==='')" class="lockButton" variant="outline-secondary" @click.prevent="changeLockable()">
<LockIcon v-if="locked"/>
<LockOpenIcon v-else />
</b-button>
</b-col>
</b-row>
</b-form-group>
</div>
</template>
@@ -45,6 +53,9 @@
<script lang="ts">
import Vue from 'vue';
import LockIcon from 'vue-material-design-icons/Lock.vue';
import LockOpenIcon from 'vue-material-design-icons/LockOpen.vue';
import Multiselect from 'vue-multiselect';
import 'vue-multiselect/dist/vue-multiselect.min.css';
@@ -63,26 +74,46 @@ export default Vue.extend({
);
this.nodeName = FieldReader.getNodeName(this.formFieldInformation);
this.cssId = this.nodeName.substr(this.nodeName.lastIndexOf('\/') + 1);
if (this.formData[this.nodeName] === undefined) {
this.$set(this.formData, this.nodeName, []);
if (this.cssId.indexOf('#') !== -1) {
this.cssId = this.cssId.substr(this.cssId.indexOf('#') + 1);
}
// if a fixed value was sent with the application profile take this
if (this.checkField(this.formFieldInformation,'https://purl.org/coscine/fixedValue')) {
this.$set(this.formData,this.nodeName, [{'value': this.formFieldInformation['https://purl.org/coscine/fixedValue'][0].value}]);
this.locked = true;
}
if (
this.formData[this.nodeName][0] === undefined ||
this.formData[this.nodeName][0].type === undefined ||
this.formData[this.nodeName][0].type === ''
) {
this.$set(this.formData[this.nodeName][0], 'type', 'uri');
// if a fixed values was given directly take that
if (this.checkField(this.fixedValues[this.formFieldInformation['idForFixedValues']],'https://purl.org/coscine/fixedValue')) {
this.$set(this.formData,this.nodeName, [{'value': this.fixedValues[this.formFieldInformation['idForFixedValues']]['https://purl.org/coscine/fixedValue'][0].value}]);
this.locked = true;
}
if (!this.checkField(this.formData,this.nodeName)){
// if formdata is still emty take the default value from the ap
if (this.checkField(this.formFieldInformation,'http://www.w3.org/ns/shacl#defaultValue')) {
this.$set(this.formData,this.nodeName, [{'value': this.formFieldInformation['http://www.w3.org/ns/shacl#defaultValue'][0].value}]);
}
// take the default value from the provided values
if (this.checkField(this.fixedValues[this.formFieldInformation['idForFixedValues']],'https://purl.org/coscine/defaultValue')) {
this.$set(this.formData,this.nodeName, [{'value': this.fixedValues[this.formFieldInformation['idForFixedValues']]['https://purl.org/coscine/defaultValue'][0].value}]);
}
}
if (this.formFieldInformation['https://purl.org/coscine/fixedValue'] !== undefined &&
this.formFieldInformation['https://purl.org/coscine/fixedValue'][0] !== undefined &&
this.formFieldInformation['https://purl.org/coscine/fixedValue'][0].value !== undefined) {
this.$set(this.formData[this.nodeName][0], 'value', this.formFieldInformation['https://purl.org/coscine/fixedValue'][0].value);
this.$set(this.formData[this.nodeName][0], 'type', 'uri');
// if formdata is still empty intialize it with an empty value
if (!this.checkField(this.formData,this.nodeName)){
this.$set(this.formData,this.nodeName, [{'value': ''}]);
}
// take whatever is defined in formdata now and try to get the content if we are not in fixed value mode
this.replacePlaceholder();
// set the datatype
this.$set(this.formData[this.nodeName][0],'type', 'uri');
this.updateFixedValues();
},
mounted() {
MetadataApi.getVocabulary(
this.resourceId,
this.projectId,
this.formFieldInformation['http://www.w3.org/ns/shacl#class'][0].value,
(response: any) => {
if (Array.isArray(response.data[this.languageCode]) && response.data[this.languageCode].length === 0) {
@@ -98,6 +129,7 @@ export default Vue.extend({
},
defaultOnCatch,
);
this.updateFixedValues();
},
data() {
return {
@@ -109,9 +141,12 @@ export default Vue.extend({
languageCode: LanguageUtil.getLanguage(),
listLanguageCode: LanguageUtil.getLanguage(),
maxNumberOfSelectedObjects: 10000,
locked: false,
};
},
methods: {
replacePlaceholder(){
},
input() {
const array = [];
if (Array.isArray(this.selectedOptions)) {
@@ -122,6 +157,7 @@ export default Vue.extend({
array.push({value: (this.selectedOptions as any).value , type: 'uri'});
}
this.$set(this.formData, this.nodeName, array);
this.updateFixedValues();
},
loadData() {
const selectedData = this.formData[this.nodeName];
@@ -134,14 +170,50 @@ export default Vue.extend({
}
}
},
checkField(data:any,nodename:string,property: string = 'value'){
return FieldReader.isValueAssignedToKey(data,nodename,property);
},
removeEmptyEntry(){
if ( (this.checkField(this.fixedValues[this.formFieldInformation['idForFixedValues']],'https://purl.org/coscine/fixedValue') && this.fixedValues[this.formFieldInformation['idForFixedValues']]['https://purl.org/coscine/fixedValue'][0]['value'] === '') ||
this.checkField(this.fixedValues[this.formFieldInformation['idForFixedValues']],'https://purl.org/coscine/defaultValue') && this.fixedValues[this.formFieldInformation['idForFixedValues']]['https://purl.org/coscine/defaultValue'][0]['value'] === '') {
this.$delete(this.fixedValues,this.formFieldInformation['idForFixedValues']);
this.locked = false;
}
},
updateFixedValues(){
if(this.fixedValues[this.formFieldInformation['idForFixedValues']] !== undefined && this.fixedValues[this.formFieldInformation['idForFixedValues']]['https://purl.org/coscine/fixedValue'] !== undefined){
this.$set(this.fixedValues,this.formFieldInformation['idForFixedValues'], {'https://purl.org/coscine/fixedValue': [{'value':this.formData[this.nodeName][0]['value'],'type': 'uri'}]});
this.locked = true;
} else {
this.$set(this.fixedValues,this.formFieldInformation['idForFixedValues'], {'https://purl.org/coscine/defaultValue': [{'value':this.formData[this.nodeName][0]['value'],'type': 'uri'}]});
this.locked = false;
}
this.removeEmptyEntry();
},
changeLockable() {
if(this.fixedValues[this.formFieldInformation['idForFixedValues']] === undefined || this.fixedValues[this.formFieldInformation['idForFixedValues']]['https://purl.org/coscine/fixedValue'] === undefined){
this.$set(this.fixedValues,this.formFieldInformation['idForFixedValues'], {'https://purl.org/coscine/fixedValue': [{'value':this.formData[this.nodeName][0]['value'],'type': 'uri'}]});
this.locked = true;
} else {
this.$set(this.fixedValues,this.formFieldInformation['idForFixedValues'], {'https://purl.org/coscine/defaultValue': [{'value':this.formData[this.nodeName][0]['value'],'type': 'uri'}]});
this.locked = false;
}
this.removeEmptyEntry();
},
},
props: {
formFieldInformation: Object,
formData: Object,
resourceId: String,
resourceId: String,
fixedValues: Object,
fixedValueMode: Boolean,
projectId: String,
disabledMode: Boolean,
},
components: {
Multiselect,
LockIcon,
LockOpenIcon,
},
});
</script>
Loading