Browse Source

refactor(app): 优化活动详情页面和设计师主页展示

- 在活动详情页面中,将名额显示格式改为"总人数/剩余人数"
- 在设计师主页中,优化个人身份展示方式,支持多身份展示
- 新增视频号关联提示卡片,引导用户关联视频号
EvilDragon 4 months ago
parent
commit
7f00cc3f74

+ 3 - 1
packages/app/src/pages/home/activity/detail/index.vue

@@ -124,7 +124,9 @@ const infos = computed(() => [
   {
     icon: user,
     title: `${activityTypes.value[type.value]}名额`,
-    content: [places.value === '不限制' ? `不限制` : `${places.value}/${remainedCount.value}`],
+    content: [
+      places.value === '不限制' ? `不限制` : `${places.value}人/剩余${remainedCount.value}人`,
+    ],
     visable: true,
   },
   {

+ 50 - 10
packages/app/src/pages/mine/homepage/index.vue

@@ -25,6 +25,7 @@ import { useMessage } from 'wot-design-uni'
 import { requestToast } from '../../../core/utils/common'
 import { ComponentExposed } from 'vue-component-type-helpers'
 import dayjs from 'dayjs'
+import wechatChannels from '@designer-hub/assets/src/libs/assets/wechatChannels'
 
 const { alert, confirm } = useMessage()
 const router = useRouter()
@@ -106,7 +107,7 @@ defineExpose({
         custom-class="aspect-[1.14/1]"
       />
       <div class="absolute bottom-0 left-0 right-0">
-        <div class="h-[107px] bg-gradient-to-t from-black to-transparent">
+        <div class="bg-gradient-to-t from-black to-transparent">
           <div class="flex">
             <div
               class="w-18 h-18 border-white border border-solid mx-3.5 rounded-full overflow-hidden"
@@ -117,21 +118,23 @@ defineExpose({
                 :src="isOwn ? userInfo?.avatar : memberInfo?.avatar || NetImages.DefaultAvatar"
               ></wd-img>
             </div>
-            <div>
+            <div class="pb-8 flex-1">
               <div class="text-white text-2xl font-normal font-['PingFang_SC'] leading-normal">
                 {{ memberInfo.name }}
               </div>
-              <div>
-                <div
-                  class="h-6 px-2 bg-black/10 rounded-[30px] border border-white/60 justify-center items-center gap-2.5 inline-flex"
-                >
+              <div class="flex flex-wrap gap-4">
+                <template v-for="(it, i) in designerInfo?.personalIdentity.split('、')" :key="i">
                   <div
-                    class="text-center text-white text-[10px] font-normal font-['PingFang_SC'] leading-normal"
+                    class="h-6 px-2 bg-black/10 rounded-[30px] border border-solid border-white/60 justify-center items-center gap-2.5 inline-flex"
                   >
-                    <!-- 创设空间事务所创始人 -->
-                    {{ designerInfo.personalIdentity }}
+                    <div
+                      class="text-center text-white text-[10px] font-normal font-['PingFang_SC'] leading-normal"
+                    >
+                      <!-- 创设空间事务所创始人 -->
+                      {{ it }}
+                    </div>
                   </div>
-                </div>
+                </template>
               </div>
             </div>
           </div>
@@ -159,6 +162,43 @@ defineExpose({
       <div class="text-black/80 text-sm font-normal font-['PingFang_SC'] leading-normal">
         {{ designerInfo?.designDesc }}
       </div>
+      <div
+        class="bg-gradient-to-t from-[#fdf6ee] to-[#fefdfc] rounded-[10px] border border-[#fff4e6] border-solid flex items-center px-3.5 py-5 gap-3"
+      >
+        <div class="w-[37.01px] h-[37.01px] bg-[#fa9d3b] rounded-lg">
+          <wd-img width="100%" height="100%" :src="wechatChannels"></wd-img>
+        </div>
+        <div class="flex-1">
+          <div class="text-black/90 text-sm font-normal font-['PingFang SC'] leading-normal">
+            视频号
+          </div>
+          <div>
+            <span class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal">
+              您还没有关联视频号
+            </span>
+            <span class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal">
+              ,
+            </span>
+            <span class="text-black/40 text-xs font-normal font-['PingFang SC'] leading-normal">
+              快去关联吧~
+            </span>
+          </div>
+        </div>
+        <div>
+          <div
+            class="h-7 px-4 py-0.5 bg-[#fa9d3b] rounded-[20px] justify-center items-center gap-2.5 inline-flex"
+          >
+            <div
+              class="text-center text-white text-xs font-normal font-['PingFang SC'] leading-normal"
+            >
+              去关联
+            </div>
+          </div>
+          <!-- <div class="text-[#e08e38] text-xs font-normal font-['PingFang SC'] leading-normal">
+            去看看
+          </div> -->
+        </div>
+      </div>
       <div>
         <wd-tabs v-model="tab" custom-class="bg-transparent!">
           <template v-for="({ label, value }, index) in tabs" :key="index">

File diff suppressed because it is too large
+ 6 - 0
packages/assets/src/assets/wechat-channels.svg


+ 2 - 0
packages/assets/src/libs/assets/wechatChannels.ts

@@ -0,0 +1,2 @@
+import wechatChannels from '../../assets/wechat-channels.svg' 
+ export default wechatChannels

Some files were not shown because too many files changed in this diff