mirror of
https://github.com/casdoor/casdoor.git
synced 2025-07-04 05:10:19 +08:00
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:
@ -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>
|
||||
);
|
||||
|
@ -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));
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user