feat: send one SMS from a person or lead and keep the dashboard inside the phone frame
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Cursor
@@ -0,0 +1,35 @@
|
||||
import { jalaliMonthName, toJalali } from './jalali';
|
||||
import { applyMessageTemplate } from '../message-automations/message-automation.util';
|
||||
|
||||
const FA_DIGITS = '۰۱۲۳۴۵۶۷۸۹';
|
||||
|
||||
function toFaDigits(value: string | number) {
|
||||
return String(value).replace(/\d/g, (d) => FA_DIGITS[Number(d)] ?? d);
|
||||
}
|
||||
|
||||
function tehranJalaliLong(d: Date) {
|
||||
const [gy, gm, gd] = new Intl.DateTimeFormat('en-CA', {
|
||||
timeZone: 'Asia/Tehran',
|
||||
year: 'numeric',
|
||||
month: '2-digit',
|
||||
day: '2-digit',
|
||||
})
|
||||
.format(d)
|
||||
.split('-')
|
||||
.map(Number);
|
||||
const j = toJalali(gy, gm, gd);
|
||||
return `${toFaDigits(j.jd)} ${jalaliMonthName(j.jm)} ${toFaDigits(j.jy)}`;
|
||||
}
|
||||
|
||||
export function renderSmsText(
|
||||
text: string,
|
||||
vars: { name?: string; phone?: string; title?: string; company?: string },
|
||||
) {
|
||||
return applyMessageTemplate(text, {
|
||||
name: vars.name,
|
||||
phone: vars.phone,
|
||||
title: vars.title,
|
||||
company: vars.company,
|
||||
date: tehranJalaliLong(new Date()),
|
||||
}).trim();
|
||||
}
|
||||
@@ -110,6 +110,15 @@ export class PeopleController {
|
||||
return this.peopleService.birthdaysThisMonth(user);
|
||||
}
|
||||
|
||||
@Post(':id/sms')
|
||||
sms(
|
||||
@CurrentUser() user: Actor,
|
||||
@Param('id') id: string,
|
||||
@Body() dto: BirthdaySmsDto,
|
||||
) {
|
||||
return this.peopleService.sendSms(user, id, dto.text);
|
||||
}
|
||||
|
||||
@Post(':id/birthday-sms')
|
||||
birthdaySms(
|
||||
@CurrentUser() user: Actor,
|
||||
|
||||
@@ -39,7 +39,8 @@ import { WebhooksService } from '../public-api/webhooks.service';
|
||||
import { GamificationService } from '../gamification/gamification.service';
|
||||
import { parseBirthDate } from '../common/excel';
|
||||
import { SmsService } from '../common/sms.service';
|
||||
import { fillBirthdaySmsText, selectMonthBirthdays } from './birthday-month';
|
||||
import { selectMonthBirthdays } from './birthday-month';
|
||||
import { renderSmsText } from '../common/sms-text';
|
||||
import { normalizeTags } from '../common/tags';
|
||||
import { buildSearchWhere, ci } from '../common/search';
|
||||
import {
|
||||
@@ -467,6 +468,7 @@ export class PeopleService implements OnModuleInit {
|
||||
mobile: true,
|
||||
phone: true,
|
||||
birthDate: true,
|
||||
company: { select: { name: true } },
|
||||
},
|
||||
});
|
||||
const selected = selectMonthBirthdays(
|
||||
@@ -484,12 +486,14 @@ export class PeopleService implements OnModuleInit {
|
||||
: [],
|
||||
),
|
||||
);
|
||||
const companyById = new Map(rows.map((row) => [row.id, row.company?.name ?? '']));
|
||||
const toItem = (row: (typeof selected.items)[number]) => ({
|
||||
id: row.id,
|
||||
firstName: row.firstName,
|
||||
lastName: row.lastName,
|
||||
fullName: `${row.firstName} ${row.lastName}`.trim(),
|
||||
mobile: row.mobile,
|
||||
company: companyById.get(row.id) ?? '',
|
||||
day: row.day,
|
||||
});
|
||||
return {
|
||||
@@ -517,6 +521,7 @@ export class PeopleService implements OnModuleInit {
|
||||
phone: true,
|
||||
ownerId: true,
|
||||
birthDate: true,
|
||||
company: { select: { name: true } },
|
||||
},
|
||||
});
|
||||
if (!person) throw new NotFoundException('مشتری پیدا نشد');
|
||||
@@ -542,7 +547,40 @@ export class PeopleService implements OnModuleInit {
|
||||
}
|
||||
const mobile = person.mobile || person.phone;
|
||||
if (!mobile) throw new BadRequestException('برای این مشتری شماره موبایل ثبت نشده است.');
|
||||
const message = fillBirthdaySmsText(body, person.firstName, person.lastName);
|
||||
const fullName = `${person.firstName} ${person.lastName}`.trim();
|
||||
const message = renderSmsText(body, {
|
||||
name: fullName,
|
||||
phone: mobile,
|
||||
title: fullName,
|
||||
company: person.company?.name ?? '',
|
||||
});
|
||||
if (!message) throw new BadRequestException('متن پیامک خالی است.');
|
||||
const result = await this.sms.sendSmsDetailed(mobile, message);
|
||||
if (!result.ok) {
|
||||
throw new ServiceUnavailableException(
|
||||
result.reason === 'SMS not configured'
|
||||
? 'ارسال پیامک روی سرور فعال نیست.'
|
||||
: 'پیامک ارسال نشد. کمی بعد دوباره تلاش کنید.',
|
||||
);
|
||||
}
|
||||
return { ok: true };
|
||||
}
|
||||
|
||||
async sendSms(actor: Actor, personId: string, text: string) {
|
||||
const body = text.trim();
|
||||
if (!body || body.length > 500) {
|
||||
throw new BadRequestException('متن پیامک را تا ۵۰۰ نویسه بنویسید.');
|
||||
}
|
||||
const person = await this.get(actor, personId);
|
||||
const mobile = person.mobile || person.phone;
|
||||
if (!mobile) throw new BadRequestException('برای این مشتری شماره موبایل ثبت نشده است.');
|
||||
const message = renderSmsText(body, {
|
||||
name: person.fullName,
|
||||
phone: mobile,
|
||||
title: person.fullName,
|
||||
company: person.company?.name ?? '',
|
||||
});
|
||||
if (!message) throw new BadRequestException('متن پیامک خالی است.');
|
||||
const result = await this.sms.sendSmsDetailed(mobile, message);
|
||||
if (!result.ok) {
|
||||
throw new ServiceUnavailableException(
|
||||
|
||||
@@ -5,9 +5,17 @@ import {
|
||||
IsNumber,
|
||||
IsOptional,
|
||||
IsString,
|
||||
MaxLength,
|
||||
MinLength,
|
||||
} from 'class-validator';
|
||||
|
||||
export class LeadSmsDto {
|
||||
@IsString()
|
||||
@MinLength(1)
|
||||
@MaxLength(500)
|
||||
text!: string;
|
||||
}
|
||||
|
||||
export class CreateLeadDto {
|
||||
@IsString()
|
||||
@MinLength(1)
|
||||
|
||||
@@ -37,6 +37,7 @@ import {
|
||||
LeadCallLogDto,
|
||||
LeadFollowUpDto,
|
||||
LeadNoteDto,
|
||||
LeadSmsDto,
|
||||
MoveLeadDto,
|
||||
ReorderLeadStagesDto,
|
||||
UpdateLeadDto,
|
||||
@@ -346,6 +347,15 @@ export class LeadsController {
|
||||
return this.leads.move(user, id, dto.stageId, dto.position);
|
||||
}
|
||||
|
||||
@Post(':id/sms')
|
||||
sms(
|
||||
@CurrentUser() user: Actor,
|
||||
@Param('id') id: string,
|
||||
@Body() dto: LeadSmsDto,
|
||||
) {
|
||||
return this.leads.sendSms(user, id, dto.text);
|
||||
}
|
||||
|
||||
@Post(':id/call')
|
||||
logCall(
|
||||
@CurrentUser() user: Actor,
|
||||
|
||||
@@ -5,11 +5,12 @@ import { LeadStagesService } from './lead-stages.service';
|
||||
import { LeadsController } from './leads.controller';
|
||||
import { LeadsImportService } from './leads-import.service';
|
||||
import { LeadsService } from './leads.service';
|
||||
import { SmsService } from '../common/sms.service';
|
||||
|
||||
@Module({
|
||||
imports: [AuthModule, BillingModule],
|
||||
controllers: [LeadsController],
|
||||
providers: [LeadsService, LeadStagesService, LeadsImportService],
|
||||
providers: [LeadsService, LeadStagesService, LeadsImportService, SmsService],
|
||||
exports: [LeadsService, LeadStagesService],
|
||||
})
|
||||
export class LeadsModule {}
|
||||
|
||||
@@ -3,6 +3,7 @@ import {
|
||||
ConflictException,
|
||||
Injectable,
|
||||
NotFoundException,
|
||||
ServiceUnavailableException,
|
||||
} from '@nestjs/common';
|
||||
import { Prisma } from '@prisma/client';
|
||||
import { parseBirthDate } from '../common/excel';
|
||||
@@ -18,6 +19,8 @@ import type {
|
||||
PaginatedResponse,
|
||||
} from '@mento/shared';
|
||||
import { PrismaService } from '../prisma/prisma.service';
|
||||
import { SmsService } from '../common/sms.service';
|
||||
import { renderSmsText } from '../common/sms-text';
|
||||
import {
|
||||
type Actor,
|
||||
elevated,
|
||||
@@ -81,6 +84,7 @@ export class LeadsService {
|
||||
private readonly stages: LeadStagesService,
|
||||
private readonly files: LocalFileStorage,
|
||||
private readonly game: GamificationService,
|
||||
private readonly sms: SmsService,
|
||||
) {}
|
||||
|
||||
private gameEvent(
|
||||
@@ -1203,6 +1207,34 @@ export class LeadsService {
|
||||
return this.toDto(row);
|
||||
}
|
||||
|
||||
async sendSms(actor: Actor, id: string, text: string) {
|
||||
const body = text.trim();
|
||||
if (!body || body.length > 500) {
|
||||
throw new BadRequestException('متن پیامک را تا ۵۰۰ نویسه بنویسید.');
|
||||
}
|
||||
const lead = await this.findAccessible(actor, id);
|
||||
const mobile = lead.mobile || lead.phone;
|
||||
if (!mobile) throw new BadRequestException('برای این لید شماره موبایل ثبت نشده است.');
|
||||
const name = (lead.contactName || lead.title).trim();
|
||||
const message = renderSmsText(body, {
|
||||
name,
|
||||
phone: mobile,
|
||||
title: lead.title,
|
||||
company: lead.contactName ? lead.title : '',
|
||||
});
|
||||
if (!message) throw new BadRequestException('متن پیامک خالی است.');
|
||||
const result = await this.sms.sendSmsDetailed(mobile, message);
|
||||
if (!result.ok) {
|
||||
throw new ServiceUnavailableException(
|
||||
result.reason === 'SMS not configured'
|
||||
? 'ارسال پیامک روی سرور فعال نیست.'
|
||||
: 'پیامک ارسال نشد. کمی بعد دوباره تلاش کنید.',
|
||||
);
|
||||
}
|
||||
await this.addEvent(actor, id, 'note', 'پیامک ارسال شد', message);
|
||||
return { ok: true };
|
||||
}
|
||||
|
||||
async openLogo(actor: Actor, id: string) {
|
||||
const existing = await this.findAccessible(actor, id);
|
||||
if (!existing.logoStorageKey) {
|
||||
|
||||
@@ -0,0 +1,287 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import axios from 'axios';
|
||||
import { MESSAGE_AUTOMATION_FIELDS, MESSAGE_AUTOMATION_SMS_SEGMENT } from '@mento/shared';
|
||||
import { api } from '@/lib/api';
|
||||
import { formatJalaliDay, toFaDigits } from '@/lib/jalali';
|
||||
import { UiButton, UiModal } from '@/components/ui';
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
open: boolean;
|
||||
endpoint: string;
|
||||
name: string;
|
||||
phone: string;
|
||||
recordTitle?: string;
|
||||
company?: string;
|
||||
title?: string;
|
||||
defaultText?: string;
|
||||
nest?: boolean;
|
||||
}>(),
|
||||
{
|
||||
recordTitle: '',
|
||||
company: '',
|
||||
title: 'ارسال پیامک',
|
||||
defaultText: 'سلام {نام} عزیز',
|
||||
nest: false,
|
||||
},
|
||||
);
|
||||
|
||||
const emit = defineEmits<{
|
||||
close: [];
|
||||
sent: [];
|
||||
}>();
|
||||
|
||||
const text = ref('');
|
||||
const busy = ref(false);
|
||||
const error = ref('');
|
||||
const done = ref('');
|
||||
const fieldsOpen = ref(false);
|
||||
const bodyEl = ref<HTMLTextAreaElement | null>(null);
|
||||
|
||||
const preview = computed(() => fill(text.value));
|
||||
const count = computed(() => text.value.length);
|
||||
const parts = computed(() => (count.value === 0 ? 0 : Math.ceil(count.value / MESSAGE_AUTOMATION_SMS_SEGMENT)));
|
||||
|
||||
watch(
|
||||
() => props.open,
|
||||
(open) => {
|
||||
if (!open) return;
|
||||
text.value = props.defaultText;
|
||||
error.value = '';
|
||||
done.value = '';
|
||||
fieldsOpen.value = false;
|
||||
busy.value = false;
|
||||
},
|
||||
);
|
||||
|
||||
function fill(source: string) {
|
||||
const map: Record<string, string> = {
|
||||
نام: props.name,
|
||||
name: props.name,
|
||||
شماره: props.phone,
|
||||
phone: props.phone,
|
||||
تاریخ: formatJalaliDay(new Date()),
|
||||
date: formatJalaliDay(new Date()),
|
||||
عنوان: props.recordTitle || props.name,
|
||||
title: props.recordTitle || props.name,
|
||||
شرکت: props.company,
|
||||
company: props.company,
|
||||
};
|
||||
return source.replace(/\{([^}]+)\}/g, (full, key: string) => {
|
||||
const next = map[key.trim()];
|
||||
return next === undefined ? full : next;
|
||||
});
|
||||
}
|
||||
|
||||
function insertField(token: string) {
|
||||
const el = bodyEl.value;
|
||||
const current = text.value;
|
||||
if (!el) {
|
||||
text.value = `${current}${token}`;
|
||||
} else {
|
||||
const start = el.selectionStart ?? current.length;
|
||||
const end = el.selectionEnd ?? start;
|
||||
text.value = `${current.slice(0, start)}${token}${current.slice(end)}`;
|
||||
const caret = start + token.length;
|
||||
requestAnimationFrame(() => {
|
||||
el.focus();
|
||||
el.setSelectionRange(caret, caret);
|
||||
});
|
||||
}
|
||||
fieldsOpen.value = false;
|
||||
}
|
||||
|
||||
function apiMessage(e: unknown, fallback: string) {
|
||||
if (!axios.isAxiosError(e)) return fallback;
|
||||
const msg = (e.response?.data as { message?: string | string[] })?.message;
|
||||
if (Array.isArray(msg)) return msg.join('، ') || fallback;
|
||||
if (typeof msg === 'string' && msg.trim()) return msg;
|
||||
return fallback;
|
||||
}
|
||||
|
||||
async function send() {
|
||||
if (!props.endpoint || busy.value || done.value) return;
|
||||
busy.value = true;
|
||||
error.value = '';
|
||||
try {
|
||||
await api.post(props.endpoint, { text: text.value });
|
||||
done.value = 'پیامک ارسال شد.';
|
||||
emit('sent');
|
||||
} catch (e) {
|
||||
error.value = apiMessage(e, 'ارسال پیامک ناموفق بود.');
|
||||
} finally {
|
||||
busy.value = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UiModal :open="open" :nest="nest" :title="title" @close="emit('close')">
|
||||
<p class="who">
|
||||
برای {{ name || 'این شخص' }}
|
||||
<span v-if="phone" dir="ltr">{{ toFaDigits(phone) }}</span>
|
||||
<span v-else class="warn">شماره موبایل ندارد</span>
|
||||
</p>
|
||||
|
||||
<div class="tools">
|
||||
<button type="button" class="pill" @click="fieldsOpen = !fieldsOpen">فیلدهای پویا</button>
|
||||
<div v-if="fieldsOpen" class="fields">
|
||||
<button
|
||||
v-for="item in MESSAGE_AUTOMATION_FIELDS"
|
||||
:key="item.token"
|
||||
type="button"
|
||||
@click="insertField(item.token)"
|
||||
>
|
||||
<code>{{ item.token }}</code>
|
||||
<span>{{ item.label }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<textarea ref="bodyEl" v-model="text" rows="4" maxlength="500" placeholder="سلام {نام} عزیز" />
|
||||
<p class="count">{{ toFaDigits(count) }} نویسه · {{ toFaDigits(parts) }} پیامک</p>
|
||||
|
||||
<div class="preview">
|
||||
<span>پیشنمایش</span>
|
||||
<p>{{ preview || 'متن پیام هنوز نوشته نشده است.' }}</p>
|
||||
</div>
|
||||
|
||||
<p v-if="error" class="err">{{ error }}</p>
|
||||
<p v-if="done" class="ok">{{ done }}</p>
|
||||
|
||||
<template #footer>
|
||||
<UiButton variant="ghost" :disabled="busy" @click="emit('close')">بستن</UiButton>
|
||||
<UiButton
|
||||
variant="primary"
|
||||
:loading="busy"
|
||||
:disabled="busy || !!done || !phone || text.trim().length < 2"
|
||||
@click="send"
|
||||
>
|
||||
ارسال پیامک
|
||||
</UiButton>
|
||||
</template>
|
||||
</UiModal>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.who {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin: 0 0 0.7rem;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.who span {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #64748b;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.warn {
|
||||
color: #b45309;
|
||||
}
|
||||
|
||||
.tools {
|
||||
position: relative;
|
||||
margin-bottom: 0.45rem;
|
||||
}
|
||||
|
||||
.pill,
|
||||
.fields button {
|
||||
border: 1px solid color-mix(in srgb, var(--accent) 28%, #fff);
|
||||
background: var(--accent-subtle);
|
||||
color: var(--accent-deep);
|
||||
border-radius: 999px;
|
||||
font: inherit;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.pill {
|
||||
padding: 0.28rem 0.7rem;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.fields {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
top: calc(100% + 0.3rem);
|
||||
inset-inline: 0;
|
||||
display: grid;
|
||||
gap: 0.25rem;
|
||||
max-width: 100%;
|
||||
padding: 0.4rem;
|
||||
background: #fff;
|
||||
border: 1px solid #e7eef2;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
|
||||
}
|
||||
|
||||
.fields button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 0.6rem;
|
||||
border-radius: 8px;
|
||||
padding: 0.35rem 0.5rem;
|
||||
background: #fff;
|
||||
text-align: start;
|
||||
}
|
||||
|
||||
.fields code {
|
||||
color: var(--accent-deep);
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
padding: 0.7rem 0.8rem;
|
||||
font: inherit;
|
||||
resize: vertical;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.count {
|
||||
margin: 0.35rem 0 0;
|
||||
color: #94a3b8;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.preview {
|
||||
margin-top: 0.75rem;
|
||||
padding: 0.7rem 0.8rem;
|
||||
border-radius: 12px;
|
||||
background: var(--accent-subtle);
|
||||
}
|
||||
|
||||
.preview span {
|
||||
color: var(--accent-deep);
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.preview p {
|
||||
margin: 0.3rem 0 0;
|
||||
color: #134e4a;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.err,
|
||||
.ok {
|
||||
margin: 0.55rem 0 0;
|
||||
font-size: 0.82rem;
|
||||
}
|
||||
|
||||
.err {
|
||||
color: #dc2626;
|
||||
}
|
||||
|
||||
.ok {
|
||||
color: #16a34a;
|
||||
}
|
||||
</style>
|
||||
@@ -1,11 +1,11 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, ref } from 'vue';
|
||||
import { RouterLink } from 'vue-router';
|
||||
import axios from 'axios';
|
||||
import { api } from '@/lib/api';
|
||||
import { toFaDigits } from '@/lib/jalali';
|
||||
import UiIcon from '@/components/UiIcon.vue';
|
||||
import { UiButton, UiModal, UiTextarea } from '@/components/ui';
|
||||
import { UiButton, UiModal } from '@/components/ui';
|
||||
import SmsComposeModal from '@/components/SmsComposeModal.vue';
|
||||
|
||||
type BirthdayItem = {
|
||||
id: string;
|
||||
@@ -13,6 +13,7 @@ type BirthdayItem = {
|
||||
lastName: string;
|
||||
fullName: string;
|
||||
mobile: string | null;
|
||||
company?: string;
|
||||
day: number;
|
||||
};
|
||||
|
||||
@@ -27,10 +28,6 @@ type BirthdayMonth = {
|
||||
const data = ref<BirthdayMonth | null>(null);
|
||||
const listOpen = ref(false);
|
||||
const smsTarget = ref<BirthdayItem | null>(null);
|
||||
const smsText = ref('');
|
||||
const smsBusy = ref(false);
|
||||
const smsError = ref('');
|
||||
const smsDone = ref('');
|
||||
|
||||
const groups = computed(() => {
|
||||
const map = new Map<number, BirthdayItem[]>();
|
||||
@@ -42,34 +39,8 @@ const groups = computed(() => {
|
||||
return [...map.entries()].sort((a, b) => a[0] - b[0]);
|
||||
});
|
||||
|
||||
function apiMessage(e: unknown, fallback: string) {
|
||||
if (!axios.isAxiosError(e)) return fallback;
|
||||
const msg = (e.response?.data as { message?: string | string[] })?.message;
|
||||
if (Array.isArray(msg)) return msg.join('، ') || fallback;
|
||||
if (typeof msg === 'string' && msg.trim()) return msg;
|
||||
return fallback;
|
||||
}
|
||||
|
||||
function openSms(person: BirthdayItem) {
|
||||
smsTarget.value = person;
|
||||
smsText.value = `${person.fullName} عزیز، تولدتان مبارک.`;
|
||||
smsError.value = '';
|
||||
smsDone.value = '';
|
||||
}
|
||||
|
||||
async function sendSms() {
|
||||
const person = smsTarget.value;
|
||||
if (!person || smsBusy.value) return;
|
||||
smsBusy.value = true;
|
||||
smsError.value = '';
|
||||
try {
|
||||
await api.post(`/people/${person.id}/birthday-sms`, { text: smsText.value });
|
||||
smsDone.value = `پیامک برای ${person.fullName} ارسال شد.`;
|
||||
} catch (e) {
|
||||
smsError.value = apiMessage(e, 'ارسال پیامک ناموفق بود.');
|
||||
} finally {
|
||||
smsBusy.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
@@ -97,22 +68,28 @@ onMounted(async () => {
|
||||
v-for="person in data.preview"
|
||||
:key="person.id"
|
||||
class="chip"
|
||||
:title="person.fullName"
|
||||
:to="{ name: 'person-detail', params: { id: person.id } }"
|
||||
>
|
||||
<b>{{ toFaDigits(person.day) }} {{ data.monthName }}</b>
|
||||
<b>{{ toFaDigits(person.day) }}</b>
|
||||
<span>{{ person.fullName }}</span>
|
||||
</RouterLink>
|
||||
<button v-if="data.total > data.preview.length" type="button" class="more" @click="listOpen = true">
|
||||
همه
|
||||
</button>
|
||||
<button v-else type="button" class="more" @click="listOpen = true">فهرست و پیامک</button>
|
||||
</div>
|
||||
<button type="button" class="more" @click="listOpen = true">
|
||||
{{ data.total > data.preview.length ? 'همه' : 'فهرست' }}
|
||||
</button>
|
||||
|
||||
<UiModal :open="listOpen" :title="`تولدهای ${data.monthName}`" @close="listOpen = false">
|
||||
<div class="days">
|
||||
<section v-for="[day, people] in groups" :key="day" class="day">
|
||||
<section
|
||||
v-for="[day, people] in groups"
|
||||
:key="day"
|
||||
class="day"
|
||||
:class="{ past: day < data.today, today: day === data.today }"
|
||||
>
|
||||
<h3>
|
||||
{{ toFaDigits(day) }} {{ data.monthName }}
|
||||
<b>{{ toFaDigits(day) }}</b>
|
||||
<span>{{ data.monthName }}</span>
|
||||
<em v-if="day < data.today">گذشته</em>
|
||||
<em v-else-if="day === data.today">امروز</em>
|
||||
</h3>
|
||||
@@ -121,38 +98,32 @@ onMounted(async () => {
|
||||
<RouterLink :to="{ name: 'person-detail', params: { id: person.id } }" @click="listOpen = false">
|
||||
{{ person.fullName }}
|
||||
</RouterLink>
|
||||
<UiButton
|
||||
size="sm"
|
||||
variant="outline"
|
||||
<button
|
||||
type="button"
|
||||
class="sms"
|
||||
:disabled="!person.mobile"
|
||||
@click="openSms(person)"
|
||||
>
|
||||
{{ person.mobile ? 'پیامک تبریک' : 'بدون شماره' }}
|
||||
</UiButton>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</UiModal>
|
||||
|
||||
<UiModal
|
||||
:open="!!smsTarget"
|
||||
<SmsComposeModal
|
||||
nest
|
||||
:open="!!smsTarget"
|
||||
title="پیامک تبریک تولد"
|
||||
:endpoint="smsTarget ? `/people/${smsTarget.id}/birthday-sms` : ''"
|
||||
default-text="{نام} عزیز، تولدتان مبارک."
|
||||
:name="smsTarget?.fullName ?? ''"
|
||||
:phone="smsTarget?.mobile ?? ''"
|
||||
:record-title="smsTarget?.fullName ?? ''"
|
||||
:company="smsTarget?.company ?? ''"
|
||||
@close="smsTarget = null"
|
||||
>
|
||||
<p v-if="smsTarget" class="lead">برای {{ smsTarget.fullName }}</p>
|
||||
<UiTextarea v-model="smsText" :rows="4" />
|
||||
<p class="hint">میتوانید متن را عوض کنید. عبارت {نام} با نام مشتری جایگزین میشود.</p>
|
||||
<p v-if="smsError" class="err">{{ smsError }}</p>
|
||||
<p v-if="smsDone" class="ok">{{ smsDone }}</p>
|
||||
<template #footer>
|
||||
<UiButton variant="ghost" :disabled="smsBusy" @click="smsTarget = null">بستن</UiButton>
|
||||
<UiButton variant="primary" :loading="smsBusy" :disabled="smsBusy || !smsText.trim() || !!smsDone" @click="sendSms">
|
||||
ارسال پیامک
|
||||
</UiButton>
|
||||
</template>
|
||||
</UiModal>
|
||||
/>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
@@ -160,112 +131,223 @@ onMounted(async () => {
|
||||
.birthdays {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
background: #fff;
|
||||
border: 1px solid #eef2f7;
|
||||
gap: 0.75rem;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
background:
|
||||
linear-gradient(90deg, rgba(255, 255, 255, 0.35), transparent 42%),
|
||||
linear-gradient(100deg, var(--accent-subtle) 0%, #fff 58%, #fff7f4 100%);
|
||||
border: 1px solid color-mix(in srgb, var(--accent) 22%, #fff);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
|
||||
padding: 0.85rem 1rem;
|
||||
box-shadow: 0 6px 18px rgba(15, 118, 110, 0.05);
|
||||
padding: 0.55rem 0.75rem;
|
||||
}
|
||||
|
||||
.head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.7rem;
|
||||
gap: 0.55rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.ico {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 12px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 10px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
background: #fff7ed;
|
||||
color: #ea580c;
|
||||
background: #fff;
|
||||
color: #e11d48;
|
||||
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, #fff);
|
||||
}
|
||||
|
||||
.head strong {
|
||||
display: block;
|
||||
color: #0f172a;
|
||||
color: var(--accent-deep);
|
||||
font-size: 0.88rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.head p {
|
||||
margin: 0.15rem 0 0;
|
||||
color: #94a3b8;
|
||||
font-size: 0.82rem;
|
||||
margin: 0.05rem 0 0;
|
||||
color: #64748b;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.45rem;
|
||||
flex: 1 1 auto;
|
||||
flex-wrap: nowrap;
|
||||
gap: 0.35rem;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chip,
|
||||
.more {
|
||||
.chip {
|
||||
display: inline-flex;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
gap: 0.35rem;
|
||||
max-width: 11.5rem;
|
||||
min-width: 0;
|
||||
border-radius: 999px;
|
||||
border: 1px solid #fed7aa;
|
||||
background: #fff7ed;
|
||||
color: #9a3412;
|
||||
padding: 0.35rem 0.7rem;
|
||||
border: 1px solid color-mix(in srgb, var(--accent) 24%, #fff);
|
||||
background: rgba(255, 255, 255, 0.86);
|
||||
color: #134e4a;
|
||||
padding: 0.22rem 0.55rem 0.22rem 0.28rem;
|
||||
text-decoration: none;
|
||||
font: inherit;
|
||||
cursor: pointer;
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
|
||||
.chip b {
|
||||
flex-shrink: 0;
|
||||
font-weight: 700;
|
||||
font-size: 0.72rem;
|
||||
color: var(--accent-deep);
|
||||
background: var(--accent-soft);
|
||||
border-radius: 999px;
|
||||
padding: 0.12rem 0.38rem;
|
||||
}
|
||||
|
||||
.chip span {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.more {
|
||||
background: #0f172a;
|
||||
border-color: #0f172a;
|
||||
flex-shrink: 0;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: var(--accent);
|
||||
color: #fff;
|
||||
padding: 0.32rem 0.7rem;
|
||||
font: inherit;
|
||||
font-size: 0.78rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.more:hover {
|
||||
background: var(--accent-hover);
|
||||
}
|
||||
|
||||
.days {
|
||||
display: grid;
|
||||
gap: 0.9rem;
|
||||
max-height: 60vh;
|
||||
gap: 0.85rem;
|
||||
max-height: 62vh;
|
||||
overflow: auto;
|
||||
padding-inline-end: 0.15rem;
|
||||
}
|
||||
|
||||
.day {
|
||||
background: #fff;
|
||||
border: 1px solid #e7eef2;
|
||||
border-radius: 14px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.day h3 {
|
||||
margin: 0 0 0.4rem;
|
||||
font-size: 0.92rem;
|
||||
color: #0f172a;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
margin: 0;
|
||||
padding: 0.55rem 0.8rem;
|
||||
background: var(--accent-subtle);
|
||||
border-bottom: 1px solid color-mix(in srgb, var(--accent) 16%, #fff);
|
||||
font-size: 0.86rem;
|
||||
font-weight: 600;
|
||||
color: var(--accent-deep);
|
||||
}
|
||||
|
||||
.day h3 b {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
min-width: 1.7rem;
|
||||
height: 1.7rem;
|
||||
padding: 0 0.3rem;
|
||||
border-radius: 999px;
|
||||
background: var(--accent);
|
||||
color: #fff;
|
||||
font-size: 0.78rem;
|
||||
}
|
||||
|
||||
.day em {
|
||||
margin-inline-start: 0.4rem;
|
||||
margin-inline-start: auto;
|
||||
font-style: normal;
|
||||
font-size: 0.75rem;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 600;
|
||||
color: #94a3b8;
|
||||
background: #fff;
|
||||
border-radius: 999px;
|
||||
padding: 0.1rem 0.45rem;
|
||||
}
|
||||
|
||||
.day.today h3 {
|
||||
background: color-mix(in srgb, var(--accent-soft) 70%, #fff);
|
||||
}
|
||||
|
||||
.day.today em {
|
||||
color: var(--accent-deep);
|
||||
}
|
||||
|
||||
.day.past {
|
||||
opacity: 0.82;
|
||||
}
|
||||
|
||||
.day ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: grid;
|
||||
gap: 0.35rem;
|
||||
}
|
||||
|
||||
.day li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 0.6rem;
|
||||
gap: 0.75rem;
|
||||
padding: 0.62rem 0.85rem;
|
||||
border-top: 1px solid #eef2f6;
|
||||
}
|
||||
|
||||
.day li:first-child {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.day a {
|
||||
flex: 1 1 auto;
|
||||
color: #0f172a;
|
||||
text-decoration: none;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.day a:hover {
|
||||
color: var(--accent-deep);
|
||||
}
|
||||
|
||||
.sms {
|
||||
flex-shrink: 0;
|
||||
border: 1px solid color-mix(in srgb, var(--accent) 35%, #fff);
|
||||
background: #fff;
|
||||
color: var(--accent-deep);
|
||||
border-radius: 999px;
|
||||
padding: 0.28rem 0.65rem;
|
||||
font: inherit;
|
||||
font-size: 0.75rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sms:hover:not(:disabled) {
|
||||
background: var(--accent-subtle);
|
||||
}
|
||||
|
||||
.sms:disabled {
|
||||
border-color: #e2e8f0;
|
||||
color: #94a3b8;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.lead {
|
||||
@@ -293,8 +375,40 @@ onMounted(async () => {
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.birthdays {
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: 0.45rem 0.6rem;
|
||||
}
|
||||
|
||||
.head {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.head p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.more {
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
}
|
||||
|
||||
.chips {
|
||||
grid-column: 1 / -1;
|
||||
overflow-x: auto;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.chips::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.day li {
|
||||
gap: 0.45rem;
|
||||
padding-inline: 0.7rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -199,8 +199,10 @@ const shortcutLabel = computed(() =>
|
||||
|
||||
.hero-body {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
gap: 0.75rem;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
@@ -208,6 +210,12 @@ const shortcutLabel = computed(() =>
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.9rem;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.greet-text {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.hero-avatar {
|
||||
@@ -261,7 +269,8 @@ const shortcutLabel = computed(() =>
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 0.4rem;
|
||||
max-width: 580px;
|
||||
max-width: min(580px, 100%);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.chip {
|
||||
@@ -330,8 +339,9 @@ const shortcutLabel = computed(() =>
|
||||
.hero-ask-wrap {
|
||||
display: grid;
|
||||
gap: 0.45rem;
|
||||
max-width: 520px;
|
||||
max-width: min(520px, 100%);
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.hero-ask {
|
||||
@@ -339,6 +349,8 @@ const shortcutLabel = computed(() =>
|
||||
align-items: center;
|
||||
gap: 0.55rem;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
background: #fff;
|
||||
color: #0f172a;
|
||||
border-radius: 999px;
|
||||
@@ -425,19 +437,25 @@ const shortcutLabel = computed(() =>
|
||||
}
|
||||
|
||||
.hero-chips {
|
||||
grid-template-columns: 1fr;
|
||||
max-width: 420px;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
max-width: min(420px, 100%);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.hero {
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
min-height: auto;
|
||||
padding-inline: 0.85rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.hero-bot {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hero-ask kbd {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -228,7 +228,13 @@ onUnmounted(() => {
|
||||
<style scoped>
|
||||
.dashboard {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
gap: 1.15rem;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.dashboard > * {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.mid-grid {
|
||||
|
||||
@@ -19,6 +19,7 @@ import {
|
||||
UiTextarea,
|
||||
} from '@/components/ui';
|
||||
import RelatedTasksPanel from '@/components/routines/RelatedTasksPanel.vue';
|
||||
import SmsComposeModal from '@/components/SmsComposeModal.vue';
|
||||
import type {
|
||||
ActivityDto,
|
||||
ConvertLeadResult,
|
||||
@@ -57,6 +58,7 @@ const followUpAt = ref('');
|
||||
const followUpBody = ref('');
|
||||
const editing = ref(false);
|
||||
const moreOpen = ref(false);
|
||||
const smsOpen = ref(false);
|
||||
const copied = ref(false);
|
||||
const narrow = ref(typeof window !== 'undefined' && window.matchMedia('(max-width: 900px)').matches);
|
||||
let narrowMq: MediaQueryList | null = null;
|
||||
@@ -371,6 +373,15 @@ onBeforeUnmount(() => narrowMq?.removeEventListener('change', syncNarrow));
|
||||
:back-to="{ name: 'leads' }"
|
||||
>
|
||||
<template #actions>
|
||||
<UiButton
|
||||
v-if="lead && !editing"
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
:disabled="busy || !lead.mobile"
|
||||
@click="smsOpen = true"
|
||||
>
|
||||
پیامک
|
||||
</UiButton>
|
||||
<UiButton
|
||||
v-if="lead && !editing"
|
||||
variant="secondary"
|
||||
@@ -444,10 +455,17 @@ onBeforeUnmount(() => narrowMq?.removeEventListener('change', syncNarrow));
|
||||
<UiIcon name="phone" :size="16" />
|
||||
تماس
|
||||
</a>
|
||||
<button class="m-btn" type="button" @click="smsOpen = true">
|
||||
<UiIcon name="chat" :size="16" />
|
||||
پیامک
|
||||
</button>
|
||||
<button class="m-btn" type="button" @click="startEdit">
|
||||
<UiIcon name="pencil" :size="16" />
|
||||
ویرایش
|
||||
</button>
|
||||
<button class="m-btn icon" type="button" aria-label="بیشتر" @click="moreOpen = true">
|
||||
<UiIcon name="dots" :size="18" />
|
||||
</button>
|
||||
<button
|
||||
v-if="!lead.convertedPersonId"
|
||||
class="m-btn solid"
|
||||
@@ -458,9 +476,6 @@ onBeforeUnmount(() => narrowMq?.removeEventListener('change', syncNarrow));
|
||||
<UiIcon name="user-plus" :size="16" />
|
||||
تبدیل به مشتری
|
||||
</button>
|
||||
<button class="m-btn icon" type="button" aria-label="بیشتر" @click="moreOpen = true">
|
||||
<UiIcon name="dots" :size="18" />
|
||||
</button>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
@@ -704,6 +719,11 @@ onBeforeUnmount(() => narrowMq?.removeEventListener('change', syncNarrow));
|
||||
|
||||
<aside class="side">
|
||||
<button class="sheet-close" type="button" @click="moreOpen = false">بستن</button>
|
||||
<UiCard title="پیامک">
|
||||
<UiButton size="sm" :disabled="!lead.mobile" @click="smsOpen = true; moreOpen = false">
|
||||
ارسال پیامک
|
||||
</UiButton>
|
||||
</UiCard>
|
||||
<UiCard title="تغییر وضعیت">
|
||||
<UiField label="وضعیت">
|
||||
<UiSelect v-model="stageId">
|
||||
@@ -764,6 +784,16 @@ onBeforeUnmount(() => narrowMq?.removeEventListener('change', syncNarrow));
|
||||
</UiCard>
|
||||
</aside>
|
||||
</div>
|
||||
<SmsComposeModal
|
||||
:open="smsOpen"
|
||||
title="ارسال پیامک"
|
||||
:endpoint="`/leads/${lead.id}/sms`"
|
||||
:name="lead.contactName || lead.title"
|
||||
:phone="lead.mobile || lead.phone || ''"
|
||||
:record-title="lead.title"
|
||||
:company="lead.contactName ? lead.title : ''"
|
||||
@close="smsOpen = false"
|
||||
/>
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
@@ -1082,14 +1112,15 @@ onBeforeUnmount(() => narrowMq?.removeEventListener('change', syncNarrow));
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.m-actions {
|
||||
.m-actions,
|
||||
.m-actions.converted {
|
||||
display: grid;
|
||||
grid-template-columns: auto auto minmax(0, 1fr) 36px;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr)) 36px;
|
||||
gap: 0.35rem;
|
||||
}
|
||||
|
||||
.m-actions.converted {
|
||||
grid-template-columns: 1fr 1fr auto;
|
||||
.m-actions .solid {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
.m-btn {
|
||||
|
||||
@@ -19,6 +19,7 @@ import UiIcon from '@/components/UiIcon.vue';
|
||||
import CustomerMoodFace from '@/components/CustomerMoodFace.vue';
|
||||
import MentoAiAvatar from '@/components/brand/MentoAiAvatar.vue';
|
||||
import { brand } from '@mento/shared';
|
||||
import SmsComposeModal from '@/components/SmsComposeModal.vue';
|
||||
import MentoMemoryPanel from '@/components/MentoMemoryPanel.vue';
|
||||
import AskMentoPanel from '@/components/AskMentoPanel.vue';
|
||||
import ProfileEmptyState from '@/components/person-profile/ProfileEmptyState.vue';
|
||||
@@ -104,6 +105,7 @@ const cards = ref<ProjectCardDto[]>([]);
|
||||
const tahesabMoshtariCode = ref<number | null>(null);
|
||||
|
||||
const moreOpen = ref(false);
|
||||
const smsOpen = ref(false);
|
||||
const mobMoreOpen = ref(false);
|
||||
const filterOpen = ref(false);
|
||||
const historyFilter = ref<HistoryFilter>('all');
|
||||
@@ -117,10 +119,12 @@ const moreItems = computed<ProfileMoreItem[]>(() => [
|
||||
{ key: 'quote', label: 'پیشفاکتور جدید', to: { name: 'quote-new', query: { personId: id.value } } },
|
||||
{ key: 'ticket', label: 'تیکت جدید', to: { name: 'ticket-new', query: { personId: id.value } } },
|
||||
{ key: 'note', label: 'یادداشت جدید', to: { name: 'notes', query: { personId: id.value } } },
|
||||
{ key: 'sms', label: 'ارسال پیامک' },
|
||||
{ key: 'delete', label: 'حذف شخص', danger: true },
|
||||
]);
|
||||
|
||||
function onMoreSelect(key: string) {
|
||||
if (key === 'sms') smsOpen.value = true;
|
||||
if (key === 'delete') void removePerson();
|
||||
}
|
||||
|
||||
@@ -676,6 +680,10 @@ watch(() => route.query.tab, readTab, { immediate: true });
|
||||
<UiIcon name="phone" :size="15" />
|
||||
{{ phoneDisplay }}
|
||||
</a>
|
||||
<button class="contact-pill sms" type="button" :disabled="!phoneNumber" @click="smsOpen = true">
|
||||
<UiIcon name="chat" :size="15" />
|
||||
پیامک
|
||||
</button>
|
||||
<a v-if="person.email" class="contact-pill" :href="mailHref || undefined" dir="ltr">
|
||||
<UiIcon name="mail" :size="15" />
|
||||
{{ person.email }}
|
||||
@@ -1033,6 +1041,18 @@ watch(() => route.query.tab, readTab, { immediate: true });
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<SmsComposeModal
|
||||
v-if="person"
|
||||
:open="smsOpen"
|
||||
title="ارسال پیامک"
|
||||
:endpoint="`/people/${id}/sms`"
|
||||
:name="fullName"
|
||||
:phone="phoneNumber"
|
||||
:record-title="fullName"
|
||||
:company="person.company?.name ?? ''"
|
||||
@close="smsOpen = false"
|
||||
/>
|
||||
|
||||
<div v-if="person" class="dock">
|
||||
<button class="fab-item call" type="button" :disabled="!telHref" @click="goCall">
|
||||
<span class="fab-circle">
|
||||
@@ -1275,6 +1295,17 @@ watch(() => route.query.tab, readTab, { immediate: true });
|
||||
background: #f0fdfa;
|
||||
}
|
||||
|
||||
button.contact-pill {
|
||||
font: inherit;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button.contact-pill:disabled {
|
||||
opacity: 0.55;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.facts-grid {
|
||||
margin: 0;
|
||||
display: grid;
|
||||
|
||||
Reference in New Issue
Block a user