Files
klp-mono/apps/hand-factory/pages/easycode/easycode.vue
砂糖 196f55961a feat: 添加扫码成功页面和实际库区选择功能
- 新增扫码成功页面,优化用户体验
- 添加实际库区选择组件和API接口
- 修改合并功能表单,增加实际库区选择
- 更新应用版本号和配置
- 优化首页跳转逻辑和错误处理
2025-11-04 13:07:06 +08:00

279 lines
7.2 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="container">
<!-- 标题区域 -->
<view class="page-title">操作类型选择</view>
<!-- 操作类型按钮区域 -->
<view class="btn-grid">
<button
v-for='item in types'
:key="item.dictValue"
@click="handleScan(item.dictValue)"
class="type-btn"
>
{{ item.dictLabel }}
</button>
</view>
<!-- 退出登录按钮固定在底部 -->
<view class="logout-container">
<button @click='handleLogout' class="logout-btn">
退出登录
</button>
</view>
</view>
</template>
<script>
import { getDicts } from '@/api/system/dict/data.js'
import { getGenerateRecord } from '@/api/wms/code.js'
import { getMaterialCoil } from '@/api/wms/coil.js'
import { addPendingAction } from '@/api/wms/pendingAction.js'
export default {
data() {
return {
types: [],
loading: false
}
},
methods: {
handleLogout() {
this.$modal.confirm('确定注销并退出系统吗?').then(() => {
this.$store.dispatch('LogOut').then(() => {}).finally(() => {
this.$tab.reLaunch('/pages/login')
})
})
},
// 扫码并创建待操作
handleScan(actionType) {
uni.scanCode({
success: async (res) => {
console.log('=== 开始扫码流程 ===');
console.log('扫码结果:', res.result);
console.log('操作类型:', actionType);
uni.showLoading({ title: '处理中...' });
try {
const qrcodeId = res.result;
// 1. 通过二维码ID获取二维码详情
console.log('1. 获取二维码详情ID:', qrcodeId);
const qrcodeRes = await getGenerateRecord(qrcodeId);
console.log('二维码响应:', qrcodeRes);
if (qrcodeRes.code !== 200) {
throw new Error('未找到二维码记录');
}
// 2. 解析二维码的content获取coil_id
const qrcodeRecord = qrcodeRes.data;
console.log('2. 二维码记录:', qrcodeRecord);
// 检查二维码状态0=失效1=有效)
if (qrcodeRecord.status === 0) {
uni.hideLoading();
uni.showModal({
title: '提示',
content: '该二维码已失效,无法创建待操作任务',
showCancel: false
});
return;
}
const content = JSON.parse(qrcodeRecord.content);
console.log('解析后的内容:', content);
// 优先使用current_coil_id当前有效的钢卷ID如果没有则使用coil_id兼容旧数据
let coilId = content.current_coil_id && content.current_coil_id !== 'null' ? content.current_coil_id : null;
if (!coilId) {
coilId = content.coil_id && content.coil_id !== 'null' ? content.coil_id : null;
}
console.log('提取钢卷ID - current_coil_id:', content.current_coil_id, 'coil_id:', content.coil_id, '最终使用:', coilId);
if (!coilId) {
throw new Error('二维码中未包含有效的钢卷ID');
}
// 3. 直接通过钢卷ID获取钢卷详情
console.log('3. 获取钢卷详情钢卷ID:', coilId);
const coilRes = await getMaterialCoil(coilId);
console.log('钢卷详情响应:', coilRes);
if (coilRes.code !== 200) {
throw new Error(coilRes.msg || '查询钢卷信息失败');
}
if (!coilRes.data) {
throw new Error('未找到钢卷信息');
}
const coilData = coilRes.data;
console.log('4. 钢卷数据:', coilData);
// 4. 创建待操作记录
const pendingData = {
coilId: coilData.coilId,
currentCoilNo: coilData.currentCoilNo,
actionType: parseInt(actionType),
actionStatus: 0, // 待处理
sourceType: 'scan', // 扫码来源
scanTime: new Date().toISOString(),
scanDevice: this.getDeviceInfo(),
warehouseId: coilData.warehouseId,
priority: 0, // 默认普通优先级
remark: `移动端扫码创建 - ${this.getActionTypeName(actionType)}`
};
console.log('5. 创建待操作记录,数据:', pendingData);
const addRes = await addPendingAction(pendingData);
console.log('创建待操作响应:', addRes);
if (addRes.code !== 200) {
throw new Error(addRes.msg || '创建待操作失败');
}
uni.hideLoading();
console.log('=== 扫码流程完成 ===');
uni.navigateTo({
url: '/pages/scansuccess/scansuccess'
})
// uni.showToast({
// title: '创建成功',
// icon: 'success',
// duration: 2000
// });
// // 延迟后返回或跳转
// setTimeout(() => {
// // 可以跳转到待操作列表或返回上一页
// uni.navigateBack();
// }, 2000);
} catch (err) {
console.error('=== 扫码处理失败 ===');
console.error('错误信息:', err);
console.error('错误堆栈:', err.stack);
uni.hideLoading();
uni.showToast({
title: err.message || '处理失败',
icon: 'none',
duration: 3000
});
}
},
fail: (err) => {
console.error('扫码失败:', err);
uni.showToast({
title: '扫码失败,请重试',
icon: 'none'
});
}
});
},
// 获取设备信息
getDeviceInfo() {
try {
const systemInfo = uni.getSystemInfoSync();
return `${systemInfo.platform} ${systemInfo.model}`;
} catch (e) {
return 'Unknown Device';
}
},
// 获取操作类型名称
getActionTypeName(actionType) {
const type = this.types.find(t => t.dictValue === String(actionType));
return type ? type.dictLabel : '未知操作';
}
},
mounted() {
getDicts('action_type').then(res => {
this.types = res.data
})
}
}
</script>
<style scoped>
.container {
padding: 20rpx;
min-height: 100vh;
background-color: #f5f7fa;
display: flex;
flex-direction: column;
align-items: center;
}
/* 页面标题 */
.page-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
padding: 20rpx 0;
margin-bottom: 30rpx;
text-align: center;
}
/* 按钮网格布局 */
.btn-grid {
display: grid;
grid-template-columns: 200rpx 200rpx; /* 固定按钮宽度 */
grid-template-rows: repeat(2, 1fr);
gap: 40rpx; /* 按钮间距 */
margin-bottom: 60rpx;
}
/* 操作类型按钮样式 */
.type-btn {
width: 200rpx;
height: 150rpx;
line-height: 150rpx; /* 文字竖直居中 */
font-size: 28rpx;
color: #333;
background-color: #fff;
border-radius: 12rpx;
border: none;
box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.05);
transition: all 0.2s ease;
}
.type-btn:active {
background-color: #f0f0f0;
box-shadow: 0 2rpx 5rpx rgba(0, 0, 0, 0.1);
transform: scale(0.98);
}
/* 退出登录按钮容器 */
.logout-container {
width: 100%;
position: fixed;
bottom: 30rpx;
left: 0;
padding: 0 20rpx;
box-sizing: border-box;
}
/* 退出登录按钮样式 */
.logout-btn {
width: 100%;
height: 90rpx;
line-height: 90rpx; /* 文字竖直居中 */
font-size: 30rpx;
color: #fff;
background-color: #ff4d4f;
border-radius: 16rpx;
border: none;
box-shadow: 0 4rpx 10rpx rgba(255, 77, 79, 0.2);
transition: all 0.2s ease;
}
.logout-btn:active {
background-color: #f5222d;
transform: scale(0.98);
}
</style>