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

fix: scroll to bottom in each tab

Browse Source
This commit is contained in:
Shariq Ansari 2024-05-30 14:09:05 +05:30
parent f5fa47bae0
commit 7c5696ee75
1 changed files with 339 additions and 344 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
frontend/src/components/Activities.vue
View File

@ -102,11 +102,11 @@
> >
<div <div
v-if="title == 'Notes'" v-if="title == 'Notes'"
class="activity grid grid-cols-1 gap-4 px-4 pb-3 sm:px-10 sm:pb-5 lg:grid-cols-2 xl:grid-cols-3" class="grid grid-cols-1 gap-4 px-4 pb-3 sm:px-10 sm:pb-5 lg:grid-cols-2 xl:grid-cols-3"
> >
<div <div
v-for="note in activities" v-for="note in activities"
class="group flex h-48 cursor-pointer flex-col justify-between gap-2 rounded-md bg-gray-50 px-4 py-3 hover:bg-gray-100" class="activity group flex h-48 cursor-pointer flex-col justify-between gap-2 rounded-md bg-gray-50 px-4 py-3 hover:bg-gray-100"
@click="showNote(note)" @click="showNote(note)"
> >
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
@ -156,10 +156,10 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else-if="title == 'Comments'" class="activity pb-5"> <div v-else-if="title == 'Comments'" class="pb-5">
<div v-for="(comment, i) in activities"> <div v-for="(comment, i) in activities">
<div <div
class="grid grid-cols-[30px_minmax(auto,_1fr)] sm:gap-4 gap-2 px-4 sm:px-10" class="activity grid grid-cols-[30px_minmax(auto,_1fr)] gap-2 px-4 sm:gap-4 sm:px-10"
> >
<div <div
class="relative flex justify-center after:absolute after:left-[50%] after:top-0 after:-z-10 after:border-l after:border-gray-200" class="relative flex justify-center after:absolute after:left-[50%] after:top-0 after:-z-10 after:border-l after:border-gray-200"
@ -214,13 +214,10 @@
</div> </div>
</div> </div>
</div> </div>
<div <div v-else-if="title == 'Tasks'" class="px-4 pb-3 sm:px-10 sm:pb-5">
v-else-if="title == 'Tasks'"
class="activity px-4 pb-3 sm:px-10 sm:pb-5"
>
<div v-for="(task, i) in activities"> <div v-for="(task, i) in activities">
<div <div
class="flex cursor-pointer gap-6 rounded p-2.5 duration-300 ease-in-out hover:bg-gray-50" class="activity flex cursor-pointer gap-6 rounded p-2.5 duration-300 ease-in-out hover:bg-gray-50"
@click="showTask(task)" @click="showTask(task)"
> >
<div class="flex flex-1 flex-col gap-1.5 text-base"> <div class="flex flex-1 flex-col gap-1.5 text-base">
@ -313,7 +310,7 @@
<div v-else-if="title == 'Calls'" class="activity"> <div v-else-if="title == 'Calls'" class="activity">
<div v-for="(call, i) in activities"> <div v-for="(call, i) in activities">
<div <div
class="grid grid-cols-[30px_minmax(auto,_1fr)] gap-4 px-4 sm:px-10" class="activity grid grid-cols-[30px_minmax(auto,_1fr)] gap-4 px-4 sm:px-10"
> >
<div <div
class="relative flex justify-center after:absolute after:left-[50%] after:top-0 after:-z-10 after:border-l after:border-gray-200" class="relative flex justify-center after:absolute after:left-[50%] after:top-0 after:-z-10 after:border-l after:border-gray-200"
@ -416,12 +413,13 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else v-for="(activity, i) in activities" class="activity">
<div <div
class="px-4 sm:px-10" v-else
v-for="(activity, i) in activities"
class="activity px-4 sm:px-10"
:class=" :class="
title == 'Activity' title == 'Activity'
? 'grid grid-cols-[30px_minmax(auto,_1fr)] sm:gap-4 gap-2' ? 'grid grid-cols-[30px_minmax(auto,_1fr)] gap-2 sm:gap-4'
: '' : ''
" "
> >
@ -467,9 +465,7 @@
<UserAvatar :user="activity.data.sender" size="md" /> <UserAvatar :user="activity.data.sender" size="md" />
<span>{{ activity.data.sender_full_name }}</span> <span>{{ activity.data.sender_full_name }}</span>
<span>&middot;</span> <span>&middot;</span>
<Tooltip <Tooltip :text="dateFormat(activity.creation, dateTooltipFormat)">
:text="dateFormat(activity.creation, dateTooltipFormat)"
>
<div class="text-sm text-gray-600"> <div class="text-sm text-gray-600">
{{ __(timeAgo(activity.creation)) }} {{ __(timeAgo(activity.creation)) }}
</div> </div>
@ -818,7 +814,6 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</FadedScrollableDiv> </FadedScrollableDiv>
<div <div
v-else v-else