direct_conversation_new.js (2515B)
1 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
2 import UserAvatar from '../user_avatar/user_avatar.vue'
3 import { difference, throttle } from 'lodash'
4
5 const directConversationNew = {
6 components: {
7 BasicUserCard,
8 UserAvatar
9 },
10 data () {
11 return {
12 selectedUserIds: [],
13 userIds: [],
14 loading: false,
15 query: ''
16 }
17 },
18 computed: {
19 currentUser () {
20 return this.$store.state.users.currentUser
21 },
22 nextAllowed () {
23 return this.selectedUsers.length > 0
24 },
25 users () {
26 let userIds = difference(this.userIds, this.selectedUserIds)
27 return userIds.map(userId => this.$store.getters.findUser(userId))
28 },
29 selectedUsers () {
30 return this.selectedUserIds.map(userId => this.$store.getters.findUser(userId)).filter(x => x)
31 },
32 availableUsers () {
33 if (this.query.length !== 0) {
34 return this.users
35 } else {
36 return this.suggestions
37 }
38 },
39 suggestions () {
40 let result = {}
41 this.$store.state.directConversations.directConversations.data.forEach(conversation => {
42 conversation.accounts.forEach(user => {
43 result[user.id] = user
44 })
45 })
46 result = Object.values(result)
47 return result.filter(s => !this.selectedUserIds.includes(s.id))
48 }
49 },
50 mounted () {
51 this.$store.dispatch('fetchDirectConversations')
52 },
53 destroyed () {
54 this.$store.dispatch('resetDirectConversations')
55 },
56 methods: {
57 goBack () {
58 this.$emit('cancel')
59 },
60 newDirectConversation () {
61 const currentUser = this.$store.state.users.currentUser
62 let query = { users: this.selectedUsers.map(u => u.id) }
63 this.$router.push({ name: 'direct-conversation', query: query, params: { username: currentUser.screen_name, id: 'new' } })
64 },
65 onInput () {
66 this.search(this.query)
67 },
68 addUser (user) {
69 this.selectedUserIds.push(user.id)
70 this.query = ''
71 },
72 removeUser (userId) {
73 this.selectedUserIds = this.selectedUserIds.filter(id => id !== userId)
74 },
75 search: throttle(function (query) {
76 if (!query) {
77 this.loading = false
78 return
79 }
80
81 this.loading = true
82 this.userIds = []
83 this.$store.dispatch('search', { q: query, resolve: true, type: 'accounts' })
84 .then(data => {
85 this.loading = false
86 this.userIds = data.accounts.map(a => a.id)
87 })
88 })
89 }
90 }
91
92 export default directConversationNew