test/crm
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: better way to upload lead image

Browse Source
This commit is contained in:
Shariq Ansari 2023-11-06 16:23:44 +05:30
parent 475bf6469b
commit 545482b57e
1 changed files with 24 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/pages/Lead.vue
View File

@ -59,26 +59,32 @@
:label="lead.data.first_name" :label="lead.data.first_name"
:image="lead.data.image" :image="lead.data.image"
/> />
<Dropdown <component
:options="[ :is="lead.data.image ? Dropdown : 'div'"
v-bind="
lead.data.image
? {
options: [
{ {
icon: 'upload', icon: 'upload',
label: lead.data.image ? 'Change photo' : 'Upload photo', label: lead.data.image
? 'Change image'
: 'Upload image',
onClick: openFileSelector, onClick: openFileSelector,
}, },
{ {
icon: 'trash-2', icon: 'trash-2',
label: 'Remove photo', label: 'Remove image',
onClick: () => { onClick: () => changeLeadImage(''),
lead.data.image = ''
updateLead('image', '')
}, },
}, ],
]" }
: { onClick: openFileSelector }
"
class="!absolute bottom-0 left-0 right-0" class="!absolute bottom-0 left-0 right-0"
> >
<div <div
class="z-1 absolute bottom-0 left-0 right-0 flex h-11 cursor-pointer items-center justify-center rounded-b-full bg-black bg-opacity-40 pt-3 opacity-0 duration-300 ease-in-out group-hover:opacity-100" class="z-1 absolute bottom-0 left-0 right-0 flex h-13 cursor-pointer items-center justify-center rounded-b-full bg-black bg-opacity-40 pt-3 opacity-0 duration-300 ease-in-out group-hover:opacity-100"
style=" style="
-webkit-clip-path: inset(12px 0 0 0); -webkit-clip-path: inset(12px 0 0 0);
clip-path: inset(12px 0 0 0); clip-path: inset(12px 0 0 0);
@ -86,7 +92,7 @@
> >
<CameraIcon class="h-6 w-6 cursor-pointer text-white" /> <CameraIcon class="h-6 w-6 cursor-pointer text-white" />
</div> </div>
</Dropdown> </component>
</div> </div>
<div class="flex flex-col gap-2.5 truncate"> <div class="flex flex-col gap-2.5 truncate">
<Tooltip :text="lead.data.lead_name"> <Tooltip :text="lead.data.lead_name">