| | |
| | | <div class="kb_right kb_pd10"> |
| | | <div class="kb_right_top kb_pd10"> |
| | | <div class="kb_right_top_content"> |
| | | <div class="content_head kb_title_text" style="margin-top: 30px;">产品库存量排行Top5</div> |
| | | <div class="content_head kb_title_text" style="margin-top: 30px;">半成品、产品库存量排行Top5</div> |
| | | <div class="content_body" style="height:402px;"> |
| | | <div id="bar03" style="width: 100%;height:100%" /> |
| | | </div> |
| | | <div class="content_head kb_title_text" style="margin-top: 12px">半成品库存量排行Top5</div> |
| | | <!-- <div class="content_head kb_title_text" style="margin-top: 12px">半成品库存量排行Top5</div>--> |
| | | <div class="content_head kb_title_text" style="margin-top: 12px">原材料库存量排行Top5</div> |
| | | <div class="content_body"> |
| | | <div id="bar04" style="width: 100%;height:100%" /> |
| | | </div> |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | tableDataTop: [], |
| | | tableDataBottom: [], |
| | |
| | | number2: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | tableTopTask: null, |
| | | tableBottomTask: null, |
| | | echartsRightTop: null, |
| | | echartsRightBottom: null |
| | | |
| | | } |
| | | }, |
| | | |
| | | created() { |
| | | setInterval(this.getNowTime, 1000) |
| | | |
| | | // 两小时看板刷新一次 |
| | | setInterval(() => { |
| | | window.location.reload() |
| | | }, 1000 * 60 * 120) |
| | | }, |
| | | mounted() { |
| | | this.getWareHouseTopLeftData() |
| | | this.getWareHouseTopBottomData() |
| | | this.getEcharts() |
| | | |
| | | this.getMarqueeTipsContent() |
| | | window.addEventListener('online', this.updateOnlineStatus) |
| | | window.addEventListener('offline', this.updateOnlineStatus) |
| | | this.updateOnlineStatus({ type: this.onLine ? 'online' : 'offline', isFirst: true }) |
| | | }, |
| | | beforeDestroy() { |
| | | window.removeEventListener('online', this.updateOnlineStatus) |
| | | window.removeEventListener('offline', this.updateOnlineStatus) |
| | | }, |
| | | methods: { |
| | | // 更新网络状态 |
| | | updateOnlineStatus(e) { |
| | | if (e.isFirst) { |
| | | this.getWareHouseTopLeftData() |
| | | this.getWareHouseTopBottomData() |
| | | this.getEcharts() |
| | | // this.getMarqueeTipsContent() |
| | | } else { |
| | | const loading = this.$loading({ |
| | | lock: true, |
| | | text: '断网了,正在拼命联网中,请检查网络是否正常...', |
| | | spinner: 'el-icon-loading', |
| | | customClass: 'osloading', |
| | | background: 'rgba(0, 0, 0, 0.7)' |
| | | }) |
| | | const { type } = e |
| | | this.onLine = type === 'online' |
| | | if (this.onLine) { |
| | | this.getWareHouseTopLeftData() |
| | | this.getWareHouseTopBottomData() |
| | | this.getEcharts() |
| | | loading.close() |
| | | this.$message.success('网络连接成功!') |
| | | } else { |
| | | clearInterval(this.tableTopTask) |
| | | clearInterval(this.tableBottomTask) |
| | | clearInterval(this.echartsRightTop) |
| | | clearInterval(this.echartsRightBottom) |
| | | this.$message.error('网络掉线,请关注网络状态!') |
| | | } |
| | | } |
| | | }, |
| | | |
| | | // 获取公告 |
| | | getMarqueeTipsContent() { |
| | | // this.MarqueeTipsContent = '各位员工们:根据上级的通知,结合我企实际情况,现将20xx年的元旦放假通知如下:一、1月1日至1月3日放假调休,共3天。1月4日正式上班。二、节假日期间,各班组要严格落实上级的重要指示精神,按照上级的具体要求,认真抓好落实节日期间值班备勤工作,确保节日期间企业各项工作正常运转。xx企业20xx年12月28日' |
| | |
| | | this.number1 = this.tableDataTop.length |
| | | const divData = this.$refs.tableDataTopRef.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.tableTopTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableData.length |
| | |
| | | this.tableDataTop = res.data |
| | | this.number1 = this.tableDataTop.length |
| | | if (this.tableDataTop.length > 9) { |
| | | clearInterval(task) |
| | | clearInterval(this.tableTopTask) |
| | | this.getWareHouseTopLeftData() |
| | | } |
| | | }) |
| | |
| | | this.number2 = this.tableDataBottom.length |
| | | const divData = this.$refs.tableDataBottomRef.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | // const task = setInterval(() => { |
| | | this.tableBottomTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableData.length |
| | |
| | | this.tableDataBottom = res.data |
| | | this.number2 = this.tableDataBottom.length |
| | | if (this.tableDataBottom.length > 10) { |
| | | clearInterval(task) |
| | | clearInterval(this.tableBottomTask) |
| | | this.getWareHouseTopBottomData() |
| | | } |
| | | }) |
| | |
| | | loadEcharts('bar04', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name))) |
| | | }) |
| | | |
| | | setInterval(() => { |
| | | this.echartsRightTop = setInterval(() => { |
| | | WareHouseRightTopData().then(res => { |
| | | loadEcharts('bar03', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name))) |
| | | }) |
| | | }, 1000 * 15) |
| | | |
| | | setInterval(() => { |
| | | this.echartsRightBottom = setInterval(() => { |
| | | WareHouseRightBottomData().then(res => { |
| | | loadEcharts('bar04', bar02(res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.CanuseBaseQuantity), res.data.filter(i => i.CanuseBaseQuantity > 0).map(i => i.materiel_name))) |
| | | }) |