mirror of
https://github.com/EvolutionAPI/evolution-manager.git
synced 2025-07-13 07:04:50 -06:00
100 lines
2.3 KiB
Vue
100 lines
2.3 KiB
Vue
<template>
|
|
<v-alert
|
|
icon="mdi-qrcode-scan"
|
|
v-if="instance.instance?.status != 'open'"
|
|
type="warning"
|
|
>
|
|
<div class="d-flex justify-space-between align-center flex-wrap">
|
|
<span>Telefone não conectado</span>
|
|
<v-btn @click="startConnect" size="small"> Conectar </v-btn>
|
|
</div>
|
|
</v-alert>
|
|
<v-dialog v-model="dialog" max-width="350px">
|
|
<v-card :loading="loading && qrCode">
|
|
<v-card-text>
|
|
<v-img v-if="qrCode" :src="qrCode" width="300px" height="300px" />
|
|
<v-card
|
|
v-else
|
|
width="300px"
|
|
height="300px"
|
|
variant="outlined"
|
|
elevation="0"
|
|
>
|
|
<v-card-text class="d-flex justify-center align-center h-100">
|
|
<v-progress-circular indeterminate color="primary" />
|
|
</v-card-text>
|
|
</v-card>
|
|
|
|
<v-alert type="error" v-if="error">
|
|
{{ Array.isArray(error) ? error.join(", ") : error }}
|
|
</v-alert>
|
|
</v-card-text>
|
|
<v-card-actions>
|
|
<v-spacer></v-spacer>
|
|
<v-btn text @click="dialog = false" :disabled="loading"> Cancel </v-btn>
|
|
<v-spacer></v-spacer>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
import { useAppStore } from "@/store/app";
|
|
import instanceController from "@/services/instanceController";
|
|
|
|
export default {
|
|
name: "SettingsModal",
|
|
data: () => ({
|
|
dialog: false,
|
|
error: false,
|
|
|
|
loading: false,
|
|
qrCode: null,
|
|
success: false,
|
|
|
|
timeout: null,
|
|
|
|
AppStore: useAppStore(),
|
|
}),
|
|
methods: {
|
|
async loadQr() {
|
|
try {
|
|
this.loading = true;
|
|
this.error = false;
|
|
|
|
const response = await instanceController.connect(
|
|
this.instance.instance.instanceName
|
|
);
|
|
|
|
if (response.base64) this.qrCode = response.base64;
|
|
else {
|
|
this.dialog = false;
|
|
return;
|
|
}
|
|
this.timeout = setTimeout(this.loadQr, 40000);
|
|
} catch (e) {
|
|
this.error = e.message?.message || e.message || e;
|
|
} finally {
|
|
this.loading = false;
|
|
}
|
|
},
|
|
async startConnect() {
|
|
clearTimeout(this.timeout);
|
|
this.dialog = true;
|
|
this.error = false;
|
|
|
|
await this.loadQr();
|
|
await this.AppStore.reconnect();
|
|
},
|
|
},
|
|
props: {
|
|
instance: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
},
|
|
|
|
emits: ["close"],
|
|
};
|
|
</script>
|