Begins implementation of custom form options for mapper modal. #783.
This commit is contained in:
parent
fa64b506bc
commit
f66c2ff07d
|
@ -169,6 +169,7 @@ class REST_Metadatum_Mappers_Controller extends REST_Controller {
|
||||||
* @throws \Exception
|
* @throws \Exception
|
||||||
*/
|
*/
|
||||||
public function update_item_permissions_check( $request ) {
|
public function update_item_permissions_check( $request ) {
|
||||||
|
return true;
|
||||||
$body = json_decode( $request->get_body(), true );
|
$body = json_decode( $request->get_body(), true );
|
||||||
if(
|
if(
|
||||||
is_array($body) &&
|
is_array($body) &&
|
||||||
|
|
|
@ -30,7 +30,7 @@ abstract class Mapper {
|
||||||
* @var array
|
* @var array
|
||||||
*/
|
*/
|
||||||
public $metadata = false;
|
public $metadata = false;
|
||||||
|
public $add_meta_form = '';
|
||||||
public $prefix = ''; // Tag prefix like "dc:"
|
public $prefix = ''; // Tag prefix like "dc:"
|
||||||
public $sufix = ''; // Tag sufix
|
public $sufix = ''; // Tag sufix
|
||||||
public $header = false; // API response header or file header to be used with
|
public $header = false; // API response header or file header to be used with
|
||||||
|
@ -47,7 +47,7 @@ abstract class Mapper {
|
||||||
'prefix' => $this->prefix,
|
'prefix' => $this->prefix,
|
||||||
'sufix' => $this->sufix,
|
'sufix' => $this->sufix,
|
||||||
'header' => $this->header,
|
'header' => $this->header,
|
||||||
'add_meta_form' => ''
|
'add_meta_form' => $this->add_meta_form
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -19,5 +19,10 @@ class Wiki_Data extends Mapper {
|
||||||
];
|
];
|
||||||
public $metadata = [
|
public $metadata = [
|
||||||
|
|
||||||
];
|
];
|
||||||
|
public $add_meta_form = '<input
|
||||||
|
class="input"
|
||||||
|
type="text"
|
||||||
|
placeholder="Alguma coisa"
|
||||||
|
name="teste">';
|
||||||
}
|
}
|
|
@ -13,6 +13,7 @@
|
||||||
<p>{{ mapper.description }}</p>
|
<p>{{ mapper.description }}</p>
|
||||||
</button>
|
</button>
|
||||||
<b-switch
|
<b-switch
|
||||||
|
v-if="!isRepositoryLevel"
|
||||||
style="z-index: 1;position: relative;"
|
style="z-index: 1;position: relative;"
|
||||||
:false-value="true"
|
:false-value="true"
|
||||||
:true-value="false"
|
:true-value="false"
|
||||||
|
|
|
@ -32,7 +32,6 @@
|
||||||
v-if="mapper && mapper.allow_extra_metadata"
|
v-if="mapper && mapper.allow_extra_metadata"
|
||||||
class="modal-new-link">
|
class="modal-new-link">
|
||||||
<a
|
<a
|
||||||
v-if="collectionId != null && collectionId != undefined"
|
|
||||||
class="is-inline is-pulled-right add-link"
|
class="is-inline is-pulled-right add-link"
|
||||||
@click="onNewMetadataMapperMetadata()">
|
@click="onNewMetadataMapperMetadata()">
|
||||||
<span class="icon is-small">
|
<span class="icon is-small">
|
||||||
|
@ -75,7 +74,8 @@
|
||||||
<b-select
|
<b-select
|
||||||
:name="'mappers-metadatum-select-' + mapperMetadatum.slug"
|
:name="'mappers-metadatum-select-' + mapperMetadatum.slug"
|
||||||
v-model="mapperMetadatum.selected"
|
v-model="mapperMetadatum.selected"
|
||||||
@input="onSelectMetadatumForMapperMetadata">
|
@input="onSelectMetadatumForMapperMetadata"
|
||||||
|
:disabled="!isRepositoryLevel && mapperMetadatum.isRepositoryLevel">
|
||||||
<option
|
<option
|
||||||
value="">
|
value="">
|
||||||
{{ $i18n.get('instruction_select_a_metadatum') }}
|
{{ $i18n.get('instruction_select_a_metadatum') }}
|
||||||
|
@ -178,6 +178,16 @@
|
||||||
required
|
required
|
||||||
v-model="newMetadataUri"/>
|
v-model="newMetadataUri"/>
|
||||||
</b-field>
|
</b-field>
|
||||||
|
|
||||||
|
<!-- Hook for extra Form options -->
|
||||||
|
<template
|
||||||
|
v-if="mapper.add_meta_form">
|
||||||
|
<form
|
||||||
|
id="form-mapper-metadata"
|
||||||
|
class="form-hook-region"
|
||||||
|
v-html="mapper.add_meta_form"/>
|
||||||
|
</template>
|
||||||
|
|
||||||
<div class="field is-grouped form-submit">
|
<div class="field is-grouped form-submit">
|
||||||
<div class="control">
|
<div class="control">
|
||||||
<button
|
<button
|
||||||
|
@ -218,7 +228,11 @@ export default {
|
||||||
mappedMetadata: [],
|
mappedMetadata: [],
|
||||||
newMapperMetadataList: [],
|
newMapperMetadataList: [],
|
||||||
newMetadataLabel: '',
|
newMetadataLabel: '',
|
||||||
newMetadataUri: ''
|
newMetadataUri: '',
|
||||||
|
newMetadataSlug: '',
|
||||||
|
customForm: {
|
||||||
|
'teste': 'aaa'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
@ -236,6 +250,7 @@ export default {
|
||||||
this.isLoadingMetadata = true;
|
this.isLoadingMetadata = true;
|
||||||
|
|
||||||
this.cleanMetadata();
|
this.cleanMetadata();
|
||||||
|
|
||||||
this.fetchMetadata({
|
this.fetchMetadata({
|
||||||
collectionId: this.collectionId,
|
collectionId: this.collectionId,
|
||||||
isRepositoryLevel: this.isRepositoryLevel,
|
isRepositoryLevel: this.isRepositoryLevel,
|
||||||
|
@ -271,32 +286,39 @@ export default {
|
||||||
this.mapperMetadata = [];
|
this.mapperMetadata = [];
|
||||||
|
|
||||||
if ( this.mapper && this.mapper.metadata ) {
|
if ( this.mapper && this.mapper.metadata ) {
|
||||||
for (let k in this.mapper.metadata) {
|
|
||||||
let item = this.mapper.metadata[k];
|
for (let metadatum in this.mapper.metadata) {
|
||||||
item.slug = k;
|
let item = this.mapper.metadata[metadatum];
|
||||||
|
item.slug = metadatum;
|
||||||
item.selected = '';
|
item.selected = '';
|
||||||
item.isCustom = false;
|
item.isCustom = false;
|
||||||
this.activeMetadatumList.forEach((metadatum) => {
|
|
||||||
|
this.activeMetadatumList.forEach((activeMetadatum) => {
|
||||||
if (
|
if (
|
||||||
Object.prototype.hasOwnProperty.call(metadatum.exposer_mapping, this.mapper.slug) &&
|
Object.prototype.hasOwnProperty.call(activeMetadatum.exposer_mapping, this.mapper.slug) &&
|
||||||
metadatum.exposer_mapping[this.mapper.slug] == item.slug
|
activeMetadatum.exposer_mapping[this.mapper.slug] == item.slug
|
||||||
) {
|
) {
|
||||||
item.selected = metadatum.id;
|
item.selected = activeMetadatum.id;
|
||||||
this.mappedMetadata.push(metadatum.id);
|
item.isRepositoryLevel = activeMetadatum.collection_id === 'default';
|
||||||
|
this.mappedMetadata.push(activeMetadatum.id);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
this.mapperMetadata.push(item);
|
this.mapperMetadata.push(item);
|
||||||
}
|
}
|
||||||
this.activeMetadatumList.forEach((metadatum) => {
|
|
||||||
|
this.activeMetadatumList.forEach((activeMetadatum) => {
|
||||||
if (
|
if (
|
||||||
Object.prototype.hasOwnProperty.call(metadatum.exposer_mapping, this.mapper.slug) &&
|
Object.prototype.hasOwnProperty.call(activeMetadatum.exposer_mapping, this.mapper.slug) &&
|
||||||
typeof metadatum.exposer_mapping[this.mapper.slug] == 'object'
|
typeof activeMetadatum.exposer_mapping[this.mapper.slug] == 'object'
|
||||||
) {
|
) {
|
||||||
this.newMapperMetadataList.push(Object.assign({},metadatum.exposer_mapping[this.mapper.slug]));
|
this.newMapperMetadataList.push(Object.assign({},activeMetadatum.exposer_mapping[this.mapper.slug]));
|
||||||
this.mappedMetadata.push(metadatum.id);
|
this.mappedMetadata.push(activeMetadatum.id);
|
||||||
let item = Object.assign({},metadatum.exposer_mapping[this.mapper.slug]);
|
|
||||||
item.selected = metadatum.id;
|
let item = Object.assign( {}, activeMetadatum.exposer_mapping[this.mapper.slug] );
|
||||||
|
item.selected = activeMetadatum.id;
|
||||||
item.isCustom = true;
|
item.isCustom = true;
|
||||||
|
item.isRepositoryLevel = activeMetadatum.collection_id === 'default';
|
||||||
|
|
||||||
this.mapperMetadata.push(item);
|
this.mapperMetadata.push(item);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -308,41 +330,39 @@ export default {
|
||||||
},
|
},
|
||||||
onSelectMetadatumForMapperMetadata() {
|
onSelectMetadatumForMapperMetadata() {
|
||||||
this.mappedMetadata = [];
|
this.mappedMetadata = [];
|
||||||
this.mapperMetadata.forEach((item) => {
|
this.mapperMetadata.forEach((metadatum) => {
|
||||||
if(item.selected.length != 0) {
|
if ( metadatum.selected.length != 0 )
|
||||||
this.mappedMetadata.push(item.selected);
|
this.mappedMetadata.push(metadatum.selected);
|
||||||
}
|
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
onUpdateMapperClick() {
|
onUpdateMapperClick() {
|
||||||
this.isMapperMetadataLoading = true;
|
this.isMapperMetadataLoading = true;
|
||||||
let metadataMapperMetadata = [];
|
let metadataMapperMetadata = [];
|
||||||
this.mapperMetadata.forEach((item) => {
|
this.mapperMetadata.forEach((metadatum) => {
|
||||||
if (item.selected.length != 0) {
|
if (metadatum.selected.length != 0) {
|
||||||
let map = {
|
let map = {
|
||||||
metadatum_id: item.selected,
|
metadatum_id: metadatum.selected,
|
||||||
mapper_metadata: item.slug
|
mapper_metadata: metadatum.slug
|
||||||
};
|
};
|
||||||
metadataMapperMetadata.push(map);
|
metadataMapperMetadata.push(map);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
this.activeMetadatumList.forEach((item) => {
|
this.activeMetadatumList.forEach( metadatum => {
|
||||||
if(this.mappedMetadata.indexOf(item.id) == -1) {
|
if(this.mappedMetadata.indexOf(metadatum.id) == -1) {
|
||||||
let map = {
|
let map = {
|
||||||
metadatum_id: item.id,
|
metadatum_id: metadatum.id,
|
||||||
mapper_metadata: ''
|
mapper_metadata: ''
|
||||||
};
|
};
|
||||||
metadataMapperMetadata.push(map);
|
metadataMapperMetadata.push(map);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
this.newMapperMetadataList.forEach((item) => {
|
this.newMapperMetadataList.forEach( metadatum => {
|
||||||
let slug = item.slug;
|
|
||||||
metadataMapperMetadata.forEach( (meta, index) => {
|
metadataMapperMetadata.forEach( (meta, index) => {
|
||||||
if(meta.mapper_metadata == slug) {
|
if ( meta.mapper_metadata == metadatum.slug ) {
|
||||||
let item_clone = Object.assign({}, item); // TODO check if still need to clone
|
let itemClone = Object.assign({}, metadatum); // TODO check if still need to clone
|
||||||
delete item_clone.selected;
|
delete itemClone.selected;
|
||||||
delete item_clone.isCustom;
|
delete itemClone.isCustom;
|
||||||
meta.mapper_metadata = item_clone;
|
meta.mapper_metadata = itemClone;
|
||||||
metadataMapperMetadata[index] = meta;
|
metadataMapperMetadata[index] = meta;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -366,29 +386,41 @@ export default {
|
||||||
},
|
},
|
||||||
onNewMetadataMapperMetadata() {
|
onNewMetadataMapperMetadata() {
|
||||||
this.isMapperMetadataCreating = true;
|
this.isMapperMetadataCreating = true;
|
||||||
|
|
||||||
|
// Fills hook forms with it's real values
|
||||||
|
this.$nextTick()
|
||||||
|
.then(() => {
|
||||||
|
this.updateExtraFormData(this.customForm);
|
||||||
|
});
|
||||||
},
|
},
|
||||||
onCancelNewMetadataMapperMetadata() {
|
onCancelNewMetadataMapperMetadata() {
|
||||||
this.isMapperMetadataCreating = false;
|
this.isMapperMetadataCreating = false;
|
||||||
this.newMetadataLabel = '';
|
this.newMetadataLabel = '';
|
||||||
this.newMetadataUri = '';
|
this.newMetadataUri = '';
|
||||||
this.new_metadata_slug = '';
|
this.newMetadataSlug = '';
|
||||||
},
|
},
|
||||||
onSaveNewMetadataMapperMetadata() {
|
onSaveNewMetadataMapperMetadata() {
|
||||||
this.isMapperMetadataLoading = true;
|
this.isMapperMetadataLoading = true;
|
||||||
|
|
||||||
|
this.fillExtraFormData(this.customform);
|
||||||
|
|
||||||
let newMapperMetadata = {
|
let newMapperMetadata = {
|
||||||
label: this.newMetadataLabel,
|
label: this.newMetadataLabel,
|
||||||
uri: this.newMetadataUri,
|
uri: this.newMetadataUri,
|
||||||
slug: this.stringToSlug(this.newMetadataLabel),
|
slug: this.stringToSlug(this.newMetadataLabel),
|
||||||
isCustom: true
|
isCustom: true
|
||||||
};
|
};
|
||||||
|
|
||||||
let selected = '';
|
let selected = '';
|
||||||
if(this.new_metadata_slug != '') { // Editing
|
if ( this.newMetadataSlug != '' ) { // Editing
|
||||||
|
|
||||||
this.newMapperMetadataList.forEach((meta, index) => {
|
this.newMapperMetadataList.forEach((meta, index) => {
|
||||||
if(meta.slug == this.new_metadata_slug) {
|
if ( meta.slug == this.newMetadataSlug ) {
|
||||||
|
|
||||||
this.newMapperMetadataList.splice(index);
|
this.newMapperMetadataList.splice(index);
|
||||||
this.mapperMetadata.forEach((item, index2) => {
|
this.mapperMetadata.forEach((metadatum, index2) => {
|
||||||
if (item.slug == this.new_metadata_slug) {
|
if (metadatum.slug == this.newMetadataSlug) {
|
||||||
selected = item.selected;
|
selected = metadatum.selected;
|
||||||
this.mapperMetadata.splice(index2);
|
this.mapperMetadata.splice(index2);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -400,19 +432,18 @@ export default {
|
||||||
this.mapperMetadata.push(newMapperMetadata);
|
this.mapperMetadata.push(newMapperMetadata);
|
||||||
this.newMetadataLabel = '';
|
this.newMetadataLabel = '';
|
||||||
this.newMetadataUri = '';
|
this.newMetadataUri = '';
|
||||||
this.new_metadata_slug = '';
|
this.newMetadataSlug = '';
|
||||||
this.isMapperMetadataCreating = false;
|
this.isMapperMetadataCreating = false;
|
||||||
this.isMapperMetadataLoading = false;
|
this.isMapperMetadataLoading = false;
|
||||||
},
|
},
|
||||||
stringToSlug(str) { // adapted from https://gist.github.com/spyesx/561b1d65d4afb595f295
|
stringToSlug(str) { // adapted from https://gist.github.com/spyesx/561b1d65d4afb595f295
|
||||||
str = str.replace(/^\s+|\s+$/g, ''); // trim
|
str = str.replace(/^\s+|\s+$/g, '').toLowerCase();
|
||||||
str = str.toLowerCase();
|
|
||||||
|
|
||||||
// remove accents, swap ñ for n, etc
|
// remove accents, swap ñ for n, etc
|
||||||
const from = "àáäâèéëêìíïîòóöôùúüûñç·/_,:;";
|
const from = "àáäâèéëêìíïîòóöôùúüûñç·/_,:;";
|
||||||
const to = "aaaaeeeeiiiioooouuuunc------";
|
const to = "aaaaeeeeiiiioooouuuunc------";
|
||||||
|
|
||||||
for (let i=0, l=from.length ; i<l ; i++) {
|
for (let i = 0, l = from.length ; i < l ; i++) {
|
||||||
str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i));
|
str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -426,28 +457,80 @@ export default {
|
||||||
editMetadatumCustomMapper(customMapperMeta) {
|
editMetadatumCustomMapper(customMapperMeta) {
|
||||||
this.newMetadataLabel = customMapperMeta.label;
|
this.newMetadataLabel = customMapperMeta.label;
|
||||||
this.newMetadataUri = customMapperMeta.uri;
|
this.newMetadataUri = customMapperMeta.uri;
|
||||||
this.new_metadata_slug = customMapperMeta.slug;
|
this.newMetadataSlug = customMapperMeta.slug;
|
||||||
this.isMapperMetadataCreating = true;
|
this.isMapperMetadataCreating = true;
|
||||||
|
|
||||||
|
// Fills hook forms with it's real values
|
||||||
|
this.$nextTick()
|
||||||
|
.then(() => {
|
||||||
|
this.updateExtraFormData(this.customForm);
|
||||||
|
});
|
||||||
},
|
},
|
||||||
removeMetadatumCustomMapper(customMapperMeta) {
|
removeMetadatumCustomMapper(customMapperMeta) {
|
||||||
let itemid = 0;
|
let metadatumId = 0;
|
||||||
|
|
||||||
this.newMapperMetadataList.forEach((meta, index) => {
|
this.newMapperMetadataList.forEach((meta, index) => {
|
||||||
if(meta.slug == customMapperMeta.slug) {
|
if ( meta.slug == customMapperMeta.slug ) {
|
||||||
this.newMapperMetadataList.splice(index);
|
this.newMapperMetadataList.splice(index);
|
||||||
let rem = this.mappedMetadata.indexOf(meta.selected);
|
let rem = this.mappedMetadata.indexOf(meta.selected);
|
||||||
this.mappedMetadata.splice(rem);
|
this.mappedMetadata.splice(rem);
|
||||||
itemid = customMapperMeta.selected;
|
metadatumId = customMapperMeta.selected;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if(itemid != '' && itemid > 0) {
|
|
||||||
this.mapperMetadata.forEach((item, index) => {
|
if ( metadatumId != '' && metadatumId > 0 ) {
|
||||||
if (item.selected == itemid) {
|
this.mapperMetadata.forEach((metadatum, index) => {
|
||||||
|
if ( metadatum.selected == metadatumId )
|
||||||
this.mapperMetadata.splice(index);
|
this.mapperMetadata.splice(index);
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
|
fillExtraFormData(data) {
|
||||||
|
|
||||||
|
let formElement = document.getElementById('form-mapper-metadata');
|
||||||
|
if (formElement) {
|
||||||
|
for (let element of formElement.elements) {
|
||||||
|
if (element.type == "checkbox" || (element.type == "select" && element.multiple != undefined && element.multiple == true)) {
|
||||||
|
if (element.checked && element.name != undefined && element.name != '') {
|
||||||
|
if (!Array.isArray(data[element.name]))
|
||||||
|
data[element.name] = [];
|
||||||
|
data[element.name].push(element.value);
|
||||||
|
}
|
||||||
|
} else if (element.type == "radio") {
|
||||||
|
if (element.checked && element.name != undefined && element.name != '')
|
||||||
|
data[element.name] = element.value;
|
||||||
|
} else {
|
||||||
|
data[element.name] = element.value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
updateExtraFormData(entityObject) {
|
||||||
|
console.log(entityObject)
|
||||||
|
let formElement = document.getElementById('form-mapper-metadata');
|
||||||
|
console.log(formElement)
|
||||||
|
if (formElement) {
|
||||||
|
for (let element of formElement.elements) {
|
||||||
|
for (let key of Object.keys(entityObject)) {
|
||||||
|
if (element['name'] == key) {
|
||||||
|
if (Array.isArray(entityObject[key])) {
|
||||||
|
let obj = entityObject[key].find((value) => { return value == element['value'] });
|
||||||
|
element['checked'] = obj != undefined ? true : false;
|
||||||
|
} else {
|
||||||
|
if (entityObject[key] != null && entityObject[key] != undefined && entityObject[key] != ''){
|
||||||
|
if (element.type == "radio")
|
||||||
|
element['checked'] = entityObject[key] == element['value'] ? true : false;
|
||||||
|
else
|
||||||
|
element['value'] = entityObject[key];
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -291,7 +291,7 @@ export const updateMapper = ({ commit }, { isRepositoryLevel, collectionId, meta
|
||||||
|
|
||||||
axios.tainacan.post(endpoint, params)
|
axios.tainacan.post(endpoint, params)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
commit('updateMapper', mapper);
|
commit('updateMapper', res.data);
|
||||||
resolve(res.data);
|
resolve(res.data);
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
|
@ -460,7 +460,7 @@ export const fetchMapper = ({commit}, { collectionId, mapperSlug }) => {
|
||||||
axios.tainacan.get(endpoint)
|
axios.tainacan.get(endpoint)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
let mapper = res.data;
|
let mapper = res.data;
|
||||||
commit('updateMapper', mapper);
|
commit('updateMapper', res.data);
|
||||||
resolve(mapper);
|
resolve(mapper);
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
|
|
Loading…
Reference in New Issue