添加看板跳转

hw-ui/src/api/board/fourthFloorWarehouse.js

@@ -1,46 +1,45 @@
-import request from '@/utils/request1'
+import request from '@/utils/request'
-import request1 from '@/utils/request2'
 
 // 出入库详情
-export function inAndOutInfo(query) {
+export function latestYearInOutStocks(query) {
   return request({
-    url: '/FourthWmsBorder/inAndOutInfo',
+    url: '/wms/FourthFloorWmsBoard/latestYearInOutStocks',
     method: 'get',
     params: query
   })
 }
 
 // 原材料库存占比
-export function stockPercentage(query) {
+export function getFourthFloorTotalProductStocks(query) {
   return request({
-    url: '/FourthWmsBorder/stockPercentage',
+    url: '/wms/FourthFloorWmsBoard/getFourthFloorTotalProductStocks',
     method: 'get',
     params: query
   })
 }
 
 // 采购订单
-export function purchaseInfo(query) {
+export function getFourthFloorProductInOutstockInfo(query) {
   return request({
-    url: '/FourthWmsBorder/purchaseInfo',
+    url: '/wms/FourthFloorWmsBoard/getFourthFloorProductInOutstockInfo',
     method: 'get',
     params: query
   })
 }
 
 // 生产订单物料需求
-export function bomInfo(query) {
+export function getFourthFloorPlateStockTotals(query) {
   return request({
-    url: '/FourthWmsBorder/bomInfo',
+    url: '/wms/FourthFloorWmsBoard/getFourthFloorPlateStockTotals',
     method: 'get',
     params: query
   })
 }
 
 // 成品出入库
-export function productInAndOutInfo(query) {
+export function getFourthFloorAccessoriesStockTotals(query) {
   return request({
-    url: '/FourthWmsBorder/productInAndOutInfo',
+    url: '/wms/FourthFloorWmsBoard/getFourthFloorAccessoriesStockTotals',
     method: 'get',
     params: query
   })

hw-ui/src/layout/index2.vue

@@ -4,6 +4,28 @@
     <div class="data" id="data">{{ data }}</div>
     <div class="time" id="time">{{ time }}</div>
     <div class="date" id="date">{{ date }}</div>
+<div class="top">
+<div class="select">
+  <el-dropdown @command="handleCommand">
+  <span class="el-dropdown-link">
+    下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
+  </span>
+  <el-dropdown-menu slot="dropdown">
+    <el-dropdown-item command="/board/firstFloorProduction">一楼生产</el-dropdown-item>
+    <el-dropdown-item command="/board/firstFloorWarehouse">一楼能源</el-dropdown-item>
+    <el-dropdown-item command="/board/secondFloorProduction">二楼生产</el-dropdown-item>
+    <el-dropdown-item command="/board/secondFloorWarehouse">二楼仓储</el-dropdown-item>
+    <el-dropdown-item command="/board/thirdFloorProduction">三楼生产</el-dropdown-item>
+    <el-dropdown-item command="/board/thirdFloorWarehouse">三楼仓储</el-dropdown-item>
+    <el-dropdown-item command="/board/fourthFloorProduction">四楼生产</el-dropdown-item>
+    <el-dropdown-item command="/board/fourthFloorWarehouse">四楼仓储</el-dropdown-item>
+    <el-dropdown-item command="/board/fifthFloorProduction">五楼生产</el-dropdown-item>
+    <el-dropdown-item command="/board/fifthFloorWarehouse">五楼仓储</el-dropdown-item>
+  </el-dropdown-menu>
+</el-dropdown>
+
+</div>
+</div>
   </div>
 </template>
 
@@ -16,7 +38,8 @@ export default {
     return {
       data:'',
       time: '',
-      date: ''
+      date: '',
+      value: ''
     }
   },
   created() {
@@ -36,12 +59,41 @@ export default {
     getDate()
     getDateIntervalFun = setInterval(getDate, 1000)
   },
+methods:{
+  handleCommand(e){
+this.$router.push(e)
+  }
+},
   beforeDestroy() {
     getDateIntervalFun = null
   }
 }
 </script>
-<style scoped>
+<style lang='less' scoped>
+/deep/ .el-dropdown {
+    color: #fff;
+}
+.top{
+position:absolute;
+top:0;
+left:0;
+width:100%;
+height:10%;
+&:hover{
+.select{
+display:block
+}
+}
+.select{
+display:none;
+position:absolute;
+top:65%;
+left:50%;
+transform:translate(-50%,-50%);
+color:#fff
+}
+}
+
 .time, .date, .data {
   position: absolute;
   font-size: 0.8vw;

hw-ui/src/views/board/warehouse/fourthFloor.vue

@@ -21,19 +21,16 @@
     <div class="table1">
       <div style="background-color: #1077bc19">
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          任务编号
+          物料编码
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          任务类型
         </div>
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
           物料名称
         </div>
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          库位编号
+          物料规格
         </div>
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          时间
+          库存数量
         </div>
       </div>
       <vue-seamless-scroll
@@ -50,27 +47,22 @@
             <div
               class="scrollTableItem"
             >
-              {{ item.taskCode }}
+              {{ item.materialCode }}
             </div>
             <div
               class="scrollTableItem"
             >
-              入库
+              {{item.materialName}}
             </div>
             <div
               class="scrollTableItem"
             >
-              {{ item.materialName }}
+              {{ item.materialSpec }}
             </div>
             <div
               class="scrollTableItem"
             >
-              {{ item.locationCode }}
+              {{ item.totalAmount }}
-            </div>
-            <div
-              class="scrollTableItem"
-            >
-              {{ item.applylate }}
             </div>
           </div>
         </div>
@@ -80,19 +72,16 @@
     <div class="table2">
       <div style="background-color: #1077bc19">
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          订单
+          物料编码
-        </div>
-        <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          物料
         </div>
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          物料需求
+          物料名称
         </div>
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          Bom分解
+          物料规格
         </div>
         <div class="scrollTableItem" style="color:#65c2f3;font-weight: bold;">
-          时间
+          库存数量
         </div>
       </div>
       <vue-seamless-scroll
@@ -102,34 +91,29 @@
         style="height: calc(100% - 30px);overflow: hidden;"
       >
         <div
-          v-for="(item, index) in scrollTableData1"
+          v-for="(item, index) in scrollTableData"
           :key="index"
         >
           <div :style='"background-color:" + ((index % 2 === 0)? "#1077bc19":"#1077bc05") '>
             <div
               class="scrollTableItem"
             >
-              {{ item.orderCode }}
+              {{ item.materialCode }}
-            </div>
-            <div
-              class="scrollTableItem"
-            >
-              {{ item.materialName }}
             </div>
             <div
               class="scrollTableItem"
             >
-              {{ item.saleAmount }}
+              {{item.materialName}}
             </div>
             <div
               class="scrollTableItem"
             >
-              <!--              {{ item.value4 }}-->
+              {{ item.materialSpec }}
             </div>
             <div
               class="scrollTableItem"
             >
-              {{ item.releaseTime }}
+              {{ item.totalAmount }}
             </div>
           </div>
         </div>
@@ -160,7 +144,13 @@ import vueSeamlessScroll from 'vue-seamless-scroll'
 import Chart from '@/components/board/Chart'
 import HighChart from '@/components/board/HighChart'
 import * as echarts from 'echarts'
-import {} from '@/api/board/fourthFloorWarehouse'
+import {
+  latestYearInOutStocks,
+  getFourthFloorTotalProductStocks,
+  getFourthFloorProductInOutstockInfo,
+  getFourthFloorPlateStockTotals,
+  getFourthFloorAccessoriesStockTotals
+} from '@/api/board/fourthFloorWarehouse'
 import { parseTime } from '@/utils/ruoyi'
 
 const vw = (document.documentElement.clientWidth || document.body.clientWidth) / 100
@@ -236,226 +226,230 @@ export default {
   },
   methods: {
     getData() {
-      let e = {
+      latestYearInOutStocks().then(e=>{
-        data: {
+        this.topData.num1 = [...[0, 0, 0, 0], ...(e.data.rawInstockAmount || 0).toString().split('')].slice(-4)
-          'rawInstockAmount': 28,
+        this.topData.num2 = [...[0, 0, 0, 0], ...(e.data.rawOutstockAmount || 0).toString().split('')].slice(-4)
-          'rawOutstockAmount': 14,
+        this.topData.num3 = [...[0, 0, 0, 0], ...(e.data.productInstockAmount || 0).toString().split('')].slice(-4)
-          'productInstockAmount': 8
+      })
-        }
+      getFourthFloorTotalProductStocks().then(e=>{
-      }
+        this.$refs.chart1.setData({
-      this.topData.num1 = [...[0, 0, 0, 0], ...(e.data.rawInstockAmount || 0).toString().split('')].slice(-4)
+          tooltip: {
-      this.topData.num2 = [...[0, 0, 0, 0], ...(e.data.rawOutstockAmount || 0).toString().split('')].slice(-4)
+            trigger: 'item'
-      this.topData.num3 = [...[0, 0, 0, 0], ...(e.data.productInstockAmount || 0).toString().split('')].slice(-4)
-      this.$refs.chart1.setData({
-        tooltip: {
-          trigger: 'item'
-        },
-        grid: {
-          borderWidth: 0,
-          top: '10%',
-          left: '10%',
-          right: '10%',
-          bottom: '10%'
-        },
-        yAxis: {
-          type: 'category',
-          axisLabel: {
-            margin: 10,
-            color: '#ffffff63'
-          },
-
-          axisTick: {
-            show: true,
-            lineStyle: {
-              color: '#ffffff1f'
-            }
-          },
-          splitLine: {
-            show: true,
-            lineStyle: {
-              type: 'dashed',
-              color: '#ffffff1f'
-            }
-          },
-          axisLine: {
-            lineStyle: {
-              color: '#fff3',
-              width: 2
-            }
           },
-          data: [1, 2, 3]
+          grid: {
-        },
+            borderWidth: 0,
-        xAxis: {
+            top: '10%',
-          type: 'value',
+            left: '10%',
-          axisLabel: {
+            right: '10%',
-            margin: 10,
+            bottom: '10%'
-            color: '#ffffff63'
           },
-          axisLine: {
+          yAxis: {
-            show: false
+            type: 'category',
+            axisLabel: {
+              margin: 10,
+              color: '#ffffff63'
+            },
+
+            axisTick: {
+              show: true,
+              lineStyle: {
+                color: '#ffffff1f'
+              }
+            },
+            splitLine: {
+              show: true,
+              lineStyle: {
+                type: 'dashed',
+                color: '#ffffff1f'
+              }
+            },
+            axisLine: {
+              lineStyle: {
+                color: '#fff3',
+                width: 2
+              }
+            },
+            data: e.data.map(v=>v.materialName)
           },
-          axisTick: {
+          xAxis: {
-            show: true,
+            type: 'value',
-            lineStyle: {
+            axisLabel: {
-              color: '#ffffff1f'
+              margin: 10,
+              color: '#ffffff63'
+            },
+            axisLine: {
+              show: false
+            },
+            axisTick: {
+              show: true,
+              lineStyle: {
+                color: '#ffffff1f'
+              }
+            },
+            splitLine: {
+              show: true,
+              lineStyle: {
+                type: 'dashed',
+                color: '#ffffff1f'
+              }
             }
           },
-          splitLine: {
+          series: [
-            show: true,
+            {
-            lineStyle: {
+              name: '',
-              type: 'dashed',
+              type: 'bar',
-              color: '#ffffff1f'
+              barMaxWidth: '40px',
-            }
+              barWidth: '40%',
-          }
+              itemStyle: {
-        },
-        series: [
-          {
-            name: '',
-            type: 'bar',
-            barMaxWidth: '40px',
-            barWidth: '40%',
-            itemStyle: {
 
-              color: new echarts.graphic.LinearGradient(
+                color: new echarts.graphic.LinearGradient(
-                0,
+                  0,
-                0,
+                  0,
-                1,
+                  1,
-                0,
+                  0,
-                [
+                  [
-                  {
+                    {
-                    offset: 0,
+                      offset: 0,
-                    color: '#0a2ad7'
+                      color: '#0a2ad7'
-                  },
+                    },
-                  {
+                    {
-                    offset: 1,
+                      offset: 1,
-                    color: '#138dd7'
+                      color: '#138dd7'
-                  }
+                    }
-                ],
+                  ],
-                false
+                  false
-              )
+                )
+              },
+              data: e.data.map(v=>v.totalAmount)
             },
-            data: [11, 22, 3]
+            {
-          },
+              name: '',
-          {
+              type: 'pictorialBar',
-            name: '',
+              barWidth: '40%',
-            type: 'pictorialBar',
+              barMaxWidth: '40px',
-            barWidth: '40%',
+              symbolSize: [5, '100%'],
-            barMaxWidth: '40px',
+              symbolPosition: 'end',
-            symbolSize: [5, '100%'],
+              symbolOffset: [3, 0],
-            symbolPosition: 'end',
+              barGap: '-100%',
-            symbolOffset: [3, 0],
+              itemStyle: {
-            barGap: '-100%',
+                color: '#138dd7'
-            itemStyle: {
+              },
-              color: '#138dd7'
+              data: e.data.map(v=>v.totalAmount)
-            },
+            }
-            data: [11, 22, 3]
+          ]
-          }
+        })
-        ]
       })
-      this.scrollTableData = []
+      getFourthFloorProductInOutstockInfo().then(e=>{
-      this.scrollTableData1 = []
+        this.$refs.chart3.setData({
-      this.$refs.chart3.setData({
+          tooltip: {
-        tooltip: {
+            trigger: 'axis',
-          trigger: 'axis',
+            axisPointer: {
-          axisPointer: {
+              // 坐标轴指示器，坐标轴触发有效
-            // 坐标轴指示器，坐标轴触发有效
+              type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
-            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
-          }
-        },
-        grid: {
-          left: '2%',
-          right: '4%',
-          bottom: '14%',
-          top: '16%',
-          containLabel: true
-        },
-        legend: {
-          x: 'center',
-          top: 12,
-          textStyle: {
-            color: '#fff'
-          },
-          itemWidth: 12,
-          itemHeight: 10
-          // itemGap: 35
-        },
-        xAxis: {
-          type: 'category',
-          data: e.data.map(v => parseTime(v.day, '{m}-{d}')),
-          axisLine: {
-            lineStyle: {
-              color: 'white'
             }
           },
-          axisLabel: {
+          grid: {
-            // interval: 0,
+            left: '2%',
-            // rotate: 40,
+            right: '4%',
+            bottom: '14%',
+            top: '16%',
+            containLabel: true
+          },
+          legend: {
+            x: 'center',
+            top: 12,
             textStyle: {
-              fontFamily: 'Microsoft YaHei'
+              color: '#fff'
-            }
+            },
-          }
+            itemWidth: 12,
-        },
+            itemHeight: 10
-
+            // itemGap: 35
-        yAxis: {
-          type: 'value',
-          axisLine: {
-            show: false,
-            lineStyle: {
-              color: 'white'
-            }
           },
-          splitLine: {
+          xAxis: {
-            show: true,
+            type: 'category',
-            lineStyle: {
+            data: ['出入库信息'],
-              color: 'rgba(255,255,255,0.3)'
+            axisLine: {
+              lineStyle: {
+                color: 'white'
+              }
+            },
+            axisLabel: {
+              // interval: 0,
+              // rotate: 40,
+              textStyle: {
+                fontFamily: 'Microsoft YaHei'
+              }
             }
           },
-          axisLabel: {}
+
-        },
+          yAxis: {
-        series: [
+            type: 'value',
-          {
+            axisLine: {
-            name: '入库',
+              show: false,
-            type: 'bar',
+              lineStyle: {
-            barWidth: '15%',
+                color: 'white'
-            itemStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: '#fccb05'
-                  },
-                  {
-                    offset: 1,
-                    color: '#f5804d'
-                  }
-                ])
               }
             },
-            data: e.data.map(v => v.instockAmount)
+            splitLine: {
-          },
+              show: true,
-          {
+              lineStyle: {
-            name: '出库',
+                color: 'rgba(255,255,255,0.3)'
-            type: 'bar',
-            barWidth: '15%',
-            itemStyle: {
-              normal: {
-                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  {
-                    offset: 0,
-                    color: '#8bd46e'
-                  },
-                  {
-                    offset: 1,
-                    color: '#09bcb7'
-                  }
-                ])
               }
             },
-            data: e.data.map(v => v.outStockAmount)
+            axisLabel: {}
-          }
+          },
-        ]
+          series: [
+            {
+              name: '入库',
+              type: 'bar',
+              barWidth: '15%',
+              itemStyle: {
+                normal: {
+                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    {
+                      offset: 0,
+                      color: '#fccb05'
+                    },
+                    {
+                      offset: 1,
+                      color: '#f5804d'
+                    }
+                  ])
+                }
+              },
+              data: [e.data.productInstockAmount]
+            },
+            {
+              name: '出库',
+              type: 'bar',
+              barWidth: '15%',
+              itemStyle: {
+                normal: {
+                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                    {
+                      offset: 0,
+                      color: '#8bd46e'
+                    },
+                    {
+                      offset: 1,
+                      color: '#09bcb7'
+                    }
+                  ])
+                }
+              },
+              data: [e.data.productOutStockAmount]
+            }
+          ]
+        })
       })
-    }
+      getFourthFloorPlateStockTotals().then(e=>{
+        console.log(e)
+this.scrollTableData = e.data
+      })
+      getFourthFloorAccessoriesStockTotals().then(e=>{
+        this.scrollTableData1 = e.data
+      })
+    },
   }
 }
 </script>
@@ -564,7 +558,7 @@ export default {
 
 .scrollTableItem {
   display: inline-block;
-  width: calc(100% / 5);
+  width: calc(100% / 4);
   text-align: center;
   padding: 14px 0;
   color: #4e99c5