소스 검색

fix(inventoryTable): 优化输入框和选择框的布局,提升用户体验

xieyong 2 주 전
부모
커밋
08ed8c1678
1개의 변경된 파일과 30개의 추가작업 그리고 29개의 파일을 삭제
  1. 30 29
      src/BIZComponents/inventoryTable.vue

+ 30 - 29
src/BIZComponents/inventoryTable.vue

@@ -733,36 +733,37 @@
               trigger: 'change'
             }"
           >
-            <el-input
-              v-model="scope.row[countObj.countKey]"
-              style="width: calc(100% - 36px)"
-              placeholder="请输入"
-              type="number"
-              :min="0"
-              @input="handleCountChange(scope.row, scope.$index)"
+            <div
+              style="display: flex; align-items: center; gap: 4px; width: 100%"
             >
-              <template slot="append">
-                <el-select
-                  v-model="scope.row[countObj.unitIdKey]"
-                  style="width: 100px"
-                  v-if="!!scope.row.productId && scope.row.productId != 0"
-                  @change="handleCountChange(scope.row, scope.$index)"
-                >
-                  <el-option
-                    :label="item.conversionUnit"
-                    :value="item.id"
-                    v-for="(item, index) in scope.row.packageDispositionList"
-                    :key="index"
-                  ></el-option>
-                </el-select>
-                <el-input
-                  v-else
-                  v-model="scope.row.measuringUnit"
-                  placeholder="单位"
-                  style="width: 100px; padding: 0"
-                ></el-input>
-              </template>
-            </el-input>
+              <el-input
+                v-model="scope.row[countObj.countKey]"
+                style="flex: 1; min-width: 0"
+                placeholder="请输入"
+                type="number"
+                :min="0"
+                @input="handleCountChange(scope.row, scope.$index)"
+              />
+              <el-select
+                v-model="scope.row[countObj.unitIdKey]"
+                style="width: 100px; flex-shrink: 0"
+                v-if="!!scope.row.productId && scope.row.productId != 0"
+                @change="handleCountChange(scope.row, scope.$index)"
+              >
+                <el-option
+                  :label="item.conversionUnit"
+                  :value="item.id"
+                  v-for="(item, index) in scope.row.packageDispositionList"
+                  :key="index"
+                ></el-option>
+              </el-select>
+              <el-input
+                v-else
+                v-model="scope.row.measuringUnit"
+                placeholder="单位"
+                style="width: 100px; flex-shrink: 0"
+              ></el-input>
+            </div>
           </el-form-item>
         </template>