zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(record-card): expand card clickable area

Browse Source 
move view event emission from the action button to the root record card component, expanding the clickable area to let the entire card trigger the view event when actionText is present, improving user experience.
This commit is contained in:
duanshuwen
2026-07-16 22:16:58 +08:00
parent 0a136c3040
commit f3b4fd04d0
1 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages-aigc/record/components/RecordCard/index.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<view class="record-card"> <view class="record-card" @tap="handleView">
<video v-if="isVideoRecord" class="record-card-image" :src="mediaUrl" :controls="false" :show-play-btn="false" <video v-if="isVideoRecord" class="record-card-image" :src="mediaUrl" :controls="false" :show-play-btn="false"
:show-center-play-btn="false" object-fit="cover" /> :show-center-play-btn="false" object-fit="cover" />
<image v-else-if="mediaUrl" class="record-card-image" :src="mediaUrl" mode="aspectFill" /> <image v-else-if="mediaUrl" class="record-card-image" :src="mediaUrl" mode="aspectFill" />
@@ -13,7 +13,7 @@
<text class="record-card-status ellipsis-1">{{ statusText }}</text> <text class="record-card-status ellipsis-1">{{ statusText }}</text>
</view> </view>
<view v-if="actionText" class="record-card-action" @tap="emit('view', record)"> <view v-if="actionText" class="record-card-action">
{{ actionText }} {{ actionText }}
</view> </view>
</view> </view>
@@ -55,6 +55,11 @@ const actionText = computed(() => {
return ""; return "";
}); });
const handleView = () => {
if (!actionText.value) return;
emit("view", props.record);
};
const mediaUrl = computed(() => { const mediaUrl = computed(() => {
if (!isCompleted.value) return ""; if (!isCompleted.value) return "";
return props.record.imageResultUrl || props.record.videoResultUrl || ""; return props.record.imageResultUrl || props.record.videoResultUrl || "";