test/nocobase2
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2024-11-30 03:08:31 +08:00
Code Issues Actions 17 Packages Projects Releases Wiki Activity

feat: improve view mode

Browse Source
This commit is contained in:
chenos 2021-01-07 09:31:26 +08:00
parent ee6cc5a665
commit 551f8bad8d
7 changed files with 110 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/app/src/api/index.ts
View File

@ -71,21 +71,21 @@ api.resourcer.use(async (ctx: actions.Context, next) => {
}
if (table && ['get', 'list'].includes(actionName)) {
const except = fields.except || [];
const appends = fields.appends || [];
// const appends = fields.appends || [];
for (const [name, field] of table.getFields()) {
if (field.options.hidden) {
except.push(field.options.name);
}
if (field.options.appends) {
appends.push(field.options.name);
}
// if (field.options.appends) {
// appends.push(field.options.name);
// }
}
if (except.length) {
ctx.action.setParam('fields.except', except);
}
if (appends.length) {
ctx.action.setParam('fields.appends', appends);
}
// if (appends.length) {
// ctx.action.setParam('fields.appends', appends);
// }
// console.log('ctx.action.params.fields', ctx.action.params.fields, except, appends);
}
await next();
@ -120,6 +120,10 @@ api.registerPlugin('plugin-file-manager', [path.resolve(__dirname, '../../../plu
(async () => {
await api.loadPlugins();
api.database.getModel('users').addHook('beforeUpdate', function (model) {
console.log('users.beforeUpdate', model.get(), model.changed('password' as any));
});
api.resourcer.use(async (ctx, next) => {
if (process.env.NOCOBASE_ENV !== 'demo') {
return next();

14
packages/app/src/api/migrations/add-fields-to-views.ts
View File

@ -7,7 +7,7 @@ import Database from '@nocobase/database';
await api.database.sync({
tables: ['views'],
});
const [Collection, Page, User] = database.getModels(['collections', 'pages', 'users']);
const [Collection, View, User] = database.getModels(['collections', 'views', 'users']);
const table = database.getTable('views');
const collection = await Collection.findByName('views');
console.log(table.getOptions().fields);
@ -16,4 +16,16 @@ import Database from '@nocobase/database';
}, {
migrate: false,
});
const views = await View.findAll();
for (const view of views) {
if (!view.get('mode')) {
if (view.get('template') === 'SimpleTable') {
view.set('mode', 'simple');
} else {
view.set('mode', 'default');
}
await view.save();
}
}
})();

16
packages/app/src/components/views/Calendar/index.tsx
View File

@ -1,6 +1,7 @@
import React, { useEffect, useRef, useState } from 'react';
import { Table as AntdTable, Card, Pagination } from 'antd';
import { Actions } from '@/components/actions';
import { redirectTo } from '@/components/pages/CollectionLoader/utils';
import ViewFactory from '@/components/views';
import { useRequest } from 'umi';
import api from '@/api-client';
@ -56,7 +57,7 @@ export function Calendar(props: CalendarProps) {
multiple = true,
selectedRowKeys: srk,
} = props;
const { rowKey = 'id', labelField, startDateField, endDateField, name: viewName, actionDefaultParams = {}, fields = [], rowViewName, actions = [], paginated = true, defaultPerPage = 10 } = schema;
const { rowKey = 'id', mode, defaultTabName, labelField, startDateField, endDateField, name: viewName, actionDefaultParams = {}, fields = [], rowViewName, actions = [], paginated = true, defaultPerPage = 10 } = schema;
const { filter: defaultFilter = {} } = actionDefaultParams;
const { sourceKey = 'id' } = activeTab.field||{};
const drawerRef = useRef<any>();
@ -210,6 +211,19 @@ export function Calendar(props: CalendarProps) {
setFormMode('update');
drawerRef.current.setVisible(true);
drawerRef.current.getData(event[rowKey]);
if (mode === 'simple') {
drawerRef.current.setVisible(true);
drawerRef.current.getData(event[rowKey]);
} else {
redirectTo({
...props.match.params,
[activeTab ? 'newItem' : 'lastItem']: {
itemId: event[rowKey]||event.id,
tabName: defaultTabName,
},
});
}
// drawerRef.current.
}}
onRangeChange={(range) => {

47
packages/app/src/components/views/Table.tsx
View File

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import React, { useEffect, useState, useRef } from 'react';
import { Table as AntdTable, Card, Pagination } from 'antd';
import { redirectTo } from '@/components/pages/CollectionLoader/utils';
import { Actions } from '@/components/actions';
@ -6,6 +6,7 @@ import { request, useRequest } from 'umi';
import api from '@/api-client';
import { components, fields2columns } from './SortableTable';
import { LoadingOutlined } from '@ant-design/icons';
import ViewFactory from '@/components/views';
export const icon = <LoadingOutlined style={{ fontSize: 36 }} spin />;
@ -30,7 +31,18 @@ export function Table(props: TableProps) {
multiple = true,
selectedRowKeys: srk,
} = props;
const { name: viewName, fields, actionDefaultParams = {}, defaultTabName, rowKey = 'id', actions = [], paginated = true, defaultPerPage = 10 } = schema;
const {
name: viewName,
mode = 'default',
rowViewName = 'form',
fields,
actionDefaultParams = {},
defaultTabName,
rowKey = 'id',
actions = [],
paginated = true,
defaultPerPage = 10,
} = schema;
// const { data, mutate } = useRequest(() => api.resource(name).list({
// associatedKey,
// }));
@ -70,6 +82,7 @@ export function Table(props: TableProps) {
defaultPageSize: defaultPerPage,
});
const { sourceKey = 'id' } = activeTab.field||{};
const drawerRef = useRef<any>();
console.log(props);
const [selectedRowKeys, setSelectedRowKeys] = useState(srk||[]);
const onChange = (selectedRowKeys: React.ReactText[], selectedRows: React.ReactText[]) => {
@ -120,6 +133,17 @@ export function Table(props: TableProps) {
}
}}
/>
{mode === 'simple' && (
<ViewFactory
{...props}
mode={'update'}
viewName={rowViewName}
reference={drawerRef}
onFinish={() => {
refresh();
}}
/>
)}
<AntdTable
size={'middle'}
rowKey={rowKey}
@ -157,13 +181,18 @@ export function Table(props: TableProps) {
if (isFieldComponent) {
return;
}
redirectTo({
...props.match.params,
[activeTab ? 'newItem' : 'lastItem']: {
itemId: data[rowKey]||data.id,
tabName: defaultTabName,
},
});
if (mode === 'simple') {
drawerRef.current.setVisible(true);
drawerRef.current.getData(data[rowKey]);
} else {
redirectTo({
...props.match.params,
[activeTab ? 'newItem' : 'lastItem']: {
itemId: data[rowKey]||data.id,
tabName: defaultTabName,
},
});
}
},
})}
pagination={false}

2
packages/app/src/components/views/index.tsx
View File

@ -28,7 +28,7 @@ registerView('DrawerForm', DrawerForm);
registerView('PermissionForm', DrawerForm);
registerView('Form', Form);
registerView('Table', Table);
registerView('SimpleTable', SimpleTable);
registerView('SimpleTable', Table);
registerView('Details', Details);
registerView('Login', Login);
registerView('Register', Register);

31
packages/plugin-collections/src/collections/views.ts
View File

@ -201,18 +201,37 @@ export default {
{
interface: 'radio',
type: 'string',
name: 'template',
name: 'mode',
title: '查看和编辑模式',
required: true,
dataSource: [
// { label: '表单', value: 'DrawerForm' },
{ label: '常规模式', value: 'Table' },
{ label: '快捷模式', value: 'SimpleTable' },
// { label: '日历模板', value: 'Calendar' },
{ label: '常规模式', value: 'default' },
{ label: '快捷模式', value: 'simple' },
],
component: {
tooltip: "{{ html('常规模式：点击数据进入查看界面，再次点击进入编辑界面<br/>快捷模式：点击数据直接打开编辑界面') }}",
tooltip: "常规模式：点击数据进入查看界面，再次点击进入编辑界面<br/>快捷模式：点击数据直接打开编辑界面",
type: 'radio',
default: 'default',
showInTable: true,
showInDetail: true,
showInForm: true,
},
},
{
interface: 'select',
type: 'string',
name: 'template',
title: '模板',
required: true,
developerMode: true,
dataSource: [
{ label: '表单', value: 'DrawerForm' },
{ label: '常规表格', value: 'Table' },
{ label: '简易表格', value: 'SimpleTable' },
{ label: '日历模板', value: 'Calendar' },
],
component: {
type: 'select',
default: 'Table',
showInTable: true,
showInDetail: true,

17
packages/plugin-pages/src/actions/getView.ts
View File

@ -230,15 +230,12 @@ export default async (ctx, next) => {
if (actionNames.length === 0) {
actionNames = ['filter', 'create', 'destroy'];
}
if (view.get('type') === 'table') {
const defaultTabs = await collection.getTabs({
where: {
default: true,
},
});
view.setDataValue('defaultTabName', get(defaultTabs, [0, 'name']));
}
const defaultTabs = await collection.getTabs({
where: {
default: true,
},
});
view.setDataValue('defaultTabName', get(defaultTabs, [0, 'name']));
if (view.get('type') === 'table') {
view.setDataValue('rowViewName', 'form');
}
@ -268,7 +265,7 @@ export default async (ctx, next) => {
const appends = [];
for (const field of fields) {
if (!['subTable', 'linkTo', 'attachment'].includes(field.get('interface'))) {
if (!['subTable', 'linkTo', 'attachment', 'createdBy', 'updatedBy'].includes(field.get('interface'))) {
continue;
}
let showInKey;