内容修改

longyvfengyun

2023-10-09 d310c767eef62fc8202f531e7492ecd58779af72

 src/views/home/components/homeDetail.vue

@@ -1,5 +1,5 @@
<script setup>
import image5 from "@/views/home/images/质控室.jpg";
import MapPin from "@/components/MapPin.vue";

const props = defineProps({
   info: {
@@ -12,7 +12,19 @@
               src: "",
               width: 100,
               height: 100
            }
            },
            info: {}
         }
      }
   },
   vals: {
      type: Object,
      default() {
         return {
            diff: 0,
            hum: 48.71,
            num: 3,
            tmp: 26.56
         }
      }
   }
@@ -21,6 +33,12 @@

<template>
   <div class="home-detail">
      <div class="vals-wrapper">
         <div class="vals-name">{{info.name}}</div>
         <div class="vals-item">温度: {{vals.tmp}}℃</div>
         <div class="vals-item">湿度: {{vals.hum}}%RH</div>
         <div class="vals-item">压差: {{vals.diff}}Pa</div>
      </div>
      <div class="home-detail-img">
         <img :src="info.img.src" alt=""/>
      </div>
@@ -29,9 +47,22 @@

<style lang="less" scoped>
.home-detail {
   position: relative;
   width: 600px;
   text-align: center;
   background-color: #ffffff;
   .vals-wrapper {
      position: absolute;
      top: 8px;
      left: 8px;
      text-align: left;
      padding: 8px;
      background-color: #303133;
      color: #FFFFFF;
      .vals-name {
         text-align: center;
      }
   }
}
.home-detail-img {
   display: inline-block;