summaryrefslogtreecommitdiffstats
path: root/src
diff options
context:
space:
mode:
authorjdlugosz963 <jdlugosz963@gmail.com>2021-12-12 23:09:20 +0100
committerjdlugosz963 <jdlugosz963@gmail.com>2021-12-12 23:09:20 +0100
commit4b6be9f09ff56dfae1c719cb744f2312e11be317 (patch)
tree35ea43304a32dc47ed1a7289052d1b97fca944dd /src
parent10abd20260050174dd508038f0b95c5f8f740933 (diff)
downloadlom_frontend-4b6be9f09ff56dfae1c719cb744f2312e11be317.tar.gz
lom_frontend-4b6be9f09ff56dfae1c719cb744f2312e11be317.zip
add group maker
Diffstat (limited to 'src')
-rw-r--r--src/components/GroupMaker.vue79
-rw-r--r--src/components/Searcher.vue4
-rw-r--r--src/services/AuthService.js34
-rw-r--r--src/services/ChatService.js17
-rw-r--r--src/services/CommandsService.js21
-rw-r--r--src/services/NotifyErrorService.js20
-rw-r--r--src/views/Home.vue37
7 files changed, 172 insertions, 40 deletions
diff --git a/src/components/GroupMaker.vue b/src/components/GroupMaker.vue
new file mode 100644
index 0000000..59f83fd
--- /dev/null
+++ b/src/components/GroupMaker.vue
@@ -0,0 +1,79 @@
1<template>
2 <div class="group_maker">
3 Group maker
4 <form @submit="make_group">
5 <input
6 v-model="group_name"
7 ref='input'
8 type="text"
9 placeholder="Type group name..."
10 />
11
12 <select multiple v-model="users_selection">
13
14 <option
15 v-for="user in users"
16 :key="user.id"
17 :value="user.id">
18 {{user.username}}
19 </option>
20
21 </select>
22 </form>
23 </div>
24</template>
25
26<script>
27import ChatService from "@/services/ChatService.js"
28import AuthService from "@/services/AuthService.js"
29
30export default {
31 data() {
32 return {
33 group_name: "",
34 users_selection: [],
35 users: []
36 }
37 },
38
39 methods: {
40 close() {
41 this.$emit('close')
42 },
43
44 async make_group(e) {
45 e.preventDefault()
46 console.log(this.users_selection)
47 const {status} = await ChatService.group_create({
48 "name": this.group_name,
49 "users": this.users_selection
50 })
51
52 if(status === 201)
53 this.$notify({
54 type: "success",
55 text: "Group created!"
56 })
57 },
58
59 async set_users() {
60 const {status, data} = await AuthService.info("all=true")
61
62 if(status === 200)
63 this.users = data.users
64 else
65 this.close()
66
67 console.log(this.users)
68 }
69 },
70
71 created() {
72 this.$nextTick(function () {
73 this.$refs.input.focus()
74
75 this.set_users()
76 })
77 }
78}
79</script>
diff --git a/src/components/Searcher.vue b/src/components/Searcher.vue
index 43dd7bd..8488fd4 100644
--- a/src/components/Searcher.vue
+++ b/src/components/Searcher.vue
@@ -38,7 +38,7 @@ export default {
38 let is_current_set = false 38 let is_current_set = false
39 39
40 Object.entries(this.commands).forEach((element) => { 40 Object.entries(this.commands).forEach((element) => {
41 if(element[0].startsWith(this.search)) { 41 if(element[0].startsWith(this.search) && element[1] instanceof Function) {
42 sugestions.push(element) 42 sugestions.push(element)
43 if(!is_current_set){ 43 if(!is_current_set){
44 this.current = element 44 this.current = element
@@ -62,7 +62,7 @@ export default {
62 }, 62 },
63 63
64 execute_current() { 64 execute_current() {
65 let out = this.current[1]() 65 let out = this.current[1](this)
66 66
67 if(out instanceof Object) { 67 if(out instanceof Object) {
68 this.search = '' 68 this.search = ''
diff --git a/src/services/AuthService.js b/src/services/AuthService.js
index 758157c..2f58076 100644
--- a/src/services/AuthService.js
+++ b/src/services/AuthService.js
@@ -1,25 +1,8 @@
1import axios from "axios"; 1import axios from "axios";
2import Vue from 'vue' 2import error_notify from './NotifyErrorService.js'
3 3
4const url = 'http://localhost:8000/api/auth/' 4const url = 'http://localhost:8000/api/auth/'
5 5
6const error_notify = (error) => {
7 for (const [key, values] of Object.entries(error.response.data)) {
8 console.log(values)
9 values.forEach(value => {
10 Vue.notify({
11 type: 'error',
12 title: value,
13 text: (key !== 'non_field_errors') ? key : ''
14 })
15 })
16 }
17 return {
18 data: error.response.data,
19 status: error.response.status
20 }
21}
22
23export default { 6export default {
24 async login(data) { 7 async login(data) {
25 return await axios 8 return await axios
@@ -46,6 +29,19 @@ export default {
46 29
47 }, 30 },
48 31
32 async info(data) {
33 return await axios
34 .get(url+'info/?'+data)
35 .then(res => {
36 return {
37 data: res.data,
38 status: res.status
39 }
40 })
41 .catch(error => error_notify(error))
42
43 },
44
49 async logout() { 45 async logout() {
50 return await axios 46 return await axios
51 .post(url+'logout/') 47 .post(url+'logout/')
@@ -56,4 +52,4 @@ export default {
56 }) 52 })
57 .catch(error => error_notify(error)) 53 .catch(error => error_notify(error))
58 } 54 }
59} \ No newline at end of file 55}
diff --git a/src/services/ChatService.js b/src/services/ChatService.js
new file mode 100644
index 0000000..ab1e6c2
--- /dev/null
+++ b/src/services/ChatService.js
@@ -0,0 +1,17 @@
1import axios from "axios";
2import error_notify from './NotifyErrorService.js'
3
4const url = 'http://localhost:8000/api/chat/'
5
6export default {
7 async group_create(data) {
8 return await axios
9 .post(url+'groups/', data)
10 .then(res => {
11 return {
12 status: res.status
13 }
14 })
15 .catch(error => error_notify(error))
16 }
17}
diff --git a/src/services/CommandsService.js b/src/services/CommandsService.js
index f8a815f..01a758e 100644
--- a/src/services/CommandsService.js
+++ b/src/services/CommandsService.js
@@ -3,18 +3,19 @@ import store from "@/store/index.js"
3import router from '@/router/index.js' 3import router from '@/router/index.js'
4 4
5export default { 5export default {
6 logout() { 6 groups() {
7 return {
8 send(searcher) {console.log(searcher)},
9
10 make(searcher) {
11 searcher.$emit('toogle_group_maker')
12 },
13 }
14 },
15
16 logout() {
7 AuthService.logout() 17 AuthService.logout()
8 store.dispatch('logout') 18 store.dispatch('logout')
9 router.push('/login') 19 router.push('/login')
10 }, 20 },
11 friends() {
12 console.log("list")
13 },
14 tab() {
15 return {
16 on() {},
17 off() {}
18 }
19 }
20} 21}
diff --git a/src/services/NotifyErrorService.js b/src/services/NotifyErrorService.js
new file mode 100644
index 0000000..b28e664
--- /dev/null
+++ b/src/services/NotifyErrorService.js
@@ -0,0 +1,20 @@
1import Vue from 'vue'
2
3const error_notify = (error) => {
4 for (const [key, values] of Object.entries(error.response.data)) {
5 console.log(values)
6 values.forEach(value => {
7 Vue.notify({
8 type: 'error',
9 title: value,
10 text: (key !== 'non_field_errors') ? key : ''
11 })
12 })
13 }
14 return {
15 data: error.response.data,
16 status: error.response.status
17 }
18}
19
20export default error_notify
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 2954857..abf6fc8 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -1,18 +1,33 @@
1<template> 1<template>
2 <div class="home" v-hotkey="keymap"> 2 <div class="home" v-hotkey="keymap">
3 Hi {{get_username}}! 3 Hi {{get_username}}!
4 <input type="button" value="Logout!" @click="logout"> 4 <Searcher
5 <Searcher v-if="show" @close="hide" /> 5 v-if="popups.searcher_show"
6 @close="hideSearcher"
7 @toogle_group_maker="toogleGroupShow"
8 />
9
10 <GroupMaker
11 v-if="popups.group_maker_show"
12 @close="hideGroup"
13
14 />
6 </div> 15 </div>
7</template> 16</template>
8 17
9<script> 18<script>
10import Searcher from '@/components/Searcher.vue' 19import Searcher from '@/components/Searcher.vue'
20import GroupMaker from '@/components/GroupMaker.vue'
21
22const popups = {
23 searcher_show: false,
24 group_maker_show: false
25 }
11 26
12export default { 27export default {
13 data() { 28 data() {
14 return { 29 return {
15 show: false, 30 popups
16 } 31 }
17 }, 32 },
18 33
@@ -22,8 +37,11 @@ export default {
22 this.$router.push('/login') 37 this.$router.push('/login')
23 }, 38 },
24 39
25 toogleShow() { this.show = !this.show }, 40 toogleSearcherShow() { this.popups.searcher_show = !this.popups.searcher_show },
26 hide() { this.show = false } 41 hideSearcher() { this.popups.searcher_show = false },
42
43 toogleGroupShow() { this.popups.group_maker_show = !this.popups.group_maker_show },
44 hideGroup() { this.popups.group_maker_show = false }
27 }, 45 },
28 46
29 computed: { 47 computed: {
@@ -33,15 +51,16 @@ export default {
33 51
34 keymap() { 52 keymap() {
35 return { 53 return {
36 'ctrl+esc': this.toogleShow, 54 'ctrl+esc': this.toogleSearcherShow,
37 'ctrl+shift+p': this.toogleShow, 55 'ctrl+shift+p': this.toogleSearcherShow,
38 'esc': this.hide 56 'esc': this.hideGroup
39 } 57 }
40 } 58 }
41 }, 59 },
42 60
43 components: { 61 components: {
44 Searcher 62 Searcher,
63 GroupMaker
45 }, 64 },
46 65
47 created() { 66 created() {