Updated Links in Navbar (#2045)
This commit is contained in:
Michael Geers
GitHub
parent
c03228fe72
commit
09a9ef997f
32 changed files with 3188 additions and 3794 deletions
|
|
@ -6,8 +6,12 @@ module.exports = {
|
|||
},
|
||||
extends: [
|
||||
"eslint:recommended",
|
||||
"plugin:vue/essential",
|
||||
"plugin:vue/recommended",
|
||||
"plugin:prettier/recommended",
|
||||
"prettier",
|
||||
],
|
||||
rules: {
|
||||
"vue/require-default-prop": "off",
|
||||
"vue/attribute-hyphenation": "off",
|
||||
},
|
||||
};
|
||||
|
|
|
|||
|
|
@ -22,9 +22,6 @@ window.app = new Vue({
|
|||
router,
|
||||
i18n,
|
||||
data: { store, notifications: [] },
|
||||
render: function (h) {
|
||||
return h(App, { props: { notifications: this.notifications } });
|
||||
},
|
||||
methods: {
|
||||
raise: function (msg) {
|
||||
console[msg.type](msg);
|
||||
|
|
@ -56,6 +53,9 @@ window.app = new Vue({
|
|||
this.raise(msg);
|
||||
},
|
||||
},
|
||||
render: function (h) {
|
||||
return h(App, { props: { notifications: this.notifications } });
|
||||
},
|
||||
});
|
||||
|
||||
window.setInterval(function () {
|
||||
|
|
|
|||
|
|
@ -5,18 +5,7 @@
|
|||
@click="toggleDetails"
|
||||
>
|
||||
<Visualization
|
||||
class="
|
||||
col-12
|
||||
offset-md-1
|
||||
col-md-6
|
||||
offset-lg-1
|
||||
col-lg-8
|
||||
offset-xl-1
|
||||
col-xl-6
|
||||
offset-xxl-1
|
||||
col-xl-8
|
||||
order-md-2
|
||||
"
|
||||
class="col-12 offset-md-1 col-md-6 offset-lg-1 col-lg-8 offset-xl-1 col-xl-6 offset-xxl-1 col-xl-8 order-md-2"
|
||||
:showDetails="showDetails"
|
||||
:gridImport="gridImport"
|
||||
:selfConsumption="selfConsumption"
|
||||
|
|
@ -82,18 +71,8 @@
|
|||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="
|
||||
col-12 col-sm-6
|
||||
offset-md-6
|
||||
col-md-6
|
||||
offset-lg-4
|
||||
col-lg-8
|
||||
d-block d-md-flex
|
||||
order-md-3
|
||||
justify-content-between
|
||||
mt-2
|
||||
"
|
||||
v-if="showDetails"
|
||||
class="col-12 col-sm-6 offset-md-6 col-md-6 offset-lg-4 col-lg-8 d-block d-md-flex order-md-3 justify-content-between mt-2"
|
||||
>
|
||||
<div class="text-nowrap d-flex d-md-block" data-test-grid-import>
|
||||
<span class="color-grid details-icon"><fa-icon icon="square"></fa-icon></span>
|
||||
|
|
@ -136,6 +115,7 @@ import BatteryIcon from "./BatteryIcon.vue";
|
|||
export default {
|
||||
name: "Energyflow",
|
||||
components: { Visualization, BatteryIcon },
|
||||
mixins: [formatter],
|
||||
props: {
|
||||
gridConfigured: Boolean,
|
||||
gridPower: { type: Number, default: 0 },
|
||||
|
|
@ -151,7 +131,6 @@ export default {
|
|||
data: function () {
|
||||
return { showDetails: false };
|
||||
},
|
||||
mixins: [formatter],
|
||||
computed: {
|
||||
gridImport: function () {
|
||||
return Math.max(0, this.gridPower);
|
||||
|
|
|
|||
|
|
@ -13,15 +13,15 @@
|
|||
</LabelBar>
|
||||
</div>
|
||||
</div>
|
||||
<div class="site-progress" ref="site_progress">
|
||||
<div ref="site_progress" class="site-progress">
|
||||
<div
|
||||
class="site-progress-bar self-consumption"
|
||||
:style="{ width: widthTotal(selfConsumptionAdjusted) }"
|
||||
>
|
||||
<span class="power" v-if="powerLabelEnoughSpace(selfConsumption)">
|
||||
<span v-if="powerLabelEnoughSpace(selfConsumption)" class="power">
|
||||
{{ kw(selfConsumption) }}
|
||||
</span>
|
||||
<span class="power" v-else-if="powerLabelSomeSpace(selfConsumption)">
|
||||
<span v-else-if="powerLabelSomeSpace(selfConsumption)" class="power">
|
||||
{{ kwNoUnit(selfConsumption) }}
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -29,10 +29,10 @@
|
|||
class="site-progress-bar grid-import"
|
||||
:style="{ width: widthTotal(gridImportAdjusted) }"
|
||||
>
|
||||
<span class="power" v-if="powerLabelEnoughSpace(gridImport)">
|
||||
<span v-if="powerLabelEnoughSpace(gridImport)" class="power">
|
||||
{{ kw(gridImport) }}
|
||||
</span>
|
||||
<span class="power" v-else-if="powerLabelSomeSpace(gridImport)">
|
||||
<span v-else-if="powerLabelSomeSpace(gridImport)" class="power">
|
||||
{{ kwNoUnit(gridImport) }}
|
||||
</span>
|
||||
</div>
|
||||
|
|
@ -40,14 +40,14 @@
|
|||
class="site-progress-bar pv-export"
|
||||
:style="{ width: widthTotal(pvExportAdjusted) }"
|
||||
>
|
||||
<span class="power" v-if="powerLabelEnoughSpace(pvExport)">
|
||||
<span v-if="powerLabelEnoughSpace(pvExport)" class="power">
|
||||
{{ kw(pvExport) }}
|
||||
</span>
|
||||
<span class="power" v-else-if="powerLabelSomeSpace(pvExport)">
|
||||
<span v-else-if="powerLabelSomeSpace(pvExport)" class="power">
|
||||
{{ kwNoUnit(pvExport) }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="site-progress-bar bg-light border no-wrap w-100" v-if="totalAdjusted <= 0">
|
||||
<div v-if="totalAdjusted <= 0" class="site-progress-bar bg-light border no-wrap w-100">
|
||||
<span>{{ $t("main.energyflow.noEnergy") }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -80,6 +80,7 @@ import LabelBar from "./LabelBar.vue";
|
|||
export default {
|
||||
name: "Visualization",
|
||||
components: { BatteryIcon, LabelBar, GridIcon },
|
||||
mixins: [formatter],
|
||||
props: {
|
||||
showDetails: Boolean,
|
||||
gridImport: { type: Number, default: 0 },
|
||||
|
|
@ -96,16 +97,6 @@ export default {
|
|||
data: function () {
|
||||
return { width: 0, visualizationReady: false };
|
||||
},
|
||||
mounted: function () {
|
||||
this.$nextTick(function () {
|
||||
window.addEventListener("resize", this.updateElementWidth);
|
||||
this.updateElementWidth();
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.updateElementWidth);
|
||||
},
|
||||
mixins: [formatter],
|
||||
computed: {
|
||||
gridExport: function () {
|
||||
return this.pvExport;
|
||||
|
|
@ -137,6 +128,15 @@ export default {
|
|||
}, 500);
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
this.$nextTick(function () {
|
||||
window.addEventListener("resize", this.updateElementWidth);
|
||||
this.updateElementWidth();
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.updateElementWidth);
|
||||
},
|
||||
methods: {
|
||||
widthTotal: function (power) {
|
||||
if (this.totalAdjusted === 0) return "0%";
|
||||
|
|
|
|||
|
|
@ -3,15 +3,15 @@
|
|||
<p class="h3 mb-4 d-sm-block" :class="{ 'd-none': single }">
|
||||
{{ title || $t("main.loadpoint.fallbackName") }}
|
||||
</p>
|
||||
<div class="alert alert-warning mt-4 mb-2" role="alert" v-if="remoteDisabled == 'soft'">
|
||||
<div v-if="remoteDisabled == 'soft'" class="alert alert-warning mt-4 mb-2" role="alert">
|
||||
{{ $t("main.loadpoint.remoteDisabledSoft", { source: remoteDisabledSource }) }}
|
||||
</div>
|
||||
<div class="alert alert-danger mt-4 mb-2" role="alert" v-if="remoteDisabled == 'hard'">
|
||||
<div v-if="remoteDisabled == 'hard'" class="alert alert-danger mt-4 mb-2" role="alert">
|
||||
{{ $t("main.loadpoint.remoteDisabledHard", { source: remoteDisabledSource }) }}
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<Mode class="col-12 col-md-6 col-lg-4 mb-4" :mode="mode" v-on:updated="setTargetMode" />
|
||||
<Mode class="col-12 col-md-6 col-lg-4 mb-4" :mode="mode" @updated="setTargetMode" />
|
||||
<Vehicle
|
||||
class="col-12 col-md-6 col-lg-8 mb-4"
|
||||
v-bind="vehicle"
|
||||
|
|
@ -33,6 +33,8 @@ import collector from "../mixins/collector";
|
|||
|
||||
export default {
|
||||
name: "Loadpoint",
|
||||
components: { LoadpointDetails, Mode, Vehicle },
|
||||
mixins: [formatter, collector],
|
||||
props: {
|
||||
id: Number,
|
||||
single: Boolean,
|
||||
|
|
@ -82,8 +84,6 @@ export default {
|
|||
pvRemaining: Number,
|
||||
pvAction: String,
|
||||
},
|
||||
components: { LoadpointDetails, Mode, Vehicle },
|
||||
mixins: [formatter, collector],
|
||||
data: function () {
|
||||
return {
|
||||
tickerHandle: null,
|
||||
|
|
@ -113,6 +113,9 @@ export default {
|
|||
}
|
||||
},
|
||||
},
|
||||
destroyed: function () {
|
||||
window.clearInterval(this.tickerHandle);
|
||||
},
|
||||
methods: {
|
||||
api: function (func) {
|
||||
return "loadpoints/" + this.id + "/" + func;
|
||||
|
|
@ -146,8 +149,5 @@ export default {
|
|||
.catch(window.app.error);
|
||||
},
|
||||
},
|
||||
destroyed: function () {
|
||||
window.clearInterval(this.tickerHandle);
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -6,9 +6,9 @@
|
|||
{{ $t("main.loadpointDetails.power") }}
|
||||
<div
|
||||
v-if="chargePower && activePhases"
|
||||
v-tooltip="{ content: phaseTooltip }"
|
||||
class="badge rounded-pill bg-secondary text-light cursor-pointer"
|
||||
tabindex="0"
|
||||
v-tooltip="{ content: phaseTooltip }"
|
||||
>
|
||||
{{ activePhases }}P
|
||||
<WaitingDots
|
||||
|
|
@ -19,32 +19,32 @@
|
|||
/>
|
||||
</div>
|
||||
<fa-icon
|
||||
v-if="climater == 'heating'"
|
||||
class="text-primary ms-1"
|
||||
icon="temperature-low"
|
||||
v-if="climater == 'heating'"
|
||||
></fa-icon>
|
||||
<fa-icon
|
||||
v-if="climater == 'cooling'"
|
||||
class="text-primary ms-1"
|
||||
icon="temperature-high"
|
||||
v-if="climater == 'cooling'"
|
||||
></fa-icon>
|
||||
<fa-icon
|
||||
v-if="climater == 'on'"
|
||||
class="text-primary ms-1"
|
||||
icon="thermometer-half"
|
||||
v-if="climater == 'on'"
|
||||
></fa-icon>
|
||||
</div>
|
||||
<h3 class="value">
|
||||
{{ fmt(chargePower) }}
|
||||
<small class="text-muted">
|
||||
{{ fmtUnit(chargePower) }}W<small
|
||||
class="cursor-pointer d-inline-block px-2"
|
||||
v-if="pvTimerVisible"
|
||||
v-tooltip="{
|
||||
content: $t(`main.loadpointDetails.tooltip.pv.${pvAction}`, {
|
||||
remaining: fmtRemaining(pvRemaining),
|
||||
}),
|
||||
}"
|
||||
class="cursor-pointer d-inline-block px-2"
|
||||
tabindex="0"
|
||||
>
|
||||
<WaitingDots
|
||||
|
|
@ -64,7 +64,7 @@
|
|||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="col-6 col-sm-3 col-lg-2 mt-3" v-if="vehicleRange && vehicleRange >= 0">
|
||||
<div v-if="vehicleRange && vehicleRange >= 0" class="col-6 col-sm-3 col-lg-2 mt-3">
|
||||
<div class="mb-2 value">{{ $t("main.loadpointDetails.vehicleRange") }}</div>
|
||||
<h3 class="value">
|
||||
{{ Math.round(vehicleRange) }}
|
||||
|
|
@ -72,7 +72,7 @@
|
|||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="col-6 col-sm-3 col-lg-2 mt-3" v-else>
|
||||
<div v-else class="col-6 col-sm-3 col-lg-2 mt-3">
|
||||
<div class="mb-2 value">{{ $t("main.loadpointDetails.duration") }}</div>
|
||||
<h3 class="value">
|
||||
{{ fmtShortDuration(chargeDuration) }}
|
||||
|
|
@ -80,7 +80,7 @@
|
|||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="col-6 col-sm-3 col-lg-2 mt-3" v-if="vehiclePresent">
|
||||
<div v-if="vehiclePresent" class="col-6 col-sm-3 col-lg-2 mt-3">
|
||||
<div class="mb-2 value">{{ $t("main.loadpointDetails.remaining") }}</div>
|
||||
<h3 class="value">
|
||||
{{ fmtShortDuration(chargeRemainingDuration) }}
|
||||
|
|
@ -101,6 +101,7 @@ import formatter from "../mixins/formatter";
|
|||
export default {
|
||||
name: "LoadpointDetails",
|
||||
components: { WaitingDots },
|
||||
mixins: [formatter],
|
||||
props: {
|
||||
chargedEnergy: Number,
|
||||
chargeDuration: Number,
|
||||
|
|
@ -115,12 +116,6 @@ export default {
|
|||
pvRemaining: Number,
|
||||
pvAction: String,
|
||||
},
|
||||
mixins: [formatter],
|
||||
methods: {
|
||||
fmtRemaining(remaining) {
|
||||
return remaining > 0 ? this.fmtTimeAgo(new Date(Date.now() + remaining * 1000)) : null;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
phaseTooltip() {
|
||||
if (["scale1p", "scale3p"].includes(this.phaseAction)) {
|
||||
|
|
@ -155,5 +150,10 @@ export default {
|
|||
return false;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
fmtRemaining(remaining) {
|
||||
return remaining > 0 ? this.fmtTimeAgo(new Date(Date.now() + remaining * 1000)) : null;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@
|
|||
<span class="flex-grow-1 px-2 py-1 text-break">
|
||||
{{ msg.message }}
|
||||
</span>
|
||||
<span class="badge rounded-pill bg-secondary" v-if="msg.count > 1">
|
||||
<span v-if="msg.count > 1" class="badge rounded-pill bg-secondary">
|
||||
{{ msg.count }}
|
||||
</span>
|
||||
</p>
|
||||
|
|
@ -62,8 +62,8 @@
|
|||
type="button"
|
||||
data-bs-dismiss="modal"
|
||||
aria-label="Close"
|
||||
@click="clear"
|
||||
class="btn btn-outline-secondary"
|
||||
@click="clear"
|
||||
>
|
||||
{{ $t("notifications.dismissAll") }}
|
||||
</button>
|
||||
|
|
@ -80,6 +80,7 @@ import formatter from "../mixins/formatter";
|
|||
|
||||
export default {
|
||||
name: "Notifications",
|
||||
mixins: [formatter],
|
||||
props: {
|
||||
notifications: Array,
|
||||
},
|
||||
|
|
@ -93,11 +94,6 @@ export default {
|
|||
: "text-warning";
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
clear: function () {
|
||||
window.app && window.app.clear();
|
||||
},
|
||||
},
|
||||
created: function () {
|
||||
this.interval = setInterval(() => {
|
||||
this.$forceUpdate();
|
||||
|
|
@ -106,6 +102,10 @@ export default {
|
|||
destroyed: function () {
|
||||
clearTimeout(this.interval);
|
||||
},
|
||||
mixins: [formatter],
|
||||
methods: {
|
||||
clear: function () {
|
||||
window.app && window.app.clear();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -7,12 +7,12 @@
|
|||
<hr class="w-100 my-4" />
|
||||
<div class="flex-grow-1 d-flex justify-content-around flex-column">
|
||||
<template v-for="(loadpoint, id) in loadpoints">
|
||||
<hr class="w-100 my-4" v-if="id > 0" :key="id + '_hr'" />
|
||||
<hr v-if="id > 0" :key="id + '_hr'" class="w-100 my-4" />
|
||||
<Loadpoint
|
||||
:key="id"
|
||||
v-bind="loadpoint"
|
||||
:single="loadpoints.length === 1"
|
||||
:id="id"
|
||||
:key="id"
|
||||
:single="loadpoints.length === 1"
|
||||
/>
|
||||
</template>
|
||||
</div>
|
||||
|
|
@ -27,6 +27,8 @@ import collector from "../mixins/collector";
|
|||
|
||||
export default {
|
||||
name: "Site",
|
||||
components: { Loadpoint, Energyflow },
|
||||
mixins: [formatter, collector],
|
||||
props: {
|
||||
loadpoints: Array,
|
||||
|
||||
|
|
@ -43,8 +45,6 @@ export default {
|
|||
prioritySoC: Number,
|
||||
siteTitle: String,
|
||||
},
|
||||
components: { Loadpoint, Energyflow },
|
||||
mixins: [formatter, collector],
|
||||
computed: {
|
||||
energyflow: function () {
|
||||
return this.collectProps(Energyflow);
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div
|
||||
ref="sponsor"
|
||||
v-if="sponsor"
|
||||
ref="sponsor"
|
||||
class="btn btn-link pe-0 text-decoration-none link-dark text-nowrap sponsor-button"
|
||||
@click.stop.prevent="surprise"
|
||||
>
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
import confetti from "canvas-confetti";
|
||||
|
||||
export default {
|
||||
name: "sponsor",
|
||||
name: "Sponsor",
|
||||
props: {
|
||||
sponsor: String,
|
||||
},
|
||||
|
|
|
|||
|
|
@ -29,40 +29,42 @@
|
|||
<form @submit.prevent="saveTargetTime">
|
||||
<div class="modal-body">
|
||||
<div class="form-group">
|
||||
<!-- eslint-disable vue/no-v-html -->
|
||||
<label
|
||||
for="targetTimeLabel"
|
||||
class="mb-3"
|
||||
v-html="$t('main.targetCharge.description', { targetSoC })"
|
||||
>
|
||||
</label>
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
<div
|
||||
class="d-flex justify-content-between"
|
||||
:style="{ 'max-width': '350px' }"
|
||||
>
|
||||
<select
|
||||
class="form-select me-2"
|
||||
v-model="selectedDay"
|
||||
class="form-select me-2"
|
||||
:style="{ 'flex-basis': '60%' }"
|
||||
>
|
||||
<option
|
||||
v-for="opt in dayOptions()"
|
||||
:value="opt.value"
|
||||
:key="opt.value"
|
||||
:value="opt.value"
|
||||
>
|
||||
{{ opt.name }}
|
||||
</option>
|
||||
</select>
|
||||
<input
|
||||
v-model="selectedTime"
|
||||
type="time"
|
||||
class="form-control ms-2"
|
||||
:style="{ 'flex-basis': '40%' }"
|
||||
v-model="selectedTime"
|
||||
:step="60 * 5"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-danger mb-0" v-if="!selectedTargetTimeValid">
|
||||
<p v-if="!selectedTargetTimeValid" class="text-danger mb-0">
|
||||
{{ $t("main.targetCharge.targetIsInThePast") }}
|
||||
</p>
|
||||
<p class="small mt-3 text-muted">
|
||||
|
|
@ -108,6 +110,7 @@ import formatter from "../mixins/formatter";
|
|||
|
||||
export default {
|
||||
name: "TargetCharge",
|
||||
mixins: [formatter],
|
||||
props: {
|
||||
id: Number,
|
||||
timerActive: Boolean,
|
||||
|
|
@ -115,6 +118,9 @@ export default {
|
|||
targetTime: String,
|
||||
targetSoC: Number,
|
||||
},
|
||||
data: function () {
|
||||
return { selectedDay: null, selectedTime: null };
|
||||
},
|
||||
computed: {
|
||||
targetChargeEnabled: function () {
|
||||
return this.targetTime && this.timerSet;
|
||||
|
|
@ -130,17 +136,14 @@ export default {
|
|||
return `targetChargeModal_${this.id}`;
|
||||
},
|
||||
},
|
||||
data: function () {
|
||||
return { selectedDay: null, selectedTime: null };
|
||||
},
|
||||
mounted: function () {
|
||||
this.initInputFields();
|
||||
},
|
||||
watch: {
|
||||
targetTime() {
|
||||
this.initInputFields();
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
this.initInputFields();
|
||||
},
|
||||
methods: {
|
||||
// not computed because it needs to update over time
|
||||
targetTimeLabel: function () {
|
||||
|
|
@ -201,6 +204,5 @@ export default {
|
|||
this.$emit("target-time-updated", this.selectedTargetTime);
|
||||
},
|
||||
},
|
||||
mixins: [formatter],
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -6,8 +6,8 @@
|
|||
<VehicleSoc v-bind="vehicleSocProps" @target-soc-updated="targetSocUpdated" />
|
||||
<VehicleSubline
|
||||
v-bind="vehicleSubline"
|
||||
@target-time-updated="targetTimeUpdated"
|
||||
class="my-1"
|
||||
@target-time-updated="targetTimeUpdated"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -21,6 +21,7 @@ import VehicleSubline from "./VehicleSubline";
|
|||
export default {
|
||||
name: "Vehicle",
|
||||
components: { VehicleSoc, VehicleSubline },
|
||||
mixins: [collector],
|
||||
props: {
|
||||
id: Number,
|
||||
connected: Boolean,
|
||||
|
|
@ -51,6 +52,5 @@ export default {
|
|||
this.$emit("target-time-updated", targetTime);
|
||||
},
|
||||
},
|
||||
mixins: [collector],
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -70,16 +70,6 @@ export default {
|
|||
interactionStartScreenY: null,
|
||||
};
|
||||
},
|
||||
mounted: function () {
|
||||
setTimeout(() => {
|
||||
this.allowSliderHiding = true;
|
||||
}, 1000);
|
||||
},
|
||||
watch: {
|
||||
targetSoC: function () {
|
||||
this.selectedTargetSoC = this.targetSoC;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
vehicleSoCDisplayWidth: function () {
|
||||
if (this.vehiclePresent && this.vehicleSoC >= 0) {
|
||||
|
|
@ -136,6 +126,16 @@ export default {
|
|||
return Number(this.selectedTargetSoC || this.targetSoC);
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
targetSoC: function () {
|
||||
this.selectedTargetSoC = this.targetSoC;
|
||||
},
|
||||
},
|
||||
mounted: function () {
|
||||
setTimeout(() => {
|
||||
this.allowSliderHiding = true;
|
||||
}, 1000);
|
||||
},
|
||||
methods: {
|
||||
changeTargetSoCStart: function (e) {
|
||||
const screenY = e.screenY || e.changedTouches[0].screenY;
|
||||
|
|
|
|||
|
|
@ -17,6 +17,7 @@ import TargetCharge from "./TargetCharge.vue";
|
|||
export default {
|
||||
name: "VehicleSubline",
|
||||
components: { TargetCharge },
|
||||
mixins: [collector],
|
||||
props: {
|
||||
id: Number,
|
||||
vehicleSoC: Number,
|
||||
|
|
@ -34,7 +35,6 @@ export default {
|
|||
return this.collectProps(TargetCharge);
|
||||
},
|
||||
},
|
||||
mixins: [collector],
|
||||
methods: {
|
||||
targetTimeUpdated: function (targetTime) {
|
||||
this.$emit("target-time-updated", targetTime);
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<div>
|
||||
<button
|
||||
v-if="newVersionAvailable"
|
||||
href="#"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#updateModal"
|
||||
v-if="newVersionAvailable"
|
||||
class="btn btn-link ps-0 text-decoration-none link-dark text-nowrap"
|
||||
>
|
||||
<fa-icon icon="gift" class="icon me-1"></fa-icon>
|
||||
|
|
@ -13,10 +13,10 @@
|
|||
{{ available }}
|
||||
</button>
|
||||
<a
|
||||
v-else
|
||||
:href="releaseNotesUrl(installed)"
|
||||
target="_blank"
|
||||
class="btn btn-link ps-0 text-decoration-none link-dark text-nowrap"
|
||||
v-else
|
||||
>
|
||||
{{ $t("footer.version.version") }} {{ installed }}
|
||||
</a>
|
||||
|
|
@ -52,7 +52,9 @@
|
|||
{{ installed }}
|
||||
</small>
|
||||
</p>
|
||||
<!-- eslint-disable vue/no-v-html -->
|
||||
<div v-if="releaseNotes" v-html="releaseNotes"></div>
|
||||
<!-- eslint-enable vue/no-v-html -->
|
||||
<p v-else>
|
||||
{{ $t("footer.version.modalNoReleaseNotes") }}
|
||||
<a :href="releaseNotesUrl(available)">GitHub</a>.
|
||||
|
|
@ -70,9 +72,9 @@
|
|||
</button>
|
||||
<div>
|
||||
<button
|
||||
v-if="hasUpdater"
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
v-if="hasUpdater"
|
||||
:disabled="updateStarted"
|
||||
@click="update"
|
||||
>
|
||||
|
|
@ -87,7 +89,7 @@
|
|||
</span>
|
||||
<span v-else>{{ $t("footer.version.modalUpdateNow") }}</span>
|
||||
</button>
|
||||
<a :href="releaseNotesUrl(available)" class="btn btn-primary" v-else>
|
||||
<a v-else :href="releaseNotesUrl(available)" class="btn btn-primary">
|
||||
{{ $t("footer.version.modalDownload") }}
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -118,6 +120,16 @@ export default {
|
|||
updateStatus: "",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
newVersionAvailable: function () {
|
||||
return (
|
||||
this.available && // available version already computed?
|
||||
this.installed != "[[.Version]]" && // go template parsed?
|
||||
this.installed != "0.0.1-alpha" && // make used?
|
||||
this.available != this.installed
|
||||
);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
update: async function () {
|
||||
try {
|
||||
|
|
@ -132,16 +144,6 @@ export default {
|
|||
return `https://github.com/evcc-io/evcc/releases/tag/${version}`;
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
newVersionAvailable: function () {
|
||||
return (
|
||||
this.available && // available version already computed?
|
||||
this.installed != "[[.Version]]" && // go template parsed?
|
||||
this.installed != "0.0.1-alpha" && // make used?
|
||||
this.available != this.installed
|
||||
);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export default {
|
||||
header: { support: "Dokumentation" },
|
||||
header: { docs: "Dokumentation", blog: "Blog", github: "GitHub" },
|
||||
footer: {
|
||||
version: {
|
||||
version: "Version",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export default {
|
||||
header: { support: "Documentation" },
|
||||
header: { docs: "Documentation", blog: "Blog", github: "GitHub" },
|
||||
footer: {
|
||||
version: {
|
||||
version: "version",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export default {
|
||||
header: { support: "Documentazione" },
|
||||
header: { docs: "Documentazione", blog: "Blog", github: "GitHub" },
|
||||
footer: {
|
||||
version: {
|
||||
version: "versione",
|
||||
|
|
|
|||
|
|
@ -58,4 +58,5 @@ library.add(
|
|||
faEllipsisV
|
||||
);
|
||||
|
||||
// eslint-disable-next-line vue/component-definition-name-casing
|
||||
Vue.component("fa-icon", FontAwesomeIcon);
|
||||
|
|
|
|||
|
|
@ -3,40 +3,53 @@
|
|||
<div class="flex-grow-1 d-flex flex-column justify-content-between">
|
||||
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="https://github.com/evcc-io/evcc#readme">
|
||||
<a class="navbar-brand" href="https://evcc.io/" target="_blank">
|
||||
<Logo class="logo"></Logo>
|
||||
</a>
|
||||
<div class="d-flex">
|
||||
<div class="d-flex">
|
||||
<Notifications :notifications="notifications" />
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarNavAltMarkup"
|
||||
aria-controls="navbarNavAltMarkup"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="collapse navbar-collapse flex-lg-grow-0"
|
||||
id="navbarNavAltMarkup"
|
||||
<div class="d-flex flex-grow-1 justify-content-end">
|
||||
<Notifications :notifications="notifications" />
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarNavAltMarkup"
|
||||
aria-controls="navbarNavAltMarkup"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
>
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
href="https://docs.evcc.io/docs/Home/"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t("header.support") }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div id="navbarNavAltMarkup" class="collapse navbar-collapse flex-grow-0">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
href="https://docs.evcc.io/blog/"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t("header.blog") }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
href="https://docs.evcc.io/docs/Home/"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t("header.docs") }}
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a
|
||||
class="nav-link"
|
||||
href="https://github.com/evcc-io/evcc"
|
||||
target="_blank"
|
||||
>
|
||||
{{ $t("header.github") }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
@ -59,6 +72,9 @@ import store from "../store";
|
|||
export default {
|
||||
name: "App",
|
||||
components: { Logo, Footer, Notifications },
|
||||
props: {
|
||||
notifications: Array,
|
||||
},
|
||||
data: function () {
|
||||
return {
|
||||
compact: false,
|
||||
|
|
@ -66,6 +82,29 @@ export default {
|
|||
installedVersion: window.evcc.version,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
version: function () {
|
||||
return {
|
||||
installed: this.installedVersion,
|
||||
available: this.store.state.availableVersion,
|
||||
releaseNotes: this.store.state.releaseNotes,
|
||||
hasUpdater: this.store.state.hasUpdater,
|
||||
uploadMessage: this.store.state.uploadMessage,
|
||||
uploadProgress: this.store.state.uploadProgress,
|
||||
};
|
||||
},
|
||||
title: function () {
|
||||
return this.store.state.siteTitle;
|
||||
},
|
||||
sponsor: function () {
|
||||
return this.store.state.sponsor;
|
||||
},
|
||||
},
|
||||
created: function () {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
this.compact = urlParams.get("compact");
|
||||
this.connect(); // websocket listener
|
||||
},
|
||||
methods: {
|
||||
connect: function () {
|
||||
const loc = window.location;
|
||||
|
|
@ -103,32 +142,6 @@ export default {
|
|||
title: this.title ? `evcc | ${this.title}` : "evcc",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
version: function () {
|
||||
return {
|
||||
installed: this.installedVersion,
|
||||
available: this.store.state.availableVersion,
|
||||
releaseNotes: this.store.state.releaseNotes,
|
||||
hasUpdater: this.store.state.hasUpdater,
|
||||
uploadMessage: this.store.state.uploadMessage,
|
||||
uploadProgress: this.store.state.uploadProgress,
|
||||
};
|
||||
},
|
||||
title: function () {
|
||||
return this.store.state.siteTitle;
|
||||
},
|
||||
sponsor: function () {
|
||||
return this.store.state.sponsor;
|
||||
},
|
||||
},
|
||||
props: {
|
||||
notifications: Array,
|
||||
},
|
||||
created: function () {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
this.compact = urlParams.get("compact");
|
||||
this.connect(); // websocket listener
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
|
|
|
|||
|
|
@ -13,26 +13,26 @@
|
|||
<div class="col-md-4"></div>
|
||||
<div class="col-6 col-md-2 py-3">
|
||||
Netzzähler:
|
||||
<span class="text-primary" v-if="gridConfigured">✓</span>
|
||||
<span class="text-primary" v-else>—</span>
|
||||
<span v-if="gridConfigured" class="text-primary">✓</span>
|
||||
<span v-else class="text-primary">—</span>
|
||||
</div>
|
||||
<div class="col-6 col-md-2 py-3">
|
||||
PV Zähler:
|
||||
<span class="text-primary" v-if="pvConfigured">✓</span>
|
||||
<span class="text-primary" v-else>—</span>
|
||||
<span v-if="pvConfigured" class="text-primary">✓</span>
|
||||
<span v-else class="text-primary">—</span>
|
||||
</div>
|
||||
<div class="col-6 col-md-2 py-3">
|
||||
Batteriezähler:
|
||||
<span class="text-primary" v-if="batteryConfigured">✓</span>
|
||||
<span class="text-primary" v-else>—</span>
|
||||
<span v-if="batteryConfigured" class="text-primary">✓</span>
|
||||
<span v-else class="text-primary">—</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-for="(loadpoint, id) in loadpoints"
|
||||
:loadpoint="loadpoint"
|
||||
:key="id"
|
||||
:id="'loadpoint-' + id"
|
||||
:key="id"
|
||||
:loadpoint="loadpoint"
|
||||
>
|
||||
<div class="row mt-4 border-bottom">
|
||||
<div class="col-12">
|
||||
|
|
@ -44,8 +44,8 @@
|
|||
<div class="col-md-4"></div>
|
||||
<div class="col-6 col-md-2 py-3">
|
||||
Ladezähler:
|
||||
<span class="text-primary" v-if="loadpoint.chargeConfigured">✓</span>
|
||||
<span class="text-primary" v-else>—</span>
|
||||
<span v-if="loadpoint.chargeConfigured" class="text-primary">✓</span>
|
||||
<span v-else class="text-primary">—</span>
|
||||
</div>
|
||||
<div class="col-6 col-md-2 py-3">
|
||||
Phasen:
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<Site v-bind="state" v-if="configured"></Site>
|
||||
<Site v-if="configured" v-bind="state"></Site>
|
||||
<div v-else>
|
||||
<div class="row py-5">
|
||||
<div class="col12">
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
4
dist/index.html
vendored
4
dist/index.html
vendored
|
|
@ -1,4 +1,4 @@
|
|||
<!DOCTYPE html><html lang="de"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="EV Charge Controller"><meta name="author" content="andig"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><link rel="apple-touch-icon" sizes="180x180" href="ico/apple-touch-icon.png?[[.Version]]"><link rel="icon" type="image/png" sizes="32x32" href="ico/favicon-32x32.png?[[.Version]]"><link rel="icon" type="image/png" sizes="16x16" href="ico/favicon-16x16.png?[[.Version]]"><link rel="manifest" href="ico/site.webmanifest"><link rel="mask-icon" href="ico/safari-pinned-tab.svg?[[.Version]]" color="#18191a"><link rel="shortcut icon" href="ico/favicon.ico?[[.Version]]"><meta name="apple-mobile-web-app-title" content="evcc"><meta name="application-name" content="evcc"><meta name="msapplication-TileColor" content="#18191a"><meta name="msapplication-config" content="ico/browserconfig.xml"><meta name="theme-color" content="#18191a"><title>evcc</title><link href="css/chunk-vendors.a7b690cd.css" rel="preload" as="style"><link href="css/index.31975401.css" rel="preload" as="style"><link href="js/chunk-vendors.6e78ad3a.js" rel="preload" as="script"><link href="js/index.c646bc03.js" rel="preload" as="script"><link href="css/chunk-vendors.a7b690cd.css" rel="stylesheet"><link href="css/index.31975401.css" rel="stylesheet"></head><body><script>window.evcc = {
|
||||
<!DOCTYPE html><html lang="de"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="description" content="EV Charge Controller"><meta name="author" content="andig"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><link rel="apple-touch-icon" sizes="180x180" href="ico/apple-touch-icon.png?[[.Version]]"><link rel="icon" type="image/png" sizes="32x32" href="ico/favicon-32x32.png?[[.Version]]"><link rel="icon" type="image/png" sizes="16x16" href="ico/favicon-16x16.png?[[.Version]]"><link rel="manifest" href="ico/site.webmanifest"><link rel="mask-icon" href="ico/safari-pinned-tab.svg?[[.Version]]" color="#18191a"><link rel="shortcut icon" href="ico/favicon.ico?[[.Version]]"><meta name="apple-mobile-web-app-title" content="evcc"><meta name="application-name" content="evcc"><meta name="msapplication-TileColor" content="#18191a"><meta name="msapplication-config" content="ico/browserconfig.xml"><meta name="theme-color" content="#18191a"><title>evcc</title><link href="css/chunk-vendors.a7b690cd.css" rel="preload" as="style"><link href="css/index.801eac99.css" rel="preload" as="style"><link href="js/chunk-vendors.e8d8381a.js" rel="preload" as="script"><link href="js/index.0a569798.js" rel="preload" as="script"><link href="css/chunk-vendors.a7b690cd.css" rel="stylesheet"><link href="css/index.801eac99.css" rel="stylesheet"></head><body><script>window.evcc = {
|
||||
version: "[[.Version]]",
|
||||
configured: "[[.Configured]]",
|
||||
};</script><div id="app"></div><script src="js/chunk-vendors.6e78ad3a.js"></script><script src="js/index.c646bc03.js"></script></body></html>
|
||||
};</script><div id="app"></div><script src="js/chunk-vendors.e8d8381a.js"></script><script src="js/index.0a569798.js"></script></body></html>
|
||||
1
dist/js/chunk-vendors.6e78ad3a.js.map
vendored
1
dist/js/chunk-vendors.6e78ad3a.js.map
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
dist/js/chunk-vendors.e8d8381a.js.map
vendored
Normal file
1
dist/js/chunk-vendors.e8d8381a.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
2
dist/js/index.0a569798.js
vendored
Normal file
2
dist/js/index.0a569798.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/js/index.0a569798.js.map
vendored
Normal file
1
dist/js/index.0a569798.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
2
dist/js/index.c646bc03.js
vendored
2
dist/js/index.c646bc03.js
vendored
File diff suppressed because one or more lines are too long
1
dist/js/index.c646bc03.js.map
vendored
1
dist/js/index.c646bc03.js.map
vendored
File diff suppressed because one or more lines are too long
6537
package-lock.json
generated
6537
package-lock.json
generated
File diff suppressed because it is too large
Load diff
28
package.json
28
package.json
|
|
@ -16,36 +16,36 @@
|
|||
"@fortawesome/free-regular-svg-icons": "^5.15.4",
|
||||
"@fortawesome/free-solid-svg-icons": "^5.15.4",
|
||||
"@fortawesome/vue-fontawesome": "^2.0.6",
|
||||
"axios": "^0.23.0",
|
||||
"axios": "^0.24.0",
|
||||
"bootstrap": "^5.1.3",
|
||||
"canvas-confetti": "^1.4.0",
|
||||
"v-tooltip": "^3.0.0-beta.1",
|
||||
"vue": "^2.6.14",
|
||||
"vue-hot-reload-api": "^2.3.4",
|
||||
"vue-i18n": "^8.26.5",
|
||||
"vue-i18n": "^8.26.7",
|
||||
"vue-meta": "^2.4.0",
|
||||
"vue-router": "^3.5.2"
|
||||
"vue-router": "^3.5.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@storybook/addon-actions": "^6.3.12",
|
||||
"@storybook/addon-essentials": "^6.3.12",
|
||||
"@storybook/addon-links": "^6.3.12",
|
||||
"@storybook/addon-actions": "^6.4.9",
|
||||
"@storybook/addon-essentials": "^6.4.9",
|
||||
"@storybook/addon-links": "^6.4.9",
|
||||
"@storybook/addon-postcss": "^2.0.0",
|
||||
"@storybook/vue": "^6.3.12",
|
||||
"@vue/cli-plugin-unit-jest": "^4.5.14",
|
||||
"@vue/cli-service": "^4.5.14",
|
||||
"@vue/component-compiler-utils": "^3.2.2",
|
||||
"@storybook/vue": "^6.4.9",
|
||||
"@vue/cli-plugin-unit-jest": "^4.5.15",
|
||||
"@vue/cli-service": "^4.5.15",
|
||||
"@vue/component-compiler-utils": "^3.3.0",
|
||||
"@vue/eslint-config-standard": "^6.1.0",
|
||||
"@vue/test-utils": "^1.2.2",
|
||||
"@vue/test-utils": "^1.3.0",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-config-prettier": "^8.3.0",
|
||||
"eslint-plugin-import": "^2.25.2",
|
||||
"eslint-plugin-import": "^2.25.3",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-prettier": "^3.4.1",
|
||||
"eslint-plugin-promise": "^5.1.1",
|
||||
"eslint-plugin-promise": "^5.2.0",
|
||||
"eslint-plugin-standard": "^5.0.0",
|
||||
"eslint-plugin-vue": "^7.20.0",
|
||||
"prettier": "^2.4.1",
|
||||
"prettier": "^2.5.1",
|
||||
"vue-template-compiler": "^2.6.14"
|
||||
},
|
||||
"alias": {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue