Numeric input improvements (#8010)

* Atmospheric tank controls QoL changes

* Changelog

code/game/machinery/atmo_control.dm

@@ -294,7 +294,7 @@ obj/machinery/computer/general_air_control/Destroy()
 		output_info = null
 		signal.data = list ("tag" = output_tag, "power_toggle" = 1)
 
-	if(href_list["out_set_pressure"])
+	if(href_list["out_set_pressure"] != null)
 		var/setpressure = between(0, text2num(href_list["out_set_pressure"]), max_pressure_setting)
 		output_info = null
 		signal.data = list ("tag" = output_tag, "set_external_pressure" = "[setpressure]", "checks" = 1)

html/changelogs/giodjsgijdfhjdfkhfd.yml

@@ -0,0 +1,4 @@
+author: Karolis2011
+delete-after: True
+changes: 
+  - tweak: "Now atmospheric control consoles (like tank and supermatter) numeric inputs set value on enter key press."

vueui/src/components/view/console/atmocontrol/injector.vue

@@ -13,9 +13,7 @@
         <vui-button v-else :params="{ toggle_automation: 1 }">Disengaged</vui-button>
       </vui-item>
       <vui-item label="Inject:">
-        <template v-if="state.device.automation">
-          Controls Locked Out
-        </template>
+        <template v-if="state.device.automation">Controls Locked Out</template>
         <template v-else>
           <vui-button :params="{ toggle_injector: 1 }" icon="power-off">Toggle Power</vui-button>
           <vui-button :params="{ injection: 1 }">Inject (1 Cycle)</vui-button>

vueui/src/components/view/console/atmocontrol/supermatter.vue

@@ -9,7 +9,14 @@
       </vui-item>
       <vui-item label="Flow Rate Limit:">{{ state['input'].rate }} L/s</vui-item>
       <vui-item label="Command:">
-        <vui-input-numeric width="3em" :button-count="3" v-model="state['input'].setrate" :max="state.maxrate"/><br>
+        <vui-input-numeric
+          @keypress.enter="s({ in_set_flowrate: state['input'].setrate })"
+          width="3em"
+          :button-count="3"
+          v-model="state['input'].setrate"
+          :max="state.maxrate"
+        />
+        <br>
         <vui-button push-state :params="{ in_set_flowrate: state['input'].setrate }">Set Flow Rate</vui-button>
       </vui-item>
     </div>
@@ -22,8 +29,19 @@
       </vui-item>
       <vui-item label="Min Core Pressure:">{{ state['output'].pressure }} kPa</vui-item>
       <vui-item label="Command:">
-        <vui-input-numeric width="5em" :button-count="3" :decimal-places="2" v-model="state['output'].setpressure" :max="state.maxpressure"/><br>
-        <vui-button push-state :params="{ out_set_pressure: state['output'].setpressure }">Set Pressure</vui-button>
+        <vui-input-numeric
+          @keypress.enter="s({ out_set_pressure: state['output'].setpressure })"
+          width="5em"
+          :button-count="3"
+          :decimal-places="2"
+          v-model="state['output'].setpressure"
+          :max="state.maxpressure"
+        />
+        <br>
+        <vui-button
+          push-state
+          :params="{ out_set_pressure: state['output'].setpressure }"
+        >Set Pressure</vui-button>
       </vui-item>
     </div>
     <vui-button v-else :params="{ out_refresh_status: 1 }">Search for output port</vui-button>
@@ -31,9 +49,15 @@
 </template>
 
 <script>
+import Utils from "../../../../utils.js";
 export default {
   data() {
     return this.$root.$data;
+  },
+  methods: {
+    s(parameters) {
+      Utils.sendToTopic(parameters);
+    }
   }
 };
 </script>

vueui/src/components/view/console/atmocontrol/tank.vue

@@ -9,7 +9,14 @@
       </vui-item>
       <vui-item :balance="0.65" label="Flow Rate Limit:">{{ state['input'].rate }} L/s</vui-item>
       <vui-item :balance="0.65" label="Command:">
-        <vui-input-numeric width="3em" :button-count="3" v-model="state['input'].setrate" :max="state.maxrate"/><br>
+        <vui-input-numeric
+          @keypress.enter="s({ in_set_flowrate: state['input'].setrate })"
+          width="3em"
+          :button-count="3"
+          v-model="state['input'].setrate"
+          :max="state.maxrate"
+        />
+        <br >
         <vui-button push-state :params="{ in_set_flowrate: state['input'].setrate }">Set Flow Rate</vui-button>
       </vui-item>
     </div>
@@ -22,9 +29,19 @@
       </vui-item>
       <vui-item :balance="0.65" label="Max Output Pressure:">{{ state['output'].pressure }} kPa</vui-item>
       <vui-item :balance="0.65" label="Command:">
-        <vui-input-numeric width="5em" :button-count="4" :decimal-places="2" v-model="state['output'].setpressure" :max="state.maxpressure"/>
-        <br>
-        <vui-button push-state :params="{ out_set_pressure: state['output'].setpressure }">Set Pressure</vui-button>
+        <vui-input-numeric
+          @keypress.enter="s({ out_set_pressure: state['output'].setpressure })"
+          width="5em"
+          :button-count="4"
+          :decimal-places="2"
+          v-model="state['output'].setpressure"
+          :max="state.maxpressure"
+        />
+        <br >
+        <vui-button
+          push-state
+          :params="{ out_set_pressure: state['output'].setpressure }"
+        >Set Pressure</vui-button>
       </vui-item>
     </div>
     <vui-button v-else :params="{ out_refresh_status: 1 }">Search for output port</vui-button>
@@ -32,9 +49,15 @@
 </template>
 
 <script>
+import Utils from '../../../../utils';
 export default {
   data() {
     return this.$root.$data;
+  },
+  methods: {
+    s(parameters) {
+      Utils.sendToTopic(parameters);
+    }
   }
 };
 </script>

vueui/src/components/vui/input/numeric.vue

@@ -1,8 +1,8 @@
 <template>
   <div>
-    <vui-button v-for="bv in subButtons" :key="'-' + bv" :push-state="pushState" :disabled="val - bv < min" @click="onUpdatedValue(-bv)">-</vui-button>
-    <input :style="{width: width}" ref="input" :value="val" @input="onFieldUpdate($event.target)">
-    <vui-button v-for="bv in addButtons" :key="'+' + bv" :push-state="pushState" :disabled="val + bv > max" @click="onUpdatedValue(bv)">+</vui-button>
+    <vui-button v-for="bv in subButtons" :key="'-' + bv" :disabled="val - bv < min" @click="onUpdatedValue(-bv)">-</vui-button>
+    <input @keypress="onKeyPress" :style="{width: width}" ref="input" :value="val" @input="onFieldUpdate($event.target)">
+    <vui-button v-for="bv in addButtons" :key="'+' + bv" :disabled="val + bv > max" @click="onUpdatedValue(bv)">+</vui-button>
   </div>
 </template>
 
@@ -71,7 +71,6 @@ export default {
       }
       console.log(int, field.value, this.value, this.val)
       this.UpdateValue(int)
-      Store.pushState()
       if(_inival == this.val && !(field.value.endsWith("."))) {
         this.$refs.input.value = this.val
       }
@@ -89,6 +88,10 @@ export default {
       if(int < this.min) int = this.min
       this.val = int
       this.$emit('input', int);
+      if(this.pushState) Store.pushState()
+    },
+    onKeyPress(event) {
+      this.$emit('keypress', event)
     }
   },
   watch: {