中建四局(进度管理):全景成像测距模块

src/views/projectAdmin/fourEngin/progress/index.vue

@@ -87,42 +87,42 @@ export default {
     };
   },
   created() {
-    // this.getList();
+    this.getList();
   },
   computed: {
     ...mapState(["projectSn"]),
   },
   methods: {
     change(val) {
-      console.log("点击的", val);
+      // console.log("点击的", val);
       this.currentIndex = val;
     },
-    // getList() {
-    //   listProgressOfTheTask({
-    //     projectSn: this.projectSn,
-    //     isNoStart: false,
-    //   }).then((res) => {
-    //     console.log("查询步骤条列表: ", res);
-    //     // state 0未开始, 1进行中, 2已完成
-    //     const progress = this.progress;
-    //     res.result.forEach((item) => {
-    //       if (item.state == 2) {
-    //         progress.push({
-    //           name: item.subitemProjectName,
-    //           date: item.actualEndTime,
-    //         });
-    //         this.numberOfCompleted++;
-    //         console.log("this.numberOfCompleted: ", this.numberOfCompleted);
-    //       } else {
-    //         progress.push({
-    //           name: item.subitemProjectName,
-    //           date: item.startTime,
-    //         });
-    //       }
-    //     });
-    //     console.log(this.progress);
-    //   });
-    // },
+    getList() {
+      listProgressOfTheTask({
+        projectSn: this.projectSn,
+        isNoStart: false,
+      }).then((res) => {
+        // console.log("查询步骤条列表: ", res);
+        // state 0未开始, 1进行中, 2已完成
+        // const progress = this.progress;
+        // res.result.forEach((item) => {
+        //   if (item.state == 2) {
+        //     progress.push({
+        //       name: item.subitemProjectName,
+        //       date: item.actualEndTime,
+        //     });
+        //     this.numberOfCompleted++;
+        //     console.log("this.numberOfCompleted: ", this.numberOfCompleted);
+        //   } else {
+        //     progress.push({
+        //       name: item.subitemProjectName,
+        //       date: item.startTime,
+        //     });
+        //   }
+        // });
+        // console.log(this.progress);
+      });
+    },
   },
 };
 </script>
@@ -146,7 +146,7 @@ export default {
     left: 40%;
     width: 212px;
     height: 38px;
-    background-image: url(../assets/temp/untab.png);
+    background-image: url(../assets/temp/tab.png);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -156,7 +156,7 @@ export default {
     left: 50%;
     width: 212px;
     height: 38px;
-    background-image: url(../assets/temp/untab.png);
+    background-image: url(../assets/temp/tab.png);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -166,7 +166,7 @@ export default {
     left: 60%;
     width: 212px;
     height: 38px;
-    background-image: url(../assets/temp/untab.png);
+    background-image: url(../assets/temp/tab.png);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -176,7 +176,8 @@ export default {
     left: 40%;
     width: 212px;
     height: 38px;
-    background-image: url(../assets/temp/tab.png);
+    z-index: 98;
+    background-image: url(../assets/temp/untab.png);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -185,8 +186,9 @@ export default {
     top: 10%;
     left: 50%;
     width: 212px;
+    z-index: 98;
     height: 38px;
-    background-image: url(../assets/temp/tab.png);
+    background-image: url(../assets/temp/untab.png);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -195,8 +197,9 @@ export default {
     top: 10%;
     left: 60%;
     width: 212px;
+    z-index: 98;
     height: 38px;
-    background-image: url(../assets/temp/tab.png);
+    background-image: url(../assets/temp/untab.png);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -276,7 +279,7 @@ export default {
     justify-content: center;
     align-items: center;
     .left{
-      width: 23%;
+      width: 22%;
       margin-right: 1%;
       height: 100%;
       .leftone{
@@ -290,7 +293,7 @@ export default {
       }
     }
     .right{
-      width: 77%;
+      width: 78%;
       height: 100%;
       background-image: url(../assets/temp/tab3.png);
       background-repeat: no-repeat;

src/views/projectAdmin/fourEngin/progress/leftThree.vue

@@ -1,5 +1,13 @@
 <template>
-    <Card title="测量控制" />
+    <Card title="测量控制">
+        <div class="maxbox">
+            <div class="btn">暂停扫描</div>
+            <div class="btn">恢复扫描</div>
+            <div class="btn">调阅全景</div>
+            <div class="btn">调阅测量</div>
+            <div class="btn">巡航记录</div>
+        </div>
+    </Card>
 </template>
 <script>
 import Card from '../components/Card.vue'
@@ -11,5 +19,26 @@ export default {
 }
 </script>
 <style lang="less" scoped>
-
+.maxbox{
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+    padding-top: 8%;
+    padding-right:5% ;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    .btn{
+        width: 161px;
+        height: 40px;
+        line-height: 40px;
+        text-align: center;
+        color: #77EDF2;
+        font-size: 20px;
+        margin-left: 5%;
+        background-image: url(.././assets/images/progress/conbtn2.png);
+        background-size: 100%;
+        background-repeat: no-repeat;
+    }
+}
 </style>

src/views/projectAdmin/fourEngin/progress/leftTwo.vue

@@ -1,15 +1,84 @@
 <template>
-    <Card title="云台控制" />
+  <Card class="container" title="云台控制">
+    <div class="maxbox">
+      <div class="left">
+        <img src=".././assets/images/progress/conbtn1.png" alt="" />
+      </div>
+      <div class="right">
+        <div class="btn">
+            <div class="one1">
+                <img src=".././assets/images/progress/img1.png" alt="" />
+            </div>
+            <div class="one2">
+                <img src=".././assets/images/progress/img2.png" alt="" />
+            </div>
+        </div>
+        <div class="btn">
+            <div class="one1">
+                <img src=".././assets/images/progress/img3.png" alt="" />
+            </div>
+            <div class="one2">
+                <img src=".././assets/images/progress/img4.png" alt="" />
+            </div>
+        </div>
+        <div class="btn">
+            <div class="one1">
+                <img src=".././assets/images/progress/img5.png" alt="" />
+            </div>
+            <div class="one2">
+                <img src=".././assets/images/progress/img6.png" alt="" />
+            </div>
+        </div>
+      </div>
+    </div>
+  </Card>
 </template>
 <script>
-import Card from '../components/Card.vue'
+import Card from "../components/Card.vue";
 export default {
   components: { Card },
   data() {
-    return {}
+    return {};
+  },
+  methods:{
   }
-}
+};
 </script>
 <style lang="less" scoped>
-
+.container {
+  width: 100%;
+  height: 100%;
+  .maxbox {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    .left {
+      width: 50%;
+      margin-top: 8%;
+      margin-left: 8%;
+    }
+    .right {
+      width: 50%;
+      margin-top: 14%;
+      margin-left: 8%;
+      div{
+        margin-top: 4%;
+      }
+      .btn{
+        width: 108px;
+        height: 35px;
+        background-image: url(.././assets/images/progress/conright.png);
+        background-size: 100%;
+        background-repeat: no-repeat;
+        display: flex;
+        justify-content:center;
+        align-items: center;
+        .one2{
+            margin-left: 25%;
+        }
+      }
+    }
+  }
+}
 </style>