Merge branch 'aigc' of https://git.nianxx.cn/zoujing/YGChatCS into home3.0

This commit is contained in:
2026-07-14 08:55:06 +08:00
9 changed files with 231 additions and 107 deletions

View File

@@ -1,12 +1,28 @@
<template>
<view class="result-actions">
<view class="result-action is-primary" @tap="emit('save')">保存图片</view>
<view class="result-action is-secondary" @tap="emit('share')">分享好友</view>
<view :class="['result-action', 'is-primary', { 'is-disabled': saving }]" @tap="handleSave">
{{ saving ? "保存中..." : "保存图片" }}
</view>
<button class="result-action is-secondary" open-type="share" hover-class="none">分享好友</button>
</view>
</template>
<script setup>
const emit = defineEmits(["save", "share"]);
const props = defineProps({
saving: {
type: Boolean,
default: false,
},
});
const emit = defineEmits(["save"]);
const handleSave = () => {
if (!props.saving) {
emit("save");
}
};
</script>
<style scoped lang="scss">

View File

@@ -6,7 +6,12 @@
}
.result-action {
width: 100%;
height: 48px;
margin: 0;
padding: 0;
box-sizing: border-box;
border: 0;
display: flex;
align-items: center;
justify-content: center;
@@ -16,6 +21,10 @@
font-weight: 900;
}
.result-action::after {
border: 0;
}
.result-action.is-primary {
background: #20cf75;
color: #ffffff;
@@ -26,3 +35,7 @@
background: rgba(255, 255, 255, 0.78);
color: #526073;
}
.result-action.is-disabled {
opacity: 0.65;
}

View File

@@ -1,14 +0,0 @@
export const aigcDetailResult = {
id: "glass-boat-postcard-result",
title: "鸳鸯湖明信片",
cover: "https://oss.nianxx.cn/mp/static/xiaoqi/glass-boat-postcard.gif",
accent: "#0a4d46",
variantLabel: "图片版",
resultLabel: "图片版",
consumedText: "100积分",
desc: "已生成可保存、可分享的高清旅行图片",
continuationTitle: "创意续作",
continuationDesc: "让这张图动起来 · 5秒内动效视频",
continuationCost: "追加消耗 100积分",
continuationButtonText: "升级为动效视频",
};

View File

@@ -3,52 +3,64 @@
<AigcTopBar :points="pointBalance" @back="handleBack" @history="handleOpenRecords" @recharge="handleRecharge" />
<view class="aigc-detail-content">
<ResultPreview :result="result" />
<template v-if="taskDetail">
<ResultPreview v-if="result.cover" :result="result" />
<ResultMeta :items="metaItems" />
<ContinuationCard v-if="continuationInfo" :info="continuationInfo" @upgrade="handleUpgradeToVideo" />
<ResultActions @save="handleSave" @share="handleShare" />
<ResultActions :saving="isSaving" @save="handleSave" />
<view class="aigc-detail-text-actions">
<view class="aigc-detail-text-action" @tap="handleRegenerate">再生成一版</view>
<view class="aigc-detail-text-action" @tap="handleChangeTemplate">换个模板</view>
<view class="aigc-detail-text-action" @tap="handleOpenRecords">历史记录</view>
</view>
</template>
</view>
</view>
</template>
<script setup>
import { computed } from "vue";
import { onShow } from "@dcloudio/uni-app";
import { storeToRefs } from "pinia";
import { computed, ref } from "vue";
import { onLoad, onShareAppMessage, onShow } from "@dcloudio/uni-app";
import AigcTopBar from "@/pages-aigc/components/AigcTopBar/index.vue";
import { useCurrentCredit } from "@/pages-aigc/hooks/useCurrentCredit.js";
import { useAigcRecordStore } from "@/store";
import ContinuationCard from "./components/ContinuationCard/index.vue";
import { getAigcGeneratorTaskDetail } from "@/request/api/AigcApi.js";
import ResultActions from "./components/ResultActions/index.vue";
import ResultMeta from "./components/ResultMeta/index.vue";
import ResultPreview from "./components/ResultPreview/index.vue";
import { aigcDetailResult } from "./data/result.js";
const { pointBalance, fetchCurrentCredit } = useCurrentCredit();
const aigcRecordStore = useAigcRecordStore();
const { currentRecord } = storeToRefs(aigcRecordStore);
const taskId = ref("");
const taskDetail = ref(null);
const isSaving = ref(false);
const GENERATOR_TYPE_TEXT = {
0: "图片版",
1: "视频版",
};
const TASK_STATUS_TEXT = {
0: "排队中",
1: "生成中",
2: "已完成",
3: "生成失败",
4: "视频生成中",
};
const getMappedText = (mapping, value, prefix) => {
if (Object.prototype.hasOwnProperty.call(mapping, value)) {
return mapping[value];
}
return value === undefined || value === null || value === "" ? "-" : `${prefix}${value}`;
};
const result = computed(() => {
const record = currentRecord.value;
if (!record) return aigcDetailResult;
const record = taskDetail.value || {};
const imageUrl = record.imageResultUrl || "";
const videoUrl = record.videoResultUrl || "";
const isVideo = Boolean(videoUrl) && (record.generatorType === 1 || !imageUrl);
const typeText =
GENERATOR_TYPE_TEXT[record.generatorType] ||
(record.generatorType === undefined ? "生成结果" : `类型${record.generatorType}`);
const typeText = getMappedText(GENERATOR_TYPE_TEXT, record.generatorType, "类型");
const statusText = getMappedText(TASK_STATUS_TEXT, record.taskStatus, "状态");
const consumedText =
record.generatorCost === undefined || record.generatorCost === null || record.generatorCost === ""
? "-"
@@ -61,25 +73,22 @@ const result = computed(() => {
mediaType: isVideo ? "video" : "image",
accent: "#0a4d46",
variantLabel: typeText,
resultLabel: typeText,
resultLabel: statusText,
consumedText,
desc: record.itemSubTitle || "生成任务已完成",
desc: record.itemSubTitle || statusText,
};
});
onShow(() => {
fetchCurrentCredit();
});
const metaItems = computed(() => {
if (currentRecord.value) {
const record = currentRecord.value;
const record = taskDetail.value;
if (!record) return [];
const completeTime =
record.videoGeneratorCompleteTime || record.imageGeneratorCompleteTime || record.createTime || "-";
return [
{
label: "结果",
label: "状态",
value: result.value.resultLabel,
},
{
@@ -91,33 +100,6 @@ const metaItems = computed(() => {
value: completeTime,
},
];
}
return [
{
label: "结果",
value: result.value.resultLabel,
},
{
label: "已消耗",
value: result.value.consumedText,
},
{
label: "余额",
value: `${pointBalance.value}积分`,
},
];
});
const continuationInfo = computed(() => {
if (currentRecord.value) return null;
return {
title: result.value.continuationTitle,
desc: result.value.continuationDesc,
cost: result.value.continuationCost,
buttonText: result.value.continuationButtonText,
};
});
const showPlaceholderToast = (title) => {
@@ -127,6 +109,62 @@ const showPlaceholderToast = (title) => {
});
};
const fetchTaskDetail = async () => {
uni.showLoading({
title: "加载中",
mask: true,
});
try {
const res = await getAigcGeneratorTaskDetail({ taskId: taskId.value });
if (res?.code === 0 && res.data && typeof res.data === "object" && !Array.isArray(res.data)) {
taskDetail.value = res.data;
return;
}
taskDetail.value = null;
showPlaceholderToast("获取任务详情失败");
} catch (error) {
console.error("获取AIGC生成任务详情失败", error);
taskDetail.value = null;
showPlaceholderToast("获取任务详情失败");
} finally {
uni.hideLoading();
}
};
onLoad((query = {}) => {
taskId.value = String(query.taskId || "").trim();
if (!taskId.value) {
showPlaceholderToast("缺少任务ID");
return;
}
fetchTaskDetail();
});
onShow(() => {
fetchCurrentCredit();
});
onShareAppMessage(() => {
const shareInfo = {
title: taskDetail.value?.itemTitle,
path: taskId.value
? `/pages-aigc/detail/detail?taskId=${encodeURIComponent(taskId.value)}`
: "/pages-aigc/home/home",
};
const imageUrl = taskDetail.value?.imageResultUrl || "";
if (imageUrl) {
shareInfo.imageUrl = imageUrl;
}
return shareInfo;
});
const handleBack = () => {
const pages = getCurrentPages();
if (pages.length > 1) {
@@ -138,16 +176,100 @@ const handleRecharge = () => {
showPlaceholderToast("积分充值");
};
const handleUpgradeToVideo = () => {
showPlaceholderToast("升级为动效视频");
const downloadImage = (url) =>
new Promise((resolve, reject) => {
if (!/^https?:\/\//i.test(url)) {
resolve(url);
return;
}
uni.downloadFile({
url,
success: (res) => {
if (res.statusCode === 200 && res.tempFilePath) {
resolve(res.tempFilePath);
return;
}
reject(res);
},
fail: reject,
});
});
const saveImageToAlbum = (filePath) =>
new Promise((resolve, reject) => {
uni.saveImageToPhotosAlbum({
filePath,
success: resolve,
fail: reject,
});
});
const isAlbumPermissionDenied = (error) => {
const errorMessage = String(error?.errMsg || "").toLowerCase();
return (
errorMessage.includes("auth deny") ||
errorMessage.includes("authorize:no response") ||
errorMessage.includes("permission denied")
);
};
const handleSave = () => {
showPlaceholderToast("保存图片");
const promptAlbumPermission = () => {
uni.showModal({
title: "需要相册权限",
content: "请在设置中允许保存图片到相册。",
confirmText: "去设置",
success: ({ confirm }) => {
if (confirm) {
uni.openSetting();
}
},
});
};
const handleShare = () => {
showPlaceholderToast("分享好友");
const handleSave = async () => {
if (isSaving.value) return;
if (result.value.mediaType !== "image") {
showPlaceholderToast("当前结果不是图片");
return;
}
if (!result.value.cover) {
showPlaceholderToast("暂无可保存的图片");
return;
}
isSaving.value = true;
uni.showLoading({
title: "保存中",
mask: true,
});
let saveError = null;
try {
const filePath = await downloadImage(result.value.cover);
await saveImageToAlbum(filePath);
} catch (error) {
saveError = error;
} finally {
uni.hideLoading();
isSaving.value = false;
}
if (!saveError) {
uni.showToast({
title: "已保存到相册",
icon: "success",
});
return;
}
if (isAlbumPermissionDenied(saveError)) {
promptAlbumPermission();
} else {
showPlaceholderToast("保存图片失败");
}
};
const handleRegenerate = () => {

View File

@@ -6,6 +6,7 @@
display: flex;
flex-direction: column;
gap: 12px;
padding: 0 12px;
}
.record-note {

View File

@@ -1,6 +1,6 @@
<template>
<z-paging ref="paging" v-model="records" class="aigc-record-page" bg-color="#ffffff" safe-area-inset-bottom
@query="queryList">
loading-more-no-more-text="下拉刷新任务列表" @query="queryList">
<template #top>
<view class="aigc-record-nav">
<TopNavBar title="最近任务" background="transparent" title-color="#162235" back-icon-color="#162235"
@@ -21,12 +21,10 @@ import { ref } from "vue";
import TopNavBar from "@/components/TopNavBar/index.vue";
import CustomEmpty from "@/components/CustomEmpty/index.vue";
import { getAigcGeneratorTaskList } from "@/request/api/AigcApi.js";
import { useAigcRecordStore } from "@/store";
import RecordList from "./components/RecordList/index.vue";
const records = ref([]);
const paging = ref(null);
const aigcRecordStore = useAigcRecordStore();
const queryList = async (pageNum, pageSize) => {
try {
@@ -51,10 +49,9 @@ const handleBack = () => {
};
const handleViewRecord = (record) => {
if (record?.taskStatus === 2) {
aigcRecordStore.setCurrentRecord(record);
if (record?.taskStatus === 2 && record.taskId) {
uni.navigateTo({
url: "/pages-aigc/detail/detail",
url: `/pages-aigc/detail/detail?taskId=${encodeURIComponent(record.taskId)}`,
});
return;
}

View File

@@ -12,6 +12,10 @@ function getAigcGeneratorTaskList(args) {
return request.post("/hotelBiz/aigcGeneratorTask/aigcGeneratorTaskList", args);
}
function getAigcGeneratorTaskDetail(args) {
return request.post("/hotelBiz/aigcGeneratorTask/aigcGeneratorTaskDetail", args);
}
function createAigcGeneratorTask(args) {
return request.post("/hotelBiz/aigcGeneratorTask/createAigcGeneratorTask", args);
}
@@ -32,6 +36,7 @@ export {
getAigcTemplateList,
getAigcTemplateItemList,
getAigcGeneratorTaskList,
getAigcGeneratorTaskDetail,
createAigcGeneratorTask,
getCurrentCredit,
getRechargeOptions,

View File

@@ -1,15 +0,0 @@
import { defineStore } from "pinia";
export const useAigcRecordStore = defineStore("aigcRecord", {
state() {
return {
currentRecord: null,
};
},
actions: {
setCurrentRecord(record) {
this.currentRecord = record ? { ...record } : null;
},
},
});

View File

@@ -1,7 +1,6 @@
import { useAppStore } from "./app";
import { useAigcRecordStore } from "./aigcRecord";
import { useSelectedDateStore } from "./selectedDate";
import { usePictureStore } from "./picture";
import { useLocationStore } from "./location";
export { useAppStore, useAigcRecordStore, useSelectedDateStore, usePictureStore, useLocationStore };
export { useAppStore, useSelectedDateStore, usePictureStore, useLocationStore };