diff --git a/public/img/elec_flow.png b/public/img/elec_flow.png new file mode 100644 index 00000000..7faa6214 Binary files /dev/null and b/public/img/elec_flow.png differ diff --git a/src/components/faceLogin/index.vue b/src/components/faceLogin/index.vue index a2d2dbdd..38025da5 100644 --- a/src/components/faceLogin/index.vue +++ b/src/components/faceLogin/index.vue @@ -1,183 +1,180 @@ - - + } + + \ No newline at end of file diff --git a/src/config/route.js b/src/config/route.js index 4740f065..3b32044a 100644 --- a/src/config/route.js +++ b/src/config/route.js @@ -565,6 +565,16 @@ const routes = [ }, "component": "ungrouped/electric_hour" }, + { + "name": "energyPicture", + "path": "/ungrouped/energyPicture", + "meta": { + "title": "能源流向", + "icon": "el-icon-grid", + "perms": ["enm"] + }, + "component": "ungrouped/energyPicture" + }, { "name": "electricDay", "path": "/ungrouped/electricDay", diff --git a/src/views/bigScreen/index_enm.vue b/src/views/bigScreen/index_enm.vue index 0a7fc4e1..35edf5a4 100644 --- a/src/views/bigScreen/index_enm.vue +++ b/src/views/bigScreen/index_enm.vue @@ -232,12 +232,12 @@ export default { path:"ws://49.232.14.174:2226/ws/my/?token=", ws:null, mgroupValues:{ - 电石渣:{total:0,elec:0}, - 原料磨:{total:0,elec:0}, - 煤磨:{total:0,elec:0}, - 回转窑:{total:0,elec:0}, - 水泥磨:{total:0,elec:0}, - 水泥包装:{total:0,elec:0} + 电石渣:{total:'0',elec:'0'}, + 原料磨:{total:'0',elec:'0'}, + 煤磨:{total:'0',elec:'0'}, + 回转窑:{total:'0',elec:'0'}, + 水泥磨:{total:'0',elec:'0'}, + 水泥包装:{total:'0',elec:'0'} }, } }, @@ -256,26 +256,26 @@ export default { this.$nextTick(() => { this.$API.enm.enstat.req({type:'month_s',month_s:month,year_s:year,page:0}).then((res1) => { console.log('工段数据:',res1) - debugger + // debugger res1.forEach(item=>{ if(item.mgroup_name=='电石渣'){ - that.mgroupValues.电石渣.total = item.total_production; - that.mgroupValues.电石渣.elec=item.elec_consume_unit; + that.mgroupValues.电石渣.total = item.total_production+''; + that.mgroupValues.电石渣.elec=item.elec_consume_unit+''; }else if(item.mgroup_name=='原料磨'){ - that.mgroupValues.原料磨.total=item.total_production; - that.mgroupValues.原料磨.elec=item.elec_consume_unit; + that.mgroupValues.原料磨.total=item.total_production+''; + that.mgroupValues.原料磨.elec=item.elec_consume_unit+''; }else if(item.mgroup_name=='煤磨'){ - that.mgroupValues.煤磨.total=item.total_production; - that.mgroupValues.煤磨.elec=item.elec_consume_unit; + that.mgroupValues.煤磨.total=item.total_production+''; + that.mgroupValues.煤磨.elec=item.elec_consume_unit+''; }else if(item.mgroup_name=='回转窑'){ - that.mgroupValues.回转窑.total=item.total_production; - that.mgroupValues.回转窑.elec=item.elec_consume_unit; + that.mgroupValues.回转窑.total=item.total_production+''; + that.mgroupValues.回转窑.elec=item.elec_consume_unit+''; }else if(item.mgroup_name=='水泥磨'){ - that.mgroupValues.水泥磨.total=item.total_production; - that.mgroupValues.水泥磨.elec=item.elec_consume_unit; + that.mgroupValues.水泥磨.total=item.total_production+''; + that.mgroupValues.水泥磨.elec=item.elec_consume_unit+''; }else if(item.mgroup_name=='水泥包装'){ - that.mgroupValues.水泥包装.total=item.total_production; - that.mgroupValues.水泥包装.elec=item.elec_consume_unit; + that.mgroupValues.水泥包装.total=item.total_production+''; + that.mgroupValues.水泥包装.elec=item.elec_consume_unit+''; } }) }) @@ -730,7 +730,6 @@ export default { control_main.isVertical = false control_main.top = '-40%'; control_main.left = '-20%'; - let meshList = []; advancedTexture.addControl(control_main); var button_main = BABYLON_GUI.Button.CreateSimpleButton("button_main", "主视角"); @@ -753,6 +752,7 @@ export default { BABYLON.Animation.CreateAndStartAnimation('at61', camera, 'target', 45, 200, camera.target, that.initialTarget, 0, ease); } }) + // 高亮显示mesh名 const mesh_rect = new BABYLON_GUI.Rectangle('mesh_rect'); mesh_rect.width = "100px"; @@ -774,8 +774,8 @@ export default { // console.table(scene.meshes) // 判断字符串是否包含中文------ /[\u4E00-\u9FA5]+/g.test(str) for (let key in that.sectionNames) { - var value = that.sectionNames[key]; - var mesh = scene.getMeshByName(key); + const value = that.sectionNames[key]; + const mesh = scene.getMeshByName(key); if (mesh) { //建筑标签 const rect1 = new BABYLON_GUI.Rectangle(value + '_rect'); @@ -785,18 +785,30 @@ export default { rect1.color = "Orange"; rect1.thickness = 2; rect1.background = "green"; - advancedTexture.addControl(rect1); - - var label = new BABYLON_GUI.TextBlock(value + '_label'); - label.text = value; - label.color = 'white'; - label.fontSize = '14px'; - rect1.addControl(label); - + rect1.isPointerBlocker = true; // 防止点击穿透 + advancedTexture.addControl(rect1); + var label = new BABYLON_GUI.TextBlock(value + '_label'); + label.text = value; + label.color = 'white'; + label.fontSize = '14px'; + rect1.addControl(label); rect1.linkWithMesh(mesh); rect1.linkOffsetY = -30; if(value=='电石渣'){ rect1.linkOffsetY = -200; + var line = new BABYLON_GUI.Line(); + line.lineWidth = 4; + line.color = "Orange"; + line.y1 = 10; + line.y2 = 15; + line.linkOffsetY = -15; + line.dash = [3, 3]; + advancedTexture.addControl(line); + line.linkWithMesh(mesh); + let connectedControl = advancedTexture.getControlByName('电石渣_rect') + line.connectedControl = connectedControl; + // line.connectedControl = rect1; + // line.connectedControl = data_view; } rect1.onPointerDownObservable.add(() => { @@ -820,6 +832,8 @@ export default { } let dataViewName = rect1.name.split('_')[0] + '_data_view'; that.getMgroupChartData(dataViewName); + that.activeSectionName = dataViewName; + that.activeSection = 2; let dataView = advancedTexture.getControlByName(dataViewName); if (dataView) { // // 在这里进行矩形的操作 @@ -877,12 +891,14 @@ export default { rc.fontSize = '16px'; rc.text = "单位产品电耗:"; }else if(j==1&&i==0){ - rc.text = that.mgroupValues[value].total; + // rc.text = that.mgroupValues[value].total; + rc.text = "123"; rc.width = "80px"; rc.fontSize = '18px'; rc.color = "rgb(44,237,255)"; }else if(j==1&&i==1){ - rc.text = that.mgroupValues[value].elec; + // rc.text = that.mgroupValues[value].total; + rc.text = "456"; rc.width = "80px"; rc.fontSize = '18px'; rc.color = "rgb(44,237,255)"; @@ -910,15 +926,6 @@ export default { data_view.linkOffsetY = -120; if(value=='电石渣'){ data_view.linkOffsetY = -290; - var line = new BABYLON_GUI.Line(); - line.lineWidth = 4; - line.color = "Orange"; - line.y2 = 110; - line.linkOffsetY = -15; - line.dash = [3, 3]; - advancedTexture.addControl(line); - line.linkWithMesh(mesh); - line.connectedControl = data_view; } } } @@ -952,13 +959,45 @@ export default { control_main.addControl(checkbox); var header = new BABYLON_GUI.TextBlock(); - header.text = "自动旋转"; header.width = "80px"; header.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_LEFT; header.color = "white"; control_main.addControl(header); + // 工段数据checkbox + var checkbox1 = new BABYLON_GUI.Checkbox(); + checkbox1.width = "20px"; + checkbox1.height = "20px"; + checkbox1.isChecked = true; + checkbox1.marginLeft = '16px' + checkbox1.color = "green"; + checkbox1.onIsCheckedChangedObservable.add(function (value) { + // debugger; + if (value) { + for (let key in that.sectionNames) { + let name = that.sectionNames[key] + '_data_view'; + console.log(name) + let dataView = advancedTexture.getControlByName(name); + dataView.isVisible = true; + } + } else { + for (let key in that.sectionNames) { + let name = that.sectionNames[key] + '_data_view'; + console.log(name) + let dataView = advancedTexture.getControlByName(name); + dataView.isVisible = false; + } + } + }); + control_main.addControl(checkbox1); + var header1 = new BABYLON_GUI.TextBlock(); + header1.text = "工段数据"; + header1.width = "80px"; + header1.textHorizontalAlignment = BABYLON_GUI.Control.HORIZONTAL_ALIGNMENT_LEFT; + header1.color = "white"; + control_main.addControl(header1); + // 添加抓取事件 canvas.addEventListener('mousemove', (event) => { // 使用 scene.pick 检测鼠标拾取 @@ -1048,32 +1087,32 @@ export default { }, - // getMgroupChartData(name){ - // var that = this; - // let obj = {}; - // obj.type = 'month_s'; - // obj.start_time = that.start_time; - // obj.end_time = that.end_time; - // obj.mgroup__name=val; - // obj.page=0; - // this.$API.enm.enstat.req(obj).then((res) => { - // let list0 = res.sort(this.compare('month_s')); - // let list = list0.sort(this.compare('year_s')); - // let seriesData4 = [0,0,0,0,0,0], - // seriesData5 = [0,0,0,0,0,0], - // seriesData6 = [0,0,0,0,0,0]; - // list.forEach(item=>{ - // let index = that.arrMonth.indexOf(item.month_s); - // seriesData4[index] = Number(item.elec_consume_unit) - // seriesData5[index] = Number(item.total_production) - // seriesData6[index] = Number(item.run_rate) - // }) - // that.seriesData4=seriesData4; - // that.seriesData5=seriesData5; - // that.seriesData6=seriesData6; - // that.initCharts1(); - // }) - // }, + getMgroupChartData(name){ + var that = this; + let obj = {}; + obj.type = 'month_s'; + obj.start_time = that.start_time; + obj.end_time = that.end_time; + obj.mgroup__name=name; + obj.page=0; + this.$API.enm.enstat.req(obj).then((res) => { + let list0 = res.sort(this.compare('month_s')); + let list = list0.sort(this.compare('year_s')); + let seriesData4 = [0,0,0,0,0,0], + seriesData5 = [0,0,0,0,0,0], + seriesData6 = [0,0,0,0,0,0]; + list.forEach(item=>{ + let index = that.arrMonth.indexOf(item.month_s); + seriesData4[index] = Number(item.elec_consume_unit) + seriesData5[index] = Number(item.total_production) + seriesData6[index] = Number(item.run_rate) + }) + that.seriesData4=seriesData4; + that.seriesData5=seriesData5; + that.seriesData6=seriesData6; + that.initCharts1(); + }) + }, }, unmounted() { this.close(); diff --git a/src/views/home/event.vue b/src/views/home/event.vue index 9ab23fb3..7577fb61 100644 --- a/src/views/home/event.vue +++ b/src/views/home/event.vue @@ -37,17 +37,16 @@ stripe @resetQuery="resetQuery" > - + + + + - - - - - - - + + - - - +