Chatwoot/app/javascript/dashboard/routes/dashboard/commands/commandbar.vue
2022-12-12 23:21:04 +05:30

79 lines
1.8 KiB
Vue

<!-- eslint-disable vue/attribute-hyphenation -->
<template>
<ninja-keys
ref="ninjakeys"
:no-auto-load-md-icons="true"
hideBreadcrumbs
:placeholder="placeholder"
@selected="setCommandbarData"
@change="onChange"
/>
</template>
<script>
import 'ninja-keys';
import conversationHotKeysMixin from './conversationHotKeys';
import goToCommandHotKeys from './goToCommandHotKeys';
import agentMixin from 'dashboard/mixins/agentMixin';
import conversationLabelMixin from 'dashboard/mixins/conversation/labelMixin';
import conversationTeamMixin from 'dashboard/mixins/conversation/teamMixin';
import adminMixin from 'dashboard/mixins/isAdmin';
export default {
mixins: [
adminMixin,
agentMixin,
conversationHotKeysMixin,
conversationLabelMixin,
conversationTeamMixin,
goToCommandHotKeys,
],
data() {
return {
placeholder: this.$t('COMMAND_BAR.SEARCH_PLACEHOLDER'),
};
},
computed: {
accountId() {
return this.$store.getters.getCurrentAccountId;
},
routeName() {
return this.$route.name;
},
hotKeys() {
return [...this.conversationHotKeys, ...this.goToCommandHotKeys];
},
},
watch: {
routeName() {
this.setCommandbarData();
},
},
mounted() {
this.setCommandbarData();
},
methods: {
setCommandbarData(e) {
if (e && e.detail.action.id && e.detail.action.title) {
console.log({ id: e.detail.action.id, title: e.detail.action.id });
}
this.$refs.ninjakeys.data = this.hotKeys;
},
onChange(ninjaKeyInstance) {
// console.log(ninjaKeyInstance);
},
searchEverything(query) {
console.log(query);
},
},
};
</script>
<style>
ninja-keys {
--ninja-accent-color: var(--w-500);
--ninja-font-family: 'Inter';
z-index: 9999;
}
</style>