Next round of refactoring done
This commit is contained in:
parent
8c0c6a167c
commit
9c7959cec8
@ -1,14 +1,19 @@
|
||||
{
|
||||
"Activate": "Activate",
|
||||
"Add": "Add",
|
||||
"AddDomain": "Add Domain",
|
||||
"Address": "Address",
|
||||
"Admin": "Admin",
|
||||
"AnEmailWithPasswordResetLinkHasBeenSent": "An email with a password reset link has been sent.",
|
||||
"AnErrorOccurred": "An error occurred",
|
||||
"Application": "Application",
|
||||
"Applications": "Applications",
|
||||
"Allowed": "Allowed",
|
||||
"AuditLog": "Audit Logs",
|
||||
"AuditLogs": "Audit Logs",
|
||||
"BlockedIPAddresses": "Blocked IP addresses",
|
||||
"BlockedIPs": "Blocked IPs",
|
||||
"Cancel": "Cancel",
|
||||
"Changes": "Changes",
|
||||
"ClientDomainManager": "Client Domain Manager",
|
||||
"ClientDomains": "Client Domains",
|
||||
@ -18,6 +23,8 @@
|
||||
"CustomFields": "Custom Fields",
|
||||
"DisableAuthenticator": "Disable Authenticator",
|
||||
"DisplayName": "Display Name",
|
||||
"Edit": "Edit",
|
||||
"EditDomain": "Edit Domain",
|
||||
"e-print": "e-print",
|
||||
"e-suite": "e-suite",
|
||||
"e-suiteLogo": "e-suite logo",
|
||||
@ -29,14 +36,18 @@
|
||||
"FieldType": "Field Type",
|
||||
"Forms": "Forms",
|
||||
"FormTemplateManager": "Form Template Manager",
|
||||
"General": "General",
|
||||
"Glossaries": "Glossaries",
|
||||
"GlossaryManager": "Glossary Manager",
|
||||
"Group": "Group",
|
||||
"Home": "Home",
|
||||
"Id": "Id",
|
||||
"IPAddress": "IP Address",
|
||||
"IPAddressUnblocked": "IP Address '{{ip}}' unblocked.",
|
||||
"Items": "Items",
|
||||
"Loading": "Loading",
|
||||
"LoggingOut": "Logging out",
|
||||
"MailTemplates": "Mail Templates",
|
||||
"Message": "Message",
|
||||
"Name": "Name",
|
||||
"NewPassword": "New Password",
|
||||
@ -51,6 +62,9 @@
|
||||
"PasswordsMustMatch": "You need to confirm by typing exactly the same as the new password",
|
||||
"PressAgainToUnblock": "Press again to unblock",
|
||||
"ResetPassword": "Reset Password",
|
||||
"RoleAccess": "Role Access",
|
||||
"RoleAccessUpdated": "Role access updated successfully.",
|
||||
"SecurityRoles": "Security Roles",
|
||||
"Save": "Save",
|
||||
"Sequence": "Sequence",
|
||||
"SequenceManager": "Sequence Manager",
|
||||
@ -60,14 +74,17 @@
|
||||
"SpecificationManager": "Specification Manager",
|
||||
"SsoManager": "Sso Manager",
|
||||
"StackTrace": "Stack Trace",
|
||||
"Status": "Status",
|
||||
"Support": "Support",
|
||||
"SupportingData": "Supporting Data",
|
||||
"Timing": "Timing",
|
||||
"Type": "Type",
|
||||
"Up": "Up",
|
||||
"UnblockedInMinutes": "Unblocked In (Minutes)",
|
||||
"UserManager": "User Manager",
|
||||
"UserName": "User Name",
|
||||
"UsernameIsRequired": "Username is required",
|
||||
"Version": "Version",
|
||||
"UsernameMustBeValidEmail": "Username must be a valid email",
|
||||
"Users": "Users"
|
||||
}
|
||||
|
||||
@ -1,99 +1,150 @@
|
||||
import React, { Component } from 'react';
|
||||
import Column from '../../../components/common/columns';
|
||||
import { Paginated } from '../../../services/Paginated';
|
||||
import CustomFieldsTable from './components/CustomFieldsTable';
|
||||
import customFieldsService, { CustomField } from './services/customFieldsService';
|
||||
import Button, { ButtonType } from '../../../components/common/Button';
|
||||
import Loading from '../../../components/common/Loading';
|
||||
import Permission from '../../../components/common/Permission';
|
||||
import React, { useEffect, useMemo, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../components/common/columns";
|
||||
import { Paginated } from "../../../services/Paginated";
|
||||
import CustomFieldsTable from "./components/CustomFieldsTable";
|
||||
import customFieldsService, {
|
||||
CustomField,
|
||||
} from "./services/customFieldsService";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
|
||||
interface CustomFieldsState {
|
||||
loaded: boolean,
|
||||
pagedData: Paginated<CustomField>,
|
||||
sortColumn: Column<CustomField>,
|
||||
filters: Map<string, string>;
|
||||
}
|
||||
const initialPagedData: Paginated<CustomField> = {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
};
|
||||
|
||||
class CustomFields extends Component<any, any, CustomFieldsState> {
|
||||
state = {
|
||||
loaded: false,
|
||||
pagedData: {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: []
|
||||
},
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
}
|
||||
const initialSortColumn: Column<CustomField> = {
|
||||
key: "name",
|
||||
label: "Name",
|
||||
order: "asc",
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const CustomFields: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] =
|
||||
useState<Paginated<CustomField>>(initialPagedData);
|
||||
const [sortColumn, setSortColumn] =
|
||||
useState<Column<CustomField>>(initialSortColumn);
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
() => new Map<string, string>(),
|
||||
);
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
}
|
||||
|
||||
changePage = async (page: number, pageSize: number) => {
|
||||
const { sortColumn, filters } = this.state;
|
||||
|
||||
const pagedData = await customFieldsService.getFields(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
|
||||
onSort = async (sortColumn: Column<CustomField>) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
const pagedData = await customFieldsService.getFields(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
|
||||
onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
|
||||
const pagedData = await customFieldsService.getFields(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
useEffect(() => {
|
||||
const loadInitial = async () => {
|
||||
const pagedDataResult = await customFieldsService.getFields(
|
||||
initialPagedData.page,
|
||||
initialPagedData.pageSize,
|
||||
initialSortColumn.key,
|
||||
initialSortColumn.order === "asc",
|
||||
new Map<string, string>(),
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async (item?: CustomField) => {
|
||||
const response = await customFieldsService.deleteField(item?.id, item?.guid);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
void loadInitial();
|
||||
}, []);
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddField">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">Add</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<CustomFieldsTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete} />
|
||||
</Loading>
|
||||
);
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
const pagedDataResult = await customFieldsService.getFields(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onSort = async (nextSortColumn: Column<CustomField>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const pagedDataResult = await customFieldsService.getFields(
|
||||
page,
|
||||
pageSize,
|
||||
nextSortColumn.key,
|
||||
nextSortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
setSortColumn(nextSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const nextFilters = new Map(filters);
|
||||
nextFilters.set(name, value);
|
||||
|
||||
const pagedDataResult = await customFieldsService.getFields(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
nextFilters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setFilters(nextFilters);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onDelete = async (item?: CustomField) => {
|
||||
const response = await customFieldsService.deleteField(
|
||||
item?.id,
|
||||
item?.guid,
|
||||
);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
const translatedSortColumn = useMemo(
|
||||
() => ({ ...sortColumn, label: t("Name") }),
|
||||
[sortColumn, t],
|
||||
);
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddField">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<CustomFieldsTable
|
||||
data={pagedData}
|
||||
sortColumn={translatedSortColumn}
|
||||
onChangePage={changePage}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
export default CustomFields;
|
||||
|
||||
@ -1,97 +1,130 @@
|
||||
import React, { Component } from 'react';
|
||||
import Column from '../../../components/common/columns';
|
||||
import { Paginated } from '../../../services/Paginated';
|
||||
import DomainsTable from './components/domainsTable';
|
||||
import domainsService, { GetDomain } from './serrvices/domainsService';
|
||||
import Button, { ButtonType } from '../../../components/common/Button';
|
||||
import Loading from '../../../components/common/Loading';
|
||||
import Permission from '../../../components/common/Permission';
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../components/common/columns";
|
||||
import { Paginated } from "../../../services/Paginated";
|
||||
import DomainsTable from "./components/domainsTable";
|
||||
import domainsService, { GetDomain } from "./serrvices/domainsService";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
|
||||
interface DomainsState{
|
||||
loaded: boolean;
|
||||
pagedData : Paginated<GetDomain>,
|
||||
sortColumn : Column<GetDomain>,
|
||||
filters: Map<string, string>;
|
||||
}
|
||||
const initialPagedData: Paginated<GetDomain> = {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
};
|
||||
|
||||
class Domains extends Component< any, any, DomainsState> {
|
||||
state = {
|
||||
loaded : false,
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
}
|
||||
const Domains: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] =
|
||||
useState<Paginated<GetDomain>>(initialPagedData);
|
||||
const [sortColumn, setSortColumn] = useState<Column<GetDomain>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
() => new Map<string, string>(),
|
||||
);
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
}
|
||||
|
||||
changePage = async(page: number, pageSize : number) =>{
|
||||
const { sortColumn, filters } = this.state;
|
||||
|
||||
const pagedData = await domainsService.getDomains(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
|
||||
onSort = async(sortColumn : Column<GetDomain>) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
const pagedData = await domainsService.getDomains(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
|
||||
onSearch = async ( name: string, value: string) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const {sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
|
||||
const pagedData = await domainsService.getDomains(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
useEffect(() => {
|
||||
const loadInitial = async () => {
|
||||
await changePage(initialPagedData.page, initialPagedData.pageSize);
|
||||
};
|
||||
|
||||
onDelete = async ( keyValue? : GetDomain) => {
|
||||
const response = await domainsService.deleteDomain( keyValue?.id, keyValue?.guid);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
void loadInitial();
|
||||
}, []);
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddDomain">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">Add</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr/>
|
||||
<DomainsTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete}/>
|
||||
</Loading>
|
||||
);
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
const pagedDataResult = await domainsService.getDomains(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onSort = async (nextSortColumn: Column<GetDomain>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const pagedDataResult = await domainsService.getDomains(
|
||||
page,
|
||||
pageSize,
|
||||
nextSortColumn.key,
|
||||
nextSortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
setSortColumn(nextSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const nextFilters = new Map(filters);
|
||||
nextFilters.set(name, value);
|
||||
|
||||
const pagedDataResult = await domainsService.getDomains(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
nextFilters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setFilters(nextFilters);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const onDelete = async (keyValue?: GetDomain) => {
|
||||
const response = await domainsService.deleteDomain(
|
||||
keyValue?.id,
|
||||
keyValue?.guid,
|
||||
);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
const translatedSortColumn = { ...sortColumn, label: t("Name") };
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddDomain">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<DomainsTable
|
||||
data={pagedData}
|
||||
sortColumn={translatedSortColumn}
|
||||
onChangePage={changePage}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
export default Domains;
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import HorizontalTabs from "../../../components/common/HorizionalTabs";
|
||||
import Tab from "../../../components/common/Tab";
|
||||
import authentication from "../../frame/services/authenticationService";
|
||||
@ -7,54 +8,47 @@ import MailTemplatesTab from "./components/MailTemplatesTab";
|
||||
import SecurityRolesTab from "./components/SecurityRolesTab";
|
||||
|
||||
interface DomainsDetailsProps {
|
||||
editMode : boolean;
|
||||
editMode: boolean;
|
||||
}
|
||||
|
||||
class DomainsDetails extends React.Component<DomainsDetailsProps> {
|
||||
isEditMode = () => {
|
||||
const { editMode } = this.props;
|
||||
return editMode;
|
||||
};
|
||||
const DomainsDetails: React.FC<DomainsDetailsProps> = ({ editMode }) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
render() {
|
||||
const isEditMode = this.isEditMode();
|
||||
const canViewMailTemplates = authentication.hasAccess("ViewDomain")
|
||||
const canViewSecurityRoles = authentication.hasAccess("ViewRole")
|
||||
const canViewMailTemplates = authentication.hasAccess("ViewDomain");
|
||||
const canViewSecurityRoles = authentication.hasAccess("ViewRole");
|
||||
|
||||
let mode = "Add";
|
||||
if (isEditMode) mode = "Edit";
|
||||
const heading = editMode ? t("EditDomain") : t("AddDomain");
|
||||
|
||||
const tabs: JSX.Element[] = [];
|
||||
|
||||
let tabs : JSX.Element[] = [];
|
||||
tabs.push(
|
||||
<Tab key={1} label={t("General")}>
|
||||
<GeneralTab isEditMode={editMode} />
|
||||
</Tab>,
|
||||
);
|
||||
|
||||
tabs.push( <Tab key={1} label="General">
|
||||
<GeneralTab isEditMode={isEditMode}/>
|
||||
</Tab> );
|
||||
|
||||
if (isEditMode) {
|
||||
if (canViewMailTemplates) {
|
||||
tabs.push(<Tab key={2} label="Mail Templates">
|
||||
<MailTemplatesTab />
|
||||
</Tab>
|
||||
);
|
||||
}
|
||||
if (canViewSecurityRoles) {
|
||||
tabs.push(<Tab key={3} label="Security Roles">
|
||||
<SecurityRolesTab />
|
||||
</Tab>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>{mode} Domain</h1>
|
||||
<HorizontalTabs>
|
||||
{tabs}
|
||||
</HorizontalTabs>
|
||||
</div>
|
||||
);
|
||||
if (editMode) {
|
||||
if (canViewMailTemplates) {
|
||||
tabs.push(
|
||||
<Tab key={2} label={t("MailTemplates")}>
|
||||
<MailTemplatesTab />
|
||||
</Tab>,
|
||||
);
|
||||
}
|
||||
}
|
||||
if (canViewSecurityRoles) {
|
||||
tabs.push(
|
||||
<Tab key={3} label={t("SecurityRoles")}>
|
||||
<SecurityRolesTab />
|
||||
</Tab>,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>{heading}</h1>
|
||||
<HorizontalTabs>{tabs}</HorizontalTabs>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default DomainsDetails;
|
||||
|
||||
@ -1,82 +1,80 @@
|
||||
import React from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import withRouter, { RouterProps } from "../../../../utils/withRouter";
|
||||
import mailTemplatesService from "../serrvices/mailTemplatesService";
|
||||
import HOCEmailTemplateEditor from "./EmailTemplateEditor";
|
||||
import Loading from "../../../../components/common/Loading";
|
||||
|
||||
interface MailType{
|
||||
mailType : string;
|
||||
description : string;
|
||||
interface MailType {
|
||||
mailType: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
interface MailTemplatesTabState{
|
||||
loaded : boolean;
|
||||
currentMailType : string;
|
||||
types : MailType[]
|
||||
}
|
||||
interface MailTemplatesTabProps extends RouterProps {}
|
||||
|
||||
interface MailTemplatesTabProps extends RouterProps{
|
||||
|
||||
}
|
||||
const MailTemplatesTabNoRouter: React.FC<MailTemplatesTabProps> = ({
|
||||
router,
|
||||
}) => {
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [currentMailType, setCurrentMailType] = useState("");
|
||||
const [types, setTypes] = useState<MailType[]>([]);
|
||||
|
||||
class MailTemplatesTabNoRouter extends React.Component<MailTemplatesTabProps, MailTemplatesTabState> {
|
||||
state : MailTemplatesTabState = {
|
||||
loaded : false,
|
||||
currentMailType : "",
|
||||
types: []
|
||||
}
|
||||
useEffect(() => {
|
||||
const loadTypes = async () => {
|
||||
const response = await mailTemplatesService.getTypes(0, 10, "", true);
|
||||
if (response) {
|
||||
const nextTypes = response.data as MailType[];
|
||||
setTypes(nextTypes);
|
||||
|
||||
async componentDidMount() {
|
||||
const types = await mailTemplatesService.getTypes(0,10,"",true);
|
||||
if (types) {
|
||||
this.setState({ types: types.data as MailType[] });
|
||||
|
||||
if ((types.data as MailType[])?.length > 0) {
|
||||
this.SelectTemplate((types.data as MailType[])[0].mailType);
|
||||
}
|
||||
if (nextTypes.length > 0) {
|
||||
setLoaded(true);
|
||||
setCurrentMailType(nextTypes[0].mailType);
|
||||
}
|
||||
}
|
||||
|
||||
onClick = (e: React.MouseEvent<HTMLElement>) => {
|
||||
const { target } = e;
|
||||
|
||||
const value = (target as HTMLElement).getAttribute("value");
|
||||
|
||||
this.SelectTemplate(value!);
|
||||
}
|
||||
};
|
||||
|
||||
SelectTemplate = ( emailType : string) => {
|
||||
const { currentMailType } = this.state;
|
||||
void loadTypes();
|
||||
}, []);
|
||||
|
||||
if (currentMailType !== emailType)
|
||||
{
|
||||
console.log("Selecting", emailType);
|
||||
this.setState({ loaded: true, currentMailType : emailType});
|
||||
}
|
||||
const selectTemplate = (emailType: string) => {
|
||||
if (currentMailType !== emailType) {
|
||||
setLoaded(true);
|
||||
setCurrentMailType(emailType);
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
const { domainId } = this.props.router.params;
|
||||
const { loaded, types, currentMailType } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<div className="two-column-grid-1-3">
|
||||
<div>
|
||||
<ul className="mail-types">
|
||||
{ types.map( (x) => {
|
||||
return <li key={x.mailType} value={x.mailType} onClick={this.onClick}>{x.description}</li>
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<HOCEmailTemplateEditor domainId={domainId} currentMailType={currentMailType} />
|
||||
</div>
|
||||
</div>
|
||||
</Loading>
|
||||
);
|
||||
const onClick = (e: React.MouseEvent<HTMLElement>) => {
|
||||
const value = (e.target as HTMLElement).getAttribute("value");
|
||||
if (value) {
|
||||
selectTemplate(value);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const { domainId } = router.params;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<div className="two-column-grid-1-3">
|
||||
<div>
|
||||
<ul className="mail-types">
|
||||
{types.map((x) => {
|
||||
return (
|
||||
<li key={x.mailType} value={x.mailType} onClick={onClick}>
|
||||
{x.description}
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<HOCEmailTemplateEditor
|
||||
domainId={domainId}
|
||||
currentMailType={currentMailType}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
const MailTemplatesTab = withRouter(MailTemplatesTabNoRouter);
|
||||
|
||||
|
||||
@ -1,166 +1,186 @@
|
||||
import React from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { toast } from "react-toastify";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import { Paginated } from "../../../../services/Paginated";
|
||||
import { MakeGeneralIdRef } from "../../../../utils/GeneralIdRef";
|
||||
import withRouter, { RouterProps } from "../../../../utils/withRouter";
|
||||
import roleService, { GetRoleSecurityAccess, GetSecurityAccess } from "../serrvices/rolesService";
|
||||
import roleService, {
|
||||
GetRoleSecurityAccess,
|
||||
GetSecurityAccess,
|
||||
} from "../serrvices/rolesService";
|
||||
import RollAccessTable from "./RollAccessTable";
|
||||
import Loading from "../../../../components/common/Loading";
|
||||
|
||||
interface RoleAccessEditorState{
|
||||
loaded: boolean,
|
||||
accessList : Paginated<GetSecurityAccess>,
|
||||
accessRightsForRole : Paginated<GetRoleSecurityAccess>,
|
||||
pagedData : Paginated<GetRoleSecurityAccess>,
|
||||
sortColumn : Column<GetRoleSecurityAccess>,
|
||||
filters: Map<string, string>;
|
||||
const initialPagedData: Paginated<GetRoleSecurityAccess> = {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
};
|
||||
|
||||
const initialAccessList: Paginated<GetSecurityAccess> = {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
};
|
||||
|
||||
interface RoleAccessEditorProps extends RouterProps {
|
||||
role: any | undefined;
|
||||
}
|
||||
|
||||
interface RoleAccessEditorProps extends RouterProps{
|
||||
role : any | undefined
|
||||
}
|
||||
const RoleAccessEditorNoRouter: React.FC<RoleAccessEditorProps> = ({
|
||||
role,
|
||||
router,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [accessList, setAccessList] =
|
||||
useState<Paginated<GetSecurityAccess>>(initialAccessList);
|
||||
const [accessRightsForRole, setAccessRightsForRole] =
|
||||
useState<Paginated<GetRoleSecurityAccess>>(initialPagedData);
|
||||
const [pagedData, setPagedData] =
|
||||
useState<Paginated<GetRoleSecurityAccess>>(initialPagedData);
|
||||
const [sortColumn] = useState<Column<GetRoleSecurityAccess>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
|
||||
class RoleAccessEditorNoRouter extends React.Component<RoleAccessEditorProps, RoleAccessEditorState> {
|
||||
state : RoleAccessEditorState = {
|
||||
loaded : false,
|
||||
accessList : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
accessRightsForRole : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
const isItemSelected = (
|
||||
securityAccess: string,
|
||||
roleAccessList: unknown[] | undefined,
|
||||
): boolean => {
|
||||
if (roleAccessList === undefined) return false;
|
||||
|
||||
const filtered = roleAccessList.filter(
|
||||
(x) => (x as any).securityAccess === securityAccess,
|
||||
);
|
||||
return filtered.length > 0;
|
||||
};
|
||||
|
||||
const compileAccessRightsPagedData = (
|
||||
masterList: GetSecurityAccess[] | undefined,
|
||||
roleAccessList: unknown[] | undefined,
|
||||
): Paginated<GetRoleSecurityAccess> => {
|
||||
if (masterList === undefined) {
|
||||
return initialPagedData;
|
||||
}
|
||||
|
||||
componentDidMount = async () => {
|
||||
await this.updatePage();
|
||||
if (roleAccessList === undefined) {
|
||||
return {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: masterList as GetRoleSecurityAccess[],
|
||||
};
|
||||
}
|
||||
|
||||
async componentDidUpdate(prevProps: Readonly<RoleAccessEditorProps>, prevState: Readonly<RoleAccessEditorState>, snapshot?: any) {
|
||||
if (prevProps.role?.id !== this.props.role?.id) {
|
||||
await this.updatePage();
|
||||
}
|
||||
const accessRightsForRoleData = masterList.map((value) => {
|
||||
const item: any = value;
|
||||
item.selected = isItemSelected(item.securityAccess, roleAccessList);
|
||||
return item;
|
||||
});
|
||||
|
||||
return {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: accessRightsForRoleData,
|
||||
};
|
||||
};
|
||||
|
||||
const changePage = async (nextAccessList?: Paginated<GetSecurityAccess>) => {
|
||||
const list = nextAccessList || accessList;
|
||||
|
||||
const roleAccessFilters = new Map<string, string>();
|
||||
roleAccessFilters.set("roleId", String(role?.id));
|
||||
const accessRightsResponse = await roleService.getRoleAccess(
|
||||
0,
|
||||
10,
|
||||
"name",
|
||||
true,
|
||||
roleAccessFilters,
|
||||
);
|
||||
|
||||
if (accessRightsResponse) {
|
||||
const nextPagedData = compileAccessRightsPagedData(
|
||||
list?.data,
|
||||
accessRightsResponse?.data,
|
||||
);
|
||||
if (nextPagedData) {
|
||||
setLoaded(true);
|
||||
setAccessRightsForRole(accessRightsResponse);
|
||||
setPagedData(nextPagedData);
|
||||
}
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
const updatePage = async (nextAccessList?: Paginated<GetSecurityAccess>) => {
|
||||
if (nextAccessList && nextAccessList.count === 0) {
|
||||
const list = await roleService.getAccessList(0, 10, "name", true);
|
||||
setAccessList(list);
|
||||
await changePage(list);
|
||||
} else {
|
||||
await changePage(nextAccessList);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const loadInitial = async () => {
|
||||
let list = accessList;
|
||||
if (list.count === 0) {
|
||||
list = await roleService.getAccessList(0, 10, "name", true);
|
||||
setAccessList(list);
|
||||
}
|
||||
await updatePage(list);
|
||||
};
|
||||
|
||||
void loadInitial();
|
||||
}, [role?.id]);
|
||||
|
||||
const handleSave = async (additions: string[], deletions: string[]) => {
|
||||
const roleGeneralIdRef = MakeGeneralIdRef(role?.id, role?.guid);
|
||||
let response = undefined;
|
||||
|
||||
if (additions.length > 0) {
|
||||
response = await roleService.addRoleAccess(roleGeneralIdRef, additions);
|
||||
}
|
||||
|
||||
updatePage = async() =>
|
||||
{
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
if (deletions.length > 0) {
|
||||
response = await roleService.deleteRoleAccess(
|
||||
roleGeneralIdRef,
|
||||
deletions,
|
||||
);
|
||||
}
|
||||
|
||||
changePage = async(page: number, pageSize : number) => {
|
||||
let { accessList } = this.state;
|
||||
const { role } = this.props;
|
||||
|
||||
if (accessList?.count === 0)
|
||||
{
|
||||
accessList = await roleService.getAccessList(0, 10, "name", true );
|
||||
this.setState({ accessList });
|
||||
}
|
||||
|
||||
const roleAccessfilters = new Map<string, string>();
|
||||
roleAccessfilters.set( "roleId", String(role?.id));
|
||||
const accessRightsForRole = await roleService.getRoleAccess(0,10,"name",true, roleAccessfilters);
|
||||
if (accessRightsForRole) {
|
||||
const pagedData = this.complieAccessRightsPagedData(accessList?.data, accessRightsForRole?.data);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, accessRightsForRole, pagedData });
|
||||
}
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
if (response) {
|
||||
toast.info(t("RoleAccessUpdated"));
|
||||
await updatePage(accessList);
|
||||
}
|
||||
};
|
||||
|
||||
IsItemSelected = (securityAccess: string, roleAccess: unknown[] | undefined) : boolean => {
|
||||
if (roleAccess === undefined)
|
||||
return false;
|
||||
const isAdministrator = role?.isAdministrator || role?.isSuperUser;
|
||||
|
||||
const filtered = roleAccess?.filter( (x) => (x as any).securityAccess === securityAccess);
|
||||
|
||||
return filtered!.length > 0;
|
||||
}
|
||||
|
||||
complieAccessRightsPagedData = (masterList: GetSecurityAccess[] | undefined, roleAccess: unknown[] | undefined) : Paginated<GetRoleSecurityAccess> => {
|
||||
if ( masterList === undefined ) {
|
||||
return { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] }
|
||||
}
|
||||
|
||||
if (roleAccess === undefined) {
|
||||
return { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: (masterList as GetRoleSecurityAccess[]) }
|
||||
}
|
||||
|
||||
const accessrightsForRole : Paginated<GetRoleSecurityAccess> = { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: []
|
||||
}
|
||||
|
||||
accessrightsForRole.data = masterList.map( value => {
|
||||
let item : any = value
|
||||
item.selected = this.IsItemSelected(item.securityAccess, roleAccess);
|
||||
return item
|
||||
})
|
||||
|
||||
return accessrightsForRole;
|
||||
}
|
||||
|
||||
handleSave = async ( additions : string[], deletions : string[] ) => {
|
||||
const { role } = this.props;
|
||||
|
||||
const roleGeneralIdRef = MakeGeneralIdRef(role?.id, role?.guid);
|
||||
let response = undefined;
|
||||
if (additions.length > 0)
|
||||
{
|
||||
response = await roleService.addRoleAccess( roleGeneralIdRef, additions);
|
||||
}
|
||||
|
||||
if (deletions.length > 0)
|
||||
{
|
||||
response = await roleService.deleteRoleAccess( roleGeneralIdRef, deletions);
|
||||
}
|
||||
if (response) {
|
||||
toast.info("Role access updated successfully.")
|
||||
await this.updatePage();
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const { loaded, pagedData } = this.state;
|
||||
|
||||
const { role } = this.props;
|
||||
const isAdministrator = role.isAdministrator || role.isSuperUser;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<RollAccessTable role={role.id} isAdministrator={isAdministrator} data={pagedData} onSave={this.handleSave}/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<RollAccessTable
|
||||
role={role?.id}
|
||||
isAdministrator={isAdministrator}
|
||||
data={pagedData}
|
||||
onSave={handleSave}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
const RoleAccessEditor = withRouter(RoleAccessEditorNoRouter);
|
||||
|
||||
export default RoleAccessEditor;
|
||||
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import React from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import { Paginated } from "../../../../services/Paginated";
|
||||
import { MakeGeneralIdRef } from "../../../../utils/GeneralIdRef";
|
||||
@ -9,132 +10,160 @@ import Button, { ButtonType } from "../../../../components/common/Button";
|
||||
import Loading from "../../../../components/common/Loading";
|
||||
import Permission from "../../../../components/common/Permission";
|
||||
|
||||
interface RolesEditorState{
|
||||
loaded : boolean,
|
||||
pagedData : Paginated<GetRoleResponse>,
|
||||
sortColumn : Column<GetRoleResponse>,
|
||||
filters: Map<string, string>;
|
||||
const initialPagedData: Paginated<GetRoleResponse> = {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
};
|
||||
|
||||
interface RolesEditorProps extends RouterProps {
|
||||
selectedRole?: GetRoleResponse;
|
||||
onSelectRole?: (keyValue: any) => void;
|
||||
onUnselectRole?: () => void;
|
||||
}
|
||||
|
||||
interface RolesEditorProps extends RouterProps{
|
||||
selectedRole? : GetRoleResponse;
|
||||
onSelectRole?: (keyValue: any) => void;
|
||||
onUnselectRole?: () => void;
|
||||
}
|
||||
const RolesEditorTabNoRouter: React.FC<RolesEditorProps> = ({
|
||||
selectedRole,
|
||||
onSelectRole,
|
||||
onUnselectRole,
|
||||
router,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] =
|
||||
useState<Paginated<GetRoleResponse>>(initialPagedData);
|
||||
const [sortColumn, setSortColumn] = useState<Column<GetRoleResponse>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
() => new Map<string, string>(),
|
||||
);
|
||||
|
||||
class RolesEditorTabNoRouter extends React.Component<RolesEditorProps, RolesEditorState> {
|
||||
state : RolesEditorState = {
|
||||
loaded : false,
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
}
|
||||
const { domainId } = router.params;
|
||||
const domainGeneralIdRef = MakeGeneralIdRef(domainId);
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
}
|
||||
|
||||
changePage = async(page: number, pageSize : number) =>{
|
||||
const { sortColumn, filters } = this.state;
|
||||
const { domainId } = this.props.router.params;
|
||||
|
||||
const domainGeneralIdRef = MakeGeneralIdRef( domainId);
|
||||
|
||||
const pagedData = await roleService.getRoles(page, pageSize, sortColumn.key, sortColumn.order === "asc", domainGeneralIdRef, filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
|
||||
onSort = async(sortColumn : Column<GetRoleResponse>) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
const { domainId } = this.props.router.params;
|
||||
|
||||
const domainGeneralIdRef = MakeGeneralIdRef( domainId);
|
||||
const pagedData = await roleService.getRoles(page, pageSize, sortColumn.key, sortColumn.order === "asc", domainGeneralIdRef, filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
|
||||
onSearch = async ( name: string, value: string) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const {sortColumn, filters } = this.state;
|
||||
const { domainId } = this.props.router.params;
|
||||
const domainGeneralIdRef = MakeGeneralIdRef( domainId);
|
||||
|
||||
filters.set(name, value);
|
||||
|
||||
const pagedData = await roleService.getRoles(page, pageSize, sortColumn.key, sortColumn.order === "asc", domainGeneralIdRef, filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
useEffect(() => {
|
||||
const loadInitial = async () => {
|
||||
await changePage(initialPagedData.page, initialPagedData.pageSize);
|
||||
};
|
||||
|
||||
canEdit = ( keyValue : any) => {
|
||||
return keyValue.canDelete;
|
||||
void loadInitial();
|
||||
}, [domainId]);
|
||||
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
const pagedDataResult = await roleService.getRoles(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
domainGeneralIdRef,
|
||||
filters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
canDelete = ( keyValue : any) => {
|
||||
return keyValue.canDelete;
|
||||
const onSort = async (nextSortColumn: Column<GetRoleResponse>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
|
||||
const pagedDataResult = await roleService.getRoles(
|
||||
page,
|
||||
pageSize,
|
||||
nextSortColumn.key,
|
||||
nextSortColumn.order === "asc",
|
||||
domainGeneralIdRef,
|
||||
filters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setPagedData(pagedDataResult);
|
||||
setSortColumn(nextSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async ( keyValue? : GetRoleResponse) => {
|
||||
const response = await roleService.deleteRole( keyValue!.id, keyValue!.guid);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const nextFilters = new Map(filters);
|
||||
nextFilters.set(name, value);
|
||||
|
||||
const pagedDataResult = await roleService.getRoles(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
domainGeneralIdRef,
|
||||
nextFilters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setFilters(nextFilters);
|
||||
setPagedData(pagedDataResult);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
onSelectRow = ( id : GetRoleResponse ) =>
|
||||
{
|
||||
const { onSelectRole } = this.props;
|
||||
const canEdit = (keyValue: any) => {
|
||||
return keyValue.canDelete;
|
||||
};
|
||||
|
||||
if (onSelectRole !== undefined){
|
||||
onSelectRole(id);
|
||||
}
|
||||
const canDelete = (keyValue: any) => {
|
||||
return keyValue.canDelete;
|
||||
};
|
||||
|
||||
const onDelete = async (keyValue?: GetRoleResponse) => {
|
||||
const response = await roleService.deleteRole(keyValue!.id, keyValue!.guid);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
onUnselectRole = () => {
|
||||
const { onUnselectRole } = this.props;
|
||||
|
||||
if (onUnselectRole !== undefined) {
|
||||
onUnselectRole();
|
||||
}
|
||||
const onSelectRow = (id: GetRoleResponse) => {
|
||||
if (onSelectRole !== undefined) {
|
||||
onSelectRole(id);
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
const translatedSortColumn = { ...sortColumn, label: t("Name") };
|
||||
|
||||
const { selectedRole, onUnselectRole } = this.props;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddRole">
|
||||
<Button id="btnAddRoleToDomain" buttonType={ButtonType.primary} to="addRole">Add</Button>
|
||||
</Permission>
|
||||
<hr/>
|
||||
<RolesTable data={pagedData} sortColumn={sortColumn} selectedRow={selectedRole} onChangePage={this.changePage} onUnselectRow={onUnselectRole} onSort={this.onSort} onSearch={this.onSearch} onSelectRow={this.onSelectRow} canEdit={this.canEdit}canDelete={this.canDelete} onDelete={this.onDelete}/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddRole">
|
||||
<Button
|
||||
id="btnAddRoleToDomain"
|
||||
buttonType={ButtonType.primary}
|
||||
to="addRole"
|
||||
>
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</Permission>
|
||||
<hr />
|
||||
<RolesTable
|
||||
data={pagedData}
|
||||
sortColumn={translatedSortColumn}
|
||||
selectedRow={selectedRole}
|
||||
onChangePage={changePage}
|
||||
onUnselectRow={onUnselectRole}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onSelectRow={onSelectRow}
|
||||
canEdit={canEdit}
|
||||
canDelete={canDelete}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
const RolesEditor = withRouter(RolesEditorTabNoRouter);
|
||||
|
||||
|
||||
@ -1,35 +1,71 @@
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
import { GetRoleResponse } from "../serrvices/rolesService";
|
||||
|
||||
class RolesTable extends React.Component<PublishedTableProps<GetRoleResponse>> {
|
||||
columns : Column<GetRoleResponse>[] = [
|
||||
{ key: "name", label: "Name", order: "asc" }
|
||||
];
|
||||
const RolesTable: React.FC<PublishedTableProps<GetRoleResponse>> = (props) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
raiseSort = (sortColumn : Column<GetRoleResponse>) => {
|
||||
this.setState({sortColumn});
|
||||
if ( this.props.onSort !== undefined)
|
||||
this.props.onSort(sortColumn);
|
||||
}
|
||||
const columns: Column<GetRoleResponse>[] = [
|
||||
{ key: "name", label: t("Name"), order: "asc" },
|
||||
];
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Domain.Role",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
const raiseSort = (sortColumn: Column<GetRoleResponse>) => {
|
||||
if (props.onSort !== undefined) props.onSort(sortColumn);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, selectedRow, onChangePage, onSearch, onSelectRow, canEdit, canDelete, onDelete, onUnselectRow } = this.props;
|
||||
const editPath = authentication.hasAccess("EditRole") ? "editRole/{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteRole") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Domain.Role",
|
||||
primaryKey: '{"Id":' + item.id + "}",
|
||||
};
|
||||
};
|
||||
|
||||
return <Table data={data} keyName="id" columns={this.columns} sortColumn={sortColumn} editPath={editPath} selectedRow={selectedRow} onSort={this.raiseSort} onChangePage={onChangePage} onSearch={onSearch} onSelectRow={onSelectRow} onUnselectRow={onUnselectRow} canEdit={canEdit} canDelete={canDelete} onDelete={doDelete} onAuditParams={showAudit}/>;
|
||||
}
|
||||
}
|
||||
|
||||
export default RolesTable;
|
||||
const {
|
||||
data,
|
||||
sortColumn,
|
||||
selectedRow,
|
||||
onChangePage,
|
||||
onSearch,
|
||||
onSelectRow,
|
||||
canEdit,
|
||||
canDelete,
|
||||
onDelete,
|
||||
onUnselectRow,
|
||||
} = props;
|
||||
const editPath = authentication.hasAccess("EditRole")
|
||||
? "editRole/{0}"
|
||||
: undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteRole")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
selectedRow={selectedRow}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onSelectRow={onSelectRow}
|
||||
onUnselectRow={onUnselectRow}
|
||||
canEdit={canEdit}
|
||||
canDelete={canDelete}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default RolesTable;
|
||||
|
||||
@ -1,150 +1,150 @@
|
||||
import React from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import Button, { ButtonType } from "../../../../components/common/Button";
|
||||
import { GetSecurityAccess } from "../serrvices/rolesService";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
|
||||
interface RollAccessTableProps extends PublishedTableProps<GetSecurityAccess>{
|
||||
role : any;
|
||||
isAdministrator : boolean;
|
||||
onSave: ( additions : string[], deletions : string[] ) => void;
|
||||
interface RollAccessTableProps extends PublishedTableProps<GetSecurityAccess> {
|
||||
role: any;
|
||||
isAdministrator: boolean;
|
||||
onSave: (additions: string[], deletions: string[]) => void;
|
||||
}
|
||||
|
||||
interface RollAccessTableState{
|
||||
deltaAdditions : string[];
|
||||
deltaDeletions : string[];
|
||||
}
|
||||
const RollAccessTable: React.FC<RollAccessTableProps> = ({
|
||||
role,
|
||||
isAdministrator,
|
||||
onSave,
|
||||
onSort,
|
||||
data,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const [deltaAdditions, setDeltaAdditions] = useState<string[]>([]);
|
||||
const [deltaDeletions, setDeltaDeletions] = useState<string[]>([]);
|
||||
|
||||
class RollAccessTable extends React.Component<RollAccessTableProps, RollAccessTableState> {
|
||||
useEffect(() => {
|
||||
setDeltaAdditions([]);
|
||||
setDeltaDeletions([]);
|
||||
}, [role]);
|
||||
|
||||
state : RollAccessTableState = {
|
||||
deltaAdditions : [],
|
||||
deltaDeletions : []
|
||||
};
|
||||
const itemIsSelected = (item: any): boolean => {
|
||||
if (isAdministrator) return true;
|
||||
|
||||
ResetState = () => {
|
||||
this.setState( {
|
||||
deltaAdditions : [],
|
||||
deltaDeletions : []
|
||||
} );
|
||||
let selected = item.selected;
|
||||
|
||||
if (selected === true) {
|
||||
selected = !(
|
||||
deltaDeletions.filter((x) => x === item.securityAccess).length > 0
|
||||
);
|
||||
} else {
|
||||
selected =
|
||||
deltaAdditions.filter((x) => x === item.securityAccess).length > 0;
|
||||
}
|
||||
|
||||
componentDidMount = async () => {
|
||||
this.ResetState();
|
||||
}
|
||||
return selected;
|
||||
};
|
||||
|
||||
componentDidUpdate(prevProps: Readonly<RollAccessTableProps>, prevState: Readonly<RollAccessTableState>, snapshot?: any): void {
|
||||
if (prevProps.role !== this.props.role) {
|
||||
this.ResetState();
|
||||
const checkboxChange = (e: any) => {
|
||||
const accessKey = e.target.id;
|
||||
const newSelectedState = e.target.checked;
|
||||
|
||||
const filteredData = data.data?.filter(
|
||||
(x: any) => x.securityAccess === accessKey,
|
||||
);
|
||||
|
||||
if (filteredData?.length === 1) {
|
||||
const item: any = filteredData[0];
|
||||
const oldSelectedState = item.selected;
|
||||
|
||||
if (oldSelectedState === true) {
|
||||
if (newSelectedState === true) {
|
||||
setDeltaDeletions(deltaDeletions.filter((x) => x !== accessKey));
|
||||
} else {
|
||||
setDeltaDeletions([...deltaDeletions, accessKey]);
|
||||
}
|
||||
}
|
||||
|
||||
checkboxChange = (e : any) => {
|
||||
const accessKey = e.target.id;
|
||||
const newSelectedState = e.target.checked;
|
||||
let { deltaAdditions, deltaDeletions } = this.state;
|
||||
|
||||
const { data } = this.props;
|
||||
const filteredData = data.data?.filter( (x: any) => x.securityAccess === accessKey );
|
||||
|
||||
if (filteredData?.length === 1)
|
||||
{
|
||||
const item : any = filteredData[0];
|
||||
const oldSelectedState = item.selected;
|
||||
|
||||
if (oldSelectedState===true) {
|
||||
if (newSelectedState===true){
|
||||
deltaDeletions = deltaDeletions.filter( x => x !== accessKey);
|
||||
}
|
||||
else {
|
||||
deltaDeletions.push(accessKey);
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (newSelectedState===true){
|
||||
deltaAdditions.push(accessKey);
|
||||
}
|
||||
else {
|
||||
deltaAdditions = deltaAdditions.filter( x => x !== accessKey);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (newSelectedState === true) {
|
||||
setDeltaAdditions([...deltaAdditions, accessKey]);
|
||||
} else {
|
||||
setDeltaAdditions(deltaAdditions.filter((x) => x !== accessKey));
|
||||
}
|
||||
|
||||
this.setState( { deltaAdditions, deltaDeletions })
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
itemIsSelected = (item : any) => {
|
||||
const { deltaAdditions, deltaDeletions } = this.state;
|
||||
const { isAdministrator } = this.props;
|
||||
if (isAdministrator)
|
||||
return true;
|
||||
const columns: Column<GetSecurityAccess>[] = [
|
||||
{
|
||||
key: "selected",
|
||||
label: t("Allowed"),
|
||||
order: "asc",
|
||||
content: (item: any) => {
|
||||
return (
|
||||
<>
|
||||
<input
|
||||
id={item.securityAccess}
|
||||
type="checkbox"
|
||||
checked={itemIsSelected(item)}
|
||||
onChange={checkboxChange}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
},
|
||||
},
|
||||
{ key: "name", label: t("Name"), order: "asc" },
|
||||
{ key: "groupName", label: t("Group"), order: "asc" },
|
||||
{ key: "description", label: t("Description"), order: "asc" },
|
||||
];
|
||||
|
||||
let selected = item.selected;
|
||||
const raiseSort = (sortColumn: Column<GetSecurityAccess>) => {
|
||||
if (onSort !== undefined) onSort(sortColumn);
|
||||
};
|
||||
|
||||
if (selected === true) {
|
||||
selected = !(deltaDeletions.filter( x => x === item.securityAccess).length > 0);
|
||||
}
|
||||
else {
|
||||
selected = (deltaAdditions.filter( x => x === item.securityAccess).length > 0);
|
||||
}
|
||||
const handleClickCancel = () => {
|
||||
setDeltaAdditions([]);
|
||||
setDeltaDeletions([]);
|
||||
};
|
||||
|
||||
return selected;
|
||||
}
|
||||
const handleClickSave = () => {
|
||||
onSave(deltaAdditions, deltaDeletions);
|
||||
setDeltaAdditions([]);
|
||||
setDeltaDeletions([]);
|
||||
};
|
||||
|
||||
columns : Column<GetSecurityAccess>[] = [
|
||||
{ key: "selected", label: "Allowed", order: "asc", content:(item : any) => {
|
||||
return <><input id={item.securityAccess} type="checkbox" checked={this.itemIsSelected(item)} onChange={this.checkboxChange}/></> } }, //todo refactor this to use the normal forms code?
|
||||
{ key: "name", label: "Name", order: "asc" },
|
||||
{ key: "groupName", label: "Group", order: "asc" },
|
||||
{ key: "description", label: "Description", order: "asc" }
|
||||
];
|
||||
const canEditRoleAccess = authentication.hasAccess("EditRoleAccess");
|
||||
const canChangeRoleAccess = isAdministrator || canEditRoleAccess;
|
||||
const hasChanges = !(deltaAdditions.length + deltaDeletions.length === 0);
|
||||
|
||||
raiseSort = (sortColumn : Column<GetSecurityAccess>) => {
|
||||
if ( this.props.onSort !== undefined)
|
||||
this.props.onSort(sortColumn);
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<Table
|
||||
data={data}
|
||||
keyName="securityAccess"
|
||||
columns={columns}
|
||||
onSort={raiseSort}
|
||||
/>
|
||||
{canChangeRoleAccess && (
|
||||
<>
|
||||
<Button
|
||||
disabled={!hasChanges}
|
||||
buttonType={ButtonType.secondary}
|
||||
onClick={handleClickCancel}
|
||||
>
|
||||
{t("Cancel")}
|
||||
</Button>
|
||||
<Button
|
||||
disabled={!hasChanges}
|
||||
buttonType={ButtonType.primary}
|
||||
onClick={handleClickSave}
|
||||
>
|
||||
{t("Save")}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Domain.UserRole",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
|
||||
HandleClickCancel = () => {
|
||||
this.setState( { deltaAdditions : [], deltaDeletions : [] })
|
||||
}
|
||||
|
||||
HandleClickSave = () => {
|
||||
const { onSave } = this.props;
|
||||
const { deltaAdditions, deltaDeletions } = this.state;
|
||||
|
||||
onSave(deltaAdditions, deltaDeletions);
|
||||
|
||||
this.setState( { deltaAdditions : [], deltaDeletions : [] })
|
||||
}
|
||||
|
||||
render() {
|
||||
const { deltaAdditions, deltaDeletions } = this.state;
|
||||
const { data, isAdministrator } = this.props;
|
||||
const canEditRoleAccess = authentication.hasAccess("EditRoleAccess");
|
||||
const canChangeRoleAccess = isAdministrator || canEditRoleAccess;
|
||||
|
||||
const hasChanges = !(deltaAdditions.length + deltaDeletions.length === 0);
|
||||
|
||||
return <>
|
||||
<Table data={ data } keyName="securityAccess" columns={this.columns} />
|
||||
{canChangeRoleAccess && <>
|
||||
<Button disabled={!hasChanges} buttonType={ButtonType.secondary} onClick={this.HandleClickCancel}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button disabled={!hasChanges} buttonType={ButtonType.primary} onClick={this.HandleClickSave}>
|
||||
Save
|
||||
</Button>
|
||||
</>}
|
||||
</>;
|
||||
}
|
||||
}
|
||||
|
||||
export default RollAccessTable;
|
||||
export default RollAccessTable;
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import React from "react";
|
||||
import React, { useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import HorizontalTabs from "../../../../components/common/HorizionalTabs";
|
||||
import Tab from "../../../../components/common/Tab";
|
||||
import withRouter, { RouterProps } from "../../../../utils/withRouter";
|
||||
@ -8,65 +9,60 @@ import UserRoleEditor from "./UserRoleEditor";
|
||||
import { GetRoleResponse } from "../serrvices/rolesService";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
|
||||
interface SecurityRolesTabState{
|
||||
selectedRole? : GetRoleResponse
|
||||
}
|
||||
interface SecurityRolesTabProps extends RouterProps {}
|
||||
|
||||
interface SecurityRolesTabProps extends RouterProps{
|
||||
|
||||
}
|
||||
const SecurityRolesTabNoRouter: React.FC<SecurityRolesTabProps> = () => {
|
||||
const { t } = useTranslation();
|
||||
const [selectedRole, setSelectedRole] = useState<GetRoleResponse | undefined>(
|
||||
undefined,
|
||||
);
|
||||
|
||||
class SecurityRolesTabNoRouter extends React.Component<SecurityRolesTabProps, SecurityRolesTabState> {
|
||||
state : SecurityRolesTabState = {
|
||||
selectedRole: undefined
|
||||
}
|
||||
|
||||
async componentDidMount() {
|
||||
}
|
||||
const onSelectRow = (id: any) => {
|
||||
setSelectedRole(id);
|
||||
};
|
||||
|
||||
onSelectRow = ( id : any ) =>
|
||||
{
|
||||
this.setState({selectedRole:id});
|
||||
}
|
||||
const onUnselectRow = () => {
|
||||
setSelectedRole(undefined);
|
||||
};
|
||||
|
||||
onUnselectRow =() => {
|
||||
this.setState({ selectedRole: undefined });
|
||||
}
|
||||
const canViewRoleAccess = authentication.hasAccess("ViewRoleAccess");
|
||||
const canViewRoleUsers = authentication.hasAccess("ViewRoleUsers");
|
||||
|
||||
render() {
|
||||
const { selectedRole } = this.state;
|
||||
const canViewRoleAccess = authentication.hasAccess("ViewRoleAccess")
|
||||
const canViewRoleUsers = authentication.hasAccess("ViewRoleUsers")
|
||||
const tabs: JSX.Element[] = [];
|
||||
|
||||
let tabs : JSX.Element[] = [];
|
||||
if (canViewRoleAccess) {
|
||||
tabs.push(
|
||||
<Tab key={1} label={t("RoleAccess")}>
|
||||
<RoleAccessEditor role={selectedRole} />
|
||||
</Tab>,
|
||||
);
|
||||
}
|
||||
if (canViewRoleUsers) {
|
||||
tabs.push(
|
||||
<Tab key={2} label={t("Users")}>
|
||||
<UserRoleEditor role={selectedRole} />
|
||||
</Tab>,
|
||||
);
|
||||
}
|
||||
|
||||
if (canViewRoleAccess) {
|
||||
tabs.push(<Tab key={1} label="Role Access">
|
||||
<RoleAccessEditor role={selectedRole} />
|
||||
</Tab>);
|
||||
}
|
||||
if (canViewRoleUsers) {
|
||||
tabs.push(<Tab key={2} label="Users">
|
||||
<UserRoleEditor role={selectedRole} />
|
||||
</Tab>);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="two-column-grid-1-1">
|
||||
<div>
|
||||
<RolesEditor selectedRole={selectedRole} onSelectRole={this.onSelectRow} onUnselectRole={this.onUnselectRow} />
|
||||
</div>
|
||||
<div>
|
||||
{((selectedRole !== undefined) && (canViewRoleAccess || canViewRoleUsers)) && <HorizontalTabs>
|
||||
{tabs}
|
||||
</HorizontalTabs>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<div className="two-column-grid-1-1">
|
||||
<div>
|
||||
<RolesEditor
|
||||
selectedRole={selectedRole}
|
||||
onSelectRole={onSelectRow}
|
||||
onUnselectRole={onUnselectRow}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
{selectedRole !== undefined &&
|
||||
(canViewRoleAccess || canViewRoleUsers) && (
|
||||
<HorizontalTabs>{tabs}</HorizontalTabs>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const SecurityRolesTab = withRouter(SecurityRolesTabNoRouter);
|
||||
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import React from "react";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import { Paginated } from "../../../../services/Paginated";
|
||||
import { MakeGeneralIdRef } from "../../../../utils/GeneralIdRef";
|
||||
@ -9,107 +10,127 @@ import Button, { ButtonType } from "../../../../components/common/Button";
|
||||
import Loading from "../../../../components/common/Loading";
|
||||
import Permission from "../../../../components/common/Permission";
|
||||
|
||||
interface UserRoleEditorState{
|
||||
loaded: boolean,
|
||||
pagedData : Paginated<RoleUser>,
|
||||
sortColumn : Column<RoleUser>,
|
||||
filters: Map<string, string>;
|
||||
const initialPagedData: Paginated<RoleUser> = {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
};
|
||||
|
||||
interface UserRoleEditorProps extends RouterProps {
|
||||
role: any | undefined;
|
||||
}
|
||||
|
||||
interface UserRoleEditorProps extends RouterProps{
|
||||
role : any | undefined
|
||||
}
|
||||
const UserRoleEditorNoRouter: React.FC<UserRoleEditorProps> = ({
|
||||
role,
|
||||
router,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] =
|
||||
useState<Paginated<RoleUser>>(initialPagedData);
|
||||
const [sortColumn, setSortColumn] = useState<Column<RoleUser>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
() => new Map<string, string>(),
|
||||
);
|
||||
|
||||
class UserRoleEditorNoRouter extends React.Component<UserRoleEditorProps, UserRoleEditorState> {
|
||||
state : UserRoleEditorState = {
|
||||
loaded : false,
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
const roleGeneralIdRef = MakeGeneralIdRef(role?.id, role?.guid);
|
||||
|
||||
const getRoleUsers = async (
|
||||
page: number,
|
||||
pageSize: number,
|
||||
nextSortColumn: Column<RoleUser>,
|
||||
nextFilters: Map<string, string>,
|
||||
) => {
|
||||
const pagedDataResult = await roleService.getRoleUsers(
|
||||
page,
|
||||
pageSize,
|
||||
nextSortColumn.key,
|
||||
nextSortColumn.order === "asc",
|
||||
roleGeneralIdRef,
|
||||
nextFilters,
|
||||
);
|
||||
if (pagedDataResult) {
|
||||
setLoaded(true);
|
||||
setFilters(nextFilters);
|
||||
setPagedData(pagedDataResult);
|
||||
setSortColumn(nextSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
}
|
||||
|
||||
async componentDidUpdate(prevProps: Readonly<UserRoleEditorProps>, prevState: Readonly<UserRoleEditorState>, snapshot?: any) {
|
||||
if (prevProps.role?.id !== this.props.role?.id) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
|
||||
changePage = async(page: number, pageSize : number) =>{
|
||||
const { sortColumn, filters } = this.state;
|
||||
|
||||
await this.getRoleUsers(page, pageSize, sortColumn, filters);
|
||||
}
|
||||
|
||||
onSort = async(sortColumn : Column<RoleUser>) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
|
||||
await this.getRoleUsers(page, pageSize, sortColumn, filters);
|
||||
}
|
||||
|
||||
onSearch = async ( name: string, value: string) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const {sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
|
||||
await this.getRoleUsers(page, pageSize, sortColumn, filters);
|
||||
useEffect(() => {
|
||||
const loadInitial = async () => {
|
||||
await getRoleUsers(
|
||||
initialPagedData.page,
|
||||
initialPagedData.pageSize,
|
||||
sortColumn,
|
||||
new Map<string, string>(),
|
||||
);
|
||||
};
|
||||
|
||||
getRoleUsers = async ( page : number, pageSize : number, sortColumn : Column<RoleUser>, filters : Map<string, string>) => {
|
||||
void loadInitial();
|
||||
}, [role?.id]);
|
||||
|
||||
const { role } = this.props;
|
||||
const roleGeneralIdRef = MakeGeneralIdRef( role?.id, role?.guid);
|
||||
const pagedData = await roleService.getRoleUsers(page, pageSize, sortColumn.key, sortColumn.order === "asc", roleGeneralIdRef, filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
await getRoleUsers(page, pageSize, sortColumn, filters);
|
||||
};
|
||||
|
||||
const onSort = async (nextSortColumn: Column<RoleUser>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
await getRoleUsers(page, pageSize, nextSortColumn, filters);
|
||||
};
|
||||
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const nextFilters = new Map(filters);
|
||||
nextFilters.set(name, value);
|
||||
|
||||
await getRoleUsers(page, pageSize, sortColumn, nextFilters);
|
||||
};
|
||||
|
||||
const onDelete = async (user?: RoleUser) => {
|
||||
const userId = MakeGeneralIdRef(user?.id, user?.guid);
|
||||
|
||||
const response = await roleService.deleteRoleUser(userId, roleGeneralIdRef);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async ( user? : RoleUser) => {
|
||||
const { role } = this.props;
|
||||
const addLink = "editRole/" + role?.id + "/addUserToRole";
|
||||
|
||||
const roleId = MakeGeneralIdRef(role?.id, role?.guid);
|
||||
const userId = MakeGeneralIdRef(user?.id, user?.guid);
|
||||
|
||||
const response = await roleService.deleteRoleUser(userId, roleId);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const {loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
const { role } = this.props;
|
||||
|
||||
const addLink = "editRole/" + role.id + "/addUserToRole";
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddRoleUser">
|
||||
<div>
|
||||
<Button id="btnAddUserToRole" buttonType={ButtonType.primary} to={addLink}>Add</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr/>
|
||||
<UserRolesTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete}/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddRoleUser">
|
||||
<div>
|
||||
<Button
|
||||
id="btnAddUserToRole"
|
||||
buttonType={ButtonType.primary}
|
||||
to={addLink}
|
||||
>
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<UserRolesTable
|
||||
data={pagedData}
|
||||
sortColumn={sortColumn}
|
||||
onChangePage={changePage}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
const UserRoleEditor = withRouter(UserRoleEditorNoRouter);
|
||||
|
||||
|
||||
@ -1,34 +1,61 @@
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
import { RoleUser } from "../serrvices/rolesService";
|
||||
|
||||
class UserRolesTable extends React.Component<PublishedTableProps<RoleUser>> {
|
||||
columns : Column<RoleUser>[] = [
|
||||
{ key: "displayName", label: "Name", order: "asc" }
|
||||
];
|
||||
const UserRolesTable: React.FC<PublishedTableProps<RoleUser>> = (props) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
raiseSort = (sortColumn : Column<RoleUser>) => {
|
||||
this.setState({sortColumn});
|
||||
if ( this.props.onSort !== undefined)
|
||||
this.props.onSort(sortColumn);
|
||||
}
|
||||
const columns: Column<RoleUser>[] = [
|
||||
{ key: "displayName", label: t("Name"), order: "asc" },
|
||||
];
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Domain.UserRole",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
const raiseSort = (sortColumn: Column<RoleUser>) => {
|
||||
if (props.onSort !== undefined) props.onSort(sortColumn);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, selectedRow, onChangePage, onSearch, onSelectRow, onDelete } = this.props;
|
||||
const doDelete = authentication.hasAccess("DeleteRoleUser") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Domain.UserRole",
|
||||
primaryKey: '{"Id":' + item.id + "}",
|
||||
};
|
||||
};
|
||||
|
||||
return <Table data={data} keyName="id" columns={this.columns} sortColumn={sortColumn} selectedRow={selectedRow} onSort={this.raiseSort} onChangePage={onChangePage} onSearch={onSearch} onSelectRow={onSelectRow} onDelete={doDelete} onAuditParams={showAudit}/>;
|
||||
}
|
||||
}
|
||||
|
||||
export default UserRolesTable;
|
||||
const {
|
||||
data,
|
||||
sortColumn,
|
||||
selectedRow,
|
||||
onChangePage,
|
||||
onSearch,
|
||||
onSelectRow,
|
||||
onDelete,
|
||||
} = props;
|
||||
const doDelete = authentication.hasAccess("DeleteRoleUser")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
selectedRow={selectedRow}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onSelectRow={onSelectRow}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default UserRolesTable;
|
||||
|
||||
@ -1,35 +1,55 @@
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
import { GetDomain } from "../serrvices/domainsService";
|
||||
|
||||
class DomainsTable extends React.Component<PublishedTableProps<GetDomain>> {
|
||||
columns : Column<GetDomain>[] = [
|
||||
{ key: "name", label: "Name", order: "asc" }
|
||||
];
|
||||
const DomainsTable: React.FC<PublishedTableProps<GetDomain>> = (props) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
raiseSort = (sortColumn : Column<GetDomain>) => {
|
||||
this.setState({sortColumn});
|
||||
if ( this.props.onSort !== undefined)
|
||||
this.props.onSort(sortColumn);
|
||||
}
|
||||
const columns: Column<GetDomain>[] = [
|
||||
{ key: "name", label: t("Name"), order: "asc" },
|
||||
];
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Domain.Domain",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
const raiseSort = (sortColumn: Column<GetDomain>) => {
|
||||
if (props.onSort !== undefined) props.onSort(sortColumn);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, onChangePage, onSearch, onDelete } = this.props;
|
||||
const editPath = authentication.hasAccess("EditDomain") ? "edit/{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteDomain") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Domain.Domain",
|
||||
primaryKey: '{"Id":' + item.id + "}",
|
||||
};
|
||||
};
|
||||
|
||||
return <Table data={data} keyName="id" columns={this.columns} sortColumn={sortColumn} editPath={editPath} onSort={this.raiseSort} onChangePage={onChangePage} onSearch={onSearch} onDelete={doDelete} onAuditParams={showAudit}/>;
|
||||
}
|
||||
}
|
||||
|
||||
export default DomainsTable;
|
||||
const { data, sortColumn, onChangePage, onSearch, onDelete } = props;
|
||||
const editPath = authentication.hasAccess("EditDomain")
|
||||
? "edit/{0}"
|
||||
: undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteDomain")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default DomainsTable;
|
||||
|
||||
@ -1,97 +1,120 @@
|
||||
import { Component } from 'react';
|
||||
import Button, { ButtonType } from '../../../components/common/Button';
|
||||
import Column from '../../../components/common/columns';
|
||||
import Permission from '../../../components/common/Permission';
|
||||
import { Paginated } from '../../../services/Paginated';
|
||||
import FormsTable from './components/formsTable';
|
||||
import formsService, { GetFormResponse } from './services/formsService';
|
||||
import Loading from '../../../components/common/Loading';
|
||||
import { useState, useEffect } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import Column from "../../../components/common/columns";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
import { Paginated } from "../../../services/Paginated";
|
||||
import FormsTable from "./components/formsTable";
|
||||
import formsService, { GetFormResponse } from "./services/formsService";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
|
||||
interface FormsState{
|
||||
loaded: boolean;
|
||||
pagedData : Paginated<GetFormResponse>,
|
||||
sortColumn : Column<GetFormResponse>,
|
||||
filters: Map<string, string>;
|
||||
}
|
||||
const Forms: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
class Forms extends Component< any, any, FormsState> {
|
||||
state = {
|
||||
loaded: false,
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] = useState<Paginated<GetFormResponse>>({
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
});
|
||||
const [sortColumn, setSortColumn] = useState<Column<GetFormResponse>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
new Map<string, string>(),
|
||||
);
|
||||
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
const data = await formsService.getForms(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setPagedData(data);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
const onSort = async (newSortColumn: Column<GetFormResponse>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const data = await formsService.getForms(
|
||||
page,
|
||||
pageSize,
|
||||
newSortColumn.key,
|
||||
newSortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setPagedData(data);
|
||||
setSortColumn(newSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
changePage = async(page: number, pageSize : number) =>{
|
||||
const { sortColumn, filters } = this.state;
|
||||
|
||||
const pagedData = await formsService.getForms(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const newFilters = new Map(filters);
|
||||
newFilters.set(name, value);
|
||||
|
||||
const data = await formsService.getForms(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
newFilters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setFilters(newFilters);
|
||||
setPagedData(data);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
onSort = async(sortColumn : Column<GetFormResponse>) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
const pagedData = await formsService.getForms(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const onDelete = async (item?: GetFormResponse) => {
|
||||
const response = await formsService.deleteForm(item?.id, item?.guid);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
onSearch = async ( name: string, value: string) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const {sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
useEffect(() => {
|
||||
const { page, pageSize } = pagedData;
|
||||
changePage(page, pageSize);
|
||||
}, [pagedData]);
|
||||
|
||||
const pagedData = await formsService.getForms(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async ( item? : GetFormResponse) => {
|
||||
const response = await formsService.deleteForm( item?.id, item?.guid);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddFormTemplate">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">Add</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr/>
|
||||
<FormsTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete}/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddFormTemplate">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<FormsTable
|
||||
data={pagedData}
|
||||
sortColumn={sortColumn}
|
||||
onChangePage={changePage}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
export default Forms;
|
||||
|
||||
@ -1,36 +1,67 @@
|
||||
import React from "react";
|
||||
import React, { useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
import { GetFormResponse } from "../services/formsService";
|
||||
|
||||
class FormsTable extends React.Component<PublishedTableProps<GetFormResponse>> {
|
||||
columns : Column<GetFormResponse>[] = [
|
||||
{ key: "name", label: "Name", order: "asc" },
|
||||
{ key: "version", label: "Version", order: "asc" }
|
||||
];
|
||||
const FormsTable: React.FC<PublishedTableProps<GetFormResponse>> = ({
|
||||
data,
|
||||
sortColumn,
|
||||
onChangePage,
|
||||
onSearch,
|
||||
onDelete,
|
||||
onSort,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
raiseSort = (sortColumn : Column<GetFormResponse>) => {
|
||||
this.setState({sortColumn});
|
||||
if ( this.props.onSort !== undefined)
|
||||
this.props.onSort(sortColumn);
|
||||
const columns: Column<GetFormResponse>[] = useMemo(
|
||||
() => [
|
||||
{ key: "name", label: t("Name"), order: "asc" },
|
||||
{ key: "version", label: t("Version"), order: "asc" },
|
||||
],
|
||||
[t],
|
||||
);
|
||||
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Forms.FormTemplate",
|
||||
primaryKey: `{"Id":${item.id}}`,
|
||||
};
|
||||
};
|
||||
|
||||
const raiseSort = (sortCol: Column<GetFormResponse>) => {
|
||||
if (onSort !== undefined) {
|
||||
onSort(sortCol);
|
||||
}
|
||||
};
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Forms.FormTemplate",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
const editPath = authentication.hasAccess("EditFormTemplate")
|
||||
? "edit/{0}"
|
||||
: undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteFormTemplate")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, onChangePage, onSearch, onDelete } = this.props;
|
||||
const editPath = authentication.hasAccess("EditFormTemplate") ? "edit/{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteFormTemplate") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
return <Table data={data} keyName="id" columns={this.columns} sortColumn={sortColumn} editPath={editPath} onSort={this.raiseSort} onChangePage={onChangePage} onSearch={onSearch} onDelete={doDelete} onAuditParams={showAudit}/>;
|
||||
}
|
||||
}
|
||||
|
||||
export default FormsTable;
|
||||
export default FormsTable;
|
||||
|
||||
@ -1,168 +1,164 @@
|
||||
import React, { Component } from "react";
|
||||
import React, { useCallback, useEffect, useState } from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { MakeGeneralIdRef } from "../../../utils/GeneralIdRef";
|
||||
import withRouter from "../../../utils/withRouter";
|
||||
import GlossariesTable from "./components/GlossariesTable";
|
||||
import glossariesService, { Glossary, SystemGlossaries } from "./services/glossaryService";
|
||||
import glossariesService, {
|
||||
Glossary,
|
||||
SystemGlossaries,
|
||||
} from "./services/glossaryService";
|
||||
import { GeneralIdRef } from "./../../../utils/GeneralIdRef";
|
||||
import equal from "fast-deep-equal";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
|
||||
interface GlossariesState {
|
||||
loaded: boolean;
|
||||
data: Glossary | undefined;
|
||||
// sortColumn : Column,
|
||||
// filters: Map<string, string>;
|
||||
parentAddress: string;
|
||||
}
|
||||
const Glossaries: React.FC<any> = (props) => {
|
||||
const { t } = useTranslation();
|
||||
const glossaryId = props?.router?.params?.glossaryId;
|
||||
|
||||
class Glossaries extends Component<any, any, GlossariesState> {
|
||||
state: GlossariesState = {
|
||||
loaded: false,
|
||||
data: undefined,
|
||||
// sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
// filters: new Map<string, string>()
|
||||
parentAddress: "",
|
||||
};
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [data, setData] = useState<Glossary | undefined>(undefined);
|
||||
const [parentAddress, setParentAddress] = useState("");
|
||||
|
||||
componentDidMount = () => {
|
||||
this.loadData();
|
||||
};
|
||||
const loadData = useCallback(async () => {
|
||||
setLoaded(false);
|
||||
let parentItem: GeneralIdRef = SystemGlossaries;
|
||||
|
||||
componentDidUpdate(prevProps: Readonly<any>, prevState: Readonly<any>, snapshot?: GlossariesState | undefined): void {
|
||||
if (!equal(this.props?.router?.params?.glossaryId, prevProps?.router?.params?.glossaryId)){
|
||||
this.setState({ loaded: false });
|
||||
this.loadData();
|
||||
}
|
||||
if (glossaryId !== undefined) {
|
||||
parentItem = MakeGeneralIdRef(glossaryId);
|
||||
}
|
||||
|
||||
loadData = async () => {
|
||||
let parentItem: GeneralIdRef = SystemGlossaries;
|
||||
const result = await glossariesService.getGlossaryItem(parentItem);
|
||||
if (result) {
|
||||
let nextParentAddress = "/glossaries";
|
||||
if (
|
||||
result.parent?.guid?.toLowerCase() !==
|
||||
SystemGlossaries.guid?.toLowerCase()
|
||||
) {
|
||||
nextParentAddress += "/" + result.parent?.id;
|
||||
}
|
||||
|
||||
const { glossaryId } = this.props.router.params;
|
||||
|
||||
if (glossaryId !== undefined)
|
||||
parentItem = MakeGeneralIdRef(glossaryId);
|
||||
|
||||
const data = await glossariesService.getGlossaryItem(parentItem);
|
||||
if (data) {
|
||||
let parentAddress = "/glossaries";
|
||||
if (data.parent?.guid?.toLowerCase() !== SystemGlossaries.guid?.toLowerCase())
|
||||
parentAddress += "/" + data.parent?.id;
|
||||
|
||||
this.setState({ loaded: true, data, parentAddress });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async (keyValue: any) => {
|
||||
const response = await glossariesService.deleteGlossaryItem(keyValue.id);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
};
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, data, parentAddress } = this.state;
|
||||
|
||||
const id = data?.id;
|
||||
|
||||
let table = <></>;
|
||||
let upButton = <></>;
|
||||
let editButton = <></>;
|
||||
|
||||
table = (
|
||||
<div>
|
||||
Items
|
||||
<GlossariesTable params={this.props.params} data={data} onDelete={this.onDelete} />
|
||||
</div>
|
||||
);
|
||||
|
||||
if (data?.parent)
|
||||
{
|
||||
if (data.parent?.id !== BigInt(0) ) {
|
||||
upButton = (
|
||||
<Button buttonType={ButtonType.primary} to={parentAddress}>Up</Button>
|
||||
);
|
||||
}
|
||||
|
||||
if (data.parent?.id !== BigInt(0) ) {
|
||||
editButton = (
|
||||
<Button buttonType={ButtonType.primary} to={concatinate( ["/glossaries/edit", id], "/")}>Edit</Button>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const addPath = concatinate( ["/glossaries/add", id], "/");
|
||||
|
||||
let pathBlock = this.createPathBlock();
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<div>
|
||||
<Permission privilegeKey="ViewGlossary">
|
||||
{upButton}
|
||||
</Permission>
|
||||
<Permission privilegeKey="AddGlossary">
|
||||
<Button buttonType={ButtonType.primary} to={addPath}>Add</Button>
|
||||
</Permission>
|
||||
<Permission privilegeKey="EditGlossary">
|
||||
{editButton}
|
||||
</Permission>
|
||||
</div>
|
||||
<hr />
|
||||
{pathBlock}
|
||||
{table}
|
||||
</Loading>
|
||||
);
|
||||
setData(result);
|
||||
setParentAddress(nextParentAddress);
|
||||
setLoaded(true);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
|
||||
createPathBlock = () : JSX.Element | undefined =>
|
||||
{
|
||||
const { data } = this.state;
|
||||
}, [glossaryId]);
|
||||
|
||||
let item : Glossary | undefined = data;
|
||||
const empty = <></>;
|
||||
let pathBlock : JSX.Element = empty;
|
||||
|
||||
while (item !== undefined && (item?.guid.toLowerCase() !== SystemGlossaries.guid && item.id !== BigInt(0)) ){
|
||||
let divider = pathBlock === empty ? <></> : <>/</>;
|
||||
useEffect(() => {
|
||||
loadData();
|
||||
}, [loadData]);
|
||||
|
||||
pathBlock = <><Link to={concatinate( ["/glossaries", item?.id], "/")} >{item?.name}</Link>{divider}{pathBlock}</>;
|
||||
|
||||
item = item?.parent;
|
||||
}
|
||||
|
||||
if (pathBlock === undefined)
|
||||
{
|
||||
pathBlock = <></>;
|
||||
}
|
||||
|
||||
pathBlock = <><Link to="/glossaries">Glossaries</Link>/{pathBlock}</>
|
||||
|
||||
return pathBlock;
|
||||
const onDelete = async (keyValue: any) => {
|
||||
const response = await glossariesService.deleteGlossaryItem(keyValue.id);
|
||||
if (response) {
|
||||
loadData();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const createPathBlock = (): JSX.Element | undefined => {
|
||||
let item: Glossary | undefined = data;
|
||||
const empty = <></>;
|
||||
let pathBlock: JSX.Element = empty;
|
||||
|
||||
while (
|
||||
item !== undefined &&
|
||||
item.guid.toLowerCase() !== SystemGlossaries.guid &&
|
||||
item.id !== BigInt(0)
|
||||
) {
|
||||
const divider = pathBlock === empty ? <></> : <>/</>;
|
||||
|
||||
pathBlock = (
|
||||
<>
|
||||
<Link to={concatinate(["/glossaries", item.id], "/")}>
|
||||
{item.name}
|
||||
</Link>
|
||||
{divider}
|
||||
{pathBlock}
|
||||
</>
|
||||
);
|
||||
|
||||
item = item.parent;
|
||||
}
|
||||
|
||||
if (pathBlock === undefined) {
|
||||
pathBlock = <></>;
|
||||
}
|
||||
|
||||
pathBlock = (
|
||||
<>
|
||||
<Link to="/glossaries">{t("Glossaries")}</Link>/{pathBlock}
|
||||
</>
|
||||
);
|
||||
|
||||
return pathBlock;
|
||||
};
|
||||
|
||||
const id = data?.id;
|
||||
const addPath = concatinate(["/glossaries/add", id], "/");
|
||||
|
||||
const table = (
|
||||
<div>
|
||||
{t("Items")}
|
||||
<GlossariesTable params={props.params} data={data} onDelete={onDelete} />
|
||||
</div>
|
||||
);
|
||||
|
||||
let upButton = <></>;
|
||||
let editButton = <></>;
|
||||
|
||||
if (data?.parent) {
|
||||
if (data.parent.id !== BigInt(0)) {
|
||||
upButton = (
|
||||
<Button buttonType={ButtonType.primary} to={parentAddress}>
|
||||
{t("Up")}
|
||||
</Button>
|
||||
);
|
||||
editButton = (
|
||||
<Button
|
||||
buttonType={ButtonType.primary}
|
||||
to={concatinate(["/glossaries/edit", id], "/")}
|
||||
>
|
||||
{t("Edit")}
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const pathBlock = createPathBlock();
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<div>
|
||||
<Permission privilegeKey="ViewGlossary">{upButton}</Permission>
|
||||
<Permission privilegeKey="AddGlossary">
|
||||
<Button buttonType={ButtonType.primary} to={addPath}>
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</Permission>
|
||||
<Permission privilegeKey="EditGlossary">{editButton}</Permission>
|
||||
</div>
|
||||
<hr />
|
||||
{pathBlock}
|
||||
{table}
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
const HOCGlossaries = withRouter(Glossaries);
|
||||
|
||||
export default HOCGlossaries;
|
||||
|
||||
function concatinate( args : (unknown | undefined)[], seperator : string) : string {
|
||||
let result = ""
|
||||
for( const arg of args)
|
||||
{
|
||||
if (arg !== undefined){
|
||||
if ( result !== "")
|
||||
result += seperator;
|
||||
result += arg;
|
||||
}
|
||||
function concatinate(args: (unknown | undefined)[], seperator: string): string {
|
||||
let result = "";
|
||||
for (const arg of args) {
|
||||
if (arg !== undefined) {
|
||||
if (result !== "") result += seperator;
|
||||
result += arg;
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
return result;
|
||||
}
|
||||
|
||||
|
||||
@ -1,127 +1,140 @@
|
||||
import React from "react";
|
||||
import React, { useState, useEffect, useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table from "../../../../components/common/Table";
|
||||
import { Paginated } from "../../../../services/Paginated";
|
||||
import { Glossary } from "../services/glossaryService";
|
||||
import equal from 'fast-deep-equal';
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
|
||||
export interface GlossaryParams{
|
||||
id : number
|
||||
export interface GlossaryParams {
|
||||
id: number;
|
||||
}
|
||||
|
||||
interface GlossariesTableProps{
|
||||
data? : Glossary,
|
||||
onDelete?: ( keyValue : any ) => void;
|
||||
params : GlossaryParams;
|
||||
interface GlossariesTableProps {
|
||||
data?: Glossary;
|
||||
onDelete?: (keyValue: any) => void;
|
||||
params: GlossaryParams;
|
||||
}
|
||||
|
||||
interface CustomColumn extends Column<customField>{
|
||||
isCustom : boolean;
|
||||
interface CustomColumn extends Column<customField> {
|
||||
isCustom: boolean;
|
||||
}
|
||||
|
||||
interface customField {
|
||||
[key: string]: any
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
class GlossariesTable extends React.Component<GlossariesTableProps> {
|
||||
findValueById = (data: Glossary, key: string) => {
|
||||
if (data.customFieldValues){
|
||||
for( const value of data.customFieldValues ){
|
||||
if (String(value.id.id) === key)
|
||||
{
|
||||
const displayValue : string = value.values[0].displayValue ?? "";
|
||||
const GlossariesTable: React.FC<GlossariesTableProps> = ({
|
||||
data,
|
||||
onDelete,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return displayValue;
|
||||
}
|
||||
}
|
||||
const [columnsList, setColumnsList] = useState<CustomColumn[]>([]);
|
||||
|
||||
const baseColumns: CustomColumn[] = useMemo(
|
||||
() => [
|
||||
{
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
link: "/glossaries/{0}",
|
||||
isCustom: false,
|
||||
},
|
||||
],
|
||||
[t],
|
||||
);
|
||||
|
||||
const findValueById = (glossaryData: Glossary, key: string) => {
|
||||
if (glossaryData.customFieldValues) {
|
||||
for (const value of glossaryData.customFieldValues) {
|
||||
if (String(value.id.id) === key) {
|
||||
const displayValue: string = value.values[0].displayValue ?? "";
|
||||
return displayValue;
|
||||
}
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
};
|
||||
|
||||
return undefined;
|
||||
const paginatedData = useMemo(() => {
|
||||
if (!data) {
|
||||
return {
|
||||
count: 0,
|
||||
page: 1,
|
||||
pageSize: 1,
|
||||
totalPages: 0,
|
||||
data: [],
|
||||
};
|
||||
}
|
||||
|
||||
state = { columnsList: ([] as CustomColumn[]) }
|
||||
const pagedData = data.children.map((x) => {
|
||||
const dataItem: customField = {
|
||||
id: x.id,
|
||||
name: x.name,
|
||||
};
|
||||
|
||||
columns : CustomColumn[] = [
|
||||
{ key: "name", label: "Name", order: "asc", link:"/glossaries/{0}", isCustom: false }
|
||||
];
|
||||
|
||||
PaginatedData = () => {
|
||||
const { data } = this.props;
|
||||
const { columnsList } = this.state;
|
||||
|
||||
const pagedData = data!.children.map( (x) => {
|
||||
let dataItem : customField = {
|
||||
id: x.id,
|
||||
name : x.name }
|
||||
|
||||
for( const column of columnsList) {
|
||||
if (column.isCustom){
|
||||
dataItem[column.key] = this.findValueById(x, column.key);
|
||||
}
|
||||
}
|
||||
|
||||
return dataItem;
|
||||
} )
|
||||
|
||||
let paginated : Paginated<customField> = {
|
||||
count : 1,
|
||||
page: 1,
|
||||
pageSize: 1,
|
||||
totalPages: 1,
|
||||
data : pagedData
|
||||
for (const column of columnsList) {
|
||||
if (column.isCustom) {
|
||||
dataItem[column.key] = findValueById(x, column.key);
|
||||
}
|
||||
|
||||
return paginated;
|
||||
}
|
||||
|
||||
return dataItem;
|
||||
});
|
||||
|
||||
return {
|
||||
count: 1,
|
||||
page: 1,
|
||||
pageSize: 1,
|
||||
totalPages: 1,
|
||||
data: pagedData,
|
||||
};
|
||||
}, [data, columnsList]);
|
||||
|
||||
useEffect(() => {
|
||||
const newColumnsList = [...baseColumns];
|
||||
|
||||
if (data?.childCustomFieldDefinition) {
|
||||
for (const customfield of data.childCustomFieldDefinition) {
|
||||
newColumnsList.push({
|
||||
key: String(customfield.id),
|
||||
label: customfield.name,
|
||||
order: "asc",
|
||||
isCustom: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount = () => {
|
||||
this.CompileColumns();
|
||||
}
|
||||
setColumnsList(newColumnsList);
|
||||
}, [baseColumns, data]);
|
||||
|
||||
componentDidUpdate(prevProps: Readonly<GlossariesTableProps>, prevState: Readonly<{}>, snapshot?: any): void {
|
||||
if(!equal(this.props.data, prevProps.data))
|
||||
this.CompileColumns();
|
||||
}
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Glossaries.Glossary",
|
||||
primaryKey: `{"Id":${item.id}}`,
|
||||
};
|
||||
};
|
||||
|
||||
CompileColumns = () => {
|
||||
const { data } = this.props;
|
||||
const editPath = authentication.hasAccess("EditGlossary")
|
||||
? "/glossaries/edit/{0}"
|
||||
: undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteGlossary")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
let columnsList = [...this.columns];
|
||||
return (
|
||||
<Table
|
||||
data={paginatedData}
|
||||
keyName="id"
|
||||
columns={columnsList}
|
||||
editPath={editPath}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
if (data?.childCustomFieldDefinition)
|
||||
{
|
||||
for( const customfield of data?.childCustomFieldDefinition)
|
||||
{
|
||||
columnsList.push({
|
||||
key: String(customfield.id),
|
||||
label: customfield.name,
|
||||
order: "asc",
|
||||
isCustom: true
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
this.setState({columnsList});
|
||||
}
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Glossaries.Glossary",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
const { onDelete } = this.props;
|
||||
const { columnsList } = this.state;
|
||||
const editPath = authentication.hasAccess("EditGlossary") ? "/glossaries/edit/{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteGlossary") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
|
||||
const paginated = this.PaginatedData();
|
||||
return <Table data={paginated} keyName="id" columns={columnsList} editPath={editPath} onDelete={doDelete} onAuditParams={showAudit}/>;
|
||||
}
|
||||
}
|
||||
|
||||
export default GlossariesTable;
|
||||
export default GlossariesTable;
|
||||
|
||||
@ -1,97 +1,123 @@
|
||||
import { Component } from 'react';
|
||||
import Button, { ButtonType } from '../../../components/common/Button';
|
||||
import Column from '../../../components/common/columns';
|
||||
import Permission from '../../../components/common/Permission';
|
||||
import { Paginated } from '../../../services/Paginated';
|
||||
import OrganisationsTable from './components/OrganisationsTable';
|
||||
import organisationsService, { ReadOrganisation } from './services/organisationsService';
|
||||
import Loading from '../../../components/common/Loading';
|
||||
import { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import Column from "../../../components/common/columns";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
import { Paginated } from "../../../services/Paginated";
|
||||
import OrganisationsTable from "./components/OrganisationsTable";
|
||||
import organisationsService, {
|
||||
ReadOrganisation,
|
||||
} from "./services/organisationsService";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
|
||||
interface OrganisationsState{
|
||||
loaded: boolean,
|
||||
pagedData : Paginated<ReadOrganisation>,
|
||||
sortColumn : Column<ReadOrganisation>,
|
||||
filters: Map<string, string>;
|
||||
}
|
||||
const Organisations: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] = useState<Paginated<ReadOrganisation>>({
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
});
|
||||
const [sortColumn, setSortColumn] = useState<Column<ReadOrganisation>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
new Map<string, string>(),
|
||||
);
|
||||
|
||||
class Organisations extends Component<any, any, OrganisationsState> {
|
||||
state = {
|
||||
loaded : false,
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: []
|
||||
},
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
const data = await organisationsService.getOrganisations(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setPagedData(data);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const onSort = async (newSortColumn: Column<ReadOrganisation>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const data = await organisationsService.getOrganisations(
|
||||
page,
|
||||
pageSize,
|
||||
newSortColumn.key,
|
||||
newSortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setPagedData(data);
|
||||
setSortColumn(newSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
changePage = async (page: number, pageSize: number) => {
|
||||
const { sortColumn, filters } = this.state;
|
||||
|
||||
const pagedData = await organisationsService.getOrganisations(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const newFilters = new Map(filters);
|
||||
newFilters.set(name, value);
|
||||
|
||||
const data = await organisationsService.getOrganisations(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
newFilters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setFilters(newFilters);
|
||||
setPagedData(data);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
onSort = async (sortColumn: Column<ReadOrganisation>) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
const pagedData = await organisationsService.getOrganisations(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
|
||||
if (pagedData) {
|
||||
this.setState({loaded: true, pagedData, sortColumn});
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const onDelete = async (item?: ReadOrganisation) => {
|
||||
const response = await organisationsService.deleteOrganisation(
|
||||
item?.id,
|
||||
item?.guid,
|
||||
);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
useEffect(() => {
|
||||
const { page, pageSize } = pagedData;
|
||||
changePage(page, pageSize);
|
||||
});
|
||||
|
||||
const pagedData = await organisationsService.getOrganisations(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState( { loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async (item?: ReadOrganisation) => {
|
||||
const response = await organisationsService.deleteOrganisation(item?.id, item?.guid);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddOrganisation">
|
||||
<Button buttonType={ButtonType.primary} to="add">Add</Button>
|
||||
</Permission>
|
||||
<hr/>
|
||||
<OrganisationsTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete}/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddOrganisation">
|
||||
<Button buttonType={ButtonType.primary} to="add">
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</Permission>
|
||||
<hr />
|
||||
<OrganisationsTable
|
||||
data={pagedData}
|
||||
sortColumn={sortColumn}
|
||||
onChangePage={changePage}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
export default Organisations;
|
||||
|
||||
@ -1,51 +1,77 @@
|
||||
import React from "react";
|
||||
import React, { useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
import { ReadOrganisation } from "../services/organisationsService";
|
||||
|
||||
class OrganisationsTable extends React.Component<PublishedTableProps<ReadOrganisation>> {
|
||||
canViewSite = authentication.hasAccess("ViewSite");
|
||||
const OrganisationsTable: React.FC<PublishedTableProps<ReadOrganisation>> = ({
|
||||
data,
|
||||
sortColumn,
|
||||
onChangePage,
|
||||
onSearch,
|
||||
onDelete,
|
||||
onSort,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const canViewSite = authentication.hasAccess("ViewSite");
|
||||
|
||||
columns: Column<ReadOrganisation>[] = [
|
||||
{ key: "name", label: "Name", order: "asc", link: this.canViewSite ? "/site/{0}" : undefined },
|
||||
{ key: "address", label: "Address", order: "asc" },
|
||||
{ key: "status", label: "Status", order: "asc", searchable: false },
|
||||
];
|
||||
const columns: Column<ReadOrganisation>[] = useMemo(
|
||||
() => [
|
||||
{
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
link: canViewSite ? "/site/{0}" : undefined,
|
||||
},
|
||||
{ key: "address", label: t("Address"), order: "asc" },
|
||||
{
|
||||
key: "status",
|
||||
label: t("Status"),
|
||||
order: "asc",
|
||||
searchable: false,
|
||||
},
|
||||
],
|
||||
[t, canViewSite],
|
||||
);
|
||||
|
||||
raiseSort = (sortColumn: Column<ReadOrganisation>) => {
|
||||
this.setState({ sortColumn });
|
||||
if (this.props.onSort !== undefined) this.props.onSort(sortColumn);
|
||||
const raiseSort = (sortCol: Column<ReadOrganisation>) => {
|
||||
if (onSort !== undefined) onSort(sortCol);
|
||||
};
|
||||
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Printer.Organisation",
|
||||
primaryKey: `{"Id":${item.id}}`,
|
||||
};
|
||||
};
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Printer.Organisation",
|
||||
primaryKey: '{"Id":' + item.id + "}",
|
||||
};
|
||||
};
|
||||
const editPath = authentication.hasAccess("EditOrganisation")
|
||||
? "{0}"
|
||||
: undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteOrganisation")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, onChangePage, onSearch, onDelete } = this.props;
|
||||
const editPath = authentication.hasAccess("EditOrganisation") ? "{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteOrganisation") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={this.columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={this.raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default OrganisationsTable;
|
||||
|
||||
@ -1,35 +1,62 @@
|
||||
import React from "react";
|
||||
import React, { useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
import { ReadSequence } from "../services/sequenceService";
|
||||
|
||||
class SequenceTable extends React.Component<PublishedTableProps<ReadSequence>> {
|
||||
columns : Column<ReadSequence>[] = [
|
||||
{ key: "name", label: "Name", order: "asc" }
|
||||
];
|
||||
const SequenceTable: React.FC<PublishedTableProps<ReadSequence>> = ({
|
||||
data,
|
||||
sortColumn,
|
||||
onChangePage,
|
||||
onSearch,
|
||||
onDelete,
|
||||
onSort,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
raiseSort = (sortColumn : Column<ReadSequence>) => {
|
||||
this.setState({sortColumn});
|
||||
if ( this.props.onSort !== undefined)
|
||||
this.props.onSort(sortColumn);
|
||||
}
|
||||
const columns: Column<ReadSequence>[] = useMemo(
|
||||
() => [{ key: "name", label: t("Name"), order: "asc" }],
|
||||
[t],
|
||||
);
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName : "e_suite.Database.Core.Tables.Sequences.Sequence",
|
||||
primaryKey : "{\"Id\":"+item.id+"}"
|
||||
}
|
||||
}
|
||||
const raiseSort = (sortCol: Column<ReadSequence>) => {
|
||||
if (onSort !== undefined) onSort(sortCol);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, onChangePage, onSearch, onDelete } = this.props;
|
||||
const editPath = authentication.hasAccess("EditSequence") ? "edit/{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteSequence") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Sequences.Sequence",
|
||||
primaryKey: `{"Id":${item.id}}`,
|
||||
};
|
||||
};
|
||||
|
||||
return <Table data={data} keyName="id" columns={this.columns} sortColumn={sortColumn} editPath={editPath} onSort={this.raiseSort} onChangePage={onChangePage} onSearch={onSearch} onDelete={doDelete} onAuditParams={showAudit }/>;
|
||||
}
|
||||
}
|
||||
|
||||
export default SequenceTable;
|
||||
const editPath = authentication.hasAccess("EditSequence")
|
||||
? "edit/{0}"
|
||||
: undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteSequence")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default SequenceTable;
|
||||
|
||||
@ -1,99 +1,119 @@
|
||||
import React, { Component } from 'react';
|
||||
import sequenceService, { ReadSequence } from './services/sequenceService';
|
||||
import SequenceTable from './components/squenceTable';
|
||||
import Column from '../../../components/common/columns';
|
||||
import { Paginated } from '../../../services/Paginated';
|
||||
import Button, { ButtonType } from '../../../components/common/Button';
|
||||
import Loading from '../../../components/common/Loading';
|
||||
import Permission from '../../../components/common/Permission';
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import sequenceService, { ReadSequence } from "./services/sequenceService";
|
||||
import SequenceTable from "./components/squenceTable";
|
||||
import Column from "../../../components/common/columns";
|
||||
import { Paginated } from "../../../services/Paginated";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
|
||||
interface sequenceState {
|
||||
loaded: boolean,
|
||||
pagedData: Paginated<ReadSequence>,
|
||||
sortColumn: Column<ReadSequence>,
|
||||
filters: Map<string, string>;
|
||||
}
|
||||
const Sequence: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
const [loaded, setLoaded] = useState(false);
|
||||
const [pagedData, setPagedData] = useState<Paginated<ReadSequence>>({
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [],
|
||||
});
|
||||
const [sortColumn, setSortColumn] = useState<Column<ReadSequence>>({
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
});
|
||||
const [filters, setFilters] = useState<Map<string, string>>(
|
||||
new Map<string, string>(),
|
||||
);
|
||||
|
||||
class Sequence extends Component<any, any, sequenceState> {
|
||||
state = {
|
||||
loaded: false,
|
||||
pagedData: {
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: []
|
||||
},
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
const changePage = async (page: number, pageSize: number) => {
|
||||
const data = await sequenceService.getSequences(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setPagedData(data);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
|
||||
await this.changePage(page, pageSize);
|
||||
const onSort = async (newSortColumn: Column<ReadSequence>) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const data = await sequenceService.getSequences(
|
||||
page,
|
||||
pageSize,
|
||||
newSortColumn.key,
|
||||
newSortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setPagedData(data);
|
||||
setSortColumn(newSortColumn);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
changePage = async (page: number, pageSize: number) => {
|
||||
const { sortColumn, filters } = this.state;
|
||||
const onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = pagedData;
|
||||
const newFilters = new Map(filters);
|
||||
newFilters.set(name, value);
|
||||
|
||||
const pagedData = await sequenceService.getSequences(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const data = await sequenceService.getSequences(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
newFilters,
|
||||
);
|
||||
if (data) {
|
||||
setLoaded(true);
|
||||
setFilters(newFilters);
|
||||
setPagedData(data);
|
||||
} else {
|
||||
setLoaded(false);
|
||||
}
|
||||
};
|
||||
|
||||
onSort = async (sortColumn: Column<ReadSequence>) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
const pagedData = await sequenceService.getSequences(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const onDelete = async (item?: ReadSequence) => {
|
||||
const response = await sequenceService.deleteSequence(item?.id, item?.guid);
|
||||
if (response) {
|
||||
await changePage(pagedData.page, pagedData.pageSize);
|
||||
}
|
||||
};
|
||||
|
||||
onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
useEffect(() => {
|
||||
const { page, pageSize } = pagedData;
|
||||
changePage(page, pageSize);
|
||||
}, []);
|
||||
|
||||
const pagedData = await sequenceService.getSequences(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async (item?: ReadSequence) => {
|
||||
const response = await sequenceService.deleteSequence(item?.id, item?.guid);
|
||||
if (response) {
|
||||
this.componentDidMount();
|
||||
}
|
||||
}
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddSequence">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">Add</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<SequenceTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete} />
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddSequence">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">
|
||||
{t("Add")}
|
||||
</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<SequenceTable
|
||||
data={pagedData}
|
||||
sortColumn={sortColumn}
|
||||
onChangePage={changePage}
|
||||
onSort={onSort}
|
||||
onSearch={onSearch}
|
||||
onDelete={onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
};
|
||||
|
||||
export default Sequence;
|
||||
|
||||
@ -1,107 +1,127 @@
|
||||
import React, { Component } from 'react';
|
||||
import Column from '../../../components/common/columns';
|
||||
import { Paginated } from '../../../services/Paginated';
|
||||
import Button, { ButtonType } from '../../../components/common/Button';
|
||||
import withRouter from '../../../utils/withRouter';
|
||||
import siteService, { ReadSite } from './services/sitessService';
|
||||
import SitesTable from './components/SitesTable';
|
||||
import Loading from '../../../components/common/Loading';
|
||||
import Permission from '../../../components/common/Permission';
|
||||
import React, { Component } from "react";
|
||||
import Column from "../../../components/common/columns";
|
||||
import { Paginated } from "../../../services/Paginated";
|
||||
import Button, { ButtonType } from "../../../components/common/Button";
|
||||
import withRouter from "../../../utils/withRouter";
|
||||
import siteService, { ReadSite } from "./services/sitessService";
|
||||
import SitesTable from "./components/SitesTable";
|
||||
import Loading from "../../../components/common/Loading";
|
||||
import Permission from "../../../components/common/Permission";
|
||||
|
||||
interface SitesState{
|
||||
loaded: boolean;
|
||||
pagedData : Paginated<ReadSite>,
|
||||
sortColumn : Column<ReadSite>,
|
||||
filters: Map<string, string>;
|
||||
interface SitesState {
|
||||
loaded: boolean;
|
||||
pagedData: Paginated<ReadSite>;
|
||||
sortColumn: Column<ReadSite>;
|
||||
filters: Map<string, string>;
|
||||
}
|
||||
|
||||
class LocSites extends Component< any, any, SitesState> {
|
||||
state = {
|
||||
loaded: false,
|
||||
pagedData : { page: 1,
|
||||
pageSize : 10,
|
||||
count: 0,
|
||||
totalPages: 1,
|
||||
data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>()
|
||||
class LocSites extends Component<any, any, SitesState> {
|
||||
state = {
|
||||
loaded: false,
|
||||
pagedData: { page: 1, pageSize: 10, count: 0, totalPages: 1, data: [] },
|
||||
sortColumn: { key: "name", label: "Name", order: "asc" },
|
||||
filters: new Map<string, string>(),
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
await this.changePage(page, pageSize);
|
||||
};
|
||||
|
||||
changePage = async (page: number, pageSize: number) => {
|
||||
const { sortColumn, filters } = this.state;
|
||||
const { organisationId } = this.props.router.params;
|
||||
|
||||
filters.set("organisationId", organisationId);
|
||||
|
||||
const pagedData = await siteService.getSites(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, filters });
|
||||
} else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
componentDidMount = async () => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
await this.changePage(page, pageSize);
|
||||
onSort = async (sortColumn: Column<ReadSite>) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
|
||||
const { organisationId } = this.props.router.params;
|
||||
filters.set("organisationId", organisationId);
|
||||
|
||||
const pagedData = await siteService.getSites(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
} else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
changePage = async(page: number, pageSize : number) =>{
|
||||
const { sortColumn, filters } = this.state;
|
||||
const { organisationId } = this.props.router.params;
|
||||
onSearch = async (name: string, value: string) => {
|
||||
const { page, pageSize } = this.state.pagedData;
|
||||
const { sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
|
||||
filters.set("organisationId", organisationId);
|
||||
const { organisationId } = this.props.router.params;
|
||||
filters.set("organisationId", organisationId);
|
||||
|
||||
const pagedData = await siteService.getSites(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, filters });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
const pagedData = await siteService.getSites(
|
||||
page,
|
||||
pageSize,
|
||||
sortColumn.key,
|
||||
sortColumn.order === "asc",
|
||||
filters,
|
||||
);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
} else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
onSort = async(sortColumn : Column<ReadSite>) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const { filters } = this.state;
|
||||
onDelete = async (item?: ReadSite) => {
|
||||
await siteService.deleteSite(item?.id, item?.guid);
|
||||
|
||||
const { organisationId } = this.props.router.params;
|
||||
filters.set("organisationId", organisationId);
|
||||
this.componentDidMount();
|
||||
};
|
||||
|
||||
const pagedData = await siteService.getSites(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, pagedData, sortColumn });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
}
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
onSearch = async ( name: string, value: string) => {
|
||||
const {page, pageSize } = this.state.pagedData;
|
||||
const {sortColumn, filters } = this.state;
|
||||
filters.set(name, value);
|
||||
|
||||
const { organisationId } = this.props.router.params;
|
||||
filters.set("organisationId", organisationId);
|
||||
|
||||
const pagedData = await siteService.getSites(page, pageSize, sortColumn.key, sortColumn.order === "asc", filters);
|
||||
if (pagedData) {
|
||||
this.setState({ loaded: true, filters, pagedData });
|
||||
}
|
||||
else {
|
||||
this.setState({ loaded: false });
|
||||
}
|
||||
};
|
||||
|
||||
onDelete = async ( item? : ReadSite) => {
|
||||
await siteService.deleteSite( item?.id, item?.guid);
|
||||
|
||||
this.componentDidMount();
|
||||
}
|
||||
|
||||
render(): JSX.Element {
|
||||
const { loaded, pagedData, sortColumn } = this.state;
|
||||
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddSite">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">Add</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr/>
|
||||
<SitesTable data={pagedData} sortColumn={sortColumn} onChangePage={this.changePage} onSort={this.onSort} onSearch={this.onSearch} onDelete={this.onDelete}/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
};
|
||||
return (
|
||||
<Loading loaded={loaded}>
|
||||
<Permission privilegeKey="AddSite">
|
||||
<div>
|
||||
<Button buttonType={ButtonType.primary} to="add">
|
||||
Add
|
||||
</Button>
|
||||
</div>
|
||||
</Permission>
|
||||
<hr />
|
||||
<SitesTable
|
||||
data={pagedData}
|
||||
sortColumn={sortColumn}
|
||||
onChangePage={this.changePage}
|
||||
onSort={this.onSort}
|
||||
onSearch={this.onSearch}
|
||||
onDelete={this.onDelete}
|
||||
/>
|
||||
</Loading>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const Sites = withRouter(LocSites);
|
||||
|
||||
|
||||
@ -1,65 +1,78 @@
|
||||
import React from "react";
|
||||
import React, { useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Column from "../../../../components/common/columns";
|
||||
import Table, { PublishedTableProps } from "../../../../components/common/Table";
|
||||
import Table, {
|
||||
PublishedTableProps,
|
||||
} from "../../../../components/common/Table";
|
||||
import { ReadSite } from "../services/sitessService";
|
||||
import Button, { ButtonType } from "../../../../components/common/Button";
|
||||
import authentication from "../../../frame/services/authenticationService";
|
||||
|
||||
class SitesTable extends React.Component<PublishedTableProps<ReadSite>> {
|
||||
canViewSpecification = authentication.hasAccess("ViewSpecification");
|
||||
const SitesTable: React.FC<PublishedTableProps<ReadSite>> = ({
|
||||
data,
|
||||
sortColumn,
|
||||
onChangePage,
|
||||
onSearch,
|
||||
onDelete,
|
||||
onSort,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
const canViewSpecification = authentication.hasAccess("ViewSpecification");
|
||||
|
||||
columns: Column<ReadSite>[] = [
|
||||
{
|
||||
key: "name",
|
||||
label: "Name",
|
||||
order: "asc",
|
||||
content: (item) => {
|
||||
return (
|
||||
<>
|
||||
<Button buttonType={ButtonType.link} to={"/specifications/" + item.organisationId.id + "/" + item.id}>
|
||||
{item.name}
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
},
|
||||
},
|
||||
{ key: "address", label: "Address", order: "asc" },
|
||||
{ key: "status", label: "Status", order: "asc" },
|
||||
];
|
||||
const columns: Column<ReadSite>[] = useMemo(
|
||||
() => [
|
||||
{
|
||||
key: "name",
|
||||
label: t("Name"),
|
||||
order: "asc",
|
||||
content: (item) => (
|
||||
<Button
|
||||
buttonType={ButtonType.link}
|
||||
to={`/specifications/${item.organisationId.id}/${item.id}`}
|
||||
>
|
||||
{item.name}
|
||||
</Button>
|
||||
),
|
||||
},
|
||||
{ key: "address", label: t("Address"), order: "asc" },
|
||||
{ key: "status", label: t("Status"), order: "asc" },
|
||||
],
|
||||
[t, canViewSpecification],
|
||||
);
|
||||
|
||||
raiseSort = (sortColumn: Column<ReadSite>) => {
|
||||
this.setState({ sortColumn });
|
||||
if (this.props.onSort !== undefined) this.props.onSort(sortColumn);
|
||||
const raiseSort = (sortCol: Column<ReadSite>) => {
|
||||
if (onSort !== undefined) onSort(sortCol);
|
||||
};
|
||||
|
||||
const handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Printer.Site",
|
||||
primaryKey: `{"Id":${item.id}}`,
|
||||
};
|
||||
};
|
||||
|
||||
handleAuditParams = (item: any) => {
|
||||
return {
|
||||
entityName: "e_suite.Database.Core.Tables.Printer.Site",
|
||||
primaryKey: '{"Id":' + item.id + "}",
|
||||
};
|
||||
};
|
||||
const editPath = authentication.hasAccess("EditSite") ? "{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteSite")
|
||||
? onDelete
|
||||
: undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog")
|
||||
? handleAuditParams
|
||||
: undefined;
|
||||
|
||||
render() {
|
||||
const { data, sortColumn, onChangePage, onSearch, onDelete } = this.props;
|
||||
const editPath = authentication.hasAccess("EditSite") ? "{0}" : undefined;
|
||||
const doDelete = authentication.hasAccess("DeleteSite") ? onDelete : undefined;
|
||||
const showAudit = authentication.hasAccess("ViewAuditLog") ? this.handleAuditParams : undefined;
|
||||
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={this.columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={this.raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Table
|
||||
data={data}
|
||||
keyName="id"
|
||||
columns={columns}
|
||||
sortColumn={sortColumn}
|
||||
editPath={editPath}
|
||||
onSort={raiseSort}
|
||||
onChangePage={onChangePage}
|
||||
onSearch={onSearch}
|
||||
onDelete={doDelete}
|
||||
onAuditParams={showAudit}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default SitesTable;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user