BIM应用大屏开发

yanzhu-bigscreen/src/views/bimManage.vue

@@ -117,44 +117,40 @@
             </div>
             <div class="warn-info">
               <div class="warn-item">
-               
-                  <div class="czz-number-img czz-number-img-blue">
-                    <svg-icon icon-class="notesearch" />
-                  </div>
-                  <div class="warn-data">
-                    <div class="warn-data-val led-number">888</div>
-                    <div class="warn-data-text">问题数</div>
-                  </div>
+                <div class="czz-number-img czz-number-img-blue">
+                  <svg-icon icon-class="notesearch" />
+                </div>
+                <div class="warn-data">
+                  <div class="warn-data-val led-number">{{safetyInfo.safetyCount}}</div>
+                  <div class="warn-data-text">问题数</div>
+                </div>
               </div>
               <div class="warn-item">
-               
-                  <div class="czz-number-img czz-number-img-blue">
-                    <svg-icon icon-class="tools"  />
-                  </div>
-                  <div class="warn-data">
-                    <div class="warn-data-val led-number">888</div>
-                    <div class="warn-data-text">整改数</div>
-                  </div>
+                <div class="czz-number-img czz-number-img-blue">
+                  <svg-icon icon-class="tools" />
+                </div>
+                <div class="warn-data">
+                  <div class="warn-data-val led-number">{{safetyInfo.safetyRectifyCount}}</div>
+                  <div class="warn-data-text">整改数</div>
+                </div>
               </div>
               <div class="warn-item">
-               
-                  <div class="czz-number-img czz-number-img-green">
-                    <svg-icon icon-class="percent"  class="green"/>
-                  </div>
-                  <div class="warn-data">
-                    <div class="warn-data-val led-number">888</div>
-                    <div class="warn-data-text">整改率</div>
-                  </div>
+                <div class="czz-number-img czz-number-img-green">
+                  <svg-icon icon-class="percent" class="green" />
+                </div>
+                <div class="warn-data">
+                  <div class="warn-data-val led-number">{{safetyInfo.safetyRectifyRate}}%</div>
+                  <div class="warn-data-text">整改率</div>
+                </div>
               </div>
               <div class="warn-item">
-               
-                  <div class="czz-number-img czz-number-img-blue">
-                    <svg-icon icon-class="warn" class="red"/>
-                  </div>
-                  <div class="warn-data">
-                    <div class="warn-data-val led-number">888</div>
-                    <div class="warn-data-text">超时数</div>
-                  </div>
+                <div class="czz-number-img czz-number-img-blue">
+                  <svg-icon icon-class="warn" class="red" />
+                </div>
+                <div class="warn-data">
+                  <div class="warn-data-val led-number">{{safetyInfo.safetyTimeoutCount}}</div>
+                  <div class="warn-data-text">超时数</div>
+                </div>
               </div>
             </div>
           </div>
@@ -387,6 +383,13 @@ export default {
       planFinishRate: 0,
       finishRate: 0,
       photographyList: [],
+      safetyListCount:[],
+      safetyInfo:{
+        safetyRectifyCount:0,
+        safetyRectifyRate:0,
+        safetyTimeoutCount:0,
+        safetyTimeoutRate:0
+      }
     };
   },
   beforeDestroy() {
@@ -411,7 +414,6 @@ export default {
     );
     this.selProject = this.$store.getters.selProject;
     this.updateProjectInfo();
-    console.log("----mount--->");
     document.body.classList.add("is-sapi");
     this.initEngine();
     this.$api.dict("device_tower_warning").then((d) => {
@@ -429,8 +431,8 @@ export default {
       let opt = {
         tooltip: {
           show: true,
-          formatter: function(params){
-            return params.seriesName + "<br/>"+params.marker + (params.value * 100).toFixed(2) + "%";
+          formatter: function (params) {
+            return params.seriesName + "<br/>" + params.marker + (params.value * 100).toFixed(2) + "%";
           },
         },
         series: [
@@ -438,7 +440,7 @@ export default {
             type: "liquidFill",
             data: [n == 0 ? this.planFinishRate : this.finishRate],
             name: n == 0 ? "计划完成" : "实际完成",
-            color: [n==0?"orange":"#47D89F"], //颜色
+            color: [n == 0 ? "orange" : "#47D89F"], //颜色
             //波浪动画效果
             waveAnimation: true,
             animationEasingUpdate: "quinticInOut",
@@ -450,12 +452,12 @@ export default {
             outline: {
               show: false,
             },
-            label:{
-              fontSize: 20,
+            label: {
+              fontSize: 30,
               formatter: function (param) {
-                return (param.value*100).toFixed(2) + "%";
+                return (param.value * 100).toFixed(2) + "%";
               },
-            }
+            },
           },
         ],
       };
@@ -471,6 +473,28 @@ export default {
       this.getRootScheduleNode();
       this.getFinishRate();
       this.selectLastPhotography();
+      this.getSafetyListCount();
+    },
+    getSafetyListCount() {
+      let postData = {
+        projectId: this.selProject.id,
+        comId: this.selProject.comId,
+      };
+      this.$api.safety.listCountForBG({ ...postData, infoType: 0 }).then((d) => {
+        this.safetyListCount = d.data;
+        let func=lbl=>{
+          let obj=this.safetyListCount.find(it=>it.remark==lbl);
+          return obj?obj.id||0:0;
+        };
+        this.safetyInfo.safetyCount=func("全部");
+        this.safetyInfo.safetyRectifyCount=func("完成");
+        if(this.safetyInfo.safetyCount==0){
+          this.safetyInfo.safetyRectifyRate=100;
+        }else{
+          this.safetyInfo.safetyRectifyRate=(this.safetyInfo.safetyRectifyCount/this.safetyInfo.safetyCount*100.0).toFixed(2);
+        }
+        this.safetyInfo.safetyTimeoutCount=func("整改超时");
+      });
     },
     selectLastPhotography() {
       this.$api.detail.photographyList(this.selProject.id).then((d) => {
@@ -1220,39 +1244,43 @@ export default {
       }
     }
   }
-  .warn-info{
+  .warn-info {
     height: calc(100% - 30px);
-    .warn-item{
+    .warn-item {
       display: inline-flex;
-      width:50%;
-      height:50%;
-      justify-content: center;
+      width: calc(50% - 30px);
+      height: 50%;
       align-items: center;
-      .czz-number-img{
-        width:80px;
+      padding-left: 30px;
+      .czz-number-img {
+        width: 80px;
         height: 80px;
         line-height: 80px;
-        .svg-icon{
+        .svg-icon {
           width: 40px;
           height: 40px;
           fill: #5cc0eb;
           position: relative;
-          top:12px;
-          &.red{
+          top: 12px;
+          &.red {
             fill: red;
           }
-          &.green{
+          &.green {
             fill: #00e900;
           }
         }
       }
-      .warn-data{
-        margin-left:10px;
-        .warn-data-val{
-          font-size:30px;
+      .warn-data {
+        margin-left: 10px;
+        .warn-data-val {
+          font-size: 40px;
           font-weight: 700;
           color: #22d0d2;
         }
+        .warn-data-text{
+          margin-top:10px;
+          text-align: center;
+        }
       }
     }
   }