diff --git a/ZR.Vue/src/views/kanbanManagement/jihe.vue b/ZR.Vue/src/views/kanbanManagement/jihe.vue
new file mode 100644
index 00000000..264d6690
--- /dev/null
+++ b/ZR.Vue/src/views/kanbanManagement/jihe.vue
@@ -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>
diff --git a/ZR.Vue/src/views/kanbanManagement/jihe1.vue b/ZR.Vue/src/views/kanbanManagement/jihe1.vue
new file mode 100644
index 00000000..cb2c893d
--- /dev/null
+++ b/ZR.Vue/src/views/kanbanManagement/jihe1.vue
@@ -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>
diff --git a/ZR.Vue/src/views/kanbanManagement/tuzhuangcanku.vue b/ZR.Vue/src/views/kanbanManagement/tuzhuangcanku.vue
new file mode 100644
index 00000000..cc5d44b5
--- /dev/null
+++ b/ZR.Vue/src/views/kanbanManagement/tuzhuangcanku.vue
@@ -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>
diff --git a/ZR.Vue/src/views/productManagement/productionPlan/planKanban.vue b/ZR.Vue/src/views/kanbanManagement/tuzhuangworkshop.vue
similarity index 97%
rename from ZR.Vue/src/views/productManagement/productionPlan/planKanban.vue
rename to ZR.Vue/src/views/kanbanManagement/tuzhuangworkshop.vue
index afd3504f..38de12ba 100644
--- a/ZR.Vue/src/views/productManagement/productionPlan/planKanban.vue
+++ b/ZR.Vue/src/views/kanbanManagement/tuzhuangworkshop.vue
@@ -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: [