| | |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .osloading { |
| | | font-size: 26px !important; |
| | | } |
| | | |
| | | .el-loading-text { |
| | | font-size: 26px !important; |
| | | } |
| | | |
| | | /* |
| | | 定义滚动条高宽及背景 |
| | |
| | | <div class="kb_dashboard"> |
| | | <div class="kb_header"> |
| | | <div class="flex_c_c kb_header_text"> |
| | | 包装车间看板 |
| | | 车间综合看板 |
| | | </div> |
| | | <div class="kb_headerPic" /> |
| | | <div class="kb_headTime"> |
| | |
| | | <div class="kb_left_top_title01 kb_title_text"> |
| | | <!-- <div class="PG01" />--> |
| | | <!-- <svg-icon icon-class="sccx" />--> |
| | | 产线加工中任务 <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | 产线加工中任务 |
| | | <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | </div> |
| | | |
| | | <div class="kb_left_top kb_pd10"> |
| | |
| | | <!-- 2--> |
| | | <div class="kb_left_bottom kb_pd10"> |
| | | <div class="kb_left_bottom_content"> |
| | | <div class="content_head kb_title_text">产线加工任务 <div style="margin-left: 30px">{{ number2 }} 单</div></div> |
| | | <div class="content_head kb_title_text">产线加工任务 |
| | | <div style="margin-left: 30px">{{ number2 }} 单</div> |
| | | </div> |
| | | <div class="content_body"> |
| | | <el-table |
| | | ref="tableData" |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | |
| | | lineContent: [], |
| | |
| | | number2: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | MarqueeTipsTask: null, |
| | | ShopSearchTask: null, |
| | | ShopSearchLineTask: null, |
| | | TableDataRollTask: null, |
| | | TableDataRankRollTask: null, |
| | | EchartsTask: null |
| | | } |
| | | }, |
| | | |
| | |
| | | setInterval(this.getNowTime, 1000) |
| | | }, |
| | | mounted() { |
| | | this.getValue() |
| | | // 监听网络是否在线 |
| | | 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.getValue()// 获取值 |
| | | } 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.getValue() |
| | | loading.close() |
| | | this.$message.success('网络连接成功!') |
| | | } else { |
| | | clearInterval(this.MarqueeTipsTask) |
| | | clearInterval(this.ShopSearchTask) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | clearInterval(this.TableDataRollTask) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | clearInterval(this.EchartsTask) |
| | | this.$message.error('网络掉线,请关注网络状态!') |
| | | } |
| | | } |
| | | }, |
| | | // 获取值 |
| | | async getValue() { |
| | | // await this.getShopSearch() |
| | | await this.getShopSearchLine() |
| | |
| | | this.MarqueeTipsContent = contentAll |
| | | this.speed = this.MarqueeTipsContent.length / 10 |
| | | |
| | | setInterval(() => { |
| | | this.MarqueeTipsTask = setInterval(() => { |
| | | WkspReportNotice({ shopcode: this.ShopArr.join(',') }).then(res1 => { |
| | | let contentAll = '' |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | } |
| | | setInterval(() => { |
| | | ShopSearch().then(res1 => { |
| | | this.ShopSearchTask = ShopSearch().then(res1 => { |
| | | if (res1.code === '200') { |
| | | this.ShopArr = [] |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | |
| | | let start = 0 |
| | | const task = setInterval(() => { |
| | | this.ShopSearchLineTask = setInterval(() => { |
| | | if (Math.floor(start / 3) === count && count !== 0) { |
| | | start = 0 |
| | | LineSearchTopLeftData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | |
| | | this.number1 = this.lineContent.length |
| | | }) |
| | | } else if (count === 0) { |
| | | clearInterval(task) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | this.getShopSearchLine() |
| | | } |
| | | this.lineContent3 = this.lineContent.slice(start, start + 3) |
| | |
| | | |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableData.length |
| | |
| | | this.tableData = res.data |
| | | this.number2 = this.tableData.length |
| | | if (this.tableData.length > 10) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRollTask) |
| | | this.getTableDataRoll() |
| | | } |
| | | }) |
| | |
| | | |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRankRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | |
| | | this.tableDataRank = res.data |
| | | |
| | | if (this.tableDataRank.length > 9) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | this.getTableDataRankRoll() |
| | | } |
| | | }) |
| | |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | | |
| | | setInterval(() => { |
| | | this.EchartsTask = setInterval(() => { |
| | | LineSearchBottomRightData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | |
| | | purchaseLeftTopData: [], |
| | |
| | | number1: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | PurchaseLeftTop: null, |
| | | PurchaseLeftBottom: null, |
| | | PurchaseRight: null |
| | | } |
| | | }, |
| | | |
| | |
| | | setInterval(this.getNowTime, 1000) |
| | | }, |
| | | mounted() { |
| | | this.getPurchaseLeftTop() |
| | | this.getPurchaseLeftBottom() |
| | | this.getPurchaseRight() |
| | | |
| | | 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.getPurchaseLeftTop() |
| | | this.getPurchaseLeftBottom() |
| | | this.getPurchaseRight() |
| | | |
| | | // 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.getPurchaseLeftTop() |
| | | this.getPurchaseLeftBottom() |
| | | this.getPurchaseRight() |
| | | // this.getMarqueeTipsContent() |
| | | loading.close() |
| | | this.$message.success('网络连接成功!') |
| | | } else { |
| | | clearInterval(this.PurchaseLeftTop) |
| | | clearInterval(this.PurchaseLeftBottom) |
| | | clearInterval(this.PurchaseRight) |
| | | this.$message.error('网络掉线,请关注网络状态!') |
| | | } |
| | | } |
| | | }, |
| | | |
| | | // 获取公告 |
| | | getMarqueeTipsContent() { |
| | | // this.MarqueeTipsContent = '各位员工们:根据上级的通知,结合我企实际情况,现将20xx年的元旦放假通知如下:一、1月1日至1月3日放假调休,共3天。1月4日正式上班。二、节假日期间,各班组要严格落实上级的重要指示精神,按照上级的具体要求,认真抓好落实节日期间值班备勤工作,确保节日期间企业各项工作正常运转。xx企业20xx年12月28日' |
| | |
| | | this.purchaseLeftTopData = res.data[0] |
| | | // console.log(this.purchaseLeftTopData) |
| | | }) |
| | | setInterval(() => { |
| | | this.PurchaseLeftTop = setInterval(() => { |
| | | PurchaseLeftTop().then(res => { |
| | | this.purchaseLeftTopData = res.data[0] |
| | | }) |
| | | }, 1000 * 6) |
| | | }, |
| | | |
| | | getPurchaseLeftBottom() { |
| | | PurchaseLeftBottom().then(res => { |
| | | this.tableData = res.data |
| | |
| | | |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.PurchaseLeftBottom = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度) |
| | |
| | | this.tableData = res.data |
| | | this.number1 = this.tableData.length |
| | | if (this.tableData.length > 14) { |
| | | clearInterval(task) |
| | | clearInterval(this.PurchaseLeftBottom) |
| | | this.getPurchaseLeftBottom() |
| | | } |
| | | }) |
| | |
| | | }, this.tableData.length <= 14 ? 1000 * 3 : 100) |
| | | }) |
| | | }, |
| | | |
| | | getPurchaseRight() { |
| | | PurchaseRight().then(res => { |
| | | this.tableDataRank = res.data |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.PurchaseRight = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度) |
| | |
| | | PurchaseRight().then(res => { |
| | | this.tableDataRank = res.data |
| | | if (this.tableDataRank.length > 21) { |
| | | clearInterval(task) |
| | | clearInterval(this.PurchaseRight) |
| | | this.getPurchaseRight() |
| | | } |
| | | }) |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | tableDataTop: [], |
| | | tableDataBottom: [], |
| | |
| | | number2: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | tableTopTask: null, |
| | | tableBottomTask: null, |
| | | echartsRightTop: null, |
| | | echartsRightBottom: null |
| | | |
| | | } |
| | | }, |
| | | |
| | |
| | | setInterval(this.getNowTime, 1000) |
| | | }, |
| | | 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))) |
| | | }) |
| | |
| | | <div class="kb_dashboard"> |
| | | <div class="kb_header"> |
| | | <div class="flex_c_c kb_header_text"> |
| | | 电池车间看板 |
| | | 车间综合看板 |
| | | </div> |
| | | <div class="kb_headerPic" /> |
| | | <div class="kb_headTime"> |
| | |
| | | <div class="kb_left_top_title01 kb_title_text"> |
| | | <!-- <div class="PG01" />--> |
| | | <!-- <svg-icon icon-class="sccx" />--> |
| | | 产线加工中任务 <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | 产线加工中任务 |
| | | <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | </div> |
| | | |
| | | <div class="kb_left_top kb_pd10"> |
| | |
| | | <!-- 2--> |
| | | <div class="kb_left_bottom kb_pd10"> |
| | | <div class="kb_left_bottom_content"> |
| | | <div class="content_head kb_title_text">产线加工任务 <div style="margin-left: 30px">{{ number2 }} 单</div></div> |
| | | <div class="content_head kb_title_text">产线加工任务 |
| | | <div style="margin-left: 30px">{{ number2 }} 单</div> |
| | | </div> |
| | | <div class="content_body"> |
| | | <el-table |
| | | ref="tableData" |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | |
| | | lineContent: [], |
| | |
| | | number2: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | MarqueeTipsTask: null, |
| | | ShopSearchTask: null, |
| | | ShopSearchLineTask: null, |
| | | TableDataRollTask: null, |
| | | TableDataRankRollTask: null, |
| | | EchartsTask: null |
| | | } |
| | | }, |
| | | |
| | |
| | | setInterval(this.getNowTime, 1000) |
| | | }, |
| | | mounted() { |
| | | this.getValue() |
| | | // 监听网络是否在线 |
| | | 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.getValue()// 获取值 |
| | | } 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.getValue() |
| | | loading.close() |
| | | this.$message.success('网络连接成功!') |
| | | } else { |
| | | clearInterval(this.MarqueeTipsTask) |
| | | clearInterval(this.ShopSearchTask) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | clearInterval(this.TableDataRollTask) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | clearInterval(this.EchartsTask) |
| | | this.$message.error('网络掉线,请关注网络状态!') |
| | | } |
| | | } |
| | | }, |
| | | // 获取值 |
| | | async getValue() { |
| | | // await this.getShopSearch() |
| | | await this.getShopSearchLine() |
| | |
| | | this.MarqueeTipsContent = contentAll |
| | | this.speed = this.MarqueeTipsContent.length / 10 |
| | | |
| | | setInterval(() => { |
| | | this.MarqueeTipsTask = setInterval(() => { |
| | | WkspReportNotice({ shopcode: this.ShopArr.join(',') }).then(res1 => { |
| | | let contentAll = '' |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | } |
| | | setInterval(() => { |
| | | ShopSearch().then(res1 => { |
| | | this.ShopSearchTask = ShopSearch().then(res1 => { |
| | | if (res1.code === '200') { |
| | | this.ShopArr = [] |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | |
| | | let start = 0 |
| | | const task = setInterval(() => { |
| | | this.ShopSearchLineTask = setInterval(() => { |
| | | if (Math.floor(start / 3) === count && count !== 0) { |
| | | start = 0 |
| | | LineSearchTopLeftData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | |
| | | this.number1 = this.lineContent.length |
| | | }) |
| | | } else if (count === 0) { |
| | | clearInterval(task) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | this.getShopSearchLine() |
| | | } |
| | | this.lineContent3 = this.lineContent.slice(start, start + 3) |
| | |
| | | |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableData.length |
| | |
| | | this.tableData = res.data |
| | | this.number2 = this.tableData.length |
| | | if (this.tableData.length > 10) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRollTask) |
| | | this.getTableDataRoll() |
| | | } |
| | | }) |
| | |
| | | |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRankRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | |
| | | this.tableDataRank = res.data |
| | | |
| | | if (this.tableDataRank.length > 9) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | this.getTableDataRankRoll() |
| | | } |
| | | }) |
| | |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | | |
| | | setInterval(() => { |
| | | this.EchartsTask = setInterval(() => { |
| | | LineSearchBottomRightData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | |
| | | <div class="kb_left_top_title01 kb_title_text"> |
| | | <!-- <div class="PG01" />--> |
| | | <!-- <svg-icon icon-class="sccx" />--> |
| | | 产线加工中任务 <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | 产线加工中任务 |
| | | <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | </div> |
| | | |
| | | <div class="kb_left_top kb_pd10"> |
| | |
| | | <!-- 2--> |
| | | <div class="kb_left_bottom kb_pd10"> |
| | | <div class="kb_left_bottom_content"> |
| | | <div class="content_head kb_title_text">产线加工任务 <div style="margin-left: 30px">{{ number2 }} 单</div></div> |
| | | <div class="content_head kb_title_text">产线加工任务 |
| | | <div style="margin-left: 30px">{{ number2 }} 单</div> |
| | | </div> |
| | | <div class="content_body"> |
| | | <el-table |
| | | ref="tableData" |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | |
| | | lineContent: [], |
| | |
| | | number2: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | MarqueeTipsTask: null, |
| | | ShopSearchTask: null, |
| | | ShopSearchLineTask: null, |
| | | TableDataRollTask: null, |
| | | TableDataRankRollTask: null, |
| | | EchartsTask: null |
| | | } |
| | | }, |
| | | |
| | |
| | | setInterval(this.getNowTime, 1000) |
| | | }, |
| | | mounted() { |
| | | this.getValue() |
| | | // 监听网络是否在线 |
| | | 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.getValue()// 获取值 |
| | | } 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.getValue() |
| | | loading.close() |
| | | this.$message.success('网络连接成功!') |
| | | } else { |
| | | clearInterval(this.MarqueeTipsTask) |
| | | clearInterval(this.ShopSearchTask) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | clearInterval(this.TableDataRollTask) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | clearInterval(this.EchartsTask) |
| | | this.$message.error('网络掉线,请关注网络状态!') |
| | | } |
| | | } |
| | | }, |
| | | // 获取值 |
| | | async getValue() { |
| | | await this.getShopSearch() |
| | | await this.getShopSearchLine() |
| | |
| | | this.MarqueeTipsContent = contentAll |
| | | this.speed = this.MarqueeTipsContent.length / 10 |
| | | |
| | | setInterval(() => { |
| | | this.MarqueeTipsTask = setInterval(() => { |
| | | WkspReportNotice({ shopcode: this.ShopArr.join(',') }).then(res1 => { |
| | | let contentAll = '' |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | } |
| | | setInterval(() => { |
| | | ShopSearch().then(res1 => { |
| | | this.ShopSearchTask = ShopSearch().then(res1 => { |
| | | if (res1.code === '200') { |
| | | this.ShopArr = [] |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | |
| | | let start = 0 |
| | | const task = setInterval(() => { |
| | | this.ShopSearchLineTask = setInterval(() => { |
| | | if (Math.floor(start / 3) === count && count !== 0) { |
| | | start = 0 |
| | | LineSearchTopLeftData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | |
| | | this.number1 = this.lineContent.length |
| | | }) |
| | | } else if (count === 0) { |
| | | clearInterval(task) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | this.getShopSearchLine() |
| | | } |
| | | this.lineContent3 = this.lineContent.slice(start, start + 3) |
| | |
| | | |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableData.length |
| | |
| | | this.tableData = res.data |
| | | this.number2 = this.tableData.length |
| | | if (this.tableData.length > 10) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRollTask) |
| | | this.getTableDataRoll() |
| | | } |
| | | }) |
| | |
| | | |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRankRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | |
| | | this.tableDataRank = res.data |
| | | |
| | | if (this.tableDataRank.length > 9) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | this.getTableDataRankRoll() |
| | | } |
| | | }) |
| | |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | | |
| | | setInterval(() => { |
| | | this.EchartsTask = setInterval(() => { |
| | | LineSearchBottomRightData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | |
| | | <div class="kb_dashboard"> |
| | | <div class="kb_header"> |
| | | <div class="flex_c_c kb_header_text"> |
| | | 装配车间看板 |
| | | 车间综合看板 |
| | | </div> |
| | | <div class="kb_headerPic" /> |
| | | <div class="kb_headTime"> |
| | |
| | | <div class="kb_left_top_title01 kb_title_text"> |
| | | <!-- <div class="PG01" />--> |
| | | <!-- <svg-icon icon-class="sccx" />--> |
| | | 产线加工中任务 <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | 产线加工中任务 |
| | | <div style="margin-left: 30px">{{ number1 }} 单</div> |
| | | </div> |
| | | |
| | | <div class="kb_left_top kb_pd10"> |
| | |
| | | <!-- 2--> |
| | | <div class="kb_left_bottom kb_pd10"> |
| | | <div class="kb_left_bottom_content"> |
| | | <div class="content_head kb_title_text">产线加工任务 <div style="margin-left: 30px">{{ number2 }} 单</div></div> |
| | | <div class="content_head kb_title_text">产线加工任务 |
| | | <div style="margin-left: 30px">{{ number2 }} 单</div> |
| | | </div> |
| | | <div class="content_body"> |
| | | <el-table |
| | | ref="tableData" |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | |
| | | onLine: navigator.onLine, // 监听网络是否在线 |
| | | |
| | | headTime: '', |
| | | |
| | | lineContent: [], |
| | |
| | | number2: '', |
| | | |
| | | MarqueeTipsContent: '', // 公告 |
| | | speed: 100// 公告播放的速度 |
| | | speed: 100, // 公告播放的速度 |
| | | |
| | | MarqueeTipsTask: null, |
| | | ShopSearchTask: null, |
| | | ShopSearchLineTask: null, |
| | | TableDataRollTask: null, |
| | | TableDataRankRollTask: null, |
| | | EchartsTask: null |
| | | } |
| | | }, |
| | | |
| | |
| | | setInterval(this.getNowTime, 1000) |
| | | }, |
| | | mounted() { |
| | | this.getValue() |
| | | // 监听网络是否在线 |
| | | 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.getValue()// 获取值 |
| | | } 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.getValue() |
| | | loading.close() |
| | | this.$message.success('网络连接成功!') |
| | | } else { |
| | | clearInterval(this.MarqueeTipsTask) |
| | | clearInterval(this.ShopSearchTask) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | clearInterval(this.TableDataRollTask) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | clearInterval(this.EchartsTask) |
| | | this.$message.error('网络掉线,请关注网络状态!') |
| | | } |
| | | } |
| | | }, |
| | | // 获取值 |
| | | async getValue() { |
| | | // await this.getShopSearch() |
| | | await this.getShopSearchLine() |
| | |
| | | this.MarqueeTipsContent = contentAll |
| | | this.speed = this.MarqueeTipsContent.length / 10 |
| | | |
| | | setInterval(() => { |
| | | this.MarqueeTipsTask = setInterval(() => { |
| | | WkspReportNotice({ shopcode: this.ShopArr.join(',') }).then(res1 => { |
| | | let contentAll = '' |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | } |
| | | setInterval(() => { |
| | | ShopSearch().then(res1 => { |
| | | this.ShopSearchTask = ShopSearch().then(res1 => { |
| | | if (res1.code === '200') { |
| | | this.ShopArr = [] |
| | | res1.data.forEach(item => { |
| | |
| | | }) |
| | | |
| | | let start = 0 |
| | | const task = setInterval(() => { |
| | | this.ShopSearchLineTask = setInterval(() => { |
| | | if (Math.floor(start / 3) === count && count !== 0) { |
| | | start = 0 |
| | | LineSearchTopLeftData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | |
| | | this.number1 = this.lineContent.length |
| | | }) |
| | | } else if (count === 0) { |
| | | clearInterval(task) |
| | | clearInterval(this.ShopSearchLineTask) |
| | | this.getShopSearchLine() |
| | | } |
| | | this.lineContent3 = this.lineContent.slice(start, start + 3) |
| | |
| | | |
| | | const divData = this.$refs.tableData.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | divData.scrollTop += 1 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableData.length |
| | |
| | | this.tableData = res.data |
| | | this.number2 = this.tableData.length |
| | | if (this.tableData.length > 10) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRollTask) |
| | | this.getTableDataRoll() |
| | | } |
| | | }) |
| | |
| | | |
| | | const divData = this.$refs.tableDataRank.bodyWrapper |
| | | // 拿到元素后,对元素进行定时增加距离顶部距离,实现滚动效果(此配置为每100毫秒移动1像素) |
| | | const task = setInterval(() => { |
| | | this.TableDataRankRollTask = setInterval(() => { |
| | | // 元素自增距离顶部1像素 |
| | | // divData.scrollTop += divData.scrollHeight / this.tableDataRank.length |
| | | divData.scrollTop += 1 |
| | |
| | | this.tableDataRank = res.data |
| | | |
| | | if (this.tableDataRank.length > 9) { |
| | | clearInterval(task) |
| | | clearInterval(this.TableDataRankRollTask) |
| | | this.getTableDataRankRoll() |
| | | } |
| | | }) |
| | |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | | |
| | | setInterval(() => { |
| | | this.EchartsTask = setInterval(() => { |
| | | LineSearchBottomRightData({ shopcode: this.ShopArr.join(',') }).then(res => { |
| | | loadEcharts('bar02', bar02(res.data.map(i => i.cont), res.data.map(i => i.name))) |
| | | }) |
| | |
| | | prop="partname" |
| | | min-width="150" |
| | | label="产品名称" |
| | | show-tooltip-when-overflow |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | |
| | | prop="partname" |
| | | min-width="150" |
| | | label="产品名称" |
| | | show-tooltip-when-overflow |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="partspec" |
| | | label="产品规格" |
| | | sortable="custom" |
| | | show-tooltip-when-overflow |
| | | width="110" |
| | | > |
| | | <template slot-scope="{row}"> |
| | |
| | | label="产品名称" |
| | | sortable="custom" |
| | | min-width="150" |
| | | show-tooltip-when-overflow |
| | | /> |
| | | <el-table-column |
| | | prop="partspec" |
| | | label="产品规格" |
| | | sortable="custom" |
| | | show-tooltip-when-overflow |
| | | min-width="110" |
| | | > |
| | | <template slot-scope="{row}"> |
| | |
| | | <el-form |
| | | ref="form" |
| | | :model="form" |
| | | label-width="80px" |
| | | label-width="100px" |
| | | inline |
| | | style="display: flex;justify-content: space-between" |
| | | > |
| | | <div class="elForm"> |
| | | <el-form-item label="编码名称" style=" display: flex;"> |
| | | <div class="elForm" style="justify-content: flex-start"> |
| | | <el-form-item label="编码名称" label-width="70px" style=" display: flex;"> |
| | | <el-input v-model="form.rightname" placeholder="请输入" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item label="固定字符" style=" display: flex;"> |
| | |
| | | <el-button type="info" icon="el-icon-refresh" @click="reset">重置</el-button> |
| | | </div> |
| | | </el-form> |
| | | <div |
| | | class="bodyTopFormExpand" |
| | | /> |
| | | </div> |
| | | |
| | | <div style="margin-left: 10px;display: flex"> |
| | |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="Type" |
| | | label="类型" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="prefix" |
| | | label="固定字符" |
| | | sortable="custom" |