1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-25 23:02:26 +00:00

Merge pull request #7249 from haiwen/fix/kanban_setting_panel_ui

Fix/kanban setting panel UI
This commit is contained in:
杨国璇
2024-12-26 14:23:44 +08:00
committed by GitHub
7 changed files with 18 additions and 5 deletions

View File

@@ -25,6 +25,7 @@ const propTypes = {
sortItems: PropTypes.func, sortItems: PropTypes.func,
viewId: PropTypes.string, viewId: PropTypes.string,
onToggleDetail: PropTypes.func, onToggleDetail: PropTypes.func,
onCloseDetail: PropTypes.func,
}; };
class DirTool extends React.Component { class DirTool extends React.Component {
@@ -94,7 +95,7 @@ class DirTool extends React.Component {
render() { render() {
const menuItems = this.getMenu(); const menuItems = this.getMenu();
const { isDropdownMenuOpen } = this.state; const { isDropdownMenuOpen } = this.state;
const { repoID, currentMode, currentPath, sortBy, sortOrder, viewId, isCustomPermission, onToggleDetail } = this.props; const { repoID, currentMode, currentPath, sortBy, sortOrder, viewId, isCustomPermission, onToggleDetail, onCloseDetail } = this.props;
const propertiesText = TextTranslation.PROPERTIES.value; const propertiesText = TextTranslation.PROPERTIES.value;
const isFileExtended = currentPath.startsWith('/' + PRIVATE_FILE_TYPE.FILE_EXTENDED_PROPERTIES + '/'); const isFileExtended = currentPath.startsWith('/' + PRIVATE_FILE_TYPE.FILE_EXTENDED_PROPERTIES + '/');
const isTagView = currentPath.startsWith('/' + PRIVATE_FILE_TYPE.TAGS_PROPERTIES + '/'); const isTagView = currentPath.startsWith('/' + PRIVATE_FILE_TYPE.TAGS_PROPERTIES + '/');
@@ -106,6 +107,7 @@ class DirTool extends React.Component {
viewId={viewId} viewId={viewId}
isCustomPermission={isCustomPermission} isCustomPermission={isCustomPermission}
onToggleDetail={onToggleDetail} onToggleDetail={onToggleDetail}
onCloseDetail={onCloseDetail}
/> />
</div> </div>
); );

View File

@@ -21,7 +21,9 @@ const Selector = ({ options, settingKey, value, defaultValue, onChange }) => {
value={selectedOption} value={selectedOption}
options={options} options={options}
onChange={handelOnChange} onChange={handelOnChange}
menuPortalTarget="sf-metadata-view-setting-panel" isSearchable={false}
isClearable={false}
menuPortalTarget=".sf-metadata-view-setting-panel"
/> />
); );
}; };

View File

@@ -9,7 +9,7 @@ import MapViewToolBar from './map-view-toolbar';
import './index.css'; import './index.css';
const ViewToolBar = ({ viewId, isCustomPermission, onToggleDetail }) => { const ViewToolBar = ({ viewId, isCustomPermission, onToggleDetail, onCloseDetail }) => {
const [view, setView] = useState(null); const [view, setView] = useState(null);
const [collaborators, setCollaborators] = useState([]); const [collaborators, setCollaborators] = useState([]);
@@ -108,6 +108,7 @@ const ViewToolBar = ({ viewId, isCustomPermission, onToggleDetail }) => {
modifyFilters={modifyFilters} modifyFilters={modifyFilters}
modifySorts={modifySorts} modifySorts={modifySorts}
onToggleDetail={onToggleDetail} onToggleDetail={onToggleDetail}
onCloseDetail={onCloseDetail}
/> />
)} )}
{viewType === VIEW_TYPE.MAP && ( {viewType === VIEW_TYPE.MAP && (
@@ -126,6 +127,7 @@ ViewToolBar.propTypes = {
viewId: PropTypes.string, viewId: PropTypes.string,
isCustomPermission: PropTypes.bool, isCustomPermission: PropTypes.bool,
onToggleDetail: PropTypes.func, onToggleDetail: PropTypes.func,
onCloseDetail: PropTypes.func,
}; };
export default ViewToolBar; export default ViewToolBar;

View File

@@ -13,6 +13,7 @@ const KanbanViewToolBar = ({
modifyFilters, modifyFilters,
modifySorts, modifySorts,
onToggleDetail, onToggleDetail,
onCloseDetail,
}) => { }) => {
const viewType = useMemo(() => view.type, [view]); const viewType = useMemo(() => view.type, [view]);
const viewColumns = useMemo(() => { const viewColumns = useMemo(() => {
@@ -25,7 +26,7 @@ const KanbanViewToolBar = ({
}, [viewColumns]); }, [viewColumns]);
const onToggleKanbanSetting = () => { const onToggleKanbanSetting = () => {
onToggleDetail(); onCloseDetail();
window.sfMetadataContext.eventBus.dispatch(EVENT_BUS_TYPE.TOGGLE_KANBAN_SETTINGS); window.sfMetadataContext.eventBus.dispatch(EVENT_BUS_TYPE.TOGGLE_KANBAN_SETTINGS);
}; };
@@ -89,6 +90,7 @@ KanbanViewToolBar.propTypes = {
modifyFilters: PropTypes.func, modifyFilters: PropTypes.func,
modifySorts: PropTypes.func, modifySorts: PropTypes.func,
onToggleDetail: PropTypes.func, onToggleDetail: PropTypes.func,
onCloseDetail: PropTypes.func,
}; };
export default KanbanViewToolBar; export default KanbanViewToolBar;

View File

@@ -1,3 +1,7 @@
.sf-metadata-wrapper .sf-metadata-main .sf-metadata-view-kanban-container {
transform: unset;
}
.sf-metadata-view-kanban { .sf-metadata-view-kanban {
position: relative; position: relative;
width: 100%; width: 100%;

View File

@@ -42,7 +42,7 @@ const Kanban = () => {
}, [isShowSettings]); }, [isShowSettings]);
return ( return (
<div className="sf-metadata-container"> <div className="sf-metadata-container sf-metadata-view-kanban-container">
<div className="sf-metadata-view-kanban"> <div className="sf-metadata-view-kanban">
<Boards <Boards
modifyRecord={modifyRecord} modifyRecord={modifyRecord}

View File

@@ -2310,6 +2310,7 @@ class LibContentView extends React.Component {
viewId={this.state.viewId} viewId={this.state.viewId}
viewType={this.props.viewType} viewType={this.props.viewType}
onToggleDetail={this.toggleDirentDetail} onToggleDetail={this.toggleDirentDetail}
onCloseDetail={this.closeDirentDetail}
/> />
</div> </div>
} }