Skip to content

B
bkunyun
Commit c5517fd8 authored by chenshouchao's avatar chenshouchao
Browse files
Options

feat: 完成上传文件、新建文件夹 搜索 目录路径自测

parent 23b809bd
Hide whitespace changes
Inline Side-by-side
Showing with 140 additions and 77 deletions
src/api/fileserver/CloudEController.ts
View file @ c5517fd8
......@@ -50,8 +50,8 @@ class CloudEController {
// });
}
}
// 文件列表
static JobOutFileList(
// 文件树
static JobOutFileDirtree(
url: any,
filetoken: string,
projectId: string,
......@@ -60,20 +60,19 @@ class CloudEController {
) {
if (ApiUtils.getAuthorizationHeaders(headers)) {
headers["Cache-Control"] = "no-cache";
// headers['parentName'] = ''
if (getLoaclStorageOfKey("userinfo")) {
url += urlToken(filetoken, projectId);
}
return axios.get(
APIOPTION() + "/list" + url + "&showhidden=" + showHide,
APIOPTION() + "/dirtree" + url + "&showhidden=" + showHide,
{
headers: headers,
}
);
}
}
// 文件树
static JobOutFileDirtree(
// 文件列表
static JobOutFileList(
url: any,
filetoken: string,
projectId: string,
......@@ -82,11 +81,12 @@ class CloudEController {
) {
if (ApiUtils.getAuthorizationHeaders(headers)) {
headers["Cache-Control"] = "no-cache";
// headers['parentName'] = ''
if (getLoaclStorageOfKey("userinfo")) {
url += urlToken(filetoken, projectId);
}
return axios.get(
APIOPTION() + "/dirtree" + url + "&showhidden=" + showHide,
APIOPTION() + "/list" + url + "&showhidden=" + showHide,
{
headers: headers,
}
......@@ -106,16 +106,10 @@ class CloudEController {
if (getLoaclStorageOfKey("userinfo")) {
url = urlToken(filetoken, projectId) + "&q=" + url;
}
axios
.get(APIOPTION() + "/search" + base + url + "&showhidden=" + showHide, {
headers: headers,
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
return axios
.get(APIOPTION() + "/search" + base + url + "&showhidden=" + showHide, {
headers: headers,
})
}
}
......
src/views/Project/ProjectData/AddFolder/index.tsx
View file @ c5517fd8
......@@ -7,7 +7,7 @@ import { useMessage } from "@/components/MySnackbar";
import CloudEController from "@/api/fileserver/CloudEController";
const AddFolder = (props: any) => {
const { list, path, projectId, fileToken } = props;
const { list, path, projectId, fileToken, refresh } = props;
const Message = useMessage();
let addFolderDialogRef: any = React.createRef();
......@@ -31,9 +31,9 @@ const AddFolder = (props: any) => {
fileToken,
projectId
)?.then((res) => {
console.log(res);
Message.success("新建成功");
addFolderDialogRef.current.handleClose();
refresh()
});
} else {
Message.info(fileNameCheck.help || "请输入文件夹名称");
......
src/views/Project/ProjectData/MoveFile/index.tsx
View file @ c5517fd8
import React, {
useState,
useImperativeHandle,
useEffect,
useCallback,
} from "react";
import style from "./index.module.css";
import { TextField } from "@mui/material";
import MyDialog from "@/components/mui/MyDialog";
import { checkIsNumberLetterChinese } from "@/utils/util";
import folderIcon from "@/assets/project/folderIcon.svg";
import bigFolderIcon from "@/assets/project/bigFolderIcon.svg";
import { useMessage } from "@/components/MySnackbar";
......@@ -16,7 +13,7 @@ import MyTreeView from "@/components/mui/MyTreeView";
import CloudEController from "@/api/fileserver/CloudEController";
const MoveFile = (props: any) => {
const { path, projectId, fileToken, currentOperateFile, selectIds } = props;
const { path, projectId, fileToken, currentOperateFile, selectIds, refresh } = props;
const Message = useMessage();
const [newPath, setNewPath] = useState("");
......@@ -30,27 +27,15 @@ const MoveFile = (props: any) => {
projectId,
false
)?.then((res) => {
console.log("tree");
console.log(res);
if (Array.isArray(res.data)) {
setTreeData(res.data);
} else {
setTreeData([]);
}
// setTableLoadding(false);
// if (Array.isArray(res.data)) {
// setList(res.data);
// } else {
// setList([]);
// }
});
}
}, [fileToken, projectId]);
// useEffect(() => {
// getTree();
// }, [getTree]);
let moveFileDialogRef: any = React.createRef();
const showDialog = () => {
......@@ -78,16 +63,13 @@ const MoveFile = (props: any) => {
fileToken,
projectId
)?.then((res) => {
console.log("批量移动");
console.log(res);
Message.success('移动成功！')
refresh()
});
} else {
const oldPath = `${path}${path === "/" ? "" : "/"}${
currentOperateFile.name
}`;
console.log("submit");
console.log(newPath);
console.log(oldPath);
if (oldPath === newPath) {
Message.info("当前目录和目标目录一致，请重新选择目标目录");
return;
......@@ -126,6 +108,7 @@ const MoveFile = (props: any) => {
const idFunc = (item: any) => {
return `${item.dir.substr(1)}${item.name}`;
};
return (
<MyDialog
handleSubmit={handleMoveFileSubmit}
......
src/views/Project/ProjectData/index.module.css
View file @ c5517fd8
......@@ -88,3 +88,27 @@
justify-content: flex-end;
align-items: center;
}
.showPathSpan{
cursor: pointer;
line-height: 22px;
font-size: 14px;
color: #1E2633;
/* display: flex;
align-items: center; */
}
.showPathI{
margin: 0 10px;
line-height: 22px;
font-size: 20px;
color: #C2C6CC;
cursor: default ;
}
.showPathSpan:hover{
color: #1370FF;
}
.showPathSpanActive{
color: #1370FF;
}
\ No newline at end of file
src/views/Project/ProjectData/index.tsx
View file @ c5517fd8
......@@ -30,12 +30,7 @@ import DialogActions from "@mui/material/DialogActions";
import DialogContent from "@mui/material/DialogContent";
import DialogContentText from "@mui/material/DialogContentText";
import DialogTitle from "@mui/material/DialogTitle";
// import TreeView from '@mui/lab/TreeView';
// import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
// import ChevronRightIcon from '@mui/icons-material/ChevronRight';
// import ArrowRightIcon from '@mui/icons-material/ArrowRight';
// import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
// import TreeItem from '@mui/lab/TreeItem';
import usePass from "@/hooks/usePass";
const theme = createTheme({
palette: {
......@@ -50,13 +45,11 @@ declare module "@mui/material/styles" {
neutral: Palette["primary"];
}
// allow configuration using `createTheme`
interface PaletteOptions {
neutral?: PaletteOptions["primary"];
}
}
// Update the Button's color prop options
declare module "@mui/material/Button" {
interface ButtonPropsColorOverrides {
neutral: true;
......@@ -64,18 +57,43 @@ declare module "@mui/material/Button" {
}
const ProjectData = observer(() => {
const isPass = usePass();
const Message = useMessage()
const { currentProjectStore } = useStores();
const [tableLoadding, setTableLoadding] = useState(false);
const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
const [currentOperateFile, setCurrentOperateFile] = useState<any>(null);
const [deleteloading, setDeleteloading] = useState(false);
// const [path, setPath] = useState("/ProjectData");
const [path, setPath] = useState("/");
const showPath = useMemo(() => {
if (path === "/") {
return "ProjectData";
// return "ProjectData";
return <span className={style.showPathSpan}>ProjectData</span>
} else {
console.log(path)
console.log(path.split('/'))
const pathArr = path.split('/')
if (pathArr.length <= 4) {
return (pathArr.map((item, index) => {
return (<span onClick={()=>setPath(pathArr.slice(0, index + 1).join('/') === '' ? '' : pathArr.slice(0, index + 1).join('/'))} className={classnames({
[style.showPathSpan]: true,
[style.showPathSpanActive]: index === pathArr.length - 1
})}>{index === 0 ? 'ProjectData' :item} {index === pathArr.length - 1 ? null : <i className={style.showPathI}>{'>'}</i>}</span>)
}))
} else {
return (pathArr.map((item, index) => {
return (<span onClick={()=>setPath(pathArr.slice(0, index + 1).join('/') === '' ? '' : pathArr.slice(0, index + 1).join('/'))} className={classnames({
[style.showPathSpan]: true,
[style.showPathSpanActive]: index === pathArr.length - 1
})}>
{index === 0 ? 'ProjectData' : index > pathArr.length - 4 ? item : '' }
{/* && index > pathArr.length - 4 */}
{index === pathArr.length - 1 || (index <= pathArr.length - 4 && index > 0) ? null : <i className={style.showPathI}>{'>'}</i>}
{index === 1 && '...'}{index === 1 && <i className={style.showPathI}>{'>'}</i>}
</span>)
}))
}
}
return `ProjectData${path}`;
}, [path]);
const [activeTab, setActiveTab] = useState(1);
const [keyWord, setKeyWord] = useState("");
......@@ -94,16 +112,6 @@ const ProjectData = observer(() => {
return toJS(currentProjectStore.currentProjectInfo.id);
}, [currentProjectStore]);
// useEffect(() => {
// if (fileToken && projectId) {
// CloudEController.JobOutFileList(path, fileToken, projectId, false)?.then(
// (res) => {
// console.log(res);
// setList(res.data);
// }
// );
// }
// }, [fileToken, path, projectId]);
const getList = useCallback(() => {
if (fileToken && projectId) {
setTableLoadding(true);
......@@ -113,7 +121,6 @@ const ProjectData = observer(() => {
projectId,
false
)?.then((res) => {
console.log(res);
setTableLoadding(false);
if (Array.isArray(res.data)) {
setList(res.data);
......@@ -126,9 +133,35 @@ const ProjectData = observer(() => {
useEffect(() => {
getList();
}, [getList]);
// 全局搜索文件列表
const searchFileList = useCallback(() => {
if (fileToken && projectId) {
setTableLoadding(true);
return CloudEController.JobSearchFileList(
keyWord,
path,
fileToken,
projectId,
false
)?.then((res) => {
setTableLoadding(false);
if (Array.isArray(res.data)) {
setList(res.data);
} else {
setList([]);
}
});
}
}, [fileToken, path, projectId, keyWord]);
const handleRefresh = () => {
getList();
if (keyWord) {
searchFileList()
} else {
getList();
}
setSelectIds([])
};
useEffect(() => {
......@@ -138,9 +171,19 @@ const ProjectData = observer(() => {
}, [getDataFileTokenRun, currentProjectStore]);
const handleKeyWordChange = (e: any) => {
if (e.target.value.length > 30) {
return
}
setKeyWord(e.target.value);
};
const handleKeyWordChangeKeyUp = (e: any) => {
if (e.keyCode === 13) {
searchFileList()
console.log('搜索')
}
}
const [selectIds, setSelectIds] = useState([]);
const versionsHeadCells = [
......@@ -159,7 +202,11 @@ const ProjectData = observer(() => {
const handleViewFolders = (item: any) => {
console.log("handleViewFolders");
console.log(item);
setPath(`${path}${item.name}`);
if (path === '/') {
setPath(`/${item.name}`)
} else {
setPath(`${path}/${item.name}`);
}
};
const hanleDeleteFile = (item: any) => {
......@@ -254,17 +301,23 @@ const ProjectData = observer(() => {
};
const handleDelete = () => {
const deletePath =
path === "/"
? `${path}${currentOperateFile.name}`
: `${path}/${currentOperateFile.name}`;
let deletePath = ''
if (currentOperateFile) {
deletePath =
path === "/"
? `${path}${currentOperateFile.name}`
: `${path}/${currentOperateFile.name}`;
} else {
deletePath = selectIds.map((name: any) => {
return `${path}${path === "/" ? "" : "/"}${name}`;
}).join(' ');
}
CloudEController.JobOutFileDel(
deletePath,
fileToken,
projectId as string
)?.then((res) => {
console.log("handleDelete");
console.log(res);
Message.success('删除成功')
setDeleteloading(false);
setDeleteDialogOpen(false);
handleRefresh();
......@@ -276,6 +329,11 @@ const ProjectData = observer(() => {
moveFileRef.current.showDialog();
};
const handleBatchDelete = () => {
setCurrentOperateFile(null);
setDeleteDialogOpen(true)
}
return (
<ThemeProvider theme={theme}>
<div className={style.projectData}>
......@@ -290,7 +348,9 @@ const ProjectData = observer(() => {
size="small"
style={{ marginRight: "12px" }}
onClick={hanleShowUpLoaderFileDialog}
disabled={selectIds.length !== 0 || !isPass("PROJECT_DATA_UPLOAD")}
>
{/* todo 项目权限 */}
上传文件
</Button>
<Button
......@@ -298,7 +358,9 @@ const ProjectData = observer(() => {
variant="outlined"
size="small"
onClick={hanleShowAddFolderDialog}
>
disabled={selectIds.length !== 0 || !isPass("PROJECT_DATA_ADDDIR")}
>
{/* todo 项目权限 */}
新建文件夹
</Button>
</div>
......@@ -310,6 +372,7 @@ const ProjectData = observer(() => {
value={keyWord}
onChange={handleKeyWordChange}
style={{ width: "280px", fontSize: "14px" }}
onKeyUp={handleKeyWordChangeKeyUp}
/>
<IconButton
type="submit"
......@@ -387,6 +450,7 @@ const ProjectData = observer(() => {
variant="outlined"
size="small"
style={{ marginRight: "12px" }}
onClick={handleBatchDelete}
>
批量删除（{selectIds.length}）
</Button>
......@@ -410,7 +474,7 @@ const ProjectData = observer(() => {
<DialogTitle id="alert-dialog-title">{"提示"}</DialogTitle>
<DialogContent>
<DialogContentText id="alert-dialog-description">
确认要删除“{currentOperateFile ? currentOperateFile.name : ""}
确认要删除“{currentOperateFile ? currentOperateFile.name : selectIds.join('”，“')}
”吗？
</DialogContentText>
</DialogContent>
......@@ -429,15 +493,10 @@ const ProjectData = observer(() => {
onClick={handleDelete}
color="primary"
variant="contained"
// style={submitStyle}
size="small"
>
确认
</LoadingButton>
{/* <Button onClick={handleDeleteDialogClose}>取消</Button>
<Button onClick={handleDelete} autoFocus>
确认
</Button> */}
</DialogActions>
</Dialog>
<UpLoaderFile
......@@ -449,6 +508,7 @@ const ProjectData = observer(() => {
onRef={addFolderRef}
list={list}
path={path}
refresh={handleRefresh}
fileToken={fileToken}
projectId={projectId}
></AddFolder>
......@@ -459,6 +519,7 @@ const ProjectData = observer(() => {
projectId={projectId}
currentOperateFile={currentOperateFile}
selectIds={selectIds}
refresh={handleRefresh}
></MoveFile>
</div>
</ThemeProvider>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment