1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-08 10:22:46 +00:00

fix: admin share ui (#7265)

Co-authored-by: 杨国璇 <ygx@Hello-word.local>
This commit is contained in:
杨国璇
2024-12-27 11:22:42 +08:00
committed by GitHub
parent bd6a35c374
commit d85dcea40e
10 changed files with 354 additions and 359 deletions

View File

@@ -1,51 +1,31 @@
import React, { useState, useEffect, useRef } from 'react';
import React, { useMemo } from 'react';
import PropTypes from 'prop-types';
import { gettext } from '../../../../utils/constants';
import FolderRecords from './folder-records';
import FileRecords from './file-records';
import FixedWidthTable from '../../../common/fixed-width-table';
const Table = ({ repoID, renderFolder, data }) => {
const [containerWidth, setContainerWidth] = useState(0);
const containerRef = useRef(null);
useEffect(() => {
const container = containerRef.current;
const handleResize = () => {
if (!container) return;
setContainerWidth(container.offsetWidth);
};
const resizeObserver = new ResizeObserver(handleResize);
container && resizeObserver.observe(container);
return () => {
container && resizeObserver.unobserve(container);
};
}, []);
const headers = useMemo(() => [
{ isFixed: true, width: 40, className: 'pl-2 pr-2' },
{ isFixed: false, width: 0.25, children: gettext('Name') },
{ isFixed: false, width: 0.4, children: gettext('Original path') },
{ isFixed: false, width: 0.12, children: gettext('Delete Time') },
{ isFixed: false, width: 0.13, children: gettext('Size') },
{ isFixed: false, width: 0.1, children: gettext('Size') },
], []);
const { items, showFolder, commitID, baseDir, folderPath, folderItems } = data;
return (
<div className="table-container p-0" ref={containerRef}>
<table className="table-hover">
<thead>
<tr>
<th style={{ width: 40 }} className="pl-2 pr-2">{/* icon */}</th>
<th style={{ width: (containerWidth - 40) * 0.25 }}>{gettext('Name')}</th>
<th style={{ width: (containerWidth - 40) * 0.4 }}>{gettext('Original path')}</th>
<th style={{ width: (containerWidth - 40) * 0.12 }}>{gettext('Delete Time')}</th>
<th style={{ width: (containerWidth - 40) * 0.13 }}>{gettext('Size')}</th>
<th style={{ width: (containerWidth - 40) * 0.1 }}>{/* op */}</th>
</tr>
</thead>
<tbody>
{showFolder ? (
<FolderRecords records={folderItems} repoID={repoID} commitID={commitID} baseDir={baseDir} folderPath={folderPath} renderFolder={renderFolder} />
) : (
<FileRecords records={items} repoID={repoID} renderFolder={renderFolder} />
)}
</tbody>
</table>
<div className="table-container p-0">
<FixedWidthTable className="table-hover" headers={headers}>
{showFolder ? (
<FolderRecords records={folderItems} repoID={repoID} commitID={commitID} baseDir={baseDir} folderPath={folderPath} renderFolder={renderFolder} />
) : (
<FileRecords records={items} repoID={repoID} renderFolder={renderFolder} />
)}
</FixedWidthTable>
</div>
);
};