Sessions: only show columns if relevant values are present (#8586)
This commit is contained in:
parent
cc587dc2ce
commit
f577724c52
3 changed files with 67 additions and 10 deletions
|
|
@ -49,7 +49,12 @@
|
|||
<th scope="col" class="align-top ps-0">
|
||||
{{ $t("sessions.date") }}
|
||||
</th>
|
||||
<th scope="col" class="align-top">
|
||||
<th
|
||||
v-if="showLoadpoints"
|
||||
scope="col"
|
||||
class="align-top"
|
||||
data-testid="loadpoint"
|
||||
>
|
||||
{{ $t("sessions.loadpoint") }}
|
||||
<label class="position-relative d-block">
|
||||
<select
|
||||
|
|
@ -77,7 +82,12 @@
|
|||
</span>
|
||||
</label>
|
||||
</th>
|
||||
<th scope="col" class="align-top">
|
||||
<th
|
||||
v-if="showVehicles"
|
||||
scope="col"
|
||||
class="align-top"
|
||||
data-testid="vehicle"
|
||||
>
|
||||
{{ $t("sessions.vehicle") }}
|
||||
<label class="position-relative d-block">
|
||||
<select
|
||||
|
|
@ -137,7 +147,12 @@
|
|||
{{ fmtPricePerKWh(pricePerKWh, currency) }}
|
||||
</div>
|
||||
</th>
|
||||
<th v-if="hasCo2" scope="col" class="align-top text-end pe-0">
|
||||
<th
|
||||
v-if="hasCo2"
|
||||
scope="col"
|
||||
class="align-top text-end pe-0"
|
||||
data-testid="co2"
|
||||
>
|
||||
{{ $t("sessions.co2") }}
|
||||
<div v-if="co2PerKWh != null" class="text-muted fw-normal">
|
||||
{{ fmtCo2Medium(co2PerKWh) }}
|
||||
|
|
@ -154,12 +169,12 @@
|
|||
@click="showDetails(session.id)"
|
||||
>
|
||||
<td class="ps-0">
|
||||
{{ fmtFullDateTime(new Date(session.created), true) }}
|
||||
<u>{{ fmtFullDateTime(new Date(session.created), true) }}</u>
|
||||
</td>
|
||||
<td>
|
||||
<td v-if="showLoadpoints">
|
||||
{{ session.loadpoint }}
|
||||
</td>
|
||||
<td>
|
||||
<td v-if="showVehicles">
|
||||
{{ session.vehicle }}
|
||||
</td>
|
||||
<td class="text-end">
|
||||
|
|
@ -314,6 +329,20 @@ export default {
|
|||
hasCo2() {
|
||||
return this.filteredSessions.find((s) => s.co2PerKWh != null) != null;
|
||||
},
|
||||
showVehicles() {
|
||||
return this.hasMultipleVehicles || this.vehicleFilter;
|
||||
},
|
||||
showLoadpoints() {
|
||||
return this.hasMultipleLoadpoints || this.loadpointFilter;
|
||||
},
|
||||
hasMultipleVehicles() {
|
||||
const vehicles = this.currentSessions.map((s) => s.vehicle);
|
||||
return new Set(vehicles).size > 1;
|
||||
},
|
||||
hasMultipleLoadpoints() {
|
||||
const loadpoints = this.currentSessions.map((s) => s.loadpoint);
|
||||
return new Set(loadpoints).size > 1;
|
||||
},
|
||||
pricePerKWh() {
|
||||
return this.price / this.chargedEnergy;
|
||||
},
|
||||
|
|
|
|||
|
|
@ -132,6 +132,33 @@ test.describe("filter", async () => {
|
|||
});
|
||||
});
|
||||
|
||||
test.describe("columns", async () => {
|
||||
test("show vehicle column if multiple different exist", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=5");
|
||||
await expect(page.getByTestId("vehicle")).toBeVisible();
|
||||
});
|
||||
test("hide vehicle column only one exists", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=3");
|
||||
await expect(page.getByTestId("vehicle")).toHaveCount(0);
|
||||
});
|
||||
test("show loadpoint column if multiple different exist", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=5");
|
||||
await expect(page.getByTestId("loadpoint")).toBeVisible();
|
||||
});
|
||||
test("hide loadpoint column only one exists", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=3");
|
||||
await expect(page.getByTestId("loadpoint")).toHaveCount(0);
|
||||
});
|
||||
test("show co2 column it has values", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=3");
|
||||
await expect(page.getByTestId("co2")).toBeVisible();
|
||||
});
|
||||
test("hide co2 column if it doesnt have values", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=5");
|
||||
await expect(page.getByTestId("co2")).toHaveCount(0);
|
||||
});
|
||||
});
|
||||
|
||||
test.describe("csv export", async () => {
|
||||
test("total export", async ({ page }) => {
|
||||
await page.goto("/#/sessions?year=2023&month=5");
|
||||
|
|
|
|||
|
|
@ -17,7 +17,8 @@ CREATE TABLE `sessions` (
|
|||
PRIMARY KEY (`id`)
|
||||
);
|
||||
|
||||
INSERT INTO `sessions` VALUES (1,'2023-05-02 08:00:00.0+02:00','2023-05-02 12:00:00.0+02:00','Carport',NULL,'blauer e-Golf',NULL,NULL,10,NULL,100,2,0.2,NULL);
|
||||
INSERT INTO `sessions` VALUES (2,'2023-05-02 08:00:00.0+02:00','2023-05-02 12:00:00.0+02:00','Carport',NULL,'blauer e-Golf',NULL,NULL,2.5,NULL,88.21,0.75,0.3,NULL);
|
||||
INSERT INTO `sessions` VALUES (3,'2023-05-03 16:00:00.0+02:00','2023-05-03 20:00:00.0+02:00','Carport',NULL,'weißes Model 3',NULL,NULL,2.5,NULL,50,0.25,0.1,NULL);
|
||||
INSERT INTO `sessions` VALUES (4,'2023-05-04 22:00:00.0+02:00','2023-05-05 06:00:00.0+02:00','Garage',NULL,'weißes Model 3',NULL,NULL,5,NULL,0,2.5,0.5,NULL);
|
||||
INSERT INTO `sessions` VALUES (1,'2023-03-01 08:00:00.0+02:00','2023-05-02 12:00:00.0+02:00','Carport',NULL,'blauer e-Golf',NULL,NULL,10,NULL,100,2,0.2,300);
|
||||
INSERT INTO `sessions` VALUES (2,'2023-05-02 08:00:00.0+02:00','2023-05-02 12:00:00.0+02:00','Carport',NULL,'blauer e-Golf',NULL,NULL,10,NULL,100,2,0.2,NULL);
|
||||
INSERT INTO `sessions` VALUES (3,'2023-05-02 08:00:00.0+02:00','2023-05-02 12:00:00.0+02:00','Carport',NULL,'blauer e-Golf',NULL,NULL,2.5,NULL,88.21,0.75,0.3,NULL);
|
||||
INSERT INTO `sessions` VALUES (4,'2023-05-03 16:00:00.0+02:00','2023-05-03 20:00:00.0+02:00','Carport',NULL,'weißes Model 3',NULL,NULL,2.5,NULL,50,0.25,0.1,NULL);
|
||||
INSERT INTO `sessions` VALUES (5,'2023-05-04 22:00:00.0+02:00','2023-05-05 06:00:00.0+02:00','Garage',NULL,'weißes Model 3',NULL,NULL,5,NULL,0,2.5,0.5,NULL);
|
||||
Loading…
Add table
Add a link
Reference in a new issue