Koala Update scheduled / time plans

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

@@ -165,7 +165,7 @@ const limitModes = computed(() => {
   let modes = [
     { value: 'none', label: 'keine', color: 'primary' },
     { value: 'soc', label: 'EV-SoC', color: 'primary' },
-    { value: 'amount', label: 'Energiemenge', color: 'primary' },
+    { value: 'amount', label: 'Energie', color: 'primary' },
   ];
   if (vehicleSocType.value === undefined) {
     modes = modes.filter((mode) => mode.value !== 'soc');

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

@@ -81,7 +81,7 @@ const limitModes = computed(() => {
   let modes = [
     { value: 'none', label: 'keine', color: 'primary' },
     { value: 'soc', label: 'EV-SoC', color: 'primary' },
-    { value: 'amount', label: 'Energiemenge', color: 'primary' },
+    { value: 'amount', label: 'Energie', color: 'primary' },
   ];
   if (vehicleSocType.value === undefined) {
     modes = modes.filter((mode) => mode.value !== 'soc');

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

@@ -142,7 +142,7 @@ const limitModes = computed(() => {
   let modes = [
     { value: 'none', label: 'keine', color: 'primary' },
     { value: 'soc', label: 'EV-SoC', color: 'primary' },
-    { value: 'amount', label: 'Energiemenge', color: 'primary' },
+    { value: 'amount', label: 'Energie', color: 'primary' },
   ];
   if (vehicleSocType.value === undefined) {
     modes = modes.filter((mode) => mode.value !== 'soc');

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

@@ -1,5 +1,5 @@
 <template>
-  <q-card class="rounded-borders-md">
+  <q-card>
     <q-card-section>
       <div class="row no-wrap">
         <div class="text-h6 ellipsis" :title="planName.value">
@@ -26,10 +26,59 @@
         <q-input
           v-model="planTime.value"
           type="time"
-          label="Ziel-Uhrzeit"
+          label="Ziel-Termin"
           class="col"
         />
       </div>
+      <div class="q-mb-sm">
+        <div class="text-subtitle2 q-mb-sm q-mt-sm">Wiederholungen</div>
+        <q-btn-group spread>
+          <q-btn
+            size="sm"
+            :color="planFrequency.value === 'once' ? 'primary' : 'grey'"
+            @click="planFrequency.value = 'once'"
+            label="Einmalig"
+          />
+          <q-btn
+            size="sm"
+            :color="planFrequency.value === 'daily' ? 'primary' : 'grey'"
+            @click="planFrequency.value = 'daily'"
+            label="Täglich"
+          />
+          <q-btn
+            size="sm"
+            :color="planFrequency.value === 'weekly' ? 'primary' : 'grey'"
+            @click="planFrequency.value = 'weekly'"
+            label="Wöchentlich"
+          />
+        </q-btn-group>
+        <div v-if="planFrequency.value === 'once'" class="q-mt-sm">
+          <q-input
+            v-model="planOnceDate.value"
+            type="date"
+            label="Datum"
+            :min="new Date().toISOString().split('T')[0]"
+          />
+        </div>
+        <!-- Weekly buttons -->
+        <div
+          v-if="planFrequency.value === 'weekly'"
+          class="q-mt-sm row items-center q-gutter-sm justify-center no-wrap"
+        >
+          <div v-for="(day, index) in weekDays" :key="day">
+            <q-btn
+              round
+              :size="$q.platform.is.mobile ? '0.8rem' : '0.7rem'"
+              :flat="!selectedWeekDays[index]"
+              :outline="selectedWeekDays[index]"
+              color="primary"
+              :label="day"
+              :class="{ deselected: !selectedWeekDays[index] }"
+              @click="selectDay(index)"
+            />
+          </div>
+        </div>
+      </div>
       <SliderStandard
         class="q-mb-sm"
         :title="planDcChargingEnabled ? 'Ladestrom (AC)' : 'Ladestrom'"
@@ -48,13 +97,44 @@
           <div class="text-body2">kW</div>
         </template>
       </q-input>
+      <div class="text-subtitle2 q-mr-sm">Anzahl Phasen Zielladen</div>
+      <div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
+        <q-btn-group class="col">
+          <q-btn
+            v-for="option in phaseOptions"
+            :key="option.value"
+            :color="planNumPhases.value === option.value ? 'primary' : 'grey'"
+            :label="option.label"
+            size="sm"
+            class="col"
+            @click="planNumPhases.value = option.value"
+          />
+        </q-btn-group>
+      </div>
+      <div class="text-subtitle2 q-mt-md q-mr-sm">
+        Anzahl Phasen bei PV-Überschuss
+      </div>
+      <div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
+        <q-btn-group class="col">
+          <q-btn
+            v-for="option in phaseOptions"
+            :key="option.value"
+            :color="planNumPhasesPv.value === option.value ? 'primary' : 'grey'"
+            :label="option.label"
+            size="sm"
+            class="col"
+            @click="planNumPhasesPv.value = option.value"
+          />
+        </q-btn-group>
+      </div>
+      <div class="text-subtitle2 q-mt-sm q-mr-sm">Ziel</div>
       <q-btn-group class="full-width">
         <q-btn
           size="sm"
           class="flex-grow"
           :color="planLimitSelected.value === 'soc' ? 'primary' : 'grey'"
           @click="planLimitSelected.value = 'soc'"
-          label="SoC"
+          label="EV-SoC"
         />
         <q-btn
           size="sm"
@@ -93,7 +173,6 @@
           <div class="text-body2">kWh</div>
         </template>
       </q-input>
-
       <div
         v-if="
           planLimitSelected.value === 'soc' &&
@@ -120,55 +199,6 @@
         label="Bidirektionales Ladeleistung (kW)"
         class="col"
       />
-      <div class="q-mb-md">
-        <div class="text-subtitle2 q-mb-sm q-mt-sm">Wiederholungen</div>
-        <q-btn-group spread>
-          <q-btn
-            size="sm"
-            :color="planFrequency.value === 'once' ? 'primary' : 'grey'"
-            @click="planFrequency.value = 'once'"
-            label="Einmalig"
-          />
-          <q-btn
-            size="sm"
-            :color="planFrequency.value === 'daily' ? 'primary' : 'grey'"
-            @click="planFrequency.value = 'daily'"
-            label="Täglich"
-          />
-          <q-btn
-            size="sm"
-            :color="planFrequency.value === 'weekly' ? 'primary' : 'grey'"
-            @click="planFrequency.value = 'weekly'"
-            label="Wöchentlich"
-          />
-        </q-btn-group>
-        <div v-if="planFrequency.value === 'once'" class="q-mt-sm">
-          <q-input
-            v-model="planOnceDate.value"
-            type="date"
-            label="Datum"
-            :min="new Date().toISOString().split('T')[0]"
-          />
-        </div>
-        <!-- Weekly buttons -->
-        <div
-          v-if="planFrequency.value === 'weekly'"
-          class="q-mt-sm row items-center q-gutter-sm justify-center no-wrap"
-        >
-          <div v-for="(day, index) in weekDays" :key="day">
-            <q-btn
-              round
-              :size="$q.platform.is.mobile ? '0.8rem' : '0.7rem'"
-              :flat="!selectedWeekDays[index]"
-              :outline="selectedWeekDays[index]"
-              color="primary"
-              :label="day"
-              :class="{ deselected: !selectedWeekDays[index] }"
-              @click="selectDay(index)"
-            />
-          </div>
-        </div>
-      </div>
       <div class="row items-center justify-between">
         <div class="text-subtitle2 q-mr-sm">Strompreisbasiert laden</div>
         <ToggleStandard
@@ -177,37 +207,7 @@
           color="positive"
         />
       </div>
-      <div class="text-subtitle2 q-mt-sm q-mr-sm">Anzahl Phasen Zielladen</div>
-      <div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
-        <q-btn-group class="col">
-          <q-btn
-            v-for="option in phaseOptions"
-            :key="option.value"
-            :color="planNumPhases.value === option.value ? 'primary' : 'grey'"
-            :label="option.label"
-            size="sm"
-            class="col"
-            @click="planNumPhases.value = option.value"
-          />
-        </q-btn-group>
-      </div>
-      <div class="text-subtitle2 q-mt-md q-mr-sm">
-        Anzahl Phasen bei PV-Überschuss
-      </div>
-      <div class="row items-center justify-center q-ma-none q-pa-none no-wrap">
-        <q-btn-group class="col">
-          <q-btn
-            v-for="option in phaseOptions"
-            :key="option.value"
-            :color="planNumPhasesPv.value === option.value ? 'primary' : 'grey'"
-            :label="option.label"
-            size="sm"
-            class="col"
-            @click="planNumPhasesPv.value = option.value"
-          />
-        </q-btn-group>
-      </div>
-      <div class="row q-mt-lg">
+      <div class="row q-mt-md">
         <q-btn
           size="sm"
           class="col"