备件库数量修改

src/components/parts/spareCell.vue

-<template>
-	<view class="spare-item">
-		<view class="left-view">
-			<u-checkbox v-if="showChecked" icon-size="28" size="40" v-model="check" @change="handleChange" shape="circle"/>
-			<image class="image-view" :src="imageUrl"></image>
-			<view class="info-view">
-				<view class="name-text">{{item.name}}</view>
-				<view>{{remarkText}}</view>
-			</view>
-		</view>
-		<view class="count-view">
-			<view v-if="showChecked">
-				<u-number-box v-model="value" :min="item.min || 0" :max="item.max || item[type]" @change="numChange"></u-number-box>
-			</view>
-			<text v-else>x{{item[type]|| 0}}</text>
-		</view>
-	</view>
-</template>
-
+<template>
+	<view class="spare-item">
+		<view class="left-view">
+			<u-checkbox v-if="showChecked" icon-size="28" size="40" v-model="check" @change="handleChange"
+				shape="circle" />
+			<image class="image-view" :src="imageUrl"></image>
+			<view class="info-view">
+				<view class="name-text">{{item.name}}</view>
+				<view>{{remarkText}}</view>
+			</view>
+		</view>
+		<view class="count-view">
+			<view v-if="showChecked">
+				<u-number-box v-model="value" :min="item.min || 0" :max="item.max || item[type]" @minus="numChange"
+					@plus="numChange" @blur="numChange"></u-number-box>
+			</view>
+			<text v-else>x{{item[type]|| 0}}</text>
+		</view>
+	</view>
+</template>
+
 <script>
-	export default {
-		props: {
-			showChecked: { // 是否显示勾选
-			  type: Boolean,
-			  default() {
-				return false
-			  }
-			},
-			type: { // 'stock' 仓库； 'quantity' 订单
-				type: String,
-				default: 'quantity'
-			},
-			item: {
-				type: Object,
-				default() {
-					return {}
-				}
-			},
-			noteText: {
-				type: String,
-				default: ''
-			},
-		},
-		data() {
-			return {
-				value: 0,
-				check: false,
-				oldCount: 0
-			}
-		},
-		computed: {
-			remarkText() {
-				if (this.item.categoryName || this.item.brandName) {
-					return (this.item.categoryName || '通用') + '-' + (this.item.brandName || '通用')
-				} else {
-					return '通用'
-				}
-			},
-			imageUrl() {
-				return this.item.images ? process.uniEnv.systemUrl.apiUrl + this.item.images.split(',').shift() : this.placeholderImage
-			},
-			placeholderImage() {
-				return process.uniEnv.qn_base_url + 'morentupian.png'
-			},
-		},
-		watch: {
-			showChecked(val) {
-				this.oldCount = 0
-			},
-			'item.quantity'(val) {
-				this.value = val
-			},
-			'item.selected'(val) {
-				this.check = val
-				this.value= val ? this.item.stock : 0
-			},
-		},
-		methods: {
-			handleChange(event) {
-				this.value= event.value ? this.item.stock : 0
-				this.$emit('change', event.value)
-			},
-			numChange(event) {
-				if (event.value == 0 && this.oldCount > 0) {
-					this.check = false
-					this.$emit('change', this.check)
-				} else if (event.value > 0 && this.oldCount == 0) {
-					this.check = true
-					this.$emit('change', this.check)
-				}
-				this.oldCount = event.value
-				this.$emit('numChange', event.value)
-			},
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-.spare-item {
-		display: flex;
-		// width: 100%;
-		justify-content: space-between;
-		align-items: flex-end;
-		// padding: 30rpx;
-		// background-color: #FFFFFF;
-		// border-radius: 12rpx;
-		.left-view {
-			display: flex;
-			align-items: center;
-	
-			.image-view {
-				width: 120rpx;
-				height: 120rpx;
-				margin-right: 20rpx;
-				flex-shrink: 0;
-			}
-	
-			.info-view {
-				font-size: 24rpx;
-				color: #333333;
-	
-				.name-text {
-					font-size: 32rpx;
-					font-weight: bold;
-					color: #333333;
-					margin-bottom: 30rpx;
-				}
-			}
-		}
-	
-		.count-view {
-			font-size: 28rpx;
-			color: #333333;
-		}
-	
-}
+	export default {
+		props: {
+			showChecked: { // 是否显示勾选
+				type: Boolean,
+				default () {
+					return false
+				}
+			},
+			type: { // 'stock' 仓库； 'quantity' 订单
+				type: String,
+				default: 'quantity'
+			},
+			item: {
+				type: Object,
+				default () {
+					return {}
+				}
+			},
+			noteText: {
+				type: String,
+				default: ''
+			},
+		},
+		data() {
+			return {
+				value: 0, // 选数
+				check: false, // 选中
+				oldCount: 0 // 旧选数
+			}
+		},
+		computed: {
+			remarkText() {
+				if (this.item.categoryName || this.item.brandName) {
+					return (this.item.categoryName || '通用') + '-' + (this.item.brandName || '通用')
+				} else {
+					return '通用'
+				}
+			},
+			imageUrl() {
+				return this.item.images ? process.uniEnv.systemUrl.apiUrl + this.item.images.split(',').shift() : this
+					.placeholderImage
+			},
+			placeholderImage() {
+				return process.uniEnv.qn_base_url + 'morentupian.png'
+			},
+		},
+		watch: {
+			showChecked(val) {
+				this.oldCount = 0
+			},
+			'item.quantity'(val) {
+				this.value = val
+			},
+			'item.selected'(val) {
+				this.check = val
+				this.value = val ? this.item.stock : 0
+			},
+		},
+		methods: {
+			handleChange(event) {
+				this.value = event.value ? this.item.stock : 0
+				this.oldCount = this.value
+				this.$emit('change', event.value)
+			},
+			numChange(event) {
+				if (event.value == 0 && this.oldCount > 0) {
+					this.check = false
+					this.$emit('change', this.check)
+				} else if (event.value > 0 && this.oldCount == 0) {
+					this.check = true
+					this.$emit('change', this.check)
+				}
+				this.oldCount = event.value
+				this.$emit('numChange', event.value)
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.spare-item {
+		display: flex;
+		justify-content: space-between;
+		align-items: flex-end;
+
+		.left-view {
+			display: flex;
+			align-items: center;
+
+			.image-view {
+				width: 120rpx;
+				height: 120rpx;
+				margin-right: 20rpx;
+				flex-shrink: 0;
+			}
+
+			.info-view {
+				font-size: 24rpx;
+				color: #333333;
+
+				.name-text {
+					font-size: 32rpx;
+					font-weight: bold;
+					color: #333333;
+					margin-bottom: 30rpx;
+				}
+			}
+		}
+
+		.count-view {
+			font-size: 28rpx;
+			color: #333333;
+		}
+
+	}
 </style>