Now options form is working (#160)
This commit is contained in:
parent
63599c417a
commit
b5029e5a58
|
@ -5,17 +5,35 @@
|
|||
{ path: $routerHelper.getAvailableExportersPath(), label: $i18n.get('exporters') },
|
||||
{ path: '', label: exporterType != undefined ? exporterType : $i18n.get('title_exporter_page') }
|
||||
]"/>
|
||||
|
||||
<form class="tainacan-form">
|
||||
<b-loading
|
||||
:active.sync="isLoading"
|
||||
:can-cancel="false"/>
|
||||
<form
|
||||
@click="formErrorMessage = ''"
|
||||
label-width="120px"
|
||||
v-if="exporterSession"
|
||||
class="tainacan-form">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
|
||||
<div class="column is-6">
|
||||
<form id="exporterOptionsForm">
|
||||
<div v-html="exporterSession.options_form" />
|
||||
</form>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div
|
||||
style="max-width: 40px;"
|
||||
class="column"/>
|
||||
<div class="column is-5">
|
||||
<b-field
|
||||
v-if="exporterSession.manual_collection"
|
||||
:label="$i18n.get('label_origin_collection')">
|
||||
:addons="false"
|
||||
:label="$i18n.get('label_source_collection')">
|
||||
<help-button
|
||||
:title="$i18n.get('label_source_collection')"
|
||||
:message="$i18n.get('info_source_collection_helper')"/>
|
||||
<br>
|
||||
<b-select
|
||||
expanded
|
||||
@input="updateExporter('collection.id')"
|
||||
v-model="selectedCollection"
|
||||
:loading="isFetchingCollections"
|
||||
|
@ -37,9 +55,11 @@
|
|||
:label="$i18n.get('mapping')">
|
||||
|
||||
<b-select
|
||||
expanded
|
||||
@input="updateExporter('mapping_selected')"
|
||||
v-model="selectedMappings"
|
||||
>
|
||||
v-model="selectedMapping"
|
||||
:placeholder="$i18n.get('instruction_select_a_mapper')">
|
||||
<option :value="''">-</option>
|
||||
<option
|
||||
v-for="(mapping, key) in exporterSession.mapping_list"
|
||||
:value="key"
|
||||
|
@ -56,15 +76,18 @@
|
|||
:loading="emailLoading"
|
||||
@input="updateEmail()"
|
||||
type="email"
|
||||
placeholder="my@email.com"
|
||||
v-model="sendEmail"/>
|
||||
</b-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns">
|
||||
<span class="help is-danger">{{ formErrorMessage }}</span>
|
||||
|
||||
<div class="column">
|
||||
<button
|
||||
@click.prevent="$router.go(-1)"
|
||||
class="button is-outlined">
|
||||
class="button is-pulled-left is-outlined">
|
||||
{{ $i18n.get('cancel') }}
|
||||
</button>
|
||||
</div>
|
||||
|
@ -93,12 +116,14 @@
|
|||
exporterType: '',
|
||||
collections: [],
|
||||
isFetchingCollections: false,
|
||||
selectedMappings: [],
|
||||
selectedMapping: undefined,
|
||||
selectedCollection: undefined,
|
||||
sendEmail: '',
|
||||
emailLoading: false,
|
||||
runButtonLoading: false,
|
||||
exporterSession: {}
|
||||
exporterSession: {},
|
||||
formErrorMessage: '',
|
||||
isLoading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
@ -108,10 +133,33 @@
|
|||
'runExporterSession'
|
||||
]),
|
||||
...mapActions('collection', [
|
||||
'fetchCollectionsForParent'
|
||||
'fetchCollections'
|
||||
]),
|
||||
updateExporterOptions(){
|
||||
let formElement = document.getElementById('exporterOptionsForm');
|
||||
let formData = new FormData(formElement);
|
||||
|
||||
let options = {};
|
||||
|
||||
for (let [key, value] of formData.entries())
|
||||
options[key] = value;
|
||||
|
||||
let exporterSessionUpdated = {
|
||||
body: {
|
||||
options: options,
|
||||
},
|
||||
id: this.exporterSession.id,
|
||||
};
|
||||
|
||||
return this.updateExporterSession(exporterSessionUpdated)
|
||||
.then(exporterSessionUpdated => this.verifyError(exporterSessionUpdated));
|
||||
},
|
||||
runExporter(){
|
||||
this.runButtonLoading = true;
|
||||
|
||||
this.updateExporterOptions().then(() => {
|
||||
|
||||
if(!this.formErrorMessage) {
|
||||
this.runExporterSession(this.exporterSession.id)
|
||||
.then((bgp) => {
|
||||
this.runButtonLoading = false;
|
||||
|
@ -120,16 +168,28 @@
|
|||
.catch(() => {
|
||||
this.runButtonLoading = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
formIsValid(){
|
||||
return (
|
||||
this.selectedCollection &&
|
||||
this.selectedMappings.length
|
||||
this.selectedMapping &&
|
||||
!this.formErrorMessage
|
||||
);
|
||||
},
|
||||
updateEmail: _.debounce(function () {
|
||||
this.updateExporter('send_email');
|
||||
}, 500),
|
||||
verifyError(response){
|
||||
console.log(response);
|
||||
if(response.constructor.name === 'Object' &&
|
||||
(response.data && response.data.status && response.data.status.toString().split('')[0] != 2) || response.error_message) {
|
||||
this.formErrorMessage = response.data.error_message;
|
||||
} else {
|
||||
this.exporterSession = response.data;
|
||||
}
|
||||
},
|
||||
updateExporter(attributeName){
|
||||
if(attributeName === 'collection.id'){
|
||||
let exporterSessionUpdated = {
|
||||
|
@ -142,18 +202,18 @@
|
|||
};
|
||||
|
||||
this.updateExporterSession(exporterSessionUpdated)
|
||||
.then(exporterSessionUpdated => this.exporterSession = exporterSessionUpdated);
|
||||
.then(exporterSessionUpdated => this.verifyError(exporterSessionUpdated));
|
||||
|
||||
} else if (attributeName === 'mapping_selected'){
|
||||
let exporterSessionUpdate = {
|
||||
body: {
|
||||
mapping_selected: this.selectedMappings.length <= 1 ? this.selectedMappings.toString() : this.selectedMappings,
|
||||
mapping_selected: this.selectedMapping ? this.selectedMapping : this.selectedMapping,
|
||||
},
|
||||
id: this.exporterSession.id,
|
||||
};
|
||||
|
||||
this.updateExporterSession(exporterSessionUpdate)
|
||||
.then(exporterSessionUpdated => this.exporterSession = exporterSessionUpdated);
|
||||
.then(exporterSessionUpdated => this.verifyError(exporterSessionUpdated));
|
||||
|
||||
} else if (attributeName === 'send_email' &&
|
||||
this.$refs.sendEmailREF &&
|
||||
|
@ -170,7 +230,7 @@
|
|||
|
||||
this.updateExporterSession(exporterSessionUpdate)
|
||||
.then(exporterSessionUpdated => {
|
||||
this.exporterSession = exporterSessionUpdated;
|
||||
this.verifyError(exporterSessionUpdated);
|
||||
this.emailLoading = false;
|
||||
})
|
||||
.catch(() => {
|
||||
|
@ -182,22 +242,23 @@
|
|||
created(){
|
||||
this.exporterType = this.$route.params.exporterSlug;
|
||||
|
||||
this.isLoading = true;
|
||||
this.createExporterSession(this.exporterType).then(exporterSession => {
|
||||
console.info(exporterSession);
|
||||
this.exporterSession = exporterSession ? exporterSession : {};
|
||||
this.selectedMappings.push(this.exporterSession.mapping_selected);
|
||||
this.selectedMapping = this.exporterSession.mapping_selected;
|
||||
this.isLoading = false;
|
||||
});
|
||||
|
||||
this.isFetchingCollections = true;
|
||||
|
||||
this.fetchCollectionsForParent()
|
||||
.then(collections => {
|
||||
this.collections = collections;
|
||||
this.fetchCollections({ page: 1, collectionsPerPage: -1})
|
||||
.then(response => {
|
||||
this.collections = response.collections;
|
||||
this.isFetchingCollections = false;
|
||||
})
|
||||
.catch(error => {
|
||||
this.isFetchingCollections = false;
|
||||
console.error(error);
|
||||
this.$console.error(error);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -336,7 +336,7 @@ return apply_filters( 'tainacan-admin-i18n', [
|
|||
'label_added_items' => __( 'Added items', 'tainacan' ),
|
||||
'label_filters_from' => __( 'Filters from', 'tainacan' ),
|
||||
'label_available_exporters' => __( 'Available Exporters', 'tainacan' ),
|
||||
'label_origin_collection' => __( 'Origin collection', 'tainacan'),
|
||||
'label_source_collection' => __( 'Origin collection', 'tainacan'),
|
||||
'label_send_email' => __( 'Send a email after exportation completed', 'tainacan' ),
|
||||
'label_urls' => __( 'URLs', 'tainacan' ),
|
||||
'label_page' => __( 'Page', 'tainacan' ),
|
||||
|
|
|
@ -31,7 +31,7 @@ export const updateExporterSession = ({commit}, exporterSessionUpdated) => {
|
|||
console.info(response.data);
|
||||
commit('setExporterSession');
|
||||
|
||||
return response.data;
|
||||
return response;
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error.response.data);
|
||||
|
|
Loading…
Reference in New Issue