update table 等级
This commit is contained in:
parent
073478f34f
commit
25e5150e35
@ -12,8 +12,13 @@
|
||||
>
|
||||
<el-table-column label="设备名称" prop="eqName" align="center" />
|
||||
<el-table-column label="所属产线" prop="pl" align="center" />
|
||||
<el-table-column label="提示等级" prop="warningLevel" align="center" />
|
||||
<el-table-column label="提示等级" prop="checkContent" align="center" />
|
||||
<el-table-column label="提示等级" prop="warningLevel" align="center">
|
||||
<template slot-scope="scope">
|
||||
<!-- <component :is="PriorityComponent"></component> -->
|
||||
<PriorityComponent :injectData="scope.row"></PriorityComponent>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="巡检内容" prop="checkContent" align="center" />
|
||||
</el-table>
|
||||
</div>
|
||||
<!-- <div class="el-table-wrapper">
|
||||
@ -35,36 +40,70 @@
|
||||
<script>
|
||||
// import TechyFakeTable from './TechyFakeTable.vue'
|
||||
// import TechyTable from './TechyTable.vue'
|
||||
const PriorityComponent = {
|
||||
name: 'PriorityComponent',
|
||||
props: {
|
||||
injectData: Object
|
||||
},
|
||||
computed: {
|
||||
bgColor() {
|
||||
const colors = ['#9c4048', '#ffbd43', '#0b58ff', '#90dd48', '#449028', '#091238']
|
||||
return colors[this.injectData.priority - 1]
|
||||
},
|
||||
priorityText() {
|
||||
return ['一级', '二级', '三级', '四级', '五级'][this.injectData.priority - 1]
|
||||
}
|
||||
},
|
||||
methods: {},
|
||||
render: function(h) {
|
||||
return h(
|
||||
'span',
|
||||
{
|
||||
style: {
|
||||
display: 'inline-block',
|
||||
borderRadius: '2px',
|
||||
padding: '2px 6px',
|
||||
color: '#fff',
|
||||
opacity: '0.6',
|
||||
fontSize: '12px',
|
||||
lineHeight: 1,
|
||||
backgroundColor: this.bgColor
|
||||
}
|
||||
},
|
||||
this.priorityText
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const tableProps = [
|
||||
{ prop: 'eqName', label: '设备名称', width: 120, resizable: false },
|
||||
{ prop: 'pl', label: '所属产线', width: 120, resizable: false },
|
||||
{ prop: 'warningLevel', label: '提示等级', width: 120, resizable: false },
|
||||
{ prop: 'checkContent', label: '提示等级', width: 120, resizable: false }
|
||||
]
|
||||
// const tableProps = [
|
||||
// { prop: 'eqName', label: '设备名称', width: 120, resizable: false },
|
||||
// { prop: 'pl', label: '所属产线', width: 120, resizable: false },
|
||||
// { prop: 'warningLevel', label: '提示等级', width: 120, resizable: false },
|
||||
// { prop: 'checkContent', label: '提示等级', width: 120, resizable: false }
|
||||
// ]
|
||||
const tableData = [
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: '设备B', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' }
|
||||
// { eqName: '下片机', pl: '产线3', warningLevel: 3, checkContent: '巡检内容' },
|
||||
// { eqName: '磨片机', pl: '产线2', warningLevel: 2, checkContent: '巡检内容' }
|
||||
]
|
||||
const tableData2 = [
|
||||
{ eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
{ eqName: '设备B', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' }
|
||||
{ eqName: 'A下片机', pl: '产线1', priority: 1, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', priority: 2, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', priority: 3, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', priority: 4, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', priority: 4, checkContent: '巡检内容' },
|
||||
{ eqName: 'A下片机', pl: '产线1', priority: 3, checkContent: '巡检内容' },
|
||||
{ eqName: '设备B', pl: '产线1', priority: 2, checkContent: '巡检内容' }
|
||||
// { eqName: '下片机', pl: '产线3', warningLevel: 3, checkContent: '巡检内容' },
|
||||
// { eqName: '磨片机', pl: '产线2', warningLevel: 2, checkContent: '巡检内容' }
|
||||
]
|
||||
// const tableData2 = [
|
||||
// { eqName: 'A下片机', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' },
|
||||
// { eqName: '设备B', pl: '产线1', warningLevel: 1, checkContent: '巡检内容' }
|
||||
// { eqName: '下片机', pl: '产线3', warningLevel: 3, checkContent: '巡检内容' },
|
||||
// { eqName: '磨片机', pl: '产线2', warningLevel: 2, checkContent: '巡检内容' }
|
||||
// ]
|
||||
|
||||
export default {
|
||||
name: 'LeftContentEquipmentCheck',
|
||||
components: {},
|
||||
components: { PriorityComponent },
|
||||
data() {
|
||||
return { tableProps, tableData, tableData2 }
|
||||
return { tableData }
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
|
@ -7,9 +7,26 @@
|
||||
:data="tableData"
|
||||
:header-cell-style="{ background: 'rgba(79,114,136,0.29)' }"
|
||||
>
|
||||
<el-table-column label="设备名称" prop="eqName" :show-overflow-tooltip="true" :resizable="true" align="center" />
|
||||
<el-table-column label="所属产线" prop="plName" :show-overflow-tooltip="true" :resizable="true" align="center" />
|
||||
<el-table-column label="故障等级" prop="level" :resizable="true" align="center" />
|
||||
<el-table-column
|
||||
label="设备名称"
|
||||
prop="eqName"
|
||||
:show-overflow-tooltip="true"
|
||||
:resizable="true"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column
|
||||
label="所属产线"
|
||||
prop="plName"
|
||||
:show-overflow-tooltip="true"
|
||||
:resizable="true"
|
||||
align="center"
|
||||
/>
|
||||
<el-table-column label="故障等级" prop="priority" :resizable="true" align="center">
|
||||
<template slot-scope="scope">
|
||||
<!-- <component :is="PriorityComponent"></component> -->
|
||||
<PriorityComponent :injectData="scope.row"></PriorityComponent>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="故障内容" prop="content" :resizable="true" align="center" />
|
||||
<el-table-column label="累计时间(min)" prop="duration" :resizable="true" align="center" :width="128" />
|
||||
</el-table>
|
||||
@ -20,18 +37,52 @@
|
||||
<script>
|
||||
// import TechyFakeTable from './TechyFakeTable.vue'
|
||||
// import TechyTable from './TechyTable.vue'
|
||||
const PriorityComponent = {
|
||||
name: 'PriorityComponent',
|
||||
props: {
|
||||
injectData: Object
|
||||
},
|
||||
computed: {
|
||||
bgColor() {
|
||||
const colors = ['#9c4048', '#ffbd43', '#0b58ff', '#90dd48', '#449028', '#091238']
|
||||
return colors[this.injectData.priority - 1]
|
||||
},
|
||||
priorityText() {
|
||||
return ['一级', '二级', '三级', '四级', '五级'][this.injectData.priority - 1]
|
||||
}
|
||||
},
|
||||
methods: {},
|
||||
render: function(h) {
|
||||
return h(
|
||||
'span',
|
||||
{
|
||||
style: {
|
||||
display: 'inline-block',
|
||||
borderRadius: '2px',
|
||||
padding: '2px 6px',
|
||||
color: '#fff',
|
||||
opacity: '0.6',
|
||||
fontSize: '12px',
|
||||
lineHeight: 1,
|
||||
backgroundColor: this.bgColor
|
||||
}
|
||||
},
|
||||
this.priorityText
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const tableData = [
|
||||
{ eqName: 'A1下片机', plName: 'A', content: '123456', level: 3, duration: 10 },
|
||||
{ eqName: '磨片机', plName: 'A', content: '123456', level: 2, duration: 20 },
|
||||
{ eqName: 'B2钢化', plName: 'B', content: 'JQKA', level: 1, duration: 30 },
|
||||
{ eqName: '上片机', plName: 'C', content: 'xxx', level: 3, duration: 1 },
|
||||
{ eqName: '清洗机', plName: 'B', content: 'wowowowo', level: 2, duration: 2 }
|
||||
{ eqName: 'A1下片机', plName: 'A', content: '123456', priority: 3, duration: 10 },
|
||||
{ eqName: '磨片机', plName: 'A', content: '123456', priority: 2, duration: 20 },
|
||||
{ eqName: 'B2钢化', plName: 'B', content: 'JQKA', priority: 1, duration: 30 },
|
||||
{ eqName: '上片机', plName: 'C', content: 'xxx', priority: 3, duration: 1 },
|
||||
{ eqName: '清洗机', plName: 'B', content: 'wowowowo', priority: 2, duration: 2 }
|
||||
]
|
||||
|
||||
export default {
|
||||
name: 'RightContentAlert',
|
||||
components: {},
|
||||
components: { PriorityComponent },
|
||||
data() {
|
||||
return { tableData }
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user