refactor: departments (#1205)

Reviewed-on: daoyoucloud/tachybase#1205
This commit is contained in:
sealday 2024-06-18 17:43:33 +08:00
parent c582454c98
commit 3712280e89
43 changed files with 635 additions and 749 deletions

View File

@ -1,11 +1,10 @@
import React, { useContext, useRef } from 'react'; import React, { useContext, useRef } from 'react';
import { SchemaComponent, useAPIClient, useResourceActionContext } from '@tachybase/client'; import { SchemaComponent, useAPIClient, useResourceActionContext } from '@tachybase/client';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { k } from '../others/k';
import { schemaAddMembers } from '../schema/addMembers.schema'; import { schemaAddMembers } from '../schema/addMembers.schema';
export const AddMembersNnt = () => { export const AddMembers = () => {
const { department, useAddMembersAction, handleSelect } = useAction(); const { department, useAddMembersAction, handleSelect } = useAction();
return ( return (
<SchemaComponent <SchemaComponent
@ -20,28 +19,15 @@ export const AddMembersNnt = () => {
}; };
function useAction() { function useAction() {
const { department } = useContext(contextK); const { department } = useContext(DepartmentsContext);
const { refresh } = useResourceActionContext(); const { refresh } = useResourceActionContext();
const ref = useRef([]); const ref = useRef([]);
const api = useAPIClient(); const api = useAPIClient();
const useAddMembersAction = () => ({ const useAddMembersAction = () => ({
run() {
return k(this, null, function* () {
const x = ref.current;
x != null &&
x.length &&
(yield api.resource('departments.members', department.id).add({ values: x }), (ref.current = []), refresh());
});
},
});
const useAddMembersAction2 = () => ({
async run() { async run() {
const x = ref.current; const x = ref.current;
if (x?.length > 0) { if (x?.length) {
await api.resource('departments.members', department.id).add({ values: x }); await api.resource('departments.members', department.id).add({ values: x }), (ref.current = []);
ref.current = [];
refresh(); refresh();
} }
}, },

View File

@ -5,15 +5,15 @@ import { UserOutlined } from '@ant-design/icons';
import { Button, Divider, Row, theme } from 'antd'; import { Button, Divider, Row, theme } from 'antd';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { ContextNProvider } from '../context/contextN'; import { DepartmentsExpandedContextProvider } from '../context/DepartmentsExpandedContext';
import { useCreateDepartment } from '../hooks/useCreateDepartment'; import { useCreateDepartment } from '../hooks/useCreateDepartment';
import { useHooksG } from '../hooks/useHooksG'; import { useDepTree2 } from '../hooks/useDepTree2';
import { useUpdateDepartmentLe } from '../hooks/useUpdateDepartmentLe'; import { useUpdateDepartment } from '../hooks/useUpdateDepartment';
import { ComponentSe } from './ComponentSe'; import { ComponentSe } from './ComponentSe';
import { ComponentX } from './ComponentX'; import { ComponentX } from './ComponentX';
import { ComponentXxe } from './ComponentXxe';
import { DepartmentOwnersField } from './DepartmentOwnersField'; import { DepartmentOwnersField } from './DepartmentOwnersField';
import { NewDepartment } from './NewDepartment';
interface drawerState { interface drawerState {
node?: object; node?: object;
@ -21,14 +21,14 @@ interface drawerState {
} }
export const ComponentEEE = () => { export const ComponentEEE = () => {
const { t: tval } = useTranslation(); const { t } = useTranslation();
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [drawer, setDrawer] = useState<drawerState>({}); const [drawer, setDrawer] = useState<drawerState>({});
const { department, setDepartment } = useContext(contextK); const { department, setDepartment } = useContext(DepartmentsContext);
const { token } = theme.useToken(); const { token } = theme.useToken();
const m = useHooksG({ const m = useDepTree2({
label: ({ node }) => <ComponentX.Item node={node} setVisible={setVisible} setDrawer={setDrawer} />, label: ({ node }) => <ComponentX.Item node={node} setVisible={setVisible} setDrawer={setDrawer} />,
}); });
@ -36,10 +36,10 @@ export const ComponentEEE = () => {
<SchemaComponentOptions <SchemaComponentOptions
scope={{ scope={{
useCreateDepartment, useCreateDepartment,
useUpdateDepartment: useUpdateDepartmentLe, useUpdateDepartment,
}} }}
> >
<ContextNProvider value={m}> <DepartmentsExpandedContextProvider value={m}>
<Row> <Row>
<ComponentSe /> <ComponentSe />
<Button <Button
@ -55,9 +55,9 @@ export const ComponentEEE = () => {
}} }}
block={true} block={true}
> >
{tval('All users')} {t('All users')}
</Button> </Button>
<ComponentXxe /> <NewDepartment />
</Row> </Row>
<Divider style={{ margin: '12px 0' }} /> <Divider style={{ margin: '12px 0' }} />
<ComponentX /> <ComponentX />
@ -70,7 +70,7 @@ export const ComponentEEE = () => {
<RecordProvider record={drawer.node || {}}> <RecordProvider record={drawer.node || {}}>
<SchemaComponent <SchemaComponent
scope={{ scope={{
t: tval, t,
}} }}
components={{ components={{
DepartmentOwnersField, DepartmentOwnersField,
@ -79,48 +79,7 @@ export const ComponentEEE = () => {
/> />
</RecordProvider> </RecordProvider>
</ActionContextProvider> </ActionContextProvider>
</ContextNProvider> </DepartmentsExpandedContextProvider>
</SchemaComponentOptions> </SchemaComponentOptions>
); );
// return jsx(SchemaComponentOptions, {
// scope: {
// useCreateDepartment: useCreateDepartment,
// useUpdateDepartment: useUpdateDepartmentLe,
// },
// children: jsxs(contextN.Provider, {
// value: m,
// children: [
// jsxs(Row, {
// children: [
// jsx(ComponentSe, {}),
// jsx(Button, {
// type: 'text',
// icon: jsx(UserOutlined, {}),
// style: { textAlign: 'left', marginBottom: '5px', background: c ? '' : x.colorBgTextHover },
// onClick: () => {
// i(null);
// },
// block: true,
// children: e('All users'),
// }),
// jsx(ComponentXxe, {}),
// ],
// }),
// jsx(Divider, { style: { margin: '12px 0' } }),
// jsx(ComponentX, {}),
// jsx(ActionContextProvider, {
// value: { visible: t, setVisible: o },
// children: jsx(RecordProvider, {
// record: a.node || {},
// children: jsx(SchemaComponent, {
// scope: { t: e },
// components: { DepartmentOwnersField: DepartmentOwnersField },
// schema: a.schema || {},
// }),
// }),
// }),
// ],
// }),
// });
}; };

View File

@ -4,7 +4,7 @@ import { SchemaComponent, useResourceActionContext } from '@tachybase/client';
import { jsx, jsxs } from 'react/jsx-runtime'; import { jsx, jsxs } from 'react/jsx-runtime';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { useBulkRemoveMembersAction } from '../hooks/useBulkRemoveMembersAction'; import { useBulkRemoveMembersAction } from '../hooks/useBulkRemoveMembersAction';
import { useMembersDataSource } from '../hooks/useMembersDataSource'; import { useMembersDataSource } from '../hooks/useMembersDataSource';
import { useRemoveMemberAction } from '../hooks/useRemoveMemberAction'; import { useRemoveMemberAction } from '../hooks/useRemoveMemberAction';
@ -13,14 +13,14 @@ import { getSchemaHe } from '../schema/getSchemaHe';
import { schemaWe } from '../schema/schemaWe'; import { schemaWe } from '../schema/schemaWe';
import { schemaZe } from '../schema/schemaZe'; import { schemaZe } from '../schema/schemaZe';
import { useFilterActionPropsZ } from '../scopes/useFilterActionPropsZ'; import { useFilterActionPropsZ } from '../scopes/useFilterActionPropsZ';
import { AddMembersNnt } from './AddMembersNnt'; import { AddMembers } from './AddMembers';
import { DepartmentFieldYe } from './DepartmentFieldYe'; import { DepartmentFieldYe } from './DepartmentFieldYe';
import { IsOwnerFieldQe } from './IsOwnerFieldQe'; import { IsOwnerFieldQe } from './IsOwnerFieldQe';
import { UserDepartmentsFieldOot } from './UserDepartmentsFieldOot'; import { UserDepartmentsFieldOot } from './UserDepartmentsFieldOot';
export const ComponentIit = () => { export const ComponentIit = () => {
const { t: tval } = useTranslation(); const { t: tval } = useTranslation();
const { department, user } = useContext(contextK); const { department, user } = useContext(DepartmentsContext);
const { data, setState } = useResourceActionContext(); const { data, setState } = useResourceActionContext();
const MemberActions = () => (department ? <SchemaComponent schema={schemaZe} /> : null); const MemberActions = () => (department ? <SchemaComponent schema={schemaZe} /> : null);
@ -55,7 +55,7 @@ export const ComponentIit = () => {
}} }}
components={{ components={{
MemberActions: MemberActions, MemberActions: MemberActions,
AddMembers: AddMembersNnt, AddMembers: AddMembers,
RowRemoveAction: RowRemoveAction, RowRemoveAction: RowRemoveAction,
DepartmentField: DepartmentFieldYe, DepartmentField: DepartmentFieldYe,
IsOwnerField: IsOwnerFieldQe, IsOwnerField: IsOwnerFieldQe,

View File

@ -1,13 +1,13 @@
import { useContext, useState } from 'react'; import React, { useContext, useState } from 'react';
import { createStyles, useAPIClient, useRequest } from '@tachybase/client'; import { createStyles, useAPIClient, useRequest } from '@tachybase/client';
import { Button, Dropdown, Empty, Input, theme } from 'antd'; import { Button, Dropdown, Empty, Input, theme } from 'antd';
import { jsx, jsxs } from 'react/jsx-runtime'; import { jsx, jsxs } from 'react/jsx-runtime';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
const createStyleAe = createStyles(({ css }) => ({ const useStyles = createStyles(({ css }) => ({
searchDropdown: css` searchDropdown: css`
.ant-dropdown-menu { .ant-dropdown-menu {
max-height: 500px; max-height: 500px;
@ -17,72 +17,88 @@ const createStyleAe = createStyles(({ css }) => ({
})); }));
export const ComponentSe = () => { export const ComponentSe = () => {
const { t: e } = useTranslation(); const { t } = useTranslation();
const { token: t } = theme.useToken(); const { token } = theme.useToken();
const { setDepartment: setDepartment, setUser: setUser } = useContext(contextK); const { setDepartment, setUser } = useContext(DepartmentsContext);
const [r, c] = useState(false); const [open, setOpen] = useState(false);
const [i, x] = useState(''); const [keyword, x] = useState('');
const [m, g] = useState([]); const [m, g] = useState([]);
const [d, A] = useState([]); const [d, A] = useState([]);
const [b, h] = useState(true); const [b, h] = useState(true);
const [F, C] = useState(true); const [F, C] = useState(true);
const { styles } = createStyleAe(); const { styles } = useStyles();
const l = 10; const limit = 10;
const api = useAPIClient(); const api = useAPIClient();
const data = useRequest( const data = useRequest(
(M) => (params) =>
api api
.resource('departments') .resource('departments')
.aggregateSearch(M) .aggregateSearch(params)
.then((P) => { .then((result) => result?.data?.data),
var q;
return (q = P == null ? void 0 : P.data) == null ? void 0 : q.data;
}),
{ {
manual: true, manual: true,
onSuccess: (M, P) => { onSuccess: (data, params) => {
const { const {
values: { type: q }, values: { type: q },
} = P[0] || {}; } = params[0] || {};
M && if (data) {
((!q || q === 'user') && M.users.length < l && h(false), if (!q || (q === 'user' && data.users.length < limit)) {
(!q || q === 'department') && M.departments.length < l && C(false), h(false);
g((se) => [...se, ...M.users]), }
A((se) => [...se, ...M.departments])); if (!q || (q === 'department' && data.departments.length < limit)) {
C(false);
}
g((se) => [...se, ...data.users]);
A((se) => [...se, ...data.departments]);
}
}, },
}, },
); );
const { run: S } = data; const { run } = data;
const O = (M) => { const onSearch = (keyword) => {
x(M), g([]), A([]), h(true), C(true), M && (S({ values: { keyword: M, limit: l } }), c(true)); x(keyword);
g([]);
A([]);
h(true);
C(true);
if (keyword) {
run({ values: { keyword, limit } });
setOpen(true);
}
}; };
const $ = (M) => { const onChange = (event) => {
M.target.value || (setUser(null), x(''), c(false), data.mutate({}), g([]), A([])); if (!event.target.value) {
setUser(null);
x('');
setOpen(false);
data.mutate({});
g([]);
A([]);
}
}; };
const W = (M) => { const NodeLabel = (node) => {
const P = M.title, const title = node.title;
q = M.parent; const parent = node.parent;
return q ? W(q) + ' / ' + P : P; return parent ? NodeLabel(parent) + ' / ' + title : title;
}; };
const H = (M) => const LinkButton = (params) => (
jsx(Button, { <Button
type: 'link', type="link"
style: { padding: '0 8px' }, style={{ padding: '0 8px' }}
onClick: (P) => { onClick={(P) => {
c(true), S({ values: { keyword: i, limit: l, ...M } }); setOpen(true), run({ values: { keyword, limit, ...params } });
}, }}
children: e('Load more'), >
}); {t('Load more')}
</Button>
);
const J = () => { const J = () => {
const M = []; const M = [];
return !m.length && !d.length return !m.length && !d.length
? [ ? [
{ {
key: '0', key: '0',
label: jsx(Empty, { label: <Empty description={t('No results')} image={Empty.PRESENTED_IMAGE_SIMPLE} />,
description: e('No results'),
image: Empty.PRESENTED_IMAGE_SIMPLE,
}),
disabled: true, disabled: true,
}, },
] ]
@ -90,7 +106,7 @@ export const ComponentSe = () => {
(M.push({ (M.push({
key: '0', key: '0',
type: 'group', type: 'group',
label: e('Users'), label: t('Users'),
children: m.map((P) => ({ children: m.map((P) => ({
key: P.username, key: P.username,
label: jsxs('div', { label: jsxs('div', {
@ -98,7 +114,7 @@ export const ComponentSe = () => {
children: [ children: [
jsx('div', { children: P.nickname || P.username }), jsx('div', { children: P.nickname || P.username }),
jsx('div', { jsx('div', {
style: { fontSize: t.fontSizeSM, color: t.colorTextDescription }, style: { fontSize: token.fontSizeSM, color: token.colorTextDescription },
children: `${P.username}${P.phone ? ' | ' + P.phone : ''}${P.email ? ' | ' + P.email : ''}`, children: `${P.username}${P.phone ? ' | ' + P.phone : ''}${P.email ? ' | ' + P.email : ''}`,
}), }),
], ],
@ -109,42 +125,45 @@ export const ComponentSe = () => {
M.push({ M.push({
type: 'group', type: 'group',
key: '0-loadMore', key: '0-loadMore',
label: jsx(H, { type: 'user', last: m[m.length - 1].id }), label: jsx(LinkButton, { type: 'user', last: m[m.length - 1].id }),
})), })),
d.length && d.length &&
(M.push({ (M.push({
key: '1', key: '1',
type: 'group', type: 'group',
label: e('Departments'), label: t('Departments'),
children: d.map((P) => ({ children: d.map((P) => ({
key: P.id, key: P.id,
label: jsx('div', { onClick: () => setDepartment(P), children: W(P) }), label: jsx('div', { onClick: () => setDepartment(P), children: NodeLabel(P) }),
})), })),
}), }),
F && F &&
M.push({ M.push({
type: 'group', type: 'group',
key: '1-loadMore', key: '1-loadMore',
label: jsx(H, { type: 'department', last: d[d.length - 1].id }), label: <LinkButton type="department" last={d[d.length - 1].id} />,
})), })),
M); M);
}; };
return jsx(Dropdown, { return (
menu: { items: J() }, <Dropdown
overlayClassName: styles.searchDropdown, menu={{ items: J() }}
trigger: ['click'], overlayClassName={styles.searchDropdown}
open: r, trigger={['click']}
onOpenChange: (M) => c(M), open={open}
children: jsx(Input.Search, { onOpenChange={(open) => setOpen(open)}
allowClear: true, >
onClick: () => { <Input.Search
i || c(false); allowClear
}, onClick={() => {
onFocus: () => setDepartment(null), keyword || setOpen(false);
onSearch: O, }}
onChange: $, onFocus={() => setDepartment(null)}
placeholder: e('Search for departments, users'), onSearch={onSearch}
style: { marginBottom: '20px' }, onChange={onChange}
}), placeholder={t('Search for departments, users')}
}); style={{ marginBottom: '20px' }}
/>
</Dropdown>
);
}; };

View File

@ -6,17 +6,17 @@ import { App, Dropdown, Empty, Tree } from 'antd';
import { jsx, jsxs } from 'react/jsx-runtime'; import { jsx, jsxs } from 'react/jsx-runtime';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { contextN } from '../context/contextN'; import { DepartmentsExpandedContext } from '../context/DepartmentsExpandedContext';
import { k } from '../others/k'; import { k } from '../others/k';
import { schemaHhe } from '../schema/schemaHhe'; import { schemaHhe } from '../schema/schemaHhe';
import { schemaYye } from '../schema/schemaYye'; import { schemaYye } from '../schema/schemaYye';
export const ComponentX = () => { export const ComponentX = () => {
const { data: e, loading: t } = useResourceActionContext(); const { data: e, loading: t } = useResourceActionContext();
const { department, setDepartment, setUser } = useContext(contextK); const { department, setDepartment, setUser } = useContext(DepartmentsContext);
const { treeData, nodeMap, loadData, loadedKeys, setLoadedKeys, initData, expandedKeys, setExpandedKeys } = const { treeData, nodeMap, loadData, loadedKeys, setLoadedKeys, initData, expandedKeys, setExpandedKeys } =
useContext(contextN); useContext(DepartmentsExpandedContext);
const h = (v) => { const h = (v) => {
if (!v.length) return; if (!v.length) return;
@ -105,7 +105,7 @@ export const ComponentX = () => {
ComponentX.Item = function ({ node: t, setVisible: o, setDrawer: a }) { ComponentX.Item = function ({ node: t, setVisible: o, setDrawer: a }) {
const { t: r } = useTranslation(), const { t: r } = useTranslation(),
{ refreshAsync: c } = useResourceActionContext(), { refreshAsync: c } = useResourceActionContext(),
{ setLoadedKeys: i, expandedKeys: x, setExpandedKeys: m } = useContext(contextN), { setLoadedKeys: i, expandedKeys: x, setExpandedKeys: m } = useContext(DepartmentsExpandedContext),
{ modal: g, message: d } = App.useApp(), { modal: g, message: d } = App.useApp(),
A = useAPIClient(), A = useAPIClient(),
b = () => { b = () => {

View File

@ -1,61 +0,0 @@
import { SchemaComponent } from '@tachybase/client';
import { jsx } from 'react/jsx-runtime';
import { useTranslation } from '../../../locale';
export const ComponentXxe = () => {
const { t: e } = useTranslation();
return jsx(SchemaComponent, {
scope: { t: e },
schema: {
type: 'void',
properties: {
newDepartment: {
type: 'void',
title: e('New department'),
'x-component': 'Action',
'x-component-props': { type: 'text', icon: 'PlusOutlined', style: { width: '100%', textAlign: 'left' } },
properties: {
drawer: {
type: 'void',
'x-component': 'Action.Drawer',
'x-decorator': 'Form',
title: e('New department'),
properties: {
title: { 'x-component': 'CollectionField', 'x-decorator': 'FormItem', required: true },
parent: {
'x-component': 'CollectionField',
'x-decorator': 'FormItem',
'x-collection-field': 'departments.parent',
'x-component-props': { component: 'DepartmentSelect' },
},
roles: {
'x-component': 'CollectionField',
'x-decorator': 'FormItem',
'x-collection-field': 'departments.roles',
},
footer: {
type: 'void',
'x-component': 'Action.Drawer.Footer',
properties: {
cancel: {
title: '{{t("Cancel")}}',
'x-component': 'Action',
'x-component-props': { useAction: '{{ cm.useCancelAction }}' },
},
submit: {
title: '{{t("Submit")}}',
'x-component': 'Action',
'x-component-props': { type: 'primary', useAction: '{{ useCreateDepartment }}' },
},
},
},
},
},
},
},
},
},
});
};

View File

@ -3,11 +3,11 @@ import { EllipsisWithTooltip } from '@tachybase/client';
import { useField } from '@tachybase/schema'; import { useField } from '@tachybase/schema';
// import { jsx, jsxs } from 'react/jsx-runtime'; // import { jsx, jsxs } from 'react/jsx-runtime';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { getDepartmentStr } from '../utils/getDepartmentStr'; import { getDepartmentStr } from '../utils/getDepartmentStr';
export const DepartmentFieldYe = () => { export const DepartmentFieldYe = () => {
const { setDepartment } = useContext(contextK); const { setDepartment } = useContext(DepartmentsContext);
const field = useField<{ value: Array<any> }>(); const field = useField<{ value: Array<any> }>();
const fieldValues = field.value || []; const fieldValues = field.value || [];

View File

@ -5,12 +5,12 @@ import { SchemaComponentOptions } from '@tachybase/client';
import { Col, Row } from 'antd'; import { Col, Row } from 'antd';
import { useFilterActionPropsZ } from '../scopes/useFilterActionPropsZ'; import { useFilterActionPropsZ } from '../scopes/useFilterActionPropsZ';
import { CeComponent } from './CeComponent';
import { BeComponent } from './ComponentBe';
import { ComponentEEE } from './ComponentEEE'; import { ComponentEEE } from './ComponentEEE';
import { ComponentIit } from './ComponentIit'; import { ComponentIit } from './ComponentIit';
import { DepartmentSelect } from './DepartmentSelect'; import { DepartmentSelect } from './DepartmentSelect';
import { DepartmentsResourceProvider } from './DepartmentsResourceProvider';
import { SuperiorDepartmentSelect } from './SuperiorDepartmentSelect'; import { SuperiorDepartmentSelect } from './SuperiorDepartmentSelect';
import { UserResourceProvider } from './UserResourceProvider';
export const DepartmentManagement = () => { export const DepartmentManagement = () => {
return ( return (
@ -20,14 +20,14 @@ export const DepartmentManagement = () => {
> >
<Row gutter={48} style={{ flexWrap: 'nowrap' }}> <Row gutter={48} style={{ flexWrap: 'nowrap' }}>
<Col span={6} style={{ borderRight: '1px solid #eee', minWidth: '300px' }}> <Col span={6} style={{ borderRight: '1px solid #eee', minWidth: '300px' }}>
<CeComponent> <DepartmentsResourceProvider>
<ComponentEEE /> <ComponentEEE />
</CeComponent> </DepartmentsResourceProvider>
</Col> </Col>
<Col flex="auto" style={{ overflow: 'hidden' }}> <Col flex="auto" style={{ overflow: 'hidden' }}>
<BeComponent> <UserResourceProvider>
<ComponentIit /> <ComponentIit />
</BeComponent> </UserResourceProvider>
</Col> </Col>
</Row> </Row>
</SchemaComponentOptions> </SchemaComponentOptions>

View File

@ -2,15 +2,15 @@ import { useContext } from 'react';
import { jsx } from 'react/jsx-runtime'; import { jsx } from 'react/jsx-runtime';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { useHooksG } from '../hooks/useHooksG'; import { useDepTree2 } from '../hooks/useDepTree2';
import { T } from '../others/T'; import { T } from '../others/T';
import { y } from '../others/y'; import { y } from '../others/y';
import { ComponentLle } from './ComponentLle'; import { ComponentLle } from './ComponentLle';
export const DepartmentSelect = () => { export const DepartmentSelect = () => {
const e = useHooksG(), const e = useDepTree2(),
{ departmentsResource: t } = useContext(contextK), { departmentsResource: t } = useContext(DepartmentsContext),
{ {
service: { data: o }, service: { data: o },
} = t || {}; } = t || {};

View File

@ -5,7 +5,7 @@ import { jsx } from 'react/jsx-runtime';
import { useFilterActionPropsXe } from '../scopes/useFilterActionPropsXe'; import { useFilterActionPropsXe } from '../scopes/useFilterActionPropsXe';
import { InternalDepartmentTableRe } from './InternalDepartmentTableRe'; import { InternalDepartmentTableRe } from './InternalDepartmentTableRe';
import { RequestProviderEet } from './RequestProviderEet'; import { RequestProvider } from './RequestProvider';
export const DepartmentTablePpe = ({ useDataSource: e, useDisabled: t }) => export const DepartmentTablePpe = ({ useDataSource: e, useDisabled: t }) =>
jsx(SchemaComponent, { jsx(SchemaComponent, {
@ -15,7 +15,7 @@ export const DepartmentTablePpe = ({ useDataSource: e, useDisabled: t }) =>
}, },
components: { components: {
InternalDepartmentTable: InternalDepartmentTableRe, InternalDepartmentTable: InternalDepartmentTableRe,
RequestProvider: RequestProviderEet, RequestProvider: RequestProvider,
}, },
schema: { schema: {
type: 'void', type: 'void',

View File

@ -1,7 +1,7 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { useRequest } from '@tachybase/client'; import { useRequest } from '@tachybase/client';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
export const DepartmentsProvider = ({ children }) => { export const DepartmentsProvider = ({ children }) => {
const [user, setUser] = useState(null); const [user, setUser] = useState(null);
@ -27,7 +27,7 @@ export const DepartmentsProvider = ({ children }) => {
params: { pagination: false, filter: { parentId: null } }, params: { pagination: false, filter: { parentId: null } },
}); });
return ( return (
<contextK.Provider <DepartmentsContext.Provider
value={{ value={{
user, user,
setUser, setUser,
@ -38,6 +38,6 @@ export const DepartmentsProvider = ({ children }) => {
}} }}
> >
{children} {children}
</contextK.Provider> </DepartmentsContext.Provider>
); );
}; };

View File

@ -2,10 +2,10 @@ import React from 'react';
import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client'; import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client';
import { collectionDepartments } from '../collections/departments.collection'; import { collectionDepartments } from '../collections/departments.collection';
import { useContextK } from '../context/contextK'; import { useDepartments } from '../context/DepartmentsContext';
export const CeComponent = ({ children }) => { export const DepartmentsResourceProvider = ({ children }) => {
const context = useContextK(); const context = useDepartments();
const { departmentsResource } = context; const { departmentsResource } = context;
const { service } = departmentsResource || {}; const { service } = departmentsResource || {};

View File

@ -6,7 +6,7 @@ import { Table } from 'antd';
import { jsx } from 'react/jsx-runtime'; import { jsx } from 'react/jsx-runtime';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { useHooksG } from '../hooks/useHooksG'; import { useDepTree2 } from '../hooks/useDepTree2';
import { T } from '../others/T'; import { T } from '../others/T';
import { y } from '../others/y'; import { y } from '../others/y';
import { getDepartmentStr } from '../utils/getDepartmentStr'; import { getDepartmentStr } from '../utils/getDepartmentStr';
@ -19,7 +19,7 @@ export const InternalDepartmentTableRe = ({ useDisabled: e = Ze }) => {
console.log(o); console.log(o);
const { run: a, data: r, loading: c, defaultRequest: i } = o, const { run: a, data: r, loading: c, defaultRequest: i } = o,
{ resource: x, resourceOf: m, params: g } = i || {}, { resource: x, resourceOf: m, params: g } = i || {},
{ treeData: d, initData: A, loadData: b } = useHooksG({ resource: x, resourceOf: m, params: g }), { treeData: d, initData: A, loadData: b } = useDepTree2({ resource: x, resourceOf: m, params: g }),
h = useField(), h = useField(),
{ disabled: F } = e(), { disabled: F } = e(),
{ hasFilter: C, expandedKeys: v, setExpandedKeys: l } = useContext(ContextR); { hasFilter: C, expandedKeys: v, setExpandedKeys: l } = useContext(ContextR);
@ -37,14 +37,14 @@ export const InternalDepartmentTableRe = ({ useDisabled: e = Ze }) => {
rowSelection: { rowSelection: {
selectedRowKeys: ((h == null ? void 0 : h.value) || []).map((f) => f.id), selectedRowKeys: ((h == null ? void 0 : h.value) || []).map((f) => f.id),
onChange: (f, S) => { onChange: (f, S) => {
var O; let O;
return (O = h == null ? void 0 : h.setValue) == null ? void 0 : O.call(h, S); return (O = h == null ? void 0 : h.setValue) == null ? void 0 : O.call(h, S);
}, },
getCheckboxProps: (f) => ({ disabled: F(f) }), getCheckboxProps: (f) => ({ disabled: F(f) }),
}, },
pagination: T(y({ showSizeChanger: true }, u), { pagination: T(y({ showSizeChanger: true }, u), {
onChange(f, S) { onChange(f, S) {
var O; let O;
a(T(y({}, ((O = o == null ? void 0 : o.params) == null ? void 0 : O[0]) || {}), { page: f, pageSize: S })); a(T(y({}, ((O = o == null ? void 0 : o.params) == null ? void 0 : O[0]) || {}), { page: f, pageSize: S }));
}, },
}), }),

View File

@ -3,10 +3,10 @@ import { Checkbox, useRecord } from '@tachybase/client';
import { jsx } from 'react/jsx-runtime'; import { jsx } from 'react/jsx-runtime';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
export const IsOwnerFieldQe = () => { export const IsOwnerFieldQe = () => {
const { department: e } = useContext(contextK), const { department: e } = useContext(DepartmentsContext),
o = (useRecord().departments || []).find((a) => (a == null ? void 0 : a.id) === (e == null ? void 0 : e.id)); o = (useRecord().departments || []).find((a) => (a == null ? void 0 : a.id) === (e == null ? void 0 : e.id));
return jsx(Checkbox.ReadPretty, { value: o == null ? void 0 : o.departmentsUsers.isOwner }); return jsx(Checkbox.ReadPretty, { value: o == null ? void 0 : o.departmentsUsers.isOwner });
}; };

View File

@ -0,0 +1,62 @@
import React from 'react';
import { SchemaComponent } from '@tachybase/client';
import { useTranslation } from '../../../locale';
export const NewDepartment = () => {
const { t } = useTranslation();
return (
<SchemaComponent
scope={{ t }}
schema={{
type: 'void',
properties: {
newDepartment: {
type: 'void',
title: t('New department'),
'x-component': 'Action',
'x-component-props': { type: 'text', icon: 'PlusOutlined', style: { width: '100%', textAlign: 'left' } },
properties: {
drawer: {
type: 'void',
'x-component': 'Action.Drawer',
'x-decorator': 'Form',
title: t('New department'),
properties: {
title: { 'x-component': 'CollectionField', 'x-decorator': 'FormItem', required: true },
parent: {
'x-component': 'CollectionField',
'x-decorator': 'FormItem',
'x-collection-field': 'departments.parent',
'x-component-props': { component: 'DepartmentSelect' },
},
roles: {
'x-component': 'CollectionField',
'x-decorator': 'FormItem',
'x-collection-field': 'departments.roles',
},
footer: {
type: 'void',
'x-component': 'Action.Drawer.Footer',
properties: {
cancel: {
title: '{{t("Cancel")}}',
'x-component': 'Action',
'x-component-props': { useAction: '{{ cm.useCancelAction }}' },
},
submit: {
title: '{{t("Submit")}}',
'x-component': 'Action',
'x-component-props': { type: 'primary', useAction: '{{ useCreateDepartment }}' },
},
},
},
},
},
},
},
},
}}
></SchemaComponent>
);
};

View File

@ -0,0 +1,24 @@
import React, { useEffect, useState } from 'react';
import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client';
import { collectionDepartments } from '../collections/departments.collection';
import { ContextR } from './ContextR';
export const RequestProvider = (prop) => {
const [expandedKeys, setExpandedKeys] = useState([]);
const [hasFilter, setHasFilter] = useState(false);
const { useDataSource } = prop;
const service = useDataSource({ manual: true });
useEffect(() => {
service.run({ filter: { parentId: null }, pageSize: 10 });
}, []);
return (
<ResourceActionContext.Provider value={service}>
<CollectionProvider_deprecated collection={collectionDepartments}>
<ContextR.Provider value={{ expandedKeys, setExpandedKeys, hasFilter, setHasFilter }}>
{prop.children}
</ContextR.Provider>
</CollectionProvider_deprecated>
</ResourceActionContext.Provider>
);
};

View File

@ -1,30 +0,0 @@
import { useEffect, useState } from 'react';
import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client';
import { jsx } from 'react/jsx-runtime';
import { collectionDepartments } from '../collections/departments.collection';
import { y } from '../others/y';
import { ContextR } from './ContextR';
export const RequestProviderEet = (e) => {
const [t, o] = useState([]),
[a, r] = useState(false),
{ useDataSource: c } = e,
i = c({ manual: true });
return (
useEffect(() => {
i.run({ filter: { parentId: null }, pageSize: 10 });
}, []),
jsx(ResourceActionContext.Provider, {
value: y({}, i),
children: jsx(CollectionProvider_deprecated, {
collection: collectionDepartments,
children: jsx(ContextR.Provider, {
value: { expandedKeys: t, setExpandedKeys: o, hasFilter: a, setHasFilter: r },
children: e.children,
}),
}),
})
);
};

View File

@ -3,17 +3,17 @@ import { useRecord } from '@tachybase/client';
import { jsx } from 'react/jsx-runtime'; import { jsx } from 'react/jsx-runtime';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { useHooksG } from '../hooks/useHooksG'; import { useDepTree2 } from '../hooks/useDepTree2';
import { T } from '../others/T'; import { T } from '../others/T';
import { y } from '../others/y'; import { y } from '../others/y';
import { ComponentLle } from './ComponentLle'; import { ComponentLle } from './ComponentLle';
export const SuperiorDepartmentSelect = () => { export const SuperiorDepartmentSelect = () => {
const e = useHooksG(), const e = useDepTree2(),
{ setTreeData: t, getChildrenIds: o } = e, { setTreeData: t, getChildrenIds: o } = e,
a = useRecord(), a = useRecord(),
{ departmentsResource: r } = useContext(contextK), { departmentsResource: r } = useContext(DepartmentsContext),
{ {
service: { data: c }, service: { data: c },
} = r || {}; } = r || {};

View File

@ -1,12 +1,11 @@
import React, { useContext } from 'react'; import React, { useContext } from 'react';
import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client'; import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client';
// import { jsx } from 'react/jsx-runtime';
import { collectionUsers } from '../collections/users.collection'; import { collectionUsers } from '../collections/users.collection';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
export const BeComponent = ({ children }) => { export const UserResourceProvider = ({ children }) => {
const { usersResource } = useContext(contextK); const { usersResource } = useContext(DepartmentsContext);
const { service } = usersResource || {}; const { service } = usersResource || {};
return ( return (
@ -14,9 +13,4 @@ export const BeComponent = ({ children }) => {
<CollectionProvider_deprecated collection={collectionUsers}>{children}</CollectionProvider_deprecated> <CollectionProvider_deprecated collection={collectionUsers}>{children}</CollectionProvider_deprecated>
</ResourceActionContext.Provider> </ResourceActionContext.Provider>
); );
// return jsx(ResourceActionContext.Provider, {
// value: { ...o },
// children: jsx(CollectionProvider_deprecated, { collection: collectionUsers, children: e.children }),
// });
}; };

View File

@ -20,14 +20,13 @@ interface contextType {
}; };
} }
// XXX: 等待所有引用重置为以下两个函数后, 删除导出声明 export const DepartmentsContext = React.createContext<contextType>({
export const contextK = React.createContext<contextType>({
user: {}, user: {},
department: {}, department: {},
}); });
export const ContextKProvider = contextK.Provider; export const DepartmentsContextProvider = DepartmentsContext.Provider;
export function useContextK() { export function useDepartments() {
return useContext(contextK); return useContext(DepartmentsContext);
} }

View File

@ -0,0 +1,23 @@
import React, { useContext } from 'react';
export interface DepartmentsExpandedProps {
initData: (C: any) => void;
treeData: any[];
setTreeData: React.Dispatch<React.SetStateAction<any[]>>;
nodeMap: {};
updateTreeData: (C: any, v: any) => any;
constructTreeData: (C: any, v: any) => any;
getChildrenIds: (node: any) => any[];
loadedKeys: any[];
setLoadedKeys: React.Dispatch<React.SetStateAction<any[]>>;
expandedKeys: any[];
setExpandedKeys: React.Dispatch<React.SetStateAction<any[]>>;
}
export const DepartmentsExpandedContext = React.createContext<Partial<DepartmentsExpandedProps>>({});
export const DepartmentsExpandedContextProvider = DepartmentsExpandedContext.Provider;
export function useDepartmentsExpanded() {
return useContext(DepartmentsExpandedContext);
}

View File

@ -1,9 +0,0 @@
import React, { useContext } from 'react';
export const contextN = React.createContext<any>({});
export const ContextNProvider = contextN.Provider;
export function useContextN() {
return useContext(contextN);
}

View File

@ -4,7 +4,7 @@ import { useAPIClient, useResourceActionContext } from '@tachybase/client';
import { App } from 'antd'; import { App } from 'antd';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { k } from '../others/k'; import { k } from '../others/k';
export const useBulkRemoveMembersAction = () => { export const useBulkRemoveMembersAction = () => {
@ -12,7 +12,7 @@ export const useBulkRemoveMembersAction = () => {
{ message: t } = App.useApp(), { message: t } = App.useApp(),
o = useAPIClient(), o = useAPIClient(),
{ state: a, setState: r, refresh: c } = useResourceActionContext(), { state: a, setState: r, refresh: c } = useResourceActionContext(),
{ department: i } = useContext(contextK); { department: i } = useContext(DepartmentsContext);
return { return {
run() { run() {
return k(this, null, function* () { return k(this, null, function* () {

View File

@ -2,33 +2,35 @@ import { useContext } from 'react';
import { useActionContext, useAPIClient, useResourceActionContext } from '@tachybase/client'; import { useActionContext, useAPIClient, useResourceActionContext } from '@tachybase/client';
import { useField, useForm } from '@tachybase/schema'; import { useField, useForm } from '@tachybase/schema';
import { contextN } from '../context/contextN'; import { DepartmentsExpandedContext } from '../context/DepartmentsExpandedContext';
import { k } from '../others/k';
export const useCreateDepartment = () => { export const useCreateDepartment = () => {
const e = useForm(), const form = useForm();
t = useField(), const field = useField();
o = useActionContext(), const { setVisible } = useActionContext();
{ refreshAsync: a } = useResourceActionContext(), const { refreshAsync } = useResourceActionContext();
r = useAPIClient(), const api = useAPIClient();
{ expandedKeys: c, setLoadedKeys: i, setExpandedKeys: x } = useContext(contextN); const { expandedKeys, setLoadedKeys, setExpandedKeys } = useContext(DepartmentsExpandedContext);
return { return {
run() { async run() {
return k(this, null, function* () { try {
try { await form.submit();
yield e.submit(), field.data = field.data || {};
(t.data = t.data || {}), field.data.loading = true;
(t.data.loading = true), await api.resource('departments').create({ values: form.values });
yield r.resource('departments').create({ values: e.values }), setVisible(false);
o.setVisible(false), await form.reset();
yield e.reset(), field.data.loading = false;
(t.data.loading = false); const keys = [...expandedKeys];
const g = [...c]; setLoadedKeys([]);
i([]), x([]), yield a(), x(g); setExpandedKeys([]);
} catch (g) { await refreshAsync();
t.data && (t.data.loading = false); setExpandedKeys(keys);
} catch (error) {
if (field.data) {
field.data.loading = false;
} }
}); }
}, },
}; };
}; };

View File

@ -0,0 +1,35 @@
import { useAPIClient } from '@tachybase/client';
import { useDepTree } from './useHooksDe';
export const useDepTree2 = (props?) => {
const { resource = 'departments', resourceOf, params = {} } = props || {};
const service = useAPIClient().resource(resource, resourceOf);
const depTree = useDepTree(props);
const { setTreeData, updateTreeData, initData } = depTree;
const loadData =
(_) =>
async ({ key, children }) => {
if (children != null && children.length) return;
const { data } = await service.list({
...params,
pagination: false,
appends: ['parent(recursively=true)'],
filter: { parentId: key },
});
if (data?.data?.length) {
setTreeData(updateTreeData(key, data?.data));
}
};
const getByKeyword = async (keyword) => {
const { data } = await service.list({
...params,
pagination: false,
filter: { title: { $includes: keyword } },
appends: ['parent(recursively=true)'],
pageSize: 100,
});
initData(data?.data);
};
return { ...depTree, loadData, getByKeyword };
};

View File

@ -1,99 +1,100 @@
import React, { useCallback, useState } from 'react'; import React, { useCallback, useState } from 'react';
import { T } from '../others/T'; export const useDepTree = (options) => {
const { label } = options || {};
export const useHooksDe = (e) => { const [treeData, setTreeData] = useState([]);
const { label: t } = e || {}, const [nodeMap, setNodeMap] = useState({});
[o, a] = useState([]), const [expandedKeys, setExpandedKeys] = useState([]);
[r, c] = useState({}), const [loadedKeys, setLoadedKeys] = useState([]);
[i, x] = useState([]), const d = useCallback((C) => {
[m, g] = useState([]), const v = {};
d = useCallback((C) => { const l = (f) => {
const v = {}, let S = f ? { ...f } : null;
l = (f) => { for (; S; ) {
let S = f ? { ...f } : null; const O = S.parentId || 'root';
for (; S; ) { if (v[0]) {
const O = S.parentId || 'root'; v[O].childrenMap[S.id] = S;
v[O] } else {
? (v[O].childrenMap[S.id] = S) v[O] = { ...(S.parent || { id: O }), childrenMap: { [S.id]: S } };
: (v[O] = T({ ...(S.parent || { id: O }) }, { childrenMap: { [S.id]: S } })), }
(S = S.parent); S = S.parent;
} }
}, };
u = (f) => { const u = (f) => {
const S = {}; const childrenMap = {};
f.children && f.children &&
f.children.length && f.children.length &&
f.children.forEach((O) => { f.children.forEach((O) => {
(S[O.id] = O), u(O); (childrenMap[O.id] = O), u(O);
}), });
(v[f.id] = T({ ...f }, { childrenMap: S })); v[f.id] = { ...f, childrenMap };
}; };
return ( return (
C && C &&
C.length && C.length &&
C.forEach((f) => { C.forEach((f) => {
l(f), u(f); l(f), u(f);
}),
v
);
}, []),
A = useCallback((C) => {
const v = (l) => {
var u;
return !C[l] || C[l].isLeaf
? null
: Object.values(((u = C[l]) == null ? void 0 : u.childrenMap) || {}).map((f: object) =>
T({ ...f }, { title: t ? React.createElement(t, { node: f }) : f.title, children: v(f.id) }),
);
};
return v('root');
}, []),
b = useCallback(
(C) => {
const v = d(C);
c(v);
const l = A(v) || [];
a(l);
},
[a, d, A],
),
h = (C, v) => {
const l = d(v),
u = { ...l, ...r };
return (
v.forEach((f) => {
u[C].childrenMap[f.id] = f;
}), }),
c(u), v
A(u) );
}, []);
const constructTreeData = useCallback((C) => {
const v = (l) => {
return !C[l] || C[l].isLeaf
? null
: Object.values(C[l]?.childrenMap || {}).map((f: any) => ({
...f,
title: label ? React.createElement(label, { node: f }) : f.title,
children: v(f.id),
}));
};
return v('root');
}, []);
const initData = useCallback(
(C) => {
const v = d(C);
setNodeMap(v);
const l = constructTreeData(v) || [];
setTreeData(l);
},
[setTreeData, d, constructTreeData],
);
const updateTreeData = (C, v) => {
const l = d(v);
const u = { ...l, ...nodeMap };
return (
v.forEach((f) => {
u[C].childrenMap[f.id] = f;
}),
setNodeMap(u),
constructTreeData(u)
);
};
const getChildrenIds = useCallback(
(node) => {
if (!nodeMap[node]) return [];
const ids = [];
return (
ids.push(...Object.keys(nodeMap[node].childrenMap).map((id) => Number(id))),
Object.keys(nodeMap[node].childrenMap).forEach((subNode) => {
ids.push(...getChildrenIds(subNode));
}),
ids
); );
}, },
F = useCallback( [nodeMap],
(C) => { );
if (!r[C]) return [];
const v = [];
return (
v.push(...Object.keys(r[C].childrenMap).map((l) => Number(l))),
Object.keys(r[C].childrenMap).forEach((l) => {
v.push(...F(l));
}),
v
);
},
[r],
);
return { return {
initData: b, initData,
treeData: o, treeData,
setTreeData: a, setTreeData,
nodeMap: r, nodeMap,
updateTreeData: h, updateTreeData,
constructTreeData: A, constructTreeData,
getChildrenIds: F, getChildrenIds,
loadedKeys: m, loadedKeys,
setLoadedKeys: g, setLoadedKeys,
expandedKeys: i, expandedKeys,
setExpandedKeys: x, setExpandedKeys,
}; };
}; };

View File

@ -1,44 +0,0 @@
import { useAPIClient } from '@tachybase/client';
import { k } from '../others/k';
import { T } from '../others/T';
import { B } from '../utils/B';
import { useHooksDe } from './useHooksDe';
function we(e) {
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, 'default') ? e.default : e;
}
const je = B;
const Ue = je;
const ie = we(Ue);
export const useHooksG = (props) => {
const { resource: t = 'departments', resourceOf: o, params: a = {} } = props || {},
c = useAPIClient().resource(t, o),
i = useHooksDe(props),
{ setTreeData: x, updateTreeData: m, setLoadedKeys: g, initData: d } = i,
A = (C) =>
k(this, [C], function* ({ key: h, children: F }) {
var l;
if (F != null && F.length) return;
const { data: v } = yield c.list(
ie(a, { pagination: false, appends: ['parent(recursively=true)'], filter: { parentId: h } }),
);
(l = v == null ? void 0 : v.data) != null && l.length && x(m(h, v == null ? void 0 : v.data));
}),
b = (h) =>
k(this, null, function* () {
const { data: F } = yield c.list(
ie(a, {
pagination: false,
filter: { title: { $includes: h } },
appends: ['parent(recursively=true)'],
pageSize: 100,
}),
);
d(F == null ? void 0 : F.data);
});
return T({ ...i }, { loadData: A, getByKeyword: b });
};

View File

@ -1,15 +0,0 @@
import { useCollection_deprecated, useCollectionManager_deprecated, useCompile } from '@tachybase/client';
import { useFieldSchema } from '@tachybase/schema';
const bt = (e) => e['x-component'] === 'CollectionField';
export const useHooksOoe = () => {
const { getField: e } = useCollection_deprecated(),
t = useCompile(),
o = useFieldSchema(),
{ getCollectionJoinField: a } = useCollectionManager_deprecated(),
r = o.reduceProperties((i, x) => (bt(x) ? x : i), null);
if (!r) return {};
const c = e(r.name) || a(r == null ? void 0 : r['x-collection-field']);
return { columnSchema: o, fieldSchema: r, collectionField: c, uiSchema: t(c == null ? void 0 : c.uiSchema) };
};

View File

@ -1,10 +1,10 @@
import { useContext, useEffect } from 'react'; import { useContext, useEffect } from 'react';
import { useResourceActionContext } from '@tachybase/client'; import { useResourceActionContext } from '@tachybase/client';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
export const useMembersDataSource = (e) => { export const useMembersDataSource = (e) => {
const { user: t } = useContext(contextK), const { user: t } = useContext(DepartmentsContext),
o = useResourceActionContext(); o = useResourceActionContext();
return ( return (
useEffect(() => { useEffect(() => {

View File

@ -1,12 +1,12 @@
import { useContext } from 'react'; import { useContext } from 'react';
import { useAPIClient, useRecord, useResourceActionContext } from '@tachybase/client'; import { useAPIClient, useRecord, useResourceActionContext } from '@tachybase/client';
import { contextK } from '../context/contextK'; import { DepartmentsContext } from '../context/DepartmentsContext';
import { k } from '../others/k'; import { k } from '../others/k';
export const useRemoveMemberAction = () => { export const useRemoveMemberAction = () => {
const e = useAPIClient(), const e = useAPIClient(),
{ department: t } = useContext(contextK), { department: t } = useContext(DepartmentsContext),
{ id: o } = useRecord(), { id: o } = useRecord(),
{ refresh: a } = useResourceActionContext(); { refresh: a } = useResourceActionContext();
return { return {

View File

@ -0,0 +1,39 @@
import { useContext } from 'react';
import { useActionContext, useAPIClient, useRecord, useResourceActionContext } from '@tachybase/client';
import { useField, useForm } from '@tachybase/schema';
import { DepartmentsContext } from '../context/DepartmentsContext';
import { DepartmentsExpandedContext } from '../context/DepartmentsExpandedContext';
export const useUpdateDepartment = () => {
const field = useField();
const form = useForm();
const { setVisible } = useActionContext();
const { refreshAsync } = useResourceActionContext();
const api = useAPIClient();
const { id } = useRecord();
const { expandedKeys, setLoadedKeys, setExpandedKeys } = useContext(DepartmentsExpandedContext);
const { department, setDepartment } = useContext(DepartmentsContext);
return {
async run() {
await form.submit();
field.data = field.data || {};
field.data.loading = true;
try {
await api.resource('departments').update({ filterByTk: id, values: form.values });
setDepartment({ department, ...form.values });
setVisible(false);
await form.reset();
const keys = [...expandedKeys];
setLoadedKeys([]);
setExpandedKeys([]);
await refreshAsync();
setExpandedKeys(keys);
} catch (error) {
console.log(error);
} finally {
field.data.loading = false;
}
},
};
};

View File

@ -1,37 +0,0 @@
import { useContext } from 'react';
import { useActionContext, useAPIClient, useRecord, useResourceActionContext } from '@tachybase/client';
import { useField, useForm } from '@tachybase/schema';
import { contextK } from '../context/contextK';
import { contextN } from '../context/contextN';
import { k } from '../others/k';
export const useUpdateDepartmentLe = () => {
const e = useField(),
t = useForm(),
o = useActionContext(),
{ refreshAsync: a } = useResourceActionContext(),
r = useAPIClient(),
{ id: c } = useRecord(),
{ expandedKeys: i, setLoadedKeys: x, setExpandedKeys: m } = useContext(contextN),
{ department: g, setDepartment: d } = useContext(contextK);
return {
run() {
return k(this, null, function* () {
yield t.submit(), (e.data = e.data || {}), (e.data.loading = true);
try {
yield r.resource('departments').update({ filterByTk: c, values: t.values }),
d({ department: g, ...t.values }),
o.setVisible(false),
yield t.reset();
const b = [...i];
x([]), m([]), yield a(), m(b);
} catch (b) {
console.log(b);
} finally {
e.data.loading = false;
}
});
},
};
};

View File

@ -1,48 +0,0 @@
import { useDesignable } from '@tachybase/client';
import { useField, useFieldSchema } from '@tachybase/schema';
import { useTranslation } from '../../../locale';
import { useHooksOoe } from '../hooks/useHooksOoe';
export const neItems = {
name: 'enableLink',
type: 'switch',
useVisible() {
return useField().readPretty;
},
useComponentProps() {
var i;
const { t: e } = useTranslation();
const field = useField();
const { fieldSchema: newFieldSchema } = useHooksOoe();
const oldFieldSchema = useFieldSchema();
const fieldSchema = newFieldSchema || oldFieldSchema;
const { dn: c } = useDesignable();
return {
title: e('Enable link'),
checked: ((i = fieldSchema['x-component-props']) == null ? void 0 : i.enableLink) !== false,
onChange(x) {
// fieldSchema['x-component-props'] = T(
// y({}, fieldSchema == null ? void 0 : fieldSchema['x-component-props']),
// {
// enableLink: x,
// });
fieldSchema['x-component-props'] = {
...fieldSchema?.['x-component-props'],
enableLink: x,
};
field.componentProps.enableLink = x;
c.emit('patch', {
schema: {
'x-uid': fieldSchema['x-uid'],
// 'x-component-props': y({}, fieldSchema == null ? void 0 : fieldSchema['x-component-props']),
'x-component-props': {
...fieldSchema?.['x-component-props'],
},
},
});
c.refresh();
},
};
},
};

View File

@ -1,34 +0,0 @@
import { useDesignable, useFieldModeOptions } from '@tachybase/client';
import { useField, useFieldSchema } from '@tachybase/schema';
import { useTranslation } from '../../../locale';
import { useHooksOoe } from '../hooks/useHooksOoe';
export const reItems = {
name: 'fieldComponent',
type: 'select',
useComponentProps() {
const { t: e } = useTranslation(),
t = useField(),
{ fieldSchema: o, collectionField: a } = useHooksOoe(),
r = useFieldSchema(),
c = o || r,
i = useFieldModeOptions({ fieldSchema: o, collectionField: a }),
{ dn: x } = useDesignable();
return {
title: e('Field component'),
options: i,
value: 'Select',
onChange(m) {
const g = { 'x-uid': c['x-uid'] };
(c['x-component-props'] = c['x-component-props'] || {}),
(c['x-component-props'].mode = m),
(g['x-component-props'] = c['x-component-props']),
(t.componentProps = t.componentProps || {}),
(t.componentProps.mode = m),
x.emit('patch', { schema: g }),
x.refresh();
},
};
},
};

View File

@ -1,67 +0,0 @@
import { useCollectionField, useDesignable, useTitleFieldOptions } from '@tachybase/client';
import { useField, useFieldSchema } from '@tachybase/schema';
import { useTranslation } from '../../../locale';
import { useHooksOoe } from '../hooks/useHooksOoe';
import { T } from '../others/T';
import { y } from '../others/y';
export const teItems = {
name: 'titleField',
type: 'select',
useComponentProps() {
var b, h, F, C;
const { t: e } = useTranslation(),
t = useField(),
{ dn: o } = useDesignable(),
a = useTitleFieldOptions(),
{ uiSchema: r, fieldSchema: c, collectionField: i } = useHooksOoe(),
x = useFieldSchema(),
m = c || x,
g = useCollectionField(),
d = i || g,
A = y(
y(
y(
{},
(h = (b = d == null ? void 0 : d.uiSchema) == null ? void 0 : b['x-component-props']) == null
? void 0
: h.fieldNames,
),
(F = t == null ? void 0 : t.componentProps) == null ? void 0 : F.fieldNames,
),
(C = m == null ? void 0 : m['x-component-props']) == null ? void 0 : C.fieldNames,
);
return {
title: e('Title field'),
options: a,
value: A == null ? void 0 : A.label,
onChange(v) {
var S, O, $, W, H, J;
const l = { 'x-uid': m['x-uid'] },
u = T(
y(
y(
{},
(O = (S = d == null ? void 0 : d.uiSchema) == null ? void 0 : S['x-component-props']) == null
? void 0
: O.fieldNames,
),
($ = m['x-component-props']) == null ? void 0 : $.fieldNames,
),
{ label: v },
);
(m['x-component-props'] = m['x-component-props'] || {}),
(m['x-component-props'].fieldNames = u),
(l['x-component-props'] = m['x-component-props']),
(t.componentProps.fieldNames = (W = m['x-component-props']) == null ? void 0 : W.fieldNames);
const f = (J = t.path) == null ? void 0 : J.splice(((H = t.path) == null ? void 0 : H.length) - 1, 1);
t.form.query(`${f.concat('*.' + m.name)}`).forEach((M) => {
M.componentProps.fieldNames = A;
}),
o.emit('patch', { schema: l }),
o.refresh();
},
};
},
};

View File

@ -10,42 +10,41 @@ import { useField } from '@tachybase/schema';
import { useTranslation } from '../../../locale'; import { useTranslation } from '../../../locale';
import { ContextR } from '../components/ContextR'; import { ContextR } from '../components/ContextR';
import { k } from '../others/k';
import { T } from '../others/T';
import { y } from '../others/y';
export const useFilterActionPropsXe = () => { export const useFilterActionPropsXe = () => {
const { setHasFilter: e, setExpandedKeys: t } = useContext(ContextR), const { setHasFilter, setExpandedKeys } = useContext(ContextR);
{ t: o } = useTranslation(), const { t } = useTranslation();
a = useContext(CollectionContext), const collection = useContext(CollectionContext);
r = useFilterFieldOptions(a.fields), const options = useFilterFieldOptions(collection.fields);
c = useResourceActionContext(), const service = useResourceActionContext();
{ run: i, defaultRequest: x } = c, const { run, defaultRequest } = service;
m = useField(), const field = useField();
{ params: g } = x || {}; const { params } = defaultRequest || {};
return { return {
options: r, options: options,
onSubmit: (d) => onSubmit: async (args) => {
k(this, null, function* () { const filter = params.filter;
const A = g.filter, const defaultFilter = removeNullCondition(args?.filter) as any;
b = removeNullCondition(d == null ? void 0 : d.filter); run({ ...params, page: 1, pageSize: 10, filter: mergeFilter([defaultFilter, filter]) });
i(T(y({}, g), { page: 1, pageSize: 10, filter: mergeFilter([b, A]) })); const filters = defaultFilter?.$and || defaultFilter?.$or;
const h = (b == null ? void 0 : b.$and) || (b == null ? void 0 : b.$or); if (filters?.length) {
h != null && h.length field.title = t('{{count}} filter items', { count: filters?.length || 0 });
? ((m.title = o('{{count}} filter items', { count: (h == null ? void 0 : h.length) || 0 })), e(true)) setHasFilter(true);
: ((m.title = o('Filter')), e(false)); } else {
}), field.title = t('Filter');
setHasFilter(false);
}
},
onReset() { onReset() {
i( run({
T(y({}, g || {}), { ...params,
filter: T(y({}, (g == null ? void 0 : g.filter) || {}), { parentId: null }), filter: { ...(params?.filter || {}), parentId: null },
page: 1, page: 1,
pageSize: 10, pageSize: 10,
}), });
), field.title = t('Filter');
(m.title = o('Filter')), setHasFilter(false);
e(false), setExpandedKeys([]);
t([]);
}, },
}; };
}; };

View File

@ -1,19 +1,12 @@
import { useContext } from 'react'; import { useCollection, useFilterFieldOptions, useFilterFieldProps, useResourceActionContext } from '@tachybase/client';
import {
CollectionContext,
useFilterFieldOptions,
useFilterFieldProps,
useResourceActionContext,
} from '@tachybase/client';
export const useFilterActionPropsZ = () => { export const useFilterActionPropsZ = () => {
var a, r; const collection = useCollection();
const e = useContext(CollectionContext), const options = useFilterFieldOptions(collection.fields);
t = useFilterFieldOptions(e.fields), const service = useResourceActionContext();
o = useResourceActionContext();
return useFilterFieldProps({ return useFilterFieldProps({
options: t, options,
params: ((r = (a = o.state) == null ? void 0 : a.params) == null ? void 0 : r[0]) || o.params, params: service.state?.params?.[0] || service.params,
service: o, service,
}); });
}; };

View File

@ -1,20 +1,10 @@
import { SchemaSettings } from '@tachybase/client'; import { SchemaSettings } from '@tachybase/client';
import { neItems } from '../items/neItems'; import { enableLinkItem } from './items/enableLinkItem';
import { reItems } from '../items/reItems'; import { modeSelectItem } from './items/modeSelectItem';
import { teItems } from '../items/teItems'; import { titleFieldItem } from './items/titleFieldItem';
export const DepartmentOwnersFieldSetting = new SchemaSettings({ export const DepartmentOwnersFieldSetting = new SchemaSettings({
name: 'fieldSettings:component:DepartmentOwnersField', name: 'fieldSettings:component:DepartmentOwnersField',
items: [ items: [modeSelectItem, titleFieldItem, enableLinkItem],
{
...reItems,
},
{
...teItems,
},
{
...neItems,
},
],
}); });

View File

@ -1,20 +1,10 @@
import { SchemaSettings } from '@tachybase/client'; import { SchemaSettings } from '@tachybase/client';
import { neItems } from '../items/neItems'; import { enableLinkItem } from './items/enableLinkItem';
import { reItems } from '../items/reItems'; import { modeSelectItem } from './items/modeSelectItem';
import { teItems } from '../items/teItems'; import { titleFieldItem } from './items/titleFieldItem';
export const UserDepartmentsFieldSetting = new SchemaSettings({ export const UserDepartmentsFieldSetting = new SchemaSettings({
name: 'fieldSettings:component:UserDepartmentsField', name: 'fieldSettings:component:UserDepartmentsField',
items: [ items: [modeSelectItem, titleFieldItem, enableLinkItem],
{
...reItems,
},
{
...teItems,
},
{
...neItems,
},
],
}); });

View File

@ -1,20 +1,10 @@
import { SchemaSettings } from '@tachybase/client'; import { SchemaSettings } from '@tachybase/client';
import { neItems } from '../items/neItems'; import { enableLinkItem } from './items/enableLinkItem';
import { reItems } from '../items/reItems'; import { modeSelectItem } from './items/modeSelectItem';
import { teItems } from '../items/teItems'; import { titleFieldItem } from './items/titleFieldItem';
export const UserMainDepartmentFieldSetting = new SchemaSettings({ export const UserMainDepartmentFieldSetting = new SchemaSettings({
name: 'fieldSettings:component:UserMainDepartmentField', name: 'fieldSettings:component:UserMainDepartmentField',
items: [ items: [modeSelectItem, titleFieldItem, enableLinkItem],
{
...reItems,
},
{
...teItems,
},
{
...neItems,
},
],
}); });

View File

@ -0,0 +1,40 @@
import { SchemaSettingsItemType, useColumnSchema, useDesignable } from '@tachybase/client';
import { useField, useFieldSchema } from '@tachybase/schema';
import { useTranslation } from '../../../../locale';
export const enableLinkItem: SchemaSettingsItemType = {
name: 'enableLink',
type: 'switch',
useVisible() {
return useField().readPretty;
},
useComponentProps() {
const { t } = useTranslation();
const field = useField();
const { fieldSchema: fieldSchema } = useColumnSchema();
const columnSchema = useFieldSchema();
const schema = fieldSchema || columnSchema;
const { dn } = useDesignable();
return {
title: t('Enable link'),
checked: schema['x-component-props']?.enableLink !== false,
onChange(x) {
schema['x-component-props'] = {
...schema?.['x-component-props'],
enableLink: x,
};
field.componentProps.enableLink = x;
dn.emit('patch', {
schema: {
'x-uid': schema['x-uid'],
'x-component-props': {
...schema?.['x-component-props'],
},
},
});
dn.refresh();
},
};
},
};

View File

@ -0,0 +1,32 @@
import { SchemaSettingsItemType, useColumnSchema, useDesignable, useFieldModeOptions } from '@tachybase/client';
import { useField, useFieldSchema } from '@tachybase/schema';
import { useTranslation } from '../../../../locale';
export const modeSelectItem: SchemaSettingsItemType = {
name: 'fieldComponent',
type: 'select',
useComponentProps() {
const { t } = useTranslation();
const field = useField();
const { fieldSchema, collectionField } = useColumnSchema();
const columnSchema = useFieldSchema();
const schema = fieldSchema || columnSchema;
const options = useFieldModeOptions({ fieldSchema, collectionField });
const { dn } = useDesignable();
return {
title: t('Field component'),
options,
value: 'Select',
onChange(mode) {
const newSchema = { 'x-uid': schema['x-uid'] };
schema['x-component-props'] = schema['x-component-props'] || {};
schema['x-component-props'].mode = mode;
newSchema['x-component-props'] = schema['x-component-props'];
field.componentProps = field.componentProps || {};
field.componentProps.mode = mode;
dn.emit('patch', { schema: newSchema }), dn.refresh();
},
};
},
};

View File

@ -0,0 +1,54 @@
import {
SchemaSettingsItemType,
useCollectionField,
useColumnSchema,
useDesignable,
useTitleFieldOptions,
} from '@tachybase/client';
import { useField, useFieldSchema } from '@tachybase/schema';
import { useTranslation } from '../../../../locale';
export const titleFieldItem: SchemaSettingsItemType = {
name: 'titleField',
type: 'select',
useComponentProps() {
const { t } = useTranslation();
const field = useField();
const { dn } = useDesignable();
const options = useTitleFieldOptions();
const { fieldSchema: fieldSchema, collectionField: collectionField } = useColumnSchema();
const columnFieldSchema = useFieldSchema();
const schema = fieldSchema || columnFieldSchema;
const columnCollectionField = useCollectionField();
const currentCollectionField = collectionField || columnCollectionField;
const fieldNames =
field?.componentProps?.fieldNames ||
schema?.['x-component-props']?.['fieldNames'] ||
currentCollectionField?.uiSchema?.['x-component-props']?.['fieldNames'];
return {
title: t('Title field'),
options: options,
value: fieldNames?.label,
onChange(label) {
const newSchema = { 'x-uid': schema['x-uid'] };
const fieldNames = {
...currentCollectionField?.uiSchema?.['x-component-props']?.['fieldNames'],
...schema?.['x-component-props']?.fieldNames,
label,
};
schema['x-component-props'] = schema['x-component-props'] || {};
schema['x-component-props'].fieldNames = fieldNames;
newSchema['x-component-props'] = schema['x-component-props'];
field.componentProps.fieldNames = schema['x-component-props']?.fieldNames;
const f = field.path?.splice(field.path?.length - 1, 1);
field.form.query(`${f.concat('*.' + schema.name)}`).forEach((field) => {
field.componentProps.fieldNames = fieldNames.label;
});
dn.emit('patch', { schema: newSchema });
dn.refresh();
},
};
},
};