feat: Add tree structure to organization page (#1910)

* rebase master

* feat: add group in userEditPage

* feat: use id as the pk

* feat: add groups item in user

* feat: add tree component

* rebase

* feat: ui

* fix: fix some bug

* fix: route

* fix: ui

* fix: improve ui
This commit is contained in:
Yaodong Yu
2023-06-12 09:27:16 +08:00
committed by GitHub
parent ff87c4ea33
commit 0e14a2597e
36 changed files with 1738 additions and 95 deletions

View File

@ -19,16 +19,14 @@ import * as OrganizationBackend from "../../backend/OrganizationBackend";
import * as Setting from "../../Setting";
function OrganizationSelect(props) {
const {onChange} = props;
const {onChange, initValue, style, onSelect} = props;
const [organizations, setOrganizations] = React.useState([]);
const [value, setValue] = React.useState("");
const [value, setValue] = React.useState(initValue);
React.useEffect(() => {
if (props.organizations === undefined) {
getOrganizations();
}
const initValue = organizations.length > 0 ? organizations[0] : "";
handleOnChange(initValue);
}, []);
const getOrganizations = () => {
@ -36,6 +34,9 @@ function OrganizationSelect(props) {
.then((res) => {
if (res.status === "ok") {
setOrganizations(res.data);
if (initValue === undefined) {
setValue(organizations.length > 0 ? organizations[0] : "");
}
}
});
};
@ -47,14 +48,14 @@ function OrganizationSelect(props) {
return (
<Select
options={organizations.map((organization) => Setting.getOption(organization.name, organization.name))}
options={organizations.map((organization) => Setting.getOption(organization.displayName, organization.name))}
virtual={false}
showSearch
placeholder={i18next.t("login:Please select an organization")}
value={value}
onChange={handleOnChange}
filterOption={(input, option) => (option?.text ?? "").toLowerCase().includes(input.toLowerCase())}
{...props}
filterOption={(input, option) => (option?.label ?? "").toLowerCase().includes(input.toLowerCase())}
style={style}
onSelect={onSelect}
>
</Select>
);

View File

@ -14,7 +14,7 @@
import React from "react";
import * as Setting from "../../Setting";
import {Dropdown} from "antd";
import {Dropdown, Space} from "antd";
import "../../App.less";
import i18next from "i18next";
import {CheckOutlined} from "@ant-design/icons";
@ -43,10 +43,10 @@ class ThemeSelect extends React.Component {
getThemeItems() {
return Themes.map((theme) => Setting.getItem(
<div style={{display: "flex", justifyContent: "space-between"}}>
<div>{i18next.t(`theme:${theme.label}`)}</div>
<Space>
{i18next.t(`theme:${theme.label}`)}
{this.props.themeAlgorithm.includes(theme.key) ? <CheckOutlined style={{marginLeft: "5px"}} /> : null}
</div>,
</Space>,
theme.key, theme.icon));
}