avatic/lcc_tool
avatic/lcc_tool
1
0
Fork 0
Code Issues 31 Pull requests 5 Projects Releases Packages Wiki Activity Actions

copy to clipboard functionality for system log. Report view sharpening

Browse source
This commit is contained in:
Jan 2025-11-10 20:19:49 +01:00
parent 2975c8c3a1
commit a009c35b52
3 changed files with 84 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
src/frontend/src/components/layout/error/ErrorModalOverview.vue
View file

@ -1,6 +1,12 @@
<template>
<div class="error-overview-container">
<div class="error-overview">
<div>
<basic-button icon="clipboard" @click="copyToClipboard">Copy error to clipboard</basic-button>
<Toast ref="toast"/>
</div>
<div class="error-section">
<div class="error-label">Type</div>
<div class="error-value">
@ -70,6 +76,8 @@
{{ error.bulk_operation_id }}
</div>
</div>
</div>
</div>
</template>
@ -78,10 +86,13 @@
import BasicBadge from "@/components/UI/BasicBadge.vue";
import {buildDate} from "@/common.js";
import BasicButton from "@/components/UI/BasicButton.vue";
import Toast from "@/components/UI/Toast.vue";
import {error} from "loglevel";
export default {
name: "ErrorModalOverview",
components: {BasicBadge},
components: {Toast, BasicButton, BasicBadge},
props: {
isSelected: {
type: Boolean,
@ -92,6 +103,24 @@ export default {
required: true,
}
},
methods: {
async copyToClipboard() {
try {
await navigator.clipboard.writeText(JSON.stringify(this.error));
this.$refs.toast.addToast({
icon: 'Bug',
message: "The error has been copied to clipboard",
title: "Copied to clipboard",
variant: 'success',
duration: 4000
})
} catch (err) {
console.error('Fehler beim Kopieren:', err);
}
}
},
computed: {
badgeVariant() {
switch (this.error.type) {
@ -164,11 +193,11 @@ code {
.error-section {
display: grid;
grid-template-columns: 20rem 1fr;
grid-template-columns: 10rem 1fr;
align-items: center;
padding: 1.6rem;
padding: 0.8rem;
gap: 0.6rem;
border-bottom: 0.16rem solid #f3f4f6;
border-bottom: .1rem solid #E3EDFF
}
.error-label {

63
src/frontend/src/components/layout/report/Report.vue
View file

@ -16,21 +16,27 @@
<div class="box-gap">
<collapsible-box :is-collapsable="false" variant="border" title="Overview" size="m" :stretch-content="true">
<div class="report-content-container--2-col">
<div class="report-content-container--3-col">
<div class="report-content-row">
<div>MEK B</div>
<div class="report-content-data-cell">{{ report.risk.mek_b.total.toFixed(2) }}</div>
<div class="report-content-row-highlight">MEK B</div>
<div class="report-content-data-cell report-content-row-highlight">{{ report.risk.mek_b.total.toFixed(2) }} €</div>
<div class="report-content-data-cell"></div>
</div>
<div class="report-content-row">
<div>Opportunity scenario</div>
<div class="report-content-data-cell">{{ report.risk.opportunity_scenario.total.toFixed(2) }}</div>
<div class="report-content-data-cell">{{ report.risk.opportunity_scenario.total.toFixed(2) }} €</div>
<div class="report-content-data-cell">{{
`${(report.risk.opportunity_scenario.percentage * 100).toFixed(2)} %`
}}
</div>
</div>
<div class="report-content-row">
<div>Risk scenario</div>
<div class="report-content-data-cell">{{ report.risk.risk_scenario.total.toFixed(2) }}</div>
<div class="report-content-data-cell">{{ report.risk.risk_scenario.total.toFixed(2) }} €</div>
<div class="report-content-data-cell">{{ `${(report.risk.risk_scenario.percentage * 100).toFixed(2)} %`}}</div>
</div>
@ -150,7 +156,7 @@
<report-route :sections="premise.sections" :destination="premise.destination"
:route-section-scale="routeSectionScale[idx]"></report-route>
<div class="report-sub-header">Premisses</div>
<div class="report-sub-header">Premises</div>
<div class="report-content-container--2-col">
@ -191,12 +197,12 @@
</div>
<div class="report-sub-header">Packaging</div>
<div class="report-sub-header">Handling unit</div>
<div class="report-content-container--2-col">
<div class="report-content-row">
<div>HU dimensions [{{ premise.dimension_unit }}]</div>
<div>Dimensions [{{ premise.dimension_unit }}]</div>
<div class="report-content-data-cell">{{ toFixedDimension(premise.length, premise.dimension_unit) }} x
{{ toFixedDimension(premise.width, premise.dimension_unit) }} x
{{ toFixedDimension(premise.height, premise.dimension_unit) }}
@ -204,20 +210,26 @@
</div>
<div class="report-content-row">
<div>HU weight [{{ premise.weight_unit }}]</div>
<div>Weight [{{ premise.weight_unit }}]</div>
<div class="report-content-data-cell">{{ toFixedWeight(premise.weight, premise.weight_unit) }}</div>
</div>
<div class="report-content-row">
<div>HU unit count</div>
<div>Unit count</div>
<div class="report-content-data-cell">{{ premise.hu_unit_count }}</div>
</div>
<div class="report-content-row">
<div>Mixed container</div>
<div>Mixed transport</div>
<div class="report-content-data-cell">{{ premise.mixed ? 'Yes' : 'No' }}</div>
</div>
</div>
<div class="report-sub-header">Container</div>
<div class="report-content-container--2-col">
<div class="report-content-row">
<div>Stacked layers</div>
<div class="report-content-data-cell">{{ hasMainRun(premise.sections) ? premise.layer : '-' }}</div>
@ -225,17 +237,25 @@
<div class="report-content-row">
<div>Container unit count</div>
<div class="report-content-data-cell">{{hasMainRun(premise.sections) ? (premise.unit_count * premise.hu_unit_count) : '-' }}</div>
<div class="report-content-data-cell">
{{ hasMainRun(premise.sections) ? (premise.unit_count * premise.hu_unit_count) : '-' }}
</div>
</div>
<div class="report-content-row">
<div>Container type</div>
<div class="report-content-data-cell">{{hasMainRun(premise.sections) ? getContainerTypeName(premise.container_type) : '-' }}</div>
<div class="report-content-data-cell">
{{ hasMainRun(premise.sections) ? getContainerTypeName(premise.container_type) : '-' }}
</div>
</div>
<div class="report-content-row">
<div>Limiting factor</div>
<div class="report-content-data-cell">{{hasMainRun(premise.sections) ? premise.weight_exceeded ? 'Weight' : 'Volume' : '-'}}</div>
<div class="report-content-data-cell">
{{ hasMainRun(premise.sections) ? premise.weight_exceeded ? 'Weight' : 'Volume' : '-' }}
</div>
</div>
</div>
@ -333,6 +353,21 @@ export default {
text-align: right;
}
.report-content-data-cell-highlight {
background-color: #5AF0B4;
color: #002F54;
border-radius: 0.4rem;
padding: 0.2rem 0.4rem;
font-weight: 600;
}
.report-content-row-highlight {
font-weight: 500;
color: #001D33;
}
.report-content-data-header-cell {
text-align: right;
color: #001D33;

3
src/frontend/src/main.js
View file

@ -29,7 +29,7 @@ import {
PhFloppyDisk,
PhArrowCounterClockwise,
PhCheck, PhBug, PhShuffle, PhStack, PhFile, PhFilePlus, PhDownloadSimple, PhMonitor, PhCpu, PhFileJs, PhFileCloud,
PhCloudX, PhDesktop, PhHardDrives
PhCloudX, PhDesktop, PhHardDrives, PhClipboard
} from "@phosphor-icons/vue";
@ -69,6 +69,7 @@ app.component('PhStack', PhStack );
app.component('PhFile', PhFile);
app.component("PhDesktop", PhDesktop );
app.component("PhHardDrives", PhHardDrives );
app.component("PhClipboard", PhClipboard );
app.use(router);