第一排样式完成

2024-09-04 15:22:48 +08:00
parent 4e33b3ae02
commit 6b2906fb53
5 changed files with 208 additions and 11 deletions
--- a/project/biaopin/dv/weiyang/comps/iconSmallPanel.vue
+++ b/project/biaopin/dv/weiyang/comps/iconSmallPanel.vue
@@ -0,0 +1,35 @@
+<script>
+import ValueUnit from "./valueUnit.vue";
+
+export default {
+  name: "iconSmallPanel",
+  components: {ValueUnit},
+  props: ["icon", "label", "value", "unit"]
+}
+</script>
+
+<template>
+  <section class="iconSmallPanel">
+    <img v-if="icon" class="icon" :src="icon">
+    <div class="fill" v-text="label"/>
+    <value-unit :value="value" :unit="unit"/>
+  </section>
+</template>
+
+<style scoped lang="scss">
+.iconSmallPanel {
+  font-weight: 400;
+  font-size: 15px;
+  color: #FFFFFF;
+  display: flex;
+  align-items: center;
+  gap: 13px;
+
+  .icon {
+    width: 34px;
+    height: 34px;
+    flex-shrink: 0;
+  }
+
+}
+</style>