From 79132c739448a8610f8c815c557a78a08804c203 Mon Sep 17 00:00:00 2001
From: kenny <879464294@qq.com>
Date: Mon, 22 Dec 2025 10:33:34 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=94=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/CustomHeader/CustomHeader.vue   | 62 +++++++++++++------
 1 file changed, 43 insertions(+), 19 deletions(-)

diff --git a/pages/report/component/CustomHeader/CustomHeader.vue b/pages/report/component/CustomHeader/CustomHeader.vue
index 3c2169b..b9d36c0 100644
--- a/pages/report/component/CustomHeader/CustomHeader.vue
+++ b/pages/report/component/CustomHeader/CustomHeader.vue
@@ -6,10 +6,33 @@
       <div class="custom-pic-main">
         <img class="custom-pic-main-bg" src="/static/imgs/main.png" />
 
-        <view class="card-tags" v-if="userFaceInfo?.purpose || userFaceInfo?.question">
-          <view class="card-tag" v-if="userFaceInfo.purpose">{{ userFaceInfo.purpose }}</view>
-          <view class="card-tag" v-if="userFaceInfo.question">{{ userFaceInfo.question  }}</view>
-        </view>
+        <div class="card-tags" v-if="userFaceInfo?.purpose || userFaceInfo?.question">
+          <div
+            class="card-tag"
+            style="
+              white-space: nowrap;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              max-width: 200rpx;
+              display: block;
+              line-height: 50rpx;
+            "
+            v-if="userFaceInfo.purpose">{{ userFaceInfo.purpose }}</div
+          >
+          <div
+            class="card-tag"
+            style="
+              white-space: nowrap;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              max-width: 200rpx;
+              display: block;
+              line-height: 50rpx;
+            "
+            v-if="userFaceInfo.question"
+            >{{ userFaceInfo.question }}</div
+          >
+        </div>
 
         <div class="custom-pic-info">
           <img class="pic-border" src="/static/imgs/pic-border.png" />
@@ -55,25 +78,25 @@
         </div>
 
         <div class="user-info">
-          <div>{{userFaceInfo?.sex}}​｜{{ userFaceInfo?.birthday }}</div>
-          <div>身高：{{ userFaceInfo.height || "-" }}cm 体重：{{ userFaceInfo.weight || "-" }}kg</div>
+          <div>{{ userFaceInfo?.sex }}​｜{{ userFaceInfo?.birthday }}</div>
+          <div
+            >身高：{{ userFaceInfo.height || '-' }}cm 体重：{{ userFaceInfo.weight || '-' }}kg</div
+          >
         </div>
       </div>
     </div>
   </div>
 </template>
 
-
 <script setup>
-import { defineProps } from 'vue';
-
-const props = defineProps({
-  userFaceInfo: {
-    type: Object,
-    default: () => ({}),
-  },
-});
+  import { defineProps } from 'vue';
 
+  const props = defineProps({
+    userFaceInfo: {
+      type: Object,
+      default: () => ({}),
+    },
+  });
 </script>
 
 <style scoped lang="scss">
@@ -107,19 +130,20 @@ const props = defineProps({
           align-items: center;
           justify-content: center;
           flex-wrap: wrap;
+          gap: 20rpx;
 
           .card-tag {
             height: 50rpx;
+            line-height: 50rpx;
             padding-left: 26rpx;
             padding-right: 26rpx;
             background: rgba(239, 229, 219, 1);
             color: rgba(78, 78, 78, 1);
             font-size: 20rpx;
-            display: flex;
-            align-items: center;
-            justify-content: center;
+            // display: flex;
+            // align-items: center;
+            // justify-content: center;
             border-radius: 16rpx;
-            margin-right: 20rpx;
           }
         }