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

Issue #166: Done.

Browse Source
This commit is contained in:
chiayin
2023-10-04 16:54:19 +08:00
parent 8a9f6ecd2e
commit a93fca36f5
9 changed files with 26 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Discover/Conformance/MoreModal.vue
View File

@@ -58,7 +58,6 @@
import { storeToRefs } from 'pinia';
import ConformanceStore from '@/stores/conformance.js';
import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js';
import getNumberLabel from '@/module/numberLabel.js';
export default {
props: ['listModal', 'listNo', 'traceId', 'firstCases', 'listTraces', 'taskSeq', 'cases', 'category'],
@@ -92,7 +91,8 @@ export default {
return {
id: trace.id,
value: Number((this.getPercentLabel(trace.count / sum))),
count: getNumberLabel(trace.count),
count: trace.count.toLocaleString('en-US'),
count_base: trace.count,
ratio: this.getPercentLabel(trace.count / sum),
};
}).sort((x, y) => x.id - y.id);

17
src/components/Discover/Conformance/StatusBar.vue
View File

@@ -85,7 +85,6 @@
<script>
import { storeToRefs } from 'pinia';
import AllMapDataStore from '@/stores/allMapData.js';
import getNumberLabel from '@/module/numberLabel.js';
import getTimeLabel from '@/module/timeLabel.js';
import getMoment from 'moment';
@@ -117,23 +116,23 @@ export default {
getStatData() {
this.statData = {
cases: {
count: getNumberLabel(this.stats.cases.count),
total: getNumberLabel(this.stats.cases.total),
count: this.stats.cases.count.toLocaleString('en-US'),
total: this.stats.cases.total.toLocaleString('en-US'),
ratio: this.getPercentLabel(this.stats.cases.ratio)
},
traces: {
count: getNumberLabel(this.stats.traces.count),
total: getNumberLabel(this.stats.traces.total),
count: this.stats.traces.count.toLocaleString('en-US'),
total: this.stats.traces.total.toLocaleString('en-US'),
ratio: this.getPercentLabel(this.stats.traces.ratio)
},
task_instances: {
count: getNumberLabel(this.stats.task_instances.count),
total: getNumberLabel(this.stats.task_instances.total),
count: this.stats.task_instances.count.toLocaleString('en-US'),
total: this.stats.task_instances.total.toLocaleString('en-US'),
ratio: this.getPercentLabel(this.stats.task_instances.ratio)
},
tasks: {
count: getNumberLabel(this.stats.tasks.count),
total: getNumberLabel(this.stats.tasks.total),
count: this.stats.tasks.count.toLocaleString('en-US'),
total: this.stats.tasks.total.toLocaleString('en-US'),
ratio: this.getPercentLabel(this.stats.tasks.ratio)
},
started_at: getMoment(this.stats.started_at).format('YYYY-MM-DD HH:mm'),

2
src/components/Discover/Map/Filter/ActOcc.vue
View File

@@ -12,7 +12,7 @@
<Row>
<Column selectionMode="single" headerClass="w-8 !p-2 !bg-neutral-10 !border-neutral-500 sticky top-0 left-0 z-10 bg-neutral-10"></Column>
<Column field="label" header="Activity" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" sortable />
<Column field="occ_value" header="Occurrences" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" sortable :colspan="3" />
<Column field="occurrences_base" header="Occurrences" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" sortable :colspan="3" />
</Row>
</ColumnGroup>
<Column selectionMode="single" bodyClass="!p-2 !border-0"></Column>

4
src/components/Discover/Map/Filter/ActOccCase.vue
View File

@@ -12,8 +12,8 @@
<Row>
<Column selectionMode="multiple" headerClass="w-8 !p-2 !bg-neutral-10 !border-neutral-500 sticky top-0 left-0 z-10 bg-neutral-10 allCheckboxAct"></Column>
<Column field="label" header="Activity" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" sortable />
<Column field="occ_value" header="Occurrences" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" sortable :colspan="3" />
<Column field="case_value" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" header="Cases with Activity" sortable :colspan="3" />
<Column field="occurrences_base" header="Occurrences" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" sortable :colspan="3" />
<Column field="cases_base" headerClass="!bg-neutral-10 !border-neutral-500 !py-2 sticky top-0 left-0 z-10 bg-neutral-10" header="Cases with Activity" sortable :colspan="3" />
</Row>
</ColumnGroup>
<Column selectionMode="multiple" bodyClass="!p-2 !border-0"></Column>

3
src/components/Discover/Map/Filter/Trace.vue
View File

@@ -66,7 +66,6 @@ import { storeToRefs } from 'pinia';
import AllMapDataStore from '@/stores/allMapData.js';
import LoadingStore from '@/stores/loading.js';
import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js';
import numberLabel from '@/module/numberLabel.js';
export default {
expose: ['selectArea', 'showTraceId', 'traceTotal'],
@@ -101,7 +100,7 @@ export default {
return {
id: trace.id,
value: this.progressWidth(Number(((trace.count / this.traceCountTotal) * 100).toFixed(1))),
count: numberLabel(trace.count),
count: trace.count.toLocaleString(),
base_count: trace.count,
ratio: this.getPercentLabel(trace.count / this.traceCountTotal),
};

8
src/components/Discover/Map/SidebarFilter.vue
View File

@@ -264,12 +264,14 @@ export default {
label: task.label,
occ_value: Number(task.occurrence_ratio * 100),
occurrences: Number(task.occurrences).toLocaleString('en-US'),
occurrences_base: task.occurrences,
occurrence_ratio: this.getPercentLabel(task.occurrence_ratio),
case_value: Number(task.case_ratio * 100),
cases: task.cases.toLocaleString('en-US'),
cases_base: task.cases,
case_ratio: this.getPercentLabel(task.case_ratio),
};
}).sort((x, y) => y.occurrences - x.occurrences);
}).sort((x, y) => y.occurrences_base - x.occurrences_base);
},
// 調整 filterStartData / filterEndData / filterStartToEndData / filterEndToStartData 的內容
/**
@@ -281,11 +283,13 @@ export default {
let data = {
label: task.label,
occ_value: Number(task.occurrence_ratio * 100),
occurrences: Number(task.occurrences).toLocaleString('en-US'),
occurrences: task.occurrences.toLocaleString('en-US'),
occurrences_base: task.occurrences,
occurrence_ratio: this.getPercentLabel(task.occurrence_ratio),
};
list.push(data);
});
list.sort((x, y) => y.occurrences_base - x.occurrences_base)
return list;
},
/**

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

@@ -14,7 +14,7 @@
<p class="h2">Cases</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ numberLabel(stats.cases.count) }} / {{ numberLabel(stats.cases.total) }}</span>
<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>
</div>
<span class="block text-primary text-2xl font-medium">{{ getPercentLabel(stats.cases.ratio) }}</span>
@@ -24,7 +24,7 @@
<p class="h2">Traces</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ numberLabel(stats.traces.count) }} / {{ numberLabel(stats.traces.total) }}</span>
<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>
</div>
<span class="block text-primary text-2xl font-medium">{{ getPercentLabel(stats.traces.ratio) }}</span>
@@ -34,7 +34,7 @@
<p class="h2">Activity Instances</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ numberLabel(stats.task_instances.count) }} / {{ numberLabel(stats.task_instances.total) }}</span>
<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>
</div>
<span class="block text-primary text-2xl font-medium">{{ getPercentLabel(stats.task_instances.ratio) }}</span>
@@ -44,7 +44,7 @@
<p class="h2">Activities</p>
<div class="flex justify-between items-center">
<div class="w-full mr-8">
<span class="block text-sm">{{ numberLabel(stats.tasks.count) }} / {{ numberLabel(stats.tasks.total) }}</span>
<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>
</div>
<span class="block text-primary text-2xl font-medium">{{ getPercentLabel(stats.tasks.ratio) }}</span>
@@ -164,7 +164,6 @@
</template>
<script>
import getNumberLabel from '@/module/numberLabel.js';
import getTimeLabel from '@/module/timeLabel.js';
import getMoment from 'moment';
@@ -212,12 +211,6 @@ export default {
moment(time){
return getMoment(time).format('YYYY-MM-DD HH:mm');
},
/**
* @param {number} num use numberLabel.js
*/
numberLabel(num){
return getNumberLabel(num);
},
/**
* Number to percentage
* @param {number} val

3
src/components/Discover/Map/SidebarTraces.vue
View File

@@ -56,7 +56,6 @@
<script>
import cytoscapeMapTrace from '@/module/cytoscapeMapTrace.js';
import AllMapDataStore from '@/stores/allMapData.js';
import numberLabel from '@/module/numberLabel.js';
export default {
props: {
@@ -89,7 +88,7 @@ export default {
return {
id: trace.id,
value: this.progressWidth(Number(((trace.count / sum) * 100).toFixed(1))),
count: numberLabel(trace.count),
count: trace.count.toLocaleString(),
base_count: trace.count,
ratio: this.getPercentLabel(trace.count / sum),
};

1
src/module/numberLabel.js
View File

@@ -1,5 +1,6 @@
/**
* 將數字轉換成帶有逗號格式(ex: 1000 -> 1,000)
* 也可以改用原生 JS 方法 `.toLocaleString('en-US')`
* @param {number} num
* @returns
*/