Skip to content

Commit c8d758d

Browse files
authored
Charge point inputs displayed according to charge type AC/DC (#3081)
1 parent 2c49c65 commit c8d758d

File tree

6 files changed

+187
-108
lines changed

6 files changed

+187
-108
lines changed

packages/modules/web_themes/koala/source/src/components/ChargePointEcoSettings.vue

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<template>
22
<SliderStandard
3+
v-if="acChargingEnabled"
34
title="Minimaler Dauerstrom unter der Preisgrenze"
45
:min="6"
56
:max="16"
@@ -10,7 +11,7 @@
1011
/>
1112

1213
<SliderStandard
13-
v-if="dcCharging"
14+
v-if="dcChargingEnabled"
1415
title="Minimaler Dauerleistung unter der Preisgrenze"
1516
:min="4"
1617
:max="300"
@@ -20,19 +21,23 @@
2021
class="q-mt-md"
2122
/>
2223

23-
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen bei Überschuss</div>
24-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
25-
<q-btn-group class="col">
26-
<q-btn
27-
v-for="option in phaseOptions"
28-
:key="option.value"
29-
:color="numPhases.value === option.value ? 'primary' : 'grey'"
30-
:label="option.label"
31-
size="sm"
32-
class="col"
33-
@click="numPhases.value = option.value"
34-
/>
35-
</q-btn-group>
24+
<div v-if="acChargingEnabled">
25+
<div class="text-subtitle2 q-mt-sm q-mr-sm">
26+
Anzahl Phasen bei Überschuss
27+
</div>
28+
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
29+
<q-btn-group class="col">
30+
<q-btn
31+
v-for="option in phaseOptions"
32+
:key="option.value"
33+
:color="numPhases.value === option.value ? 'primary' : 'grey'"
34+
:label="option.label"
35+
size="sm"
36+
class="col"
37+
@click="numPhases.value = option.value"
38+
/>
39+
</q-btn-group>
40+
</div>
3641
</div>
3742

3843
<div class="text-subtitle2 q-mt-sm q-mr-sm">Begrenzung</div>
@@ -187,7 +192,13 @@ const current = computed(() =>
187192
mqttStore.chargePointConnectedVehicleEcoChargeCurrent(props.chargePointId),
188193
);
189194
190-
const dcCharging = computed(() => mqttStore.dcChargingEnabled);
195+
const dcChargingEnabled = computed(
196+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'DC',
197+
);
198+
199+
const acChargingEnabled = computed(
200+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'AC',
201+
);
191202
192203
const dcPower = computed(() =>
193204
mqttStore.chargePointConnectedVehicleEcoChargeDcPower(props.chargePointId),

packages/modules/web_themes/koala/source/src/components/ChargePointInstantSettings.vue

Lines changed: 24 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<template>
22
<SliderStandard
3+
v-if="acChargingEnabled"
34
title="Stromstärke"
45
:min="6"
56
:max="32"
@@ -8,7 +9,7 @@
89
class="q-mt-sm"
910
/>
1011
<SliderStandard
11-
v-if="dcCharging"
12+
v-if="dcChargingEnabled"
1213
title="DC-Sollleistung"
1314
:min="4"
1415
:max="300"
@@ -17,19 +18,21 @@
1718
class="q-mt-sm"
1819
/>
1920

20-
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen</div>
21-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
22-
<q-btn-group class="col">
23-
<q-btn
24-
v-for="option in phaseOptions"
25-
:key="option.value"
26-
:color="numPhases.value === option.value ? 'primary' : 'grey'"
27-
:label="option.label"
28-
size="sm"
29-
class="col"
30-
@click="numPhases.value = option.value"
31-
/>
32-
</q-btn-group>
21+
<div v-if="acChargingEnabled">
22+
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen</div>
23+
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
24+
<q-btn-group class="col">
25+
<q-btn
26+
v-for="option in phaseOptions"
27+
:key="option.value"
28+
:color="numPhases.value === option.value ? 'primary' : 'grey'"
29+
:label="option.label"
30+
size="sm"
31+
class="col"
32+
@click="numPhases.value = option.value"
33+
/>
34+
</q-btn-group>
35+
</div>
3336
</div>
3437
<div class="text-subtitle2 q-mt-sm q-mr-sm">Begrenzung</div>
3538
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
@@ -104,7 +107,13 @@ const instantChargeCurrent = computed(() =>
104107
),
105108
);
106109
107-
const dcCharging = computed(() => mqttStore.dcChargingEnabled);
110+
const dcChargingEnabled = computed(
111+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'DC',
112+
);
113+
114+
const acChargingEnabled = computed(
115+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'AC',
116+
);
108117
109118
const instantChargeCurrentDc = computed(() => {
110119
return mqttStore.chargePointConnectedVehicleInstantDcChargePower(

packages/modules/web_themes/koala/source/src/components/ChargePointPvSettings.vue

Lines changed: 43 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<template>
22
<SliderStandard
3+
v-if="acChargingEnabled"
34
title="Minimaler Dauerstrom"
45
:min="0"
56
:max="16"
@@ -12,7 +13,7 @@
1213
/>
1314

1415
<SliderStandard
15-
v-if="dcCharging"
16+
v-if="dcChargingEnabled"
1617
title="Minimaler DC-Dauerleistung"
1718
:min="0"
1819
:max="300"
@@ -22,19 +23,21 @@
2223
class="q-mt-md"
2324
/>
2425

25-
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen</div>
26-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
27-
<q-btn-group class="col">
28-
<q-btn
29-
v-for="option in phaseOptions"
30-
:key="option.value"
31-
:color="numPhases.value === option.value ? 'primary' : 'grey'"
32-
:label="option.label"
33-
size="sm"
34-
class="col"
35-
@click="numPhases.value = option.value"
36-
/>
37-
</q-btn-group>
26+
<div v-if="acChargingEnabled">
27+
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen</div>
28+
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
29+
<q-btn-group class="col">
30+
<q-btn
31+
v-for="option in phaseOptions"
32+
:key="option.value"
33+
:color="numPhases.value === option.value ? 'primary' : 'grey'"
34+
:label="option.label"
35+
size="sm"
36+
class="col"
37+
@click="numPhases.value = option.value"
38+
/>
39+
</q-btn-group>
40+
</div>
3841
</div>
3942

4043
<div class="text-subtitle2 q-mt-sm q-mr-sm">Begrenzung</div>
@@ -82,6 +85,7 @@
8285
class="q-mt-md"
8386
/>
8487
<SliderStandard
88+
v-if="acChargingEnabled"
8589
title="Mindest-SoC-Strom"
8690
:min="6"
8791
:max="32"
@@ -91,7 +95,7 @@
9195
/>
9296

9397
<SliderStandard
94-
v-if="dcCharging"
98+
v-if="dcChargingEnabled"
9599
title="DC Mindest-SoC-Leistung"
96100
:min="0"
97101
:max="300"
@@ -100,19 +104,23 @@
100104
v-model="pvMinDcMinSocPower.value"
101105
class="q-mt-md"
102106
/>
103-
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen Mindest-SoC</div>
104-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
105-
<q-btn-group class="col">
106-
<q-btn
107-
v-for="option in phaseOptionsMinSoc"
108-
:key="option.value"
109-
:color="numPhasesMinSoc.value === option.value ? 'primary' : 'grey'"
110-
:label="option.label"
111-
size="sm"
112-
class="col"
113-
@click="numPhasesMinSoc.value = option.value"
114-
/>
115-
</q-btn-group>
107+
<div v-if="acChargingEnabled">
108+
<div class="text-subtitle2 q-mt-sm q-mr-sm">
109+
Anzahl Phasen Mindest-SoC
110+
</div>
111+
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
112+
<q-btn-group class="col">
113+
<q-btn
114+
v-for="option in phaseOptionsMinSoc"
115+
:key="option.value"
116+
:color="numPhasesMinSoc.value === option.value ? 'primary' : 'grey'"
117+
:label="option.label"
118+
size="sm"
119+
class="col"
120+
@click="numPhasesMinSoc.value = option.value"
121+
/>
122+
</q-btn-group>
123+
</div>
116124
</div>
117125
</div>
118126

@@ -169,7 +177,13 @@ const pvMinCurrent = computed(() =>
169177
mqttStore.chargePointConnectedVehiclePvChargeMinCurrent(props.chargePointId),
170178
);
171179
172-
const dcCharging = computed(() => mqttStore.dcChargingEnabled);
180+
const dcChargingEnabled = computed(
181+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'DC',
182+
);
183+
184+
const acChargingEnabled = computed(
185+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'AC',
186+
);
173187
174188
const pvMinDcPower = computed(() =>
175189
mqttStore.chargePointConnectedVehiclePvDcChargePower(props.chargePointId),

packages/modules/web_themes/koala/source/src/components/ChargePointScheduledPlanDetails.vue

Lines changed: 47 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -103,15 +103,16 @@
103103
</div>
104104
<q-separator />
105105
<SliderStandard
106+
v-if="acChargingEnabled"
106107
class="q-my-sm"
107-
:title="planDcChargingEnabled ? 'Ladestrom (AC)' : 'Ladestrom'"
108+
title="Ladestrom"
108109
:min="6"
109110
:max="32"
110111
unit="A"
111112
v-model="planCurrent.value"
112113
/>
113114
<q-input
114-
v-if="planDcChargingEnabled"
115+
v-if="dcChargingEnabled"
115116
v-model="planDcPower.value"
116117
label="Ladeleistung (DC)"
117118
class="col q-mb-md"
@@ -120,35 +121,43 @@
120121
<div class="text-body2">kW</div>
121122
</template>
122123
</q-input>
123-
<div class="text-subtitle2 q-mr-sm">Anzahl Phasen Zielladen</div>
124-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
125-
<q-btn-group class="col">
126-
<q-btn
127-
v-for="option in phaseOptions"
128-
:key="option.value"
129-
:color="planNumPhases.value === option.value ? 'primary' : 'grey'"
130-
:label="option.label"
131-
size="sm"
132-
class="col"
133-
@click="planNumPhases.value = option.value"
134-
/>
135-
</q-btn-group>
136-
</div>
137-
<div class="text-subtitle2 q-mt-md q-mr-sm">
138-
Anzahl Phasen bei PV-Überschuss
139-
</div>
140-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
141-
<q-btn-group class="col">
142-
<q-btn
143-
v-for="option in phaseOptions"
144-
:key="option.value"
145-
:color="planNumPhasesPv.value === option.value ? 'primary' : 'grey'"
146-
:label="option.label"
147-
size="sm"
148-
class="col"
149-
@click="planNumPhasesPv.value = option.value"
150-
/>
151-
</q-btn-group>
124+
<div v-if="acChargingEnabled">
125+
<div class="text-subtitle2 q-mr-sm">Anzahl Phasen Zielladen</div>
126+
<div
127+
class="row items-center justify-center q-ma-none q-pa-none no-wrap"
128+
>
129+
<q-btn-group class="col">
130+
<q-btn
131+
v-for="option in phaseOptions"
132+
:key="option.value"
133+
:color="planNumPhases.value === option.value ? 'primary' : 'grey'"
134+
:label="option.label"
135+
size="sm"
136+
class="col"
137+
@click="planNumPhases.value = option.value"
138+
/>
139+
</q-btn-group>
140+
</div>
141+
<div class="text-subtitle2 q-mt-md q-mr-sm">
142+
Anzahl Phasen bei PV-Überschuss
143+
</div>
144+
<div
145+
class="row items-center justify-center q-ma-none q-pa-none no-wrap"
146+
>
147+
<q-btn-group class="col">
148+
<q-btn
149+
v-for="option in phaseOptions"
150+
:key="option.value"
151+
:color="
152+
planNumPhasesPv.value === option.value ? 'primary' : 'grey'
153+
"
154+
:label="option.label"
155+
size="sm"
156+
class="col"
157+
@click="planNumPhasesPv.value = option.value"
158+
/>
159+
</q-btn-group>
160+
</div>
152161
</div>
153162
<div class="text-subtitle2 q-mt-sm q-mr-sm">Ziel</div>
154163
<q-btn-group class="full-width">
@@ -402,7 +411,13 @@ const chargePointConnectedVehicleBidiEnabled = computed(
402411
mqttStore.chargePointConnectedVehicleBidiEnabled(props.chargePointId).value,
403412
);
404413
405-
const planDcChargingEnabled = computed(() => mqttStore.dcChargingEnabled);
414+
const dcChargingEnabled = computed(
415+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'DC',
416+
);
417+
418+
const acChargingEnabled = computed(
419+
() => mqttStore.chargePointChargeType(props.chargePointId).value === 'AC',
420+
);
406421
407422
const planDcPower = computed(() =>
408423
mqttStore.vehicleScheduledChargingPlanDcPower(

0 commit comments

Comments
 (0)