feat(@vben/common-ui): 优化PPT预览和下载功能

This commit is contained in:
Kven 2025-05-06 16:50:28 +08:00
parent 33d8241ce4
commit 752a7029b9
2 changed files with 59 additions and 21 deletions

View File

@ -7,7 +7,7 @@ import VueOfficePptx from '@vue-office/pptx';
// import '@vue-office/pptx/lib/index.css';
// http://47.112.173.8:6802/static/66f3cfd95e364a239d8036390db658ae.pptx
const url = ref('');
// const url = ref('');
const pptx = ref('/pptx/66f3cfd95e364a239d8036390db658ae.pptx');
const pptStyle = ref({
height: 'calc(100vh - 100px)',
@ -30,7 +30,11 @@ const [Drawer, drawerApi] = useVbenDrawer({
},
onOpenChange(isOpen: boolean) {
if (isOpen) {
url.value = drawerApi.getData<Record<string, any>>();
const data = drawerApi.getData<Record<string, any>>();
if (data) {
pptx.value = `/pptx/${data}`; // docx
}
// url.value = drawerApi.getData<Record<string, any>>();
}
},
});

View File

@ -48,7 +48,7 @@ defineOptions({
name: 'SpiderWorkView',
});
withDefaults(defineProps<Props>(), {
const props = withDefaults(defineProps<Props>(), {
item: () => null,
runWorkflow: () => async () => ({
data: {
@ -65,8 +65,12 @@ const [PreviewDrawer, previewDrawerApi] = useVbenDrawer({
// placement: 'left',
});
function openPreviewDrawer(placement: DrawerPlacement = 'right') {
previewDrawerApi.setState({ placement }).open();
function openPreviewDrawer(
placement: DrawerPlacement = 'right',
filename?: string,
) {
const fileData = filename.value;
previewDrawerApi.setState({ placement }).setData(fileData).open();
}
const startFetching = async () => {
@ -74,21 +78,43 @@ const startFetching = async () => {
fetchStatus.value = 'fetching';
try {
// const res = await props.runWorkflow(
// {
// appid: props.item.id,
// },
// {
// userId: '1562',
// conversationId: '',
// files: [],
// inputs: {
// declarationDoc: value.value,
// },
// },
// );
const res = await props.runWorkflow(
{
appid: 'ee3889b6-50fa-463e-b956-3b93447727fc',
},
{
userId: '1562',
conversationId: '',
files: [],
inputs: {
declarationDoc: value.value,
},
},
);
const { result } = res.data.outputs;
// .pptx URL
function isPptxURL(str: string): boolean {
return str.endsWith('.pptx');
}
// 使 /static/
function extractPptxFilename(url: string): null | string {
const match = url.match(/\/static\/([a-f0-9-]+\.pptx)$/i);
if (match) {
return match[1]; // 9e1c421e-991c-411f-8176-6350a97e70f3.pptx
}
return null;
}
const filename = ref('');
if (result && isPptxURL(result)) {
filename.value = extractPptxFilename(result);
}
// url http://47.112.173.8:6802/static/66f3cfd95e364a239d8036390db658ae.pptx
fetchResult.value = '/static/66f3cfd95e364a239d8036390db658ae.pptx';
fetchResult.value = `/static/${filename.value}`;
resultItems.value.push({
key: resultItems.value.length + 1,
role: 'ai',
@ -100,7 +126,7 @@ const startFetching = async () => {
size: 'nomarl',
type: 'primary',
onClick: () => {
openPreviewDrawer('right');
openPreviewDrawer('right', filename);
},
},
'文档预览',
@ -113,7 +139,15 @@ const startFetching = async () => {
style: {
marginLeft: '10px',
},
onClick: () => {},
onClick: () => {
// <a>
const link = document.createElement('a');
link.href = result; //
link.download = filename; //
document.body.append(link); // <a>
link.click(); //
link.remove(); // <a>
},
},
'文档下载',
),