数据

components/NumberInput.vue

@@ -1,34 +1,135 @@
 <template>
   <input
-    class="filter_input"
     type="number"
-    :value="value"
+    :value="displayValue"
-    :placeholder="placeholder"
+    @input="handleInput"
-    @input="onInput"
+    @blur="handleBlur"
-	@confirm="onInput"
+    :class="inputClass"
   />
 </template>
 
 <script>
 export default {
+  name: "NumberInput",
   props: {
-    value: {
+    value: [Number, String],
-      type: [Number, String],
+    inputClass: {
-      default: '',
+      type: String,
+      default: ''
+    },
+    // 输入模式：integer(纯整数), decimal(纯小数), mixed(混合)
+    mode: {
+      type: String,
+      default: "mixed",
+      validator: (v) => ["integer", "decimal", "mixed"].includes(v),
+    },
+    // 小数位数限制
+    decimalLength: {
+      type: Number,
+      default: 2,
+    },
+    // 最小值
+    min: {
+      type: Number,
+      default: 0,
+    },
+    // 最大值
+    max: {
+      type: Number,
+      default: Infinity,
+    },
+  },
+  data() {
+    return {
+      displayValue: this.value?.toString() || "",
+    };
+  },
+  watch: {
+    value(newVal) {
+      this.displayValue = newVal?.toString() || "";
     },
-	placeholder: String
   },
   methods: {
-    onInput(event) {
+    handleInput(e) {
-      // 获取输入值
+      let value = e.detail.value;
-      const value = event.detail ? event.detail.value : event.target.value;
+      
-      // 格式化输入值
+      // 1. 过滤非法字符
-      let formattedValue = value.replace(/[^0-9.]/g, '')
+      let filtered = value.replace(/[^\d.]/g, "");
-	  formattedValue = parseFloat(formattedValue)
+      
-	  formattedValue = formattedValue > 0 ? formattedValue : ''
+      // 2. 处理多余的小数点
-      this.$emit('input', formattedValue);
+      if (this.mode === "integer") {
-	  event.target.value = formattedValue
+        filtered = filtered.replace(/\./g, ""); // 整数模式删除所有小数点
-    }
+      } else {
+        const firstDotIndex = filtered.indexOf(".");
+        if (firstDotIndex !== -1) {
+          // 只保留第一个小数点
+          filtered =
+            filtered.substring(0, firstDotIndex + 1) +
+            filtered.substring(firstDotIndex + 1).replace(/\./g, "");
+        }
+      }
+      
+      // 3. 处理前导0
+      if (filtered.startsWith("0") && filtered.length > 1 && !filtered.startsWith("0.")) {
+        filtered = filtered.replace(/^0+/, "0").replace(/^0([^.])/, "$1");
+      }
+      
+      // 4. 处理开头的小数点
+      if (filtered.startsWith(".")) {
+        if (this.mode === "integer") {
+          filtered = "";
+        } else {
+          filtered = "0" + filtered;
+        }
+      }
+      
+      this.displayValue = filtered;
+    },
+    
+    handleBlur() {
+      let value = this.displayValue;
+      
+      // 空值处理
+      if (value === "" || value === ".") {
+        this.$emit("input", "");
+        return;
+      }
+      
+      // 处理结尾的小数点
+      if (value.endsWith(".")) {
+        value = value.slice(0, -1);
+      }
+      
+      // 转换为数字
+      const numValue = Number(value);
+      
+      // 小数位数处理
+      let processedValue = value;
+      if (this.mode !== "integer" && value.includes(".")) {
+        const parts = value.split(".");
+        if (parts[1].length > this.decimalLength) {
+          processedValue = `${parts[0]}.${parts[1].slice(0, this.decimalLength)}`;
+        }
+      }
+      
+      // 范围校验
+      let finalNum = Number(processedValue);
+      if (finalNum < this.min) finalNum = this.min;
+      if (finalNum > this.max) finalNum = this.max;
+      
+      // 更新值
+      this.displayValue = finalNum.toString();
+      this.$emit("input", finalNum);
+    },
   },
 };
 </script>
+
+<style scoped>
+.number-input {
+  border: 1px solid #ddd;
+  padding: 8px 12px;
+  border-radius: 4px;
+  font-size: 14px;
+}
+</style>

pages/General/distribution-box.vue

@@ -42,7 +42,7 @@
 						<span class="filter_label">重量</span>
 					</view>
 					<view class="zd-col-16">
-						<input type="number" v-model="qty" class="filter_input">
+						<NumberInput v-model="qty" />
 					</view>
 					<view class="zd-col-2"><span class="filter_unit">KG</span></view>
 				</view>
@@ -99,12 +99,14 @@
 <script>
 	import NavBar from '@/components/NavBar.vue'
 	import SearchBox from '@/components/SearchBox.vue'
+	import NumberInput from '@/components/NumberInput.vue'
 	// import {queryGroupInfo} from '@/utils/mork2.js'
 	import {queryGroupInfo, deliveryBox} from '@/utils/getData2.js'
 	export default {
 		components: {
 			NavBar,
-			SearchBox
+			SearchBox,
+			NumberInput
 		},
 		data() {
 			return {

pages/General/warehouse-box.vue

@@ -69,7 +69,7 @@
 						<span class="filter_label">重量</span>
 					</view>
 					<view class="zd-col-16">
-						<input type="number" v-model="qty" class="filter_input">
+						<NumberInput v-model="qty" />
 					</view>
 					<view class="zd-col-2"><span class="filter_unit">KG</span></view>
 				</view>
@@ -111,6 +111,7 @@
 	import {getCLodop} from '@/utils/CLodopfuncs.js'
 	import NavBar from '@/components/NavBar.vue'
 	import SearchBox from '@/components/SearchBox.vue'
+	import NumberInput from '@/components/NumberInput.vue'
 	import {getDate} from '@/utils/utils.js'
 	const currentDate = getDate({format: true})
 	// import {queryGroupQuality, queryBoxType} from '@/utils/mork2.js'
@@ -118,7 +119,8 @@
 	export default {
 		components: {
 			NavBar,
-			SearchBox
+			SearchBox,
+			NumberInput
 		},
 		data() {
 			return {

utils/mork2.js

@@ -1,25 +1,41 @@
 export const queryGroupQuality = (code) => {
 	let res = {
-		message: 'ok',
+			"message": "操作成功!",
-		data: [
+			"data": [
-			{
+				{
-				text: '品质1',
+					"text": "待检",
-				value: '1'
+					"value": "1"
-			}
+				},
-		]
+				{
-	}
+					"text": "合格",
+					"value": "2"
+				},
+				{
+					"text": "不合格",
+					"value": "3"
+				}
+			]
+		}
 	return res
 }
 export const queryBoxType = (code) => {
 	let res = {
-		message: 'ok',
+			"message": "操作成功!",
-		data: [
+			"data": [
-			{
+				{
-				text: '类型1',
+					"text": "小料箱",
-				value: '1'
+					"value": "1"
-			}
+				},
-		]
+				{
-	}
+					"text": "大料箱",
+					"value": "2"
+				},
+				{
+					"text": "焊条筒",
+					"value": "3"
+				}
+			]
+		}
 	return res
 }
 export const queryVehicleType = (code) => {