varinput调整

src/components/editor/composer/VariableInput.vue

@@ -86,7 +86,7 @@
       </q-btn-dropdown>
     </template>
     <template v-slot:prepend>
-      <q-icon :name="command.icon || commandIcons[command.value] || 'code'" />
+      <q-icon :name="command.icon || 'code'" />
     </template>
   </q-input>
   <!-- 强制为数字类型时，不支持切换类型 -->
@@ -100,7 +100,7 @@
     class="number-input"
   >
     <template v-slot:prepend>
-      <q-icon :name="command.icon || commandIcons[command.value] || 'code'" />
+      <q-icon v-if="command.icon" :name="command.icon" />
     </template>
     <template v-slot:append>
       <!-- <q-icon name="pin" size="xs" /> -->
@@ -130,7 +130,6 @@
 
 <script>
 import { defineComponent, inject } from "vue";
-import { commandIcons } from "js/composer/composerConfig";
 
 export default defineComponent({
   name: "VariableInput",
@@ -148,7 +147,7 @@ export default defineComponent({
 
   setup() {
     const variables = inject("composerVariables", []);
-    return { variables, commandIcons };
+    return { variables };
   },
 
   data() {
@@ -238,14 +237,14 @@ export default defineComponent({
   },
 
   watch: {
-    // 解决通过外部传入值时，无法触发字符串处理的问题
+    // 解决通过外部传入值时，无法触<EFBFBD><EFBFBD><EFBFBD>字符串处理的问题
     modelValue: {
       immediate: true,
       handler(newVal) {
         // 只在有值且非变量模式且非数字类型时处理
         if (newVal && !this.hasSelectedVariable && !this.isNumber) {
           const formattedValue = this.formatValue(newVal);
-          // 只在值真正需要更新时才<EFBFBD><EFBFBD><EFBFBD>发更新
+          // 只在值真正需要更新时才发更新
           if (formattedValue !== newVal) {
             this.$emit("update:modelValue", formattedValue);
           }

src/components/editor/composer/ubrowser/UBrowserRun.vue

@@ -30,42 +30,42 @@
     <div class="col-12">
       <div class="row q-col-gutter-sm">
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.width"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.width"
             label="窗口宽度"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('width', $event)"
           />
         </div>
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.height"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.height"
             label="窗口高度"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('height', $event)"
           />
         </div>
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.x"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.x"
             label="X坐标"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('x', $event)"
           />
         </div>
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.y"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.y"
             label="Y坐标"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('y', $event)"
           />
         </div>
@@ -76,42 +76,42 @@
     <div class="col-12">
       <div class="row q-col-gutter-sm">
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.minWidth"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.minWidth"
             label="最小宽度"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('minWidth', $event)"
           />
         </div>
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.minHeight"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.minHeight"
             label="最小高度"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('minHeight', $event)"
           />
         </div>
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.maxWidth"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.maxWidth"
             label="最大宽度"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('maxWidth', $event)"
           />
         </div>
         <div class="col-3">
-          <q-input
-            v-model.number="localConfigs.run.maxHeight"
-            type="number"
+          <VariableInput
+            v-model="localConfigs.run.maxHeight"
             label="最大高度"
             dense
             outlined
+            :command="{ inputType: 'number' }"
             @update:model-value="updateConfig('maxHeight', $event)"
           />
         </div>
@@ -186,9 +186,13 @@
 
 <script>
 import { defineComponent } from "vue";
+import VariableInput from "../VariableInput.vue";
 
 export default defineComponent({
   name: "UBrowserRun",
+  components: {
+    VariableInput,
+  },
   props: {
     configs: {
       type: Object,