Browse Source

refactor(app): 优化活动相关组件和页面

- 修改活动状态文本,增加"报名未开始"状态
- 优化活动列表和详情页面的样式和布局
- 调整任务列表和详情页面的逻辑和样式
- 新增 mapGray 图标
EvilDragon 2 months ago
parent
commit
a0fc858ad4

+ 2 - 3
packages/app/src/components/hot-activity-item.vue

@@ -6,7 +6,6 @@ import ButtonEvo from './button-evo.vue'
 import { useRouter } from '../core/utils/router'
 import { useActivity } from '../composables/activity'
 import { omit } from 'radash'
-import {getActivityStatusText} from "@/core/utils/common";
 
 const props = withDefaults(
   defineProps<{ options?: StudyTour | Activity; type?: 'studyTour' | 'activity' }>(),
@@ -40,10 +39,10 @@ const { listItemButtonText, statusText, status, difference, startAt, endAt, refr
           mode="scaleToFill"
         />
         <div
-          class="w-9 h-4 bg-black/60 rounded-[20px] backdrop-blur-[15px] absolute top-2.5 left-[7px] flex items-center justify-center"
+          class=" px-2 h-4 bg-black/60 rounded-[20px] backdrop-blur-[15px] absolute top-2.5 left-[7px] flex items-center justify-center"
         >
           <div class="text-white text-[9px] font-normal font-['PingFang_SC']">
-            {{ getActivityStatusText(options?.applyStartTime, options?.applyEndTime) }}
+            {{statusText}}
           </div>
         </div>
         <div

+ 3 - 2
packages/app/src/composables/activity.ts

@@ -8,7 +8,7 @@ import { storeToRefs } from 'pinia'
 /**
  * 游学活动
  */
-export const useActivity = (options: globalThis.Ref<Partial<Activity | StudyTour>>) => {
+export const useActivity = (options: globalThis.Ref<Partial<Activity> | Partial<StudyTour>>) => {
   const userStore = useUserStore()
   const { userInfo } = storeToRefs(userStore)
   const applyStartAt = computed(
@@ -47,9 +47,10 @@ export const useActivity = (options: globalThis.Ref<Partial<Activity | StudyTour
       return 'overdue'
     }
   }
+  // 报名未开始、报名中、报名已结束、活动进行中、活动已结束
   const getActivityStatusText = () =>
     ({
-      waiting: '未开始',
+      waiting: '报名未开始',
       registering: '报名中',
       closed: '报名已结束',
       running: '活动进行中',

+ 2 - 0
packages/app/src/core/libs/models.ts

@@ -332,6 +332,7 @@ export interface Activity {
   studyAllowCount?: number
   planStudyEndTime?: string
   planStudyStartTime?: string
+  sort?: number
 }
 export interface StudyTour {
   id: number
@@ -380,6 +381,7 @@ export interface StudyTour {
    * 剩余名额
    */
   surplus: number
+  sort: number
   /**
    * 补充字段
    */

+ 13 - 14
packages/app/src/pages/home/activity/detail/index.vue

@@ -44,6 +44,7 @@ import ActivityAsOf from '../../components/activity-as-of.vue'
 import images from '@designer-hub/assets/src/libs/assets/images'
 import { usePermissions } from '../../../../composables/permissions'
 import { useAnalysis } from '@/composables/analysis'
+import mapGray from "@designer-hub/assets/src/libs/assets/mapGray";
 const themeVars = ref<ConfigProviderThemeVars>({
   tableBorderColor: 'white',
   tabsNavLineBgColor: 'white',
@@ -271,24 +272,20 @@ onShareTimeline(() => ({ title: data.value.name, imageUrl: data.value.thumbnailU
     </div>
     <div class="h-9">
       <div v-if="type === 'studyTour'" class="flex items-center h-full mt-9 gap-1.5">
-        <wd-img width="18" height="18" :src="map"></wd-img>
+        <wd-img width="18" height="18" :src="mapGray"></wd-img>
         <div class="text-[#c1c1c1] text-base font-normal font-['PingFang_SC'] leading-normal">
           第{{ data?.sort }}站
         </div>
       </div>
     </div>
-    <div
-      class="text-white text-[26px] font-normal font-['PingFang_SC'] leading-[44px] flex items-center gap-4"
-    >
-      <!-- 日本研学·东京艺术大学设计游学 -->
-      <div class="inline-block">{{ data?.name }}</div>
-      <div class="inline-block py-1.5 px-4 bg-white rounded-[20px] backdrop-blur-[15px]">
-        <div class="text-[#a60707] text-sm font-normal font-['PingFang_SC'] leading-relaxed">
-          <!-- {{ getActivityStatusText(data?.applyStartTime, data?.applyEndTime) }} -->
-          {{ statusText }}
-        </div>
-      </div>
-    </div>
+    <p class="text-white text-[26px] font-normal font-['PingFang_SC'] vertical-mid">
+      <span class="leading-[44px] vertical-mid">{{ data?.name }}</span>
+      <span
+        class="ml-4 px-4 bg-white rounded-full backdrop-blur-[15px]! text-[#a60707] text-sm font-normal font-['PingFang_SC'] leading-[28px] vertical-mid inline-flex"
+      >
+        {{ statusText }}
+      </span>
+    </p>
 
     <div
       class="px-4 py-6 bg-[#010102]/30 backdrop-blur-[20px] rounded-2xl my-8 flex flex-col gap-3"
@@ -375,7 +372,7 @@ onShareTimeline(() => ({ title: data.value.name, imageUrl: data.value.thumbnailU
                       {{ item.travelDesc }}
                     </span>
                   </div>
-                  <div class="flex items-center gap-1">
+                  <div v-if="(item.clockExplainUrl ?? '') !== ''" class="flex items-center gap-1">
                     <wd-img width="16" height="16" :src="cameraWhite"></wd-img>
                     <div class="text-white text-xs font-normal font-['PingFang_SC'] leading-normal">
                       打卡示例
@@ -388,8 +385,10 @@ onShareTimeline(() => ({ title: data.value.name, imageUrl: data.value.thumbnailU
                     custom-class="rounded-2xl overflow-hidden"
                     :src="item.clockExplainUrl"
                     mode="widthFix"
+                    enable-preview
                   ></wd-img>
                   <div
+                    v-if="(item.clockExplainUrl ?? '') !== ''"
                     class="text-white/40 text-xs font-normal font-['PingFang_SC'] leading-normal"
                   >
                     {{ item.clockExplainDesc }}

+ 8 - 8
packages/app/src/pages/home/components/register-card.vue

@@ -6,8 +6,9 @@ import TiltedButton from '@/components/tilted-button.vue'
 import { getActivitySignups } from '../../../core/libs/requests'
 import { NetImages } from '../../../core/libs/net-images'
 import { useRouter } from '../../../core/utils/router'
-import { getActivityStatusButtonText, getActivityStatusText } from '../../../core/utils/common'
 import AvatarGroupCasual from '@/components/avatar-group-casual/avatar-group-casual.vue'
+import { omit } from 'radash'
+import { useActivity } from '@/composables/activity'
 
 const props = defineProps<{
   customClass?: string
@@ -18,6 +19,8 @@ const { data: signups, run: setSignups } = useRequest(
   () => getActivitySignups({ activityId: props.options!.id.toString() }),
   { initialData: { list: [], total: 0 } },
 )
+const activityOptions = computed(() => omit(props.options, ['levelsByMemberLevel']))
+const { statusText, listItemButtonText } = useActivity(activityOptions)
 onMounted(async () => {
   await setSignups()
 })
@@ -34,10 +37,11 @@ onMounted(async () => {
         ></wd-img>
       </div>
       <div
-        class="w-[63px] h-[29px] bg-black/60 rounded-[20px] backdrop-blur-[15px] absolute top-5 right-3.5 flex items-center justify-center"
+        class="px-2.5 h-[29px] bg-black/60 rounded-[20px] backdrop-blur-[15px] absolute top-5 right-3.5 flex items-center justify-center"
       >
         <div class="text-white text-sm font-normal font-['PingFang_SC'] leading-relaxed">
-          {{ getActivityStatusText(options?.applyStartTime, options?.applyEndTime) }}
+          <!--          {{ getActivityStatusText(options?.applyStartTime, options?.applyEndTime) }}-->
+          {{ statusText }}
         </div>
       </div>
       <view class="absolute bottom-0 left-0 right-0">
@@ -92,11 +96,7 @@ onMounted(async () => {
               <div class="ml-1 text-white/60 text-sm font-normal font-['PingFang_SC']">积分</div>
             </view>
             <tilted-button custom-class="" size="large" color="white">
-              {{
-                options?.ifSingnUp
-                  ? '已报名'
-                  : getActivityStatusButtonText(options?.applyStartTime, options?.applyEndTime)
-              }}
+              {{ options?.ifSingnUp ? '已报名' : listItemButtonText }}
             </tilted-button>
           </view>
         </div>

+ 7 - 8
packages/app/src/pages/home/study-tour/components/register-card.vue

@@ -6,8 +6,9 @@ import TiltedButton from '@/components/tilted-button.vue'
 import { getActivitySignups, getStudyTourSignups } from '../../../../core/libs/requests'
 import { NetImages } from '../../../../core/libs/net-images'
 import { useRouter } from '../../../../core/utils/router'
-import { getActivityStatusButtonText, getActivityStatusText } from '../../../../core/utils/common'
 import AvatarGroupCasual from '@/components/avatar-group-casual/avatar-group-casual.vue'
+import { omit } from 'radash'
+import { useActivity } from '@/composables/activity'
 
 const props = defineProps<{
   customClass?: string
@@ -18,6 +19,8 @@ const { data: signups, run: setSignups } = useRequest(
   () => getStudyTourSignups({ studyId: props.options!.id.toString() }),
   { initialData: { list: [], total: 0 } },
 )
+const activityOptions = computed(() => omit(props.options, ['levelsByMemberLevel']))
+const { statusText, listItemButtonText } = useActivity(activityOptions)
 onMounted(async () => {
   await setSignups()
 })
@@ -34,10 +37,10 @@ onMounted(async () => {
         ></wd-img>
       </div>
       <div
-        class="w-[63px] h-[29px] bg-black/60 rounded-[20px] backdrop-blur-[15px] absolute top-5 right-3.5 flex items-center justify-center"
+        class="px-2.5 h-[29px] bg-black/60 rounded-[20px] backdrop-blur-[15px] absolute top-5 right-3.5 flex items-center justify-center"
       >
         <div class="text-white text-sm font-normal font-['PingFang_SC'] leading-relaxed">
-          {{ getActivityStatusText(options?.applyStartTime, options?.applyEndTime) }}
+          {{ statusText }}
         </div>
       </div>
       <view class="absolute bottom-0 left-0 right-0">
@@ -92,11 +95,7 @@ onMounted(async () => {
               <div class="ml-1 text-white/60 text-sm font-normal font-['PingFang_SC']">积分</div>
             </view>
             <tilted-button custom-class="" size="large" color="white">
-              {{
-                options?.ifSingnUp
-                  ? '已报名'
-                  : getActivityStatusButtonText(options?.applyStartTime, options?.applyEndTime)
-              }}
+              {{ options?.ifSingnUp ? '已报名' : listItemButtonText }}
             </tilted-button>
           </view>
         </div>

+ 1 - 7
packages/app/src/pages/home/study-tour/list.vue

@@ -8,16 +8,10 @@
 </route>
 <script setup lang="ts">
 import SectionHeading from '@/components/section-heading.vue'
-import { getAppMemberLevelConfigs, getByDictType, getStudyTours } from '../../../core/libs/requests'
-import dayjs from 'dayjs'
+import { getAppMemberLevelConfigs, getStudyTours } from '../../../core/libs/requests'
 import StudyTourCard from './components/study-tour-card.vue'
 import PageHelper from '@/components/page-helper.vue'
-import { CircleType, DictType } from '@/core/libs/models'
-import { zipToObject } from 'radash'
-import {messages} from "@/core/libs/messages";
-import {useShare} from "@/composables/share";
 
-const {} = useShare()
 // const title = computed(() => `${dayjs().year()}年游学计划`)
 const designStudyAbroadYear = ref('')
 const title = ref('')

+ 5 - 0
packages/assets/src/assets/map-gray.svg

@@ -0,0 +1,5 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M9 1.5C8.46031 1.49704 7.92533 1.60059 7.42573 1.80473C6.92613 2.00887 6.47171 2.30959 6.08852 2.68964C5.70533 3.0697 5.40089 3.52163 5.19266 4.01954C4.98442 4.51745 4.87647 5.05155 4.875 5.59125C4.875 7.09125 6.105 8.85375 8.52375 11.0063C8.65528 11.1223 8.82462 11.1863 9 11.1863C9.17538 11.1863 9.34472 11.1223 9.47625 11.0063C11.895 8.85375 13.125 7.07625 13.125 5.59125C13.1235 5.05155 13.0156 4.51745 12.8073 4.01954C12.5991 3.52163 12.2947 3.0697 11.9115 2.68964C11.5283 2.30959 11.0739 2.00887 10.5743 1.80473C10.0747 1.60059 9.53969 1.49704 9 1.5ZM9 9.375C7.24125 7.77 6.375 6.4875 6.375 5.59125C6.375 4.89506 6.65156 4.22738 7.14384 3.7351C7.63613 3.24281 8.30381 2.96625 9 2.96625C9.69619 2.96625 10.3639 3.24281 10.8562 3.7351C11.3484 4.22738 11.625 4.89506 11.625 5.59125C11.625 6.49875 10.7625 7.78125 9 9.375Z" fill="#C2C2C2"/>
+    <path d="M16.4098 13.8525L16.4436 13.785L16.4661 13.7175C16.4661 13.695 16.4661 13.6725 16.4848 13.6462C16.4887 13.6076 16.4887 13.5687 16.4848 13.53V8.625C16.4848 8.42611 16.4058 8.23537 16.2651 8.09474C16.1245 7.95412 15.9337 7.87511 15.7348 7.87511C15.536 7.87511 15.3452 7.95412 15.2046 8.09474C15.0639 8.23537 14.9849 8.42611 14.9848 8.625V13.0087L10.5636 14.91L6.0186 12.1125H5.99235C5.97055 12.0975 5.9465 12.0861 5.9211 12.0787L5.8536 12.0487H5.4261L5.36235 12.0712C5.33577 12.0786 5.31048 12.09 5.28735 12.105H5.2611L2.99985 13.3537V8.625C2.99985 8.42609 2.92083 8.23532 2.78018 8.09467C2.63952 7.95402 2.44876 7.875 2.24985 7.875C2.05093 7.875 1.86017 7.95402 1.71952 8.09467C1.57886 8.23532 1.49985 8.42609 1.49985 8.625V14.6625C1.49816 14.69 1.49816 14.7175 1.49985 14.745C1.4981 14.7675 1.4981 14.79 1.49985 14.8125L1.52235 14.8837C1.53072 14.9094 1.54074 14.9344 1.55235 14.9587C1.55376 14.97 1.55376 14.9813 1.55235 14.9925C1.58092 15.0433 1.61624 15.09 1.65735 15.1312C1.72215 15.1866 1.79563 15.231 1.87485 15.2625L1.9161 15.2887C1.95703 15.3088 1.9997 15.3252 2.0436 15.3375H2.0886C2.14065 15.3564 2.19479 15.369 2.24985 15.375C2.30596 15.3805 2.36248 15.3805 2.4186 15.375H2.4636C2.50507 15.3627 2.54526 15.3463 2.5836 15.3262H2.60985L5.60985 13.665L10.1098 16.425C10.1436 16.425 10.1773 16.4512 10.2073 16.4662C10.2359 16.4819 10.2661 16.4945 10.2973 16.5037C10.3571 16.5213 10.4188 16.5314 10.4811 16.5337H10.4998C10.5567 16.5318 10.6132 16.5242 10.6686 16.5112L10.7211 16.4925L10.7961 16.47L16.0461 14.22C16.0869 14.2012 16.1258 14.1786 16.1623 14.1525L16.2148 14.1112L16.2711 14.0625C16.2885 14.0434 16.3047 14.0234 16.3198 14.0025L16.3648 13.9462L16.4098 13.8525Z" fill="#C2C2C2"/>
+    <path d="M7.875 5.625C7.875 5.92337 7.99353 6.20952 8.20451 6.42049C8.41548 6.63147 8.70163 6.75 9 6.75C9.29837 6.75 9.58452 6.63147 9.79549 6.42049C10.0065 6.20952 10.125 5.92337 10.125 5.625C10.125 5.32663 10.0065 5.04048 9.79549 4.82951C9.58452 4.61853 9.29837 4.5 9 4.5C8.70163 4.5 8.41548 4.61853 8.20451 4.82951C7.99353 5.04048 7.875 5.32663 7.875 5.625Z" fill="#C2C2C2"/>
+</svg>

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

@@ -0,0 +1,2 @@
+import mapGray from '../../assets/map-gray.svg' 
+ export default mapGray

+ 1 - 1
packages/merchant/src/components/page-helper-evo.vue

@@ -41,7 +41,7 @@ onMounted(async () => {
   if (props.automatic) {
     console.log('Page Helper Automatic')
     await setData()
-    items.value = data.value?.list || data.value || []
+    items.value = data.value?.list || []
   }
 })
 watch(

+ 3 - 2
packages/merchant/src/pages/agent/components/task-card.vue

@@ -43,6 +43,7 @@ const acceptingOrders = async (item: AgentTask) => {
         uni.showToast({ title: '接单成功', icon: 'none' })
         emits('change')
       } else if (res.cancel) {
+        /* empty */
       }
     },
   })
@@ -63,8 +64,8 @@ const acceptingNoOrders = async (item: AgentTask) => {
           isOrders: false,
         })
         uni.hideLoading()
-        if (res){
-          uni.showToast({ title: '已拒绝接单', icon: 'none' })
+        if (res) {
+          await uni.showToast({ title: '已拒绝接单', icon: 'none' })
         }
         emits('change')
       } else if (res.cancel) {

+ 5 - 3
packages/merchant/src/pages/agent/designer/detail.vue

@@ -48,10 +48,12 @@ const tabs = ref([
   { label: '数据动态', value: 'integral' },
   { label: '跟进记录', value: 'followUp' },
   // { label: '圈子动态', value: 'interact' },
-  { label: '兑换商品', value: 'product' },
+  { label: '兑换记录', value: 'product' },
 ])
 const status = ref({ '0': '已报名', '1': '已完成', '2': '未核销', '3': '已取消', '4': '待交付' })
-const followUpQuery = ref({})
+const followUpQuery = computed(() => ({
+  stylistId: id.value,
+}))
 const { data: browseRecordCount, run: setBrowseRecordCount } = useRequest(() =>
   getBrowseRecordCount(id.value),
 )
@@ -465,7 +467,7 @@ onLoad(async (query) => {
             <PageHelperEvo
               ref="pageHelperRef"
               :request="getPointsOrders"
-              :query="{ orderType: 2 }"
+              :query="{ orderType: 2, stylistId: id }"
               class="flex-grow flex flex-col"
             >
               <template #default="{ source }">

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

@@ -244,7 +244,7 @@ onLoad(async (params: { title?: string; filter?: string; tags?: string }) => {
 
                 <div class="row-start-2 col-start-2 col-end-4">
                   <div class="flex items-center justify-between w-full mt-[20px]">
-                    <div v-if="it.followUp30Days" class="flex items-center">
+                    <div v-if="!it.followUp30Days" class="flex items-center">
                       <div class="w-2 h-2 bg-[#89f4e2] rounded-full mr-[7px]"></div>
                       <div
                         class="text-black/90 text-xs font-normal font-['PingFang_SC'] leading-snug"
@@ -252,7 +252,7 @@ onLoad(async (params: { title?: string; filter?: string; tags?: string }) => {
                         30天未跟进
                       </div>
                     </div>
-                    <div class="flex items-center" v-if="it.generatePoints60Days">
+                    <div class="flex items-center" v-if="!it.generatePoints60Days">
                       <div class="w-2 h-2 bg-[#ffb96a] rounded-full mr-[7px]"></div>
                       <div
                         class="text-black/90 text-xs font-normal font-['PingFang_SC'] leading-snug"
@@ -260,7 +260,7 @@ onLoad(async (params: { title?: string; filter?: string; tags?: string }) => {
                         60天未产生积分
                       </div>
                     </div>
-                    <div class="flex items-center" v-if="it.expendPoints60Days">
+                    <div class="flex items-center" v-if="!it.expendPoints60Days">
                       <div class="w-2 h-2 bg-[#c493ff] rounded-full mr-[7px]"></div>
                       <div
                         class="text-black/90 text-xs font-normal font-['PingFang_SC'] leading-snug"

+ 3 - 3
packages/merchant/src/pages/agent/tasks/detail/index.vue

@@ -86,7 +86,7 @@ const acceptingOrders = async () => {
         const res = await taskReceive({
           brokerId: userInfo.value.userId,
           taskId: taskDetails.value.id,
-          orders: true,
+          isOrders: true,
         })
         uni.hideLoading()
         if (res) {
@@ -110,7 +110,7 @@ const acceptingNoOrders = async () => {
         const res = await taskReceive({
           brokerId: userInfo.value.userId,
           taskId: taskDetails.value.id,
-          orders: false,
+          isOrders: false,
         })
         uni.hideLoading()
         if (res) {
@@ -310,7 +310,7 @@ onLoad(async (query?: Record<string | 'taskId', string>) => {
       </div>
       <!-- 上报-->
       <div v-else>
-        <template v-for="(item, i) in  finalType == 2 ? taskDetails?.reportList : taskDetails?.qrList" :key="i">
+        <template v-for="(item, i) in taskDetails?.reportList" :key="i">
           <div class="bg-[#f7fbff] rounded-[10px] py-[22px] px-[16px] mt-[20px]">
             <div class="flex items-center justify-between">
               <div class="text-black/40 text-xs font-normal font-['PingFang_SC'] leading-normal">

+ 1 - 16
packages/merchant/src/pages/agent/tasks/index.vue

@@ -35,28 +35,13 @@ const status = ref<any>({
   5: { title: '未完成', bg: '', bgClass: 'bg-[#abacaf]' },
   6: { title: '待确认', bg: '', bgClass: 'bg-[#f04c47]' },
 })
-const query = computed(() => ({ brokerId: userInfo.value.userId }))
+const query = computed(() => ({ brokerId: userInfo.value.userId, status: '1,2,4,5,6' }))
 
 const { data, run: setData } = useRequest(() =>
   getBroker({ brokerId: String(userInfo.value.userId) }),
 )
 
 // 状态(1-未开始,2-进行中,3-已撤回,4-已完成,5-未完成,6-待确认)
-const toDetail = async (item: AgentTask) => {
-  await uni.navigateTo({ url: `/pages/agent/tasks/detail/index?taskId=${item.id}` })
-}
-const acceptingOrders = async (item: AgentTask) => {
-  uni.showLoading()
-  await taskReceive({ brokerId: userInfo.value.userId, taskId: item.id, orders: true })
-  uni.hideLoading()
-  pageHelperRef.value?.refresh()
-}
-const acceptingNoOrders = async (item: AgentTask) => {
-  uni.showLoading()
-  await taskReceive({ brokerId: userInfo.value.userId, taskId: item.id, orders: false })
-  uni.hideLoading()
-  pageHelperRef.value?.refresh()
-}
 const toPoints = async () => {
   await uni.navigateTo({ url: '/pages/agent/points/index' })
 }

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

@@ -51,7 +51,7 @@ const designerPointsActivitiesQuery = computed(() => ({
   brokerId: String(userInfo.value.userId),
 }))
 const { data: tasks, run: setTasks } = useRequest(
-  () => getTasks({ brokerId: userInfo.value.userId,pageNo:1,pageSize:10}),
+  () => getTasks({ brokerId: userInfo.value.userId, status: '1,2', pageNo: 1, pageSize: -1 }),
   { initialData: { list: [], total: 0 } },
 )
 const toDesigner = () => {