scada添加新指标

src/views/dataBoard/scadaCraftMap/craftConfig.js

@@ -15,5 +15,15 @@ export const flowConfig=[
   title:"三水厂工艺流程",
   type:"image",
   src:"threeFac.png",
+},
+{
+  title:"第一取水口",
+  type:"image",
+  src:"第一取水口.png",
+},
+{
+  title:"第二取水口",
+  type:"image",
+  src:"第二取水口.png",
 }
 ]

src/views/dataBoard/scadaCraftMap/index.vue

@@ -62,7 +62,7 @@
       class="graph"
       style="width: 100%; height: 100%; touch-action: none"
     />
-    <div v-if="!craftShow" id="graphContainer2" :style="'background-image: url('+flowImage+')'">
+    <div v-if="!craftShow" id="graphContainer2" :style="'background-image: url('+flowImage+');'+((currentLoadCraft=='3'||currentLoadCraft=='4')?'background-size: 60%;background-repeat: no-repeat;background-position: center;':'')">
       <template v-for="(item,key) in currentSiteList">
         <div  :style="'position: absolute;left:'+item.position.x+' ; top:'+item.position.y+';'" class='siteInfo' :key="'siteInfo_'+key">
           <template v-for="(item2,key2) in item.data">
@@ -105,7 +105,7 @@ import { parseTime } from "@/utils/index";
 import Echarts from "echarts";
 import { getScadaAlarmDataPage, getScadaData } from "@/api/scada";
 import scadaSiteCom from "@/views/zhpt/scada/scadaMonitor/components/scadaSiteCom.vue";
-import {siteConfigTwo,siteConfigOne,siteConfigThree} from './siteConfig';
+import {siteConfigTwo,siteConfigOne,siteConfigThree,qskTwo,qskOne} from './siteConfig';
 import commonMe from '@/utils/common.js'
 export default {
   name: "CraftMap2",
@@ -254,6 +254,7 @@ export default {
       const cache = {};
       const modulesFiles = require.context("./images", true, /\.(png|gif)$/);
       modulesFiles.keys().forEach((key) => (cache[key] = modulesFiles(key)));
+      debugger
       var imagesUrl = "./";
       var div = this.$refs.graphContainer;
       if(div){
@@ -273,6 +274,12 @@ export default {
       }else if(this.currentLoadCraft=='2'){
         this.currentSiteList=siteConfigThree;
         this.renderSiteInfo(siteConfigThree);
+      }else if(this.currentLoadCraft=='3'){
+        this.currentSiteList=qskOne;
+        this.renderSiteInfo(qskOne);
+      }else if(this.currentLoadCraft=='4'){
+        this.currentSiteList=qskTwo;
+        this.renderSiteInfo(qskTwo);
       }
       if(tempData.type=="image"){
         this.craftShow=false;
@@ -641,9 +648,9 @@ export default {
      * 获取指标内容
     */
     renderSiteInfo(siteInfoList){
-      const data = { type: 1 };
+      // const data = { type: 1 };
+      const data = {  };
       this.getScadaData(data).then(res=>{
-        debugger
         const tempValue=[];
         if(res&&res.result){
           for(let i=0;i<res.result.length;i++){

src/views/dataBoard/scadaCraftMap/siteConfig.js

@@ -367,4 +367,47 @@ export const siteConfigThree = [
       }
     ]
   },
+]
+//取水口1
+export const qskOne = [
+  {
+    title: "取水口PLC1",
+    position: { x: "22%", y: "18%" },
+    data: [
+      {
+        key: "0220410007.awf",
+        name: "取水累计",
+        value: "",
+        isAlarm: false,//是否报警
+      },
+      {
+        key: "0220410007.wf",
+        name: "取水瞬时",
+        value: "",
+        isAlarm: false,//是否报警
+      }
+    ]
+  },
+]
+
+//取水口2
+export const qskTwo = [
+  {
+    title: "取水口PLC1",
+    position: { x: "63%", y: "18%" },
+    data: [
+      {
+        key: "0230210291.awf",
+        name: "取水累计",
+        value: "",
+        isAlarm: false,//是否报警
+      },
+      {
+        key: "0230210291.wf",
+        name: "取水瞬时",
+        value: "",
+        isAlarm: false,//是否报警
+      }
+    ]
+  },
 ]

src/views/zhpt/scada/scadaCraftMap/craftConfig.js

@@ -15,5 +15,14 @@ export const flowConfig=[
   title:"三水厂工艺流程",
   type:"image",
   src:"threeFac.png",
+},{
+  title:"第一取水口",
+  type:"image",
+  src:"第一取水口.png",
+},
+{
+  title:"第二取水口",
+  type:"image",
+  src:"第二取水口.png",
 }
 ]

src/views/zhpt/scada/scadaCraftMap/siteConfig.js

@@ -367,4 +367,48 @@ export const siteConfigThree = [
       }
     ]
   },
+]
+
+//取水口1
+export const qskOne = [
+  {
+    title: "取水口PLC1",
+    position: { x: "22%", y: "18%" },
+    data: [
+      {
+        key: "0220410007.awf",
+        name: "取水累计",
+        value: "",
+        isAlarm: false,//是否报警
+      },
+      {
+        key: "0220410007.wf",
+        name: "取水瞬时",
+        value: "",
+        isAlarm: false,//是否报警
+      }
+    ]
+  },
+]
+
+//取水口2
+export const qskTwo = [
+  {
+    title: "取水口PLC1",
+    position: { x: "63%", y: "18%" },
+    data: [
+      {
+        key: "0230210291.awf",
+        name: "取水累计",
+        value: "",
+        isAlarm: false,//是否报警
+      },
+      {
+        key: "0230210291.wf",
+        name: "取水瞬时",
+        value: "",
+        isAlarm: false,//是否报警
+      }
+    ]
+  },
 ]

src/views/zhpt/scada/scadaCraftMap/widget.vue

@@ -62,8 +62,9 @@
       class="graph"
       style="width: 100%; height: 100%; touch-action: none"
     />
-    <div v-if="!craftShow" id="graphContainer2" :style="'background-image: url('+flowImage+')'">
-      <template v-for="(item,key) in currentSiteList">
+    <!-- <div v-if="!craftShow" id="graphContainer2" :style="'background-image: url('+flowImage+')'"> -->
+ <div v-if="!craftShow" id="graphContainer2" :style="'background-image: url('+flowImage+');'+((currentLoadCraft=='3'||currentLoadCraft=='4')?'background-size: 60%;background-repeat: no-repeat;background-position: center;':'')">
+     <template v-for="(item,key) in currentSiteList">
         <div  :style="'position: absolute;left:'+item.position.x+' ; top:'+item.position.y+';'" class='siteInfo' :key="'siteInfo_'+key">
           <template v-for="(item2,key2) in item.data">
             <div class='siteInfoItem' @click="showHistory(item2)" :class='item2.isAlarm==0?"":"isAlarm"' :key='"siteInfoItem_"+key+""+key2'>
@@ -104,7 +105,7 @@ import { parseTime } from "@/utils/index";
 import Echarts from "echarts";
 import { getScadaAlarmDataPage, getScadaData } from "@/api/scada";
 import scadaSiteCom from "@/views/zhpt/scada/scadaMonitor/components/scadaSiteCom.vue";
-import {siteConfigTwo,siteConfigOne,siteConfigThree} from './siteConfig';
+import {siteConfigTwo,siteConfigOne,siteConfigThree,qskTwo,qskOne} from './siteConfig';
 import commonMe from '@/utils/common.js'
 export default {
   name: "CraftMap2",
@@ -253,6 +254,7 @@ export default {
       const cache = {};
       const modulesFiles = require.context("./images", true, /\.(png|gif)$/);
       modulesFiles.keys().forEach((key) => (cache[key] = modulesFiles(key)));
+      debugger
       var imagesUrl = "./";
       var div = this.$refs.graphContainer;
       if(div){
@@ -272,6 +274,12 @@ export default {
       }else if(this.currentLoadCraft=='2'){
         this.currentSiteList=siteConfigThree;
         this.renderSiteInfo(siteConfigThree);
+      }else if(this.currentLoadCraft=='3'){
+        this.currentSiteList=qskOne;
+        this.renderSiteInfo(qskOne);
+      }else if(this.currentLoadCraft=='4'){
+        this.currentSiteList=qskTwo;
+        this.renderSiteInfo(qskTwo);
       }
       if(tempData.type=="image"){
         this.craftShow=false;
@@ -640,7 +648,8 @@ export default {
      * 获取指标内容
     */
     renderSiteInfo(siteInfoList){
-      const data = { type: 1 };
+      // const data = { type: 1 };
+      const data = {  };
       this.getScadaData(data).then(res=>{
         const tempValue=[];
         if(res&&res.result){
@@ -954,6 +963,7 @@ export default {
   bottom: 0%;
   left: 0%;
   margin: auto;
+  background: black !important;
   // #graphContainer{
   //   background-image:url("../../../assets/images/gyt.png") ;
   //   background-repeat: no-repeat;