mirror of
https://github.com/nocobase/nocobase
synced 2024-11-15 05:46:00 +00:00
feat: improve view mode
This commit is contained in:
parent
ee6cc5a665
commit
551f8bad8d
@ -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();
|
||||
|
@ -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();
|
||||
}
|
||||
}
|
||||
})();
|
||||
|
@ -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) => {
|
||||
|
@ -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}
|
||||
|
@ -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);
|
||||
|
@ -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,
|
||||
|
@ -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;
|
||||
|
Loading…
Reference in New Issue
Block a user