feat:创建新分支

charles

2024-04-29 b95cf940af8e01e4eca30b2599b029c2f645bd1e

 src/views/dashboard/components/KnowledgeInfo.vue

@@ -1,94 +1,66 @@
<template>
  <div class="knowledge-info">
    <svg width="100%" height="100%">
      <text
        class="text-item"
        x="60"
        y="80"
        style="
          fill: rgb(211 211 211);
          font-weight: bold;
          padding: 5px;
          font-size: 14px;
          display: inline-block;
          border-radius: 8px;
          cursor: pointer;
          postion: absolute;
          left: 200;
          top: 40;
        "
      >
        误报警
      </text>
      <text
        class="text-item"
        x="50"
        y="170"
        text-anchor="middle"
        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
      >
        管路整动
      </text>
      <text
        class="text-item"
        x="245"
        y="250"
        text-anchor="middle"
        font-size="20px"
        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
      >
        冷却油度高
      </text>
      <text
        x="50"
        y="270"
        class="text-item"
        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
        text-anchor="middle"
      >
        清洁度超差
      </text>
      <text
        x="220"
        class="text-item"
        y="60"
        text-anchor="middle"
        font-size="20px"
        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px; fill: rgb(211 211 211)"
      >
        清洁度超差
      </text>
      <text
        x="280"
        class="text-item"
        y="110"
        text-anchor="middle"
        font-size="20px"
        style="padding: 5px; font-size: 14px; display: inline-block; border-radius: 8px"
      >
        保护器报警
      </text>
      <image xlink:href="~@/assets/images/voice.png" x="105" y="100" width="110" height="110" />
    </svg>
    <div class="text-item text-item1">误报警</div>
    <div class="text-item text-item2">管路整动</div>
    <div class="text-item text-item3">冷却油度高</div>
    <div class="text-item text-item4">清洁度超差</div>
    <div class="text-item text-item5">清洁度超差</div>
    <div class="text-item text-item6">保护器报警</div>
    <img src="~@/assets/images/voice.png" />
  </div>
</template>

<script setup lang="ts">
import { toRefs } from 'vue'
</script>
<script setup lang="ts"></script>
<style scoped lang="scss">
$status-ready: #024fdce8;
.knowledge-info {
  height: calc(100% - 90px - 32px);
  margin-top: 10px;
  height: 100%;
  width: 100%;
  min-height: 100px;
  margin: 0 auto;
  // margin-top: 10px;
  position: relative;
  .text-item1 {
    left: 20px;
    top: 80px;
  }
  .text-item2 {
    left: 0px;
    top: 190px;
  }
  .text-item3 {
    left: 215px;
    top: 250px;
  }
  .text-item4 {
    left: 160px;
    top: 20px;
  }
  .text-item5 {
    left: 30px;
    top: 280px;
  }
  .text-item6 {
    left: 240px;
    top: 150px;
  }
  img {
    width: 130px;
    height: 130px;
    position: absolute;
    top: 80px;
    left: 110px;
  }
  .text-item {
    width: 100px;
    padding: 5px;
    color: #e9e7e7;
    cursor: pointer;
    font-weight: bold;
    padding: 6px 15px;
    font-size: 14px;
    display: inline-block;
    border-radius: 8px;
    fill: #fff;
    color: #fff;
    cursor: pointer;
    border-radius: 10px;
    position: absolute;
    background: $status-ready;
  }
}
</style>