fix: fixed breaking button with icon and open email box

This commit is contained in:
Shariq Ansari 2025-06-16 17:06:06 +05:30
parent a17b1cd0e2
commit baa03246e6
4 changed files with 88 additions and 54 deletions

View File

@ -806,5 +806,5 @@ const callActions = computed(() => {
) )
}) })
defineExpose({ emailBox, all_activities }) defineExpose({ emailBox, all_activities, changeTabTo })
</script> </script>

View File

@ -25,7 +25,9 @@
class="w-7 mr-2" class="w-7 mr-2"
@click="showSidePanelModal = true" @click="showSidePanelModal = true"
> >
<EditIcon class="h-4 w-4" /> <template #icon>
<EditIcon />
</template>
</Button> </Button>
</slot> </slot>
</template> </template>

View File

@ -92,42 +92,50 @@
<Tooltip v-if="callEnabled" :text="__('Make a call')"> <Tooltip v-if="callEnabled" :text="__('Make a call')">
<div> <div>
<Button class="h-7 w-7" @click="triggerCall"> <Button class="h-7 w-7" @click="triggerCall">
<PhoneIcon class="h-4 w-4" /> <template #icon>
<PhoneIcon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
<Tooltip :text="__('Send an email')"> <Tooltip :text="__('Send an email')">
<div> <div>
<Button class="h-7 w-7"> <Button
<Email2Icon class="h-7 w-7"
class="h-4 w-4" @click="
@click=" deal.data.email
deal.data.email ? openEmailBox()
? openEmailBox() : toast.error(__('No email set'))
: toast.error(__('No email set')) "
" >
/> <template #icon>
<Email2Icon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
<Tooltip :text="__('Go to website')"> <Tooltip :text="__('Go to website')">
<div> <div>
<Button class="h-7 w-7"> <Button
<LinkIcon class="h-7 w-7"
class="h-4 w-4" @click="
@click=" deal.data.website
deal.data.website ? openWebsite(deal.data.website)
? openWebsite(deal.data.website) : toast.error(__('No website set'))
: toast.error(__('No website set')) "
" >
/> <template #icon>
<LinkIcon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
<Tooltip :text="__('Attach a file')"> <Tooltip :text="__('Attach a file')">
<div> <div>
<Button class="size-7" @click="showFilesUploader = true"> <Button class="size-7" @click="showFilesUploader = true">
<AttachmentIcon class="size-4" /> <template #icon>
<AttachmentIcon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
@ -239,14 +247,18 @@
}) })
" "
> >
<ArrowUpRightIcon class="h-4 w-4" /> <template #icon>
<ArrowUpRightIcon class="h-4 w-4" />
</template>
</Button> </Button>
<Button variant="ghost" @click="toggle()"> <Button variant="ghost" @click="toggle()">
<FeatherIcon <template #icon>
name="chevron-right" <FeatherIcon
class="h-4 w-4 text-ink-gray-9 transition-all duration-300 ease-in-out" name="chevron-right"
:class="{ 'rotate-90': opened }" class="h-4 w-4 text-ink-gray-9 transition-all duration-300 ease-in-out"
/> :class="{ 'rotate-90': opened }"
/>
</template>
</Button> </Button>
</div> </div>
</div> </div>
@ -368,7 +380,7 @@ import {
toast, toast,
} from 'frappe-ui' } from 'frappe-ui'
import { useOnboarding } from 'frappe-ui/frappe' import { useOnboarding } from 'frappe-ui/frappe'
import { ref, computed, h, onMounted, onBeforeUnmount } from 'vue' import { ref, computed, h, onMounted, onBeforeUnmount, nextTick } from 'vue'
import { useRoute, useRouter } from 'vue-router' import { useRoute, useRouter } from 'vue-router'
import { useActiveTabManager } from '@/composables/useActiveTabManager' import { useActiveTabManager } from '@/composables/useActiveTabManager'
@ -730,7 +742,11 @@ async function deleteDeal(name) {
const activities = ref(null) const activities = ref(null)
function openEmailBox() { function openEmailBox() {
activities.value.emailBox.show = true let currentTab = tabs.value[tabIndex.value]
if (!['Emails', 'Comments', 'Activities'].includes(currentTab.name)) {
activities.value.changeTabTo('emails')
}
nextTick(() => (activities.value.emailBox.show = true))
} }
const { assignees, document, triggerOnChange } = useDocument( const { assignees, document, triggerOnChange } = useDocument(

View File

@ -142,42 +142,50 @@
: toast.error(__('No phone number set')) : toast.error(__('No phone number set'))
" "
> >
<PhoneIcon class="h-4 w-4" /> <template #icon>
<PhoneIcon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
<Tooltip :text="__('Send an email')"> <Tooltip :text="__('Send an email')">
<div> <div>
<Button class="h-7 w-7"> <Button
<Email2Icon class="h-7 w-7"
class="h-4 w-4" @click="
@click=" lead.data.email
lead.data.email ? openEmailBox()
? openEmailBox() : toast.error(__('No email set'))
: toast.error(__('No email set')) "
" >
/> <template #icon>
<Email2Icon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
<Tooltip :text="__('Go to website')"> <Tooltip :text="__('Go to website')">
<div> <div>
<Button class="h-7 w-7"> <Button
<LinkIcon class="h-7 w-7"
class="h-4 w-4" @click="
@click=" lead.data.website
lead.data.website ? openWebsite(lead.data.website)
? openWebsite(lead.data.website) : toast.error(__('No website set'))
: toast.error(__('No website set')) "
" >
/> <template #icon>
<LinkIcon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
<Tooltip :text="__('Attach a file')"> <Tooltip :text="__('Attach a file')">
<div> <div>
<Button class="h-7 w-7" @click="showFilesUploader = true"> <Button class="h-7 w-7" @click="showFilesUploader = true">
<AttachmentIcon class="h-4 w-4" /> <template #icon>
<AttachmentIcon />
</template>
</Button> </Button>
</div> </div>
</Tooltip> </Tooltip>
@ -238,14 +246,18 @@
class="w-7" class="w-7"
@click="openQuickEntryModal" @click="openQuickEntryModal"
> >
<EditIcon class="h-4 w-4" /> <template #icon>
<EditIcon class="h-4 w-4" />
</template>
</Button> </Button>
<Button <Button
variant="ghost" variant="ghost"
class="w-7" class="w-7"
@click="showConvertToDealModal = false" @click="showConvertToDealModal = false"
> >
<FeatherIcon name="x" class="h-4 w-4" /> <template #icon>
<FeatherIcon name="x" class="h-4 w-4" />
</template>
</Button> </Button>
</div> </div>
</div> </div>
@ -386,7 +398,7 @@ import {
toast, toast,
} from 'frappe-ui' } from 'frappe-ui'
import { useOnboarding } from 'frappe-ui/frappe' import { useOnboarding } from 'frappe-ui/frappe'
import { ref, reactive, computed, onMounted, watch } from 'vue' import { ref, reactive, computed, onMounted, watch, nextTick } from 'vue'
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from 'vue-router'
import { useActiveTabManager } from '@/composables/useActiveTabManager' import { useActiveTabManager } from '@/composables/useActiveTabManager'
@ -670,7 +682,11 @@ async function convertToDeal() {
const activities = ref(null) const activities = ref(null)
function openEmailBox() { function openEmailBox() {
activities.value.emailBox.show = true let currentTab = tabs.value[tabIndex.value]
if (!['Emails', 'Comments', 'Activities'].includes(currentTab.name)) {
activities.value.changeTabTo('emails')
}
nextTick(() => (activities.value.emailBox.show = true))
} }
const deal = reactive({}) const deal = reactive({})