<template>
|
<default-header-page-layout ref="page" title="工件信息追溯" >
|
<view class="page-frame with-action-user-row" :style="{height:pageBodyHeight+'px'}" v-if="pageBodyHeight">
|
<action-user-row />
|
<view class="with-action-user-row-page-content">
|
<scan-input-form-item
|
class="forma-item"
|
label="工件ID"
|
v-model="barId"
|
:msg="msg"
|
:msg-type="msgType"
|
@search="onSearchContainter"
|
@clear="onClearContainter"
|
/>
|
<!-- 详情 -->
|
<view>
|
<!-- 基础信息 -->
|
<bar-content v-for="item in list" :title="'工序' + item.workingProcedureCurrent" :content="item" :propArr="detailArr" :key="item.id"></bar-content>
|
</view>
|
</view>
|
</view>
|
<!-- <template v-slot:footer>
|
<view class="bottom-btns-row">
|
<view class="btn-frame left-btn-frame"><u-button text="撤销" @click="onBind"></u-button></view>
|
<view class="btn-frame right-btn-frame"><u-button type="primary" text="确认修改" @click="comfirmUpdate"></u-button></view>
|
</view>
|
</template> -->
|
</default-header-page-layout>
|
</template>
|
|
<script>
|
import DefaultHeaderPageLayout from '@/components/DefaultHeaderPageLayout.vue'
|
import ActionUserRow from '@/components/ActionUserRow.vue'
|
import ScanInputFormItem from '@/components/ScanInputFormItem.vue'
|
import barContent from './modules/barContent.vue'
|
import barStatus from './modules/barStatus.vue'
|
import { getBarRetrospectInfo } from '@/api/retrospect/index.js'
|
import { parseDic, $alert, $successInfo } from '@/static/js/utils/index.js'
|
import moment from 'moment'
|
export default {
|
name:'baseInPage',
|
components:{DefaultHeaderPageLayout,ActionUserRow,ScanInputFormItem,barContent,barStatus},
|
data(){
|
return {
|
pageBodyHeight: 0,
|
initInterVal: null,
|
msg: '',
|
msgType: 'error',
|
barId: '',
|
list: [],
|
detailArr: []
|
}
|
},
|
onLoad() {
|
// this.barDetail = {special: "SAE1041(0.80%~1.10%Mn)",barType: "高碳钢",barSpec: "70号",material: "229-255HBS",status: 1};
|
// this.statusArr = [{code: 1,title: '不合格'},{code: 2,title: '合格'},{code: 3,title: '疑似'}]
|
this.detailArr = [{code: "operationType",title: '操作类型'},{code: "startTime",title: '工序上线时间'},{code: "endTime",title: '工序下线时间'},{code: "timeSceonds",title: '加工时长'},{code: 'qualityStateName',title: '质量状态'}]
|
},
|
methods:{
|
onSearchContainter(barId) {
|
if(barId) {
|
this.barId=barId
|
}
|
if(this.barId == '') {
|
return uni.showModal({
|
title:'工件ID不能为空',
|
showCancel: false
|
})
|
}
|
const param = {WorkPieceID: this.barId}
|
getBarRetrospectInfo(param).then(res => {
|
res.data.workPieceProcessList.map(item => {
|
item.startTime = !Boolean(item.startTime)? item.startTime : moment(item.startTime).format('YYYY-MM-DD HH:mm:ss')
|
item.endTime = !Boolean(item.endTime) ? item.endTime : moment(item.endTime).format('YYYY-MM-DD HH:mm:ss')
|
return item
|
})
|
this.list = res.data.workPieceProcessList
|
})
|
},
|
onClearContainter() {
|
this.barId = ''
|
this.list = []
|
},
|
/* 页面初始化获取页面body高度的定时器 */
|
startInitInterval(callback){
|
this.initInterVal = setInterval(()=>{
|
if (this.pageBodyHeight) {
|
this.clearInitInterval()
|
callback && callback()
|
} else {
|
this.pageBodyHeight = this.$refs.page.getBodyHeight()
|
}
|
},200)
|
},
|
/* 清除定时器 */
|
clearInitInterval(){
|
try{
|
clearInterval(this.initInterVal)
|
this.initInterVal = null
|
}catch(e){
|
//TODO handle the exception
|
}
|
},
|
comfirmUpdate() {
|
|
}
|
},
|
onReady(){
|
this.startInitInterval(()=>{
|
/* 页面初始化后需要执行的代码在这边调用 */
|
})
|
},
|
onUnload(){
|
this.clearInitInterval()
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.bottom-btns-row{
|
display: flex;
|
padding: 10rpx 0;
|
background-color: #fff;
|
.btn-frame{
|
box-sizing: border-box;
|
}
|
.left-btn-frame{
|
width: 30%;
|
padding-left: 20rpx;
|
padding-right: 8rpx;
|
}
|
.right-btn-frame{
|
flex: 1;
|
padding-right: 20rpx;
|
padding-left: 8rpx;
|
}
|
.u-button {
|
border: 2px solid #F08202;
|
}
|
}
|
.forma-item{
|
margin-bottom: 24rpx;
|
}
|
.material-item-group{
|
background-color: $uni-bg-color;
|
padding-top: 10rpx;
|
.material-list-item{
|
border-bottom: 2rpx solid $uni-border-color;
|
padding-bottom: 10rpx;
|
padding-left: 60rpx;
|
margin-bottom: 10rpx;
|
position: relative;
|
&:last-child{
|
border-bottom: 0;
|
}
|
.item-row{
|
display: flex;
|
&>.label{
|
flex-shrink: 0;
|
color: $u-tips-color;
|
width: 144rpx;
|
}
|
&>.content{
|
flex-grow: 1;
|
color: $u-content-color;
|
uni-input{
|
font: inherit;
|
color: $u-primary;
|
text-decoration: underline;
|
}
|
}
|
}
|
.badge-box{
|
position: absolute;
|
top:8rpx;
|
left: 8rpx;
|
z-index: 1;
|
}
|
.close-btn{
|
$closeBtnSize:70rpx;
|
width: $closeBtnSize;
|
height: $closeBtnSize;
|
z-index: 1;
|
position: absolute;
|
top:0rpx;
|
right: 8rpx;
|
background-color: $u-error;
|
opacity: 0.6;
|
border-radius: 25rpx;
|
.icon-layer{
|
position: absolute;
|
width: 100%;
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
z-index: 2;
|
}
|
}
|
}
|
}
|
</style>
|