feat(打卡): 在打卡详情页添加日期参数并支持编辑模式
在跳转打卡详情页时添加当前日期参数,确保数据正确显示 为打卡详情页添加编辑模式判断,禁用非当前类型的切换
Showing
2 changed files
with
28 additions
and
5 deletions
| ... | @@ -40,8 +40,11 @@ | ... | @@ -40,8 +40,11 @@ |
| 40 | <div | 40 | <div |
| 41 | v-for="option in attachmentTypeOptions" | 41 | v-for="option in attachmentTypeOptions" |
| 42 | :key="option.key" | 42 | :key="option.key" |
| 43 | - @click="switchType(option.key)" | 43 | + @click="!isEditMode ? switchType(option.key) : null" |
| 44 | - :class="['tab-item', { active: activeType === option.key }]" | 44 | + :class="['tab-item', { |
| 45 | + active: activeType === option.key, | ||
| 46 | + disabled: isEditMode && activeType !== option.key | ||
| 47 | + }]" | ||
| 45 | > | 48 | > |
| 46 | <van-icon | 49 | <van-icon |
| 47 | :name="getIconName(option.key)" | 50 | :name="getIconName(option.key)" |
| ... | @@ -154,6 +157,9 @@ const taskDetail = ref({}) | ... | @@ -154,6 +157,9 @@ const taskDetail = ref({}) |
| 154 | // 作品类型选项 | 157 | // 作品类型选项 |
| 155 | const attachmentTypeOptions = ref([]) | 158 | const attachmentTypeOptions = ref([]) |
| 156 | 159 | ||
| 160 | +// 是否为编辑模式 | ||
| 161 | +const isEditMode = computed(() => route.query.status === 'edit') | ||
| 162 | + | ||
| 157 | /** | 163 | /** |
| 158 | * 返回上一页 | 164 | * 返回上一页 |
| 159 | */ | 165 | */ |
| ... | @@ -231,7 +237,12 @@ const getTaskDetail = async (month) => { | ... | @@ -231,7 +237,12 @@ const getTaskDetail = async (month) => { |
| 231 | */ | 237 | */ |
| 232 | onMounted(async () => { | 238 | onMounted(async () => { |
| 233 | // 获取任务详情 | 239 | // 获取任务详情 |
| 234 | - getTaskDetail(dayjs().format('YYYY-MM')) | 240 | + const current_date = route.query.date; |
| 241 | + if (current_date) { | ||
| 242 | + getTaskDetail(dayjs(current_date).format('YYYY-MM')); | ||
| 243 | + } else { | ||
| 244 | + getTaskDetail(dayjs().format('YYYY-MM')); | ||
| 245 | + } | ||
| 235 | 246 | ||
| 236 | // 获取作品类型数据 | 247 | // 获取作品类型数据 |
| 237 | try { | 248 | try { |
| ... | @@ -353,6 +364,16 @@ onMounted(async () => { | ... | @@ -353,6 +364,16 @@ onMounted(async () => { |
| 353 | font-weight: 600; | 364 | font-weight: 600; |
| 354 | } | 365 | } |
| 355 | } | 366 | } |
| 367 | + | ||
| 368 | + &.disabled { | ||
| 369 | + opacity: 0.5; | ||
| 370 | + cursor: not-allowed; | ||
| 371 | + | ||
| 372 | + &:hover { | ||
| 373 | + border-color: #e8f5e8; | ||
| 374 | + background-color: #fafffe; | ||
| 375 | + } | ||
| 376 | + } | ||
| 356 | } | 377 | } |
| 357 | 378 | ||
| 358 | .tab-text { | 379 | .tab-text { | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-05-29 15:34:17 | 2 | * @Date: 2025-05-29 15:34:17 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-09-30 17:58:09 | 4 | + * @LastEditTime: 2025-09-30 18:03:55 |
| 5 | * @FilePath: /mlaj/src/views/checkin/IndexCheckInPage.vue | 5 | * @FilePath: /mlaj/src/views/checkin/IndexCheckInPage.vue |
| 6 | * @Description: 文件描述 | 6 | * @Description: 文件描述 |
| 7 | --> | 7 | --> |
| ... | @@ -540,10 +540,12 @@ const handleCheckinTypeClick = (type) => { | ... | @@ -540,10 +540,12 @@ const handleCheckinTypeClick = (type) => { |
| 540 | * 跳转到打卡详情页面 | 540 | * 跳转到打卡详情页面 |
| 541 | */ | 541 | */ |
| 542 | const goToCheckinDetailPage = () => { | 542 | const goToCheckinDetailPage = () => { |
| 543 | + const current_date = route.query.date || dayjs().format('YYYY-MM-DD'); | ||
| 543 | router.push({ | 544 | router.push({ |
| 544 | path: '/checkin/detail', | 545 | path: '/checkin/detail', |
| 545 | query: { | 546 | query: { |
| 546 | - id: route.query.id | 547 | + id: route.query.id, |
| 548 | + date: current_date | ||
| 547 | } | 549 | } |
| 548 | }) | 550 | }) |
| 549 | } | 551 | } | ... | ... |
-
Please register or login to post a comment