Sortable class function for finding out which header should get a class showing that the column is selected

This commit is contained in:
2019-10-23 00:32:42 +02:00
parent 96321831d1
commit 8b9b2be891

View File

@@ -27,17 +27,17 @@
<table> <table>
<tr class="table__header noselect"> <tr class="table__header noselect">
<th @click="sortTable('name')"> <th @click="sortTable('name')" :class="selectedSortableClass('name')">
<span>Name</span> <span>Name</span>
<span v-if="prevCol === 'name' && direction"></span> <span v-if="prevCol === 'name' && direction"></span>
<span v-if="prevCol === 'name' && !direction"></span> <span v-if="prevCol === 'name' && !direction"></span>
</th> </th>
<th @click="sortTable('seed')"> <th @click="sortTable('seed')" :class="selectedSortableClass('seed')">
<span>Seed</span> <span>Seed</span>
<span v-if="prevCol === 'seed' && direction"></span> <span v-if="prevCol === 'seed' && direction"></span>
<span v-if="prevCol === 'seed' && !direction"></span> <span v-if="prevCol === 'seed' && !direction"></span>
</th> </th>
<th @click="sortTable('size')"> <th @click="sortTable('size')" :class="selectedSortableClass('size')">
<span>Size</span> <span>Size</span>
<span v-if="prevCol === 'size' && direction"></span> <span v-if="prevCol === 'size' && direction"></span>
<span v-if="prevCol === 'size' && !direction"></span> <span v-if="prevCol === 'size' && !direction"></span>
@@ -85,7 +85,7 @@
<seasonedButton @click="toggleEditSearchQuery" :active="editSearchQuery ? true : false">Edit search query</seasonedButton> <seasonedButton @click="toggleEditSearchQuery" :active="editSearchQuery ? true : false">Edit search query</seasonedButton>
</div> </div>
</div> </div>
<i v-else class="torrentloader"></i> <div v-else class="torrentloader"><i></i></div>
</div> </div>
</template> </template>
@@ -134,6 +134,9 @@ export default {
store.dispatch('torrentModule/reset') store.dispatch('torrentModule/reset')
}, },
methods: { methods: {
selectedSortableClass(headerName) {
return headerName === this.prevCol ? 'active' : ''
},
resetTorrentsAndToggleEditSearchQuery() { resetTorrentsAndToggleEditSearchQuery() {
this.torrents = [] this.torrents = []
this.toggleEditSearchQuery() this.toggleEditSearchQuery()
@@ -254,18 +257,14 @@ export default {
this.listLoaded = false; this.listLoaded = false;
this.editSearchQuery = false; this.editSearchQuery = false;
console.log('query: ', query || this.query)
searchTorrents(query || this.query, 'all', this.currentPage, storage.token) searchTorrents(query || this.query, 'all', this.currentPage, storage.token)
// Promise.resolve({"success":true,"results":[]}) .then(data => {
.then(resp => { this.torrentResponse = [...data.results];
let data = resp.data;
console.log('data results', data.results);
this.torrentResponse = data.results;
this.torrents = data.results; this.torrents = data.results;
this.listLoaded = true; this.listLoaded = true;
}) })
.then(this.findRelaseTypes)
.then(this.updateResultCountInStore) .then(this.updateResultCountInStore)
.then(this.findRelaseTypes)
.catch(e => { .catch(e => {
const error = e.toString() const error = e.toString()
this.errorMessage = error.indexOf('401') != -1 ? 'Permission denied' : 'Nothing found'; this.errorMessage = error.indexOf('401') != -1 ? 'Permission denied' : 'Nothing found';