update:优化新版个人训练

src/pages/training/components/BowData.vue

@@ -1,4 +1,5 @@
 <script setup>
+import { computed } from "vue";
 import AppBackground from "@/components/AppBackground.vue";
 import Avatar from "@/components/Avatar.vue";
 import BowTarget from "./BowTarget.vue";
@@ -7,6 +8,8 @@ import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const store = useStore();
 const { user } = storeToRefs(store);
+const isSvip = computed(() => user.value.sVip === true);
+const isVip = computed(() => user.value.vip === true && !isSvip.value);
 
 const props = defineProps({
   show: {
@@ -35,8 +38,20 @@ const props = defineProps({
       <view>
         <Avatar :src="user.avatar" :rankLvl="user.rankLvl" :size="45" />
         <view>
-          <text>{{ user.nickName }}</text>
-          <!-- <text>{{ user.lvlName }}</text> -->
+          <view
+            :class="[
+              'header-nickname',
+              'member-nickname',
+              isVip ? 'member-nickname--vip' : '',
+              isSvip ? 'member-nickname--svip' : '',
+            ]"
+          >
+            <text class="member-nickname__text">{{ user.nickName }}</text>
+            <text v-if="isSvip" class="member-nickname__shine">
+              {{ user.nickName }}
+            </text>
+          </view>
+          <text>{{ user.lvlName }}</text>
         </view>
       </view>
       <view @click="onClose">
@@ -95,9 +110,12 @@ const props = defineProps({
   margin-left: 10px;
   color: #fff;
 }
+.header-nickname {
+  max-width: 240rpx;
+}
 .header > view:first-child > view:last-child > text:last-child {
   font-size: 10px;
-  background-color: #5f51ff;
+  /* background-color: #5f51ff; */
   padding: 2px 5px;
   border-radius: 10px;
   margin-top: 5px;