Enhancement: Paginate conversation calls in tabs (#560)

* Use conversationPage module for pagination

* Load more conversations

* Reset list if conversation status is changed

* Add specs to conversationPage

* Reset filter when page is re-mounted

* Update text

* Update text
This commit is contained in:
Pranav Raj S 2020-02-26 21:15:01 +05:30 committed by GitHub
parent e5bc372a29
commit 0740d4762f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 395 additions and 141 deletions

View file

@ -1,15 +1,15 @@
<template>
<woot-tabs :index="tabsIndex" @change="onTabChange">
<woot-tabs :index="activeTabIndex" @change="onTabChange">
<woot-tabs-item
v-for="item in items"
:key="item.name"
:key="item.key"
:name="item.name"
:count="item.count"
/>
</woot-tabs>
</template>
<script>
/* eslint no-console: 0 */
import wootConstants from '../../constants';
export default {
props: {
@ -17,24 +17,25 @@ export default {
type: Array,
default: () => [],
},
activeTabIndex: {
type: Number,
default: 0,
activeTab: {
type: String,
default: wootConstants.ASSIGNEE_TYPE.ME,
},
},
data() {
return {
tabsIndex: 0,
tabsIndex: wootConstants.ASSIGNEE_TYPE.ME,
};
},
created() {
this.tabsIndex = this.activeTabIndex;
computed: {
activeTabIndex() {
return this.items.findIndex(item => item.key === this.activeTab);
},
},
methods: {
onTabChange(selectedTabIndex) {
if (selectedTabIndex !== this.tabsIndex) {
this.$emit('chatTabChange', selectedTabIndex);
this.tabsIndex = selectedTabIndex;
if (this.items[selectedTabIndex].key !== this.activeTab) {
this.$emit('chatTabChange', this.items[selectedTabIndex].key);
}
},
},

View file

@ -1,5 +1,5 @@
<template>
<select v-model="activeIndex" class="status--filter" @change="onTabChange()">
<select v-model="activeStatus" class="status--filter" @change="onTabChange()">
<option
v-for="item in $t('CHAT_LIST.CHAT_STATUS_ITEMS')"
:key="item['VALUE']"
@ -11,15 +11,16 @@
</template>
<script>
import wootConstants from '../../../constants';
export default {
data: () => ({
activeIndex: 0,
activeStatus: wootConstants.STATUS_TYPE.OPEN,
}),
mounted() {},
methods: {
onTabChange() {
this.$store.dispatch('setChatFilter', this.activeIndex);
this.$emit('statusFilterChange', this.activeIndex);
this.$store.dispatch('setChatFilter', this.activeStatus);
this.$emit('statusFilterChange', this.activeStatus);
},
},
};