fengyuan_yang
14 hours ago
4 changed files with 590 additions and 18 deletions
-
22src/views/modules/yieldReport/com_produce_report_normal.vue
-
475src/views/modules/yieldReport/com_tid_get_shift.vue
-
9src/views/modules/yieldReport/com_tid_upload_mt_log.vue
-
102src/views/modules/yieldReport/com_tid_upload_order.vue
@ -0,0 +1,475 @@ |
|||
<template> |
|||
<div class="customer-css"> |
|||
<el-dialog |
|||
:title="titleCon" |
|||
v-drag |
|||
width="1200px" |
|||
top="4vh" |
|||
custom-class="machine-workbench-dialog" |
|||
:close-on-click-modal="false" |
|||
v-bind="$attrs" |
|||
v-on="$listeners" |
|||
@closed="handleDialogClosed"> |
|||
<div class="get-shift-layout" :style="{ height: layoutHeight + 'px' }"> |
|||
<div class="shift-panel"> |
|||
<div class="panel-header"> |
|||
<span>{{ queryForm.type === 'MT' ? 'MT班次数据' : '班次数据' }}</span> |
|||
<el-button type="text" size="mini" @click="loadMesShiftData()" :loading="shiftLoading">刷新班次</el-button> |
|||
</div> |
|||
<div class="summary-grid"> |
|||
<div class="summary-item"> |
|||
<div class="summary-label">成功卷数</div> |
|||
<div class="summary-value">{{ getMesFieldValue('rollCountSuccess') }}</div> |
|||
</div> |
|||
<div class="summary-item"> |
|||
<div class="summary-label">失败卷数</div> |
|||
<div class="summary-value">{{ getMesFieldValue('rollCountFail') }}</div> |
|||
</div> |
|||
<div class="summary-item"> |
|||
<div class="summary-label">上传总数</div> |
|||
<div class="summary-value">{{ getMesFieldValue('quantityTotal') }}</div> |
|||
</div> |
|||
<div class="summary-item"> |
|||
<div class="summary-label">良品数</div> |
|||
<div class="summary-value">{{ getMesFieldValue('quantityGood') }}</div> |
|||
</div> |
|||
<div class="summary-item"> |
|||
<div class="summary-label">不良数</div> |
|||
<div class="summary-value">{{ getMesFieldValue('quantityBad') }}</div> |
|||
</div> |
|||
</div> |
|||
<el-table |
|||
:data="mesShiftLogs" |
|||
border |
|||
:height="leftTableHeight" |
|||
v-loading="shiftLoading" |
|||
style="width: 100%; margin-top: 10px;"> |
|||
<el-table-column prop="filename" label="文件名" min-width="180" show-overflow-tooltip></el-table-column> |
|||
<el-table-column label="状态" width="90" align="center"> |
|||
<template slot-scope="scope"> |
|||
<el-tag :type="getLogStatusType(scope.row.status)"> |
|||
{{ Number(scope.row.status) === 1 ? '成功' : '失败' }} |
|||
</el-tag> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="message" label="结果" min-width="140" show-overflow-tooltip></el-table-column> |
|||
</el-table> |
|||
</div> |
|||
|
|||
<div class="query-panel"> |
|||
<div class="panel-card config-card"> |
|||
<div class="panel-header panel-header-card"> |
|||
<span class="panel-title"><i class="el-icon-data-analysis"></i>查询条件</span> |
|||
</div> |
|||
<el-form label-position="top" label-width="90px" class="query-form"> |
|||
<el-row :gutter="10"> |
|||
<el-col :span="12"> |
|||
<el-form-item label="日志类型"> |
|||
<el-select v-model="queryForm.type" style="width: 100%;" @change="handleTypeChange"> |
|||
<el-option label="订单日志" value=""></el-option> |
|||
<el-option label="MT日志" value="MT"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item label="机器账号"> |
|||
<el-input v-model="queryForm.machineNo" readonly></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row :gutter="10"> |
|||
<el-col :span="12"> |
|||
<el-form-item label="班次"> |
|||
<el-input v-model="queryForm.shift" readonly></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="12"> |
|||
<el-form-item label="日期"> |
|||
<el-input v-model="queryForm.date" readonly></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
|
|||
<div class="query-tip-wrap"> |
|||
<div class="query-tip-title">说明</div> |
|||
<div class="query-tip-text">- 日志类型切换后会自动刷新班次数据</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<span slot="footer" class="dialog-footer"> |
|||
<el-button @click="closeDialog" size="small">关闭</el-button> |
|||
</span> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { getMesShiftData, getScheduleDateShift } from '@/api/yieldReport/produce_report_normal.js' |
|||
|
|||
export default { |
|||
data () { |
|||
return { |
|||
titleCon: '获取班次', |
|||
shiftLoading: false, |
|||
pageData: { |
|||
site: '', |
|||
resourceId: '', |
|||
resourceDesc: '', |
|||
shiftNo: '' |
|||
}, |
|||
queryForm: { |
|||
machineNo: '', |
|||
shift: '', |
|||
date: '', |
|||
type: '' |
|||
}, |
|||
mesShiftData: {}, |
|||
mesShiftLogs: [], |
|||
layoutHeight: 560, |
|||
leftTableHeight: 340 |
|||
} |
|||
}, |
|||
mounted () { |
|||
this.updateDialogLayout() |
|||
window.addEventListener('resize', this.updateDialogLayout) |
|||
}, |
|||
beforeDestroy () { |
|||
window.removeEventListener('resize', this.updateDialogLayout) |
|||
}, |
|||
methods: { |
|||
async init (scheduleData) { |
|||
this.pageData = { |
|||
site: scheduleData.site || '', |
|||
resourceId: scheduleData.resourceId || '', |
|||
resourceDesc: scheduleData.resourceDesc || '', |
|||
shiftNo: scheduleData.shiftNo || '' |
|||
} |
|||
|
|||
this.queryForm.machineNo = scheduleData.resourceId || scheduleData.resourceDesc || '' |
|||
this.queryForm.shift = scheduleData.shiftNo || '' |
|||
this.queryForm.date = this.getTodayDateString() |
|||
this.queryForm.type = '' |
|||
this.mesShiftData = {} |
|||
this.mesShiftLogs = [] |
|||
|
|||
this.updateDialogLayout() |
|||
await this.loadCurrentScheduleShift() |
|||
await this.loadMesShiftData(true) |
|||
}, |
|||
|
|||
updateDialogLayout () { |
|||
const viewportHeight = window.innerHeight || 900 |
|||
let nextLayoutHeight = viewportHeight - 230 |
|||
if (nextLayoutHeight > 620) { |
|||
nextLayoutHeight = 620 |
|||
} |
|||
if (nextLayoutHeight < 500) { |
|||
nextLayoutHeight = 500 |
|||
} |
|||
this.layoutHeight = nextLayoutHeight |
|||
|
|||
let nextLeftTableHeight = nextLayoutHeight - 230 |
|||
if (nextLeftTableHeight < 220) { |
|||
nextLeftTableHeight = 220 |
|||
} |
|||
this.leftTableHeight = nextLeftTableHeight |
|||
}, |
|||
|
|||
getCurrentDateTimeString () { |
|||
const now = new Date() |
|||
const year = now.getFullYear() |
|||
const month = this.padZero(now.getMonth() + 1) |
|||
const day = this.padZero(now.getDate()) |
|||
const hour = this.padZero(now.getHours()) |
|||
const minute = this.padZero(now.getMinutes()) |
|||
const second = this.padZero(now.getSeconds()) |
|||
return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second |
|||
}, |
|||
|
|||
getTodayDateString () { |
|||
return this.formatDateValue(new Date()) |
|||
}, |
|||
|
|||
formatDateValue (dateObj) { |
|||
const year = dateObj.getFullYear() |
|||
const month = dateObj.getMonth() + 1 |
|||
const day = dateObj.getDate() |
|||
return year + '-' + this.padZero(month) + '-' + this.padZero(day) |
|||
}, |
|||
|
|||
padZero (value) { |
|||
return value < 10 ? '0' + value : '' + value |
|||
}, |
|||
|
|||
getShiftValueForApi () { |
|||
return this.queryForm.shift ? String(this.queryForm.shift).trim() : '' |
|||
}, |
|||
|
|||
async loadCurrentScheduleShift () { |
|||
if (!this.pageData.site || !this.pageData.resourceId) { |
|||
return |
|||
} |
|||
this.queryForm.date = this.getTodayDateString() |
|||
const params = { |
|||
site: this.pageData.site, |
|||
resourceId: this.pageData.resourceId, |
|||
currentDateTime: this.getCurrentDateTimeString() |
|||
} |
|||
try { |
|||
const { data } = await getScheduleDateShift(params) |
|||
const map = (data && data.map) || {} |
|||
const shiftNo = map.ShiftNo || map.shiftNo || '' |
|||
if (shiftNo) { |
|||
this.queryForm.shift = shiftNo |
|||
} |
|||
} catch (e) { |
|||
this.$message.warning(this.extractErrorMessage(e, '获取当前班次失败')) |
|||
} |
|||
}, |
|||
|
|||
async loadMesShiftData (showWarning = true) { |
|||
if (!this.queryForm.machineNo) { |
|||
this.mesShiftData = {} |
|||
this.mesShiftLogs = [] |
|||
return |
|||
} |
|||
const currentDate = this.getTodayDateString() |
|||
const shiftValue = this.getShiftValueForApi() |
|||
this.queryForm.date = currentDate |
|||
const params = { |
|||
machineNo: this.queryForm.machineNo, |
|||
date: currentDate, |
|||
shift: shiftValue, |
|||
type: this.queryForm.type || '' |
|||
} |
|||
this.shiftLoading = true |
|||
try { |
|||
const { data } = await getMesShiftData(params) |
|||
if (data && data.code === 0) { |
|||
this.mesShiftData = data.row || {} |
|||
this.mesShiftLogs = Array.isArray(this.mesShiftData.logs) ? this.mesShiftData.logs : [] |
|||
} else { |
|||
this.mesShiftData = {} |
|||
this.mesShiftLogs = [] |
|||
if (showWarning) { |
|||
this.$message.warning((data && data.msg) || '获取班次数据失败') |
|||
} |
|||
} |
|||
} catch (e) { |
|||
this.mesShiftData = {} |
|||
this.mesShiftLogs = [] |
|||
if (showWarning) { |
|||
this.$message.error(this.extractErrorMessage(e, '获取班次数据失败')) |
|||
} |
|||
} finally { |
|||
this.shiftLoading = false |
|||
} |
|||
}, |
|||
|
|||
handleTypeChange () { |
|||
this.loadMesShiftData(true) |
|||
}, |
|||
|
|||
getMesFieldValue (fieldName) { |
|||
if (!this.mesShiftData || this.mesShiftData[fieldName] === undefined || this.mesShiftData[fieldName] === null || this.mesShiftData[fieldName] === '') { |
|||
return '-' |
|||
} |
|||
return this.mesShiftData[fieldName] |
|||
}, |
|||
|
|||
getLogStatusType (status) { |
|||
return Number(status) === 1 ? 'success' : 'danger' |
|||
}, |
|||
|
|||
extractErrorMessage (error, defaultMessage) { |
|||
if (error && error.response && error.response.data) { |
|||
const responseData = error.response.data |
|||
if (typeof responseData === 'string') { |
|||
return responseData |
|||
} |
|||
return responseData.msg || responseData.message || defaultMessage |
|||
} |
|||
if (error && error.message) { |
|||
return error.message |
|||
} |
|||
return defaultMessage |
|||
}, |
|||
|
|||
closeDialog () { |
|||
this.$emit('update:visible', false) |
|||
}, |
|||
|
|||
handleDialogClosed () { |
|||
this.mesShiftData = {} |
|||
this.mesShiftLogs = [] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.get-shift-layout { |
|||
display: flex; |
|||
gap: 10px; |
|||
align-items: stretch; |
|||
} |
|||
|
|||
.shift-panel { |
|||
width: 62%; |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.query-panel { |
|||
width: 38%; |
|||
height: 100%; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.panel-card, |
|||
.shift-panel { |
|||
background: #ffffff; |
|||
border: 1px solid #dfe6ee; |
|||
border-radius: 8px; |
|||
padding: 10px; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.panel-header { |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
font-weight: 600; |
|||
color: #2f3b4f; |
|||
} |
|||
|
|||
.panel-title { |
|||
display: inline-flex; |
|||
align-items: center; |
|||
font-size: 15px; |
|||
} |
|||
|
|||
.panel-title i { |
|||
margin-right: 6px; |
|||
color: #18a5a3; |
|||
} |
|||
|
|||
.panel-header-card { |
|||
margin-bottom: 8px; |
|||
padding-bottom: 6px; |
|||
border-bottom: 1px solid #edf1f7; |
|||
} |
|||
|
|||
.shift-panel /deep/ .el-button--text { |
|||
color: #18a5a3; |
|||
font-weight: 500; |
|||
} |
|||
|
|||
.summary-grid { |
|||
display: grid; |
|||
grid-template-columns: repeat(2, minmax(0, 1fr)); |
|||
gap: 8px; |
|||
margin-top: 8px; |
|||
} |
|||
|
|||
.summary-item { |
|||
border: 1px solid #edf2f7; |
|||
border-left: 3px solid #18a5a3; |
|||
border-radius: 6px; |
|||
padding: 8px; |
|||
background: #fcfdff; |
|||
min-height: 54px; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
.summary-label { |
|||
font-size: 12px; |
|||
color: #7c8797; |
|||
} |
|||
|
|||
.summary-value { |
|||
margin-top: 4px; |
|||
font-size: 16px; |
|||
color: #1f2d3d; |
|||
font-weight: 700; |
|||
line-height: 1; |
|||
} |
|||
|
|||
.shift-panel /deep/ .el-table { |
|||
margin-top: 12px; |
|||
} |
|||
|
|||
.query-form { |
|||
margin-bottom: 4px; |
|||
} |
|||
|
|||
.query-tip-wrap { |
|||
margin-top: 8px; |
|||
padding: 10px; |
|||
border: 1px dashed #d5dde8; |
|||
border-radius: 6px; |
|||
background: #fafcfe; |
|||
} |
|||
|
|||
.query-tip-title { |
|||
font-size: 13px; |
|||
font-weight: 600; |
|||
color: #44536a; |
|||
margin-bottom: 6px; |
|||
} |
|||
|
|||
.query-tip-text { |
|||
font-size: 12px; |
|||
color: #66758d; |
|||
line-height: 18px; |
|||
} |
|||
|
|||
.query-panel /deep/ .el-form-item { |
|||
margin-bottom: 6px; |
|||
} |
|||
|
|||
.query-panel /deep/ .el-form-item__label { |
|||
padding-bottom: 2px; |
|||
line-height: 18px; |
|||
color: #627089; |
|||
font-size: 12px; |
|||
} |
|||
|
|||
.shift-panel /deep/ .el-table td { |
|||
padding-top: 8px !important; |
|||
padding-bottom: 8px !important; |
|||
} |
|||
|
|||
.shift-panel /deep/ .el-table .cell { |
|||
height: auto !important; |
|||
line-height: 20px !important; |
|||
} |
|||
|
|||
.shift-panel /deep/ .el-tag { |
|||
height: 20px; |
|||
line-height: 18px; |
|||
display: inline-flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
white-space: nowrap; |
|||
} |
|||
|
|||
@media (max-width: 1280px) { |
|||
.get-shift-layout { |
|||
flex-direction: column; |
|||
height: auto !important; |
|||
} |
|||
|
|||
.shift-panel, |
|||
.query-panel { |
|||
width: 100%; |
|||
height: auto; |
|||
} |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue