home

src/i18n/langs/en.js

@@ -9,12 +9,12 @@ module.exports = {
   },
   homeinfo: {
     topinfo: 'device info',
-    deviceinfo: 'device',
+    deviceinfo: 'Device information',
-    task: 'task',
+    task: 'Current task',
-    status: 'status',
+    status: 'Task status',
-    tasknum: 'task num',
+    tasknum: 'Number of tasks',
-    speed: 'speed',
+    speed: 'Current speed',
-    error: 'error'
+    error: 'AGV Fault'
   },
   carrypoint: {
     topinfo: 'pickup point',

src/pages/modules/home/home.1.vue

@@ -0,0 +1,236 @@
+<template>
+  <div class="main-container main-container_l">
+    <div class="con1">
+      <div class="tip" v-if="dataInfo.error_name">{{dataInfo.error_name}}</div>
+    </div>
+    <div class="con2">
+      <div class="rt">
+        <div class="rttxt">{{ $t('homeinfo.topinfo') }}</div>
+      </div>
+      <div class="rc">
+        <div class="infoli01">
+          <span class="title">{{ $t('homeinfo.deviceinfo') }}</span>
+          <span class="txt01">{{dataInfo.device_info}}</span>
+          <div class="line"></div>
+        </div>
+        <div class="infoli01">
+          <span class="title">{{ $t('homeinfo.task') }}</span>
+          <span class="txt01">{{dataInfo.task_name}}</span>
+          <span class="txt01">{{dataInfo.task_info}}</span>
+          <div class="line"></div>
+        </div>
+        <div class="infoli">
+          <span class="title">{{ $t('homeinfo.status') }}</span>
+          <span class="txt">{{dataInfo.task_status}}</span>
+          <div class="line"></div>
+        </div>
+        <div class="infoli">
+          <span class="title">{{ $t('homeinfo.tasknum') }}</span>
+          <span class="txt">{{dataInfo.task_num}}</span>
+          <div class="line"></div>
+        </div>
+        <div class="infoli infoli3">
+          <span class="title">{{ $t('homeinfo.speed') }}</span>
+          <span class="txt">{{dataInfo.speed}}</span>
+          <div class="speed-bg"></div>
+          <div class="line" style="top: 110px"></div>
+        </div>
+        <div class="infoli infoli3">
+          <span class="title">{{ $t('homeinfo.error') }}</span>
+          <span class="txt txt2">{{dataInfo.error_name}}</span>
+        </div>
+        <button class="btn" v-if="dataInfo.button_name" @click="clickSave">{{dataInfo.button_name}}</button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {queryHomePage, clickSave} from '@/config/getData.js'
+import NavBar from '@components/NavBar.vue'
+export default {
+  name: 'Home',
+  components: {
+    NavBar
+  },
+  data () {
+    return {
+      interTime: this.$store.getters.setTime,
+      timer: null,
+      // dataInfo: {}
+      // dataInfo: {
+      //   device_info: 'NobleLiftPS10LMT_HuaHai',
+      //   task_name: '无',
+      //   task_status: '有任务未执行',
+      //   task_num: '待执行',
+      //   speed: '0.0m/s',
+      //   error_name: '障碍物告警',
+      //   button_name: '继续搬运'
+      // }
+      dataInfo: {
+        device_info: 'NobleLiftPS10LMT_HuaHai',
+        task_name: '任务号：11322',
+        task_info: '目标点：5',
+        task_status: '执行中',
+        task_num: '待执行0/2',
+        speed: '0.0m/s',
+        error_name: '正常运行',
+        button_name: '确认完成继续下个任务'
+      }
+    }
+  },
+  created () {
+    this.initData()
+    this.refresh()
+  },
+  beforeDestroy () {
+    clearInterval(this.timer)
+  },
+  methods: {
+    refresh () {
+      this.timer = setInterval(() => {
+        this.initData()
+      }, this.interTime)
+    },
+    async initData () {
+      let res = await queryHomePage()
+      if (res.code === '1') {
+        this.dataInfo = res.result
+      } else {
+        this.toast(res.desc)
+      }
+    },
+    async clickSave () {
+      if (!this.dataInfo.button_name) {
+        return
+      }
+      let res = await clickSave(this.dataInfo.button_code)
+      if (res.code === '1') {
+        this.toast(res.desc)
+        this.initData()
+      } else {
+        this.toast(res.desc)
+      }
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+@import '~@style/mixin'
+.main-container_l
+  width 100%
+  padding-left 53px
+.con1
+  float left
+  position relative
+  width 811px
+  height 776px
+  // background center / 100% 100% url(../../../images/aio/car2.png) no-repeat
+  background center / 100% 100% url(../../../images/new/car-home.png) no-repeat
+  // background center / 100% 100% url(../../../images/aio/AGV223.gif) no-repeat
+  margin-right 235px
+  .tip
+    width 542px
+    height 120px
+    line-height 120px
+    color #FF907F
+    font-style italic
+    font-size 36px
+    text-align center
+    margin-top 153px
+    margin-left 63px
+    background center / 100% 100% url(../../../images/new/bg-home-tip.png) no-repeat
+.con2
+  float left
+.btn
+  width 410px
+  height 91px
+  background center / 100% 100% url(../../../images/new/button.png) no-repeat
+  margin-left 127px
+  position relative
+  top -30px
+  color #f6f9fe
+  font-size 32px
+.rt
+  width 646px
+  height 102px
+  font-size 36px
+  font-style italic
+  color #F6F9FE
+  background center / 100% 100% url(../../../images/new/bg-home-r1.png) no-repeat
+  .rttxt
+    margin-left 31px
+    padding-top 40px
+.rc
+  width 652px
+  height 697px
+  font-size 36px
+  color #B4C1D8
+  background center / 100% 100% url(../../../images/new/bg-home-r2.png) no-repeat
+  position relative
+  top -10px
+.infoli01
+  width 542px
+  height 140px
+  margin 0 auto
+  padding-top 45px
+  .title
+    float left
+    display inline-block
+    color #f6f9fe
+    width 30%
+  .txt01
+    float left
+    display inline-block
+    color #3CC1FF
+    margin-left 34px
+    width 330px
+    line-height 36px
+    word-wrap break-word
+    font-size 30px
+.infoli
+  width 542px
+  line-height 94px
+  height 94px
+  margin 0 auto
+  .title
+    float left
+    display inline-block
+    color #f6f9fe
+    width 30%
+  .txt
+    float left
+    display inline-block
+    color #3CC1FF
+    margin-left 34px
+    font-size 30px
+.infoli3
+  line-height 94px
+  height 124px
+  .title
+    float left
+    display inline-block
+    color #f6f9fe
+    width 30%
+  .txt
+    float left
+    display inline-block
+    color #3CC1FF
+    margin-left 34px
+    font-size 30px
+.speed-bg
+  width 513px
+  height 12px
+  background center / 100% 100% url(../../../images/new/bg-home-r3.png) no-repeat
+  position relative
+  top 95px
+.line
+  width 543px
+  height 1px
+  background center / 100% 100% url(../../../images/new/bg-home-r4.png) no-repeat
+  position relative
+  top 92px
+.txt2
+  color #E54F29 !important
+</style>

src/pages/modules/home/home.vue

@@ -147,13 +147,13 @@ export default {
   width 410px
   height 91px
   background center / 100% 100% url(../../../images/new/button.png) no-repeat
-  margin-left 127px
+  margin-left 187px
   position relative
   top -30px
   color #f6f9fe
   font-size 32px
 .rt
-  width 646px
+  width 746px
   height 102px
   font-size 36px
   font-style italic
@@ -163,7 +163,7 @@ export default {
     margin-left 31px
     padding-top 40px
 .rc
-  width 652px
+  width 752px
   height 697px
   font-size 36px
   color #B4C1D8
@@ -171,39 +171,41 @@ export default {
   position relative
   top -10px
 .infoli01
-  width 542px
+  width 742px
   height 140px
   margin 0 auto
   padding-top 45px
+  padding-left 40px
   .title
     float left
     display inline-block
     color #f6f9fe
-    width 30%
+    width 48%
   .txt01
     float left
     display inline-block
     color #3CC1FF
-    margin-left 34px
+    // margin-left 34px
     width 330px
     line-height 36px
     word-wrap break-word
     font-size 30px
 .infoli
-  width 542px
+  width 742px
   line-height 94px
   height 94px
   margin 0 auto
+  padding-left 40px
   .title
     float left
     display inline-block
     color #f6f9fe
-    width 30%
+    width 48%
   .txt
     float left
     display inline-block
     color #3CC1FF
-    margin-left 34px
+    // margin-left 34px
     font-size 30px
 .infoli3
   line-height 94px
@@ -212,12 +214,12 @@ export default {
     float left
     display inline-block
     color #f6f9fe
-    width 30%
+    width 48%
   .txt
     float left
     display inline-block
     color #3CC1FF
-    margin-left 34px
+    // margin-left 34px
     font-size 30px
 .speed-bg
   width 513px
@@ -226,7 +228,8 @@ export default {
   position relative
   top 95px
 .line
-  width 543px
+  width 95%
+  // width 543px
   height 1px
   background center / 100% 100% url(../../../images/new/bg-home-r4.png) no-repeat
   position relative