Commit 1db98e3f authored by chenshouchao's avatar chenshouchao

feat: 上传文件表格替换

parent d7e61257
...@@ -393,7 +393,15 @@ const MyTable = (props: IMyTableProps) => { ...@@ -393,7 +393,15 @@ const MyTable = (props: IMyTableProps) => {
</div> </div>
</MyTooltip> </MyTooltip>
)} )}
{!headCell.showOverflowTooltip && <>{row[headCell.id]}</>} {!headCell.showOverflowTooltip && (
<div
style={{
width: headCell.width ? Number(headCell.width) - 32 : "",
}}
>
{row[headCell.id]}
</div>
)}
</TableCell> </TableCell>
))} ))}
</TableRow> </TableRow>
......
...@@ -14,6 +14,9 @@ ...@@ -14,6 +14,9 @@
margin-bottom: 14px; margin-bottom: 14px;
font-weight: 600; font-weight: 600;
} }
.tableBox {
height: 350px;
}
.dropBox { .dropBox {
cursor: pointer; cursor: pointer;
height: 300px; height: 300px;
......
...@@ -8,7 +8,7 @@ import style from "./index.module.css"; ...@@ -8,7 +8,7 @@ import style from "./index.module.css";
import MyDialog from "@/components/mui/MyDialog"; import MyDialog from "@/components/mui/MyDialog";
import { uuid } from "@/utils/util"; import { uuid } from "@/utils/util";
import { useMessage } from "@/components/MySnackbar"; import { useMessage } from "@/components/MySnackbar";
import MyTable from "@/components/mui/MyTable"; import MyTable from "@/components/mui/MyTableNew";
import fileIcon from "@/assets/project/fileIcon.svg"; import fileIcon from "@/assets/project/fileIcon.svg";
import noFile from "@/assets/project/noFile.svg"; import noFile from "@/assets/project/noFile.svg";
import uploaderIcon from "@/assets/project/uploaderIcon.svg"; import uploaderIcon from "@/assets/project/uploaderIcon.svg";
...@@ -149,9 +149,9 @@ const UpLoaderFile = observer((props: IMoveFileProps) => { ...@@ -149,9 +149,9 @@ const UpLoaderFile = observer((props: IMoveFileProps) => {
}, [uploaderDialogOpen]); }, [uploaderDialogOpen]);
const fileListHeadCells = [ const fileListHeadCells = [
{ id: "name", numeric: false, label: "名称", width: "60%" }, { id: "name", label: "名称", width: 300 },
{ id: "size", numeric: false, label: "大小", width: "25%" }, { id: "size", label: "大小", width: 120 },
{ id: "caozuo", numeric: false, label: "操作", width: "15%" }, { id: "caozuo", label: "操作", width: 100 },
]; ];
const renderName = (item: any) => { const renderName = (item: any) => {
...@@ -163,7 +163,7 @@ const UpLoaderFile = observer((props: IMoveFileProps) => { ...@@ -163,7 +163,7 @@ const UpLoaderFile = observer((props: IMoveFileProps) => {
); );
}; };
const renderSize = (item: any) => { const renderSize = (item: any) => {
return <span>{item.size ? storageUnitFromB(Number(item.size)) : "-"}</span>; return `${item.size ? storageUnitFromB(Number(item.size)) : "-"}`;
}; };
const handleRowDelete = (index: number) => { const handleRowDelete = (index: number) => {
...@@ -224,25 +224,14 @@ const UpLoaderFile = observer((props: IMoveFileProps) => { ...@@ -224,25 +224,14 @@ const UpLoaderFile = observer((props: IMoveFileProps) => {
</div> </div>
<div className={style.tableBox}> <div className={style.tableBox}>
<MyTable <MyTable
rowHover={true} fixedHead={true}
stickyHeader={true}
rows={fileList.map((item: any, index: number) => ({ rows={fileList.map((item: any, index: number) => ({
...item, ...item,
name: renderName(item), name: renderName(item),
size: renderSize(item), size: renderSize(item),
caozuo: renderButtons(item, index), caozuo: renderButtons(item, index),
}))} }))}
rowsPerPage={"99"}
headCells={fileListHeadCells} headCells={fileListHeadCells}
footer={false}
// headTableCellStyle={{
// fontSize: "12px",
// lineHeight: "20px",
// color: "#8A9099",
// }}
tableContainerStyle={{
maxHeight: "300px",
}}
/> />
</div> </div>
{fileList.length === 0 && ( {fileList.length === 0 && (
......
...@@ -116,3 +116,6 @@ ...@@ -116,3 +116,6 @@
line-height: 22px; line-height: 22px;
color: #8a9099; color: #8a9099;
} }
.tableBox {
height: calc(100vh - 300px);
}
...@@ -277,7 +277,6 @@ const ProjectData = observer(() => { ...@@ -277,7 +277,6 @@ const ProjectData = observer(() => {
{ id: "size", label: "大小", width: 200 }, { id: "size", label: "大小", width: 200 },
{ {
id: "mtime", id: "mtime",
numeric: false,
label: "创建时间", label: "创建时间",
width: 200, width: 200,
}, },
...@@ -580,20 +579,22 @@ const ProjectData = observer(() => { ...@@ -580,20 +579,22 @@ const ProjectData = observer(() => {
</div> </div>
</div> </div>
</div> </div>
<MyTable <div className={style.tableBox}>
fixedHead={true} <MyTable
hasCheckbox={showCheckBox} fixedHead={true}
headCells={versionsHeadCells} hasCheckbox={showCheckBox}
selectItems={selectIds} headCells={versionsHeadCells}
setSelectItems={setSelectIds} selectItems={selectIds}
rows={showList.map((item: any, index: number) => ({ setSelectItems={setSelectIds}
...item, rows={showList.map((item: any, index: number) => ({
name: renderName(item), ...item,
size: renderSize(item), name: renderName(item),
mtime: renderMtime(item), size: renderSize(item),
caozuo: renderButtons(item), mtime: renderMtime(item),
}))} caozuo: renderButtons(item),
/> }))}
/>
</div>
</div> </div>
{selectIds.length > 0 && ( {selectIds.length > 0 && (
<div className={style.projectDataStickyBox}> <div className={style.projectDataStickyBox}>
......
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