Skip to main content
Glama
AccountAvatar.js3.65 kB
import FormRecipient from "./generic/FormRecipient.js"; export default { name: 'AccountAvatar', components: { FormRecipient }, data() { return { type: window.TYPEUSER, phone: '', image: null, loading: false, is_preview: false, is_community: false, } }, computed: { phone_id() { return this.phone + this.type; } }, methods: { async openModal() { this.handleReset(); $('#modalUserAvatar').modal('show'); }, isValidForm() { if (!this.phone.trim()) { return false; } return true; }, async handleSubmit() { if (!this.isValidForm() || this.loading) { return; } try { await this.submitApi(); showSuccessInfo("Avatar fetched") } catch (err) { showErrorInfo(err) } }, async submitApi() { this.loading = true; try { let response = await window.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 = window.TYPEUSER; } }, template: ` <div class="olive card" @click="openModal" style="cursor: pointer;"> <div class="content"> <a class="ui olive right ribbon label">Account</a> <div class="header">Avatar</div> <div class="description"> You can search someone avatar by phone </div> </div> </div> <!-- Modal UserAvatar --> <div class="ui small modal" id="modalUserAvatar"> <i class="close icon"></i> <div class="header"> Search User Avatar </div> <div class="content"> <form class="ui form"> <FormRecipient v-model:type="type" v-model:phone="phone"/> <div class="field"> <label>Preview</label> <div class="ui toggle checkbox"> <input type="checkbox" aria-label="compress" v-model="is_preview"> <label>Check for small size image</label> </div> </div> <div class="field"> <label>Community</label> <div class="ui toggle checkbox"> <input type="checkbox" aria-label="compress" v-model="is_community"> <label>Check is it's community image</label> </div> </div> <button type="button" class="ui primary button" :class="{'loading': loading, 'disabled': !this.isValidForm() || this.loading}" @click.prevent="handleSubmit"> Search </button> </form> <div v-if="image != null" class="center"> <img :src="image" alt="profile picture" style="padding-top: 10px; max-height: 200px"> </div> </div> </div> ` }

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/samihalawa/whatsapp-go-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server