<template>
|
<view class="container">
|
<cu-custom :bgColor="NavBarColor" :isBack="true" backRouterName="productionTask">
|
<block slot="backText">返回</block>
|
<block slot="content">审理</block>
|
</cu-custom>
|
|
<!-- 骨架屏 -->
|
<view v-if="loading" class="skeleton-container">
|
<view class="skeleton-group">
|
<view class="skeleton-divider"></view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-input"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-input"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-input"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-input"></view>
|
</view>
|
</view>
|
|
<view class="skeleton-group">
|
<view class="skeleton-divider"></view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-input"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-select"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-select"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-input"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-select"></view>
|
</view>
|
<view class="skeleton-item">
|
<view class="skeleton-label"></view>
|
<view class="skeleton-datetime"></view>
|
</view>
|
</view>
|
|
<view class="skeleton-button"></view>
|
</view>
|
|
<!-- 实际内容 -->
|
<view v-else class="container">
|
<uni-forms ref="form" :modelValue="formData" :rules="rules" validate-trigger="bind"
|
err-show-type="undertext">
|
<uni-group top="1">
|
<view class="divider"><text>工单信息</text></view>
|
<uni-forms-item :label-width="100" name="workOrderNumber" label="审理单据号:">
|
<uni-easyinput v-model="formData.workOrderNumber" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="materialCode" label="生产工单:">
|
<uni-easyinput v-model="formData.materialCode" :disabled="true" />
|
</uni-forms-item>
|
|
<uni-forms-item :label-width="100" name="materialDescription" label="检验单:">
|
<uni-easyinput v-model="formData.materialDescription" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="物料信息:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="机台:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="检验类型:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="缺陷类型:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="工序:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="计划数量:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="检验数量:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="不合格数量:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="检验人:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="100" name="plannedQuantity" label="检验时间:">
|
<uni-easyinput v-model="formData.plannedQuantity" :disabled="true" />
|
</uni-forms-item>
|
<view class="divider"><text>不合格品审理</text></view>
|
|
<uni-forms-item :label-width="140" required name="inspectionOrderNumber" label="审理数量:">
|
<uni-easyinput v-model="formData.inspectionOrderNumber" placeholder="系统生成" :disabled="true" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="140" required name="process" label="审理结果">
|
<uni-data-select v-model="formData.process" :localdata="SpareList" @change="changeisSpareList"
|
placeholder="请选择" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="140" required name="inspectionType" label="审理原因">
|
<uni-data-select v-model="formData.inspectionType" :localdata="SpareList"
|
@change="changeisSpareList" placeholder="请选择" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="140" required name="inspectionQuantity" label="解决措施:">
|
<uni-easyinput type="textarea" v-model="formData.inspectionQuantity" placeholder="请输入" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="140" required name="inspectionPlan" label="一级审理人">
|
<uni-data-select v-model="formData.inspectionPlan" :localdata="SpareList"
|
@change="changeisSpareList" placeholder="请选择" />
|
</uni-forms-item>
|
<uni-forms-item :label-width="140" required name="inspectionTime" label="审理时间">
|
<uni-datetime-picker type="datetime" v-model="formData.inspectionTime" />
|
</uni-forms-item>
|
</uni-group>
|
</uni-forms>
|
|
<view class="padding flex flex-direction">
|
<view class="flex-sub bg-blue padding-sm margin-xl radius text-sm text-center text-white"
|
@click.stop="ProductionTask()" hover-class="is-hover">确定</view>
|
</view>
|
</view>
|
|
<pdaScanVue></pdaScanVue>
|
</view>
|
</template>
|
|
<script>
|
import pdaScanVue from "@/components/mes/pdaScan.vue";
|
|
export default {
|
components: {
|
pdaScanVue
|
},
|
data() {
|
return {
|
loading: true,
|
isShow: false,
|
isSubmitting: false, // 防重复提交
|
SpareList: [{
|
text: "是",
|
value: 1
|
},
|
{
|
text: "否",
|
value: 0
|
}
|
],
|
scrollLeft: 0,
|
formData: {
|
workOrderNumber: '1111111',
|
materialCode: '120008194',
|
materialDescription: '三代轮毂轴承单元\\G3-487',
|
plannedQuantity: '200',
|
inspectionOrderNumber: '88888',
|
process: '',
|
inspectionType: '',
|
inspectionQuantity: '',
|
inspectionPlan: '',
|
inspectionTime: ''
|
},
|
// 表单验证规则
|
rules: {
|
process: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择工序'
|
}]
|
},
|
inspectionType: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择检验类型'
|
}]
|
},
|
inspectionPlan: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择检验方案'
|
}]
|
},
|
inspectionTime: {
|
rules: [{
|
required: true,
|
errorMessage: '请选择检验时间'
|
}]
|
},
|
inspectionQuantity: {
|
rules: [{
|
required: true,
|
errorMessage: '请输入送检数量'
|
}, {
|
format: 'number',
|
errorMessage: '送检数量必须为数字'
|
}]
|
}
|
},
|
NavBarColor: this.NavBarColor,
|
url: {
|
upload: "/eam/sysFiles/batch_upload",
|
stallList: "/eam/eamRepairOrder/queryById",
|
getEquipmentList: 'eam/equipment/list',
|
approval: '/eam/eamRepairOrder/perform'
|
},
|
styles: {
|
color: '#2979FF',
|
borderColor: '#2979FF'
|
},
|
msg1Count: 0
|
}
|
},
|
computed: {
|
top() {
|
return this.CustomBar * 2 + 160
|
},
|
style() {
|
var StatusBar = this.StatusBar;
|
var CustomBar = this.CustomBar;
|
var style = `height:${CustomBar}px;padding-top:${StatusBar}px;`;
|
return style
|
},
|
},
|
created() {
|
// 模拟数据加载
|
setTimeout(() => {
|
this.loading = false;
|
}, 1000);
|
},
|
methods: {
|
changeisSpareList(e) {
|
this.formData.isSpare = e;
|
|
},
|
|
async ProductionTask() {
|
// 防止重复提交
|
if (this.isSubmitting) {
|
uni.showToast({
|
icon: "none",
|
title: "正在提交中，请勿重复点击",
|
duration: 2000
|
});
|
return;
|
}
|
|
uni.showLoading({
|
mask: true,
|
title: "提交中..."
|
});
|
|
try {
|
// 使用 uni-forms 进行表单验证
|
await this.$refs.form.validate();
|
|
this.isSubmitting = true;
|
|
// 发送请求
|
const response = await this.$http.post(this.url.approval, {
|
workOrderNumber: this.formData.workOrderNumber,
|
materialCode: this.formData.materialCode,
|
materialDescription: this.formData.materialDescription,
|
plannedQuantity: this.formData.plannedQuantity,
|
inspectionOrderNumber: this.formData.inspectionOrderNumber,
|
process: this.formData.process,
|
inspectionType: this.formData.inspectionType,
|
inspectionQuantity: this.formData.inspectionQuantity,
|
inspectionPlan: this.formData.inspectionPlan,
|
inspectionTime: this.formData.inspectionTime
|
});
|
|
if (response.data.success) {
|
uni.showToast({
|
icon: "success",
|
title: '提交成功',
|
duration: 2000
|
});
|
|
// 延迟跳转
|
await new Promise(resolve => setTimeout(resolve, 2000));
|
|
this.$Router.replaceAll({
|
name: 'qualityInspection'
|
});
|
} else {
|
uni.showModal({
|
title: "提交失败",
|
content: response.data.message || "服务器处理失败，请稍后重试",
|
confirmText: '确定',
|
showCancel: false,
|
icon: "none"
|
});
|
}
|
} catch (error) {
|
// 表单验证失败或其他错误
|
if (error.errMsg) {
|
// 这是 uni-forms 的验证错误
|
uni.showToast({
|
icon: "none",
|
title: error,
|
duration: 2000
|
});
|
} else {
|
// 网络或其他错误
|
console.error("请求失败:", error);
|
|
let errorMessage = "网络请求失败";
|
if (error.errMsg) {
|
if (error.errMsg.includes("timeout")) {
|
errorMessage = "请求超时，请检查网络连接";
|
} else if (error.errMsg.includes("fail")) {
|
errorMessage = "网络连接失败，请检查网络设置";
|
}
|
}
|
|
uni.showToast({
|
icon: "none",
|
title: errorMessage,
|
duration: 3000
|
});
|
}
|
} finally {
|
this.isSubmitting = false;
|
uni.hideLoading();
|
}
|
},
|
},
|
}
|
</script>
|
|
<style>
|
.is-hover {
|
color: rgba(255, 255, 255, 0.6);
|
background-color: #55aaff;
|
border-color: #55aaff;
|
}
|
|
.divider {
|
display: flex;
|
font-weight: bold;
|
align-items: center;
|
text-align: center;
|
color: #1E90FF;
|
font-size: 24rpx;
|
margin: 20px 0;
|
}
|
|
.divider::before,
|
.divider::after {
|
content: '';
|
flex: 1;
|
border-bottom: 1px solid gray;
|
margin: 0 16px;
|
}
|
|
.divider text {
|
white-space: nowrap;
|
}
|
|
.content {
|
margin-top: 5px;
|
}
|
|
.content scroll-view {
|
scrollIndicator: "none"
|
}
|
|
.popupView {
|
margin-top: 45px;
|
height: auto;
|
}
|
|
/* 骨架屏样式 */
|
.skeleton-container {
|
padding: 20rpx;
|
}
|
|
.skeleton-group {
|
margin-bottom: 40rpx;
|
}
|
|
.skeleton-divider {
|
height: 40rpx;
|
width: 300rpx;
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
background-size: 400% 100%;
|
border-radius: 4rpx;
|
animation: skeleton-loading 1.4s ease infinite;
|
margin-bottom: 30rpx;
|
}
|
|
.skeleton-item {
|
display: flex;
|
align-items: center;
|
margin-bottom: 30rpx;
|
}
|
|
.skeleton-label {
|
width: 160rpx;
|
height: 40rpx;
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
background-size: 400% 100%;
|
border-radius: 4rpx;
|
animation: skeleton-loading 1.4s ease infinite;
|
margin-right: 20rpx;
|
}
|
|
.skeleton-input {
|
flex: 1;
|
height: 60rpx;
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
background-size: 400% 100%;
|
border-radius: 8rpx;
|
animation: skeleton-loading 1.4s ease infinite;
|
}
|
|
.skeleton-select {
|
flex: 1;
|
height: 60rpx;
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
background-size: 400% 100%;
|
border-radius: 8rpx;
|
animation: skeleton-loading 1.4s ease infinite;
|
}
|
|
.skeleton-datetime {
|
flex: 1;
|
height: 60rpx;
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
background-size: 400% 100%;
|
border-radius: 8rpx;
|
animation: skeleton-loading 1.4s ease infinite;
|
}
|
|
.skeleton-button {
|
width: 90%;
|
height: 80rpx;
|
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
|
background-size: 400% 100%;
|
border-radius: 10rpx;
|
animation: skeleton-loading 1.4s ease infinite;
|
margin: 40rpx auto;
|
}
|
|
@keyframes skeleton-loading {
|
0% {
|
background-position: 100% 50%;
|
}
|
|
100% {
|
background-position: 0 50%;
|
}
|
}
|
</style>
|
