From 39e313c4186de2455ddaba08a3ffafae1106bc57 Mon Sep 17 00:00:00 2001 From: Aldino Kemal Date: Wed, 13 Mar 2024 23:11:53 +0700 Subject: [PATCH] refactor: account avatar & group --- src/views/components/AccountAvatar.js | 112 +++++++++++ src/views/components/AccountGroup.js | 115 +++++++++++ src/views/components/AccountUserInfo.js | 4 +- src/views/components/MessageReact.js | 4 +- src/views/components/MessageRevoke.js | 4 +- src/views/components/MessageUpdate.js | 4 +- src/views/components/SendAudio.js | 4 +- src/views/components/SendContact.js | 4 +- src/views/components/SendFile.js | 4 +- src/views/components/SendImage.js | 4 +- src/views/components/SendLocation.js | 4 +- src/views/components/SendMessage.js | 4 +- src/views/components/SendPoll.js | 4 +- src/views/components/SendVideo.js | 4 +- src/views/index.html | 244 +----------------------- 15 files changed, 257 insertions(+), 262 deletions(-) create mode 100644 src/views/components/AccountAvatar.js create mode 100644 src/views/components/AccountGroup.js diff --git a/src/views/components/AccountAvatar.js b/src/views/components/AccountAvatar.js new file mode 100644 index 0000000..3509ecd --- /dev/null +++ b/src/views/components/AccountAvatar.js @@ -0,0 +1,112 @@ +export default { + name: 'AccountAvatar', + data() { + return { + type: 'user', + phone: '', + image: null, + loading: false, + is_preview: false, + is_community: false, + } + }, + computed: { + phone_id() { + return this.type === 'user' ? `${this.phone}@${window.TYPEUSER}` : `${this.phone}@${window.TYPEGROUP}` + } + }, + methods: { + async openModal() { + this.handleReset(); + $('#modalUserAvatar').modal('show'); + }, + async handleSubmit() { + try { + await this.submitApi(); + showSuccessInfo("Avatar fetched") + } catch (err) { + showErrorInfo(err) + } + }, + async submitApi() { + this.loading = true; + try { + let response = await http.get(`/user/avatar?phone=${this.phone_id}&is_preview=${this.is_preview}&is_community=${this.is_community}`) + this.image = response.data.results.url; + } catch (error) { + if (error.response) { + throw new Error(error.response.data.message); + } + throw new Error(error.message); + + } finally { + this.loading = false; + } + }, + handleReset() { + this.phone = ''; + this.image = null; + this.type = 'user'; + } + }, + template: ` +
+
+
Avatar
+
+ You can search someone avatar by phone +
+
+
+ + + + ` +} \ No newline at end of file diff --git a/src/views/components/AccountGroup.js b/src/views/components/AccountGroup.js new file mode 100644 index 0000000..8156cac --- /dev/null +++ b/src/views/components/AccountGroup.js @@ -0,0 +1,115 @@ +export default { + name: 'AccountGroup', + data() { + return { + groups: [] + } + }, + methods: { + async openModal() { + try { + this.dtClear() + await this.submitApi(); + $('#modalUserGroup').modal('show'); + this.dtRebuild() + showSuccessInfo("Groups fetched") + } catch (err) { + showErrorInfo(err) + } + }, + dtClear() { + $('#account_groups_table').DataTable().destroy(); + }, + dtRebuild() { + $('#account_groups_table').DataTable({ + "pageLength": 100, + "reloadData": true, + }).draw(); + }, + async handleLeaveGroup(group_id) { + try { + const ok = confirm("Are you sure to leave this group?"); + if (!ok) return; + + await this.leaveGroupApi(group_id); + this.dtClear() + await this.submitApi(); + this.dtRebuild() + showSuccessInfo("Group left") + } catch (err) { + showErrorInfo(err) + } + }, + async leaveGroupApi(group_id) { + try { + let payload = new FormData(); + payload.append("group_id", group_id) + await http.post(`/group/leave`, payload) + } catch (error) { + if (error.response) { + throw new Error(error.response.data.message); + } + throw new Error(error.message); + + } + }, + async submitApi() { + try { + let response = await http.get(`/user/my/groups`) + this.groups = response.data.results.data; + } catch (error) { + if (error.response) { + throw new Error(error.response.data.message); + } + throw new Error(error.message); + + } + }, + formatDate: function (value) { + if (!value) return '' + return moment(value).format('LLL'); + } + }, + template: ` +
+
+
My List Groups
+
+ Display all groups you joined +
+
+
+ + + + ` +} \ No newline at end of file diff --git a/src/views/components/AccountUserInfo.js b/src/views/components/AccountUserInfo.js index 73fed8e..9be0786 100644 --- a/src/views/components/AccountUserInfo.js +++ b/src/views/components/AccountUserInfo.js @@ -25,13 +25,13 @@ export default { }, async handleSubmit() { try { - await this.infoApi(); + await this.submitApi(); showSuccessInfo("Info fetched") } catch (err) { showErrorInfo(err) } }, - async infoApi() { + async submitApi() { this.loading = true; try { let response = await http.get(`/user/info?phone=${this.phone_id}`) diff --git a/src/views/components/MessageReact.js b/src/views/components/MessageReact.js index 2421fd6..1c8e4d9 100644 --- a/src/views/components/MessageReact.js +++ b/src/views/components/MessageReact.js @@ -24,14 +24,14 @@ export default { }, async handleSubmit() { try { - let response = await this.messageApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalMessageReaction').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async messageApi() { + async submitApi() { this.loading = true; try { const payload = {phone: this.phone_id, emoji: this.emoji} diff --git a/src/views/components/MessageRevoke.js b/src/views/components/MessageRevoke.js index 3b0073d..cda6b1e 100644 --- a/src/views/components/MessageRevoke.js +++ b/src/views/components/MessageRevoke.js @@ -23,14 +23,14 @@ export default { }, async handleSubmit() { try { - let response = await this.messageApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalMessageRevoke').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async messageApi() { + async submitApi() { this.loading = true; try { const payload = {phone: this.phone_id} diff --git a/src/views/components/MessageUpdate.js b/src/views/components/MessageUpdate.js index 3bb0f13..ad51904 100644 --- a/src/views/components/MessageUpdate.js +++ b/src/views/components/MessageUpdate.js @@ -24,14 +24,14 @@ export default { }, async handleSubmit() { try { - let response = await this.messageApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalMessageUpdate').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async messageApi() { + async submitApi() { this.loading = true; try { const payload = {phone: this.phone_id, message: this.new_message} diff --git a/src/views/components/SendAudio.js b/src/views/components/SendAudio.js index 1383c0d..0e5e3a2 100644 --- a/src/views/components/SendAudio.js +++ b/src/views/components/SendAudio.js @@ -22,14 +22,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalAudioSend').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { let payload = new FormData(); diff --git a/src/views/components/SendContact.js b/src/views/components/SendContact.js index e8706f6..0081691 100644 --- a/src/views/components/SendContact.js +++ b/src/views/components/SendContact.js @@ -25,7 +25,7 @@ export default { async handleSubmit() { try { this.loading = true; - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalSendContact').modal('hide'); } catch (err) { @@ -34,7 +34,7 @@ export default { this.loading = false; } }, - async sendApi() { + async submitApi() { this.loading = true; try { const payload = { diff --git a/src/views/components/SendFile.js b/src/views/components/SendFile.js index 3d2e302..b05720b 100644 --- a/src/views/components/SendFile.js +++ b/src/views/components/SendFile.js @@ -29,14 +29,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalSendFile').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { let payload = new FormData(); diff --git a/src/views/components/SendImage.js b/src/views/components/SendImage.js index 8b50908..1402fad 100644 --- a/src/views/components/SendImage.js +++ b/src/views/components/SendImage.js @@ -26,14 +26,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalSendImage').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { let payload = new FormData(); diff --git a/src/views/components/SendLocation.js b/src/views/components/SendLocation.js index 5b7653a..6d83238 100644 --- a/src/views/components/SendLocation.js +++ b/src/views/components/SendLocation.js @@ -24,14 +24,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalSendLocation').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { const payload = { diff --git a/src/views/components/SendMessage.js b/src/views/components/SendMessage.js index cc76e8f..6cdaf28 100644 --- a/src/views/components/SendMessage.js +++ b/src/views/components/SendMessage.js @@ -24,14 +24,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalSendMessage').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { const payload = { diff --git a/src/views/components/SendPoll.js b/src/views/components/SendPoll.js index c44a673..d3b158f 100644 --- a/src/views/components/SendPoll.js +++ b/src/views/components/SendPoll.js @@ -26,14 +26,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() window.showSuccessInfo(response) $('#modalSendPoll').modal('hide'); } catch (err) { window.showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { const payload = { diff --git a/src/views/components/SendVideo.js b/src/views/components/SendVideo.js index fb8bc05..a0fcf10 100644 --- a/src/views/components/SendVideo.js +++ b/src/views/components/SendVideo.js @@ -32,14 +32,14 @@ export default { }, async handleSubmit() { try { - let response = await this.sendApi() + let response = await this.submitApi() showSuccessInfo(response) $('#modalSendVideo').modal('hide'); } catch (err) { showErrorInfo(err) } }, - async sendApi() { + async submitApi() { this.loading = true; try { let payload = new FormData(); diff --git a/src/views/index.html b/src/views/index.html index 443ad44..294a361 100644 --- a/src/views/index.html +++ b/src/views/index.html @@ -100,23 +100,9 @@

[[ app_name ]]

-
-
-
Avatar
-
- You can search someone avatar by phone -
-
-
+ -
-
-
My List Groups
-
- Display all groups you joined -
-
-
+
My Privacy Setting
@@ -154,38 +140,6 @@

[[ app_name ]]

- - -
- - - -