From cc5bd5ca7e273573e685ac68b10267a35cbd708e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=94=A1=E7=8E=B2?=
 <8702040+cai-ling@user.noreply.gitee.com>
Date: Fri, 8 Nov 2024 14:03:49 +0800
Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                      |   2 +-
 src/components/header.vue      |  16 ++-
 src/config/getData2.js         |  10 +-
 src/config/mork2.js            | 197 ++++++++++++++++++++++++---
 src/main.js                    |   5 +-
 src/pages/Setup.vue            |  24 +++-
 src/pages/modules/index1.vue   | 161 +++++++++++++++++++---
 src/pages/modules/index2.vue   | 236 +++++++++++++++++----------------
 src/pages/modules/index3.vue   |   6 +-
 src/pages/modules/style.stylus |  51 +++++--
 src/style/layout.styl          |  21 +--
 src/style/reset.css            |   4 +
 src/vuex/modules/com.js        |  10 +-
 13 files changed, 547 insertions(+), 196 deletions(-)

diff --git a/README.md b/README.md
index fc8a2e1..6badb5d 100644
--- a/README.md
+++ b/README.md
@@ -22,4 +22,4 @@ For a detailed explanation on how things work, check out the [guide](http://vuej
 
 # 注意事项
 + 大屏分辨率都：960*540
-+ 接口地址：
\ No newline at end of file
++ 接口地址：http://47.98.105.245:8001/project/63/interface/api/651
\ No newline at end of file
diff --git a/src/components/header.vue b/src/components/header.vue
index 5859b78..2975c30 100644
--- a/src/components/header.vue
+++ b/src/components/header.vue
@@ -1,7 +1,8 @@
 <template>
 <div class="n_header">
   <div class="n_header_h1">
-    <h1>{{ title1 }}</h1>
+    <slot></slot>
+    <h1 v-if="type === '1'">{{ title1 }}</h1>
   </div>
   <p class="p_title">{{ title2 }}</p>
   <div class="exit_btn iconfont" @click="back">&#xe85b;</div>
@@ -12,10 +13,10 @@
 export default {
   name: 'Header',
   data () {
-    return {
-    }
+    return {}
   },
   props: {
+    type: String,
     title1: String,
     title2: String
   },
@@ -50,14 +51,17 @@ export default {
 .n_header_h1
   width: 100%;
   height: 100%;
-  padding-top 12px
+  // padding-top 12px
+  text-align center
   h1
     font-size: 19px;
     font-weight: 700;
     color: #fff;
-    line-height: 1;
+    line-height: 40px;
+    height: 40px;
     text-align center;
     letter-spacing 3px
+    padding-left 3px
 .p_title
   position absolute
   left 1%
@@ -74,5 +78,5 @@ export default {
   line-height 16px
   font-size 16px
   color #AECAF5
-  text-align: center;
+  text-align center
 </style>
diff --git a/src/config/getData2.js b/src/config/getData2.js
index 7350e99..0e39274 100644
--- a/src/config/getData2.js
+++ b/src/config/getData2.js
@@ -1,3 +1,9 @@
 import {post} from './http.js'
-// 获取大屏所有数据
-export const allDeviceStatus = () => post('api/chaoWei/allDeviceStatus', {})
+// 查询拣选台
+export const queryPickingPoint = () => post('api/board/queryPickingPoint', {})
+// 拣选看板
+export const pickingInfo = (code) => post('api/board/pickingInfo', {
+  code: code
+})
+// 仓储看板
+export const synthesizeInfo = () => post('api/board/synthesizeInfo', {})
diff --git a/src/config/mork2.js b/src/config/mork2.js
index 8a307ac..e3fe78a 100644
--- a/src/config/mork2.js
+++ b/src/config/mork2.js
@@ -7,7 +7,7 @@ export const getAllBigScreen = () => {
             },
             {
                 "count": "20",
-                "name": "物料一",
+                "name": "物料一物料一物料一物料一",
                 "percent": "10%"
             },
             {
@@ -34,26 +34,6 @@ export const getAllBigScreen = () => {
                 "count": "20",
                 "name": "物料六",
                 "percent": "10%"
-            },
-            {
-                "count": "20",
-                "name": "物料七",
-                "percent": "10%"
-            },
-            {
-                "count": "20",
-                "name": "物料八",
-                "percent": "10%"
-            },
-            {
-                "count": "20",
-                "name": "物料九",
-                "percent": "10%"
-            },
-            {
-                "count": "20",
-                "name": "物料十",
-                "percent": "10%"
             }
         ],
         historyInventoryIOAnalysis: [
@@ -235,3 +215,178 @@ export const getAllBigScreen = () => {
     return res
 }
 
+export const queryPickingPoint = () => {
+    let res = [
+        {
+            "id": "1810932943246462976",
+            "code": "1308",
+            "name": "一号拣选位",
+            "product_area": "A1",
+            "region_code": "PICK01",
+            "point_type": null,
+            "lock_type": "0",
+            "group_code": null,
+            "point_location": "一号拣选位",
+            "remark": null,
+            "is_used": true,
+            "create_name": "管理员",
+            "create_time": "2024-07-10 15:03:53",
+            "update_name": "管理员",
+            "update_time": "2024-09-07 17:07:04",
+            "form_data": null,
+            "priority": "1",
+            "vehicle_code": null
+        },
+        {
+            "id": "1810933451587719168",
+            "code": "1311",
+            "name": "二号拣选位",
+            "product_area": "A1",
+            "region_code": "PICK01",
+            "point_type": null,
+            "lock_type": "0",
+            "group_code": null,
+            "point_location": "二号拣选位",
+            "remark": null,
+            "is_used": true,
+            "create_name": "管理员",
+            "create_time": "2024-07-10 15:05:55",
+            "update_name": "管理员",
+            "update_time": "2024-08-31 14:53:32",
+            "form_data": null,
+            "priority": "1",
+            "vehicle_code": null
+        }
+    ]
+    return res
+}
+
+export const pickingInfo = () => {
+    let res = [
+        {
+            "qty": 100,
+            "vehicle_code": "X000010",
+            "create_time": null,
+            "update_time": null,
+            "stor_code": null,
+            "task_type": "PK20241107003",
+            "material_name": "测试物料",
+            "material_code": "24999999S",
+            "assign_qty": 111,
+            "single_weight": 15.70,
+            "theory_qty": 0,
+            "actual_weight": 0,
+            "remaining_qty": 100,
+            "form_data": "{\"stor_code\": \"FStockId\", \"point_code\": \"1308\", \"product_area\": \"A1\", \"vehicle_code\": \"X00007\"}",
+            "product_area": "A1"
+        },
+        {
+            "qty": 300,
+            "vehicle_code": "X00007",
+            "create_time": null,
+            "update_time": null,
+            "stor_code": null,
+            "task_type": "PK20241107004",
+            "material_name": "测试物料",
+            "material_code": "24999999S",
+            "assign_qty": 111,
+            "single_weight": 15.70,
+            "theory_qty": 0,
+            "actual_weight": 0,
+            "remaining_qty": 300,
+            "form_data": "{\"stor_code\": \"FStockId\", \"point_code\": \"1308\", \"product_area\": \"A1\", \"vehicle_code\": \"X00007\"}",
+            "product_area": "A1"
+        }
+    ]
+    return res
+}
+
+export const synthesizeInfo = () => {
+    let res = {
+        "tp_used": {
+            "total": 960,
+            "used": 1,
+            "free": 959,
+            "percent": "0.1%"
+        },
+        "lx_out_week": [
+            {
+                "date": "11-08",
+                "total_qty": 2210.000
+            },
+            {
+                "date": "11-07",
+                "total_qty": "0"
+            },
+            {
+                "date": "11-06",
+                "total_qty": "0"
+            },
+            {
+                "date": "11-05",
+                "total_qty": "0"
+            },
+            {
+                "date": "11-04",
+                "total_qty": "0"
+            },
+            {
+                "date": "11-03",
+                "total_qty": "0"
+            },
+            {
+                "date": "11-02",
+                "total_qty": "0"
+            }
+        ],
+        "tp_in_week": [],
+        "tp_inventory": [
+            {
+                "total": "0"
+            }
+        ],
+        "lx_used": {
+            "total": 21424,
+            "used": 1,
+            "free": 21423,
+            "percent": "0.0%"
+        },
+        "tp_task": [
+            {
+                "total": 0,
+                "box": 0,
+                "time": "0h"
+            },
+            {
+                "total": 0,
+                "box": 0,
+                "time": "0h"
+            }
+        ],
+        "lx_in_week": [],
+        "tp_out_week": [],
+        "lx_task": [
+            {
+                "total": 0,
+                "box": 0,
+                "time": "0h"
+            },
+            {
+                "total": 2210,
+                "box": 9,
+                "time": "5.0h"
+            }
+        ],
+        "lx_inventory": [
+            {
+                "total": 200.000
+            },
+            {
+                "qty": 200.000,
+                "name": "测试物料",
+                "percent": "100.00%"
+            }
+        ]
+    }
+    return res
+}
diff --git a/src/main.js b/src/main.js
index c2c7398..fd6664d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -5,14 +5,17 @@ import router from './router'
 import store from './vuex/store'
 import './style/reset.css'
 import './style/iconfont.styl'
+import './style/layout.styl'
 import * as echarts from 'echarts'
 import 'default-passive-events'
 import scroll from 'vue-seamless-scroll'
-import {Message} from 'element-ui'
+import {Message, Select, Option} from 'element-ui'
 
 Vue.prototype.$echarts = echarts
 Vue.use(scroll)
 Vue.prototype.$message = Message
+Vue.use(Select)
+Vue.use(Option)
 Vue.config.productionTip = false
 /* eslint-disable no-new */
 new Vue({
diff --git a/src/pages/Setup.vue b/src/pages/Setup.vue
index 51be19a..5b6aaf7 100644
--- a/src/pages/Setup.vue
+++ b/src/pages/Setup.vue
@@ -14,6 +14,17 @@
               <label>刷新时间（秒）</label>
               <input type="number" class="inputStyle" v-model="setTime">
             </div>
+            <div class="inputOuter">
+              <label>看板</label>
+              <el-select class="selectWraper" v-model="value" placeholder="请选择">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
           </div>
           <button class="btn" @click="_config">配置</button>
         </div>
@@ -29,7 +40,9 @@ export default {
       loginname: '',
       password: '',
       baseUrl: this.$store.getters.baseUrl,
-      setTime: this.$store.getters.setTime / 1000
+      setTime: this.$store.getters.setTime / 1000,
+      options: [{value: 1, label: '拣选台'}, {value: 2, label: '仓储监控'}],
+      value: this.$store.getters.pageNo
     }
   },
   methods: {
@@ -50,10 +63,11 @@ export default {
       }
       let obj = {
         baseUrl: this.baseUrl,
-        setTime: this.setTime * 1000
+        setTime: this.setTime * 1000,
+        pageNo: this.value
       }
       this.$store.dispatch('setConfig', obj)
-      this.$router.push('/index1')
+      this.$router.push('/index' + this.value)
       let element = document.documentElement
       if (!(document.fullscreenElement || document.mozFullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement)) {
         if (element.requestFullscreen) {
@@ -136,4 +150,8 @@ label
   font-size 15px
   line-height 40px
   color #333333
+.selectWraper
+  _wh(calc(100% - 116px), 40px)
+  font-size 14px
+  line-height 40px
 </style>
diff --git a/src/pages/modules/index1.vue b/src/pages/modules/index1.vue
index d96fda9..e4b5a93 100644
--- a/src/pages/modules/index1.vue
+++ b/src/pages/modules/index1.vue
@@ -1,55 +1,139 @@
 <template>
   <div class="box relative">
-    <t-header title1="1号拣选台" title2="浙江恒森实业集团WMS系统"></t-header>
+    <t-header title2="浙江恒森实业集团WMS系统">
+      <el-select class="header_select" v-model="value" placeholder="请选择" @change="change">
+        <el-option
+          v-for="item in options"
+          :key="item.code"
+          :label="item.name"
+          :value="item.code">
+        </el-option>
+      </el-select>
+    </t-header>
     <div class="box body_container">
-      <div class="relative n_wraper">
+      <div v-if="itemData.length >= 1" class="relative n_wraper">
         <div class="absolute bg_j bg_j_1"></div>
         <div class="absolute bg_j bg_j_2"></div>
         <div class="absolute bg_j bg_j_3"></div>
         <div class="absolute bg_j bg_j_4"></div>
         <div class="relative title_wraper">
           <p class="relative title_h1">装配一车间</p>
-          <p class="absolute title_h2">当前任务-M0102240501001</p>
+          <p class="absolute title_h2">当前任务&nbsp;-&nbsp;<span style="color: #00b678;font-weight: 700;">{{ itemData[0].task_code }}</span></p>
         </div>
         <div class="zd-row content_wraper">
           <div class="zd-col-20">
             <div class="zd-row flexwrap item_wraper">
-              <div class="info_item" v-for="(e, i) in itemData" :key="i">
+              <div class="info_item">
                 <div class="box zd-row jccenter info_item_i">
-                  <div class="zd-col-8 item_label">{{ e.label }}</div>
-                  <div class="zd-col-16 item_value">{{ e.value }}<span class="item_unit">{{ e.unit }}</span></div>
+                  <div class="zd-col-8 item_label">库内料箱</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].vehicle_code }}<span class="item_unit"></span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">物料名称</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].material_name }}<span class="item_unit"></span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">规格</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].material_spec }}<span class="item_unit"></span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">数量</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].qty }}<span class="item_unit">个</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">需出数量</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].assign_qty }}<span class="item_unit">个</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">单重</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].single_weight }}<span class="item_unit">g</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">拣选称重</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].actual_weight }}<span class="item_unit">g</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">理论数量</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].theory_qty }}<span class="item_unit">个</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">箱内剩余</div>
+                  <div class="zd-col-16 item_value">{{ itemData[0].remaining_qty }}<span class="item_unit">个</span></div>
                 </div>
               </div>
             </div>
           </div>
-          <div class="zd-col-4 tip_wraper">
-            <div class="tip_txt">料箱D00001拣选成功！</div>
+          <div class="zd-col-4 tip_wraper" :class="itemData[0].assign_qty === itemData[0].theory_qty ? 'tip_wraper_bg1' : 'tip_wraper_bg2'">
+            <div class="tip_txt">料箱{{ itemData[0].vehicle_code }}<br/>{{itemData[0].assign_qty === itemData[0].theory_qty ? '拣选成功！' : '称重错误！'}}</div>
           </div>
         </div>
       </div>
-      <div class="relative n_wraper">
+      <div v-if="itemData.length >= 2" class="relative n_wraper">
         <div class="absolute bg_j bg_j_1"></div>
         <div class="absolute bg_j bg_j_2"></div>
         <div class="absolute bg_j bg_j_3"></div>
         <div class="absolute bg_j bg_j_4"></div>
         <div class="relative title_wraper">
-          <p class="relative title_h1">装配一车间</p>
-          <p class="absolute title_h2">当前任务-M0102240501001</p>
+          <p class="relative title_h1">装配二车间</p>
+          <p class="absolute title_h2">当前任务&nbsp;-&nbsp;<span style="color: #00b678;font-weight: 700;">{{ itemData[1].task_code }}</span></p>
         </div>
         <div class="zd-row content_wraper">
-          <div class="zd-col-20">
+          <div class="zd-col-24">
             <div class="zd-row flexwrap item_wraper">
-              <div class="info_item" v-for="(e, i) in itemData" :key="i">
+              <div class="info_item">
                 <div class="box zd-row jccenter info_item_i">
-                  <div class="item_label">{{ e.label }}</div>
-                  <div class="item_value">{{ e.value }}<span class="item_unit">{{ e.unit }}</span></div>
+                  <div class="zd-col-8 item_label">料箱号</div>
+                  <div class="zd-col-16 item_value">{{ itemData[1].vehicle_code }}<span class="item_unit"></span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">物料名称</div>
+                  <div class="zd-col-16 item_value">{{ itemData[1].material_name }}<span class="item_unit"></span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">规格</div>
+                  <div class="zd-col-16 item_value">{{ itemData[1].material_spec }}<span class="item_unit"></span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">数量</div>
+                  <div class="zd-col-16 item_value">{{ itemData[1].qty }}<span class="item_unit">个</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">需出数量</div>
+                  <div class="zd-col-16 item_value">{{ itemData[1].assign_qty }}<span class="item_unit">个</span></div>
+                </div>
+              </div>
+              <div class="info_item">
+                <div class="box zd-row jccenter info_item_i">
+                  <div class="zd-col-8 item_label">单重</div>
+                  <div class="zd-col-16 item_value">{{ itemData[1].single_weight }}<span class="item_unit">g</span></div>
                 </div>
               </div>
             </div>
           </div>
-          <div class="zd-col-4 tip_wraper">
-            <div class="tip_txt">料箱D00001拣选成功！</div>
-          </div>
         </div>
       </div>
     </div>
@@ -58,16 +142,55 @@
 
 <script>
 import THeader from '@components/header.vue'
+import { queryPickingPoint, pickingInfo } from '@js/getData2.js'
 export default {
   components: {
     THeader
   },
   data () {
     return {
-      itemData: [{label: '库内料箱', value: 'D00001'}, {label: '物料名称', value: '阀体部件'}, {label: '规格', value: 'LQF-X03-07A'}, {label: '数量', value: '50', unit: '个'}, {label: '需出数量', value: '15', unit: '个'}, {label: '单重', value: '135', unit: 'g'}, {label: '拣选称重', value: '2025', unit: 'g'}, {label: '理论数量', value: '15', unit: '个'}, {label: '箱内剩余', value: '35', unit: '个'}]
+      interTime: this.$store.getters.setTime,
+      timer: null,
+      options: [],
+      value: '',
+      itemData: []
+    }
+  },
+  created () {
+    this._queryPickingPoint()
+  },
+  beforeDestroy () {
+    if (this.timer !== null) {
+      clearInterval(this.timer)
     }
   },
   methods: {
+    refresh () {
+      this._pickingInfo()
+      this.timer = setInterval(() => {
+        this._pickingInfo()
+      }, this.interTime)
+    },
+    async _pickingInfo () {
+      let res = await pickingInfo(this.value)
+      this.itemData = [...res]
+    },
+    async _queryPickingPoint () {
+      let res = await queryPickingPoint()
+      this.options = [...res]
+      if (res.length > 0) {
+        this.value = res[0].code
+        this.refresh()
+      }
+    },
+    change (e) {
+      if (e) {
+        if (this.timer !== null) {
+          clearInterval(this.timer)
+        }
+        this.refresh()
+      }
+    }
   }
 }
 </script>
diff --git a/src/pages/modules/index2.vue b/src/pages/modules/index2.vue
index e0f36d6..cc8a0c0 100644
--- a/src/pages/modules/index2.vue
+++ b/src/pages/modules/index2.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="box relative">
-    <t-header title1="仓储监控" title2="恒森集团WMS仓储看板"></t-header>
+    <t-header type="1" title1="仓储监控" title2="恒森集团WMS仓储看板"></t-header>
     <div class="box body_container">
       <div class="relative b_title">
         <span class="absolute sj_icon"></span>
@@ -16,20 +16,20 @@
             <p class="title">货位使用</p>
             <div class="zd-row wraper_4">
               <div class="box percent_item">
-                <p>60%</p>
+                <p>{{ lx_used.percent }}</p>
               </div>
               <div class="box zd-col-16 zd-row flexcol">
                 <div class="zd-row">
                   <p class="zd-col-8 item_label">总货位数</p>
-                  <p class="zd-col-16 item_value">20574<span class="item_unit">个</span></p>
+                  <p class="zd-col-16 item_value">{{ lx_used.total }}<span class="item_unit">个</span></p>
                 </div>
                 <div class="zd-row">
                   <p class="zd-col-8 item_label">已用货位</p>
-                  <p class="zd-col-16 item_value">20574<span class="item_unit">个</span></p>
+                  <p class="zd-col-16 item_value">{{ lx_used.used }}<span class="item_unit">个</span></p>
                 </div>
                 <div class="zd-row">
                   <p class="zd-col-8 item_label">空余货位</p>
-                  <p class="zd-col-16 item_value">20574<span class="item_unit">个</span></p>
+                  <p class="zd-col-16 item_value">{{ lx_used.free }}<span class="item_unit">个</span></p>
                 </div>
               </div>
             </div>
@@ -40,14 +40,32 @@
             <div class="absolute bg_j bg_j_3"></div>
             <div class="absolute bg_j bg_j_4"></div>
             <p class="title">今日出入库</p>
-            <div class="wraper_4 zd-row flexcol jccenter">
-              <div class="zd-row">
-                <div class="zd-col-4 item_label">入库</div>
-                <div class="zd-col-20 item_value font_1">总数量：1500   箱数:30箱    耗时:1.5h</div>
+            <div v-if="lx_task.length > 1" class="wraper_4 zd-row flexcol jccenter">
+              <div class="zd-row flexstart mgb8">
+                <div class="zd-col-3 item_label">入库</div>
+                <div class="zd-col-20">
+                  <div class="percent_line">
+                    <div class="percent_i" :style="{'width': lx_task[0].total !== 0 ? lx_task[0].box / lx_task[0].total * 100 + '100%' : 0}"></div>
+                  </div>
+                  <div class="zd-row">
+                    <p class="item_label">总数量：{{ lx_task[0].total }}</p>
+                    <p class="item_label">箱数：{{ lx_task[0].box }}箱</p>
+                    <p class="item_label">耗时：{{ lx_task[0].time }}</p>
+                  </div>
+                </div>
               </div>
-              <div class="zd-row">
-                <div class="zd-col-4 item_label">出库</div>
-                <div class="zd-col-20 item_value font_1">总数量：1500   箱数:30箱    耗时:1.5h</div>
+              <div class="zd-row flexstart">
+                <div class="zd-col-3 item_label">出库</div>
+                <div class="zd-col-20">
+                  <div class="percent_line">
+                    <div class="percent_i" :style="{'width': lx_task[1].total !== 0 ? lx_task[1].box / lx_task[1].total * 100 + '100%' : 0}"></div>
+                  </div>
+                  <div class="zd-row">
+                    <p class="item_label">总数量：{{ lx_task[1].total }}</p>
+                    <p class="item_label">箱数：{{ lx_task[1].box }}箱</p>
+                    <p class="item_label">耗时：{{ lx_task[1].time }}</p>
+                  </div>
+                </div>
               </div>
             </div>
           </div>
@@ -63,15 +81,13 @@
               <div class="box zd-col-11">
                 <div ref="echartsRef1" style="width: 100%; height: 100%;"></div>
               </div>
-              <div class="box zd-col-13 zd-row flexwrap jcflexstart">
-                <div class="zd-col-11 zd-row flexstart" v-for="(e, i) in materList.slice(1)" :key="i">
+              <div class="box zd-col-13 zd-row flexwrap jcflexstart aligncenter">
+                <div class="zd-col-12 zd-row flexstart pie_item_wrap" v-for="(e, i) in lx_inventory.slice(1)" :key="i">
                   <div class="pie_legend_icon" :style="{'backgroundColor': ['#1980EA', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad'][i]}"></div>
                   <div class="zd-col-24">
                     <p class="pie_legend_txt_1">{{ e.name }}</p>
-                    <div class="zd-row jcflexstart">
-                      <p class="pie_legend_txt_2">{{ e.count }}</p>
-                      <p class="pie_legend_txt_3">{{ e.percent }}</p>
-                    </div>
+                    <p class="pie_legend_txt_2">{{ e.qty }}</p>
+                    <p class="pie_legend_txt_3">{{ e.percent }}</p>
                   </div>
                 </div>
               </div>
@@ -105,20 +121,20 @@
             <p class="title">货位使用</p>
             <div class="zd-row wraper_4">
               <div class="box percent_item">
-                <p>60%</p>
+                <p>{{ tp_used.percent }}</p>
               </div>
               <div class="box zd-col-16 zd-row flexcol">
                 <div class="zd-row">
                   <p class="zd-col-8 item_label">总货位数</p>
-                  <p class="zd-col-16 item_value">20574<span class="item_unit">个</span></p>
+                  <p class="zd-col-16 item_value">{{ tp_used.total }}<span class="item_unit">个</span></p>
                 </div>
                 <div class="zd-row">
                   <p class="zd-col-8 item_label">已用货位</p>
-                  <p class="zd-col-16 item_value">20574<span class="item_unit">个</span></p>
+                  <p class="zd-col-16 item_value">{{ tp_used.used }}<span class="item_unit">个</span></p>
                 </div>
                 <div class="zd-row">
                   <p class="zd-col-8 item_label">空余货位</p>
-                  <p class="zd-col-16 item_value">20574<span class="item_unit">个</span></p>
+                  <p class="zd-col-16 item_value">{{ tp_used.free }}<span class="item_unit">个</span></p>
                 </div>
               </div>
             </div>
@@ -129,14 +145,32 @@
             <div class="absolute bg_j bg_j_3"></div>
             <div class="absolute bg_j bg_j_4"></div>
             <p class="title">今日出入库</p>
-            <div class="wraper_4 zd-row flexcol jccenter">
-              <div class="zd-row">
-                <div class="zd-col-4 item_label">入库</div>
-                <div class="zd-col-20 item_value font_1">总数量：1500   箱数:30箱    耗时:1.5h</div>
+            <div v-if="tp_task.length > 1" class="wraper_4 zd-row flexcol jccenter">
+              <div class="zd-row flexstart mgb8">
+                <div class="zd-col-3 item_label">入库</div>
+                <div class="zd-col-20">
+                  <div class="percent_line">
+                    <div class="percent_i" :style="{'width': tp_task[0].total !== 0 ? tp_task[0].box / tp_task[0].total * 100 + '100%' : 0}"></div>
+                  </div>
+                  <div class="zd-row">
+                    <p class="item_label">总数量：{{ tp_task[0].total }}</p>
+                    <p class="item_label">箱数：{{ tp_task[0].box }}箱</p>
+                    <p class="item_label">耗时：{{ tp_task[0].time }}</p>
+                  </div>
+                </div>
               </div>
-              <div class="zd-row">
-                <div class="zd-col-4 item_label">出库</div>
-                <div class="zd-col-20 item_value font_1">总数量：1500   箱数:30箱    耗时:1.5h</div>
+              <div class="zd-row flexstart">
+                <div class="zd-col-3 item_label">出库</div>
+                <div class="zd-col-20">
+                  <div class="percent_line">
+                    <div class="percent_i" :style="{'width': tp_task[1].total !== 0 ? tp_task[1].box / tp_task[1].total * 100 + '100%' : 0}"></div>
+                  </div>
+                  <div class="zd-row">
+                    <p class="item_label">总数量：{{ tp_task[1].total }}</p>
+                    <p class="item_label">箱数：{{ tp_task[1].box }}箱</p>
+                    <p class="item_label">耗时：{{ tp_task[1].time }}</p>
+                  </div>
+                </div>
               </div>
             </div>
           </div>
@@ -153,12 +187,12 @@
                 <div ref="echartsRef3" style="width: 100%; height: 100%;"></div>
               </div>
               <div class="box zd-col-13 zd-row flexwrap jcflexstart">
-                <div class="zd-col-11 zd-row flexstart" v-for="(e, i) in materList.slice(1)" :key="i">
+                <div class="zd-col-11 zd-row flexstart" v-for="(e, i) in tp_inventory.slice(1)" :key="i">
                   <div class="pie_legend_icon" :style="{'backgroundColor': ['#1980EA', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad'][i]}"></div>
                   <div class="zd-col-24">
                     <p class="pie_legend_txt_1">{{ e.name }}</p>
                     <div class="zd-row jcflexstart">
-                      <p class="pie_legend_txt_2">{{ e.count }}</p>
+                      <p class="pie_legend_txt_2">{{ e.qty }}</p>
                       <p class="pie_legend_txt_3">{{ e.percent }}</p>
                     </div>
                   </div>
@@ -186,7 +220,7 @@
 
 <script>
 import THeader from '@components/header.vue'
-import { getAllBigScreen } from '@js/mork2.js'
+import { synthesizeInfo } from '@js/getData2.js'
 export default {
   components: {
     THeader
@@ -200,7 +234,17 @@ export default {
       myChart1: null,
       myChart2: null,
       myChart3: null,
-      myChart4: null
+      myChart4: null,
+      lx_in_week: [], // 料箱库入库趋势
+      lx_out_week: [], // 料箱库出库趋势
+      tp_in_week: [], // 托盘库入库趋势
+      tp_out_week: [], // 托盘库出库趋势
+      lx_inventory: [], // 料箱实时库存
+      tp_inventory: [], // 托盘实时库存
+      lx_used: {}, // 料箱货位使用
+      tp_used: {}, // 托盘库货位使用
+      lx_task: [], // 料箱今日出入库
+      tp_task: [] // 托盘库今日出入库
     }
   },
   created () {
@@ -213,6 +257,9 @@ export default {
     this.myChart4 = this.$echarts.init(this.$refs.echartsRef4)
   },
   destroyed () {
+    if (this.timer !== null) {
+      clearInterval(this.timer)
+    }
     if (this.myChart1 !== null) {
       this.myChart1.dispose()
       this.myChart1 = null
@@ -232,15 +279,23 @@ export default {
   },
   methods: {
     refresh () {
-      this._allDeviceStatus()
+      this._synthesizeInfo()
       this.timer = setInterval(() => {
-        this._allDeviceStatus()
+        this._synthesizeInfo()
       }, this.interTime)
     },
-    async _allDeviceStatus () {
-      let res = await getAllBigScreen()
-      this.materList = [...res.inventoryAnalysis]
-      this.historyList = [...res.historyInventoryIOAnalysis]
+    async _synthesizeInfo () {
+      let res = await synthesizeInfo()
+      this.lx_used = res.lx_used
+      this.tp_used = res.tp_used
+      this.lx_in_week = [...res.lx_in_week]
+      this.lx_out_week = [...res.lx_out_week]
+      this.lx_task = [...res.lx_task]
+      this.tp_task = [...res.tp_task]
+      this.tp_in_week = [...res.tp_in_week]
+      this.tp_out_week = [...res.tp_out_week]
+      this.lx_inventory = [...res.lx_inventory]
+      this.tp_inventory = [...res.tp_inventory]
       this.setEchart1()
       this.setEchart2()
       this.setEchart3()
@@ -250,13 +305,12 @@ export default {
       let colors = ['#1980EA', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad']
       let colorListIn = ['rgba(15, 45, 115,  .1)', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad']
       let colorListOut = ['#1980EA', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)']
-      let seriesData = this.materList.slice(1)
+      let seriesData = this.lx_inventory.slice(1)
       seriesData.map(el => {
-        el.value = el.count
+        el.value = el.qty
         el.name = el.name
-        seriesData.push(el.name)
       })
-      let total = this.materList[0].count
+      let total = this.lx_inventory[0].total
       let option = {
         color: colors,
         grid: {
@@ -376,17 +430,15 @@ export default {
       this.myChart1.setOption(option, true)
     },
     setEchart2 () {
-      let total = 0
-      this.historyList.map(el => {
-        total = Math.max(total, Number(el.total_instorage_qty), Number(el.total_outstorage_qty))
-      })
       let barName = []
       let barData1 = []
       let barData2 = []
-      this.historyList.map(el => {
-        barName.push(el.data)
-        barData1.push(el.total_instorage_qty)
-        barData2.push(el.total_outstorage_qty)
+      this.lx_in_week.map(el => {
+        barData1.push(el.total_qty)
+      })
+      this.lx_out_week.map(el => {
+        barName.push(el.date)
+        barData2.push(el.total_qty)
       })
       let option = {
         grid: {
@@ -427,31 +479,7 @@ export default {
             rotate: 45,
             color: '#7591B2',
             fontSize: 12,
-            lineHeight: 12,
-            // align: 'right',
-            margin: 5
-            // formatter: (value) => {
-            //   let str = ''
-            //   let num = 5
-            //   let valLength = value.length
-            //   let rowNum = Math.ceil(valLength / num)
-            //   if (rowNum > 1) {
-            //     for (let i = 0; i < rowNum; i++) {
-            //       let temp = ''
-            //       let start = i * num
-            //       let end = start + num
-            //       if (i === rowNum - 1) {
-            //         temp = value.substring(start, end)
-            //       } else {
-            //         temp = value.substring(start, end) + '\n'
-            //       }
-            //       str += temp
-            //     }
-            //     return str
-            //   } else {
-            //     return value
-            //   }
-            // }
+            lineHeight: 12
           },
           data: barName
         },
@@ -475,8 +503,8 @@ export default {
               type: [2, 1],
               color: '#455C86'
             }
-          },
-          max: total
+          }
+          // max: total
         },
         series: [
           {
@@ -537,13 +565,12 @@ export default {
       let colors = ['#1980EA', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad']
       let colorListIn = ['rgba(15, 45, 115,  .1)', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad']
       let colorListOut = ['#1980EA', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)', 'rgba(15, 45, 115,  .1)']
-      let seriesData = this.materList.slice(1)
+      let seriesData = this.tp_inventory.slice(1)
       seriesData.map(el => {
-        el.value = el.count
+        el.value = el.qty
         el.name = el.name
-        seriesData.push(el.name)
       })
-      let total = this.materList[0].count
+      let total = this.tp_inventory[0].total
       let option = {
         color: colors,
         grid: {
@@ -663,17 +690,15 @@ export default {
       this.myChart3.setOption(option, true)
     },
     setEchart4 () {
-      let total = 0
-      this.historyList.map(el => {
-        total = Math.max(total, Number(el.total_instorage_qty), Number(el.total_outstorage_qty))
-      })
       let barName = []
       let barData1 = []
       let barData2 = []
-      this.historyList.map(el => {
-        barName.push(el.data)
-        barData1.push(el.total_instorage_qty)
-        barData2.push(el.total_outstorage_qty)
+      this.tp_in_week.map(el => {
+        barName.push(el.date)
+        barData1.push(el.total_qty)
+      })
+      this.tp_out_week.map(el => {
+        barData2.push(el.total_qty)
       })
       let option = {
         grid: {
@@ -714,31 +739,7 @@ export default {
             rotate: 45,
             color: '#7591B2',
             fontSize: 12,
-            lineHeight: 12,
-            // align: 'right',
-            margin: 5
-            // formatter: (value) => {
-            //   let str = ''
-            //   let num = 5
-            //   let valLength = value.length
-            //   let rowNum = Math.ceil(valLength / num)
-            //   if (rowNum > 1) {
-            //     for (let i = 0; i < rowNum; i++) {
-            //       let temp = ''
-            //       let start = i * num
-            //       let end = start + num
-            //       if (i === rowNum - 1) {
-            //         temp = value.substring(start, end)
-            //       } else {
-            //         temp = value.substring(start, end) + '\n'
-            //       }
-            //       str += temp
-            //     }
-            //     return str
-            //   } else {
-            //     return value
-            //   }
-            // }
+            lineHeight: 12
           },
           data: barName
         },
@@ -762,8 +763,7 @@ export default {
               type: [2, 1],
               color: '#455C86'
             }
-          },
-          max: total
+          }
         },
         series: [
           {
@@ -826,6 +826,8 @@ export default {
 
 <style lang="stylus" scoped>
 @import './style.stylus'
+.body_container
+  padding-top 38px
 .mgr8
   margin-right 8px
 .mgb8
diff --git a/src/pages/modules/index3.vue b/src/pages/modules/index3.vue
index ac8099b..7b51969 100644
--- a/src/pages/modules/index3.vue
+++ b/src/pages/modules/index3.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="box relative">
-    <t-header title1="领料出库" title2="恒森集团WMS仓储看板"></t-header>
+    <t-header type="1" title1="领料出库" title2="恒森集团WMS仓储看板"></t-header>
     <div class="box zd-row body_container">
       <div class="box zd-col-8">
         <div class="relative wraper_1 mgb8">
@@ -20,10 +20,10 @@
           <div class="absolute bg_j bg_j_4"></div>
           <p class="title">缓存库库存</p>
           <div class="zd-row wraper_2">
-            <div class="box zd-col-11">
+            <div class="box zd-col-9">
               <div ref="echartsRef2" style="width: 100%; height: 100%;"></div>
             </div>
-            <div class="box zd-col-13 zd-row flexwrap jcflexstart">
+            <div class="box zd-col-15 zd-row flexwrap jcflexstart">
               <div class="zd-col-11 zd-row flexstart" v-for="(e, i) in materList.slice(1)" :key="i">
                 <div class="pie_legend_icon" :style="{'backgroundColor': ['#1980EA', '#67D470', '#B4C9EF', '#BCBF5C', '#EF5252', '#6d5edd', '#bf41bb', '#f65621', '#21f6eb', '#64b0ad'][i]}"></div>
                 <div class="zd-col-24">
diff --git a/src/pages/modules/style.stylus b/src/pages/modules/style.stylus
index db954dc..d58fa0d 100644
--- a/src/pages/modules/style.stylus
+++ b/src/pages/modules/style.stylus
@@ -3,10 +3,12 @@
   overflow hidden
 .n_wraper
   width 100%
-  height calc(50% - 4px)
   border 1px solid #0c99ac
-  &:first-child
-    margin-bottom 8px
+  &:nth-child(1)
+    height calc(58% - 10px)
+    margin-bottom 10px
+  &:nth-child(2)
+    height 42%
 .title_wraper
   height 26px
   text-align center
@@ -37,24 +39,29 @@
 .item_wraper
   padding-right 3%
 .info_item
-  width 30%
-  height 50px
-  margin 6px 0
+  height 66px
   padding 3px
   border 1px solid #168abd
   border-radius 4px
+  &:nth-child(3n+1), &:nth-child(3n+3)
+    width 30%
   &:nth-child(3n+2)
-    margin-left 5%
-    margin-right 5%
+    width 36%
+    margin-left 2%
+    margin-right 2%
+  &:nth-child(4), &:nth-child(5), &:nth-child(6), &:nth-child(7), &:nth-child(8), &:nth-child(9)
+    margin-top 6px
 .info_item_i
   border-radius 2px
   box-shadow inset 0px 0px 5px 3px #1198bf
 .item_label
   font-size 13px
+  line-height 13px
   color #fff
   text-align right
 .item_value
-  font-size 16px
+  font-size 14px
+  line-height 14px
   color #5bd0f5
   font-weight 700
   text-align center
@@ -66,10 +73,17 @@
 .tip_wraper
   height 100%
   padding 3% 2% 0 2%
+.tip_wraper_bg1
+  background center 90% / 100% auto url('../../images/bg_tip.png') no-repeat
+  .tip_txt
+    color #00c8ed
+.tip_wraper_bg2
   background center 90% / 100% auto url('../../images/bg_tip_1.png') no-repeat
+  .tip_txt
+    color #9d5a00
 .tip_txt
   font-size 20px
-  color #67D470
+  text-align center
 .b_title
   height 20px
   padding-left 20px
@@ -88,6 +102,10 @@
   border-left 4px solid transparent
   border-right 4px solid #00d6ff
   border-bottom 4px solid #00d6ff
+.pie_item_wrap
+  min-height 32%
+  &:nth-child(n+3)
+    margin-top 10px
 .pie_legend_icon
   width 8px
   height 8px
@@ -101,7 +119,7 @@
   margin-bottom 4px
 .pie_legend_txt_2
   font-size 12px
-  line-height: 12px
+  line-height: 14px
   color: #fff
   margin-right 4px
 .pie_legend_txt_3
@@ -187,4 +205,13 @@
       padding 0 1px
       overflow hidden
       &:nth-child(1)
-        width 10%
\ No newline at end of file
+        width 10%
+.percent_line
+  height 10px
+  background-color #00ccf2
+  border-radius 10px
+  margin-bottom 2px
+.percent_i
+  height 10px
+  background-color #f5aa00
+  border-radius 10px
\ No newline at end of file
diff --git a/src/style/layout.styl b/src/style/layout.styl
index 285076a..62cf9cf 100644
--- a/src/style/layout.styl
+++ b/src/style/layout.styl
@@ -1,11 +1,16 @@
 @import 'mixin.styl'
 @import 'iconfont.styl'
 
-.state_0
-  background center / 100% 100% url('../images/state_0.png') no-repeat
-.state_1
-  background center / 100% 100% url('../images/state_1.png') no-repeat
-.state_2
-  background center / 100% 100% url('../images/state_2.png') no-repeat
-.state_3
-  background center / 100% 100% url('../images/state_3.png') no-repeat
\ No newline at end of file
+.header_select
+  width 200px
+  .el-input__inner
+    padding-left 38px
+    font-size: 19px;
+    font-weight: 700;
+    color: #fff;
+    text-align: center;
+    letter-spacing: 3px;
+    background-color: transparent;
+    border: none;
+  .el-select__caret
+    color: transparent !important
diff --git a/src/style/reset.css b/src/style/reset.css
index 947af85..d874c52 100644
--- a/src/style/reset.css
+++ b/src/style/reset.css
@@ -147,6 +147,10 @@ div, p {
 	align-items: flex-start !important;
 }
 
+.aligncenter {
+	align-content: center !important;
+}
+
 .jcflexstart {
 	justify-content: flex-start !important;
 }
diff --git a/src/vuex/modules/com.js b/src/vuex/modules/com.js
index 8307526..c12967b 100644
--- a/src/vuex/modules/com.js
+++ b/src/vuex/modules/com.js
@@ -1,32 +1,36 @@
 import * as types from '../types'
 import { getStore, setStore } from '@js/mUtils.js'
 
-const baseUrl = process.env.NODE_ENV === 'development' ? 'http://192.168.200.220:8010' : 'http://192.168.200.220:8010'
+const baseUrl = process.env.NODE_ENV === 'development' ? 'http://192.168.10.46:8018' : 'http://192.168.10.46:8018'
 /**
  * App通用配置
  */
 const state = {
   baseUrl: getStore('baseUrl') || baseUrl,
-  setTime: getStore('setTime') || 10000
+  setTime: getStore('setTime') || 10000,
+  pageNo: getStore('pageNo') || 1
 }
 
 const actions = {
   setConfig ({commit}, res) {
     setStore('baseUrl', res.baseUrl)
     setStore('setTime', res.setTime)
+    setStore('pageNo', res.pageNo)
     commit(types.COM_CONFIG, res)
   }
 }
 
 const getters = {
   baseUrl: state => state.baseUrl,
-  setTime: state => state.setTime
+  setTime: state => state.setTime,
+  pageNo: state => state.pageNo
 }
 
 const mutations = {
   [types.COM_CONFIG] (state, res) {
     state.baseUrl = res.baseUrl
     state.setTime = res.setTime
+    state.pageNo = res.pageNo
   }
 }