重构物料管理相关页面的API调用,使用链式Promise处理替代原有嵌套方式 统一添加finally处理隐藏加载状态,确保加载状态正确关闭 移除调试用的console.log语句,保持代码整洁
325 lines
8.6 KiB
Vue
325 lines
8.6 KiB
Vue
<template>
|
|
<view class="container">
|
|
<!-- 筛选查询区域 -->
|
|
<view class="filter-section">
|
|
<uni-forms ref="filterForm" :modelValue="filterData" validateTrigger="bind">
|
|
<view class="form-row">
|
|
<uni-forms-item label="线别选择" label-width="80" name="lineCode" required class="form-item">
|
|
<uni-data-select :localdata="lineOptions" v-model="filterData.lineCode" placeholder="请选择线体" @change="getReceiveList"></uni-data-select>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="选择日期" label-width="80" name="workOrderDate" required class="form-item">
|
|
<uni-datetime-picker type="date" v-model="filterData.workOrderDate" format="yyyy-MM-dd" placeholder="请选择日期"></uni-datetime-picker>
|
|
</uni-forms-item>
|
|
</view>
|
|
<view class="btn-search">
|
|
<button type="primary" @click="getReceiveList">查询</button>
|
|
</view>
|
|
</uni-forms>
|
|
</view>
|
|
|
|
<!-- 清单展示区域 -->
|
|
<view class="list-section">
|
|
<view class="list-header">
|
|
<text>收料清单</text>
|
|
</view>
|
|
<scroll-view scroll-y class="list-container">
|
|
<view v-if="receiveList.length === 0" class="empty-tip">
|
|
暂无收料数据
|
|
</view>
|
|
<view v-for="(item, index) in receiveList" :key="index" class="list-item">
|
|
<view class="item-info">
|
|
<view class="info-row">
|
|
<text class="label">物料名称:</text>
|
|
<text class="value">{{ item.materialName }}</text>
|
|
</view>
|
|
<view class="info-row">
|
|
<text class="label">物料号:</text>
|
|
<text class="value">{{ item.materialCode }}</text>
|
|
</view>
|
|
|
|
|
|
<view class="info-row">
|
|
<text class="label">待收数量:</text>
|
|
<text class="value">{{ item.quantity }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="item-actions">
|
|
<button type="primary" size="mini" @click="receiveMaterial(item)">收料</button>
|
|
<button type="default" size="mini" @click="returnMaterial(item)">退料</button>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { doLineReceiveMaterial,doLineReturnBackMaterial,getLineOptions,queryCallReceiveList } from '@/api/mmcall';
|
|
export default {
|
|
data() {
|
|
return {
|
|
filterData: {
|
|
lineCode: '',
|
|
workOrderDate: new Date()
|
|
},
|
|
lineOptions: [],
|
|
receiveList: []
|
|
};
|
|
},
|
|
onLoad() {
|
|
// 默认选择当前日期
|
|
this.filterData.workOrderDate = new Date();
|
|
// 获取线体数据
|
|
this.getLineOptions();
|
|
},
|
|
methods: {
|
|
// 获取线体数据
|
|
getLineOptions() {
|
|
getLineOptions()
|
|
.then(res => {
|
|
if (res.code === 200 && res.data) {
|
|
// 格式化线体数据为uni-data-select需要的格式
|
|
this.lineOptions = res.data.map(item => ({
|
|
text: item.groupName, // 显示名称
|
|
value: item.groupCode // 实际值
|
|
}));
|
|
} else {
|
|
this.$modal.showToast('获取线体数据失败');
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error('获取线体数据失败', err);
|
|
this.$modal.showToast('获取线体数据失败');
|
|
});
|
|
},
|
|
|
|
// 获取收料清单
|
|
getReceiveList() {
|
|
if (!this.filterData.lineCode) {
|
|
this.$modal.showToast('请先选择线体');
|
|
return;
|
|
}
|
|
|
|
// 准备请求参数
|
|
const params = {
|
|
pageNum: 1,
|
|
pageSize: 100,
|
|
lineCode: this.filterData.lineCode,
|
|
workOrderDate: this.$dayjs(this.filterData.workOrderDate).format('YYYY-MM-DD')
|
|
};
|
|
|
|
// 显示加载中提示
|
|
uni.showLoading({
|
|
title: '加载中...'
|
|
});
|
|
|
|
// 调用API获取收料清单
|
|
queryCallReceiveList(params)
|
|
.then(res => {
|
|
if (res.code === 200 && res.data) {
|
|
this.receiveList = res.data.result;
|
|
//console.log('收料数据:', res.data.result);
|
|
} else {
|
|
this.receiveList = [];
|
|
this.$modal.showToast(res.message || '获取收料数据失败');
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error('获取收料数据失败', err);
|
|
this.receiveList = [];
|
|
this.$modal.showToast('获取收料数据失败');
|
|
})
|
|
.finally(() => {
|
|
uni.hideLoading();
|
|
});
|
|
},
|
|
|
|
// 收料操作
|
|
receiveMaterial(item) {
|
|
if (!item || !item.id) {
|
|
this.$modal.showToast('无效的物料数据');
|
|
return;
|
|
}
|
|
|
|
uni.showModal({
|
|
title: '收料确认',
|
|
content: `确定要收 ${item.materialName} (${item.materialCode}) 吗?`,
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
// 准备收料参数
|
|
const params = {
|
|
id: item.id, // 物料ID
|
|
quantity: item.quantity, // 收料数量
|
|
lineCode: this.filterData.lineCode, // 线体代码
|
|
workOrderDate: this.$dayjs(this.filterData.workOrderDate).format('YYYY-MM-DD') // 日期
|
|
};
|
|
|
|
// 显示加载中提示
|
|
uni.showLoading({
|
|
title: '收料中...'
|
|
});
|
|
|
|
// 调用收料API
|
|
doLineReceiveMaterial(params)
|
|
.then(res => {
|
|
if (res.code === 200) {
|
|
this.$modal.showToast(`成功收料 ${item.quantity} 个 ${item.materialName}`);
|
|
// 刷新收料清单
|
|
this.getReceiveList();
|
|
} else {
|
|
this.$modal.showToast(res.message || '收料失败');
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error('收料失败', err);
|
|
this.$modal.showToast('收料失败');
|
|
})
|
|
.finally(() => {
|
|
uni.hideLoading();
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
// 退料操作
|
|
returnMaterial(item) {
|
|
if (!item || !item.id) {
|
|
this.$modal.showToast('无效的物料数据');
|
|
return;
|
|
}
|
|
|
|
uni.showModal({
|
|
title: '退料确认',
|
|
content: `确定要退 ${item.materialName} (${item.materialCode}) 吗?`,
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
// 准备退料参数
|
|
const params = {
|
|
id: item.id, // 物料ID
|
|
quantity: item.quantity, // 退料数量
|
|
lineCode: this.filterData.lineCode, // 线体代码
|
|
workOrderDate: this.$dayjs(this.filterData.workOrderDate).format('YYYY-MM-DD') // 日期
|
|
};
|
|
|
|
// 显示加载中提示
|
|
uni.showLoading({
|
|
title: '退料中...'
|
|
});
|
|
|
|
// 调用退料API
|
|
doLineReturnBackMaterial(params)
|
|
.then(res => {
|
|
if (res.code === 200) {
|
|
this.$modal.showToast(`成功退料 ${item.quantity} 个 ${item.materialName}`);
|
|
// 刷新收料清单
|
|
this.getReceiveList();
|
|
} else {
|
|
this.$modal.showToast(res.message || '退料失败');
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error('退料失败', err);
|
|
this.$modal.showToast('退料失败');
|
|
})
|
|
.finally(() => {
|
|
uni.hideLoading();
|
|
});
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped>
|
|
.container {
|
|
padding: 20rpx;
|
|
}
|
|
.header {
|
|
text-align: center;
|
|
padding: 20rpx 0;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.title {
|
|
font-size: 36rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.filter-section {
|
|
background-color: #fff;
|
|
border-radius: 16rpx;
|
|
padding: 20rpx;
|
|
margin-bottom: 20rpx;
|
|
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
|
|
}
|
|
.form-row {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20rpx;
|
|
padding: 10rpx 0;
|
|
}
|
|
|
|
.form-item {
|
|
width: 100%;
|
|
}
|
|
|
|
.uni-forms-item__label {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.btn-search {
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.list-section {
|
|
background-color: #fff;
|
|
border-radius: 16rpx;
|
|
padding: 20rpx;
|
|
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
|
|
}
|
|
.list-header {
|
|
padding: 10rpx 0;
|
|
border-bottom: 1rpx solid #eee;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
.list-header text {
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
}
|
|
.list-container {
|
|
height: 500rpx;
|
|
}
|
|
.list-item {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 20rpx 0;
|
|
border-bottom: 1rpx solid #eee;
|
|
}
|
|
.item-info {
|
|
flex: 1;
|
|
}
|
|
.info-row {
|
|
display: flex;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
.label {
|
|
width: 120rpx;
|
|
color: #999;
|
|
}
|
|
.value {
|
|
flex: 1;
|
|
}
|
|
.item-actions {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10rpx;
|
|
}
|
|
.empty-tip {
|
|
text-align: center;
|
|
padding: 40rpx 0;
|
|
color: #999;
|
|
}
|
|
</style> |