114 lines
3.0 KiB
Vue
114 lines
3.0 KiB
Vue
<template>
|
|
<el-descriptions
|
|
:column="column"
|
|
:border="border"
|
|
size="small"
|
|
:title="title"
|
|
>
|
|
<template slot="extra">
|
|
<slot name="extra"></slot>
|
|
</template>
|
|
<el-descriptions-item
|
|
v-for="(item, index) in filteredFields"
|
|
:key="index"
|
|
:label="item.label"
|
|
:span="item.span || 1"
|
|
>
|
|
<template>
|
|
{{ item.value || '-' }}
|
|
</template>
|
|
</el-descriptions-item>
|
|
</el-descriptions>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'CoilInfo',
|
|
props: {
|
|
coilInfo: {
|
|
type: Object,
|
|
default: () => ({})
|
|
},
|
|
column: {
|
|
type: Number,
|
|
default: 5
|
|
},
|
|
border: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
// 只显示有值的字段
|
|
showOnlyValue: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
title: {
|
|
type: String,
|
|
}
|
|
},
|
|
computed: {
|
|
fields() {
|
|
return [
|
|
{ label: '入场卷号', key: 'enterCoilNo' },
|
|
{ label: '当前卷号', key: 'currentCoilNo' },
|
|
{ label: '厂家原料号', key: 'supplierCoilNo' },
|
|
{ label: '逻辑库位', key: 'warehouseName' },
|
|
{ label: '实际库区', key: 'actualWarehouseName' },
|
|
{ label: '班组', key: 'team' },
|
|
{ label: '材料类型', key: 'materialType' },
|
|
{ label: '物料名', key: 'itemName' },
|
|
{ label: '规格', key: 'specification' },
|
|
{ label: '材质', key: 'material' },
|
|
{ label: '厂家', key: 'manufacturer' },
|
|
{ label: '镀层质量', key: 'zincLayer' },
|
|
{ label: '表面处理', key: 'surfaceTreatmentDesc' },
|
|
{ label: '质量状态', key: 'qualityStatus' },
|
|
{ label: '切边要求', key: 'trimmingRequirement' },
|
|
{ label: '原料材质', key: 'packingStatus' },
|
|
{ label: '包装要求', key: 'packagingRequirement' },
|
|
{ label: '实测厚度[mm]', key: 'actualThickness' },
|
|
{ label: '实测宽度[mm]', key: 'actualWidth' },
|
|
{ label: '长度[m]', key: 'length' },
|
|
{ label: '毛重[t]', key: 'grossWeight' },
|
|
{ label: '净重[t]', key: 'netWeight' },
|
|
{ label: '生产开始', key: 'productionStartTime' },
|
|
{ label: '生产结束', key: 'productionEndTime' },
|
|
{ label: '调制度', key: 'temperGrade' },
|
|
{ label: '镀层种类', key: 'coatingType' },
|
|
{ label: '钢卷表面处理', key: 'coilSurfaceTreatment' },
|
|
{ label: '备注', key: 'remark', span: this.column > 2 ? this.column - 2 : 1 }
|
|
]
|
|
},
|
|
filteredFields() {
|
|
let fields = this.fields.map(item => ({
|
|
...item,
|
|
value: this.coilInfo[item.key]
|
|
}))
|
|
|
|
if (this.showOnlyValue) {
|
|
fields = fields.filter(item => item.value !== undefined && item.value !== null && item.value !== '')
|
|
}
|
|
|
|
return fields
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.status-success {
|
|
color: #67c23a;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.status-danger {
|
|
color: #f56c6c;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.status-warning {
|
|
color: #e6a23c;
|
|
font-weight: 500;
|
|
}
|
|
</style>
|