新购编码入库限制一次最多入50条
This commit is contained in:
parent
1d9fb26306
commit
5c5b7457cf
|
|
@ -51,13 +51,14 @@
|
||||||
<uni-col :span="4">
|
<uni-col :span="4">
|
||||||
<checkbox-group @change="onChangeChecked(item)">
|
<checkbox-group @change="onChangeChecked(item)">
|
||||||
<label>
|
<label>
|
||||||
<checkbox
|
<checkbox
|
||||||
color="#409eff"
|
color="#409eff"
|
||||||
borderColor="#409eff"
|
borderColor="#409eff"
|
||||||
activeBorderColor="#409eff"
|
activeBorderColor="#409eff"
|
||||||
:checked="item.checked"
|
:checked="item.checked"
|
||||||
style="transform: scale(0.7)"
|
:disabled="!item.checked && total >= 50"
|
||||||
/>
|
style="transform: scale(0.7)"
|
||||||
|
/>
|
||||||
</label>
|
</label>
|
||||||
</checkbox-group>
|
</checkbox-group>
|
||||||
</uni-col>
|
</uni-col>
|
||||||
|
|
@ -76,10 +77,17 @@
|
||||||
</uni-row>
|
</uni-row>
|
||||||
</view>
|
</view>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
<view class="outbound-btn" @tap="onHandleOutbound"> 入库 </view>
|
<!-- 将原来的两个独立按钮替换为以下代码 -->
|
||||||
|
<view class="bottom-buttons">
|
||||||
|
<view class="outbound-btn" @tap="onHandleOutbound">入库</view>
|
||||||
<view class="checked-btn" @tap="checkedAll">
|
<view class="checked-btn" @tap="checkedAll">
|
||||||
<span>全选</span><span>({{ total }})</span>
|
<view class="btn-content">
|
||||||
|
<span>全选</span>
|
||||||
|
<span>({{ total }})</span>
|
||||||
|
</view>
|
||||||
|
<view class="limit-text">(最多勾选50个)</view>
|
||||||
</view>
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -107,6 +115,9 @@ const scanQrCodeRefBox = ref(null)
|
||||||
// const taskId = ref('')
|
// const taskId = ref('')
|
||||||
// const maTypeName = ref('')
|
// const maTypeName = ref('')
|
||||||
// const typeName = ref('')
|
// const typeName = ref('')
|
||||||
|
const MAX_CHECKED = 50
|
||||||
|
const submitting = ref(false)
|
||||||
|
|
||||||
|
|
||||||
// 编码识别按钮
|
// 编码识别按钮
|
||||||
const onCodeIdentify = () => {
|
const onCodeIdentify = () => {
|
||||||
|
|
@ -329,237 +340,304 @@ const onScrollTolower = () => {
|
||||||
|
|
||||||
// 复选框事件
|
// 复选框事件
|
||||||
const onChangeChecked = (item) => {
|
const onChangeChecked = (item) => {
|
||||||
item.checked = !item.checked
|
if (item.checked) {
|
||||||
let arr = []
|
item.checked = false
|
||||||
codeDeviceList.value.forEach((e) => {
|
total.value--
|
||||||
if (e.checked == true) {
|
} else {
|
||||||
return arr.push(e)
|
item.checked = true
|
||||||
}
|
total.value++
|
||||||
})
|
}
|
||||||
console.log(arr)
|
|
||||||
total.value = arr.length
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 复选框事件
|
// 复选框事件
|
||||||
const checkedAll = () => {
|
const checkedAll = () => {
|
||||||
if (total.value < codeDeviceList.value.length) {
|
// 当前未全选 → 执行“最多50个”的全选
|
||||||
total.value = codeDeviceList.value.length
|
if (total.value < Math.min(codeDeviceList.value.length, MAX_CHECKED)) {
|
||||||
codeDeviceList.value.forEach((e) => {
|
let count = 0
|
||||||
e.checked = true
|
codeDeviceList.value.forEach((e) => {
|
||||||
})
|
if (count < MAX_CHECKED) {
|
||||||
} else if (total.value == codeDeviceList.value.length) {
|
if (!e.checked) {
|
||||||
total.value = 0
|
e.checked = true
|
||||||
codeDeviceList.value.forEach((e) => {
|
count++
|
||||||
e.checked = false
|
}
|
||||||
})
|
} else {
|
||||||
|
e.checked = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
total.value = Math.min(codeDeviceList.value.length, MAX_CHECKED)
|
||||||
|
|
||||||
|
if (codeDeviceList.value.length > MAX_CHECKED) {
|
||||||
|
uni.showToast({
|
||||||
|
title: `全选最多只能勾选${MAX_CHECKED}个`,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
// 已经是“50个全选状态” → 取消全选
|
||||||
|
else {
|
||||||
|
codeDeviceList.value.forEach((e) => {
|
||||||
|
e.checked = false
|
||||||
|
})
|
||||||
|
total.value = 0
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 入库按钮
|
// 入库按钮
|
||||||
const onHandleOutbound = async () => {
|
const onHandleOutbound = async () => {
|
||||||
const isSelect = codeDeviceList.value.some((e) => e.checked === true)
|
if (submitting.value) return
|
||||||
if (!isSelect) {
|
const isSelect = codeDeviceList.value.some((e) => e.checked === true)
|
||||||
|
if (!isSelect) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '请勾选需要入库的设备',
|
||||||
|
icon: 'none',
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
let maxNum = Number(queryParams.value.purchaseNum) - Number(queryParams.value.inputNum)
|
||||||
|
console.log(maxNum)
|
||||||
|
if (total.value > maxNum) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '勾选设备超过待入库数量！',
|
||||||
|
icon: 'none',
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
// 组装入库参数
|
||||||
|
const paramsList = []
|
||||||
|
codeDeviceList.value.map((e) => {
|
||||||
|
if (e.checked) {
|
||||||
|
paramsList.push({
|
||||||
|
maCode: e.maCode,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
uni.showModal({
|
||||||
|
title: '提示',
|
||||||
|
content: '是否确定入库？',
|
||||||
|
success: async (req) => {
|
||||||
|
if (!req.confirm) return
|
||||||
|
|
||||||
|
const paramsList = codeDeviceList.value
|
||||||
|
.filter(e => e.checked)
|
||||||
|
.map(e => ({ maCode: e.maCode }))
|
||||||
|
|
||||||
|
if (paramsList.length === 0) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: '请勾选需要入库的设备',
|
title: '请选择需要入库的设备',
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
})
|
})
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
let maxNum = Number(queryParams.value.purchaseNum) - Number(queryParams.value.inputNum)
|
|
||||||
console.log(maxNum)
|
submitting.value = true
|
||||||
if (total.value > maxNum) {
|
uni.showLoading({
|
||||||
uni.showToast({
|
title: '提交中...',
|
||||||
title: '勾选设备超过待入库数量！',
|
mask: true
|
||||||
|
})
|
||||||
|
|
||||||
|
try {
|
||||||
|
const param = {
|
||||||
|
...queryParams.value,
|
||||||
|
purchaseId: queryParams.value.id,
|
||||||
|
inPutList: paramsList,
|
||||||
|
}
|
||||||
|
const res = await setInboundCodeAPI(param)
|
||||||
|
if (res.code === 200) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '入库成功！',
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
})
|
})
|
||||||
return
|
await getCodeDeviceListData()
|
||||||
|
queryParams.value.inputNum =
|
||||||
|
Number(queryParams.value.inputNum) + paramsList.length
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.msg || '入库失败',
|
||||||
|
icon: 'none',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.log('🚀 ~ onHandleOutbound ~ error:', error)
|
||||||
|
} finally {
|
||||||
|
submitting.value = false
|
||||||
|
uni.hideLoading()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// 组装入库参数
|
})
|
||||||
const paramsList = []
|
|
||||||
codeDeviceList.value.map((e) => {
|
|
||||||
if (e.checked) {
|
|
||||||
paramsList.push({
|
|
||||||
maCode: e.maCode,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
uni.showModal({
|
|
||||||
title: '提示',
|
|
||||||
content: '是否确定入库？',
|
|
||||||
success: async (req) => {
|
|
||||||
if (req.confirm) {
|
|
||||||
try {
|
|
||||||
let param = {
|
|
||||||
...queryParams.value,
|
|
||||||
// taskId: queryParams.value.taskId,
|
|
||||||
// typeId: queryParams.value.typeId,
|
|
||||||
purchaseId: queryParams.value.id,
|
|
||||||
inPutList: paramsList,
|
|
||||||
}
|
|
||||||
const res = await setInboundCodeAPI(param)
|
|
||||||
console.log(res, '入库')
|
|
||||||
if (res.code === 200) {
|
|
||||||
uni.showToast({
|
|
||||||
title: '入库成功！',
|
|
||||||
icon: 'none',
|
|
||||||
})
|
|
||||||
getCodeDeviceListData()
|
|
||||||
setTimeout(() => {
|
|
||||||
queryParams.value.inputNum = Number(queryParams.value.inputNum) + paramsList.length
|
|
||||||
}, 800)
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.log('🚀 ~ onHandleOutbound ~ error:', error)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.page-container {
|
.page-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
flex-direction: column;
|
||||||
|
background-color: #f7f8fa;
|
||||||
|
padding: 24rpx;
|
||||||
|
padding-bottom: 140rpx; // 为底部按钮留出更多空间
|
||||||
|
.card {
|
||||||
|
padding: 5px;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow: 0 2upx 4upx 0 rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.form-view {
|
||||||
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
flex-direction: column;
|
display: flex;
|
||||||
background-color: #f7f8fa;
|
align-items: center;
|
||||||
padding: 24rpx;
|
}
|
||||||
padding-bottom: 120rpx; // 为底部按钮留出空间
|
.table-list-item {
|
||||||
.card {
|
margin: 20rpx 0;
|
||||||
padding: 5px;
|
padding: 20rpx;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border-radius: 6px;
|
border-radius: 20rpx;
|
||||||
box-shadow: 0 2upx 4upx 0 rgba(0, 0, 0, 0.1);
|
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
transform: scale(0.985);
|
||||||
|
background-color: #fafbfc;
|
||||||
}
|
}
|
||||||
.form-view {
|
|
||||||
width: 100%;
|
:deep(.uni-row) {
|
||||||
height: 100%;
|
/* margin-bottom: 20rpx; */
|
||||||
|
|
||||||
|
.uni-col-7 {
|
||||||
|
color: #8c8c8c;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
line-height: 1.8;
|
||||||
|
color: #262626;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 复选框样式优化
|
||||||
|
checkbox-group {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
|
||||||
.table-list-item {
|
|
||||||
margin: 20rpx 0;
|
|
||||||
padding: 20rpx;
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 20rpx;
|
|
||||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
|
|
||||||
&:active {
|
label {
|
||||||
transform: scale(0.985);
|
padding: 8rpx;
|
||||||
background-color: #fafbfc;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.uni-row) {
|
:deep(checkbox) {
|
||||||
/* margin-bottom: 20rpx; */
|
margin-right: 0;
|
||||||
|
transform: scale(0.8);
|
||||||
.uni-col-7 {
|
|
||||||
color: #8c8c8c;
|
|
||||||
font-size: 28rpx;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cont {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
line-height: 1.8;
|
|
||||||
color: #262626;
|
|
||||||
font-size: 28rpx;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 复选框样式优化
|
|
||||||
checkbox-group {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
label {
|
|
||||||
padding: 8rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(checkbox) {
|
|
||||||
margin-right: 0;
|
|
||||||
transform: scale(0.8);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.line {
|
|
||||||
margin: 24rpx 0;
|
|
||||||
height: 2rpx;
|
|
||||||
background: linear-gradient(
|
|
||||||
90deg,
|
|
||||||
rgba(232, 232, 232, 0) 0%,
|
|
||||||
rgba(232, 232, 232, 1) 50%,
|
|
||||||
rgba(232, 232, 232, 0) 100%
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
.coding-btn {
|
|
||||||
padding: 5rpx 0;
|
|
||||||
background-color: #409eff;
|
|
||||||
border-radius: 6rpx;
|
|
||||||
text-align: center;
|
|
||||||
color: #fff;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 底部入库按钮
|
.line {
|
||||||
.outbound-btn {
|
margin: 24rpx 0;
|
||||||
position: fixed;
|
height: 2rpx;
|
||||||
bottom: 40rpx;
|
background: linear-gradient(
|
||||||
left: 50%;
|
90deg,
|
||||||
transform: translateX(-75%);
|
rgba(232, 232, 232, 0) 0%,
|
||||||
width: 60%;
|
rgba(232, 232, 232, 1) 50%,
|
||||||
height: 88rpx;
|
rgba(232, 232, 232, 0) 100%
|
||||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
);
|
||||||
text-align: center;
|
|
||||||
line-height: 88rpx;
|
|
||||||
color: #fff;
|
|
||||||
border-radius: 12rpx;
|
|
||||||
font-size: 32rpx;
|
|
||||||
font-weight: 600;
|
|
||||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
|
||||||
// transition: all 0.3s ease;
|
|
||||||
|
|
||||||
// &:active {
|
|
||||||
// transform: translateX(-50%) scale(0.98);
|
|
||||||
// opacity: 0.9;
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 底部全选按钮
|
.coding-btn {
|
||||||
.checked-btn {
|
padding: 5rpx 0;
|
||||||
position: fixed;
|
background-color: #409eff;
|
||||||
bottom: 40rpx;
|
border-radius: 6rpx;
|
||||||
left: 70%;
|
text-align: center;
|
||||||
// transform: translateX(-1%);
|
color: #fff;
|
||||||
width: 25%;
|
font-size: 12px;
|
||||||
height: 88rpx;
|
}
|
||||||
background: #fff;
|
}
|
||||||
text-align: center;
|
|
||||||
line-height: 88rpx;
|
// 底部按钮容器
|
||||||
color: #000;
|
.bottom-buttons {
|
||||||
border-radius: 12rpx;
|
position: fixed;
|
||||||
|
bottom: 40rpx;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
gap: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 入库按钮
|
||||||
|
.outbound-btn {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0; // 防止flex项溢出
|
||||||
|
height: 88rpx;
|
||||||
|
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||||
|
text-align: center;
|
||||||
|
line-height: 88rpx;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||||
|
white-space: nowrap;
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 全选按钮
|
||||||
|
.checked-btn {
|
||||||
|
flex: 0 0 180rpx; // 固定宽度
|
||||||
|
height: 88rpx;
|
||||||
|
background: #fff;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #000;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||||
|
padding: 10rpx 0;
|
||||||
|
|
||||||
|
.btn-content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8rpx;
|
||||||
|
line-height: 1.2;
|
||||||
|
|
||||||
|
span {
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
white-space: nowrap;
|
||||||
// transition: all 0.3s ease;
|
}
|
||||||
|
|
||||||
// &:active {
|
|
||||||
// transform: translateX(-50%) scale(0.98);
|
|
||||||
// opacity: 0.9;
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.limit-text {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #ff0000;
|
||||||
|
line-height: 1.2;
|
||||||
|
margin-top: 4rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 加载提示文字
|
// 加载提示文字
|
||||||
.loading-text {
|
.loading-text {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 26rpx;
|
font-size: 26rpx;
|
||||||
color: #8c8c8c;
|
color: #8c8c8c;
|
||||||
padding: 32rpx 0;
|
padding: 32rpx 0;
|
||||||
letter-spacing: 1rpx;
|
letter-spacing: 1rpx;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue