From da915c24bebbfad7e0adcd579cd7c13fb00ef3ca Mon Sep 17 00:00:00 2001
From: xixi <123@qq.com>
Date: Mon, 28 Oct 2024 17:29:45 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=B8=8B=E8=BD=BD=E5=85=A8?=
 =?UTF-8?q?=E9=83=A8=E6=96=87=E4=BB=B6=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/card/CardProj.tsx  | 108 +++++++++++++++++++++++++++++-
 src/components/card/card-proj.css |   5 +-
 2 files changed, 109 insertions(+), 4 deletions(-)

diff --git a/src/components/card/CardProj.tsx b/src/components/card/CardProj.tsx
index c609c44..a1c9eaa 100644
--- a/src/components/card/CardProj.tsx
+++ b/src/components/card/CardProj.tsx
@@ -15,7 +15,7 @@ import {
 import { Button, Tag, Modal, Carousel } from 'antd';
 import { GenerateStatus } from "../../interfaces/proj/IProj.ts";
 import { useNavigate } from "react-router-dom";
-import { Axios, post, downloadUrl } from "../../util/AjaxUtils.ts";
+import { Axios, post, downloadUrl, get } from "../../util/AjaxUtils.ts";
 import { useEffect, useState } from "react";
 import useMessage from "antd/es/message/useMessage";
 import setImg from '../../static/right/set.png'
@@ -31,6 +31,11 @@ import SoftwareManagementShow from '../../route/proj/edit/ProjConfigModListShow.
 import DisplayOrder from '../../route/proj/edit/ProjConfigMenuList.tsx'
 import DisplayOrderShow from '../../route/proj/edit/ProjConfigMenuListShow.tsx'
 export default function CardProj(props: any) {
+    const height = window.innerHeight - 250;
+    // 下载等待弹窗
+    const [downModal,setDownModal] = useState(false)
+    // 是否已经点击下载按钮
+    const [hasDown,setHasDown] = useState(false)
     // // 选项数组
     // const [tagArray, setTagArray] = useState([])
     // // 获取标签
@@ -63,6 +68,74 @@ export default function CardProj(props: any) {
     const [tagIdArray, setTagIdArray] = useState(data.tagDataIds)
     // 动态显示标签状态
     // const [tagStatus, setTagStatus] = useState('')
+    // const downAll = (projId: string) => {
+    //     get({
+    //         messageApi,
+    //         url: `${Axios.defaults?.baseURL}/route/proj/download/all/${projId}`,
+    //         onBefore() {
+    //             console.log('正在打包')
+    //         },
+    //         onSuccess(data: any) {
+    //             console.log(data)
+                
+    //         },
+    //         onFinally() {
+
+    //         }
+    //     })
+    // }
+    const downAll = async (projId: string,name:string) => {
+        setHasDown(true)
+        if(!hasDown){
+           
+            try {
+                setDownModal(true)
+                setHasDown(true)
+                // 发送请求
+                const response = await Axios.get(
+                    `${Axios.defaults?.baseURL}/route/proj/download/all/${projId}`,
+                    {
+                        responseType: 'blob', // 设置响应类型为 blob
+                        headers: {
+                            'Content-Type': 'application/octet-stream',
+                        },
+                    }
+                );
+        
+                // 检查状态码
+                if (response.status === 200) {
+                    setDownModal(false)
+                    // 创建 Blob 对象
+                    const blob = new Blob([response.data], { type: response.headers['content-type'] });
+                    // 创建下载链接
+                    const url = window.URL.createObjectURL(blob);
+                    // 创建一个临时的 <a> 元素
+                    const link = document.createElement('a');
+                    link.href = url;
+                    link.setAttribute('download', `${name}全部资料.zip`); // 设置下载文件的名称
+                    document.body.appendChild(link);
+                    link.click(); // 触发下载
+                    document.body.removeChild(link); // 下载完成后移除 <a> 元素
+                    // 释放 URL 对象
+                    window.URL.revokeObjectURL(url);
+                } else {
+                    console.error('下载失败');
+                    // 你可以在这里处理错误情况，例如显示错误消息
+                }
+            } catch (error) {
+                console.error('请求失败', error);
+                // 你可以在这里处理错误情况，例如显示错误消息
+            }finally {
+                // 无论请求成功与否，下载完成后都重置 hasDown 状态
+                setHasDown(false);
+                setDownModal(false); // 关闭模态框
+            }
+        }else{
+            setDownModal(true);
+        }
+        
+      
+    };
     // 更新标签状态
     const upTag = (dataId: string, projId: string) => {
         post<any>({
@@ -455,7 +528,7 @@ export default function CardProj(props: any) {
                                             </div>
                                             <div className='down-bot'>
                                                 <Button size="small" type="text" onClick={() => {
-                                                    window.open(`${Axios.defaults?.baseURL}/route/proj/download/code/${data.projId}`)
+                                                    // window.open(`${Axios.defaults?.baseURL}/route/proj/download/code/${data.projId}`)
                                                 }}> word</Button>
                                                 <Button size="small"
                                                     className='down-pdf'
@@ -464,6 +537,10 @@ export default function CardProj(props: any) {
                                                     }}> pdf</Button>
                                             </div>
                                         </div>
+                                        <Button size="small" type="text" onClick={() => {
+                                            // window.open(`${Axios.defaults?.baseURL}/route/proj/download/all/${data.projId}`)
+                                            downAll(data.projId,data.projName)
+                                        }}><DownloadOutlined /> 全部</Button>
                                     </div>
                                 ) : <></>
                             }
@@ -803,6 +880,33 @@ export default function CardProj(props: any) {
                 <DisplayOrderShow projId={projId}></DisplayOrderShow>
             </Modal >
             {messageContext}
+            <Modal title="提示"
+                style={{
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    height: `${height}px`,
+                }}
+                destroyOnClose={true}
+                open={downModal} 
+                footer={
+                    <Button 
+                        type="primary" 
+                        onClick={() => setDownModal(false)} 
+                        // style={{ 
+                        //     backgroundColor: '#ff4d4f', // 自定义背景颜色
+                        //     borderColor: '#ff4d4f', // 自定义边框颜色
+                        //     color: '#fff', // 自定义文字颜色
+                        // }}
+                    >
+                        关闭
+                    </Button>
+                }
+                 onCancel={() => { setDownModal(false) }} width={500} >
+                <div style={{width:500}}>
+                    正在打包中请稍后<span style={{marginLeft:10}}><LoadingOutlined /></span> 
+                </div>
+            </Modal>
         </>
     )
 }
\ No newline at end of file
diff --git a/src/components/card/card-proj.css b/src/components/card/card-proj.css
index f2047f5..3aa4310 100644
--- a/src/components/card/card-proj.css
+++ b/src/components/card/card-proj.css
@@ -570,7 +570,7 @@
         border-radius: 6px;
         background-color: var(--color-light);
         /* padding: 5px 15px; */
-        min-height: 230px;
+        min-height: 260px;
         /* width: calc(100vw - 330px); */
         /* margin-bottom: 20px; */
         border-radius: 13px;
@@ -696,6 +696,7 @@
     }
 
     .cp-bot {
+        /* background-color: red; */
         display: flex;
         align-items: center;
         justify-content: space-between;
@@ -855,7 +856,7 @@
 
     .cpb-center {
         width: 532px;
-        height: 150px;
+        height: 180px;
         /* background-color: red; */
         display: flex;
         flex-direction: column;