点位标签

fuliqi

2024-08-07 7094168e0cfb963646cde6f9b9eb4329aaf3d10d

 src/views/screen/newPage/index.vue

@@ -46,14 +46,14 @@
                <div class="data-lable">设备总数</div>
                <div class="data-num type1">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                  ><i class="el-icon-top"></i>
                </div>
              </div>
              <div class="data-info">
                <div class="data-lable">设备正常数</div>
                <div class="data-num type2">
                  <span v-roll>{{ 1123 }}</span
                  ><i class="el-icon-bottom"></i>
                  ><i class="el-icon-top"></i>
                </div>
              </div>
              <div class="data-info">
@@ -139,15 +139,24 @@
        <div class="card_header">
          <div class="title">人脸考核数据</div>
          <div style="width: 600px; margin-left: -20px">
            <ExamineChart class="wrapper-item"></ExamineChart>
            <ExamineChart class="wrapper-item" dataType="face"></ExamineChart>
          </div>
        </div>
      </div>
      <div class="footer_card">
        <div class="card_header">
          <div class="title">车辆考核数据</div>
          <div style="width: 600px; margin-left: -20px">
            <ExamineChart class="wrapper-item"></ExamineChart>
          <div class="titleCar">车辆考核数据</div>
        </div>
        <div
          style="
            overflow: hidden;
            overflow-x: auto;
            margin-top: -9px;
            height: 90%;
          "
        >
          <div style="width: 750px">
            <ExamineChart class="wrapper-item" dataType="car"></ExamineChart>
          </div>
        </div>
      </div>
@@ -155,7 +164,7 @@
        <div class="card_header">
          <div class="title">视频考核数据</div>
          <div style="width: 600px; margin-left: -20px">
            <ExamineChart class="wrapper-item"></ExamineChart>
            <ExamineChart class="wrapper-item" dataType="video"></ExamineChart>
          </div>
        </div>
      </div>
@@ -205,7 +214,9 @@
    returnPath() {
      this.$router.push("/index");
    },
    handleClick() {},
    handleClick(tab, event) {
      console.log(tab, event);
    },
  },
};
</script>
@@ -221,37 +232,37 @@
  }
  .return-button {
    position: absolute;
    right: 20px;
    right: -5px;
    top: 20px;
    background: url("../../../assets/images/screen/backBt.png");
    background-size: 100% 100%;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    color: #4481dd;
    padding: 15px 25px;
    cursor: pointer;
    font-size: 20px;
  }
}
::v-deep .tabs-box {
  margin-top: 5px;
  .el-tabs__item {
    color: #ffffff !important;
    font-size: 20px;
    font-size: 26px;
  }
  .is-active {
    color: #66b5ff !important;
    color: #00b8ff !important;
    // background: url("../../../assets/images/screen/button1.png");
    // background-size: cover !important;
    // background-repeat: no-repeat !important;
    // background-position: center center !important;
    background: linear-gradient(#66b5ff, #66b5ff) left top,
      linear-gradient(#66b5ff, #66b5ff) left top,
      linear-gradient(#66b5ff, #66b5ff) right top,
      linear-gradient(#66b5ff, #66b5ff) right top,
      linear-gradient(#66b5ff, #66b5ff) left bottom,
      linear-gradient(#66b5ff, #66b5ff) left bottom,
      linear-gradient(#66b5ff, #66b5ff) right bottom,
      linear-gradient(#66b5ff, #66b5ff) right bottom;
    background: linear-gradient(#00b8ff, #00b8ff) left top,
      linear-gradient(#00b8ff, #00b8ff) left top,
      linear-gradient(#00b8ff, #00b8ff) right top,
      linear-gradient(#00b8ff, #00b8ff) right top,
      linear-gradient(#00b8ff, #00b8ff) left bottom,
      linear-gradient(#00b8ff, #00b8ff) left bottom,
      linear-gradient(#00b8ff, #00b8ff) right bottom,
      linear-gradient(#00b8ff, #00b8ff) right bottom;
    background-repeat: no-repeat;
    background-size: 0.1vw 0.5vw, 0.5vw 0.1vw;
  }
@@ -281,7 +292,6 @@
::v-deep .el-tabs__item {
  margin: 5px 30px;
  padding: 0px 25px !important;
  border-radius: 5px;
  background: linear-gradient(#ffffff, #ffffff) left top,
    linear-gradient(#ffffff, #fff) left top,
    linear-gradient(#ffffff, #ffffff) right top,
@@ -314,11 +324,11 @@
    // background-size: 100% 100%;
    // background-repeat: no-repeat !important;
    // background-position: center center !important;
    font-size: 36px;
    font-size: 40px;
    font-weight: bold;
    position: absolute;
    top: -60px;
    left: 0px;
    left: 10px;
  }
}
.large_screen_box {
@@ -354,6 +364,14 @@
    margin: 5px 0;
    .card_header {
      height: 40px;
      .titleCar {
        margin-left: 20px;
        padding-top: 5px;
        color: #fff;
        letter-spacing: 2px;
        font-size: 20px;
        font-style: italic;
      }
    }
  }
}