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:
parent
e5bc372a29
commit
0740d4762f
28 changed files with 395 additions and 141 deletions
|
@ -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);
|
||||
}
|
||||
},
|
||||
},
|
||||
|
|
|
@ -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);
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue