From 2c29fe66911a4cd621f561fb990842fd3548ca44 Mon Sep 17 00:00:00 2001 From: shijing Date: Mon, 12 May 2025 14:55:14 +0800 Subject: [PATCH] =?UTF-8?q?fix:=E5=85=89=E8=8A=AF=E5=A4=A7=E5=B1=8F?= =?UTF-8?q?=E4=BF=AE=E6=94=B9=EF=BC=8870%=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/bigScreen/index_gx.vue | 563 +++++++++++-------------------- 1 file changed, 193 insertions(+), 370 deletions(-) diff --git a/src/views/bigScreen/index_gx.vue b/src/views/bigScreen/index_gx.vue index 763ec6bf..f7f86fe0 100644 --- a/src/views/bigScreen/index_gx.vue +++ b/src/views/bigScreen/index_gx.vue @@ -3,7 +3,7 @@
{{ bigScreenName }}
- {{ currentYear }}年{{ currentMonth }}月{{ currentDay }}日 + {{ currentYear }}年{{ currentMonth }}月{{ currentDay }}日{{currentWeek}}
{{ currentTime }} @@ -24,24 +24,8 @@ status="warning" >
@@ -60,12 +44,6 @@ {{ count_day }} -
-
- 日任务 - {{cprrws}} -
-
@@ -74,12 +52,6 @@ {{ count_week }}
-
-
- 周任务 - {{ cprrws*7 }} -
-
@@ -88,12 +60,6 @@ {{ count_month }}
-
-
- 月任务 - {{ cprrws*days }} -
-
@@ -145,11 +111,10 @@
质量分析
- - - - - + + + +
@@ -161,7 +126,6 @@
@@ -172,11 +136,11 @@
宣传公告
-
+
- +
- {{ articleItem.content }} + {{ articleObj.content }}
@@ -186,153 +150,53 @@
-
切片
+
黑化
- -
-
-
-
扫边A
-
- - -
-
-
-
黑化
-
- - -
-
-
-
退火
-
- - +
减薄A
- +
-
-
减薄B
-
- - -
-
精雕
- -
-
-
-
一次抛
-
- - -
-
-
-
扫边B
-
- - +
成品抛
- +
-
倒角
+
检测
- -
-
-
-
一次超洗
-
- - -
-
-
-
二次超洗
-
- - -
-
-
-
三次超洗
-
- - -
-
-
-
切片
-
- - +
@@ -472,7 +336,7 @@ const baseOption={ } const baseOption2= { title: { - text: '总计', + text: '棒料', left: 'center', textStyle:{ fontSize: 16, @@ -527,6 +391,7 @@ export default { currentYear: "", currentMonth: "", currentDay: "", + currentDate:"", days:0, timerTime: null, start_date: "", @@ -535,10 +400,8 @@ export default { count_day:0, count_week:0, count_month:0, - cprrws:0, myChart: null, sectionNames: { - // '立方体.010':'一层', '地面': "一层",// '一层地面': "一层",// 地面 '地面.001': "二层",// 地面 @@ -549,7 +412,10 @@ export default { option1: {}, option2: {}, option3: {}, - option4: {}, + visibal0: false, + visibal1: false, + visibal2: false, + visibal3: false, //设备状态饼状图option option_eq: { color: ['rgb(145,204,117)', '#ffa500 ', 'rgb(250,200,88)', 'rgb(215,102,97)', 'rgb(185,51,46)' ], @@ -637,38 +503,22 @@ export default { configData3:{}, configData4:{}, configData5:{}, - configData6:{}, - configData7:{}, - configData8:{}, - configData9:{}, - configData10:{}, - configData11:{}, - configData12:{}, - configData13:{}, - configData14:{}, - configData15:{}, scrollNum:0, scrollInterval:null, //近七天日数组 dayArr:[], + visibals0: false, + visibals1: false, + visibals2: false, + visibals3: false, + visibals4: false, //工序柱状图option options0:{}, options1:{}, options2:{}, options3:{}, options4:{}, - options5:{}, - options6:{}, - options7:{}, - options8:{}, - options9:{}, - options10:{}, - options11:{}, - options12:{}, - options13:{}, - options14:{}, - options15:{}, - articleList:[], + articleObj:{}, videoUrl:'', pieWidth:0, lineWidth:0, @@ -677,78 +527,78 @@ export default { }; }, mounted() { + this.bigScreenName = this.$TOOL.data.get("BASE_INFO").base.bigScreen_name; + console.log('this.bigScreenName',this.bigScreenName) + this.showTime(); loadBabylon().then(()=>{ this.initView() }) + this.timerTime = setInterval(() => { + this.showTime(); + }, 1000); }, methods: { - //初始化视图 initView(){ let that = this; - var windowHeight = window.innerHeight; - var windowWidth = window.innerWidth; - that.pieWidth =Math.round((windowWidth/100*33)/5)+'px'; - that.pieHeight = Math.round((windowHeight/100)*13)+'px'; - that.lineWidth = (windowWidth/5-10)+'px'; - that.lineHeight = (windowHeight/100)*12.5+'px'; - that.bigScreenName = that.$TOOL.data.get("BASE_INFO").base.bigScreen_name; + var windowHeight = window.innerHeight; + var windowWidth = window.innerWidth; + that.pieWidth =Math.round((windowWidth/100*33)/4)+'px'; + that.pieHeight = Math.round((windowHeight/100)*12)+'px'; + that.lineWidth = (windowWidth/5-10)+'px'; + that.lineHeight = (windowHeight/100)*12.5+'px'; - //一天的毫秒数 - let nowDate = new Date(); - let year = nowDate.getFullYear(); - let month = nowDate.getMonth() + 1; - let day = nowDate.getDate(); - that.days = new Date(year, month, 0).getDate(); - that.currentYear = year; - that.currentMonth = month; - that.currentDay = day; - let dayArr = []; - for(let i=6;i>-1;i--){ - let date = new Date(nowDate.getTime()-i*24*60*60*1000); - let day = date.getDate(); - dayArr.push(day); - } - // dayArr.push(day); - that.dayArr = dayArr; - - that.myChart = echarts.init(document.getElementById('eqPieChart')); - that.myChart.setOption(that.option_eq); - let index2 = 0; - that.chartInterval2 = setInterval(function () { - if (index2 < that.option_eq.series.data.length) { - that.myChart.dispatchAction({ - type: "downplay", - seriesIndex: 0, - }); - that.myChart.dispatchAction({ - type: "highlight", - seriesIndex: 0, - dataIndex: index2, - }); - that.myChart.dispatchAction({ - type: "showTip", - seriesIndex: 0, - dataIndex: index2, - }); - index2++; - } else { - index2 = 0; + //一天的毫秒数 + let nowDate = new Date(); + let year = nowDate.getFullYear(); + let month = nowDate.getMonth() + 1; + let day = nowDate.getDate(); + that.days = new Date(year, month, 0).getDate(); + that.currentYear = year; + that.currentMonth = month; + that.currentDay = day; + let dayArr = []; + for(let i=6;i>-1;i--){ + let date = new Date(nowDate.getTime()-i*24*60*60*1000); + let day = date.getDate(); + dayArr.push(day); } - }, 3000); - that.$nextTick(function () { - that.getEquipments(); - that.getMaterials(); - that.getMgroup(); - that.getTaskNumber(); - that.addListener(); - that.setIntervalFun(); - that.getQulity(); - that.getArticles(); - that.initFactory(); - that.showTime(); - that.addListener(); - }) + that.dayArr = dayArr; + + that.myChart = echarts.init(document.getElementById('eqPieChart')); + that.myChart.setOption(that.option_eq); + let index2 = 0; + that.chartInterval2 = setInterval(function () { + if (index2 < that.option_eq.series.data.length) { + that.myChart.dispatchAction({ + type: "downplay", + seriesIndex: 0, + }); + that.myChart.dispatchAction({ + type: "highlight", + seriesIndex: 0, + dataIndex: index2, + }); + that.myChart.dispatchAction({ + type: "showTip", + seriesIndex: 0, + dataIndex: index2, + }); + index2++; + } else { + index2 = 0; + } + }, 3000); + that.$nextTick(function () { + that.getEquipments(); + that.getMaterials(); + that.getMgroup(); + that.getTaskNumber(); + that.addListener(); + that.getArticles(); + that.initFactory(); + that.addListener(); + }) }, //获取公告和视频 getArticles(){ @@ -763,90 +613,16 @@ export default { videoList.push(item); } }) - that.articleList = articleList.slice(0,2); + that.articleObj = articleList[0]; that.videoUrl = that.baseUrl+videoList[0].video; } }) }, - //获取质量分析饼状图数据 - getQulity(){ - let that = this; - let month = that.currentMonth>9?that.currentMonth:'0'+that.currentMonth; - let day = that.currentDay>9?that.currentDay:'0'+that.currentDay; - let current_date = that.currentYear+'-'+month+'-'+day; - that.options = that.deepCopy(baseOption2); - that.option1 = that.deepCopy(baseOption2); - that.option1.title.text = '早班尺寸'; - that.option2 = that.deepCopy(baseOption2); - that.option2.title.text = '晚班尺寸'; - that.option3 = that.deepCopy(baseOption2); - that.option3.title.text = '早班外观'; - that.option4 = that.deepCopy(baseOption2); - that.option4.title.text = '晚班外观'; - let obj = { - query:{ - "fw_type":"prod", - "end_date":current_date, - "start_date":current_date, - "group_by_dept": ", dept.id", - "group_by_shift": ", shift.id", - "select_col_dept": ", dept.name as 部门", - "select_col_shift": ", shift.name as 班次" - }, - }; - that.$API.bi.dataset.exec.req('ftestDay2', obj).then((res) => { - if(res.data2.ds0){ - let lists = res.data2.ds0; - //根据工段名称分组 - if(lists.length>0){ - let count_ok = 0,count_notok=0; - lists.forEach((item) => { - count_ok += item.合格数; - count_notok += item.不合格数; - let index = 1; - if(item.班次=='早班'&&item.部门=='尺寸检测'){ - index = 1; - }else if(item.班次=='晚班'&&item.部门=='尺寸检测'){ - index = 2; - }else if(item.班次=='早班'&&item.部门=='外观检测'){ - index = 3; - }else if(item.班次=='晚班'&&item.部门=='外观检测'){ - index = 4; - } - let key = 'option'+index; - that[key].series.data[0].value = item.合格数; - that[key].series.data[1].value = item.不合格数; - }) - that.options.series.data[0].value = count_ok; - that.options.series.data[1].value = count_notok; - } - } - }); - }, - //底部轮播定时 - setIntervalFun(){ - let that = this; - let containerWidth = document.getElementsByClassName("container")[0].offsetWidth; - let wdiths = containerWidth/5; - that.scrollInterval = setInterval(() => { - if(that.scrollNum>8){ - that.scrollNum = 0; - }else{ - that.scrollNum++; - } - let nums = that.scrollNum * wdiths; - let lefts = 0-nums; - document.getElementById("scroll").style.left = lefts +'px'; - },600000) - }, //时间 showTime() { this.currentTime = this.$TOOL.dateFormat(new Date(), "hh:mm:ss"); this.currentWeek = this.$TOOL.dateFormat(new Date(), "week"); - this.currentDay = this.$TOOL.dateFormat( - new Date(), - "yyyy年MM月dd日" - ); + this.currentDate = this.$TOOL.dateFormat(new Date(),"yyyy年MM月dd日"); }, //屏幕监听 addListener() { @@ -855,7 +631,6 @@ export default { if (that.scrollInterval!=null) { clearInterval(that.scrollInterval); } - that.setIntervalFun(); if (this.resizeTimeout) { clearTimeout(this.resizeTimeout); } @@ -891,6 +666,7 @@ export default { if (that.engine != null) { that.engine.resize(); } + that.resizeChart(); }, //更新图表数据 resizeChart(name) { @@ -902,18 +678,12 @@ export default { myChart.resize(); } }, - //获取日任务和日/周/月产量 + //获取日/周/月产量 getTaskNumber(){ let that = this; let month = that.currentMonth>9?that.currentMonth:'0'+that.currentMonth; let day = that.currentDay>9?that.currentDay:'0'+that.currentDay; let current_date = that.currentYear+'-'+month+'-'+day; - let obj = {query:{current_date:current_date}}; - that.$API.bi.dataset.exec.req('cprrws', obj).then((res) => { - if(res.data2.ds0&&res.data2.ds0.length>0){ - that.cprrws = res.data2.ds0[0].日任务数; - } - }); let objDay = {query:{start_date:current_date,end_date:current_date,mgroup_name:'三次超洗'}}; that.$API.bi.dataset.exec.req('lineDay_m2', objDay).then((res0) => { if(res0.data2.ds0&&res0.data2.ds0.length>0){ @@ -1020,7 +790,7 @@ export default { // 相机限制 camera.lowerRadiusLimit = 29; camera.upperRadiusLimit = 50; - camera.useAutoRotationBehavior = true; + // camera.useAutoRotationBehavior = true;//自动旋转 // 灯光 const light = new BABYLON.HemisphericLight( "light", @@ -1041,35 +811,7 @@ export default { control_main.left = "-15%"; advancedTexture.addControl(control_main); var remoteGlbUrl = config.HOST_URL + "/media/model/gx.glb"; - BABYLON.SceneLoader.Append( - remoteGlbUrl, - "", - scene, - function(scene){ - for (let key in that.sectionNames) { - let value = that.sectionNames[key]; - let mesh = scene.getMeshByName(key); - if (mesh) { - let rect1 = new BABYLON_GUI.Rectangle(); - rect1.width = "100px"; - rect1.height = "40px"; - rect1.cornerRadius = 20; - rect1.color = "rgba(255,160,0,.7)"; - rect1.thickness = 4; - rect1.background = "rgba(255,160,0,.7)"; - - let label = new BABYLON_GUI.TextBlock(); - label.text = value; - label.color = "#ffffff"; - rect1.addControl(label); - - that.myui.addControl(rect1); - rect1.linkWithMesh(mesh); - rect1.linkOffsetY = -10; - } - } - engine.hideLoadingUI(); - }, + BABYLON.SceneLoader.Append(remoteGlbUrl,"",scene, function (evt) { var loadedPercent = 0; if (evt.lengthComputable) { @@ -1103,10 +845,32 @@ export default { let that = this; that.$API.mtm.mgroup.list.req({page:0}).then((res) => { let data = res; + that.mgroupsData = res; for(let i=0;i { + if(res.data2.ds0){ + let lists = res.data2.ds0; + if(lists.length>0){ + let count_ok=0 ,count_notok=0; + lists.forEach((item) => { + count_ok += Number(item.合格数); + count_notok += Number(item.不合格数) ; + }) + that[optionKey].series.data[0] = count_ok; + that[optionKey].series.data[1] = count_notok; } } }); @@ -1193,7 +994,16 @@ export default { src: url("../../utils/youShe.ttf"); /* 字体文件相对路径 */ } - +.loadPercent{ + font-size: 30px; + color: white; + font-weight: bold; +} +.loadText{ + font-size: 18px; + color: white; + margin-top: 10px; +} .container { /* background: url("/public/img/gx/gx_bj.jpg") no-repeat; */ background-size: cover; @@ -1259,6 +1069,12 @@ export default { box-sizing: border-box; background: rgba(9, 31, 43, 0.5); } +.left_block{ + width:13vw; +} +.left_block2{ + width:20vw; +} .left_block3{ top:31.48vh; left: 0; @@ -1285,7 +1101,7 @@ export default { height: 62vh; } .left_block2{ - left: 16.5vw; + left: 13vw; height: 25vh; padding: 0 5px; } @@ -1295,6 +1111,12 @@ export default { .flexItem{ width: 16.5vw; } +.left_block>.flexItem,.left_block>.flexItem>.itemTitle{ + width:13vw; +} +.left_block2>.flexItem,.left_block2>.flexItem>.itemTitle{ + width:20vw; +} .videoFlexItem{ width: 32.8vw; height: 37vh; @@ -1459,21 +1281,22 @@ export default { margin-bottom: 1vh; } .viewsItem_wrap { - height: 9.26vh; + /* height: 9.26vh; */ flex-direction: column; - border-left: 5px solid rgba(28, 169, 231, 0.81); + /* border-left: 5px solid rgba(28, 169, 231, 0.81); */ padding-left: 10px; border-radius: 5px; } .viewsItem_img{ - width: 4.4vw; - margin-top: 10px; + height: 20vh; + width: 49%; } article{ + font-size: 12px; margin-top: 5px; text-indent: 2em; display: -webkit-box; - -webkit-line-clamp: 5; /* 限制显示 5 行 */ + -webkit-line-clamp: 13; /* 限制显示 5 行 */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;