diff --git a/packages/modules/web_themes/colors/source/src/assets/css/style.css b/packages/modules/web_themes/colors/source/src/assets/css/style.css index f834e1c4da..d7c4b38437 100644 --- a/packages/modules/web_themes/colors/source/src/assets/css/style.css +++ b/packages/modules/web_themes/colors/source/src/assets/css/style.css @@ -192,7 +192,7 @@ body>.container-fluid { --color-subframe: lightgrey; --color-fg: black; --color-scale: lightgrey; - --color-title: black; + --color-title: rgba(0, 0, 0, 0.644); --padding-widget: 5px; --fontCol: rgba(255, 255, 255, 0.82); --gridCol: rgba(255, 255, 255, 0.82); diff --git a/packages/modules/web_themes/colors/source/src/assets/js/mqttClient.ts b/packages/modules/web_themes/colors/source/src/assets/js/mqttClient.ts index 84cc621156..aad13afd1c 100644 --- a/packages/modules/web_themes/colors/source/src/assets/js/mqttClient.ts +++ b/packages/modules/web_themes/colors/source/src/assets/js/mqttClient.ts @@ -21,6 +21,7 @@ const mqttConnection = { protocol: (location.protocol == 'https:' ? 'wss' : 'ws') as MqttProtocol, connectTimeout: 4000, reconnectPeriod: 4000, + clean: false, clientId: Math.random() .toString(36) .replace(/[^a-z]+/g, '') @@ -43,6 +44,12 @@ try { // subscribe(topic); // }); }) + client.on('disconnect', () => { + console.info('MQTT disconnected') + // topiclist.forEach((topic) => { + // subscribe(topic); + // }); + }) client.on('error', (error) => { console.error('MQTT connection failed: ', error) }) diff --git a/packages/modules/web_themes/colors/source/src/assets/js/processMessages.ts b/packages/modules/web_themes/colors/source/src/assets/js/processMessages.ts index b93652b01c..c09759d7ce 100755 --- a/packages/modules/web_themes/colors/source/src/assets/js/processMessages.ts +++ b/packages/modules/web_themes/colors/source/src/assets/js/processMessages.ts @@ -1,4 +1,4 @@ -import { mqttRegister, mqttSubscribe } from './mqttClient' +import { mqttRegister, mqttSubscribe, mqttUnsubscribe } from './mqttClient' import type { Hierarchy } from './types' import { correctHouseConsumption, @@ -24,6 +24,8 @@ import { processVehicleTemplateMessages, } from '@/components/chargePointList/processMessages' import { processSmarthomeMessages } from '@/components/smartHome/processMessages' +import { addCounter, counters } from '@/components/counterList/model' +import { mqttClientId } from './mqttClient' const topicsToSubscribe = [ 'openWB/counter/#', @@ -35,6 +37,7 @@ const topicsToSubscribe = [ 'openWB/optional/et/#', 'openWB/system/#', 'openWB/LegacySmartHome/#', + 'openWB/command/' + mqttClientId() + '/#', ] export function msgInit() { mqttRegister(processMqttMessage) @@ -43,6 +46,11 @@ export function msgInit() { }) initGraph() } +export function msgStop() { + topicsToSubscribe.forEach((topic) => { + mqttUnsubscribe(topic) + }) +} function processMqttMessage(topic: string, payload: Buffer) { const message = payload.toString() if (topic.match(/^openwb\/counter\/[0-9]+\//i)) { @@ -74,34 +82,51 @@ function processMqttMessage(topic: string, payload: Buffer) { } else if (topic.match(/^openwb\/optional\/et\//i)) { processEtProviderMessages(topic, message) } // else if ( mqttTopic.match( /^openwb\/global\//i) ) { processGlobalMessages(mqttTopic, message); } - //else if (topic.match(/^openwb\/system\//i)) { - // processSystemMessages(topic, message) - //} else if ( mqttTopic.match( /^openwb\/verbraucher\//i) ) { processVerbraucherMessages(mqttTopic, message); } + else if (topic.match(/^openwb\/system\//i)) { + processSystemMessages(topic, message) + } // else if ( mqttTopic.match( /^openwb\/verbraucher\//i) ) { processVerbraucherMessages(mqttTopic, message); } // else if ( mqttTopic.match( /^openwb\/hook\//i) ) { processHookMessages(mqttTopic, message); } // else if ( mqttTopic.match( /^openwb\/SmartHome\/Devices\//i) ) { processSmartHomeDevicesMessages(mqttTopic, message); } else if (topic.match(/^openwb\/LegacySmartHome\//i)) { processSmarthomeMessages(topic, message) + } else if (topic.match(/^openwb\/command\//i)) { + processCommandMessages(topic, message) } + // else if ( mqttTopic.match( /^openwb\/config\/get\/sofort\/lp\//i) ) { processSofortConfigMessages(mqttTopic, message); } } function processCounterMessages(topic: string, message: string) { const elements = topic.split('/') - if (+elements[2] == globalData.evuId) { + const id = +elements[2] + if (id == globalData.evuId) { processEvuMessages(topic, message) } else if (elements[3] == 'config') { // console.warn('Ignored counter config message') - } else { + } + if (elements[3] == 'get') { switch (elements[4]) { case 'power': + counters[id].power = +message + break case 'config': + break case 'fault_str': + break case 'fault_state': + break case 'power_factors': + break case 'imported': + break case 'exported': + break case 'frequency': - case 'daily_yield_import': - case 'daily_yield_export': + break + case 'daily_imported': + counters[id].energy_imported = +message + break + case 'daily_exported': + counters[id].energy_exported = +message break default: // console.warn('Ignored COUNTER message: ' + topic) @@ -138,6 +163,7 @@ function processHierarchy(hierarchy: Hierarchy) { switch (hierarchy.type) { case 'counter': // console.info('counter in hierachy: ' + hierarchy.id) + addCounter(hierarchy.id, hierarchy.type) break case 'cp': addChargePoint(hierarchy.id) @@ -152,6 +178,7 @@ function processHierarchy(hierarchy: Hierarchy) { default: // console.warn('Ignored Hierarchy type: ' + hierarchy.type) } + // recursively process the hierarchy hierarchy.children.forEach((element) => processHierarchy(element)) } @@ -203,3 +230,26 @@ function processEvuMessages(topic: string, message: string) { default: } } + +function processSystemMessages(topic: string, message: string) { + if ( + topic.match(/^openWB\/system\/device\/[0-9]+\/component\/[0-9]+\/config$/i) + ) { + const config = JSON.parse(message) + if (config.type == 'counter') { + counters[config.id].name = config.name + } + } +} + +function processCommandMessages(topic: string, message: string) { + const tokens = topic.split('/') + if (topic.match(/^openWB\/command\/[a-z]+\/error$/i)) { + if (tokens[2] == mqttClientId()) { + const err = JSON.parse(message) + console.error( + `Error message from openWB: \nCommand: ${err.command}\nData: JSON.stringify(err.data)\nError:\n ${err.error}`, + ) + } + } +} diff --git a/packages/modules/web_themes/colors/source/src/assets/js/themeConfig.ts b/packages/modules/web_themes/colors/source/src/assets/js/themeConfig.ts index b4d83a6bb4..76e35458e3 100644 --- a/packages/modules/web_themes/colors/source/src/assets/js/themeConfig.ts +++ b/packages/modules/web_themes/colors/source/src/assets/js/themeConfig.ts @@ -21,12 +21,16 @@ export class Config { private _decimalPlaces = 1 private _showQuickAccess = true private _simpleCpList = false + private _shortCpList = 'no' private _showAnimations = true private _preferWideBoxes = false private _maxPower = 4000 private _fluidDisplay = false private _showClock = 'no' private _showButtonBar = true + private _showCounters = false + private _showVehicles = false + private _showPrices = false private _debug: boolean = false isEtEnabled: boolean = false etPrice: number = 20.5 @@ -129,6 +133,16 @@ export class Config { setSimpleCpList(show: boolean) { this._simpleCpList = show } + get shortCpList() { + return this._shortCpList + } + set shortCpList(show: string) { + this._shortCpList = show + savePrefs() + } + setShortCpList(show: string) { + this._shortCpList = show + } get showAnimations() { return this._showAnimations } @@ -184,6 +198,7 @@ export class Config { } set debug(on: boolean) { this._debug = on + savePrefs() } setDebug(on: boolean) { this._debug = on @@ -198,6 +213,36 @@ export class Config { setShowButtonBar(show: boolean) { this._showButtonBar = show } + get showCounters() { + return this._showCounters + } + set showCounters(show: boolean) { + this._showCounters = show + savePrefs() + } + setShowCounters(show: boolean) { + this._showCounters = show + } + get showVehicles() { + return this._showVehicles + } + set showVehicles(show: boolean) { + this._showVehicles = show + savePrefs() + } + setShowVehicles(show: boolean) { + this._showVehicles = show + } + get showPrices() { + return this._showPrices + } + set showPrices(show: boolean) { + this._showPrices = show + savePrefs() + } + setShowPrices(show: boolean) { + this._showPrices = show + } } export const globalConfig = reactive(new Config()) export function initConfig() { @@ -329,11 +374,16 @@ interface Preferences { maxPow?: number showQA?: boolean simpleCP?: boolean + shortCP?: string animation?: boolean wideB?: boolean fluidD?: boolean clock?: string showButtonBar?: boolean + showCounters?: boolean + showVehicles?: boolean + showPrices?: boolean + debug?: boolean } function writeCookie() { @@ -351,11 +401,17 @@ function writeCookie() { prefs.maxPow = globalConfig.maxPower prefs.showQA = globalConfig.showQuickAccess prefs.simpleCP = globalConfig.simpleCpList + prefs.shortCP = globalConfig.shortCpList prefs.animation = globalConfig.showAnimations prefs.wideB = globalConfig.preferWideBoxes prefs.fluidD = globalConfig.fluidDisplay prefs.clock = globalConfig.showClock prefs.showButtonBar = globalConfig.showButtonBar + prefs.showCounters = globalConfig.showCounters + prefs.showVehicles = globalConfig.showVehicles + prefs.showPrices = globalConfig.showPrices + prefs.debug = globalConfig.debug + document.cookie = 'openWBColorTheme=' + JSON.stringify(prefs) + '; max-age=16000000' } @@ -405,6 +461,9 @@ function readCookie() { if (prefs.simpleCP !== undefined) { globalConfig.setSimpleCpList(prefs.simpleCP) } + if (prefs.shortCP !== undefined) { + globalConfig.setShortCpList(prefs.shortCP) + } if (prefs.animation != undefined) { globalConfig.setShowAnimations(prefs.animation) } @@ -420,5 +479,17 @@ function readCookie() { if (prefs.showButtonBar !== undefined) { globalConfig.setShowButtonBar(prefs.showButtonBar) } + if (prefs.showCounters !== undefined) { + globalConfig.setShowCounters(prefs.showCounters) + } + if (prefs.showVehicles !== undefined) { + globalConfig.setShowVehicles(prefs.showVehicles) + } + if (prefs.showPrices !== undefined) { + globalConfig.setShowPrices(prefs.showPrices) + } + if (prefs.debug !== undefined) { + globalConfig.setDebug(prefs.debug) + } } } diff --git a/packages/modules/web_themes/colors/source/src/components/batteryList/BatteryList.vue b/packages/modules/web_themes/colors/source/src/components/batteryList/BatteryList.vue index f2937ffd87..4a496cb6a0 100755 --- a/packages/modules/web_themes/colors/source/src/components/batteryList/BatteryList.vue +++ b/packages/modules/web_themes/colors/source/src/components/batteryList/BatteryList.vue @@ -2,46 +2,54 @@ Hagen */ @@ -72,12 +80,15 @@ const powerstring = computed(() => { .battery-color { color: var(--color-battery); } + .fg-color { color: var(--color-fg); } + .menu-color { color: var(--color-menu); } + .todaystring { color: var(--color-menu); } diff --git a/packages/modules/web_themes/colors/source/src/components/chargePointList/CPChargePoint.vue b/packages/modules/web_themes/colors/source/src/components/chargePointList/CPChargePoint.vue index b1da8a1de1..ee1af19a0f 100755 --- a/packages/modules/web_themes/colors/source/src/components/chargePointList/CPChargePoint.vue +++ b/packages/modules/web_themes/colors/source/src/components/chargePointList/CPChargePoint.vue @@ -176,21 +176,45 @@ /> -
+
- {{ - (Math.round(props.chargepoint.etMaxPrice * 10) / 10).toFixed( - 1, - ) - }} - ct + {{ + ( + Math.round(props.chargepoint.etMaxPrice * 10) / 10 + ).toFixed(1) + }} + ct + + - {{ currentPrice }} ct - {{ currentPrice }} ct + +
+
+ + + +
@@ -235,6 +259,7 @@ import RadioBarInput from '@/components/shared/RadioBarInput.vue' import WbWidgetFlex from '../shared/WbWidgetFlex.vue' import { updateServer } from '@/assets/js/sendMessages' import RangeInput from '../shared/RangeInput.vue' +import PriceChart from '../priceChart/PriceChart.vue' import { etData } from '../priceChart/model' const props = defineProps<{ @@ -348,30 +373,11 @@ const currentPrice = computed(() => { const [p] = etData.etPriceList.values() return (Math.round(p * 10) / 10).toFixed(1) }) +const editPrice = ref(false) // methods diff --git a/packages/modules/web_themes/colors/source/src/components/chargePointList/ChargePointList.vue b/packages/modules/web_themes/colors/source/src/components/chargePointList/ChargePointList.vue index d2cfe2b5be..21de0f2353 100755 --- a/packages/modules/web_themes/colors/source/src/components/chargePointList/ChargePointList.vue +++ b/packages/modules/web_themes/colors/source/src/components/chargePointList/ChargePointList.vue @@ -1,7 +1,7 @@ diff --git a/packages/modules/web_themes/colors/source/src/components/chargePointList/cpConfig/CPChargeConfigPanel.vue b/packages/modules/web_themes/colors/source/src/components/chargePointList/cpConfig/CPChargeConfigPanel.vue index 9e30a38ed2..fd0a39ae47 100755 --- a/packages/modules/web_themes/colors/source/src/components/chargePointList/cpConfig/CPChargeConfigPanel.vue +++ b/packages/modules/web_themes/colors/source/src/components/chargePointList/cpConfig/CPChargeConfigPanel.vue @@ -56,7 +56,7 @@ () diff --git a/packages/modules/web_themes/colors/source/src/components/chargePointList/cpSimpleList/CPSimpleList.vue b/packages/modules/web_themes/colors/source/src/components/chargePointList/cpSimpleList/CPSimpleList.vue index bde3423d2f..3abd6c69a6 100755 --- a/packages/modules/web_themes/colors/source/src/components/chargePointList/cpSimpleList/CPSimpleList.vue +++ b/packages/modules/web_themes/colors/source/src/components/chargePointList/cpSimpleList/CPSimpleList.vue @@ -1,6 +1,14 @@