Skip to content

Commit bd2def7

Browse files
authored
Koala Update scheduled / time plans (#3033)
* Reorder input items in scheduled charging and time charging * Add Info message to scheduled plan - fix text inconsistencies * Add info message to time plan dialog - formatting fixes * Remove information box / text from charging plans * Edit limit text in time charging plan
1 parent 17f7e78 commit bd2def7

File tree

5 files changed

+154
-157
lines changed

5 files changed

+154
-157
lines changed

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -165,7 +165,7 @@ const limitModes = computed(() => {
165165
let modes = [
166166
{ value: 'none', label: 'keine', color: 'primary' },
167167
{ value: 'soc', label: 'EV-SoC', color: 'primary' },
168-
{ value: 'amount', label: 'Energiemenge', color: 'primary' },
168+
{ value: 'amount', label: 'Energie', color: 'primary' },
169169
];
170170
if (vehicleSocType.value === undefined) {
171171
modes = modes.filter((mode) => mode.value !== 'soc');

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ const limitModes = computed(() => {
8181
let modes = [
8282
{ value: 'none', label: 'keine', color: 'primary' },
8383
{ value: 'soc', label: 'EV-SoC', color: 'primary' },
84-
{ value: 'amount', label: 'Energiemenge', color: 'primary' },
84+
{ value: 'amount', label: 'Energie', color: 'primary' },
8585
];
8686
if (vehicleSocType.value === undefined) {
8787
modes = modes.filter((mode) => mode.value !== 'soc');

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -142,7 +142,7 @@ const limitModes = computed(() => {
142142
let modes = [
143143
{ value: 'none', label: 'keine', color: 'primary' },
144144
{ value: 'soc', label: 'EV-SoC', color: 'primary' },
145-
{ value: 'amount', label: 'Energiemenge', color: 'primary' },
145+
{ value: 'amount', label: 'Energie', color: 'primary' },
146146
];
147147
if (vehicleSocType.value === undefined) {
148148
modes = modes.filter((mode) => mode.value !== 'soc');

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

Lines changed: 84 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<q-card class="rounded-borders-md">
2+
<q-card>
33
<q-card-section>
44
<div class="row no-wrap">
55
<div class="text-h6 ellipsis" :title="planName.value">
@@ -26,10 +26,59 @@
2626
<q-input
2727
v-model="planTime.value"
2828
type="time"
29-
label="Ziel-Uhrzeit"
29+
label="Ziel-Termin"
3030
class="col"
3131
/>
3232
</div>
33+
<div class="q-mb-sm">
34+
<div class="text-subtitle2 q-mb-sm q-mt-sm">Wiederholungen</div>
35+
<q-btn-group spread>
36+
<q-btn
37+
size="sm"
38+
:color="planFrequency.value === 'once' ? 'primary' : 'grey'"
39+
@click="planFrequency.value = 'once'"
40+
label="Einmalig"
41+
/>
42+
<q-btn
43+
size="sm"
44+
:color="planFrequency.value === 'daily' ? 'primary' : 'grey'"
45+
@click="planFrequency.value = 'daily'"
46+
label="Täglich"
47+
/>
48+
<q-btn
49+
size="sm"
50+
:color="planFrequency.value === 'weekly' ? 'primary' : 'grey'"
51+
@click="planFrequency.value = 'weekly'"
52+
label="Wöchentlich"
53+
/>
54+
</q-btn-group>
55+
<div v-if="planFrequency.value === 'once'" class="q-mt-sm">
56+
<q-input
57+
v-model="planOnceDate.value"
58+
type="date"
59+
label="Datum"
60+
:min="new Date().toISOString().split('T')[0]"
61+
/>
62+
</div>
63+
<!-- Weekly buttons -->
64+
<div
65+
v-if="planFrequency.value === 'weekly'"
66+
class="q-mt-sm row items-center q-gutter-sm justify-center no-wrap"
67+
>
68+
<div v-for="(day, index) in weekDays" :key="day">
69+
<q-btn
70+
round
71+
:size="$q.platform.is.mobile ? '0.8rem' : '0.7rem'"
72+
:flat="!selectedWeekDays[index]"
73+
:outline="selectedWeekDays[index]"
74+
color="primary"
75+
:label="day"
76+
:class="{ deselected: !selectedWeekDays[index] }"
77+
@click="selectDay(index)"
78+
/>
79+
</div>
80+
</div>
81+
</div>
3382
<SliderStandard
3483
class="q-mb-sm"
3584
:title="planDcChargingEnabled ? 'Ladestrom (AC)' : 'Ladestrom'"
@@ -48,13 +97,44 @@
4897
<div class="text-body2">kW</div>
4998
</template>
5099
</q-input>
100+
<div class="text-subtitle2 q-mr-sm">Anzahl Phasen Zielladen</div>
101+
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
102+
<q-btn-group class="col">
103+
<q-btn
104+
v-for="option in phaseOptions"
105+
:key="option.value"
106+
:color="planNumPhases.value === option.value ? 'primary' : 'grey'"
107+
:label="option.label"
108+
size="sm"
109+
class="col"
110+
@click="planNumPhases.value = option.value"
111+
/>
112+
</q-btn-group>
113+
</div>
114+
<div class="text-subtitle2 q-mt-md q-mr-sm">
115+
Anzahl Phasen bei PV-Überschuss
116+
</div>
117+
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
118+
<q-btn-group class="col">
119+
<q-btn
120+
v-for="option in phaseOptions"
121+
:key="option.value"
122+
:color="planNumPhasesPv.value === option.value ? 'primary' : 'grey'"
123+
:label="option.label"
124+
size="sm"
125+
class="col"
126+
@click="planNumPhasesPv.value = option.value"
127+
/>
128+
</q-btn-group>
129+
</div>
130+
<div class="text-subtitle2 q-mt-sm q-mr-sm">Ziel</div>
51131
<q-btn-group class="full-width">
52132
<q-btn
53133
size="sm"
54134
class="flex-grow"
55135
:color="planLimitSelected.value === 'soc' ? 'primary' : 'grey'"
56136
@click="planLimitSelected.value = 'soc'"
57-
label="SoC"
137+
label="EV-SoC"
58138
/>
59139
<q-btn
60140
size="sm"
@@ -93,7 +173,6 @@
93173
<div class="text-body2">kWh</div>
94174
</template>
95175
</q-input>
96-
97176
<div
98177
v-if="
99178
planLimitSelected.value === 'soc' &&
@@ -120,55 +199,6 @@
120199
label="Bidirektionales Ladeleistung (kW)"
121200
class="col"
122201
/>
123-
<div class="q-mb-md">
124-
<div class="text-subtitle2 q-mb-sm q-mt-sm">Wiederholungen</div>
125-
<q-btn-group spread>
126-
<q-btn
127-
size="sm"
128-
:color="planFrequency.value === 'once' ? 'primary' : 'grey'"
129-
@click="planFrequency.value = 'once'"
130-
label="Einmalig"
131-
/>
132-
<q-btn
133-
size="sm"
134-
:color="planFrequency.value === 'daily' ? 'primary' : 'grey'"
135-
@click="planFrequency.value = 'daily'"
136-
label="Täglich"
137-
/>
138-
<q-btn
139-
size="sm"
140-
:color="planFrequency.value === 'weekly' ? 'primary' : 'grey'"
141-
@click="planFrequency.value = 'weekly'"
142-
label="Wöchentlich"
143-
/>
144-
</q-btn-group>
145-
<div v-if="planFrequency.value === 'once'" class="q-mt-sm">
146-
<q-input
147-
v-model="planOnceDate.value"
148-
type="date"
149-
label="Datum"
150-
:min="new Date().toISOString().split('T')[0]"
151-
/>
152-
</div>
153-
<!-- Weekly buttons -->
154-
<div
155-
v-if="planFrequency.value === 'weekly'"
156-
class="q-mt-sm row items-center q-gutter-sm justify-center no-wrap"
157-
>
158-
<div v-for="(day, index) in weekDays" :key="day">
159-
<q-btn
160-
round
161-
:size="$q.platform.is.mobile ? '0.8rem' : '0.7rem'"
162-
:flat="!selectedWeekDays[index]"
163-
:outline="selectedWeekDays[index]"
164-
color="primary"
165-
:label="day"
166-
:class="{ deselected: !selectedWeekDays[index] }"
167-
@click="selectDay(index)"
168-
/>
169-
</div>
170-
</div>
171-
</div>
172202
<div class="row items-center justify-between">
173203
<div class="text-subtitle2 q-mr-sm">Strompreisbasiert laden</div>
174204
<ToggleStandard
@@ -177,37 +207,7 @@
177207
color="positive"
178208
/>
179209
</div>
180-
<div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen Zielladen</div>
181-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
182-
<q-btn-group class="col">
183-
<q-btn
184-
v-for="option in phaseOptions"
185-
:key="option.value"
186-
:color="planNumPhases.value === option.value ? 'primary' : 'grey'"
187-
:label="option.label"
188-
size="sm"
189-
class="col"
190-
@click="planNumPhases.value = option.value"
191-
/>
192-
</q-btn-group>
193-
</div>
194-
<div class="text-subtitle2 q-mt-md q-mr-sm">
195-
Anzahl Phasen bei PV-Überschuss
196-
</div>
197-
<div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
198-
<q-btn-group class="col">
199-
<q-btn
200-
v-for="option in phaseOptions"
201-
:key="option.value"
202-
:color="planNumPhasesPv.value === option.value ? 'primary' : 'grey'"
203-
:label="option.label"
204-
size="sm"
205-
class="col"
206-
@click="planNumPhasesPv.value = option.value"
207-
/>
208-
</q-btn-group>
209-
</div>
210-
<div class="row q-mt-lg">
210+
<div class="row q-mt-md">
211211
<q-btn
212212
size="sm"
213213
class="col"

0 commit comments

Comments
 (0)