67b1b78f1f
- add new shared work page to view shared AIGC generated images and videos - add createAigcGeneratorTaskShare and getAigcGeneratorTaskShareDetail APIs - update ResultActions component to add share preparation state and native share support - remove deprecated SharePreviewPopup component and its associated styles - update AIGC detail page to generate share keys and adjust native share metadata - register the new shared work page in pages.json
119 lines
3.2 KiB
Vue
119 lines
3.2 KiB
Vue
<template>
|
|
<view class="shared-work-page">
|
|
<view class="shared-work-nav">
|
|
<TopNavBar title="旅行作品" background="transparent" title-color="#173a5f" back-icon-color="#173a5f"
|
|
:align-with-menu-button="true" :z-index="3" @back="handleBack" />
|
|
</view>
|
|
|
|
<view class="shared-work-scroll" scroll-y>
|
|
<template v-if="shareDetail">
|
|
<video v-if="isVideo" class="shared-work-media is-video" :src="shareDetail.videoUrl"
|
|
:poster="shareDetail.imageUrl" controls object-fit="cover" />
|
|
<image v-else-if="shareDetail.imageUrl" class="shared-work-media" :src="shareDetail.imageUrl" mode="widthFix" />
|
|
|
|
<view class="shared-work-meta">
|
|
<text class="shared-work-title">{{ shareDetail.templateName || "旅行作品" }}</text>
|
|
<text class="shared-work-type">{{ generatorTypeText }}</text>
|
|
</view>
|
|
</template>
|
|
</view>
|
|
|
|
<view class="shared-work-cta-wrap">
|
|
<button class="shared-work-cta" hover-class="is-pressed" @tap="handleCreateOwn">
|
|
我也生成一个
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, ref } from "vue";
|
|
import { onLoad } from "@dcloudio/uni-app";
|
|
import TopNavBar from "@/components/TopNavBar/index.vue";
|
|
import { checkToken } from "@/hooks/useGoLogin.js";
|
|
import { getAigcGeneratorTaskShareDetail } from "@/request/api/AigcApi.js";
|
|
|
|
const shareKey = ref("");
|
|
const shareDetail = ref(null);
|
|
|
|
const isVideo = computed(() => {
|
|
return Number(shareDetail.value?.generatorType) === 1 && Boolean(shareDetail.value?.videoUrl);
|
|
});
|
|
|
|
const generatorTypeText = computed(() => {
|
|
const generatorType = shareDetail.value?.generatorType;
|
|
if (Number(generatorType) === 0) return "图片版";
|
|
if (Number(generatorType) === 1) return "视频版";
|
|
return generatorType === undefined || generatorType === null || generatorType === ""
|
|
? "生成作品"
|
|
: `类型${generatorType}`;
|
|
});
|
|
|
|
const showToast = (title) => {
|
|
uni.showToast({
|
|
title,
|
|
icon: "none",
|
|
});
|
|
};
|
|
|
|
const fetchShareDetail = async () => {
|
|
uni.showLoading({
|
|
title: "加载中",
|
|
mask: true,
|
|
});
|
|
|
|
try {
|
|
const res = await getAigcGeneratorTaskShareDetail({ shareKey: shareKey.value });
|
|
if (res?.code === 0 && res.data && typeof res.data === "object" && !Array.isArray(res.data)) {
|
|
shareDetail.value = res.data;
|
|
return;
|
|
}
|
|
|
|
shareDetail.value = null;
|
|
showToast(res?.msg || "获取分享作品失败");
|
|
} catch (error) {
|
|
console.error("获取AIGC分享作品失败", error);
|
|
shareDetail.value = null;
|
|
showToast("获取分享作品失败");
|
|
} finally {
|
|
uni.hideLoading();
|
|
}
|
|
};
|
|
|
|
onLoad((query = {}) => {
|
|
shareKey.value = String(query.shareKey || "").trim();
|
|
if (!shareKey.value) {
|
|
showToast("缺少分享标识");
|
|
return;
|
|
}
|
|
|
|
fetchShareDetail();
|
|
});
|
|
|
|
const openAigcHome = () => {
|
|
uni.reLaunch({
|
|
url: "/pages-aigc/home/home",
|
|
fail: () => showToast("打开模板列表失败"),
|
|
});
|
|
};
|
|
|
|
const handleBack = () => {
|
|
const pages = getCurrentPages();
|
|
if (pages.length > 1) {
|
|
uni.navigateBack();
|
|
return;
|
|
}
|
|
|
|
openAigcHome();
|
|
};
|
|
|
|
const handleCreateOwn = async () => {
|
|
await checkToken();
|
|
openAigcHome();
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "./styles/index.scss";
|
|
</style>
|