huojin
/
Byd_Dg_Web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

no message

main
奥德彪本彪\92525 2024-09-15 18:42:26 +08:00
parent a082015468
commit b3d70503ac
3 changed files with 127 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
src/App.vue
View File

@ -1,10 +1,64 @@
<template> <template>
<div id="app"> <div id="app">
<router-view /> <router-view/>
</div> </div>
</template> </template>
<script> <script>
import stockUrl from '@/api/stock'
export default { export default {
name: 'App' name: 'App',
data() {
return {
msg: '',
websock: null
}
},
mounted() {
stockUrl.stockMsg(null)
this.initWebSocket()
},
methods: {
initWebSocket() {
const wsUri = (process.env.VUE_APP_WS_API === '/' ? '/' : (process.env.VUE_APP_WS_API + '/')) + 'webSocket/stock'
this.websock = new WebSocket(wsUri)
this.websock.onerror = this.webSocketOnError
this.websock.onmessage = this.webSocketOnMessage
},
webSocketOnError(e) {
this.$notify({
title: 'WebSocket连接发生错误',
type: 'error',
duration: 0
})
}, webSocketOnMessage(e) {
const data = JSON.parse(e.data)
if (data.msgType === 'INFO') {
this.msg = data.msg
if (this.msg) {
this.$notify({
title: '消息通知',
message: data.msg,
dangerouslyUseHTMLString: true,
type: 'success',
offset: 50,
duration: 0
})
}
} else if (data.msgType === 'ERROR') {
this.$notify({
title: '',
message: data.msg,
dangerouslyUseHTMLString: true,
type: 'error',
duration: 0
})
}
},
webSocketSend(agentData) {
this.websock.send(agentData)
}
}
} }
</script> </script>

6
src/api/stock.js
View File

@ -80,11 +80,11 @@ export function getItemCode(stockCode) {
}) })
} }
export function stockMsg(data) { export function stockMsg(msg) {
return request({ return request({
url: 'api/stock/stockMsg', url: 'api/stock/stockMsg',
method: 'post', method: 'get',
data params:{msg}
}) })
} }

134
src/views/databigscreen/DeptData.vue
View File

@ -12,14 +12,14 @@
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<img :src="imageUrl" style="weight: 16px;height: 16px;" v-if="msg"> <img :src="imageUrl" style="weight: 16px;height: 16px;" v-if="msg">
<div style="flex-grow: 1; overflow: hidden;"> <div style="flex-grow: 1; overflow: hidden;">
<vue-marquee <vue-marquee
:speed="10" :speed="10"
:delayTime="500" :delayTime="500"
:mouseover="true" :mouseover="true"
color="red" color="red"
direction="left" direction="left"
> >
<span style="font-size: 18px;font-weight: bold">{{ msg }}</span> <span style="font-size: 18px;font-weight: bold">{{ msg }}</span>
@ -56,8 +56,9 @@
</div> </div>
<dv-scroll-board <dv-scroll-board
:config="this.config2" :config="this.config2"
style="width: 365px; height: 280px;margin-left:10px;"/> style="width: 365px; height: 280px;margin-left:10px;"
/>
</dv-border-box-8> </dv-border-box-8>
</div> </div>
@ -70,12 +71,13 @@
<div class="div5"> <div class="div5">
<el-pagination <el-pagination
background background
layout="prev, pager, next" layout="prev, pager, next"
@current-change="handleCurrentClick" @current-change="handleCurrentClick"
:current-page="currentPage" :current-page="currentPage"
:page-size="pageSize" :page-size="pageSize"
:total="total"> :total="total"
>
</el-pagination> </el-pagination>
</div> </div>
</dv-border-box-11> </dv-border-box-11>
@ -84,14 +86,14 @@
</template> </template>
<script> <script>
import * as echarts from 'echarts'; import * as echarts from 'echarts'
import moment from "moment"; import moment from 'moment'
import crudPoint from "@/api/point"; import crudPoint from '@/api/point'
import crudAgvTask from "@/api/agvTask" import crudAgvTask from '@/api/agvTask'
import CRUD from "@crud/crud"; import CRUD from '@crud/crud'
import 'echarts-gl'; import 'echarts-gl'
import VueMarquee from 'aring-vue-marquee'; import VueMarquee from 'aring-vue-marquee'
import stockUrl from "@/api/stock"; import stockUrl from '@/api/stock'
export default { export default {
name: 'DeptData', name: 'DeptData',
@ -101,7 +103,8 @@ export default {
data() { data() {
return { return {
msg: '', msg: '',
imageUrl: require("@/assets/images/igw-l-news-noticewhite.png"), websock: null,
imageUrl: require('@/assets/images/igw-l-news-noticewhite.png'),
total: 0, total: 0,
pageSize: 25, pageSize: 25,
currentPage: 1, currentPage: 1,
@ -132,7 +135,7 @@ export default {
{ {
name: '西峡', name: '西峡',
value: 98 value: 98
}, }
] ]
}, },
config2: { config2: {
@ -145,7 +148,7 @@ export default {
carousel: 'page', carousel: 'page',
rowNum: 8, rowNum: 8,
indexHeader: '序号' indexHeader: '序号'
}, }
} }
}, },
computed: { computed: {
@ -157,36 +160,39 @@ export default {
//销毁前关闭计时器 //销毁前关闭计时器
beforeDestroy() { beforeDestroy() {
this.clearTimer() this.clearTimer()
if (this.websock && this.websock.readyState === WebSocket.OPEN) {
this.websock.close()
}
}, },
mounted() { mounted() {
//初始化 //初始化
setInterval(this.updateTime, 1000);//自动读秒 setInterval(this.updateTime, 1000)//自动读秒
this.getInit()//树状图 this.getInit()//树状图
this.queryAgvTaskInfo();//AGV任务列表 this.queryAgvTaskInfo()//AGV任务列表
this.queryListInfo(this.currentPage, this.pageSize)//库位图 this.queryListInfo(this.currentPage, this.pageSize)//库位图
this.intervalId = setInterval(this.printNextItem, 5000);//定时分页调用 this.intervalId = setInterval(this.printNextItem, 5000)//定时分页调用
this.stockMsg(); stockUrl.stockMsg(null)
this.initWebSocket(); this.initWebSocket()
}, },
methods: { methods: {
updateTime() { updateTime() {
this.currentTime = moment().format('YYYY-MM-DD HH:mm:ss'); this.currentTime = moment().format('YYYY-MM-DD HH:mm:ss')
let weekMap = { let weekMap = {
1: "一", 1: '一',
2: "二", 2: '二',
3: '三', 3: '三',
4: "四", 4: '四',
5: "五", 5: '五',
6: "六", 6: '六',
0: "日", 0: '日'
}; }
this.dayOfWeek = weekMap[moment().day()]; this.dayOfWeek = weekMap[moment().day()]
}, },
//界面显示 //界面显示
getInit() { getInit() {
var chartDom = document.getElementById("main") var chartDom = document.getElementById('main')
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom)
var option; var option
option = { option = {
xAxis: { xAxis: {
type: 'category', type: 'category',
@ -207,30 +213,30 @@ export default {
type: 'bar', type: 'bar',
itemStyle: { itemStyle: {
color: '#4675C0' color: '#4675C0'
}, }
} }
] ]
}; }
option && myChart.setOption(option); option && myChart.setOption(option)
}, },
//任务列表 //任务列表
queryAgvTaskInfo() { queryAgvTaskInfo() {
crudAgvTask.queryAgvTaskInfo().then(res => { crudAgvTask.queryAgvTaskInfo().then(res => {
const cf = this.config2 const cf = this.config2
cf.data = res.data cf.data = res.data
this.config2 = null; this.config2 = null
setTimeout(() => { setTimeout(() => {
this.config2 = cf this.config2 = cf
}, 500) }, 500)
}).catch(() => { }).catch(() => {
this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR); this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR)
}) })
}, },
//库位图 //库位图
queryListInfo(currentPage, pageSize) { queryListInfo(currentPage, pageSize) {
const CurrentPage = {currentPage: currentPage, pageSize: pageSize} const CurrentPage = { currentPage: currentPage, pageSize: pageSize }
crudPoint.queryPointInfo(CurrentPage).then(res => { crudPoint.queryPointInfo(CurrentPage).then(res => {
this.total = Number(res.data.total) this.total = Number(res.data.total)
this.divs = res.data.data this.divs = res.data.data
@ -239,7 +245,7 @@ export default {
this.collection.push(i) this.collection.push(i)
} }
}).catch(() => { }).catch(() => {
this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR); this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR)
}) })
}, },
@ -247,12 +253,12 @@ export default {
if (this.total > 0 && this.collection.length > 0) { if (this.total > 0 && this.collection.length > 0) {
if (this.currentIndex < this.collection.length - 1) { if (this.currentIndex < this.collection.length - 1) {
this.currentIndex++; this.currentIndex++
this.queryListInfo(this.collection[this.currentIndex], this.pageSize); this.queryListInfo(this.collection[this.currentIndex], this.pageSize)
this.handleCurrentChange(this.collection[this.currentIndex]) this.handleCurrentChange(this.collection[this.currentIndex])
} else { } else {
this.currentIndex = 0; // 循环到集合的末尾时，重新开始 this.currentIndex = 0 // 循环到集合的末尾时，重新开始
this.queryListInfo(this.collection[this.currentIndex], this.pageSize); this.queryListInfo(this.collection[this.currentIndex], this.pageSize)
this.handleCurrentChange(this.collection[this.currentIndex]) this.handleCurrentChange(this.collection[this.currentIndex])
} }
} }
@ -260,25 +266,25 @@ export default {
}, },
autoGrid(total, page) { autoGrid(total, page) {
//手动生成库位图 //手动生成库位图
const start = ((page - 1) * this.pageSize) + 1; const start = ((page - 1) * this.pageSize) + 1
const end = start + this.pageSize;//个数 const end = start + this.pageSize//个数
this.divs = []; this.divs = []
for (let i = start; i <= end; i++) { for (let i = start; i <= end; i++) {
const newItem = `Item ${+i}`; const newItem = `Item ${+i}`
this.$set(this.divs, this.divs.length, newItem); this.$set(this.divs, this.divs.length, newItem)
} }
}, },
handleCurrentChange(newPage) { handleCurrentChange(newPage) {
this.currentPage = newPage; this.currentPage = newPage
}, },
handleCurrentClick(newPage) { handleCurrentClick(newPage) {
this.queryListInfo(newPage, this.pageSize) this.queryListInfo(newPage, this.pageSize)
}, },
clearTimer() { clearTimer() {
if (this.intervalId) { if (this.intervalId) {
clearInterval(this.intervalId); clearInterval(this.intervalId)
this.intervalId = null; this.intervalId = null
} }
}, },
initWebSocket() { initWebSocket() {
@ -299,7 +305,7 @@ export default {
this.msg = data.msg this.msg = data.msg
} else if (data.msgType === 'ERROR') { } else if (data.msgType === 'ERROR') {
this.$notify({ this.$notify({
title: '', title: '消息通知',
message: data.msg, message: data.msg,
dangerouslyUseHTMLString: true, dangerouslyUseHTMLString: true,
type: 'error', type: 'error',
@ -309,14 +315,10 @@ export default {
}, },
webSocketSend(agentData) { webSocketSend(agentData) {
this.websock.send(agentData) this.websock.send(agentData)
},
stockMsg() {
stockUrl.stockMsg()
} }
} }
} }
</script> </script>