<template>
|
<view class="container">
|
<cu-custom :bgColor="NavBarColor" :isBack="true" backRouterName="productionTask">
|
<block slot="backText">返回</block>
|
<block slot="content">齐套检查</block>
|
|
</cu-custom>
|
|
|
<view class="container">
|
|
|
<!-- 列表信息开始 -->
|
<view class="content" style="margin: 10px;">
|
<view class="check-list-container">
|
<view class="list-item" v-for="(item, index) in msgList" :key="index">
|
<!-- 部件信息 -->
|
<view class="item-header">
|
<text class="part-code">{{ item.materialNumber }}</text>
|
<text class="warehouse-tag">{{ item.materialName }}</text>
|
</view>
|
|
<!-- 详细信息 -->
|
<view class="item-details">
|
<view class="detail-row">
|
<text class="label">需求数量:</text>
|
<view class="value editable">
|
|
|
<text>{{ item.requiredQuantity}}</text>
|
|
</view>
|
</view>
|
|
<view class="detail-row">
|
<text class="label">实际数量:</text>
|
<view class="value editable">
|
<text>{{ item.actualQuantity}}</text>
|
|
|
</view>
|
</view>
|
|
<view class="detail-row">
|
<text class="label">基本单位:</text>
|
<text class="value">{{ item.productionUnit }}</text>
|
</view>
|
|
<view class="detail-row">
|
<text class="label">是否齐备:</text>
|
<text class="value" :class="{'warning-text': item.checkFlag === '0'}">否</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="action-bar">
|
<button class="operation-btn" @click="handleLock">锁定</button>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
scrollLeft: 0,
|
formData: {
|
num: '',
|
type: ''
|
},
|
NavBarColor: this.NavBarColor,
|
activeColor: '#5277A6',
|
url: {
|
stallList: "/mes/mesProductionWorkOrder/workOrderCompletenessCheck",
|
addBatch: '/mes/mesKittingCompletenessCheck/addBatch'
|
},
|
|
upOption: {
|
page: {
|
num: 0, // 当前页码,默认0,回调之前会加1,即callback(page)会从1开始
|
size: 10 // 每页数据的数量
|
},
|
noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
|
empty: {
|
tip: '~ 暂无数据 ~', // 提示
|
},
|
loading: '',
|
text: '全部',
|
isShowNoMore: false,
|
textNoMore: '我是有底线的 >_<'
|
},
|
styles: {
|
color: '#2979FF',
|
borderColor: '#2979FF'
|
},
|
typeList: [],
|
msgList: [], //列表数据
|
announcement1: [],
|
msg1Count: 0,
|
msg2Count: 0,
|
msg1Title: "",
|
workOrderId: ''
|
}
|
},
|
computed: {
|
top() {
|
return this.CustomBar * 2 + 50
|
},
|
style() {
|
var StatusBar = this.StatusBar;
|
var CustomBar = this.CustomBar;
|
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
|
return style
|
},
|
},
|
|
|
onShow() {
|
if (this.mescroll) {
|
this.mescroll.resetUpScroll()
|
}
|
},
|
onLoad(options) {
|
// options 中包含跳转时携带的所有参数
|
if (options.id) {
|
this.workOrderId = options.id;
|
console.log('接收的工单id:', this.workOrderId);
|
|
// 可在此处调用接口,根据id获取工单详情
|
this.upCallback(this.workOrderId);
|
}
|
},
|
created() {
|
|
},
|
methods: {
|
|
|
upCallback() {
|
this.$http.get(this.url.stallList, {
|
params: {
|
id: this.workOrderId
|
},
|
|
}).then(res => {
|
console.log("url", res)
|
//设置列表数据
|
if (res.data.success) {
|
this.msgList = res.data.result
|
}
|
}).catch(() => {
|
//联网失败, 结束加载
|
|
})
|
|
},
|
|
|
|
/**
|
* 锁定
|
*/
|
handleLock() {
|
|
|
// 遍历 msgList 并为每个 item 的 workOrderId 设置为 currentRecordId
|
this.msgList.forEach(item => {
|
item.workOrderId = this.workOrderId;
|
});
|
|
this.$http.post(this.url.addBatch, this.msgList).then(res => {
|
console.log("url", res)
|
// 设置列表数据
|
if (res.data.success) {
|
uni.showToast({
|
icon: "success",
|
title: res.data.message,
|
duration: 2000
|
});
|
uni.navigateBack({
|
delta: 1
|
})
|
} else {
|
// 即使服务器返回成功响应,但业务逻辑失败也要处理
|
uni.showToast({
|
icon: "none",
|
title: res.data.message || "操作失败",
|
duration: 2000
|
});
|
}
|
}).catch(err => {
|
// 联网失败, 结束加载
|
uni.showToast({
|
icon: "exception",
|
title: "网络请求失败",
|
duration: 2000
|
});
|
console.error("网络请求错误:", err);
|
})
|
},
|
|
|
},
|
|
}
|
</script>
|
|
<style>
|
/* 列表容器样式 */
|
.check-list-container {
|
margin-bottom: 120rpx;
|
/* 为底部操作栏留出空间 */
|
}
|
|
/* 列表项样式 */
|
.list-item {
|
background-color: #fff;
|
border-radius: 16rpx;
|
padding: 20rpx;
|
margin-bottom: 20rpx;
|
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
|
}
|
|
/* 项头部样式 */
|
.item-header {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 20rpx;
|
padding-bottom: 15rpx;
|
border-bottom: 1rpx solid #eee;
|
}
|
|
.part-code {
|
font-size: 32rpx;
|
font-weight: bold;
|
color: #333;
|
}
|
|
.warehouse-tag {
|
font-size: 24rpx;
|
color: #007AFF;
|
background-color: #e8f4ff;
|
padding: 6rpx 12rpx;
|
border-radius: 8rpx;
|
}
|
|
/* 详细信息样式 */
|
.item-details {
|
margin-bottom: 20rpx;
|
}
|
|
.detail-row {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 15rpx;
|
}
|
|
.detail-row:last-child {
|
margin-bottom: 0;
|
}
|
|
.label {
|
font-size: 28rpx;
|
color: #666;
|
flex: 1;
|
}
|
|
.value {
|
font-size: 28rpx;
|
color: #333;
|
flex: 1;
|
text-align: right;
|
}
|
|
.warning-text {
|
color: #ff6347;
|
font-weight: bold;
|
}
|
|
/* 可编辑样式 */
|
.editable {
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
}
|
|
.edit-input {
|
border: 1rpx solid #007AFF;
|
border-radius: 8rpx;
|
padding: 10rpx;
|
width: 120rpx;
|
text-align: right;
|
font-size: 28rpx;
|
}
|
|
.edit-icon {
|
margin-left: 10rpx;
|
color: #007AFF;
|
font-size: 24rpx;
|
}
|
|
/* 操作按钮样式 */
|
.item-actions {
|
display: flex;
|
justify-content: flex-end;
|
gap: 20rpx;
|
}
|
|
.action-btn {
|
padding: 12rpx 24rpx;
|
font-size: 13rpx;
|
border-radius: 8rpx;
|
border: none;
|
min-width: 60rpx;
|
}
|
|
.edit-btn {
|
background-color: #007AFF;
|
color: #fff;
|
}
|
|
.delete-btn {
|
background-color: #ff6347;
|
color: #fff;
|
}
|
|
/* 底部操作栏样式 */
|
.action-bar {
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
background-color: #fff;
|
padding: 20rpx;
|
display: flex;
|
justify-content: space-around;
|
box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
|
z-index: 999;
|
}
|
|
.operation-btn {
|
padding: 20rpx 40rpx;
|
font-size: 22rpx;
|
border-radius: 12rpx;
|
background-color: #007AFF;
|
color: #fff;
|
border: none;
|
flex: 1;
|
margin: 0 10rpx;
|
}
|
</style>
|