EP/website-typo3
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use axios for all ajax requests

Browse Source
This commit is contained in:
Björn Fromme
2018-10-26 21:40:11 +02:00
parent afc8d70d6e
commit fdfd982d47
7 changed files with 78 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/AjaxContent.vue
+8 -2
View File
@@ -8,6 +8,7 @@
</template>
<script>
import $ from 'jquery'
import axios from 'axios'
import EventBus from '../_bus'
const $window = $(window);
@@ -22,11 +23,16 @@
props: [ 'uri', 'loaderUri' ],
methods: {
loadContent () {
$.get(this.uri, (html) => {
axios({
url: this.uri,
responseType: 'text'
}).then((response) => {
this.loading = false;
this.html = html;
this.html = response.data;
$(this.$refs.trigger).remove();
EventBus.$emit('ajaxContentLoaded');
}).catch(() => {
this.loading = false;
});
},
isInViewport ($triggerElement) {
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/Calendar.vue
+9 -3
View File
@@ -25,7 +25,7 @@
</template>
<script>
import Vue from 'vue'
import $ from 'jquery'
import axios from 'axios'
import dayjs from 'dayjs'
import 'dayjs/locale/de'
@@ -85,8 +85,14 @@
query[this.argumentPrefix + '[months]'] = this.months;
this.loading = true;
this.showPrev = this.startDate.isAfter(dayjs());
$.get(this.uri, query, (html) => {
this.calendarHtml = html;
axios({
url: this.uri,
responseType: 'text',
params: query
}).then((response) => {
this.calendarHtml = response.data;
this.loading = false;
}).catch(() => {
this.loading = false;
});
},
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/DestinationAutocomplete.vue
+10 -3
View File
@@ -26,6 +26,7 @@
<script>
import $ from 'jquery'
import axios from 'axios'
export default {
props: {
@@ -74,14 +75,20 @@
let query = {};
query[this.argumentPrefix + '[filterSettings]'] = this.filterSettings;
query[this.argumentPrefix + '[search]'] = this.destination;
$.post(this.ajaxUri, query, (json) => {
this.autocompleteOptions = json;
axios({
url: this.ajaxUri,
method: 'post',
data: $.param(query)
}).then((response) => {
this.autocompleteOptions = response.data;
this.showAutocompleteOptions = this.hasOptions();
if (this.showAutocompleteOptions) {
this.openDropdown();
}
this.loading = false;
}, 'json');
}).catch(() => {
this.loading = false;
});
},
toggleOptions () {
if (!this.hasOptions()) {
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/SearchBar.vue
+14 -7
View File
@@ -1,5 +1,5 @@
<script>
import $ from 'jquery'
import axios from 'axios'
import DaterangeSelect from './DaterangeSelect.vue'
import DestinationSelect from './DestinationSelect.vue'
import PaxSelect from './PaxSelect.vue'
@@ -25,9 +25,13 @@
loadOptions () {
const query = {};
query[this.argumentPrefix + '[searchParams]'] = this.searchParams;
$.post(this.optionsUri, query, (json) => {
this.applyOptions(json);
}, 'json');
axios({
url: this.optionsUri,
method: 'post',
data: $.param(query)
}).then((response) => {
this.applyOptions(response.data);
});
},
applyOptions (json) {
this.filterOptions.totalResults = json.totalResults;
@@ -65,9 +69,12 @@
this.loadOptions();
},
resetDestination () {
$.post(this.resetUri, (json) => {
this.searchParams = json.searchParams;
this.applyOptions(json);
axios({
url: this.resetUri,
method: 'post'
}).then((response) => {
this.applyOptions(response.data);
this.searchParams = response.data.searchParams;
});
}
}
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/SearchBox.vue
+14 -6
View File
@@ -1,5 +1,6 @@
<script>
import $ from 'jquery'
import axios from 'axios'
import DestinationSelect from './DestinationSelect.vue'
import PriceRangeSelect from './PriceRangeSelect.vue'
@@ -19,9 +20,13 @@
loadOptions () {
const query = {};
query[this.argumentPrefix + '[searchParams]'] = this.searchParams;
$.post(this.optionsUri, query, (json) => {
this.applyOptions(json);
}, 'json');
axios({
url: this.optionsUri,
method: 'post',
data: $.param(query)
}).then((response) => {
this.applyOptions(response.data);
});
},
applyOptions (json) {
this.filterOptions.totalResults = json.totalResults;
@@ -52,9 +57,12 @@
this.loadOptions();
},
resetDestination () {
$.post(this.resetUri, (json) => {
this.searchParams = json.searchParams;
this.applyOptions(json);
axios({
url: this.resetUri,
method: 'post'
}).then((response) => {
this.applyOptions(response.data);
this.searchParams = response.data.searchParams;
});
}
}
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/SearchResult.vue
+11 -4
View File
@@ -1,6 +1,7 @@
<script>
import Vue from 'vue';
import $ from 'jquery'
import axios from 'axios'
import EventBus from '../_bus'
import DaterangeSelect from './DaterangeSelect.vue'
import DestinationCheckboxes from './DestinationCheckboxes.vue'
@@ -128,12 +129,18 @@
query[this.argumentPrefix + '[filterSettings]'] = this.filterSettings;
this.loading = true;
this.resultMeta = null;
$.post(this.resultsUri, query, (json) => {
this.resultData = json.data;
this.filterOptions = json.filterOptions;
this.resultMeta = json.meta;
axios({
url: this.resultsUri,
method: 'post',
data: $.param(query)
}).then((response) => {
this.resultData = response.data.data;
this.filterOptions = response.data.filterOptions;
this.resultMeta = response.data.meta;
this.loading = false;
EventBus.$emit('ajaxContentLoaded');
}).catch(() => {
this.loading = false;
});
},
resetFilterSettings () {
web/typo3conf/ext/ep_theme/Resources/Private/Assets/js/components/Watchlist.vue
+12 -3
View File
@@ -23,6 +23,7 @@
<script>
import Vue from 'vue'
import axios from 'axios'
import EventBus from '../_bus'
import SearchResultItem from './SearchResultItem.vue'
@@ -71,11 +72,19 @@
let query = {};
query['tx_epproducts_ajax[watchlistUids]'] = this.watchlist;
this.loading = true;
$.post(this.watchlistUri, query, (json) => {
this.teasers = json.data;
this.total = json.total;
axios({
url: this.watchlistUri,
headers: {
'Accept': 'application/json'
},
params: query
}).then((response) => {
this.teasers = response.data.data;
this.total = response.data.total;
this.loading = false;
EventBus.$emit('ajaxContentLoaded');
}).catch(() => {
this.loading = false;
});
}
},