v4.0.39-beta

jemu75 · Apr 24, 2024 · 2427573 · 2427573
1 parent a3a5a69
commit 2427573
Show file tree

Hide file tree

Showing 24 changed files with 358 additions and 90 deletions.
diff --git a/README.md b/README.md
@@ -668,4 +668,5 @@ Mit **FHEMApp** werden verschiedene Standardvorlagen bereitgestellt, die den Ein
 |Name: *motiondetector* <br>Devicekeys: *sensor*<br>Readings: *alias, **room**, group, sortby, **motion*** <br><br>Einsatz: Bewegungsmelder<br>JSON: [motiondetector](./public/templates/motiondetector.json)|![](./docs/media/template_motiondetector.png)|
 |Name: *lightscene* <br>Devicekeys: *lightscene*<br>Readings: *alias, **room**, group, sortby, **scene*** <br><br>Einsatz: Szenarien<br>JSON: [lightscene](./public/templates/lightscene.json)|![](./docs/media/template_lightscene.png)|
 |Name: *sonosplayer* <br>Devicekeys: *player*<br>Readings: *alias, **room**, group, sortby,<br>and other readings...* <br><br>Einsatz: SONOS Player<br>JSON: [sonosplayer](./public/templates/sonosplayer.json)|![](./docs/media/template_sonosplayer.png)|
-|Name: *proplanta* <br>Devicekeys: *weather*<br>Readings: *alias, **room**, group, sortby,<br>and other readings...* <br><br>Einsatz: Wettervorhersage (Proplanta)<br>JSON: [proplanta](./public/templates/proplanta.json)|![](./docs/media/template_proplanta.png)|
+|Name: *proplanta* <br>Devicekeys: *weather*<br>Readings: *alias, **room**, group, sortby,<br>and other readings...* <br><br>Einsatz: Wettervorhersage (Proplanta)<br>JSON: [proplanta](./public/templates/proplanta.json)|![](./docs/media/template_proplanta.png)|
+|Name: *chart* <br>Devicekeys: *chart*<br>Readings: *alias, **room**, group, sortby*<br>FileLog: *measured-temp, humidity* <br><br>Einsatz: Logdaten für Thermostate<br>JSON: [chart](./public/templates/chart.json)|![](./docs/media/template_chart.png)|
diff --git a/docs/media/template_chart.png b/docs/media/template_chart.png
diff --git a/public/CHANGELOG.md b/public/CHANGELOG.md
@@ -1,3 +1,13 @@
+# v4.0.39-beta (24.04.2024)
+## Panel Status
+- truncate long titles
+- show button to edit panel settings from loglevel 7
+## Settings Panel
+- bug fix in case of new panel without a template and adding new devicekeys
+## Settings
+- Control via URL routes possible
+## App
+- adding default template chart
 # v4.0.38-beta (21.04.2024)
 ## Panel 
 - status now uses the colour variable *primary* analogous to the header of **FHEMApp**

diff --git a/public/templates/chart.json b/public/templates/chart.json
@@ -0,0 +1,97 @@
+{
+	"name": "chart",
+	"author": "jemu",
+	"date": "2024-04-24",	
+	"panel": {
+		"devicekeys": [
+			"chart:FHEM thermostat_FileLog"
+		],
+		"navigation": [
+			"Übersichten",
+			"chart-a-room::Räume->%s",
+			"chart-a-group::Gruppen->%s"
+		],
+		"expandable": [
+			"::true:false:true"
+		],
+		"sortby": [
+			"chart-a-sortby::%s"
+		]
+	},
+	"status": {
+		"title": [
+            "chart-a-alias:^.+$:%s",
+			"chart-i-NAME::%s"
+		],
+		"imageUrl": [
+			"::images/header_01.png"
+		]
+	},
+	"main": [
+		{
+			"level": {
+				"mid": "chart",
+				"height": [
+					"250px"
+				]
+			},
+			"mid": {
+				"serie": [
+					"::get chart - - -4 0 4\\:measured-temp:Temperatur:1:°C:line",
+					"::get chart - - -4 0 4\\:humidity:Luftfeuchte:0:%:line"
+				],
+                "options": {
+					"series": [
+						{
+							"smooth": true,
+							"showSymbol": false
+						},
+						{
+							"smooth": true,
+							"showSymbol": false,
+							"yAxisIndex": 1
+						}
+					]
+				},
+				"options2": {
+                    "grid": {
+                        "top": 30,
+                        "bottom": 120,
+                        "left": 60,
+                        "right": 60
+                    },
+                    "legend": {
+                        "bottom": 60
+                    },
+                    "dataZoom": [
+                        {
+                            "show": true
+                        }
+                    ],
+                    "series": [
+						{
+							"smooth": true,
+							"showSymbol": false
+						},
+						{
+							"smooth": true,
+							"showSymbol": false,
+							"yAxisIndex": 1
+						}
+					]
+                }
+			}
+		}
+	],
+	"info": {
+		"mid1": [
+			"chart-linesInTheFile-ts::%d()"
+		],
+		"right2": [
+			"chart-linesInTheFile::%n()"
+		],
+		"left1": [
+			":::mdi-chart-bar"
+		]
+	}
+}
diff --git a/public/templates/templates.json b/public/templates/templates.json
@@ -1,3 +1,15 @@
 [
-    "switch", "light", "dimmer", "contact", "blind", "thermostat", "temperatur", "smokedetector", "motiondetector", "sonosplayer", "proplanta", "lightscene"
+    "switch", 
+    "light", 
+    "dimmer", 
+    "contact", 
+    "blind", 
+    "thermostat", 
+    "temperatur", 
+    "smokedetector", 
+    "motiondetector", 
+    "sonosplayer", 
+    "proplanta", 
+    "lightscene",
+    "chart"
 ]
diff --git a/src/components/PanelCard.vue b/src/components/PanelCard.vue
@@ -92,6 +92,10 @@
         }
     }
 
+    function editItem(val) {
+        router.push({ name: 'settings', params: { tab: 'panels', item: val }, query: router.currentRoute.value.query })
+    }
+
     function getInfo(pos) {
         let res = fhem.handleDefs(item.panel.info[pos], ['text', 'icon', 'color'],['', '', ''])
 
@@ -144,17 +148,15 @@
         <v-sheet color="primary">
             <v-img :src="img.url" :gradient="img.url ? fhem.app.header.imageGradient : ''" height="48" cover>
                 <v-card-title>
-                    <v-row no-gutters>
-                        <v-col v-if="panel.status.title">
+                    <v-row no-gutters class="align-center">
+                        <v-col v-if="panel.status.title" class="text-truncate">
                             {{  title.title }}
                         </v-col>
-                        <v-spacer></v-spacer>
-                        <v-col v-if="fhem.app.settings.loglevel > 6" class="text-right">
+                        <span v-if="fhem.app.settings.loglevel > 6" class="mx-2">
                             {{ sortby.sortby }}
-                        </v-col>
-                        <v-col v-if="levelOpts.icon" cols="1" class="text-right">
-                            <v-btn :icon="levelOpts.icon" size="small" variant="plain" density="compact" @click="levelClick(false)"></v-btn>
-                        </v-col>
+                        </span>
+                        <v-btn v-if="fhem.app.settings.loglevel > 6" icon="mdi-pencil" size="small" variant="plain" density="compact" @click="editItem(panel.name)"></v-btn>
+                        <v-btn v-if="levelOpts.icon" :icon="levelOpts.icon" size="small" variant="plain" density="compact" @click="levelClick()"></v-btn>
                     </v-row>
                 </v-card-title>
             </v-img>

diff --git a/src/components/SettingsProps.vue b/src/components/SettingsProps.vue
@@ -1,8 +1,9 @@
 <script setup>
-    import { computed, ref } from 'vue'
+    import { computed, ref, watch } from 'vue'
     import { useFhemStore } from '@/stores/fhem'
     import { useI18n } from 'vue-i18n'
     import { useDisplay } from 'vuetify'
+    import router from '@/router'
 
     import VueJsonPretty from 'vue-json-pretty'
     import 'vue-json-pretty/lib/styles.css'
@@ -39,7 +40,7 @@
     const headers = computed(() => {
         let res = [
             { key: 'name', title: i18n.t(preLang + 'title'), sortable: true, align: 'start' },
-            { key: 'actions', title: '', sortable: false, align: 'end' }
+            { key: 'actions', title: '', sortable: false, align: 'end', width: '50%' }
         ]
 
         if(!mobile.value) {
@@ -48,7 +49,7 @@
                     { key: 'name', title: i18n.t(preLang + 'title'), sortable: true, align: 'start' },
                     { key: 'devices', title: 'Devices', sortable: true, align: 'start', filterable: false },
                     { key: 'advanced', title: i18n.t(preLang + 'extended'), sortable: true, filterable: false },
-                    { key: 'actions', title: '', sortable: false, align: 'end' }
+                    { key: 'actions', title: '', sortable: false, align: 'end', width: '15%' }
                 ]
             } else {
                 res = [
@@ -157,6 +158,33 @@
         jsonError: null
     })
 
+    watch(router.currentRoute, (val) => {
+        let idx 
+
+        if(val.params.item) {
+            idx = fhem.app.config[props.type].map((e) => e.name).indexOf(val.params.item) 
+            
+            if(idx !== -1) {
+                item.value = fhem.app.config[props.type][idx]
+                settings.value.itemIdx = idx
+
+                getReadings()
+
+                settings.value.extended = items.value[items.value.map((e) => e.idx).indexOf(idx)].advanced !== '-' ? true : false
+
+                if(typeof item.value === 'object') {
+                    settings.value.jsonDef = JSON.stringify(item.value, null, '\t')
+                    settings.value.jsonError = null
+                }
+
+                return
+            }
+        } 
+
+        item.value = null
+        settings.value.panel = null
+    }, { immediate: true })
+
     function updatePanel(panel) {
         settings.value.panel = panel
     }
@@ -240,23 +268,13 @@
             }
 
         fhem.app.config[props.type].push(props.type === 'panels' ? newPanel : newTemplate)
-        settings.value.newItem = ''
         
-        editItem(fhem.app.config[props.type].length - 1)
+        editItem(settings.value.newItem)
+        settings.value.newItem = ''
     }
 
-    function editItem(idx) {
-        item.value = fhem.app.config[props.type][idx]
-        settings.value.itemIdx = idx
-
-        getReadings()
-
-        settings.value.extended = items.value[items.value.map((e) => e.idx).indexOf(idx)].advanced !== '-' ? true : false
-
-        if(typeof item.value === 'object') {
-            settings.value.jsonDef = JSON.stringify(item.value, null, '\t')
-            settings.value.jsonError = null
-        }
+    function editItem(val) {
+        router.push({ name: 'settings', params: { tab: props.type, item: val }, query: router.currentRoute.value.query })
     }
 
     function deleteItem(idx) {
@@ -348,7 +366,7 @@
                         variant="plain"
                         density="compact"
                         class="mr-3"
-                        @click="editItem(item.idx)">
+                        @click="editItem(item.name)">
                     </v-btn>
                     <v-btn 
                         icon="mdi-delete"
@@ -364,7 +382,7 @@
             <v-row>
                 <v-col>
                     <v-row class="align-center">
-                        <v-btn variant="plain" icon="mdi-arrow-up-left" @click="item = null; settings.panel = null"></v-btn>
+                        <v-btn variant="plain" icon="mdi-arrow-up-left" @click="editItem()"></v-btn>
 
                         <v-col cols="10" md="">
                             <v-autocomplete v-if="!settings.rawMode"

diff --git a/src/components/SettingsPropsDevices.vue b/src/components/SettingsPropsDevices.vue
@@ -58,6 +58,7 @@
     }
 
     function addKey() {
+        if(!fhem.getEl(fhem.app.config[props.type][props.typeIdx], ['panel', 'devices'])) fhem.app.config[props.type][props.typeIdx]['panel']['devices'] = []
         fhem.app.config[props.type][props.typeIdx]['panel']['devices'].push(newKey.value + ':')
         newKey.value = null
         getDevices()
@@ -73,7 +74,7 @@
 
 <template>
     <v-row v-for="(device, idx) of devices" :key="device.key" no-gutters class="pt-3 align-center">
-        <v-col class="pt-3">
+        <v-col>
             <v-autocomplete
                 v-model="devices[idx]['device']"                                
                 :items="fhemDevices"
@@ -84,10 +85,10 @@
                 @update:modelValue="updateDeviceKeys()">
             </v-autocomplete>
         </v-col>
-        <v-btn v-if="extended" variant="plain" icon="mdi-delete" @click="deleteKey(idx)" class="pt-3 pl-5"></v-btn>
+        <v-btn v-if="extended" variant="plain" icon="mdi-delete" @click="deleteKey(idx)"></v-btn>
     </v-row>
     <v-row v-if="extended" no-gutters class="pt-3 align-center">
-        <v-col class="pt-3">
+        <v-col>
             <v-text-field
                 v-model="newKey"
                 density="compact" 
@@ -97,6 +98,6 @@
                 label="new deviceKey">
             </v-text-field>            
         </v-col>
-        <v-btn variant="plain" icon="mdi-plus" :disabled="!newKey" @click="addKey()" class="pt-3 mr-5"></v-btn>
+        <v-btn variant="plain" icon="mdi-plus" :disabled="!newKey" @click="addKey()" class="mr-8"></v-btn>
     </v-row>
 </template>
diff --git a/src/components/SettingsPropsItem.vue b/src/components/SettingsPropsItem.vue
@@ -157,7 +157,7 @@
         handle=".dd_zone"
         item-key="id">
         <template #item={index}>
-            <v-row no-gutters class="py-3 align-center">
+            <v-row no-gutters class="pt-3 align-center">
                 <v-icon icon="mdi-drag-vertical" class="dd_zone pr-5" :disabled="disable"></v-icon>
                 <v-col>
                     <v-text-field 
@@ -172,7 +172,7 @@
                         @click:prepend-inner="openAssist(index)">
                     </v-text-field>
                 </v-col>
-                <v-btn variant="plain" density="compact" icon="mdi-delete" @click="deleteDef(index)" class="pl-5"></v-btn>                
+                <v-btn variant="plain" icon="mdi-delete" @click="deleteDef(index)"></v-btn>                
             </v-row>
         </template>
     </draggable>
@@ -195,7 +195,7 @@
                     @click:append-inner="fhem.help(propHelp)">
                 </v-text-field>                        
             </v-col>
-            <v-btn variant="plain" icon="mdi-plus" :disabled="!newDef" @click="addDef()" class="mr-5"></v-btn>
+            <v-btn variant="plain" icon="mdi-plus" :disabled="!newDef" @click="addDef()" class="mr-8"></v-btn>
         </v-row>
     </v-form>
 

diff --git a/src/components/SettingsPropsMainItem.vue b/src/components/SettingsPropsMainItem.vue
@@ -162,7 +162,7 @@
         handle=".dd_zone"
         item-key="id">
         <template #item={index}>
-            <v-row no-gutters class="py-3 align-center">
+            <v-row no-gutters class="pt-3 align-center">
                 <v-icon icon="mdi-drag-vertical" class="dd_zone pr-5"></v-icon>
                 <v-col>
                     <v-text-field 
@@ -177,7 +177,7 @@
                         @click:prepend-inner="openAssist(index)">
                     </v-text-field>
                 </v-col>
-                <v-btn variant="plain" density="compact" icon="mdi-delete" @click="deleteDef(index)" class="pl-5"></v-btn>
+                <v-btn variant="plain" icon="mdi-delete" @click="deleteDef(index)"></v-btn>
             </v-row>
         </template>
     </draggable>
@@ -200,7 +200,7 @@
                     @click:append-inner="fhem.help(propHelp)">
                 </v-text-field>                        
             </v-col>
-            <v-btn variant="plain" icon="mdi-plus" :disabled="!newDef" @click="addDef()" class="mr-5"></v-btn>
+            <v-btn variant="plain" icon="mdi-plus" :disabled="!newDef" @click="addDef()" class="mr-8"></v-btn>
         </v-row>
     </v-form>
 

diff --git a/src/router/index.js b/src/router/index.js
@@ -9,12 +9,12 @@ const router = createRouter({
       component: () => import('../views/DevicesView.vue')
     },
     {
-      path: '/:config/devices/:view',
+      path: '/:config/devices/:view?',
       name: 'devices',
       component: () => import('../views/DevicesView.vue')
     },
     {
-      path: '/:config/settings',
+      path: '/:config/settings/:tab?/:item?',
       name: 'settings',
       component: () => import('../views/SettingsView.vue')
     },