lct

Your Name

2022-08-08 fe4005fe29aafa104485ffa2392598bd8dccd347

 src/views/intellectInspect/intelligentMap/index.vue

@@ -1,11 +1,11 @@
<template>
  <div class="container">
    <div class="big-title"><span></span>大型实验室智能巡检系统<span></span></div>
        <div class="big-title" @click="goBack"><span></span>大型实验室智能巡检系统<span></span></div>
    <div style="font-size: 14px;color: #00ffff">{{present}}</div>
    <div class="blocks">
      <div class="current-data">
        <div class="data-area">
          <img src="../../../assets/loginPage/xj-icon.png">
                    <img src="../../../assets/loginPage/xj-icon.png" />
          <div>当前巡检：<span>实验室装置区</span></div>
        </div>
        <div class="data-spot">
@@ -106,9 +106,7 @@
            <div class="pulse1"></div>
          </section>
          <span></span>
          <p>
            完成巡检
          </p>
                    <p>完成巡检</p>
        </div>
        <div class="item start">
          <section>
@@ -117,9 +115,7 @@
            <div class="pulse1"></div>
          </section>
          <span></span>
          <p>
            开始巡检
          </p>
                    <p>开始巡检</p>
        </div>
        <div class="item item-l">
          <section>
@@ -148,12 +144,12 @@
          </div>
        </div>
        <div class="pic-tit water">
          <img src="../../../assets/loginPage/equipment.JPG">
                    <img src="../../../assets/loginPage/equipment.JPG" />
          <p>实验室装置区</p>
        </div>
        <div></div>
        <div class="pic-tit">
          <img src="../../../assets/loginPage/wind.JPG">
                    <img src="../../../assets/loginPage/wind.JPG" />
          <p>实验室风机系统</p>
        </div>
        <div class="item item-l warning">
@@ -185,7 +181,7 @@
        <div></div>
        <div></div>
        <div class="pic-tit water">
          <img src="../../../assets/loginPage/watersys.JPG">
                    <img src="../../../assets/loginPage/watersys.JPG" />
          <p>实验室循环水系统</p>
        </div>
        <div class="item item-t">
@@ -239,15 +235,9 @@
        <div></div>
        <div></div>
      </div>
      <div class="section-1">

      </div>
      <div class="section-2">

      </div>
      <div class="section-3">

      </div>
            <div class="section-1"></div>
            <div class="section-2"></div>
            <div class="section-3"></div>
    </div>
  </div>
</template>
@@ -255,20 +245,24 @@
<script>
export default {
  name: 'NewForm',
  props: {

  },
    props: {},
  data(){
    return{
      present: ''
    }
        };
  },
  created() {
    setInterval(() => {
      this.present = new Date().toLocaleString()
    }, 1000)
            this.present = new Date().toLocaleString();
        }, 1000);
    },
    methods: {
        goBack() {
            this.$router.go(-1);
            // this.$router.push('/discriminate');
  }
}
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
@@ -277,7 +271,7 @@
    0% {
      transform: scale(0.3);
      -webkit-transform: scale(0.3);
      opacity: 0.0;
        opacity: 0;
    }

    25% {
@@ -301,7 +295,7 @@
    100% {
      transform: scale(1);
      -webkit-transform: scale(1);
      opacity: 0.0;
        opacity: 0;
    }
  }

@@ -309,7 +303,7 @@
    0% {
      transform: scale(0.3);
      -webkit-transform: scale(0.3);
      opacity: 0.0;
        opacity: 0;
    }

    25% {
@@ -333,7 +327,7 @@
    100% {
      transform: scale(0.8);
      -webkit-transform: scale(0.8);
      opacity: 0.0;
        opacity: 0;
    }
  }
  
@@ -354,7 +348,7 @@
    display: flex;
    flex-direction: column;
    align-items: center;
    background: url("../../../assets/loginPage/map-bg.jpg") no-repeat center;
    background: url('../../../assets/loginPage/map-bg.jpg') no-repeat center;
    background-size: 100% 100%;
    .big-title{
      height: 40px;
@@ -371,7 +365,7 @@
      span{
        width: 60px;
        height: 1px;
        background: #36FCFC;
            background: #36fcfc;
        margin: 0 20px;
      }
    }
@@ -467,8 +461,8 @@
            &>div{
              padding: 10px 0;
              border-radius: 8px;
              background-image: linear-gradient(to right,rgba(8,109,209,.4),rgba(11,255,255,.2));
              border: 1px solid rgba(54,252,252,.6);
                    background-image: linear-gradient(to right, rgba(8, 109, 209, 0.4), rgba(11, 255, 255, 0.2));
                    border: 1px solid rgba(54, 252, 252, 0.6);
              display: flex;
              flex-direction: column;
              justify-content: center;
@@ -487,7 +481,7 @@

                  &:first-of-type{
                    text-align: right;
                    color: rgba(255,255,255,.8);
                                color: rgba(255, 255, 255, 0.8);
                  }
                }
              }
@@ -501,16 +495,16 @@
              text-align: center;
              color: #fff;
              border-radius: 8px;
              background-image: linear-gradient(to right,rgba(11,255,255,.2),rgba(8,109,209,.4));
              border: 1px solid rgba(54,252,252,.6);
                    background-image: linear-gradient(to right, rgba(11, 255, 255, 0.2), rgba(8, 109, 209, 0.4));
                    border: 1px solid rgba(54, 252, 252, 0.6);
            }
          }

          .item-t{
            border-top: 1px solid #36FCFC;
                border-top: 1px solid #36fcfc;
          }
          .item-l{
            border-left: 1px solid #36FCFC;
                border-left: 1px solid #36fcfc;
          }
          .warning{
            &>section{
@@ -588,7 +582,7 @@
            span{
              width: 1px;
              height: 50px;
              background: #36FCFC;
                    background: #36fcfc;
              position: absolute;
              top: -10px;
              left: 0;
@@ -608,7 +602,7 @@
            span{
              width: 100%;
              height: 1px;
              background: #36FCFC;
                    background: #36fcfc;
              position: absolute;
              top: 0;
              left: calc(40px - 100%);
@@ -629,13 +623,13 @@
        padding: 20px 30px;
        box-sizing: border-box;
        transform: translateX(-65%);
        background: url("../../../assets/loginPage/xj-bg.png") no-repeat center;
            background: url('../../../assets/loginPage/xj-bg.png') no-repeat center;
        background-size: 100% 100%;

        .data-area{
          display: flex;
          align-items: center;
          border-bottom: 1px solid #00FFFF;
                border-bottom: 1px solid #00ffff;
          font-weight: bold;
          padding-bottom: 10px;
          box-sizing: border-box;
@@ -649,10 +643,10 @@

          div{
            font-size: 15px;
            color: rgba(255,255,255,.8);
                    color: rgba(255, 255, 255, 0.8);

            span{
              color: #00FFFF;
                        color: #00ffff;
            }
          }
        }
@@ -668,15 +662,15 @@
            align-items: center;
            width: 50%;
            font-size: 14px;
            color: rgba(255,255,255,.8);
                    color: rgba(255, 255, 255, 0.8);

            p{
              margin-top: 6px;
              color: #00FFFF;
                        color: #00ffff;
            }

            &:first-of-type{
              border-right: 1px solid #36FCFC;
                        border-right: 1px solid #36fcfc;
            }
          }
        }
@@ -687,8 +681,8 @@
        top: -10px;
        width: calc((200vw - 240px) / 7 + 60px);
        height: 630px;
        background: rgba(0,100,190,.1);
        border: 1px solid rgba(0,100,190,.4);
            background: rgba(0, 100, 190, 0.1);
            border: 1px solid rgba(0, 100, 190, 0.4);
        border-radius: 8px;
      }
      .section-2{
@@ -697,8 +691,8 @@
        top: 150px;
        width: calc((200vw - 240px) / 7 + 60px);
        height: 470px;
        background: rgba(0,100,190,.1);
        border: 1px solid rgba(0,100,190,.4);
            background: rgba(0, 100, 190, 0.1);
            border: 1px solid rgba(0, 100, 190, 0.4);
        border-radius: 8px;
      }
      .section-3{
@@ -707,8 +701,8 @@
        top: 630px;
        width: calc((500vw - 600px)/ 7 + 30px);
        height: 180px;
        background: rgba(0,100,190,.1);
        border: 1px solid rgba(0,100,190,.4);
            background: rgba(0, 100, 190, 0.1);
            border: 1px solid rgba(0, 100, 190, 0.4);
        border-radius: 8px;
      }
    }