imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

almost all summary are done

Browse Source
This commit is contained in:
Cindy Chang
2024-08-16 11:10:20 +08:00
parent 43cbfb0529
commit 83bcf17364
1 changed files with 28 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/components/Discover/Map/SidebarState.vue
View File

@@ -15,8 +15,8 @@
<ul class="pb-4 border-b border-neutral-300">
<li>
<p class="h2">{{ i18next.t("Map.FileName") }}</p>
<div class="flex justify-between items-center">
<span>{{ currentMapFile }}</span>
<div class="flex items-center">
<div class="blue-dot w-3 h-3 bg-[#0099FF] rounded-full mr-2"></div><span>{{ currentMapFile }}</span>
</div>
</li>
</ul>
@@ -25,49 +25,52 @@
<p class="h2">Cases</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ stats.cases.count.toLocaleString() }} / {{ stats.cases.total.toLocaleString() }}</span>
<ProgressBar :value="valueCases" :showValue="false" class="!h-2 !rounded-full my-2 !bg-neutral-300"></ProgressBar>
<span class="block text-[12px]">{{ stats.cases.count.toLocaleString() }} / {{ stats.cases.total.toLocaleString() }}</span>
<ProgressBar :value="valueCases" :showValue="false" class="!h-2 !rounded-full my-1 !bg-neutral-300"></ProgressBar>
</div>
<span class="block text-primary text-2xl text-right font-medium basis-28">{{ getPercentLabel(stats.cases.ratio) }}</span>
<span class="block text-primary text-[20px] text-right font-medium basis-28">{{ getPercentLabel(stats.cases.ratio) }}</span>
</div>
</li>
<li>
<p class="h2">Traces</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ stats.traces.count.toLocaleString() }} / {{ stats.traces.total.toLocaleString() }}</span>
<ProgressBar :value="valueTraces" :showValue="false" class="!h-2 !rounded-full my-2 !bg-neutral-300"></ProgressBar>
<span class="block text-[12px]">{{ stats.traces.count.toLocaleString() }} / {{ stats.traces.total.toLocaleString() }}</span>
<ProgressBar :value="valueTraces" :showValue="false" class="!h-2 !rounded-full my-1 !bg-neutral-300"></ProgressBar>
</div>
<span class="block text-primary text-2xl text-right font-medium basis-28">{{ getPercentLabel(stats.traces.ratio) }}</span>
<span class="block text-primary text-[20px] text-right font-medium basis-28">{{ getPercentLabel(stats.traces.ratio) }}</span>
</div>
</li>
<li>
<p class="h2">Activity Instances</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ stats.task_instances.count.toLocaleString() }} / {{ stats.task_instances.total.toLocaleString() }}</span>
<ProgressBar :value="valueTaskInstances" :showValue="false" class="!h-2 !rounded-full my-2 !bg-neutral-300"></ProgressBar>
<span class="block text-[12px]">{{ stats.task_instances.count.toLocaleString() }} / {{ stats.task_instances.total.toLocaleString() }}</span>
<ProgressBar :value="valueTaskInstances" :showValue="false" class="!h-2 !rounded-full my-1 !bg-neutral-300"></ProgressBar>
</div>
<span class="block text-primary text-2xl text-right font-medium basis-28">{{ getPercentLabel(stats.task_instances.ratio) }}</span>
<span class="block text-primary text-[20px] text-right font-medium basis-28">{{ getPercentLabel(stats.task_instances.ratio) }}</span>
</div>
</li>
<li>
<p class="h2">Activities</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ stats.tasks.count.toLocaleString() }} / {{ stats.tasks.total.toLocaleString() }}</span>
<ProgressBar :value="valueTasks" :showValue="false" class="!h-2 !rounded-full my-2 !bg-neutral-300"></ProgressBar>
<span class="block text-[12px]">{{ stats.tasks.count.toLocaleString() }} / {{ stats.tasks.total.toLocaleString() }}</span>
<ProgressBar :value="valueTasks" :showValue="false" class="!h-2 !rounded-full my-1 !bg-neutral-300"></ProgressBar>
</div>
<span class="block text-primary text-2xl text-right font-medium basis-28">{{ getPercentLabel(stats.tasks.ratio) }}</span>
<span class="block text-primary text-[20px] text-right font-medium basis-28">{{ getPercentLabel(stats.tasks.ratio) }}</span>
</div>
</li>
</ul>
<!-- Log Timeframe -->
<div class="pt-1 pb-4 border-b border-neutral-300">
<p class="h2">Log Timeframe</p>
<p class="text-sm"><span class="px-4">{{ moment(stats.started_at
) }}</span>~<span class="px-4">{{ moment(stats.completed_at
) }}</span></p>
<p class="text-sm flex items-center">
<div class="blue-dot w-3 h-3 bg-[#0099FF] rounded-full mr-2 flex"></div>
<span class="pr-1 flex">{{ moment(stats.started_at) }}</span>
~
<span class="pl-1 flex">{{ moment(stats.completed_at) }}</span>
</p>
</div>
<!-- Case Duration -->
<div class="pt-1 pb-4">
@@ -80,44 +83,32 @@
<td>
<Tag value="MIN" class="!text-neutral-900 !bg-neutral-200 mr-2 !w-10"></Tag>
</td>
<td>
{{ timeLabel(stats.case_duration.min)[1] }}
</td>
<td>
{{ timeLabel(stats.case_duration.min)[2] }}
<td class="text-[#0099FF] flex w-20 justify-end">
{{ timeLabel(stats.case_duration.min)[1] + ' ' + timeLabel(stats.case_duration.min)[2] }}
</td>
</tr>
<tr>
<td>
<Tag value="AVG" class="!text-neutral-900 !bg-neutral-200 mr-2 !w-10"></Tag>
</td>
<td>
{{ timeLabel(stats.case_duration.average)[1] }}
</td>
<td>
{{ timeLabel(stats.case_duration.average)[2] }}
<td class="text-[#0099FF] flex w-20 justify-end">
{{ timeLabel(stats.case_duration.average)[1] + ' ' + timeLabel(stats.case_duration.average)[2] }}
</td>
</tr>
<tr>
<td>
<Tag value="MED" class="!text-neutral-900 !bg-neutral-200 mr-2 !w-10"></Tag>
</td>
<td>
{{ timeLabel(stats.case_duration.median)[1] }}
</td>
<td>
{{ timeLabel(stats.case_duration.median)[2] }}
<td class="text-[#0099FF] flex w-20 justify-end">
{{ timeLabel(stats.case_duration.median)[1] + ' ' + timeLabel(stats.case_duration.median)[2] }}
</td>
</tr>
<tr>
<td>
<Tag value="MAX" class="!text-neutral-900 !bg-neutral-200 mr-2 !w-10"></Tag>
</td>
<td>
{{ timeLabel(stats.case_duration.max)[1] }}
</td>
<td>
{{ timeLabel(stats.case_duration.max)[2] }}
<td class="text-[#0099FF] flex w-20 justify-end">
{{ timeLabel(stats.case_duration.max)[1] + ' ' + timeLabel(stats.case_duration.max)[2] }}
</td>
</tr>
</tbody>