groupsoftkeys

Step/wwwroot/assets/styles/base/plc-softkeys.less

@@ -134,6 +134,11 @@
                 font-size: 20px;
                 color: #fff;
                 border: none;
+
+                &.active, &:active{
+                  background-image: none;
+                  background-color: #1791ff;
+                }
             }
         }
     }

Step/wwwroot/assets/styles/style.css

@@ -1580,6 +1580,11 @@ footer .container button.big:before {
   color: #fff;
   border: none;
 }
+.soft-key .menu-container .menu button.active,
+.soft-key .menu-container .menu button:active {
+  background-image: none;
+  background-color: #1791ff;
+}
 .soft-key header {
   height: 23px;
   text-align: center;

Step/wwwroot/src/modules/plc-softkeys.vue

@@ -16,7 +16,8 @@
         <group-soft-key v-if="b.type==2" :title="'softkey_' + b.id | localize('softkey_' + b.id)"
                                          :subkeys="b.subKeys"
                                          @click="toggleMenu(b.id)"
-                                         :menu-opened="b.id == selectedMenuItem"></group-soft-key>
+                                         :menu-opened="b.id == selectedMenuItem"
+                                         @subkeyClick="softKeyChanged"></group-soft-key>
         <on-off-soft-key v-if="b.type==0" :title="'softkey_' + b.id | localize('softkey_' + b.id)"
                         :checked="getSoftKeyStatus(b.id)"
                          @checkChanged="softKeyChanged(b.id)"></on-off-soft-key>

Step/wwwroot/src/modules/under-the-hood/soft-key1.vue

@@ -9,7 +9,7 @@
     </div>
     <div class="menu-container" v-if="menuOpened">
       <div class="menu">
-        <button v-for="k in keys" :key="k">{{getSubKeyText(k)}}</button>
+        <button v-for="k in keys" :key="k" @click="sendSubKey(k)">{{getSubKeyText(k)}}</button>
       </div>
     </div>
   </div>
@@ -21,7 +21,7 @@ export default {
     toggleStar: { default: null },
     title: { default: "_title_" },
     subkeys: {},
-    menuOpened: {default: false},
+    menuOpened: { default: false }
   },
   computed: {
     keys() {
@@ -38,6 +38,9 @@ export default {
     },
     toggleMenu() {
       this.$emit("click");
+    },
+    sendSubKey(id) {
+      this.$emit("subkeyClick", id);
     }
   }
 };

Step/wwwroot/src/modules/under-the-hood/soft-key2.vue

@@ -5,7 +5,7 @@
       <button class="star" :class="{active: starred}"><i class="fa fa-star"></i></button>
       <section class="toggle">
         <div class="togglebutton"><label>
-          <input type="checkbox" :checked="_checked" @click="toggleCheck()">
+          <input type="checkbox" :checked="ischecked" @click="toggleCheck()">
           <span class="toggle">{{checked?onLabel:offLabel}}</span>
         </label></div>
       </section>
@@ -24,12 +24,12 @@ export default {
   },
   data: function() {
     return {
-      _checked: false
+      ischecked: false
     };
   },
   watch: {
     checked: function(n, o) {
-      this._checked = n;
+      this.ischecked = n;
     }
   },
   methods: {