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

fix: Issues #47 info icon done.

Browse Source
This commit is contained in:
chiayin
2024-02-29 17:18:55 +08:00
parent b01937e491
commit 14c3a2b05c
1 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Discover/Conformance/ConformanceResults.vue
View File

@@ -21,7 +21,7 @@
<div class="border rounded border-neutral-300 p-2 bg-neutral-10 w-1/2"> <div class="border rounded border-neutral-300 p-2 bg-neutral-10 w-1/2">
<p class="p-2 flex justify-between items-center"> <p class="p-2 flex justify-between items-center">
<div> <div>
<span class="block text-sm font-bold mb-2">Conformance Rate<span class="material-symbols-outlined !text-sm align-middle ml-2" v-tooltip.bottom="tooltip.rate">info</span></span> <span class="block text-sm font-bold mb-2">Conformance Rate<span class="material-symbols-outlined !text-sm align-middle ml-2 cursor-pointer" v-tooltip.bottom="tooltip.rate">info</span></span>
<small class="text-neutral-700 font-normal block">{{ data.charts.rate.xMin }} ~ {{ data.charts.rate.xMax }}</small> <small class="text-neutral-700 font-normal block">{{ data.charts.rate.xMin }} ~ {{ data.charts.rate.xMax }}</small>
</div> </div>
<span class="text-2xl font-bold">{{ data.charts.rate.rate }}%</span> <span class="text-2xl font-bold">{{ data.charts.rate.rate }}%</span>
@@ -31,7 +31,7 @@
<div class="border rounded border-neutral-300 p-2 bg-neutral-10 w-1/2"> <div class="border rounded border-neutral-300 p-2 bg-neutral-10 w-1/2">
<p class="p-2 flex justify-between items-center"> <p class="p-2 flex justify-between items-center">
<div> <div>
<span class="block text-sm font-bold mb-2">Cases<span class="material-symbols-outlined !text-sm align-middle ml-2" v-tooltip.bottom="tooltip.case">info</span></span> <span class="block text-sm font-bold mb-2">Cases<span class="material-symbols-outlined !text-sm align-middle ml-2 cursor-pointer" v-tooltip.bottom="tooltip.case">info</span></span>
<small class="text-neutral-700 font-normal block">{{ data.charts.cases.xMin }} ~ {{ data.charts.cases.xMax }}</small> <small class="text-neutral-700 font-normal block">{{ data.charts.cases.xMin }} ~ {{ data.charts.cases.xMax }}</small>
</div> </div>
<span class="text-2xl font-bold"><span class="text-cfm-primary">{{ data.charts.cases.conforming }}</span>&nbsp/&nbsp{{ data.charts.cases.total }}</span> <span class="text-2xl font-bold"><span class="text-cfm-primary">{{ data.charts.cases.conforming }}</span>&nbsp/&nbsp{{ data.charts.cases.total }}</span>
@@ -150,7 +150,7 @@
<!-- Issues list --> <!-- Issues list -->
<div v-if="data.issues === null || data.issues?.length === 0"></div> <div v-if="data.issues === null || data.issues?.length === 0"></div>
<div v-else class="border rounded border-neutral-300 p-2 bg-neutral-10 " :class="data.timeTrend.chart !== null ? 'w-1/2' : 'w-full'"> <div v-else class="border rounded border-neutral-300 p-2 bg-neutral-10 " :class="data.timeTrend.chart !== null ? 'w-1/2' : 'w-full'">
<p class="h2 pl-2 mb-2">Issue List</p> <p class="h2 pl-2 mb-2">Issue List<span class="material-symbols-outlined !text-sm align-middle ml-2 cursor-pointer" v-tooltip.bottom="tooltip.issueList">info</span></p>
<table class="text-sm min-w-full table-fixed"> <table class="text-sm min-w-full table-fixed">
<tbody> <tbody>
<tr v-for="(trace, key) in data.issues" :key="key"> <tr v-for="(trace, key) in data.issues" :key="key">
@@ -256,6 +256,10 @@ export default {
timeTrend: { timeTrend: {
value: '=Not Conforming / (total Conforming+total Not Conforming)', value: '=Not Conforming / (total Conforming+total Not Conforming)',
class: '!max-w-[36rem] !text-[10px]', class: '!max-w-[36rem] !text-[10px]',
},
issueList: {
value: 'Percentage of total issues.',
class: '!max-w-[36rem] !text-[10px]',
} }
} }
} }