diff --git a/assets/css/app.css b/assets/css/app.css index 79011c50c..4bf4818f7 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -26,8 +26,11 @@ --evcc-dark-green: #0fde41; --evcc-darker-green: #0ba631; --evcc-darkest-green: #076f20; + --evcc-darkest-green-rgb: 11, 166, 49; --evcc-yellow: #faf000; --evcc-dark-yellow: #bbb400; + --evcc-orange: #ff9000; + --evcc-orange-rgb: 255, 144, 0; --bs-gray-deep: #010322; --bs-gray-dark: #28293e; --bs-gray-medium: #93949e; @@ -52,7 +55,10 @@ --evcc-transition-very-fast: 100ms; --bs-primary: var(--evcc-darker-green); - --bs-primary-rgb: 11, 166, 49; + --bs-primary-rgb: var(--evcc-darker-green-rgb); + + --bs-warning: var(--evcc-orange); + --bs-warning-rgb: var(--evcc-orange-rgb); --bs-body-font-size: 14px; --bs-font-sans-serif: Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", diff --git a/assets/js/components/ChargingPlanPreview.vue b/assets/js/components/ChargingPlanPreview.vue index 9478348ac..bd78a052e 100644 --- a/assets/js/components/ChargingPlanPreview.vue +++ b/assets/js/components/ChargingPlanPreview.vue @@ -3,7 +3,11 @@
+
{{ $t("main.targetCharge.targetIsInThePast") }}
@@ -129,6 +133,8 @@ import formatter from "../mixins/formatter";
import { energyOptions } from "../utils/energyOptions";
const LAST_TARGET_TIME_KEY = "last_target_time";
+const LAST_SOC_GOAL_KEY = "last_soc_goal";
+const LAST_ENERGY_GOAL_KEY = "last_energy_goal";
const DEFAULT_TARGET_TIME = "7:00";
export default {
@@ -144,7 +150,7 @@ export default {
vehicleCapacity: Number,
socBasedPlanning: Boolean,
},
- emits: ["plan-updated", "plan-removed"],
+ emits: ["plan-updated", "plan-removed", "plan-preview"],
data: function () {
return {
selectedDay: null,
@@ -231,16 +237,18 @@ export default {
},
initInputFields: function () {
if (!this.selectedSoc) {
- this.selectedSoc = 100;
+ this.selectedSoc = window.localStorage[LAST_SOC_GOAL_KEY] || 100;
}
if (!this.selectedEnergy) {
- this.selectedEnergy = this.vehicleCapacity || 10;
+ this.selectedEnergy =
+ window.localStorage[LAST_ENERGY_GOAL_KEY] || this.vehicleCapacity || 10;
}
let time = this.time;
if (!time) {
// no time but existing selection, keep it
if (this.selectedDay && this.selectedTime) {
+ this.preview();
return;
}
time = this.defaultTime();
@@ -248,6 +256,10 @@ export default {
const date = new Date(time);
this.selectedDay = this.fmtDayString(date);
this.selectedTime = this.fmtTimeString(date);
+
+ if (this.isNew || this.dataChanged) {
+ this.preview();
+ }
},
dayOptions: function () {
const options = [];
@@ -276,6 +288,12 @@ export default {
const hours = this.selectedDate.getHours();
const minutes = this.selectedDate.getMinutes();
window.localStorage[LAST_TARGET_TIME_KEY] = `${hours}:${minutes}`;
+ if (this.selectedSoc) {
+ window.localStorage[LAST_SOC_GOAL_KEY] = this.selectedSoc;
+ }
+ if (this.selectedEnergy) {
+ window.localStorage[LAST_ENERGY_GOAL_KEY] = this.selectedEnergy;
+ }
} catch (e) {
console.warn(e);
}
@@ -285,6 +303,13 @@ export default {
energy: this.selectedEnergy,
});
},
+ preview: function () {
+ this.$emit("plan-preview", {
+ time: this.selectedDate,
+ soc: this.selectedSoc,
+ energy: this.selectedEnergy,
+ });
+ },
toggle: function (e) {
const { checked } = e.target;
if (checked) {
diff --git a/assets/js/components/ChargingPlanWarnings.vue b/assets/js/components/ChargingPlanWarnings.vue
index 3b41133dc..31c4ec7be 100644
--- a/assets/js/components/ChargingPlanWarnings.vue
+++ b/assets/js/components/ChargingPlanWarnings.vue
@@ -1,8 +1,5 @@
-
-
- {{ $t("main.targetCharge.targetIsAboveVehicleLimit", { limit: vehicleLimitFmt }) }}
-
+
{{ $t("main.targetCharge.targetIsAboveLimit", { limit: limitFmt }) }}
@@ -15,6 +12,12 @@
{{ $t("main.targetCharge.costLimitIgnore", { limit: costLimitText }) }}
+
+ {{ $t("main.targetCharge.notReachableInTime", { endTime: endTimeFmt }) }}
+
+
+ {{ $t("main.targetCharge.targetIsAboveVehicleLimit", { limit: vehicleLimitFmt }) }}
+