Przeglądaj źródła

feat(agent): 优化设计师详情页面展示

- 重新调整设计师详情页面布局和样式
- 添加会员等级徽章展示
- 积分动态和使用动态采用卡片式展示
- 新增最近动态和积分活动列表
- 优化代码结构,移除未使用的样式和注释
EvilDragon 3 miesięcy temu
rodzic
commit
5e1a2c503b

+ 1 - 1
packages/merchant/src/core/libs/requests.ts

@@ -357,7 +357,7 @@ export const updateTodo = (data: Partial<Todo>) =>
 /**
  * 渠道端-获取设计师活动列表
  */
-export const getDeignerPointsActivities = (query) =>
+export const getDesignerPointsActivities = (query: { brokerId: string }) =>
   httpGet<
     ResPageData<{
       content: string

+ 1 - 1
packages/merchant/src/pages/agent/designer/archives/index.vue

@@ -124,7 +124,7 @@ onLoad(async (query: { id: string }) => {
           :key="index"
         >
           <div class="flex items-center justify-between">
-            <div class="text-black/40 text-base font-normal font-['PingFang SC'] leading-none">
+            <div class="text-black/40 text-base font-normal font-['PingFang_SC'] leading-none">
               {{ messages.objects.designerBasiceInfo[key] }}
             </div>
             <DataRender v-bind="renders.designerBasiceInfo[key](value)"></DataRender>

+ 75 - 43
packages/merchant/src/pages/agent/designer/detail.vue

@@ -20,11 +20,22 @@ import {
 } from '@designer-hub/assets/src/svgs'
 import PageHelperEvo from '@/components/page-helper-evo.vue'
 import { dayjs } from 'wot-design-uni'
-import { toHomePage } from '../../../core/libs/actions'
+import { toHomePage } from '@/core/libs/actions'
 import arcBottom from '@designer-hub/assets/src/libs/assets/arcBottom'
+import { useMemberLevelsStore } from '@/store/member-levles'
+import TaskCard from '@/pages/agent/components/task-card.vue'
+import { getDesignerPointsActivities } from '@/core/libs/requests'
+import { useUserStore } from '@/store'
+import { storeToRefs } from 'pinia'
+import Card from '@designer-hub/app/src/components/card.vue'
+
+const userStore = useUserStore()
+const { userInfo } = storeToRefs(userStore)
+const memberLevelsStore = useMemberLevelsStore()
+const { getMemberLevelLogo } = memberLevelsStore
 const id = ref()
 const { data, run: setData } = useRequest(() => getUserInfoById(id.value))
-const active = ref('followUp')
+const active = ref('integral')
 const tabs = ref([
   { label: '数据动态', value: 'integral' },
   { label: '跟进记录', value: 'followUp' },
@@ -32,6 +43,7 @@ const tabs = ref([
   { label: '兑换商品', value: 'product' },
 ])
 const followUpQuery = ref({})
+const pointsActivitiesQuery = computed(() => ({ brokerId: userInfo.value.userId }))
 const toPointsDetails = () => {
   uni.navigateTo({ url: `/pages/agent/designer/points/index?id=${id.value}` })
 }
@@ -69,17 +81,12 @@ onLoad((query) => {
                   {{ data?.name }}
                 </div>
 
-                <div
-                  class="h-4 bg-neutral-100 rounded-[20px] justify-start items-center inline-flex flex-row ml-[9px]"
-                >
-                  <wd-img width="17" height="17" :src="vipIcon"></wd-img>
-
-                  <div
-                    class="text-black/40 text-[10px] font-normal font-['PingFang_SC'] px-[7px] leading-none"
-                  >
-                    白银会员
-                  </div>
-                </div>
+                <wd-img
+                  v-if="data.levelId"
+                  width="63"
+                  height="18.6"
+                  :src="getMemberLevelLogo(data.levelId)"
+                ></wd-img>
               </div>
               <div
                 class="text-black/60 text-xs font-normal font-['PingFang_SC'] leading-snug flex items-center"
@@ -101,13 +108,8 @@ onLoad((query) => {
           </div>
         </div>
       </div>
-      <div>
-        <!--        <wd-tabs v-model="tab">-->
-        <!--          <block v-for="(item, index) in tabs" :key="index">-->
-        <!--            <wd-tab :title="`${item.label}`" :name="item.value"></wd-tab>-->
-        <!--          </block>-->
-        <!--        </wd-tabs>-->
 
+      <div>
         <div class="flex items-center justify-around">
           <template v-for="(it, i) in tabs" :key="i">
             <div class="flex flex-col items-center gap-1" @click="active = it.value">
@@ -128,7 +130,7 @@ onLoad((query) => {
         </div>
 
         <view class="content mt-[20px]" v-if="active === 'integral'">
-          <div class="bg-white rounded-2xl shadow pa-[15px]">
+          <Card>
             <div class="flex items-center justify-between">
               <div class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed">
                 积分动态
@@ -138,6 +140,7 @@ onLoad((query) => {
                 @click="toPointsDetails"
               >
                 积分明细
+                <wd-icon size="12" name="arrow-right" color="rgba(0,0,0,.3)"></wd-icon>
               </div>
             </div>
             <div class="mt-3 grid grid-cols-3 gap-2.5">
@@ -172,8 +175,9 @@ onLoad((query) => {
                 </div>
               </template>
             </div>
-          </div>
-          <div class="bg-white rounded-2xl shadow pa-[15px] mt-[20px]">
+          </Card>
+
+          <Card custom-class="my-4">
             <div class="flex items-center justify-between">
               <div class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed">
                 使用动态
@@ -211,25 +215,57 @@ onLoad((query) => {
                 </div>
               </template>
             </div>
-          </div>
-          <div class="bg-white rounded-2xl shadow pa-[15px] mt-[20px]">
-            <div class="flex items-center justify-between">
-              <div class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed">
-                最近动态
-              </div>
-            </div>
-            <div class="mt-3">
-              <div class="text-black/90 text-sm font-normal font-['PingFang_SC'] leading-none">
-                苏小萌报名了早稻田深度设计游学
+          </Card>
+
+          <div class="my-4">
+            <Card>
+              <div class="flex items-center justify-between mb-2">
+                <div
+                  class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed"
+                >
+                  最近动态
+                </div>
               </div>
-              <div
-                class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-none mt-[10px]"
-              >
-                2024-09-08 14:12
+              <div class="w-full h-.25 bg-[#f9f9f9]"></div>
+              <div class="flex flex-col gap-6 py-5">
+                <template v-for="(it, index) in [1, 2, 3]" :key="index">
+                  <div class="h-4 relative">
+                    <div
+                      class="left-[11px] top-0 absolute text-black/60 text-sm font-normal font-['PingFang_SC'] leading-none"
+                    >
+                      最近浏览品牌:Imola
+                    </div>
+                    <div class="w-1 h-1 left-0 top-[6px] absolute bg-[#2357e9] rounded-full"></div>
+                  </div>
+                </template>
               </div>
-            </div>
+            </Card>
           </div>
+
+          <PageHelperEvo :request="getDesignerPointsActivities" :query="pointsActivitiesQuery">
+            <template #default="{ source }">
+              <div class="flex flex-col gap-4">
+                <template v-for="(it, index) in source?.list" :key="index">
+                  <Card>
+                    <div class="">
+                      <div
+                        class="text-black/90 text-sm font-normal font-['PingFang_SC'] leading-none"
+                      >
+                        {{ it.content }}
+                      </div>
+                      <div
+                        class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-none mt-[10px]"
+                      >
+                        {{ dayjs(it.createTime).format('YYYY-MM-DD HH:mm') }}
+                      </div>
+                    </div>
+                  </Card>
+                </template>
+              </div>
+            </template>
+          </PageHelperEvo>
         </view>
+
         <view class="content mt-[20px]" v-if="active === 'followUp'">
           <PageHelperEvo :request="getFollowUpPage" :query="followUpQuery">
             <template #default="{ source }">
@@ -238,7 +274,7 @@ onLoad((query) => {
                   <div class="bg-white rounded-2xl shadow pl-[15px] py-[15px] flex-col gap-2 flex">
                     <div class="flex items-center justify-between">
                       <div
-                        class="text-black/90 text-base font-normal font-['PingFang SC'] leading-relaxed"
+                        class="text-black/90 text-base font-normal font-['PingFang_SC'] leading-relaxed"
                       >
                         {{ dayjs(it.followTime).format('YYYY-MM-DD HH:mm') }}
                       </div>
@@ -402,8 +438,4 @@ onLoad((query) => {
   </view>
 </template>
 
-<style scoped lang="scss">
-:deep(.wd-tabs) {
-  background: transparent;
-}
-</style>
+<style scoped lang="scss"></style>

+ 8 - 9
packages/merchant/src/pages/agent/designer/index.vue

@@ -24,7 +24,7 @@ import { storeToRefs } from 'pinia'
 import { useUserStore } from '../../../store'
 
 const userStore = useUserStore()
-const { userInfo, isAgent, isMerchant } = storeToRefs(userStore)
+const { userInfo } = storeToRefs(userStore)
 const searchText = ref('')
 const publishState = ref(false)
 const filterState = ref(false)
@@ -32,6 +32,7 @@ const pageHelperRef = ref<ComponentExposed<typeof PageHelperEvo>>()
 const { schema, rules } = useFollowUp()
 const memberLevelsStore = useMemberLevelsStore()
 const { memberLevels } = storeToRefs(memberLevelsStore)
+const { getMemberLevelLogo } = memberLevelsStore
 const filterQuery = ref<{
   tags: any[]
   levels: any[]
@@ -158,14 +159,12 @@ onLoad(async (params: { title?: string; filter?: string; tags?: string }) => {
                           <div
                             class="h-4 bg-neutral-100 rounded-[20px] justify-start items-center inline-flex flex-row ml-[9px]"
                           >
-                            <wd-img width="17" height="17" :src="vipIcon"></wd-img>
-
-                            <div
-                              class="text-black/40 text-[10px] font-normal font-['PingFang_SC'] px-[7px] leading-none"
-                            >
-                              <!-- 白银会员 -->
-                              {{ it.levelName }}
-                            </div>
+                            <wd-img
+                              v-if="it.levelId"
+                              width="63"
+                              height="18.6"
+                              :src="getMemberLevelLogo(it.levelId)"
+                            ></wd-img>
                           </div>
                         </div>
                         <div

+ 2 - 3
packages/merchant/src/pages/agent/designer/points/index.vue

@@ -23,7 +23,6 @@ const yearState = ref(true)
 const id = ref()
 const year = ref(dayjs().toDate().getTime())
 const query = computed(() => ({
-  brokerId: userInfo.value.userId,
   stylistId: id.value,
   year: dayjs(year.value).format('YYYY'),
 }))
@@ -39,7 +38,7 @@ onLoad(async (query: { id: string }) => {
 </script>
 <template>
   <div class="flex-grow">
-    <NavbarEvo title="任务积分" transparent dark></NavbarEvo>
+    <NavbarEvo title="积分明细" transparent dark></NavbarEvo>
     <div class="relative aspect-[3/1]">
       <div class="aspect-[1.25/1] absolute top-0 w-full">
         <div class="relative w-full h-full">
@@ -103,7 +102,7 @@ onLoad(async (query: { id: string }) => {
                     </div>
                   </div>
                 </div>
-                <div class="h-0.25 bg-[#dadada]" v-if="i !== source?.list.length - 1"></div>
+                <div class="h-0.25 bg-[#dadada]" v-if="i !== (source?.list.length ?? 0) - 1"></div>
               </template>
             </div>
           </template>

+ 4 - 4
packages/merchant/src/pages/home/index.vue

@@ -12,7 +12,7 @@
 <script lang="ts" setup>
 import dayjs from 'dayjs'
 import {
-  getDeignerPointsActivities,
+  getDesignerPointsActivities,
   getTaskList,
   getTodoPage,
   getTodos,
@@ -128,7 +128,7 @@ onShareAppMessage(() => ({}))
                       <div>
                         <div class="flex items-center gap-4">
                           <div
-                            class="w-14 text-end text-black text-base font-normal font-['PingFang SC'] leading-none"
+                            class="w-14 text-end text-black text-base font-normal font-['PingFang_SC'] leading-none"
                           >
                             {{ dayjs(it.executionTime).format('HH:mm') }}
                           </div>
@@ -143,7 +143,7 @@ onShareAppMessage(() => ({}))
                             ></div>
                           </div>
                           <div
-                            class="text-black/60 text-sm font-normal font-['PingFang SC'] leading-none"
+                            class="text-black/60 text-sm font-normal font-['PingFang_SC'] leading-none"
                           >
                             {{ it.content }}
                           </div>
@@ -254,7 +254,7 @@ onShareAppMessage(() => ({}))
         <div>
           <SectionHeading title="设计师最新动态" path="" custom-class="mb-5"></SectionHeading>
           <PageHelperEvo
-            :request="getDeignerPointsActivities"
+            :request="getDesignerPointsActivities"
             :query="designerPointsActivitiesQuery"
           >
             <template #default="{ source }">

+ 3 - 3
packages/merchant/src/pages/mine/agent/invite/index.vue

@@ -74,15 +74,15 @@ onLoad(async () => {
 
   canvas.FillTexts(
     ['邀请码:', data.value.inviteCode],
-    ['14px PingFang SC', '18px PingFang SC'],
+    ['14px PingFang_SC', '18px PingFang_SC'],
     ['rgba(0,0,0,0.65)', 'rgba(0,0,0,0.85)'],
     0,
     0,
     '',
   )
   // const textSegments = [
-  //   { text: '邀请码:', font: '14px PingFang SC', color: 'rgba(0,0,0,0.65)' },
-  //   { text: data.value.inviteCode || '', font: '18px PingFang SC', color: 'rgba(0,0,0,0.85)' },
+  //   { text: '邀请码:', font: '14px PingFang_SC', color: 'rgba(0,0,0,0.65)' },
+  //   { text: data.value.inviteCode || '', font: '18px PingFang_SC', color: 'rgba(0,0,0,0.85)' },
   // ]
 
   // // Calculate total text width

+ 1 - 1
packages/merchant/src/store/member-levles.ts

@@ -10,7 +10,7 @@ export const useMemberLevelsStore = defineStore('member-levels', () => {
   )
   const memberLevelsById = (id: number) => memberLevels.value.find((item) => item.id === id)
   const getMemberLevelLogo = (id: number) => memberLevelsById(id)?.logo
-  fetchMemberLevels()
+  fetchMemberLevels().then()
   return {
     memberLevels,
     fetchMemberLevels,