车间看板
This commit is contained in:
DESKTOP-H2PAFLR\Administrator
35
ZR.Vue/src/views/kanbanManagement/jihe.vue
Normal file
35
ZR.Vue/src/views/kanbanManagement/jihe.vue
Normal file
@@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<div class="rectangle"><span>W0234</span></div>
|
||||
<div class="rectangle"><span> 8</span></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="rectangle"><span>W0234</span></div>
|
||||
<div class="rectangle"><span> 8</span></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="rectangle"><span>W0234</span></div>
|
||||
<div class="rectangle"><span> 8</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'jihe',
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rectangle {
|
||||
width: 100px; /*长方形的宽度*/
|
||||
height: 20px; /*长方形的高度*/
|
||||
background-color: greenyellow; /*长方形的背景颜色*/
|
||||
border: 1px solid black;
|
||||
display: inline-block;
|
||||
}
|
||||
span {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
32
ZR.Vue/src/views/kanbanManagement/jihe1.vue
Normal file
32
ZR.Vue/src/views/kanbanManagement/jihe1.vue
Normal file
@@ -0,0 +1,32 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<div class="rectangle"><span>-</span></div>
|
||||
<div class="rectangle"><span> -</span></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="rectangle"><span>-</span></div>
|
||||
<div class="rectangle"><span>-</span></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="rectangle"><span>-</span></div>
|
||||
<div class="rectangle"><span>-</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'jihe1',
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rectangle {
|
||||
width: 100px; /*长方形的宽度*/
|
||||
height: 20px; /*长方形的高度*/
|
||||
background-color: rgb(167, 172, 159); /*长方形的背景颜色*/
|
||||
border: 1px solid black;
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
205
ZR.Vue/src/views/kanbanManagement/tuzhuangcanku.vue
Normal file
205
ZR.Vue/src/views/kanbanManagement/tuzhuangcanku.vue
Normal file
@@ -0,0 +1,205 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<h1>涂装车间物料实时看板</h1>
|
||||
|
||||
<el-row :gutter="10" style="margin-left: 120px">
|
||||
<el-col :span="4">
|
||||
<div class="producting"><h2>1</h2></div>
|
||||
<jihe style="margin: 0 auto"></jihe>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<div class="producting"><h2>2</h2></div>
|
||||
<jihe style="margin: 0 auto"></jihe
|
||||
></el-col>
|
||||
<el-col :span="4">
|
||||
<div class="producting"><h2>3</h2></div>
|
||||
<jihe style="margin: 0 auto"></jihe
|
||||
></el-col>
|
||||
<el-col :span="4">
|
||||
<div class="productstop"><h2>4</h2></div>
|
||||
<jihe1 style="margin: 0 auto"></jihe1
|
||||
></el-col>
|
||||
<el-col :span="4">
|
||||
<div class="producting"><h2>5</h2></div>
|
||||
<jihe style="margin: 0 auto"></jihe
|
||||
></el-col>
|
||||
<el-col :span="4"><el-tag type="success">未满</el-tag><el-tag type="info">已满</el-tag></el-col>
|
||||
</el-row>
|
||||
<vxe-table border resizable align="center" ref="xTable" :data="tableData" :row-style="rowClassName" :cell-style="cellStyle">
|
||||
<vxe-column type="seq" width="60"></vxe-column>
|
||||
<vxe-column field="NOProductionQuantity" title="未备料数量"></vxe-column>
|
||||
<vxe-column field="num" title="库位号"></vxe-column>
|
||||
<vxe-column field="ProductionQuantity" title="计划数量"></vxe-column>
|
||||
<vxe-column field="online_time" title="上线时间"></vxe-column>
|
||||
<vxe-column field="work_order" title="工单" :formatter="formatworkOrder" type="html"></vxe-column>
|
||||
<vxe-column field="part_NO" title="零件号" :formatter="formatPartNo" type="html"></vxe-column>
|
||||
<vxe-column field="part_name" title="零件名称" :formatter="formatPartName" type="html"> </vxe-column>
|
||||
<vxe-column field="QuantityPerRack" title="每车件数"></vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import jihe from '@/views/kanbanManagement/jihe'
|
||||
import jihe1 from '@/views/kanbanManagement/jihe1'
|
||||
export default {
|
||||
name: 'kanban',
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
{
|
||||
Date: '2016/3/22',
|
||||
shift: '夜班',
|
||||
team: 'A',
|
||||
round: '08',
|
||||
online_time: '03/23 00:09:45',
|
||||
work_order: 'W0234',
|
||||
vehicle_NO: '059-063',
|
||||
part_SN: '177',
|
||||
part_NO: '300504103',
|
||||
part_name: 'SGM201左外镜副镜壳银河灰',
|
||||
paintCode: '1551',
|
||||
ProgramCode: '0041',
|
||||
QuantityPerRack: '20',
|
||||
RackQuantity: '6',
|
||||
ShareRack: '85',
|
||||
ProductionQuantity: '85',
|
||||
NOProductionQuantity: 20,
|
||||
num: 1234132,
|
||||
},
|
||||
{
|
||||
Date: '2016/3/22',
|
||||
shift: '白班',
|
||||
team: 'A',
|
||||
round: '08',
|
||||
online_time: '03/23 00:09:45',
|
||||
work_order: 'W0234',
|
||||
vehicle_NO: '059-063',
|
||||
part_SN: '177',
|
||||
part_NO: '300504103',
|
||||
part_name: 'SGM201左外镜副镜壳银河灰',
|
||||
paintCode: '1551',
|
||||
ProgramCode: '0041',
|
||||
QuantityPerRack: '20',
|
||||
RackQuantity: '6',
|
||||
ShareRack: '85',
|
||||
ProductionQuantity: '85',
|
||||
NOProductionQuantity: 85,
|
||||
num: 13241324,
|
||||
},
|
||||
{
|
||||
Date: '2016/3/22',
|
||||
shift: '夜班',
|
||||
team: 'A',
|
||||
round: '08',
|
||||
online_time: '03/23 00:09:45',
|
||||
work_order: 'W0234',
|
||||
vehicle_NO: '059-063',
|
||||
part_SN: '177',
|
||||
part_NO: '300504103',
|
||||
part_name: 'SGM201左外镜副镜壳银河灰',
|
||||
paintCode: '1551',
|
||||
ProgramCode: '0041',
|
||||
QuantityPerRack: '20',
|
||||
RackQuantity: '6',
|
||||
ShareRack: '85',
|
||||
ProductionQuantity: '85',
|
||||
NOProductionQuantity: 85,
|
||||
num: 264764,
|
||||
},
|
||||
{
|
||||
Date: '2016/3/22',
|
||||
shift: '白班',
|
||||
team: 'A',
|
||||
round: '08',
|
||||
online_time: '03/23 00:09:45',
|
||||
work_order: 'W0234',
|
||||
vehicle_NO: '059-063',
|
||||
part_SN: '177',
|
||||
part_NO: '300504103',
|
||||
part_name: 'SGM201左外镜副镜壳银河灰',
|
||||
paintCode: '1551',
|
||||
ProgramCode: '0041',
|
||||
QuantityPerRack: '20',
|
||||
RackQuantity: '6',
|
||||
ShareRack: '85',
|
||||
ProductionQuantity: '85',
|
||||
NOProductionQuantity: 85,
|
||||
num: 27685,
|
||||
},
|
||||
{
|
||||
Date: '2016/3/22',
|
||||
shift: '白班',
|
||||
team: 'A',
|
||||
round: '08',
|
||||
online_time: '03/23 00:09:45',
|
||||
work_order: 'W0234',
|
||||
vehicle_NO: '059-063',
|
||||
part_SN: '177',
|
||||
part_NO: '300504103',
|
||||
part_name: 'SGM201左外镜副镜壳银河灰',
|
||||
paintCode: '1551',
|
||||
ProgramCode: '0041',
|
||||
QuantityPerRack: '20',
|
||||
RackQuantity: '6',
|
||||
ShareRack: '85',
|
||||
ProductionQuantity: '85',
|
||||
NOProductionQuantity: 85,
|
||||
num: 178968,
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
components: { jihe, jihe1 },
|
||||
methods: {
|
||||
cellStyle({ rowIndex, column }) {
|
||||
if (column.field === 'NOProductionQuantity') {
|
||||
if ([0].includes(rowIndex)) {
|
||||
return {
|
||||
backgroundColor: 'red',
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
rowClassName({ rowIndex }) {
|
||||
if ([0].includes(rowIndex)) {
|
||||
return {
|
||||
backgroundColor: '#24eb2c',
|
||||
color: '#ffffff',
|
||||
}
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
h1,
|
||||
h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.producting {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
|
||||
background: green;
|
||||
border: 1px solid green;
|
||||
border-radius: 50%;
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.productstop {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
background: gray;
|
||||
border: 1px solid gray;
|
||||
border-radius: 50%;
|
||||
margin: 5px auto;
|
||||
}
|
||||
::v-deep .vxe-table--render-default {
|
||||
font-size: 20px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<h1>油漆车间生产实时看板</h1>
|
||||
<h1>涂装车间生产实时看板</h1>
|
||||
<div>
|
||||
<el-row :gutter="2">
|
||||
<el-col :span="8"><div class="charts" id="process"></div></el-col>
|
||||
@@ -11,8 +11,8 @@
|
||||
<vxe-table border resizable align="center" ref="xTable" :data="OperationList" :row-style="rowClassName" class="vxe-UI">
|
||||
<vxe-column type="seq" width="60"></vxe-column>
|
||||
<vxe-column field="online_time" title="上线时间"></vxe-column>
|
||||
<vxe-column field="work_order" title="工单" type="html"></vxe-column>
|
||||
<vxe-column field="partNO" title="零件号"></vxe-column>
|
||||
<vxe-column field="work_order" title="工单" type="html"></vxe-column>
|
||||
<vxe-column field="ProductionQuantity" title="计划数量"></vxe-column>
|
||||
<vxe-column field="productedNum" title="完成数量"></vxe-column>
|
||||
</vxe-table>
|
||||
@@ -25,7 +25,7 @@ import XEUtils from 'xe-utils'
|
||||
import VXETable from 'vxe-table'
|
||||
import * as echarts from 'echarts'
|
||||
export default {
|
||||
name: 'planKanban',
|
||||
name: 'tuzhuangworkshop',
|
||||
data() {
|
||||
return {
|
||||
OperationList: [
|
||||
Reference in New Issue
Block a user