diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/common/DepartmentTable.schema.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/DepartmentTable.schema.tsx new file mode 100644 index 000000000..4b01cca71 --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/DepartmentTable.schema.tsx @@ -0,0 +1,58 @@ +import { uid } from '@tachybase/schema'; + +export const getSchemaDepartmentTable = (params) => { + const { useDataSource } = params; + + return { + type: 'void', + properties: { + [uid()]: { + type: 'void', + 'x-component': 'RequestProvider', + 'x-component-props': { + useDataSource, + }, + properties: { + actions: { + type: 'void', + 'x-component': 'ActionBar', + 'x-component-props': { + style: { + marginBottom: 16, + }, + }, + properties: { + filter: { + type: 'void', + title: '{{ t("Filter") }}', + default: { + $and: [ + { + title: { + $includes: '', + }, + }, + ], + }, + 'x-action': 'filter', + 'x-component': 'Filter.Action', + 'x-use-component-props': 'useFilterActionProps', + 'x-component-props': { + icon: 'FilterOutlined', + }, + 'x-align': 'left', + }, + }, + }, + departments: { + type: 'array', + 'x-component': 'InternalDepartmentTable', + 'x-component-props': { + useDisabled: '{{ useDisabled }}', + }, + }, + }, + }, + }, + }; +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/common/DepartmentTable.view.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/DepartmentTable.view.tsx new file mode 100644 index 000000000..2a2809583 --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/DepartmentTable.view.tsx @@ -0,0 +1,24 @@ +import React from 'react'; +import { SchemaComponent } from '@tachybase/client'; + +import { getSchemaDepartmentTable } from './DepartmentTable.schema'; +import { InternalDepartmentTable } from './InternalDepartmentTable'; +import { ProviderRequest } from './Request.povider'; +import { useFilterActionProps } from './scopes/useFilterActionProps'; + +export const ViewDepartmentTable = ({ useDataSource, useDisabled }) => { + const schema = getSchemaDepartmentTable({ useDataSource }); + return ( + + ); +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/common/FilterKeys.context.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/FilterKeys.context.tsx new file mode 100644 index 000000000..fc2c87cde --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/FilterKeys.context.tsx @@ -0,0 +1,16 @@ +import React from 'react'; + +interface FilterKeysContextProps { + expandedKeys: any[]; + setExpandedKeys: any; + hasFilter: any; + setHasFilter: any; +} + +const ContextFilterKeys = React.createContext>({}); + +export const ProviderContextFilterKeys = ContextFilterKeys.Provider; + +export function useContextFilterKeys() { + return React.useContext(ContextFilterKeys); +} diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/common/InternalDepartmentTable.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/InternalDepartmentTable.tsx new file mode 100644 index 000000000..002986abf --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/InternalDepartmentTable.tsx @@ -0,0 +1,86 @@ +import React, { useContext, useEffect } from 'react'; +import { useResourceActionContext } from '@tachybase/client'; +import { useField } from '@tachybase/schema'; + +import { Table } from 'antd'; + +import { useTranslation } from '../../../locale'; +import { useGetDepTree } from '../main-tab/hooks/useGetDepTree'; +import { getDepartmentStr } from '../utils/getDepartmentStr'; +import { useContextFilterKeys } from './FilterKeys.context'; + +const useDisabledDefault = () => ({ + disabled: () => false, +}); + +export const InternalDepartmentTable = ({ useDisabled = useDisabledDefault }) => { + const { t } = useTranslation(); + const service = useResourceActionContext(); + + const { run, data, loading, defaultRequest } = service; + const { resource, resourceOf, params } = defaultRequest || {}; + const { treeData, initData, loadData } = useGetDepTree({ resource, resourceOf, params }); + + const field: any = useField(); + const { disabled: disabled } = useDisabled(); + + const { hasFilter, expandedKeys, setExpandedKeys } = useContextFilterKeys(); + + useEffect(() => { + if (!hasFilter) { + initData(data?.data); + } + }, [data, initData, loading, hasFilter]); + + const { count, page, pageSize } = data?.meta || {}; + + const paginationParams: any = { + defaultPageSize: params?.pageSize, + total: count, + current: page, + pageSize: pageSize, + }; + + return ( + (hasFilter ? getDepartmentStr(record) : text), + }, + ]} + rowSelection={{ + selectedRowKeys: (field?.value || []).map((fieldValue) => fieldValue.id), + onChange: (selectedRowKeys, selectedRows) => { + return field?.setValue?.(selectedRows); + }, + getCheckboxProps: () => ({ disabled: disabled() }), + }} + pagination={{ + ...paginationParams, + showSizeChanger: true, + onChange(f, S) { + let O; + run({ + ...(service?.params?.[0] || {}), + page: f, + pageSize: S, + }); + }, + }} + dataSource={hasFilter ? data?.data || [] : treeData} + expandable={{ + onExpand: (expanded, record) => { + loadData({ + key: record.id, + children: record.children, + }); + }, + expandedRowKeys: expandedKeys, + onExpandedRowsChange: (expandedRows) => setExpandedKeys(expandedRows), + }} + /> + ); +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/RequestProvider.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/Request.povider.tsx similarity index 67% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/components/RequestProvider.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/common/Request.povider.tsx index 6e4351128..9cf27d0f5 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/RequestProvider.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/Request.povider.tsx @@ -1,10 +1,10 @@ import React, { useEffect, useState } from 'react'; import { CollectionProvider_deprecated, ResourceActionContext } from '@tachybase/client'; -import { collectionDepartments } from '../collections/departments.collection'; -import { FilterKeysContext } from '../context/FilterKeysContext'; +import { collectionDepartments } from '../main-tab/collections/departments.collection'; +import { ProviderContextFilterKeys } from './FilterKeys.context'; -export const RequestProvider = (prop) => { +export const ProviderRequest = (prop) => { const [expandedKeys, setExpandedKeys] = useState([]); const [hasFilter, setHasFilter] = useState(false); const { useDataSource } = prop; @@ -15,9 +15,9 @@ export const RequestProvider = (prop) => { return ( - + {prop.children} - + ); diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/UserDepartmentsFieldNotSupport.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/UserDepartmentsFieldNotSupport.tsx similarity index 100% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/components/UserDepartmentsFieldNotSupport.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/common/UserDepartmentsFieldNotSupport.tsx diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/scopes/useDepartmentFilterActionProps.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/scopes/useDepartmentFilterActionProps.tsx similarity index 87% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/scopes/useDepartmentFilterActionProps.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/common/scopes/useDepartmentFilterActionProps.tsx index fa2d642df..7710f0f61 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/scopes/useDepartmentFilterActionProps.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/scopes/useDepartmentFilterActionProps.tsx @@ -4,9 +4,12 @@ export const useDepartmentFilterActionProps = () => { const collection = useCollection(); const options = useFilterFieldOptions(collection.fields); const service = useResourceActionContext(); - return useFilterFieldProps({ + + const result = useFilterFieldProps({ options, params: service.state?.params?.[0] || service.params, service, }); + + return result; }; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/scopes/useFilterActionProps.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/scopes/useFilterActionProps.tsx similarity index 88% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/scopes/useFilterActionProps.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/common/scopes/useFilterActionProps.tsx index c2edaae34..5b0c3e250 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/scopes/useFilterActionProps.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/common/scopes/useFilterActionProps.tsx @@ -8,11 +8,11 @@ import { } from '@tachybase/client'; import { useField } from '@tachybase/schema'; -import { useTranslation } from '../../../locale'; -import { FilterKeysContext } from '../context/FilterKeysContext'; +import { useTranslation } from '../../../../locale'; +import { useContextFilterKeys } from '../FilterKeys.context'; export const useFilterActionProps = () => { - const { setHasFilter, setExpandedKeys } = useContext(FilterKeysContext); + const { setHasFilter, setExpandedKeys } = useContextFilterKeys(); const { t } = useTranslation(); const collection = useContext(CollectionContext); const options = useFilterFieldOptions(collection.fields); diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/AddMembers.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/AddMembers.tsx deleted file mode 100644 index 141ed4653..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/AddMembers.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import React, { useContext, useRef } from 'react'; -import { SchemaComponent, useAPIClient, useResourceActionContext } from '@tachybase/client'; - -import { DepartmentsContext } from '../context/DepartmentsContext'; -import { schemaAddMembers } from '../schema/addMembers.schema'; - -export const AddMembers = () => { - const { department, useAddMembersAction, handleSelect } = useAction(); - return ( - - ); -}; - -function useAction() { - const { department } = useContext(DepartmentsContext); - const { refresh } = useResourceActionContext(); - const ref = useRef([]); - const api = useAPIClient(); - const useAddMembersAction = () => ({ - async run() { - const x = ref.current; - if (x?.length) { - await api.resource('departments.members', department.id).add({ values: x }), (ref.current = []); - refresh(); - } - }, - }); - - const handleSelect = (val) => { - ref.current = val; - }; - - return { - department, - useAddMembersAction, - handleSelect, - }; -} diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/ComponentSe.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/ComponentSe.tsx deleted file mode 100644 index 7dc2581c8..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/ComponentSe.tsx +++ /dev/null @@ -1,169 +0,0 @@ -import React, { useContext, useState } from 'react'; -import { createStyles, useAPIClient, useRequest } from '@tachybase/client'; - -import { Button, Dropdown, Empty, Input, theme } from 'antd'; -import { jsx, jsxs } from 'react/jsx-runtime'; - -import { useTranslation } from '../../../locale'; -import { DepartmentsContext } from '../context/DepartmentsContext'; - -const useStyles = createStyles(({ css }) => ({ - searchDropdown: css` - .ant-dropdown-menu { - max-height: 500px; - overflow-y: scroll; - } - `, -})); - -export const DepartmentsTree = () => { - const { t } = useTranslation(); - const { token } = theme.useToken(); - const { setDepartment, setUser } = useContext(DepartmentsContext); - const [open, setOpen] = useState(false); - const [keyword, x] = useState(''); - const [m, g] = useState([]); - const [d, A] = useState([]); - const [b, h] = useState(true); - const [F, C] = useState(true); - const { styles } = useStyles(); - const limit = 10; - const api = useAPIClient(); - const data = useRequest( - (params) => - api - .resource('departments') - .aggregateSearch(params) - .then((result) => result?.data?.data), - { - manual: true, - onSuccess: (data, params) => { - const { - values: { type: q }, - } = params[0] || {}; - if (data) { - if (!q || (q === 'user' && data.users.length < limit)) { - h(false); - } - if (!q || (q === 'department' && data.departments.length < limit)) { - C(false); - } - g((se) => [...se, ...data.users]); - A((se) => [...se, ...data.departments]); - } - }, - }, - ); - const { run } = data; - const onSearch = (keyword) => { - x(keyword); - g([]); - A([]); - h(true); - C(true); - if (keyword) { - run({ values: { keyword, limit } }); - setOpen(true); - } - }; - const onChange = (event) => { - if (!event.target.value) { - setUser(null); - x(''); - setOpen(false); - data.mutate({}); - g([]); - A([]); - } - }; - const NodeLabel = (node) => { - const title = node.title; - const parent = node.parent; - return parent ? NodeLabel(parent) + ' / ' + title : title; - }; - const LinkButton = (params) => ( - - ); - const J = () => { - const M = []; - return !m.length && !d.length - ? [ - { - key: '0', - label: , - disabled: true, - }, - ] - : (m.length && - (M.push({ - key: '0', - type: 'group', - label: t('Users'), - children: m.map((P) => ({ - key: P.username, - label: jsxs('div', { - onClick: () => setUser(P), - children: [ - jsx('div', { children: P.nickname || P.username }), - jsx('div', { - style: { fontSize: token.fontSizeSM, color: token.colorTextDescription }, - children: `${P.username}${P.phone ? ' | ' + P.phone : ''}${P.email ? ' | ' + P.email : ''}`, - }), - ], - }), - })), - }), - b && - M.push({ - type: 'group', - key: '0-loadMore', - label: jsx(LinkButton, { type: 'user', last: m[m.length - 1].id }), - })), - d.length && - (M.push({ - key: '1', - type: 'group', - label: t('Departments'), - children: d.map((P) => ({ - key: P.id, - label: jsx('div', { onClick: () => setDepartment(P), children: NodeLabel(P) }), - })), - }), - F && - M.push({ - type: 'group', - key: '1-loadMore', - label: , - })), - M); - }; - return ( - setOpen(open)} - > - { - keyword || setOpen(false); - }} - onFocus={() => setDepartment(null)} - onSearch={onSearch} - onChange={onChange} - placeholder={t('Search for departments, users')} - style={{ marginBottom: '20px' }} - /> - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/ComponentX.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/ComponentX.tsx deleted file mode 100644 index b83fcfa37..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/ComponentX.tsx +++ /dev/null @@ -1,163 +0,0 @@ -import { useContext, useEffect } from 'react'; -import { css, useAPIClient, useResourceActionContext } from '@tachybase/client'; - -import { MoreOutlined } from '@ant-design/icons'; -import { App, Dropdown, Empty, Tree } from 'antd'; -import { jsx, jsxs } from 'react/jsx-runtime'; - -import { useTranslation } from '../../../locale'; -import { DepartmentsContext } from '../context/DepartmentsContext'; -import { DepartmentsExpandedContext } from '../context/DepartmentsExpandedContext'; -import { k } from '../others/k'; -import { schemaHhe } from '../schema/schemaHhe'; -import { schemaYye } from '../schema/schemaYye'; - -export const ComponentX = () => { - const { data: e, loading: t } = useResourceActionContext(); - const { department, setDepartment, setUser } = useContext(DepartmentsContext); - const { treeData, nodeMap, loadData, loadedKeys, setLoadedKeys, initData, expandedKeys, setExpandedKeys } = - useContext(DepartmentsExpandedContext); - - const h = (v) => { - if (!v.length) return; - const l = nodeMap[v[0]]; - setDepartment(l); - setUser(null); - }; - const F = (v) => { - setExpandedKeys(v); - }; - const C = (v) => { - setLoadedKeys(v); - }; - useEffect(() => { - initData(e == null ? void 0 : e.data); - }, [e, initData, t]); - useEffect(() => { - if (!department) return; - const v = (u) => (u.parent ? [u.parent.id, ...v(u.parent)] : []), - l = v(department); - setExpandedKeys((u) => Array.from(new Set([...u, ...l]))); - }, [department, setExpandedKeys]); - - return jsx('div', { - className: css` - height: 57vh; - overflow: auto; - .ant-tree-node-content-wrapper { - overflow: hidden; - } - `, - children: - treeData != null && treeData.length - ? jsx(Tree.DirectoryTree, { - loadData: loadData, - treeData: treeData, - loadedKeys: loadedKeys, - onSelect: h, - selectedKeys: [department == null ? void 0 : department.id], - onExpand: F, - onLoad: C, - expandedKeys: expandedKeys, - expandAction: false, - showIcon: false, - fieldNames: { key: 'id' }, - }) - : jsx(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE }), - }); - // return ( - // useEffect(() => { - // initData(e == null ? void 0 : e.data); - // }, [e, initData, t]), - // useEffect(() => { - // if (!department) return; - // const v = (u) => (u.parent ? [u.parent.id, ...v(u.parent)] : []), - // l = v(department); - // setExpandedKeys((u) => Array.from(new Set([...u, ...l]))); - // }, [department, setExpandedKeys]), - // jsx('div', { - // className: css` - // height: 57vh; - // overflow: auto; - // .ant-tree-node-content-wrapper { - // overflow: hidden; - // } - // `, - // children: - // treeData != null && treeData.length - // ? jsx(Tree.DirectoryTree, { - // loadData: loadData, - // treeData: treeData, - // loadedKeys: loadedKeys, - // onSelect: h, - // selectedKeys: [department == null ? void 0 : department.id], - // onExpand: F, - // onLoad: C, - // expandedKeys: expandedKeys, - // expandAction: false, - // showIcon: false, - // fieldNames: { key: 'id' }, - // }) - // : jsx(Empty, { image: Empty.PRESENTED_IMAGE_SIMPLE }), - // }) - // ); -}; -ComponentX.Item = function ({ node: t, setVisible: o, setDrawer: a }) { - const { t: r } = useTranslation(), - { refreshAsync: c } = useResourceActionContext(), - { setLoadedKeys: i, expandedKeys: x, setExpandedKeys: m } = useContext(DepartmentsExpandedContext), - { modal: g, message: d } = App.useApp(), - A = useAPIClient(), - b = () => { - g.confirm({ - title: r('Delete'), - content: r('Are you sure you want to delete it?'), - onOk: () => - k(this, null, function* () { - yield A.resource('departments').destroy({ filterByTk: t.id }), - d.success(r('Deleted successfully')), - m((v) => v.filter((l) => l !== t.id)); - const C = [...x]; - i([]), m([]), yield c(), m(C); - }), - }); - }, - h = (C) => { - a({ schema: C, node: t }), o(true); - }, - F = ({ key: C, domEvent: v }) => { - switch ((v.stopPropagation(), C)) { - case 'new-sub': - h(schemaYye); - break; - case 'edit': - h(schemaHhe); - break; - case 'delete': - b(); - } - }; - return jsxs('div', { - style: { display: 'flex', justifyContent: 'space-between', overflow: 'hidden' }, - children: [ - jsx('div', { - style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, - children: t.title, - }), - jsx(Dropdown, { - menu: { - items: [ - { label: r('New sub department'), key: 'new-sub' }, - { label: r('Edit department'), key: 'edit' }, - { label: r('Delete department'), key: 'delete' }, - ], - onClick: F, - }, - children: jsx('div', { - style: { marginLeft: '15px' }, - children: jsx(MoreOutlined, {}), - }), - }), - ], - }); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentManagement.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentManagement.tsx deleted file mode 100644 index 9e30607c6..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentManagement.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import React from 'react'; -import { SchemaComponentOptions } from '@tachybase/client'; - -import { Col, Row } from 'antd'; - -import { useDepartmentFilterActionProps } from '../scopes/useDepartmentFilterActionProps'; -import { DepartmentsBlock } from './DepartmentsBlock'; -import { DepartmentSelect } from './DepartmentSelect'; -import { DepartmentsResourceProvider } from './DepartmentsResourceProvider'; -import { DepartmentsUsersBlock } from './DepartmentsUsersBlock'; -import { SuperiorDepartmentSelect } from './SuperiorDepartmentSelect'; -import { UserResourceProvider } from './UserResourceProvider'; - -export const DepartmentManagement = () => { - return ( - - - - - - - - - - - - - - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentManagementComponent.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentManagementComponent.tsx deleted file mode 100644 index ce044fd63..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentManagementComponent.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react'; -import { SchemaComponent } from '@tachybase/client'; -import { uid } from '@tachybase/schema'; - -import { DepartmentManagement } from './DepartmentManagement'; - -export const DepartmentManagementComponent = () => { - return ( - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentOwnersField.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentOwnersField.tsx deleted file mode 100644 index 9b2cdfebd..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentOwnersField.tsx +++ /dev/null @@ -1,73 +0,0 @@ -import { useEffect, useRef, useState } from 'react'; -import { - ActionContextProvider, - ResourceActionProvider, - SchemaComponent, - useActionContext, - useRecord, -} from '@tachybase/client'; -import { useField } from '@tachybase/schema'; - -import { Select } from 'antd'; -import { jsx, jsxs } from 'react/jsx-runtime'; - -import { schemaFfe } from '../schema/schemaFfe'; - -export const DepartmentOwnersField = () => { - const [e, t] = useState(false), - o = useRecord(), - a = useField(), - [r, c] = useState([]), - i = useRef([]), - x = (d, A) => { - i.current = A; - }, - m = () => { - const { setVisible: d } = useActionContext(); - return { - run() { - const A = a.value || []; - a.setValue([...A, ...i.current]), (i.current = []), d(false); - }, - }; - }; - useEffect(() => { - a.value && c(a.value.map((d) => ({ value: d.id, label: d.nickname || d.username }))); - }, [a.value]); - const g = (d) => { - var A; - return jsx(ResourceActionProvider, { - collection: 'users', - request: { - resource: `departments/${o.id}/members`, - action: 'list', - params: { filter: (A = a.value) != null && A.length ? { id: { $notIn: a.value.map((b) => b.id) } } : {} }, - }, - children: d.children, - }); - }; - return jsxs(ActionContextProvider, { - value: { visible: e, setVisible: t }, - children: [ - jsx(Select, { - open: false, - onChange: (d) => { - if (!d) { - a.setValue([]); - return; - } - a.setValue(d.map(({ label: A, value: b }) => ({ id: b, nickname: A }))); - }, - mode: 'multiple', - value: r, - labelInValue: true, - onDropdownVisibleChange: (d) => t(d), - }), - jsx(SchemaComponent, { - schema: schemaFfe, - components: { RequestProvider: g }, - scope: { department: o, handleSelect: x, useSelectOwners: m }, - }), - ], - }); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentSelect.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentSelect.tsx deleted file mode 100644 index 76434ebda..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentSelect.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import React, { useContext } from 'react'; - -import { DepartmentsContext } from '../context/DepartmentsContext'; -import { useDepTree2 } from '../hooks/useDepTree2'; -import { InternalSuperiorDepartmentSelect } from './InternalSuperiorDepartmentSelect'; - -export const DepartmentSelect = () => { - const depTree = useDepTree2(); - const { departmentsResource } = useContext(DepartmentsContext); - const { - service: { data }, - } = departmentsResource || {}; - return ; -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentTable.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentTable.tsx deleted file mode 100644 index 8dff941e9..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentTable.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import React from 'react'; -import { SchemaComponent } from '@tachybase/client'; -import { uid } from '@tachybase/schema'; - -import { useFilterActionProps } from '../scopes/useFilterActionProps'; -import { InternalDepartmentTable } from './InternalDepartmentTable'; -import { RequestProvider } from './RequestProvider'; - -export const DepartmentTable = ({ useDataSource, useDisabled }) => ( - -); diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentTitle.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentTitle.tsx deleted file mode 100644 index 6414e1fde..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentTitle.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react'; -import { useRecord } from '@tachybase/client'; - -export const DepartmentTitle = () => { - const record = useRecord(); - const title = (dep) => { - const title = dep.title; - const parent = dep.parent; - return parent ? title(parent) + ' / ' + title : title; - }; - return <>{title(record)}; -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/Departments.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/Departments.tsx deleted file mode 100644 index 63ae5ef98..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/Departments.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import React, { useContext, useMemo } from 'react'; -import { CollectionProvider_deprecated, ResourceActionContext, SchemaComponent, useRequest } from '@tachybase/client'; -import { RolesManagerContext } from '@tachybase/plugin-acl/client'; - -import { useTranslation } from '../../../locale'; -import { collectionDepartments } from '../collections/departments.collection'; -import { useAddDepartments } from '../hooks/useAddDepartments'; -import { useBulkRemoveDepartmentsYyt } from '../hooks/useBulkRemoveDepartmentsYyt'; -import { useDataSource2 } from '../hooks/useDataSource2'; -import { useDisabledVvt } from '../hooks/useDisabledVvt'; -import { useRemoveDepartmentXxt } from '../hooks/useRemoveDepartmentXxt'; -import { getSchemaDdt } from '../schema/getSchemaDdt'; -import { useDepartmentFilterActionProps } from '../scopes/useDepartmentFilterActionProps'; -import { DepartmentTable } from './DepartmentTable'; -import { DepartmentTitle } from './DepartmentTitle'; - -export const Departments = () => { - const { t } = useTranslation(); - const { role } = useContext(RolesManagerContext); - const resource = useRequest( - { - resource: `roles/${role?.name}/departments`, - action: 'list', - params: { appends: ['parent', 'parent.parent(recursively=true)'] }, - }, - { ready: !!role, refreshDeps: [role] }, - ); - const schema = useMemo(() => getSchemaDdt(), [role]); - return ( - - - - - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentsProvider.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentsProvider.tsx deleted file mode 100644 index 87455241c..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentsProvider.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import React, { useState } from 'react'; -import { useRequest } from '@tachybase/client'; - -import { DepartmentsContext } from '../context/DepartmentsContext'; - -export const DepartmentsProvider = ({ children }) => { - const [user, setUser] = useState(null); - const [department, setDepartment] = useState(null); - const usersRequest = useRequest( - { - resource: 'users', - action: 'list', - params: { - appends: ['departments', 'departments.parent(recursively=true)'], - filter: department ? { 'departments.id': department.id } : {}, - pageSize: 50, - }, - }, - { - manual: true, - refreshDeps: [department], - }, - ); - const departmentsRequest = useRequest({ - resource: 'departments', - action: 'list', - params: { pagination: false, filter: { parentId: null } }, - }); - return ( - - {children} - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentsUsersBlock.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentsUsersBlock.tsx deleted file mode 100644 index 428a17b1d..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/DepartmentsUsersBlock.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import React, { useContext, useEffect, useMemo } from 'react'; -import { SchemaComponent, useResourceActionContext } from '@tachybase/client'; - -import { useTranslation } from '../../../locale'; -import { DepartmentsContext } from '../context/DepartmentsContext'; -import { useBulkRemoveMembersAction } from '../hooks/useBulkRemoveMembersAction'; -import { useMembersDataSource } from '../hooks/useMembersDataSource'; -import { useRemoveMemberAction } from '../hooks/useRemoveMemberAction'; -import { useShowTotal } from '../hooks/useShowTotal'; -import { getSchemaHe } from '../schema/getSchemaHe'; -import { schemaWe } from '../schema/schemaWe'; -import { schemaZe } from '../schema/schemaZe'; -import { useDepartmentFilterActionProps } from '../scopes/useDepartmentFilterActionProps'; -import { AddMembers } from './AddMembers'; -import { DepartmentField } from './DepartmentField'; -import { IsOwnerField } from './IsOwnerField'; -import { UserDepartmentsField } from './UserDepartmentsField'; - -export const DepartmentsUsersBlock = () => { - const { t } = useTranslation(); - const { department, user } = useContext(DepartmentsContext); - const { data, setState } = useResourceActionContext(); - - const MemberActions = () => (department ? : null); - const RowRemoveAction = () => - department ? ( - - ) : null; - - const schema = useMemo(() => getSchemaHe(department, user), [department, user]); - - useEffect(() => { - setState?.({ - selectedRowKeys: [], - }); - }, [data, setState]); - - return ( - <> -

{user ? t('Search results') : t(department?.title ?? 'All users')}

- - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/InternalDepartmentTable.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/InternalDepartmentTable.tsx deleted file mode 100644 index 4bb9efcf9..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/InternalDepartmentTable.tsx +++ /dev/null @@ -1,60 +0,0 @@ -import { useContext, useEffect } from 'react'; -import { useResourceActionContext } from '@tachybase/client'; -import { useField } from '@tachybase/schema'; - -import { Table } from 'antd'; -import { jsx } from 'react/jsx-runtime'; - -import { useTranslation } from '../../../locale'; -import { FilterKeysContext } from '../context/FilterKeysContext'; -import { useDepTree2 } from '../hooks/useDepTree2'; -import { T } from '../others/T'; -import { y } from '../others/y'; -import { getDepartmentStr } from '../utils/getDepartmentStr'; - -const Ze = () => ({ disabled: () => false }); -export const InternalDepartmentTable = ({ useDisabled: e = Ze }) => { - const { t } = useTranslation(), - o = useResourceActionContext(); - console.log(o); - const { run: a, data: r, loading: c, defaultRequest: i } = o, - { resource: x, resourceOf: m, params: g } = i || {}, - { treeData: d, initData: A, loadData: b } = useDepTree2({ resource: x, resourceOf: m, params: g }), - h = useField(), - { disabled: F } = e(), - { hasFilter: C, expandedKeys: v, setExpandedKeys: l } = useContext(FilterKeysContext); - useEffect(() => { - C || A(r == null ? void 0 : r.data); - }, [r, A, c, C]); - const u = {}; - if ((g != null && g.pageSize && (u.defaultPageSize = g.pageSize), !u.total && r != null && r.meta)) { - const { count: f, page: S, pageSize: O } = r.meta; - (u.total = f), (u.current = S), (u.pageSize = O); - } - return jsx(Table, { - rowKey: 'id', - columns: [{ dataIndex: 'title', title: t('Department name'), render: (f, S) => (C ? getDepartmentStr(S) : f) }], - rowSelection: { - selectedRowKeys: ((h == null ? void 0 : h.value) || []).map((f) => f.id), - onChange: (f, S) => { - let O; - return (O = h == null ? void 0 : h.setValue) == null ? void 0 : O.call(h, S); - }, - getCheckboxProps: (f) => ({ disabled: F(f) }), - }, - pagination: T(y({ showSizeChanger: true }, u), { - onChange(f, S) { - let O; - a(T(y({}, ((O = o == null ? void 0 : o.params) == null ? void 0 : O[0]) || {}), { page: f, pageSize: S })); - }, - }), - dataSource: C ? (r == null ? void 0 : r.data) || [] : d, - expandable: { - onExpand: (f, S) => { - b({ key: S.id, children: S.children }); - }, - expandedRowKeys: v, - onExpandedRowsChange: (f) => l(f), - }, - }); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/NewDepartment.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/NewDepartment.tsx deleted file mode 100644 index 935214897..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/NewDepartment.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import React from 'react'; -import { SchemaComponent } from '@tachybase/client'; - -import { useTranslation } from '../../../locale'; - -export const NewDepartment = () => { - const { t } = useTranslation(); - return ( - - ); -}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/UserDepartmentsField.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/components/UserDepartmentsField.tsx deleted file mode 100644 index 9e8ba4a90..000000000 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/UserDepartmentsField.tsx +++ /dev/null @@ -1,172 +0,0 @@ -import React, { Fragment, useState } from 'react'; -import { - ActionContextProvider, - SchemaComponent, - useAPIClient, - useRecord, - useRequest, - useResourceActionContext, -} from '@tachybase/client'; -import { Field, useField, useForm } from '@tachybase/schema'; - -import { MoreOutlined, PlusOutlined } from '@ant-design/icons'; -import { App, Button, Dropdown, Tag } from 'antd'; -import { jsx, jsxs } from 'react/jsx-runtime'; - -import { useTranslation } from '../../../locale'; -import { useDataSource } from '../hooks/useDataSource'; -import { schemaJe } from '../schema/schemaJe'; -import { getDepartmentStr } from '../utils/getDepartmentStr'; -import { DepartmentTable } from './DepartmentTable'; - -export const UserDepartmentsField = () => { - const { modal, message } = App.useApp(); - const { t } = useTranslation(); - const [visible, setVisible] = useState(false); - const user = useRecord(); - const field = useField(); - const { refresh } = useResourceActionContext(); - const m = (l) => - l != null && l.length - ? l.map((u) => { - return { - ...u, - isMain: u.departmentsUsers?.isMain, - isOwner: u.departmentsUsers?.isOwner, - title: getDepartmentStr(u), - }; - }) - : []; - const api = useAPIClient(); - useRequest( - () => - api - .resource('users.departments', user.id) - .list({ appends: ['parent(recursively=true)'], pagination: false }) - .then((result) => { - const u = m(result?.data?.data); - field.setValue(u); - }), - { ready: user.id }, - ); - const useAddDepartments = () => { - const api = useAPIClient(); - const form = useForm(); - const { departments } = form.values || {}; - return { - async run() { - await api.resource('users.departments', user.id).add({ values: departments.map((O) => O.id) }); - form.reset(); - field.setValue([ - ...field.value, - ...departments.map((department, index) => ({ - ...department, - isMain: index === 0 && field.value.length === 0, - title: getDepartmentStr(department), - })), - ]); - setVisible(false); - refresh(); - }, - }; - }; - const A = (department) => { - modal.confirm({ - title: t('Remove department'), - content: t('Are you sure you want to remove it?'), - onOk: async () => { - await api.resource('users.departments', user.id).remove({ values: [department.id] }); - message.success(t('Deleted successfully')); - field.setValue( - field.value - .filter((dep) => dep.id !== department.id) - .map((dep, index) => ({ ...dep, isMain: (department.isMain && index === 0) || dep.isMain })), - ); - refresh(); - }, - }); - }; - const b = async (l) => { - await api.resource('users').setMainDepartment({ values: { userId: user.id, departmentId: l.id } }); - message.success(t('Set successfully')); - field.setValue(field.value.map((u) => ({ ...u, isMain: u.id === l.id }))); - refresh(); - }; - const h = async (l) => { - await api.resource('departments').setOwner({ values: { userId: user.id, departmentId: l.id } }); - message.success(t('Set successfully')); - field.setValue(field.value.map((u) => ({ ...u, isOwner: u.id === l.id ? true : u.isOwner }))); - refresh(); - }; - const F = async (department) => { - await api.resource('departments').removeOwner({ values: { userId: user.id, departmentId: department.id } }); - message.success(t('Set successfully')); - field.setValue(field.value.map((dep) => ({ ...dep, isOwner: dep.id === department.id ? false : dep.isOwner }))); - refresh(); - }; - const C = (l, u) => { - switch (l) { - case 'setMain': - b(u); - break; - case 'setOwner': - h(u); - break; - case 'removeOwner': - F(u); - break; - case 'remove': - A(u); - } - }; - const useDisabled = () => ({ disabled: (l) => field.value.some((u) => u.id === l.id) }); - return jsxs(ActionContextProvider, { - value: { visible: visible, setVisible: setVisible }, - children: [ - jsxs(Fragment, { - children: [ - (field?.value || []).map((l) => - jsxs( - Tag, - { - style: { padding: '5px 8px', background: 'transparent', marginBottom: '5px' }, - children: [ - jsx('span', { style: { marginRight: '5px' }, children: l.title }), - l.isMain ? jsx(Tag, { color: 'processing', bordered: false, children: t('Main') }) : '', - jsx(Dropdown, { - menu: { - items: [ - ...(l.isMain ? [] : [{ label: t('Set as main department'), key: 'setMain' }]), - { label: t('Remove'), key: 'remove' }, - ], - onClick: ({ key: u }) => C(u, l), - }, - children: jsx('div', { - style: { float: 'right' }, - children: jsx(MoreOutlined, {}), - }), - }), - ], - }, - l.id, - ), - ), - + + + + + + + + + + + +); diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/DepartmentManagement.schema.ts b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/DepartmentManagement.schema.ts new file mode 100644 index 000000000..483c14c3b --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/DepartmentManagement.schema.ts @@ -0,0 +1,12 @@ +import { uid } from '@tachybase/schema'; + +export const schemaDepartmentManagement = { + type: 'void', + properties: { + [uid()]: { + type: 'void', + 'x-decorator': 'CardItem', + 'x-component': 'DepartmentManagement', + }, + }, +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/DepartmentManagement.view.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/DepartmentManagement.view.tsx new file mode 100644 index 000000000..470ada2de --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/DepartmentManagement.view.tsx @@ -0,0 +1,16 @@ +import React from 'react'; +import { SchemaComponent } from '@tachybase/client'; + +import { DepartmentManagement } from './DepartmentManagement.component'; +import { schemaDepartmentManagement as schema } from './DepartmentManagement.schema'; + +export const ViewDepartmentManagement = () => { + return ( + + ); +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/collections/departments.collection.ts b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/collections/departments.collection.ts similarity index 100% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/collections/departments.collection.ts rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/collections/departments.collection.ts diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/collections/users.collection.ts b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/collections/users.collection.ts similarity index 100% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/collections/users.collection.ts rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/collections/users.collection.ts diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/DepartmentSelect.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/DepartmentSelect.tsx new file mode 100644 index 000000000..eef831b03 --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/DepartmentSelect.tsx @@ -0,0 +1,14 @@ +import React, { useContext } from 'react'; + +import { ContextDepartments } from '../context/Department.context'; +import { useGetDepTree } from '../hooks/useGetDepTree'; +import { InternalSuperiorDepartmentSelect } from './InternalSuperiorDepartmentSelect'; + +export const DepartmentSelect = () => { + const depTree = useGetDepTree(); + const { departmentsResource } = useContext(ContextDepartments); + const { service } = departmentsResource || {}; + const { data } = service || {}; + + return ; +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/InternalSuperiorDepartmentSelect.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/InternalSuperiorDepartmentSelect.tsx similarity index 73% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/components/InternalSuperiorDepartmentSelect.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/InternalSuperiorDepartmentSelect.tsx index 867b6c83c..186c7e64a 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/InternalSuperiorDepartmentSelect.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/InternalSuperiorDepartmentSelect.tsx @@ -3,7 +3,7 @@ import { useField } from '@tachybase/schema'; import { TreeSelect } from 'antd'; -import { getDepartmentStr } from '../utils/getDepartmentStr'; +import { getDepartmentStr } from '../../utils/getDepartmentStr'; interface tempField { value?: any; @@ -19,23 +19,30 @@ interface IState { export const InternalSuperiorDepartmentSelect = (props) => { const field = useField(); const [value, setValue] = useState({ label: null, value: null }); + const { treeData, initData, getByKeyword, loadData, loadedKeys, setLoadedKeys, originData } = props; - const onSearch = async (h) => { - if (!h) { + + const onSearch = async (keyword) => { + if (!keyword) { initData(originData); return; } - await getByKeyword(h); + await getByKeyword(keyword); }; useEffect(() => { initData(originData); }, [originData, initData]); + useEffect(() => { if (!field.value) { - setValue({ label: null, value: null }); + setValue({ + label: null, + value: null, + }); return; } + setValue({ label: getDepartmentStr(field.value) || field.value.label, value: field.value.id, @@ -45,16 +52,21 @@ export const InternalSuperiorDepartmentSelect = (props) => { return ( { + onSelect={(value, currValue) => { field.setValue(currValue); }} - onChange={(h) => { - h || field.setValue(null); + onChange={(value) => { + value || field.setValue(null); }} treeData={treeData} treeLoadedKeys={loadedKeys} onTreeLoad={(keys) => setLoadedKeys(keys)} - loadData={(value) => loadData({ key: value.id, children: value.children })} + loadData={(value) => + loadData({ + key: value.id, + children: value.children, + }) + } fieldNames={{ value: 'id' }} showSearch={true} allowClear={true} diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/SuperiorDepartmentSelect.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/SuperiorDepartmentSelect.tsx similarity index 78% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/components/SuperiorDepartmentSelect.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/SuperiorDepartmentSelect.tsx index db8b63517..183c4a3e2 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/components/SuperiorDepartmentSelect.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/components/SuperiorDepartmentSelect.tsx @@ -1,27 +1,33 @@ import React, { useContext, useEffect } from 'react'; import { useRecord } from '@tachybase/client'; -import { DepartmentsContext } from '../context/DepartmentsContext'; -import { useDepTree2 } from '../hooks/useDepTree2'; +import { ContextDepartments } from '../context/Department.context'; +import { useGetDepTree } from '../hooks/useGetDepTree'; import { InternalSuperiorDepartmentSelect } from './InternalSuperiorDepartmentSelect'; export const SuperiorDepartmentSelect = () => { - const depTree = useDepTree2(); + const depTree = useGetDepTree(); const { setTreeData, getChildrenIds } = depTree; const record = useRecord(); - const { departmentsResource } = useContext(DepartmentsContext); + const { departmentsResource } = useContext(ContextDepartments); const { service: { data }, } = departmentsResource || {}; + useEffect(() => { if (!record.id) return; + const ids = getChildrenIds(record.id); + ids.push(record.id); + setTreeData((x) => { const m = (g) => g.map((d) => (ids.includes(d.id) && (d.disabled = true), d.children && (d.children = m(d.children)), d)); + return m(x); }); }, [setTreeData, record.id, getChildrenIds]); + return ; }; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/context/DepartmentsContext.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/context/Department.context.tsx similarity index 69% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/context/DepartmentsContext.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/context/Department.context.tsx index 700ea5a38..b4cb7cda5 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/context/DepartmentsContext.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/context/Department.context.tsx @@ -20,13 +20,13 @@ interface contextType { }; } -export const DepartmentsContext = React.createContext({ +export const ContextDepartments = React.createContext({ user: {}, department: {}, }); -export const DepartmentsContextProvider = DepartmentsContext.Provider; +export const ProviderContextDepartments = ContextDepartments.Provider; -export function useDepartments() { - return useContext(DepartmentsContext); +export function useContextDepartments() { + return useContext(ContextDepartments); } diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/context/DepartmentsExpandedContext.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/context/DepartmentsExpanded.context.tsx similarity index 59% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/context/DepartmentsExpandedContext.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/context/DepartmentsExpanded.context.tsx index 94e9e7415..9b1236803 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/context/DepartmentsExpandedContext.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/context/DepartmentsExpanded.context.tsx @@ -1,6 +1,6 @@ import React, { useContext } from 'react'; -export interface DepartmentsExpandedProps { +interface DepartmentsExpandedProps { initData: (C: any) => void; treeData: any[]; setTreeData: React.Dispatch>; @@ -14,10 +14,10 @@ export interface DepartmentsExpandedProps { setExpandedKeys: React.Dispatch>; } -export const DepartmentsExpandedContext = React.createContext>({}); +const ContextDepartmentsExpanded = React.createContext>({}); -export const DepartmentsExpandedContextProvider = DepartmentsExpandedContext.Provider; +export const ProviderContextDepartmentsExpanded = ContextDepartmentsExpanded.Provider; -export function useDepartmentsExpanded() { - return useContext(DepartmentsExpandedContext); +export function useContextDepartmentsExpanded() { + return useContext(ContextDepartmentsExpanded); } diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/AddNewDepartment.schema.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/AddNewDepartment.schema.tsx new file mode 100644 index 000000000..6a7ad60fc --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/AddNewDepartment.schema.tsx @@ -0,0 +1,53 @@ +import { tval } from '../../../../locale'; + +export const getSchemaAddNewDepartment = () => { + return { + type: 'void', + properties: { + newDepartment: { + type: 'void', + title: tval('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: tval('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 }}' }, + }, + }, + }, + }, + }, + }, + }, + }, + }; +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/AddNewDepartment.view.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/AddNewDepartment.view.tsx new file mode 100644 index 000000000..f1138d2d8 --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/AddNewDepartment.view.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import { SchemaComponent } from '@tachybase/client'; + +import { getSchemaAddNewDepartment } from './AddNewDepartment.schema'; + +export const AddNewDepartment = () => { + const schema = getSchemaAddNewDepartment(); + return ; +}; diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/schema/schemaHhe.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentEdit.schema.tsx similarity index 50% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/schema/schemaHhe.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentEdit.schema.tsx index d2d8ae78c..c40d38357 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/schema/schemaHhe.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentEdit.schema.tsx @@ -2,9 +2,7 @@ import { useEffect } from 'react'; import { useActionContext, useAPIClient, useRecord, useRequest } from '@tachybase/client'; import { uid } from '@tachybase/schema'; -import { T } from '../others/T'; - -export const schemaHhe = { +export const schemaDepartmentEdit = { type: 'object', properties: { [uid()]: { @@ -12,24 +10,28 @@ export const schemaHhe = { 'x-component': 'Action.Drawer', 'x-decorator': 'Form', 'x-decorator-props': { - useValues(e) { - const t = useAPIClient(), - o = useActionContext(), - a = useRecord(), - r = useRequest( - () => - t - .resource('departments') - .get({ filterByTk: a.id, appends: ['parent(recursively=true)', 'roles', 'owners'] }) - .then((c) => (c == null ? void 0 : c.data)), - T({ ...e }, { manual: true }), - ); - return ( - useEffect(() => { - o.visible && r.run(); - }, [o.visible]), - r + useValues(options) { + const API = useAPIClient(); + const ctx = useActionContext(); + const record = useRecord(); + const result = useRequest( + () => + API.resource('departments') + .get({ + filterByTk: record.id, + appends: ['parent(recursively=true)', 'roles', 'owners'], + }) + .then((res) => res?.data), + { + ...options, + manual: true, + }, ); + + useEffect(() => { + ctx.visible && result.run(); + }, [ctx.visible]); + return result; }, }, title: '{{t("Edit department")}}', @@ -39,14 +41,20 @@ export const schemaHhe = { 'x-component': 'CollectionField', 'x-decorator': 'FormItem', 'x-collection-field': 'departments.parent', - 'x-component-props': { component: 'SuperiorDepartmentSelect' }, + 'x-component-props': { + component: 'SuperiorDepartmentSelect', + }, }, roles: { 'x-component': 'CollectionField', 'x-decorator': 'FormItem', 'x-collection-field': 'departments.roles', }, - owners: { title: '{{t("Owners")}}', 'x-component': 'DepartmentOwnersField', 'x-decorator': 'FormItem' }, + owners: { + title: '{{t("Owners")}}', + 'x-component': 'DepartmentOwnersField', + 'x-decorator': 'FormItem', + }, footer: { type: 'void', 'x-component': 'Action.Drawer.Footer', @@ -54,12 +62,17 @@ export const schemaHhe = { cancel: { title: '{{t("Cancel")}}', 'x-component': 'Action', - 'x-component-props': { useAction: '{{ cm.useCancelAction }}' }, + 'x-component-props': { + useAction: '{{ cm.useCancelAction }}', + }, }, submit: { title: '{{t("Submit")}}', 'x-component': 'Action', - 'x-component-props': { type: 'primary', useAction: '{{ useUpdateDepartment }}' }, + 'x-component-props': { + type: 'primary', + useAction: '{{ useUpdateDepartment }}', + }, }, }, }, diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/schema/schemaYye.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentNewSub.schema.tsx similarity index 57% rename from packages/plugins/@hera/plugin-core/src/client/features/departments/schema/schemaYye.tsx rename to packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentNewSub.schema.tsx index 9083b4f14..f2d51fb2a 100644 --- a/packages/plugins/@hera/plugin-core/src/client/features/departments/schema/schemaYye.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentNewSub.schema.tsx @@ -1,33 +1,44 @@ import { useActionContext, useRecord, useRequest } from '@tachybase/client'; import { uid } from '@tachybase/schema'; -import { T } from '../others/T'; - -export const schemaYye = { +export const schemaDepartmentNewSub = { type: 'object', properties: { [uid()]: { + title: '{{t("New sub department")}}', type: 'void', 'x-component': 'Action.Drawer', 'x-decorator': 'Form', 'x-decorator-props': { - useValues(e) { - const t = useActionContext(), - o = useRecord(); + useValues(options) { + const ctx = useActionContext(); + const record = useRecord(); return useRequest( - () => Promise.resolve({ data: { parent: { ...o } } }), - T({ ...e }, { refreshDeps: [t.visible] }), + () => + Promise.resolve({ + data: { + parent: { ...record }, + }, + }), + { + ...options, + refreshDeps: [ctx.visible], + }, ); }, }, - title: '{{t("New sub department")}}', properties: { - title: { 'x-component': 'CollectionField', 'x-decorator': 'FormItem' }, + title: { + 'x-component': 'CollectionField', + 'x-decorator': 'FormItem', + }, parent: { 'x-component': 'CollectionField', 'x-decorator': 'FormItem', 'x-collection-field': 'departments.parent', - 'x-component-props': { component: 'DepartmentSelect' }, + 'x-component-props': { + component: 'DepartmentSelect', + }, }, roles: { 'x-component': 'CollectionField', @@ -41,12 +52,17 @@ export const schemaYye = { cancel: { title: '{{t("Cancel")}}', 'x-component': 'Action', - 'x-component-props': { useAction: '{{ cm.useCancelAction }}' }, + 'x-component-props': { + useAction: '{{ cm.useCancelAction }}', + }, }, submit: { title: '{{t("Submit")}}', 'x-component': 'Action', - 'x-component-props': { type: 'primary', useAction: '{{ useCreateDepartment }}' }, + 'x-component-props': { + type: 'primary', + useAction: '{{ useCreateDepartment }}', + }, }, }, }, diff --git a/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentOwnersField.component.tsx b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentOwnersField.component.tsx new file mode 100644 index 000000000..774ff9188 --- /dev/null +++ b/packages/plugins/@hera/plugin-core/src/client/features/departments/main-tab/departments-block/DepartmentOwnersField.component.tsx @@ -0,0 +1,67 @@ +import React, { useEffect, useRef, useState } from 'react'; +import { ActionContextProvider, useActionContext, useRecord } from '@tachybase/client'; +import { useField } from '@tachybase/schema'; + +import { Select } from 'antd'; + +import { ViewUnKnownOwerns } from './UnknownOwerns.view'; + +export const DepartmentOwnersField = () => { + const [visible, setVisible] = useState(false); + const record = useRecord(); + const field: any = useField(); + const [value, setValue] = useState([]); + const ref = useRef([]); + + const handleSelect = (d, currValue) => { + ref.current = currValue; + }; + + const useSelectOwners = () => { + const { setVisible: setVisible } = useActionContext(); + return { + run() { + const fieldValue = field.value || []; + field.setValue([...fieldValue, ...ref.current]); + ref.current = []; + setVisible(false); + }, + }; + }; + + useEffect(() => { + if (field.value) { + const fieldValue = field.value.map((item) => ({ + value: item.id, + label: item.nickname || item.username, + })); + setValue(fieldValue); + } + }, [field.value]); + + return ( + +