fix: added created/modified time stamp

also added scroll to details and activities section

frontend/src/pages/Lead.vue

@@ -67,11 +67,18 @@
         :style="{ left: `${indicatorLeftValue}px` }"
       />
     </TabList>
-    <TabPanels class="flex h-full">
+    <TabPanels class="flex h-full overflow-hidden">
-      <TabPanel class="flex-1" v-for="tab in tabs" :key="tab.label">
+      <TabPanel
+        class="flex-1 overflow-y-auto"
+        v-for="tab in tabs"
+        :key="tab.label"
+      >
         <Activities :activities="tab.content" />
       </TabPanel>
-      <div class="flex flex-col gap-6.5 border-l p-3 w-[390px]">
+      <div
+        class="flex flex-col justify-between border-l w-[390px] overflow-hidden"
+      >
+        <div class="flex flex-col gap-6.5 p-3 overflow-y-auto">
           <div
             v-for="section in detailSections"
             :key="section.label"
@@ -185,6 +192,18 @@
             </Toggler>
           </div>
         </div>
+        <div class="text-sm px-6 p-3 leading-5 cursor-pointer">
+          <span class="text-gray-600">Created </span>
+          <span :title="dateFormat(lead.doc.creation)">
+            {{ timeAgo(lead.doc.creation) }}
+          </span>
+          <span>&nbsp;&middot;&nbsp;</span>
+          <span class="text-gray-600">Updated </span>
+          <span :title="dateFormat(lead.doc.modified)">
+            {{ timeAgo(lead.doc.modified) }}
+          </span>
+        </div>
+      </div>
     </TabPanels>
   </TabGroup>
 </template>
@@ -209,6 +228,7 @@ import {
 } from 'frappe-ui'
 import { TransitionPresets, useTransition } from '@vueuse/core'
 import { usersStore } from '@/stores/users'
+import { dateFormat, timeAgo } from '@/utils'
 import { ref, computed, h } from 'vue'
 import Breadcrumbs from '@/components/Breadcrumbs.vue'
 

frontend/src/utils.js

@@ -0,0 +1,10 @@
+import { useDateFormat, useTimeAgo } from '@vueuse/core'
+
+export function dateFormat(date, format) {
+  const _format = format || 'DD-MM-YYYY HH:mm:ss'
+  return useDateFormat(date, _format).value
+}
+
+export function timeAgo(date) {
+  return useTimeAgo(date).value
+}