ZZJ
2021-12-03 1706494087a9f8fd22f691d279e9ef7756cd316d
src/pages/internetEquipment/components/headCard.vue
@@ -4,7 +4,7 @@
          <div class="number" :style="colorStyle">{{number}}</div>
          <div class="info">{{info}}</div>
      </div>
      <img class="card-right" :src="src" alt="">
    <img class="card-right" :src="src" alt="" />
  </div>
</template>
@@ -12,34 +12,32 @@
export default {
    props: {
        number: {
            require: true
      require: true,
        },
        info: {
            require: true
      require: true,
        },
        icon: {
            require: true
      require: true,
        },
        color: {
            require: true
      require: true,
        },
        src: {
            require: true
        }
      require: true,
    },
    },
    data (){
        return {
        }
    return {};
    },
    computed: {
        colorStyle (){
            return {
                "--color":this.color
            }
        }
    }
}
        "--color": this.color,
      };
    },
  },
};
</script>
<style scoped lang="scss">
@@ -48,10 +46,10 @@
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
  padding: 20px 2%;
    width: 187px;
    height: 90px;
    background: #FFFFFF;
  background: #ffffff;
    box-shadow: 0px 2px 10px rgba(141, 164, 187, 0.25);
    border-radius: 15px;
@@ -63,15 +61,13 @@
        }
        .info {
            font-size: 12px;
            color: #4F4F4F;
;
      color: #4f4f4f;
        }
    }
    .card-right {
        width: 58px;
        height: 58px;
    }
}
</style>