Begins implementation of metadata sections store.

This commit is contained in:
mateuswetah 2022-03-22 15:00:41 -03:00
parent f11b1daf68
commit 91790e1fcb
9 changed files with 118 additions and 76 deletions

View File

@ -81,9 +81,7 @@
</span>
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details">
({{ metadatum.metadata_type_object.name }})
<!-- <em v-if="metadatum.collection_id != collectionId">{{ $i18n.get('label_inherited') }}</em> -->
class="label-details">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
@ -94,6 +92,8 @@
}">
*&nbsp;
</span>
({{ metadatum.metadata_type_object.name }})
<!-- <em v-if="metadatum.collection_id != collectionId">{{ $i18n.get('label_inherited') }}</em> -->
<em
v-if="metadatum.metadata_type_object.core &&
metadatum.metadata_type_object.related_mapped_prop == 'title'">

View File

@ -236,6 +236,7 @@ export const updateMetadatumTypes = ({commit}, metadatumTypes) => {
commit('setMetadatumTypes', metadatumTypes);
};
// METADATA MAPPERS
export const fetchMetadatumMappers = ({commit}) => {
return new Promise((resolve, reject) => {
axios.tainacan.get('/metadatum-mappers')
@ -271,4 +272,21 @@ export const updateMetadatumMappers = ({commit}, metadatumMappers) => {
commit('setMetadatumMappers', metadatumMappers);
};
// METADATA SECTIONS
export const fetchMetadataSections = ({commit}, collectionId) => {
return new Promise((resolve, reject) => {
axios.tainacan.get('/collection/' + collectionId + '/metadatasection')
.then((res) => {
let metadataSections = res.data;
commit('setMetadataSections', metadataSections);
resolve(metadataSections);
})
.catch((error) => {
reject(error);
});
});
}
export const cleanMetadataSections = ({commit}) => {
commit('cleanMetadataSections');
};

View File

@ -2,6 +2,10 @@ export const getMetadata = state => {
return state.metadata;
}
export const getMetadataSections = state => {
return state.metadataSections;
}
export const getMetadatumTypes = state => {
return state.metadatumTypes;
}

View File

@ -5,7 +5,8 @@ import * as mutations from './mutations';
const state = {
metadata: [],
metadatumTypes: [],
metadatumMappers: []
metadatumMappers: [],
metadataSections: []
};
export default {

View File

@ -89,4 +89,12 @@ export const setMetadatumMappers = (state, metadatumMappers) => {
export const cleanMetadata = (state) => {
state.metadata = [];
}
}
export const setMetadataSections = (state, metadataSections) => {
state.metadataSections = metadatumSections;
}
export const cleanMetadataSections = (state) => {
state.metadataSections = [];
}

View File

@ -14,7 +14,7 @@
<b-tabs
v-if="(isRepositoryLevel && $userCaps.hasCapability('tnc_rep_edit_metadata') || (!isRepositoryLevel && collection && collection.current_user_can_edit_metadata))"
v-model="activeTab">
<b-tab-item :label="$i18n.get('metadata')">
<b-tab-item :label="$i18n.get('label_metadata_and_sections')">
<div
:style="{ height: activeMetadatumList && activeMetadatumList.length <= 0 && !isLoadingMetadata ? 'auto' : 'calc(100vh - 6px - ' + columnsTopY + 'px)'}"
class="columns"
@ -24,7 +24,7 @@
<div class="column">
<div class="tainacan-form sub-header">
<h3>{{ $i18n.get('metadata') + ( activeMetadatumList && activeMetadatumList.length ? (' (' + activeMetadatumList.length + ')') : '' ) }}</h3>
<h3>{{ $i18n.get('metadata') }}<span class="has-text-gray">{{ ( activeMetadatumList && activeMetadatumList.length ? (' (' + activeMetadatumList.length + ')') : '' ) }}</span></h3>
<template v-if="activeMetadatumList && !isLoadingMetadata">
<b-field class="header-item">
@ -172,9 +172,7 @@
<span
v-if="metadatum.id != undefined && metadatum.metadata_type_object"
class="label-details"
:class="{ 'has-text-weight-bold': metadatum.metadata_type_object.core }">
({{ metadatum.metadata_type_object.name }})
<!-- <em v-if="metadatum.inherited">{{ $i18n.get('label_inherited') }}</em> -->
:class="{ 'has-text-weight-bold': metadatum.metadata_type_object.core }">
<span
v-if="metadatum.required === 'yes'"
v-tooltip="{
@ -185,6 +183,8 @@
}">
*&nbsp;
</span>
({{ metadatum.metadata_type_object.name }})
<!-- <em v-if="metadatum.inherited">{{ $i18n.get('label_inherited') }}</em> -->
<span
v-if="metadatum.status === 'private'"
class="icon"
@ -508,17 +508,20 @@ export default {
'updateMetadata',
'updateCollectionMetadataOrder',
'cleanMetadata',
'fetchMetadataSections',
'cleanMetadataSections'
]),
...mapGetters('metadata',[
'getMetadatumTypes',
'getMetadata',
'getMetadataSections'
]),
handleChange(event) {
if (event.added) {
if (event.added)
this.addNewMetadatum(event.added.element, event.added.newIndex);
} else if (event.removed) {
else if (event.removed)
this.removeMetadatum(event.removed.element);
} else if (event.moved) {
else if (event.moved) {
if (!this.isRepositoryLevel)
this.updateMetadataOrder();
}

View File

@ -135,7 +135,7 @@
--tainacan-secondary: var(--tainacan-blue5);
.metadata-type-preview {
background-color: var(--tainacan-blue1) !important;
// background-color: var(--tainacan-blue1) !important;
.metadata-type-label {
color: var(--tainacan-blue5) !important;
}

View File

@ -101,73 +101,80 @@
border-color: var(--tainacan-yellow1);
}
}
.metadata-type-preview {
background: var(--tainacan-primary);
padding: 0px 8px;
border-radius: 3px;
width: 200px;
min-height: 100px;
display: flex;
align-items: center;
justify-content: center;
pointer-events: none;
cursor: none;
flex-wrap: wrap;
font-size: 1.25em;
.metadata-type-label {
font-weight: 600;
color: var(--tainacan-turquoise4);
width: 100%;
font-size: 1em;
margin-bottom: 6px;
margin-left: -18px;
&.metadata-type-preview-tooltip {
.v-popper__inner {
background: var(--tainacan-gray0);
box-shadow: 0 0 8px -4px rgba(0, 0, 0, 0.3);
}
input, select, textarea,
.input, .tags, .tag {
.metadata-type-preview {
background: var(--tainacan-gray0);
padding: 0px 8px;
border-radius: 3px;
width: 230px;
min-height: 100px;
display: flex;
align-items: center;
justify-content: center;
pointer-events: none;
cursor: none;
background-color: rgba(255,255,255,0.60) !important;
}
.autocomplete>.control, .autocomplete>.control>input, .dropdown-content {
background-color: #f7fcfd !important;
}
.taginput {
margin-bottom: 100px;
}
input[type="checkbox"]:checked + .check {
background: rgba(255,255,255,0.60) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:rgb(69,70,71)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center !important
}
textarea {
min-height: 70px;
}
.field {
width: 100%;
.label {
color: var(--tainacan-info-color);
font-size: 0.875em;
line-height: 1.875em;
}
}
.add-new-term,
.collapse-all {
font-size: 0.75em;
text-decoration: underline;
margin: 0.875em 1.5em;
}
.selected-tags {
font-size: 0.75em;
}
.child-metadata-inputs {
margin-left: 5px;
padding-left: 16px;
padding-top: 2px;
border-left: 1px solid var(--tainacan-gray3);
flex-wrap: wrap;
font-size: 1.25em;
.is-last-input {
margin-top: -14px;
margin-bottom: 10px;
.metadata-type-label {
font-weight: 600;
color: var(--tainacan-turquoise4);
width: 100%;
font-size: 1em;
margin-bottom: 6px;
margin-left: -18px;
}
input, select, textarea,
.input, .tags, .tag {
pointer-events: none;
cursor: none;
background-color: rgba(255,255,255,0.60) !important;
}
.autocomplete>.control, .autocomplete>.control>input, .dropdown-content {
background-color: #f7fcfd !important;
}
.taginput {
margin-bottom: 100px;
}
input[type="checkbox"]:checked + .check {
background: rgba(255,255,255,0.60) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath style='fill:rgb(69,70,71)' d='M 0.04038059,0.6267767 0.14644661,0.52071068 0.42928932,0.80355339 0.3232233,0.90961941 z M 0.21715729,0.80355339 0.85355339,0.16715729 0.95961941,0.2732233 0.3232233,0.90961941 z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center !important
}
textarea {
min-height: 70px;
}
.field {
width: 100%;
.label {
color: var(--tainacan-info-color);
font-size: 0.875em;
line-height: 1.875em;
}
}
.add-new-term,
.collapse-all {
font-size: 0.75em;
text-decoration: underline;
margin: 0.875em 1.5em;
}
.selected-tags {
font-size: 0.75em;
}
.child-metadata-inputs {
margin-left: 5px;
padding-left: 16px;
padding-top: 2px;
border-left: 1px solid var(--tainacan-gray3);
.is-last-input {
margin-top: -14px;
margin-bottom: 10px;
}
}
}
}

View File

@ -621,6 +621,7 @@ return apply_filters( 'tainacan-i18n', [
'label_number_to_search_for' => __( 'Number to search for', 'tainacan' ),
'label_date_to_search_for' => __( 'Date to search for', 'tainacan' ),
'label_criterion_to_compare' => __( 'Criterion to compare', 'tainacan' ),
'label_metadata_and_sections' => __( 'Metadata and Sections', 'tainacan' ),
// Instructions. More complex sentences to guide user and placeholders
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),