1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-02 07:47:32 +00:00

refactor: metadata columns (#6516)

Co-authored-by: 杨国璇 <ygx@Hello-word.local>
This commit is contained in:
杨国璇 2024-08-08 22:17:47 +08:00 committed by GitHub
parent 1f42fecb83
commit fdd5e6dbf9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 10 additions and 12 deletions

View File

@ -8,22 +8,22 @@ import './index.css';
const Detail = ({ children, className }) => {
const [width, setWidth] = useState(300);
const [inResizing, setResizing] = useState(false);
const [isResizing, setResizing] = useState(false);
const resizeBarRef = useRef(null);
const dragHandlerRef = useRef(null);
const onResizeMouseMove = useCallback((e) => {
const newWidth = Math.max(Math.min(window.innerWidth - e.clientX, 600), 300);
if (width === newWidth) return;
localStorage.setItem('sf_cur_view_detail_width', newWidth);
setWidth(newWidth);
}, [width]);
const onResizeMouseUp = useCallback(() => {
window.removeEventListener('mousemove', onResizeMouseMove);
window.removeEventListener('mouseup', onResizeMouseUp);
inResizing && setResizing(false);
localStorage.setItem('sf_cur_view_detail_width', width);
}, [width, inResizing, onResizeMouseMove]);
isResizing && setResizing(false);
}, [isResizing, onResizeMouseMove]);
const onResizeMouseDown = useCallback(() => {
window.addEventListener('mouseup', onResizeMouseUp);
@ -55,8 +55,6 @@ const Detail = ({ children, className }) => {
'cur-view-detail-large': width > 400
})}
style={{ width }}
// onMouseMove={inResizing ? onResizeMouseMove : null}
// onMouseUp={onResizeMouseUp}
>
{children}
<ResizeBar

View File

@ -103,10 +103,10 @@ const ColumnTypes = ({
{displayColumns.length > 0 && (
<div className="select-column-wrapper">
<div className="select-column-list">
{basicsColumns.length > 0 && (
{predefinedColumns.length > 0 && (
<>
<div className="select-column-title">{gettext('Basic')}</div>
{basicsColumns.map(item => {
<div className="select-column-title">{gettext('Predefined properties')}</div>
{predefinedColumns.map(item => {
return (
<div
className={classnames('select-column-item text-truncate', { 'active': item.key === column.key })}
@ -120,10 +120,10 @@ const ColumnTypes = ({
})}
</>
)}
{predefinedColumns.length > 0 && (
{basicsColumns.length > 0 && (
<>
<div className="select-column-title">{gettext('Predefined')}</div>
{predefinedColumns.map(item => {
<div className="select-column-title">{gettext('Custom properties')}</div>
{basicsColumns.map(item => {
return (
<div
className={classnames('select-column-item text-truncate', { 'active': item.key === column.key })}