项目初始化
This commit is contained in:
liuhanqing
317
RuoYi-App-master/pages/in/bindPro.vue
Normal file
317
RuoYi-App-master/pages/in/bindPro.vue
Normal file
@@ -0,0 +1,317 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="input-group">
|
||||
<uni-easyinput
|
||||
v-model="formData.trayCode"
|
||||
placeholder="请输入或扫码输入托盘条码"
|
||||
:clearable="true"
|
||||
@clear="handleClear"
|
||||
@confirm="handleConfirm"
|
||||
ref="trayCodeInput"
|
||||
auto-focus
|
||||
>
|
||||
<template #right>
|
||||
<text class="scan-icon" @click="handleScan">📷</text>
|
||||
</template>
|
||||
</uni-easyinput>
|
||||
</view>
|
||||
|
||||
<view class="info-group">
|
||||
<view class="info-item">
|
||||
<text class="info-label">物料名称：</text>
|
||||
<text class="info-value">{{productInfo.name}}</text>
|
||||
</view>
|
||||
<!-- <view class="info-item">
|
||||
<text class="info-label">批号：</text>
|
||||
<text class="info-value">{{productInfo.lotNo}}</text>
|
||||
</view> -->
|
||||
<view class="info-item">
|
||||
<text class="info-label">数量：</text>
|
||||
<uni-easyinput
|
||||
v-model="formData.inQuantity"
|
||||
type="number"
|
||||
:maxlength="String(productInfo.quantity).length"
|
||||
:placeholder="'最大可输入' + productInfo.quantity"
|
||||
@input="handleQuantityInput"
|
||||
ref="quantityInput"
|
||||
/>
|
||||
<!-- <text class="info-value" style="margin-left: 10rpx;">/{{productInfo.quantity}}</text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="button-group">
|
||||
<button class="bind-button" @click="handleBind" :disabled="productInfo.quantity == 0" :class="{'bind-button-disabled': productInfo.quantity == 0}">绑定托盘</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOrderGoods, bindTray } from '@/api/in/order.js'
|
||||
|
||||
export default {
|
||||
|
||||
onReady() {
|
||||
setTimeout(() => {
|
||||
this.$nextTick(() => {
|
||||
// console.log(this.$refs.trayCodeInput)
|
||||
this.$refs.trayCodeInput.onFocus()
|
||||
})
|
||||
}, 100)
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
trayCode: '',
|
||||
stockinDetailId: '',
|
||||
inQuantity:''
|
||||
},
|
||||
productInfo: {
|
||||
name: '',
|
||||
productId:'',
|
||||
quantity: 0
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
async onLoad(options) {
|
||||
if (options.stockinDetailId) {
|
||||
this.formData.stockinDetailId = options.stockinDetailId
|
||||
|
||||
|
||||
try {
|
||||
const response = await getOrderGoods({
|
||||
stockinDetailId: options.stockinDetailId
|
||||
})
|
||||
const product = response[0]
|
||||
console.log(product)
|
||||
// if (product) {
|
||||
this.productInfo = {
|
||||
name: product.extraField.materialDesc || '',
|
||||
productId: product.extraField.productId || '',
|
||||
quantity: product.quantity || 0
|
||||
// }
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取物料信息失败：', error)
|
||||
uni.showToast({
|
||||
title: '获取物料信息失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
handleClear() {
|
||||
this.formData.trayCode = ''
|
||||
},
|
||||
handleQuantityInput(value) {
|
||||
const numValue = Number(value)
|
||||
if (numValue <= 0) {
|
||||
this.formData.inQuantity = ''
|
||||
uni.showToast({
|
||||
title: '数量必须大于0',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (numValue > this.productInfo.quantity) {
|
||||
this.formData.inQuantity = String(this.productInfo.quantity)
|
||||
uni.showToast({
|
||||
title: '不能超过最大数量',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
this.formData.inQuantity = String(numValue)
|
||||
},
|
||||
handleConfirm() {
|
||||
// 处理确认事件
|
||||
console.log('确认输入：', this.formData)
|
||||
// 将焦点转移到数量输入框
|
||||
this.$refs.quantityInput.focus()
|
||||
},
|
||||
handleScan() {
|
||||
// 调用扫码功能
|
||||
uni.scanCode({
|
||||
success: (res) => {
|
||||
this.formData.trayCode = res.result
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
async handleBind() {
|
||||
// 验证必填信息
|
||||
if (!this.formData.trayCode) {
|
||||
uni.showToast({
|
||||
title: '请输入托盘条码',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!this.formData.inQuantity || Number(this.formData.inQuantity) <= 0) {
|
||||
uni.showToast({
|
||||
title: '请输入大于0的数量',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// 确保提交的数量不超过最大可用数量
|
||||
const submitQuantity = Number(this.formData.inQuantity)
|
||||
if (submitQuantity > this.productInfo.quantity) {
|
||||
this.formData.inQuantity = String(this.productInfo.quantity)
|
||||
uni.showToast({
|
||||
title: '已自动调整为最大可用数量',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
|
||||
// try {
|
||||
const response = await bindTray(this.formData)
|
||||
|
||||
console.log(response)
|
||||
|
||||
if (response.code === 200) {
|
||||
uni.showToast({
|
||||
title: '绑定成功',
|
||||
icon: 'success'
|
||||
})
|
||||
// 返回上一页并传递刷新标记
|
||||
setTimeout(() => {
|
||||
const pages = getCurrentPages()
|
||||
const prevPage = pages[pages.length - 2]
|
||||
if (prevPage) {
|
||||
prevPage.$vm.needRefresh = true
|
||||
}
|
||||
uni.navigateBack()
|
||||
}, 1500)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: response.msg || '绑定失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
// } catch (error) {
|
||||
// // console.error('绑定托盘失败：', error)
|
||||
// uni.showToast({
|
||||
// title: '绑定托盘失败',
|
||||
// icon: 'none'
|
||||
// })
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
padding: 20rpx;
|
||||
background-color: #f5f7fa;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.input-group {
|
||||
margin-bottom: 20rpx;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.scan-icon {
|
||||
font-size: 40rpx;
|
||||
padding: 0 20rpx;
|
||||
color: #409eff;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.scan-icon:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.info-group {
|
||||
background-color: #fff;
|
||||
padding: 30rpx;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.info-item {
|
||||
margin-bottom: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.info-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
color: #606266;
|
||||
margin-right: 16rpx;
|
||||
font-size: 28rpx;
|
||||
min-width: 140rpx;
|
||||
}
|
||||
|
||||
.info-value {
|
||||
color: #303133;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
:deep(.uni-easyinput__content) {
|
||||
background-color: #f5f7fa;
|
||||
border-radius: 8rpx;
|
||||
border: 2rpx solid #dcdfe6;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
:deep(.uni-easyinput__content-input) {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
:deep(.is-input-border) {
|
||||
border-color: #dcdfe6 !important;
|
||||
}
|
||||
|
||||
:deep(.uni-easyinput__content:hover) {
|
||||
border-color: #c0c4cc;
|
||||
}
|
||||
|
||||
:deep(.uni-easyinput__content.is-focus) {
|
||||
border-color: #409eff;
|
||||
}
|
||||
|
||||
:deep(.is-disabled) {
|
||||
background-color: #f5f7fa;
|
||||
border-color: #e4e7ed;
|
||||
}
|
||||
|
||||
.button-group {
|
||||
margin-top: 40rpx;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.bind-button {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: linear-gradient(90deg, #409eff, #007aff);
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
border-radius: 44rpx;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.bind-button:active {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.bind-button-disabled {
|
||||
background: linear-gradient(90deg, #a0cfff, #8cc5ff);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user