添加下载全部文件功能
This commit is contained in:
parent
7ec47fa859
commit
da915c24be
@ -15,7 +15,7 @@ import {
|
|||||||
import { Button, Tag, Modal, Carousel } from 'antd';
|
import { Button, Tag, Modal, Carousel } from 'antd';
|
||||||
import { GenerateStatus } from "../../interfaces/proj/IProj.ts";
|
import { GenerateStatus } from "../../interfaces/proj/IProj.ts";
|
||||||
import { useNavigate } from "react-router-dom";
|
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 { useEffect, useState } from "react";
|
||||||
import useMessage from "antd/es/message/useMessage";
|
import useMessage from "antd/es/message/useMessage";
|
||||||
import setImg from '../../static/right/set.png'
|
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 DisplayOrder from '../../route/proj/edit/ProjConfigMenuList.tsx'
|
||||||
import DisplayOrderShow from '../../route/proj/edit/ProjConfigMenuListShow.tsx'
|
import DisplayOrderShow from '../../route/proj/edit/ProjConfigMenuListShow.tsx'
|
||||||
export default function CardProj(props: any) {
|
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([])
|
// const [tagArray, setTagArray] = useState([])
|
||||||
// // 获取标签
|
// // 获取标签
|
||||||
@ -63,6 +68,74 @@ export default function CardProj(props: any) {
|
|||||||
const [tagIdArray, setTagIdArray] = useState(data.tagDataIds)
|
const [tagIdArray, setTagIdArray] = useState(data.tagDataIds)
|
||||||
// 动态显示标签状态
|
// 动态显示标签状态
|
||||||
// const [tagStatus, setTagStatus] = useState('')
|
// 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) => {
|
const upTag = (dataId: string, projId: string) => {
|
||||||
post<any>({
|
post<any>({
|
||||||
@ -455,7 +528,7 @@ export default function CardProj(props: any) {
|
|||||||
</div>
|
</div>
|
||||||
<div className='down-bot'>
|
<div className='down-bot'>
|
||||||
<Button size="small" type="text" onClick={() => {
|
<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>
|
}}> word</Button>
|
||||||
<Button size="small"
|
<Button size="small"
|
||||||
className='down-pdf'
|
className='down-pdf'
|
||||||
@ -464,6 +537,10 @@ export default function CardProj(props: any) {
|
|||||||
}}> pdf</Button>
|
}}> pdf</Button>
|
||||||
</div>
|
</div>
|
||||||
</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>
|
</div>
|
||||||
) : <></>
|
) : <></>
|
||||||
}
|
}
|
||||||
@ -803,6 +880,33 @@ export default function CardProj(props: any) {
|
|||||||
<DisplayOrderShow projId={projId}></DisplayOrderShow>
|
<DisplayOrderShow projId={projId}></DisplayOrderShow>
|
||||||
</Modal >
|
</Modal >
|
||||||
{messageContext}
|
{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>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
@ -570,7 +570,7 @@
|
|||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
background-color: var(--color-light);
|
background-color: var(--color-light);
|
||||||
/* padding: 5px 15px; */
|
/* padding: 5px 15px; */
|
||||||
min-height: 230px;
|
min-height: 260px;
|
||||||
/* width: calc(100vw - 330px); */
|
/* width: calc(100vw - 330px); */
|
||||||
/* margin-bottom: 20px; */
|
/* margin-bottom: 20px; */
|
||||||
border-radius: 13px;
|
border-radius: 13px;
|
||||||
@ -696,6 +696,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cp-bot {
|
.cp-bot {
|
||||||
|
/* background-color: red; */
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@ -855,7 +856,7 @@
|
|||||||
|
|
||||||
.cpb-center {
|
.cpb-center {
|
||||||
width: 532px;
|
width: 532px;
|
||||||
height: 150px;
|
height: 180px;
|
||||||
/* background-color: red; */
|
/* background-color: red; */
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
Loading…
Reference in New Issue
Block a user