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

packages/effects/common-ui/src/ui/ppt/ppt-perview.vue

@@ -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>>();
     }
   },
 });

packages/effects/common-ui/src/ui/ppt/ppt-work-view.vue

@@ -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') {
+function openPreviewDrawer(
-  previewDrawerApi.setState({ placement }).open();
+  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(
+    const res = await props.runWorkflow(
-    //   {
+      {
-    //     appid: props.item.id,
+        appid: 'ee3889b6-50fa-463e-b956-3b93447727fc',
-    //   },
+      },
-    //   {
+      {
-    //     userId: '1562',
+        userId: '1562',
-    //     conversationId: '',
+        conversationId: '',
-    //     files: [],
+        files: [],
-    //     inputs: {
+        inputs: {
-    //       declarationDoc: value.value,
+          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> 标签
+            },
           },
           '文档下载',
         ),