Checks cardinality before displaying options to add new values on metadata inputs. #568

This commit is contained in:
mateuswetah 2021-08-26 12:08:57 -03:00
parent 1039a86d4f
commit 108a3d3baa
7 changed files with 33 additions and 11 deletions

View File

@ -194,7 +194,7 @@
</b-field>
<b-field
v-if="editForm.multiple == 'yes' && !originalMetadatum.metadata_type_object.core && editForm.parent == 0"
v-if="!originalMetadatum.metadata_type_object.core && editForm.parent == 0"
:type="formErrors['cardinality'] != undefined ? 'is-danger' : ''"
:message="formErrors['cardinality'] != undefined ? formErrors['cardinality'] : ''"
:addons="false">
@ -205,6 +205,7 @@
:message="$i18n.getHelperMessage('metadata', 'cardinality')"/>
</label>
<b-input
:disabled="editForm.multiple != 'yes'"
name="cardinality"
type="number"
step="1" />

View File

@ -10,7 +10,7 @@
@input="onInput"
@blur="onBlur"
:data="options"
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? null : 1)"
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : 1)"
autocomplete
:remove-on-keys="[]"
:dropdown-position="isLastMetadatum ? 'top' :'auto'"
@ -52,7 +52,7 @@
</template>
</b-taginput>
<a
v-if="currentUserCanEditItems && itemMetadatum.item && itemMetadatum.item.id"
v-if="currentUserCanEditItems && itemMetadatum.item && itemMetadatum.item.id && (maxMultipleValues === undefined || maxMultipleValues > selected.length)"
:disabled="!$route || $route.query.iframemode"
@click="createNewItemModal = !createNewItemModal"
class="add-link">
@ -105,7 +105,10 @@
computed: {
collection() {
return this.getCollection();
}
},
maxMultipleValues() {
return (this.itemMetadatum && this.itemMetadatum.metadatum && this.itemMetadatum.metadatum.cardinality && !isNaN(this.itemMetadatum.metadatum.cardinality)) ? this.itemMetadatum.metadatum.cardinality : undefined;
},
},
watch: {
createNewItemModal() {

View File

@ -83,7 +83,7 @@
</template>
</transition-group>
</template>
<template v-if="isMultiple">
<template v-if="isMultiple && (maxMultipleValues === undefined || maxMultipleValues - 1 > values.length)">
<a
@click="addValue"
class="is-inline-block add-link">
@ -144,6 +144,9 @@
isMultiple() {
return (this.itemMetadatum && this.itemMetadatum.metadatum && this.itemMetadatum.metadatum.multiple == 'yes') ? this.itemMetadatum.metadatum.multiple == 'yes' : false;
},
maxMultipleValues() {
return (this.itemMetadatum && this.itemMetadatum.metadatum && this.itemMetadatum.metadatum.cardinality && !isNaN(this.itemMetadatum.metadatum.cardinality)) ? this.itemMetadatum.metadatum.cardinality : undefined;
},
isTextInputComponent() {
const array = ['tainacan-relationship','tainacan-taxonomy', 'tainacan-compound', 'tainacan-user'];
return !(array.indexOf(this.metadatumComponent) >= 0 );

View File

@ -4,7 +4,7 @@
v-if="getComponent == 'tainacan-taxonomy-tag-input'"
:disabled="disabled"
:is="getComponent"
:maxtags="maxtags"
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : 1)"
v-model="valueComponent"
:allow-select-to-create="allowSelectToCreate"
:allow-new="allowNew"
@ -25,6 +25,7 @@
:taxonomy="taxonomy"
:collection-id="itemMetadatum.metadatum.collection_id"
:is-taxonomy="true"
:max-multiple-values="maxMultipleValues"
:metadatum="itemMetadatum.metadatum"
:amount-selected="Array.isArray(valueComponent) ? valueComponent.length : (valueComponent ? '1' : '0')"
:is-checkbox="getComponent == 'tainacan-taxonomy-checkbox'"
@ -106,7 +107,10 @@
return '';
},
displayCreateNewTerm() {
return this.allowNew;
return this.allowNew && (this.maxMultipleValues === undefined || this.maxMultipleValues > this.value.length);
},
maxMultipleValues() {
return (this.itemMetadatum && this.itemMetadatum.metadatum && this.itemMetadatum.metadatum.cardinality && !isNaN(this.itemMetadatum.metadatum.cardinality)) ? this.itemMetadatum.metadatum.cardinality : undefined;
}
},
watch: {

View File

@ -7,7 +7,6 @@
size="is-small"
icon="magnify"
:allow-new="false"
:maxtags="maxtags"
@add="emitAdd"
@remove="emitRemove"
v-model="selected"

View File

@ -66,7 +66,8 @@
<label
v-if="isCheckbox"
class="b-checkbox checkbox">
<input
<input
:disabled="(selected.indexOf((isNaN(Number(option.value)) ? option.value : Number(option.value))) < 0) && maxMultipleValues !== undefined && maxMultipleValues - 1 < selected.length"
v-model="selected"
:value="option.id ? (isNaN(Number(option.id)) ? option.id : Number(option.id)) : (isNaN(Number(option.value)) ? option.value : Number(option.value))"
type="checkbox">
@ -144,6 +145,7 @@
:key="key">
<label class="b-checkbox checkbox">
<input
:disabled="(selected.indexOf((isNaN(Number(option.value)) ? option.value : Number(option.value))) < 0) && maxMultipleValues !== undefined && maxMultipleValues - 1 < selected.length"
v-model="selected"
:value="option.value"
type="checkbox">
@ -198,6 +200,7 @@
v-if="isCheckbox"
class="b-checkbox checkbox">
<input
:disabled="(selected.indexOf((isNaN(Number(option.value)) ? option.value : Number(option.value))) < 0) && maxMultipleValues !== undefined && maxMultipleValues - 1 < selected.length"
v-model="selected"
:value="(isNaN(Number(option.value)) ? option.value : Number(option.value))"
type="checkbox">
@ -340,7 +343,8 @@
type: Boolean,
default: true,
},
amountSelected: 0
amountSelected: 0,
maxMultipleValues: undefined
},
data() {
return {

View File

@ -11,10 +11,18 @@
flex-shrink: 0;
border-radius: 2px;
display: inline-block;
border: 1px solid var(--tainacan-gray4);
transition: background 150ms ease-out;
border-style: solid;
border-width: 1px;
box-shadow: none !important;
}
input[type="checkbox"]:not([disabled=disabled]) + .check {
border-color: var(--tainacan-gray4);
}
input[type="checkbox"][disabled=disabled] + .check {
border-color: var(--tainacan-gray2);
cursor: not-allowed;
}
&:focus input[type="checkbox"] + .check,
&:active input[type="checkbox"] + .check,