Files
chatwoot/app/javascript/dashboard/components/widgets/ChannelItem.vue
2023-07-11 14:00:11 -07:00

68 lines
1.5 KiB
Vue

<template>
<channel-selector
:class="{ inactive: !isActive }"
:title="channel.name"
:src="getChannelThumbnail()"
@click="onItemClick"
/>
</template>
<script>
import ChannelSelector from '../ChannelSelector';
export default {
components: { ChannelSelector },
props: {
channel: {
type: Object,
required: true,
},
enabledFeatures: {
type: Object,
required: true,
},
},
computed: {
hasFbConfigured() {
return window.chatwootConfig?.fbAppId;
},
isActive() {
const { key } = this.channel;
if (Object.keys(this.enabledFeatures).length === 0) {
return false;
}
if (key === 'website') {
return this.enabledFeatures.channel_website;
}
if (key === 'facebook') {
return this.enabledFeatures.channel_facebook && this.hasFbConfigured;
}
if (key === 'email') {
return this.enabledFeatures.channel_email;
}
return [
'website',
'twilio',
'api',
'whatsapp',
'sms',
'telegram',
'line',
].includes(key);
},
},
methods: {
getChannelThumbnail() {
if (this.channel.key === 'api' && this.channel.thumbnail) {
return this.channel.thumbnail;
}
return `/assets/images/dashboard/channels/${this.channel.key}.png`;
},
onItemClick() {
if (this.isActive) {
this.$emit('channel-item-click', this.channel.key);
}
},
},
};
</script>