mirror of
				https://github.com/lingble/chatwoot.git
				synced 2025-11-03 20:48:07 +00:00 
			
		
		
		
	
		
			
				
	
	
		
			118 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			118 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
<template>
 | 
						|
  <div class="flex-container actions--container">
 | 
						|
    <woot-button
 | 
						|
      v-if="!currentChat.muted"
 | 
						|
      v-tooltip="$t('CONTACT_PANEL.MUTE_CONTACT')"
 | 
						|
      variant="clear"
 | 
						|
      color-scheme="secondary"
 | 
						|
      icon="speaker-mute"
 | 
						|
      @click="mute"
 | 
						|
    />
 | 
						|
    <woot-button
 | 
						|
      v-else
 | 
						|
      v-tooltip.left="$t('CONTACT_PANEL.UNMUTE_CONTACT')"
 | 
						|
      variant="clear"
 | 
						|
      color-scheme="secondary"
 | 
						|
      icon="speaker-1"
 | 
						|
      @click="unmute"
 | 
						|
    />
 | 
						|
    <woot-button
 | 
						|
      v-tooltip="$t('CONTACT_PANEL.SEND_TRANSCRIPT')"
 | 
						|
      variant="clear"
 | 
						|
      color-scheme="secondary"
 | 
						|
      icon="share"
 | 
						|
      @click="toggleEmailActionsModal"
 | 
						|
    />
 | 
						|
    <resolve-action
 | 
						|
      :conversation-id="currentChat.id"
 | 
						|
      :status="currentChat.status"
 | 
						|
    />
 | 
						|
    <email-transcript-modal
 | 
						|
      v-if="showEmailActionsModal"
 | 
						|
      :show="showEmailActionsModal"
 | 
						|
      :current-chat="currentChat"
 | 
						|
      @cancel="toggleEmailActionsModal"
 | 
						|
    />
 | 
						|
  </div>
 | 
						|
</template>
 | 
						|
<script>
 | 
						|
import { mapGetters } from 'vuex';
 | 
						|
import { mixin as clickaway } from 'vue-clickaway';
 | 
						|
import alertMixin from 'shared/mixins/alertMixin';
 | 
						|
import EmailTranscriptModal from './EmailTranscriptModal';
 | 
						|
import ResolveAction from '../../buttons/ResolveAction';
 | 
						|
import {
 | 
						|
  CMD_MUTE_CONVERSATION,
 | 
						|
  CMD_SEND_TRANSCRIPT,
 | 
						|
  CMD_UNMUTE_CONVERSATION,
 | 
						|
} from '../../../routes/dashboard/commands/commandBarBusEvents';
 | 
						|
 | 
						|
export default {
 | 
						|
  components: {
 | 
						|
    EmailTranscriptModal,
 | 
						|
    ResolveAction,
 | 
						|
  },
 | 
						|
  mixins: [alertMixin, clickaway],
 | 
						|
  data() {
 | 
						|
    return {
 | 
						|
      showEmailActionsModal: false,
 | 
						|
    };
 | 
						|
  },
 | 
						|
  computed: {
 | 
						|
    ...mapGetters({ currentChat: 'getSelectedChat' }),
 | 
						|
  },
 | 
						|
  mounted() {
 | 
						|
    bus.$on(CMD_MUTE_CONVERSATION, this.mute);
 | 
						|
    bus.$on(CMD_UNMUTE_CONVERSATION, this.unmute);
 | 
						|
    bus.$on(CMD_SEND_TRANSCRIPT, this.toggleEmailActionsModal);
 | 
						|
  },
 | 
						|
  destroyed() {
 | 
						|
    bus.$off(CMD_MUTE_CONVERSATION, this.mute);
 | 
						|
    bus.$off(CMD_UNMUTE_CONVERSATION, this.unmute);
 | 
						|
    bus.$off(CMD_SEND_TRANSCRIPT, this.toggleEmailActionsModal);
 | 
						|
  },
 | 
						|
  methods: {
 | 
						|
    mute() {
 | 
						|
      this.$store.dispatch('muteConversation', this.currentChat.id);
 | 
						|
      this.showAlert(this.$t('CONTACT_PANEL.MUTED_SUCCESS'));
 | 
						|
    },
 | 
						|
    unmute() {
 | 
						|
      this.$store.dispatch('unmuteConversation', this.currentChat.id);
 | 
						|
      this.showAlert(this.$t('CONTACT_PANEL.UNMUTED_SUCCESS'));
 | 
						|
    },
 | 
						|
    toggleEmailActionsModal() {
 | 
						|
      this.showEmailActionsModal = !this.showEmailActionsModal;
 | 
						|
    },
 | 
						|
  },
 | 
						|
};
 | 
						|
</script>
 | 
						|
<style scoped lang="scss">
 | 
						|
.actions--container {
 | 
						|
  align-items: center;
 | 
						|
 | 
						|
  .resolve-actions {
 | 
						|
    margin-left: var(--space-small);
 | 
						|
  }
 | 
						|
}
 | 
						|
 | 
						|
.more--button {
 | 
						|
  align-items: center;
 | 
						|
  display: flex;
 | 
						|
  margin-left: var(--space-small);
 | 
						|
}
 | 
						|
 | 
						|
.actions--container {
 | 
						|
  position: relative;
 | 
						|
}
 | 
						|
 | 
						|
.dropdown-pane {
 | 
						|
  right: var(--space-minus-small);
 | 
						|
  top: 48px;
 | 
						|
}
 | 
						|
 | 
						|
.icon {
 | 
						|
  margin-right: var(--space-smaller);
 | 
						|
  min-width: var(--space-normal);
 | 
						|
}
 | 
						|
</style>
 |