fix: made lead layout changes on deal
This commit is contained in:
Shariq Ansari
parent
b538a2ab62
commit
ef43810298
@ -35,313 +35,318 @@
|
||||
</Dropdown>
|
||||
</template>
|
||||
</LayoutHeader>
|
||||
<TabGroup v-slot="{ selectedIndex }" v-if="deal.data" @change="onTabChange">
|
||||
<TabList class="flex items-center gap-6 border-b pl-5 relative">
|
||||
<Tab
|
||||
ref="tabRef"
|
||||
as="template"
|
||||
v-for="tab in tabs"
|
||||
:key="tab.label"
|
||||
v-slot="{ selected }"
|
||||
>
|
||||
<button
|
||||
class="flex items-center gap-2 py-[9px] -mb-[1px] text-base text-gray-600 border-b border-transparent hover:text-gray-900 hover:border-gray-400 transition-all duration-300 ease-in-out"
|
||||
:class="{ 'text-gray-900': selected }"
|
||||
>
|
||||
<component v-if="tab.icon" :is="tab.icon" class="h-5" />
|
||||
{{ tab.label }}
|
||||
</button>
|
||||
</Tab>
|
||||
<div
|
||||
ref="indicator"
|
||||
class="h-[1px] bg-gray-900 w-[82px] absolute -bottom-[1px]"
|
||||
:style="{ left: `${indicatorLeftValue}px` }"
|
||||
/>
|
||||
</TabList>
|
||||
<div class="flex h-full overflow-hidden">
|
||||
<div class="flex-1 flex flex-col">
|
||||
<TabPanels class="flex flex-1 overflow-hidden">
|
||||
<TabPanel
|
||||
class="flex-1 flex flex-col overflow-y-auto"
|
||||
<div class="flex h-full overflow-hidden">
|
||||
<TabGroup v-slot="{ selectedIndex }" v-if="deal.data" @change="onTabChange">
|
||||
<div class="flex flex-col flex-1">
|
||||
<TabList class="flex items-center gap-6 border-b pl-5 relative">
|
||||
<Tab
|
||||
ref="tabRef"
|
||||
as="template"
|
||||
v-for="tab in tabs"
|
||||
:key="tab.label"
|
||||
v-slot="{ selected }"
|
||||
>
|
||||
<Activities
|
||||
:title="tab.activityTitle"
|
||||
:activities="tab.content"
|
||||
@makeCall="makeCall(deal.data.mobile_no)"
|
||||
@makeNote="(e) => showNote(e)"
|
||||
@deleteNote="(e) => deleteNote(e)"
|
||||
@setFocusOnEmail="() => $refs.sendEmailRef.el.click()"
|
||||
/>
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
<CommunicationArea
|
||||
ref="sendEmailRef"
|
||||
v-if="[0, 1].includes(selectedIndex)"
|
||||
v-model="deal"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex flex-col justify-between border-l w-[370px]">
|
||||
<FileUploader @success="changeDealImage" :validateFile="validateFile">
|
||||
<template #default="{ openFileSelector, error }">
|
||||
<div
|
||||
class="flex flex-col gap-3 pb-4 p-5 items-center justify-center border-b"
|
||||
<button
|
||||
class="flex items-center gap-2 py-2.5 -mb-[1px] text-base text-gray-600 border-b border-transparent hover:text-gray-900 hover:border-gray-400 transition-all duration-300 ease-in-out"
|
||||
:class="{ 'text-gray-900': selected }"
|
||||
>
|
||||
<component v-if="tab.icon" :is="tab.icon" class="h-5" />
|
||||
{{ tab.label }}
|
||||
</button>
|
||||
</Tab>
|
||||
<div
|
||||
ref="indicator"
|
||||
class="h-[1px] bg-gray-900 w-[82px] absolute -bottom-[1px]"
|
||||
:style="{ left: `${indicatorLeftValue}px` }"
|
||||
/>
|
||||
</TabList>
|
||||
<div class="flex flex-col h-full overflow-auto">
|
||||
<TabPanels class="flex flex-1 overflow-hidden">
|
||||
<TabPanel
|
||||
class="flex-1 flex flex-col overflow-y-auto"
|
||||
v-for="tab in tabs"
|
||||
:key="tab.label"
|
||||
>
|
||||
<Activities
|
||||
:title="tab.activityTitle"
|
||||
:activities="tab.content"
|
||||
@makeCall="makeCall(deal.data.mobile_no)"
|
||||
@makeNote="(e) => showNote(e)"
|
||||
@deleteNote="(e) => deleteNote(e)"
|
||||
@setFocusOnEmail="() => $refs.sendEmailRef.el.click()"
|
||||
/>
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
<CommunicationArea
|
||||
ref="sendEmailRef"
|
||||
v-if="[0, 1].includes(selectedIndex)"
|
||||
v-model="deal"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</TabGroup>
|
||||
<div class="flex flex-col justify-between border-l w-[352px]">
|
||||
<div
|
||||
class="flex items-center border-b px-5 py-2.5 h-[41px] font-semibold text-lg"
|
||||
>
|
||||
About this deal
|
||||
</div>
|
||||
<FileUploader @success="changeDealImage" :validateFile="validateFile">
|
||||
<template #default="{ openFileSelector, error }">
|
||||
<div class="flex gap-5 items-center justify-start p-5 border-b">
|
||||
<div class="relative w-[88px] h-[88px] group">
|
||||
<Avatar
|
||||
size="3xl"
|
||||
shape="square"
|
||||
class="w-[88px] h-[88px]"
|
||||
:label="deal.data.organization_name"
|
||||
:image="deal.data.organization_logo"
|
||||
/>
|
||||
<ErrorMessage :message="error" />
|
||||
<Dropdown
|
||||
:options="[
|
||||
{
|
||||
icon: 'upload',
|
||||
label: deal.data.organization_logo
|
||||
? 'Change image'
|
||||
: 'Upload image',
|
||||
onClick: openFileSelector,
|
||||
},
|
||||
{
|
||||
icon: 'trash-2',
|
||||
label: 'Remove image',
|
||||
onClick: () => {
|
||||
deal.data.organization_logo = ''
|
||||
updateDeal('organization_logo', '')
|
||||
},
|
||||
},
|
||||
]"
|
||||
class="!absolute bottom-0 left-0 right-0"
|
||||
>
|
||||
<div
|
||||
class="absolute bottom-0 left-0 right-0 rounded-b-full z-1 h-11 flex items-center justify-center pt-3 bg-black bg-opacity-40 cursor-pointer opacity-0 group-hover:opacity-100 duration-300 ease-in-out"
|
||||
style="
|
||||
-webkit-clip-path: inset(12px 0 0 0);
|
||||
clip-path: inset(12px 0 0 0);
|
||||
"
|
||||
>
|
||||
<CameraIcon class="h-6 w-6 text-white cursor-pointer" />
|
||||
</div>
|
||||
</Dropdown>
|
||||
</div>
|
||||
<div class="flex flex-col gap-2.5">
|
||||
<div class="font-medium text-2xl">
|
||||
{{ deal.data.organization_name }}
|
||||
</div>
|
||||
<div class="flex gap-3">
|
||||
<div class="flex gap-1.5">
|
||||
<Tooltip text="Make a call...">
|
||||
<Button
|
||||
class="rounded-full h-8 w-8"
|
||||
class="h-7 w-7"
|
||||
@click="() => makeCall(deal.data.mobile_no)"
|
||||
>
|
||||
<PhoneIcon class="h-4 w-4" />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
<Button class="rounded-full h-8 w-8">
|
||||
<Button class="h-7 w-7">
|
||||
<EmailIcon class="h-4 w-4" />
|
||||
</Button>
|
||||
<Tooltip text="Go to website...">
|
||||
<Button
|
||||
icon="link"
|
||||
@click="openWebsite(deal.data.website)"
|
||||
class="rounded-full h-8 w-8"
|
||||
/>
|
||||
<Button class="h-7 w-7">
|
||||
<LinkIcon
|
||||
class="h-4 w-4"
|
||||
@click="openWebsite(deal.data.website)"
|
||||
/>
|
||||
</Button>
|
||||
</Tooltip>
|
||||
<Dropdown
|
||||
:options="[
|
||||
{
|
||||
icon: 'upload',
|
||||
label: deal.data.organization_logo
|
||||
? 'Change image'
|
||||
: 'Upload image',
|
||||
onClick: openFileSelector,
|
||||
},
|
||||
{
|
||||
icon: 'trash-2',
|
||||
label: 'Remove image',
|
||||
onClick: () => {
|
||||
deal.data.organization_logo = ''
|
||||
updateDeal('organization_logo', '')
|
||||
},
|
||||
},
|
||||
]"
|
||||
>
|
||||
<Button icon="more-horizontal" class="rounded-full h-8 w-8" />
|
||||
</Dropdown>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</FileUploader>
|
||||
<div class="flex-1 flex flex-col justify-between overflow-hidden">
|
||||
<div class="flex flex-col gap-6 p-3 overflow-y-auto">
|
||||
<div
|
||||
v-for="section in detailSections"
|
||||
:key="section.label"
|
||||
class="flex flex-col"
|
||||
>
|
||||
<Toggler :is-opened="section.opened" v-slot="{ opened, toggle }">
|
||||
<div
|
||||
class="flex items-center gap-2 text-base font-semibold leading-5 pl-2 pr-3 cursor-pointer max-w-fit"
|
||||
@click="toggle()"
|
||||
>
|
||||
<FeatherIcon
|
||||
name="chevron-right"
|
||||
class="h-4 text-gray-600 transition-all duration-300 ease-in-out"
|
||||
:class="{ 'rotate-90': opened }"
|
||||
/>
|
||||
{{ section.label }}
|
||||
</div>
|
||||
<transition
|
||||
enter-active-class="duration-300 ease-in"
|
||||
leave-active-class="duration-300 ease-[cubic-bezier(0, 1, 0.5, 1)]"
|
||||
enter-to-class="max-h-[200px] overflow-hidden"
|
||||
leave-from-class="max-h-[200px] overflow-hidden"
|
||||
enter-from-class="max-h-0 overflow-hidden"
|
||||
leave-to-class="max-h-0 overflow-hidden"
|
||||
>
|
||||
<div v-if="opened" class="flex flex-col gap-1.5">
|
||||
<div
|
||||
v-for="field in section.fields"
|
||||
:key="field.label"
|
||||
class="flex items-center px-3 gap-2 text-base leading-5 first:mt-3"
|
||||
>
|
||||
<div class="text-gray-600 w-[106px]">
|
||||
{{ field.label }}
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<FormControl
|
||||
v-if="field.type === 'select'"
|
||||
type="select"
|
||||
:options="field.options"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control cursor-pointer [&_select]:cursor-pointer"
|
||||
>
|
||||
<template #prefix>
|
||||
<IndicatorIcon
|
||||
:class="dealStatuses[deal.data[field.name]].color"
|
||||
/>
|
||||
</template>
|
||||
</FormControl>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'email'"
|
||||
type="email"
|
||||
class="form-control"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
/>
|
||||
<Autocomplete
|
||||
v-else-if="field.type === 'link'"
|
||||
:value="deal.data[field.name]"
|
||||
:options="field.options"
|
||||
@change="(e) => field.change(e)"
|
||||
:placeholder="field.placeholder"
|
||||
class="form-control"
|
||||
/>
|
||||
<Autocomplete
|
||||
v-else-if="field.type === 'user'"
|
||||
:options="activeAgents"
|
||||
:value="getUser(deal.data[field.name]).full_name"
|
||||
@change="
|
||||
(option) => updateAssignedAgent(option.email)
|
||||
"
|
||||
class="form-control"
|
||||
:placeholder="deal.placeholder"
|
||||
>
|
||||
<template #target="{ togglePopover }">
|
||||
<Button
|
||||
variant="ghost"
|
||||
@click="togglePopover()"
|
||||
:label="getUser(deal.data[field.name]).full_name"
|
||||
class="!justify-start w-full"
|
||||
>
|
||||
<template #prefix>
|
||||
<UserAvatar
|
||||
:user="deal.data[field.name]"
|
||||
size="sm"
|
||||
/>
|
||||
</template>
|
||||
</Button>
|
||||
</template>
|
||||
<template #item-prefix="{ option }">
|
||||
<UserAvatar
|
||||
class="mr-2"
|
||||
:user="option.email"
|
||||
size="sm"
|
||||
/>
|
||||
</template>
|
||||
</Autocomplete>
|
||||
<Dropdown
|
||||
v-else-if="field.type === 'dropdown'"
|
||||
:options="
|
||||
statusDropdownOptions(deal.data, 'deal', updateDeal)
|
||||
"
|
||||
class="w-full flex-1"
|
||||
>
|
||||
<template #default="{ open }">
|
||||
<Button
|
||||
:label="deal.data[field.name]"
|
||||
class="justify-between w-full"
|
||||
>
|
||||
<template #prefix>
|
||||
<IndicatorIcon
|
||||
:class="
|
||||
dealStatuses[deal.data[field.name]].color
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
<template #default>{{
|
||||
deal.data[field.name]
|
||||
}}</template>
|
||||
<template #suffix>
|
||||
<FeatherIcon
|
||||
:name="open ? 'chevron-up' : 'chevron-down'"
|
||||
class="h-4 text-gray-600"
|
||||
/>
|
||||
</template>
|
||||
</Button>
|
||||
</template>
|
||||
</Dropdown>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'date'"
|
||||
type="date"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'number'"
|
||||
type="number"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'tel'"
|
||||
type="tel"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
<FormControl
|
||||
v-else
|
||||
type="text"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</Toggler>
|
||||
<ErrorMessage :message="error" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex items-center gap-1 text-sm px-6 p-3 leading-5 cursor-pointer"
|
||||
>
|
||||
<span class="text-gray-600">Created </span>
|
||||
<Tooltip :text="dateFormat(deal.data.creation, dateTooltipFormat)">
|
||||
{{ timeAgo(deal.data.creation) }}
|
||||
</Tooltip>
|
||||
<span> · </span>
|
||||
<span class="text-gray-600">Updated </span>
|
||||
<Tooltip :text="dateFormat(deal.data.modified, dateTooltipFormat)">
|
||||
{{ timeAgo(deal.data.modified) }}
|
||||
</Tooltip>
|
||||
</template>
|
||||
</FileUploader>
|
||||
<div class="flex-1 flex flex-col justify-between overflow-hidden">
|
||||
<div class="flex flex-col overflow-y-auto">
|
||||
<div
|
||||
v-for="(section, i) in detailSections"
|
||||
:key="section.label"
|
||||
class="flex flex-col p-3"
|
||||
:class="{ 'border-b': i !== detailSections.length - 1 }"
|
||||
>
|
||||
<Toggler :is-opened="section.opened" v-slot="{ opened, toggle }">
|
||||
<div
|
||||
class="flex items-center gap-2 text-base font-semibold leading-5 pl-2 pr-3 cursor-pointer max-w-fit"
|
||||
@click="toggle()"
|
||||
>
|
||||
<FeatherIcon
|
||||
name="chevron-right"
|
||||
class="h-4 text-gray-600 transition-all duration-300 ease-in-out"
|
||||
:class="{ 'rotate-90': opened }"
|
||||
/>
|
||||
{{ section.label }}
|
||||
</div>
|
||||
<transition
|
||||
enter-active-class="duration-300 ease-in"
|
||||
leave-active-class="duration-300 ease-[cubic-bezier(0, 1, 0.5, 1)]"
|
||||
enter-to-class="max-h-[200px] overflow-hidden"
|
||||
leave-from-class="max-h-[200px] overflow-hidden"
|
||||
enter-from-class="max-h-0 overflow-hidden"
|
||||
leave-to-class="max-h-0 overflow-hidden"
|
||||
>
|
||||
<div v-if="opened" class="flex flex-col gap-1.5">
|
||||
<div
|
||||
v-for="field in section.fields"
|
||||
:key="field.label"
|
||||
class="flex items-center px-3 gap-2 text-base leading-5 first:mt-3"
|
||||
>
|
||||
<div class="text-gray-600 w-[106px]">
|
||||
{{ field.label }}
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<FormControl
|
||||
v-if="field.type === 'select'"
|
||||
type="select"
|
||||
:options="field.options"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control cursor-pointer [&_select]:cursor-pointer"
|
||||
>
|
||||
<template #prefix>
|
||||
<IndicatorIcon
|
||||
:class="dealStatuses[deal.data[field.name]].color"
|
||||
/>
|
||||
</template>
|
||||
</FormControl>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'email'"
|
||||
type="email"
|
||||
class="form-control"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
/>
|
||||
<Autocomplete
|
||||
v-else-if="field.type === 'link'"
|
||||
:value="deal.data[field.name]"
|
||||
:options="field.options"
|
||||
@change="(e) => field.change(e)"
|
||||
:placeholder="field.placeholder"
|
||||
class="form-control"
|
||||
/>
|
||||
<Autocomplete
|
||||
v-else-if="field.type === 'user'"
|
||||
:options="activeAgents"
|
||||
:value="getUser(deal.data[field.name]).full_name"
|
||||
@change="(option) => updateAssignedAgent(option.email)"
|
||||
class="form-control"
|
||||
:placeholder="deal.placeholder"
|
||||
>
|
||||
<template #target="{ togglePopover }">
|
||||
<Button
|
||||
variant="ghost"
|
||||
@click="togglePopover()"
|
||||
:label="getUser(deal.data[field.name]).full_name"
|
||||
class="!justify-start w-full"
|
||||
>
|
||||
<template #prefix>
|
||||
<UserAvatar
|
||||
:user="deal.data[field.name]"
|
||||
size="sm"
|
||||
/>
|
||||
</template>
|
||||
</Button>
|
||||
</template>
|
||||
<template #item-prefix="{ option }">
|
||||
<UserAvatar
|
||||
class="mr-2"
|
||||
:user="option.email"
|
||||
size="sm"
|
||||
/>
|
||||
</template>
|
||||
</Autocomplete>
|
||||
<Dropdown
|
||||
v-else-if="field.type === 'dropdown'"
|
||||
:options="
|
||||
statusDropdownOptions(deal.data, 'deal', updateDeal)
|
||||
"
|
||||
class="w-full flex-1"
|
||||
>
|
||||
<template #default="{ open }">
|
||||
<Button
|
||||
:label="deal.data[field.name]"
|
||||
class="justify-between w-full"
|
||||
>
|
||||
<template #prefix>
|
||||
<IndicatorIcon
|
||||
:class="
|
||||
dealStatuses[deal.data[field.name]].color
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
<template #default>{{
|
||||
deal.data[field.name]
|
||||
}}</template>
|
||||
<template #suffix>
|
||||
<FeatherIcon
|
||||
:name="open ? 'chevron-up' : 'chevron-down'"
|
||||
class="h-4 text-gray-600"
|
||||
/>
|
||||
</template>
|
||||
</Button>
|
||||
</template>
|
||||
</Dropdown>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'date'"
|
||||
type="date"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'number'"
|
||||
type="number"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
<FormControl
|
||||
v-else-if="field.type === 'tel'"
|
||||
type="tel"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
<FormControl
|
||||
v-else
|
||||
type="text"
|
||||
:value="deal.data[field.name]"
|
||||
@change.stop="
|
||||
updateDeal(field.name, $event.target.value)
|
||||
"
|
||||
:debounce="500"
|
||||
class="form-control"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</Toggler>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</TabGroup>
|
||||
</div>
|
||||
<NoteModal v-model="showNoteModal" :note="note" @updateNote="updateNote" />
|
||||
</template>
|
||||
<script setup>
|
||||
@ -351,6 +356,8 @@ import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
|
||||
import TaskIcon from '@/components/Icons/TaskIcon.vue'
|
||||
import NoteIcon from '@/components/Icons/NoteIcon.vue'
|
||||
import IndicatorIcon from '@/components/Icons/IndicatorIcon.vue'
|
||||
import CameraIcon from '@/components/Icons/CameraIcon.vue'
|
||||
import LinkIcon from '@/components/Icons/LinkIcon.vue'
|
||||
import LayoutHeader from '@/components/LayoutHeader.vue'
|
||||
import Toggler from '@/components/Toggler.vue'
|
||||
import Activities from '@/components/Activities.vue'
|
||||
@ -361,9 +368,6 @@ import NoteModal from '@/components/NoteModal.vue'
|
||||
import { TabGroup, TabList, Tab, TabPanels, TabPanel } from '@headlessui/vue'
|
||||
import { TransitionPresets, useTransition } from '@vueuse/core'
|
||||
import {
|
||||
dateFormat,
|
||||
timeAgo,
|
||||
dateTooltipFormat,
|
||||
dealStatuses,
|
||||
statusDropdownOptions,
|
||||
openWebsite,
|
||||
|
||||
@ -89,7 +89,9 @@
|
||||
</div>
|
||||
</TabGroup>
|
||||
<div class="flex flex-col justify-between border-l w-[352px]">
|
||||
<div class="flex items-center border-b px-5 py-2.5 h-[41px] font-semibold text-lg">
|
||||
<div
|
||||
class="flex items-center border-b px-5 py-2.5 h-[41px] font-semibold text-lg"
|
||||
>
|
||||
About this lead
|
||||
</div>
|
||||
<FileUploader @success="changeLeadImage" :validateFile="validateFile">
|
||||
@ -336,9 +338,6 @@ import NoteModal from '@/components/NoteModal.vue'
|
||||
import { TabGroup, TabList, Tab, TabPanels, TabPanel } from '@headlessui/vue'
|
||||
import { TransitionPresets, useTransition } from '@vueuse/core'
|
||||
import {
|
||||
dateFormat,
|
||||
timeAgo,
|
||||
dateTooltipFormat,
|
||||
leadStatuses,
|
||||
statusDropdownOptions,
|
||||
openWebsite,
|
||||
@ -349,7 +348,6 @@ import { usersStore } from '@/stores/users'
|
||||
import { contactsStore } from '@/stores/contacts'
|
||||
import {
|
||||
createResource,
|
||||
createDocumentResource,
|
||||
createListResource,
|
||||
FileUploader,
|
||||
ErrorMessage,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user