Files
web/app/components/common/Phone.vue
2026-05-05 11:06:49 +07:00

83 lines
1.8 KiB
Vue

<template>
<div>
<p class="fsb-30">
{{ text }}
<a
class="ml-3"
@click="copy()"
>
<SvgIcon v-bind="{ name: 'copy.svg', type: 'primary', size: 24 }"></SvgIcon>
</a>
</p>
<p class="buttons mt-4">
<button
class="button is-primary"
@click="call()"
>
Call
</button>
<button
class="button is-primary"
@click="sms()"
>
SMS
</button>
<button
class="button is-primary"
@click="openZalo()"
>
Zalo
</button>
</p>
<Modal
@close="showmodal = undefined"
v-bind="showmodal"
v-if="showmodal"
></Modal>
</div>
</template>
<script>
export default {
props: ["row", "pagename"],
data() {
return {
text: undefined,
phone: this.row.customer__phone || this.row.party__phone || this.row.phone,
showmodal: undefined,
};
},
created() {
var format = function (s) {
return `${s.slice(0, 3)} ${s.slice(3, 6)} ${s.slice(6, 20)}`;
};
this.text = format(this.phone);
},
methods: {
call() {
window.open(`tel:${this.phone}`);
},
sms() {
window.open(`sms:${this.phone}`);
},
sendSms() {
let api = this.row.code.indexOf("CN") >= 0 ? "customersms" : undefined;
if (this.row.code.indexOf("LN") >= 0) api = "loansms";
else if (this.row.code.indexOf("TS") >= 0) api = "collateralsms";
this.showmodal = {
component: "user/Sms",
title: "Nhắn tin SMS",
width: "50%",
height: "400px",
vbind: { row: this.row, pagename: this.pagename, api: api },
};
},
copy() {
this.$copyToClipboard(this.phone);
},
openZalo() {
window.open(`https://zalo.me/${this.phone}`, "_blank");
},
},
};
</script>