完善页面

src/components/Header.vue

@@ -59,10 +59,15 @@ const loading = ref(false);
 const showLoader = ref(false);
 const pointBook = ref(null);
 const showProgress = ref(false);
+const heat = ref(0);
 const updateLoading = (value) => {
   loading.value = value;
 };
 
+const updateHot = (value) => {
+  heat.value = value;
+};
+
 onMounted(() => {
   const pages = getCurrentPages();
   const currentPage = pages[pages.length - 1];
@@ -75,13 +80,15 @@ onMounted(() => {
   ) {
     showLoader.value = true;
   }
-  uni.$on("update-header-loading", updateLoading);
   if (currentPage.route === "pages/team-battle") {
     showProgress.value = true;
   }
+  uni.$on("update-header-loading", updateLoading);
+  uni.$on("update-hot", updateHot);
 });
 onBeforeUnmount(() => {
   uni.$off("update-header-loading", updateLoading);
+  uni.$off("update-hot", updateHot);
 });
 </script>
 
@@ -110,6 +117,11 @@ onBeforeUnmount(() => {
             borderColor="#333"
           />
           <text>{{ user.nickName }}</text>
+          <image
+            v-if="heat"
+            :src="`../static/hot${heat}.png`"
+            mode="widthFix"
+          />
         </block>
         <block v-else>
           <image src="../static/user-icon.png" mode="widthFix" />
@@ -248,12 +260,15 @@ onBeforeUnmount(() => {
   align-items: center;
   justify-content: flex-start;
 }
-.user-header > image {
+.user-header > image:first-child {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   border: 2rpx solid #333;
 }
+.user-header > image:last-child {
+  width: 36rpx;
+}
 .user-header > text:nth-child(2) {
   font-weight: 500;
   font-size: 30rpx;

src/components/RingBarChart.vue

@@ -42,14 +42,15 @@ const ringText = (ring) => {
 <template>
   <view class="container">
     <view>
-      <view
-        v-for="(b, index) in bars"
-        :key="index"
-        :style="{
-          background: barColor(b.rate),
-          height: b.rate * 120 + 'rpx',
-        }"
-      >
+      <view v-for="(b, index) in bars" :key="index">
+        <text v-if="b && b.rate > 0.1">{{ Number(b.rate.toFixed(1)) }}%</text>
+        <view
+          :style="{
+            background: barColor(b.rate),
+            height: b.rate * 120 + 'rpx',
+          }"
+        >
+        </view>
       </view>
     </view>
     <view>
@@ -71,6 +72,13 @@ const ringText = (ring) => {
   min-height: 50rpx;
 }
 .container > view:first-child > view {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  font-size: 18rpx;
+  color: #333;
+}
+.container > view:first-child > view > view {
   transition: all 0.3s ease;
   width: 5vw;
   height: 0;