/
discord-channel.vue
53 lines (46 loc) · 1.63 KB
/
discord-channel.vue
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<template>
<div class="d-flex">
<div class="input-group-prepend">
<span class="input-group-text">
<template v-if="typeof translatedTitle === 'string'">{{ translatedTitle }}</template>
<template v-else>
{{ translatedTitle.title }}
<small class="text-info" data-toggle="tooltip" data-html="true" :title="translatedTitle.help">[?]</small>
</template>
</span>
</div>
<b-form-select v-model="currentValue" :options="channels"></b-form-select>
</div>
</template>
<script lang="ts">
import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
import { getSocket } from 'src/panel/helpers/socket';
@Component({})
export default class discordChannel extends Vue {
@Prop() readonly value: any;
@Prop() readonly title: any;
socket = getSocket('/integrations/discord')
channels: { text: string, value: string }[] = []
currentValue = this.value;
translatedTitle = this.translate(this.title);
mounted() {
this.socket.emit('discord::getChannels', (err, channels) => {
console.groupCollapsed('discord::getChannels')
console.log({channels});
console.groupEnd();
if (err) {
return console.error(err);
}
// find channel in channels on current or unset current
if (!channels.find(o => String(o.value) === String(this.currentValue))) {
this.currentValue = '';
}
this.channels = [{ value: '', text: `-- ${this.translate('integrations.discord.settings.noChannelSelected')} --` }, ...channels];
});
}
@Watch('currentValue')
onChange() {
this.$emit('update', { value: this.currentValue });
}
};
</script>