mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-11-04 04:57:51 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			92 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			92 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
<template>
 | 
						|
  <div :class="emptyClassName">
 | 
						|
    <woot-loading-state
 | 
						|
      v-if="uiFlags.isFetching || loadingChatList"
 | 
						|
      :message="loadingIndicatorMessage"
 | 
						|
    />
 | 
						|
    <!-- No inboxes attached -->
 | 
						|
    <div
 | 
						|
      v-if="!inboxesList.length && !uiFlags.isFetching && !loadingChatList"
 | 
						|
      class="clearfix"
 | 
						|
    >
 | 
						|
      <onboarding-view v-if="isAdmin" />
 | 
						|
      <empty-state-message
 | 
						|
        v-else
 | 
						|
        :message="$t('CONVERSATION.NO_INBOX_AGENT')"
 | 
						|
      />
 | 
						|
    </div>
 | 
						|
    <!-- Show empty state images if not loading -->
 | 
						|
 | 
						|
    <div
 | 
						|
      v-else-if="!uiFlags.isFetching && !loadingChatList"
 | 
						|
      class="flex flex-col items-center justify-center h-full"
 | 
						|
    >
 | 
						|
      <!-- No conversations available -->
 | 
						|
      <empty-state-message
 | 
						|
        v-if="!allConversations.length"
 | 
						|
        :message="$t('CONVERSATION.NO_MESSAGE_1')"
 | 
						|
      />
 | 
						|
      <empty-state-message
 | 
						|
        v-else-if="allConversations.length && !currentChat.id"
 | 
						|
        :message="conversationMissingMessage"
 | 
						|
      />
 | 
						|
    </div>
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
<script>
 | 
						|
import { mapGetters } from 'vuex';
 | 
						|
import adminMixin from 'dashboard/mixins/isAdmin';
 | 
						|
import accountMixin from 'dashboard/mixins/account';
 | 
						|
import OnboardingView from '../OnboardingView.vue';
 | 
						|
import EmptyStateMessage from './EmptyStateMessage.vue';
 | 
						|
 | 
						|
export default {
 | 
						|
  components: {
 | 
						|
    OnboardingView,
 | 
						|
    EmptyStateMessage,
 | 
						|
  },
 | 
						|
  mixins: [accountMixin, adminMixin],
 | 
						|
  props: {
 | 
						|
    isOnExpandedLayout: {
 | 
						|
      type: Boolean,
 | 
						|
      default: false,
 | 
						|
    },
 | 
						|
  },
 | 
						|
  computed: {
 | 
						|
    ...mapGetters({
 | 
						|
      currentChat: 'getSelectedChat',
 | 
						|
      allConversations: 'getAllConversations',
 | 
						|
      inboxesList: 'inboxes/getInboxes',
 | 
						|
      uiFlags: 'inboxes/getUIFlags',
 | 
						|
      loadingChatList: 'getChatListLoadingStatus',
 | 
						|
    }),
 | 
						|
    loadingIndicatorMessage() {
 | 
						|
      if (this.uiFlags.isFetching) {
 | 
						|
        return this.$t('CONVERSATION.LOADING_INBOXES');
 | 
						|
      }
 | 
						|
      return this.$t('CONVERSATION.LOADING_CONVERSATIONS');
 | 
						|
    },
 | 
						|
    conversationMissingMessage() {
 | 
						|
      if (!this.isOnExpandedLayout) {
 | 
						|
        return this.$t('CONVERSATION.SELECT_A_CONVERSATION');
 | 
						|
      }
 | 
						|
      return this.$t('CONVERSATION.404');
 | 
						|
    },
 | 
						|
    newInboxURL() {
 | 
						|
      return this.addAccountScoping('settings/inboxes/new');
 | 
						|
    },
 | 
						|
    emptyClassName() {
 | 
						|
      if (
 | 
						|
        !this.inboxesList.length &&
 | 
						|
        !this.uiFlags.isFetching &&
 | 
						|
        !this.loadingChatList &&
 | 
						|
        this.isAdmin
 | 
						|
      ) {
 | 
						|
        return 'h-full overflow-auto';
 | 
						|
      }
 | 
						|
      return 'flex-1 min-w-0 px-0 flex flex-col items-center justify-center h-full';
 | 
						|
    },
 | 
						|
  },
 | 
						|
};
 | 
						|
</script>
 |