基础样式完成

project/biaopin/dv/weiyang/comps/navTabs.vue

@@ -0,0 +1,62 @@
+<script>
+export default {
+  name: "navTabs",
+  props: {
+    list: {default: []}
+  },
+  data() {
+    return {
+      active: 0
+    }
+  },
+  methods: {
+    handleClick(e, i) {
+      this.active = i
+      this.$emit("click", e)
+    }
+  }
+}
+</script>
+
+<template>
+  <section class="navTabs">
+    <div class="item" v-for="(e, i) in list" :key="i" v-text="e.label" @click="handleClick(e,i)" :class="{active:i==active}"/>
+  </section>
+</template>
+
+<style scoped lang="scss">
+.navTabs {
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  color: #01FFFF;
+  gap: 4px;
+
+  .item {
+    opacity: .7;
+    position: relative;
+    cursor: pointer;
+
+    &:hover {
+      opacity: 1;
+    }
+
+    &.active {
+      opacity: 1;
+
+      &:after {
+        content: " ";
+        display: block;
+        position: absolute;
+        bottom: 0;
+        left: 50%;
+        width: 16px;
+        height: 2px;
+        transform: translate(-50%, 8px);
+        background: #01FFFF;
+        border-radius: 4px;
+      }
+    }
+  }
+}
+</style>

project/biaopin/dv/weiyang/comps/valueUnit.vue

@@ -13,7 +13,7 @@ export default {
 
 <style scoped lang="scss">
 .valueUnit {
-  font-family: DINAlternate-Bold;
+  font-family: DINAlternate-Bold,serif;
   font-weight: 700;
   font-size: 22px;
   color: #02FEFF;
@@ -30,6 +30,7 @@ export default {
 
   &.mini {
     font-size: 16px;
+    line-height: 20px;
 
     & > p {
       font-size: 12px;