mirror of
https://gitee.com/nocobase/nocobase.git
synced 2025-05-05 21:49:25 +08:00
feat(Table): add 'Hide column' configuration option (#5597)
* chore(deps): bump antd from 5.12.8 to 5.13.3 * chore: update yarn.lock * chore: fix unit tests * chore: make e2e tests pass * feat(Table): add 'Hide column' configuration option * test: add e2e test * chore: fix build * Revert "chore: make e2e tests pass" This reverts commit a84a22c140c393c055136f90140ff74c657d8b28. * Revert "chore: fix unit tests" This reverts commit 436b001c9b3cf75ee2ddcc00915199b12e1d37d4. * Revert "chore: update yarn.lock" This reverts commit 0b960251c414a66d8a0a1274bd1cd3330093ccc0. * Revert "chore(deps): bump antd from 5.12.8 to 5.13.3" This reverts commit b165d557f68e3cb7dab4172e8f22f631decea277. * chore: make e2e more stable
This commit is contained in:
Zeke Zhang
GitHub
parent
89269ec7a4
commit
3d512adade
@ -847,5 +847,7 @@
|
|||||||
"Skip getting the total number of table records during paging to speed up loading. It is recommended to enable this option for data tables with a large amount of data": "Skip getting the total number of table records during paging to speed up loading. It is recommended to enable this option for data tables with a large amount of data",
|
"Skip getting the total number of table records during paging to speed up loading. It is recommended to enable this option for data tables with a large amount of data": "Skip getting the total number of table records during paging to speed up loading. It is recommended to enable this option for data tables with a large amount of data",
|
||||||
"Enable secondary confirmation": "Enable secondary confirmation",
|
"Enable secondary confirmation": "Enable secondary confirmation",
|
||||||
"Notification": "Notification",
|
"Notification": "Notification",
|
||||||
"Ellipsis overflow content": "Ellipsis overflow content"
|
"Ellipsis overflow content": "Ellipsis overflow content",
|
||||||
|
"Hide column": "Hide column",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -768,5 +768,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "Lo siento, la página que visitaste no existe.",
|
"Sorry, the page you visited does not exist.": "Lo siento, la página que visitaste no existe.",
|
||||||
"Allow multiple selection": "Permitir selección múltiple",
|
"Allow multiple selection": "Permitir selección múltiple",
|
||||||
"Parent object": "Objeto padre",
|
"Parent object": "Objeto padre",
|
||||||
"Ellipsis overflow content": "Contenido de desbordamiento de elipsis"
|
"Ellipsis overflow content": "Contenido de desbordamiento de elipsis",
|
||||||
|
"Hide column": "Ocultar columna",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "En modo de configuración, toda la columna se vuelve transparente. En modo de no configuración, toda la columna se ocultará. Incluso si toda la columna está oculta, sus valores predeterminados configurados y otras configuraciones seguirán tomando efecto."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -788,5 +788,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "Désolé, la page que vous avez visitée n'existe pas.",
|
"Sorry, the page you visited does not exist.": "Désolé, la page que vous avez visitée n'existe pas.",
|
||||||
"Allow multiple selection": "Permettre la sélection multiple",
|
"Allow multiple selection": "Permettre la sélection multiple",
|
||||||
"Parent object": "Objet parent",
|
"Parent object": "Objet parent",
|
||||||
"Ellipsis overflow content": "Contenu de débordement avec ellipse"
|
"Ellipsis overflow content": "Contenu de débordement avec ellipse",
|
||||||
|
"Hide column": "Masquer la colonne",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "En mode de configuration, toute la colonne devient transparente. En mode de non-configuration, toute la colonne sera masquée. Même si toute la colonne est masquée, ses valeurs par défaut configurées et les autres paramètres resteront toujours en vigueur."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1006,5 +1006,7 @@
|
|||||||
"Skip getting the total number of table records during paging to speed up loading. It is recommended to enable this option for data tables with a large amount of data": "ページング時にテーブルレコードの総数取得をスキップして、読み込み速度を向上させます。データ量が多い場合にこのオプションの使用をお勧めします。",
|
"Skip getting the total number of table records during paging to speed up loading. It is recommended to enable this option for data tables with a large amount of data": "ページング時にテーブルレコードの総数取得をスキップして、読み込み速度を向上させます。データ量が多い場合にこのオプションの使用をお勧めします。",
|
||||||
"The current user only has the UI configuration permission, but don't have view permission for collection \"{{name}}\"": "現在のユーザーにはUI設定の権限しかなく、コレクション「{{name}}」を閲覧する権限はありません。",
|
"The current user only has the UI configuration permission, but don't have view permission for collection \"{{name}}\"": "現在のユーザーにはUI設定の権限しかなく、コレクション「{{name}}」を閲覧する権限はありません。",
|
||||||
"Allow multiple selection": "複数選択を許可",
|
"Allow multiple selection": "複数選択を許可",
|
||||||
"Parent object": "親オブジェクト"
|
"Parent object": "親オブジェクト",
|
||||||
|
"Hide column": "列を非表示",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "設定モードでは、列全体が透明になります。非設定モードでは、列全体が非表示になります。列全体が非表示になっても、設定されたデフォルト値やその他の設定は依然として有効です。"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -879,5 +879,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "죄송합니다. 방문한 페이지가 존재하지 않습니다.",
|
"Sorry, the page you visited does not exist.": "죄송합니다. 방문한 페이지가 존재하지 않습니다.",
|
||||||
"Allow multiple selection": "다중 선택 허용",
|
"Allow multiple selection": "다중 선택 허용",
|
||||||
"Parent object": "부모 객체",
|
"Parent object": "부모 객체",
|
||||||
"Ellipsis overflow content": "생략 부호로 내용 줄임"
|
"Ellipsis overflow content": "생략 부호로 내용 줄임",
|
||||||
|
"Hide column": "열 숨기기",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "구성 모드에서는 전체 열이 투명해집니다. 비구성 모드에서는 전체 열이 숨겨집니다. 전체 열이 숨겨져도 구성된 기본값 및 기타 설정은 여전히 적용됩니다."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -745,5 +745,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "Desculpe, a página que você visitou não existe.",
|
"Sorry, the page you visited does not exist.": "Desculpe, a página que você visitou não existe.",
|
||||||
"Allow multiple selection": "Permitir seleção múltipla",
|
"Allow multiple selection": "Permitir seleção múltipla",
|
||||||
"Parent object": "Objeto pai",
|
"Parent object": "Objeto pai",
|
||||||
"Ellipsis overflow content": "Conteúdo de transbordamento com reticências"
|
"Ellipsis overflow content": "Conteúdo de transbordamento com reticências",
|
||||||
|
"Hide column": "Ocultar coluna",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "Em modo de configuração, a coluna inteira se torna transparente. Em modo de não configuração, a coluna inteira será ocultada. Mesmo se a coluna inteira estiver oculta, seus valores padrão configurados e outras configurações ainda terão efeito."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -582,5 +582,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "Извините, посещенной вами страницы не существует.",
|
"Sorry, the page you visited does not exist.": "Извините, посещенной вами страницы не существует.",
|
||||||
"Allow multiple selection": "Разрешить множественный выбор",
|
"Allow multiple selection": "Разрешить множественный выбор",
|
||||||
"Parent object": "Родительский объект",
|
"Parent object": "Родительский объект",
|
||||||
"Ellipsis overflow content": "Содержимое с многоточием при переполнении"
|
"Ellipsis overflow content": "Содержимое с многоточием при переполнении",
|
||||||
|
"Hide column": "Скрыть столбец",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "В режиме конфигурации вся колонка становится прозрачной. В режиме не конфигурации вся колонка будет скрыта. Даже если вся колонка будет скрыта, её настроенные значения по умолчанию и другие настройки все равно будут действовать."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -580,5 +580,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "Üzgünüz, ziyaret ettiğiniz sayfa mevcut değil.",
|
"Sorry, the page you visited does not exist.": "Üzgünüz, ziyaret ettiğiniz sayfa mevcut değil.",
|
||||||
"Allow multiple selection": "Çoklu seçim izni",
|
"Allow multiple selection": "Çoklu seçim izni",
|
||||||
"Parent object": "Üst nesne",
|
"Parent object": "Üst nesne",
|
||||||
"Ellipsis overflow content": "Üç nokta ile taşan içerik"
|
"Ellipsis overflow content": "Üç nokta ile taşan içerik",
|
||||||
|
"Hide column": "Sütunu gizle",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "Yapılandırma modunda, tüm sütun tamamen saydamlık alır. Yapılandırma modu olmayan durumda, tüm sütun gizlenir. Tamamen sütun gizlendiğinde bile, yapılandırılmış varsayılan değerleri ve diğer ayarları hâlâ etkin olur."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -788,5 +788,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "Вибачте, сторінка, яку ви відвідали, не існує.",
|
"Sorry, the page you visited does not exist.": "Вибачте, сторінка, яку ви відвідали, не існує.",
|
||||||
"Allow multiple selection": "Дозволити множинний вибір",
|
"Allow multiple selection": "Дозволити множинний вибір",
|
||||||
"Parent object": "Батьківський об'єкт",
|
"Parent object": "Батьківський об'єкт",
|
||||||
"Ellipsis overflow content": "Вміст з багатокрапкою при переповненні"
|
"Ellipsis overflow content": "Вміст з багатокрапкою при переповненні",
|
||||||
|
"Hide column": "Сховати стовпець",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "В режимі конфігурації вся колонка стає прозорою. В режимі не конфігурації вся колонка буде прихована. Якщо вся колонка буде прихована, її налаштовані значення за замовчуванням і інші налаштування все одно будуть діяти."
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1025,5 +1025,7 @@
|
|||||||
"Ellipsis": "省略",
|
"Ellipsis": "省略",
|
||||||
"Set block layout": "设置区块布局",
|
"Set block layout": "设置区块布局",
|
||||||
"Add & Update": "添加 & 更新",
|
"Add & Update": "添加 & 更新",
|
||||||
"Table size":"表格大小"
|
"Table size":"表格大小",
|
||||||
|
"Hide column": "隐藏列",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "在配置模式下，整个列会变为透明色。在非配置模式下，整个列将被隐藏。即使整个列被隐藏了，其配置的默认值和其他设置仍然有效。"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -878,5 +878,7 @@
|
|||||||
"Sorry, the page you visited does not exist.": "抱歉，你訪問的頁面不存在。",
|
"Sorry, the page you visited does not exist.": "抱歉，你訪問的頁面不存在。",
|
||||||
"Allow multiple selection": "允許多選",
|
"Allow multiple selection": "允許多選",
|
||||||
"Parent object": "上級物件",
|
"Parent object": "上級物件",
|
||||||
"Ellipsis overflow content": "省略超出長度的內容"
|
"Ellipsis overflow content": "省略超出長度的內容",
|
||||||
|
"Hide column": "隱藏列",
|
||||||
|
"In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.": "在配置模式下，整個列會變為透明色。在非配置模式下，整個列將被隱藏。即使整個列被隱藏了，其配置的默認值和其他設置仍然有效。"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,42 @@
|
|||||||
|
/**
|
||||||
|
* This file is part of the NocoBase (R) project.
|
||||||
|
* Copyright (c) 2020-2024 NocoBase Co., Ltd.
|
||||||
|
* Authors: NocoBase Team.
|
||||||
|
*
|
||||||
|
* This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
|
||||||
|
* For more information, please refer to: https://www.nocobase.com/agreement.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { expect, test } from '@nocobase/test/e2e';
|
||||||
|
import { hideColumnBasic } from './templatesOfBug';
|
||||||
|
|
||||||
|
test.describe('hide column', () => {
|
||||||
|
test('basic', async ({ page, mockPage }) => {
|
||||||
|
await mockPage(hideColumnBasic).goto();
|
||||||
|
|
||||||
|
// 1. Normal table: hide column
|
||||||
|
await page.getByRole('button', { name: 'Nickname' }).hover();
|
||||||
|
await page
|
||||||
|
.getByRole('button', { name: 'designer-schema-settings-TableV2.Column-fieldSettings:TableColumn-users' })
|
||||||
|
.hover();
|
||||||
|
await page.getByRole('menuitem', { name: 'Hide column question-circle' }).click();
|
||||||
|
await page.mouse.move(500, 0);
|
||||||
|
|
||||||
|
// 2. Sub table: hide column
|
||||||
|
await page.getByRole('button', { name: 'Role name' }).hover();
|
||||||
|
await page
|
||||||
|
.getByRole('button', { name: 'designer-schema-settings-TableV2.Column-fieldSettings:TableColumn-roles' })
|
||||||
|
.hover();
|
||||||
|
await page.getByRole('menuitem', { name: 'Hide column question-circle' }).click();
|
||||||
|
await page.mouse.move(500, 0);
|
||||||
|
|
||||||
|
// Assert: In configuration mode, the entire column becomes transparent
|
||||||
|
await expect(page.locator('th', { hasText: 'Nickname' })).toHaveCSS('opacity', '0.3');
|
||||||
|
await expect(page.locator('th', { hasText: 'Role name' })).toHaveCSS('opacity', '0.3');
|
||||||
|
|
||||||
|
// Assert: In non-configuration mode, the entire column will be hidden
|
||||||
|
await page.getByTestId('ui-editor-button').click();
|
||||||
|
await expect(page.locator('th', { hasText: 'Nickname' })).not.toBeVisible();
|
||||||
|
await expect(page.locator('th', { hasText: 'Role name' })).not.toBeVisible();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -7926,3 +7926,444 @@ export const differentURL_DifferentPopupContent = {
|
|||||||
'x-index': 1,
|
'x-index': 1,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
export const hideColumnBasic = {
|
||||||
|
pageSchema: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Page',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
bfc254m95nt: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid',
|
||||||
|
'x-initializer': 'page:addBlock',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
'4e61hstsu6e': {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid.Row',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
j9xovyw5nce: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid.Col',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
'9ivpaiunf9y': {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-decorator': 'TableBlockProvider',
|
||||||
|
'x-acl-action': 'users:list',
|
||||||
|
'x-use-decorator-props': 'useTableBlockDecoratorProps',
|
||||||
|
'x-decorator-props': {
|
||||||
|
collection: 'users',
|
||||||
|
dataSource: 'main',
|
||||||
|
action: 'list',
|
||||||
|
params: {
|
||||||
|
pageSize: 20,
|
||||||
|
},
|
||||||
|
rowKey: 'id',
|
||||||
|
showIndex: true,
|
||||||
|
dragSort: false,
|
||||||
|
},
|
||||||
|
'x-toolbar': 'BlockSchemaToolbar',
|
||||||
|
'x-settings': 'blockSettings:table',
|
||||||
|
'x-component': 'CardItem',
|
||||||
|
'x-filter-targets': [],
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
actions: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-initializer': 'table:configureActions',
|
||||||
|
'x-component': 'ActionBar',
|
||||||
|
'x-component-props': {
|
||||||
|
style: {
|
||||||
|
marginBottom: 'var(--nb-spacing)',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': '51wc0e6u31j',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
bs7p8uu830m: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'array',
|
||||||
|
'x-initializer': 'table:configureColumns',
|
||||||
|
'x-component': 'TableV2',
|
||||||
|
'x-use-component-props': 'useTableBlockProps',
|
||||||
|
'x-component-props': {
|
||||||
|
rowKey: 'id',
|
||||||
|
rowSelection: {
|
||||||
|
type: 'checkbox',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
actions: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
title: '{{ t("Actions") }}',
|
||||||
|
'x-action-column': 'actions',
|
||||||
|
'x-decorator': 'TableV2.Column.ActionBar',
|
||||||
|
'x-component': 'TableV2.Column',
|
||||||
|
'x-toolbar': 'TableColumnSchemaToolbar',
|
||||||
|
'x-initializer': 'table:configureItemActions',
|
||||||
|
'x-settings': 'fieldSettings:TableColumn',
|
||||||
|
'x-toolbar-props': {
|
||||||
|
initializer: 'table:configureItemActions',
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
jw80rplhox4: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-decorator': 'DndContext',
|
||||||
|
'x-component': 'Space',
|
||||||
|
'x-component-props': {
|
||||||
|
split: '|',
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': 'u06c9tleqou',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '9s1pfakz0om',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
aph2w5uiev9: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-decorator': 'TableV2.Column.Decorator',
|
||||||
|
'x-toolbar': 'TableColumnSchemaToolbar',
|
||||||
|
'x-settings': 'fieldSettings:TableColumn',
|
||||||
|
'x-component': 'TableV2.Column',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
nickname: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
'x-collection-field': 'users.nickname',
|
||||||
|
'x-component': 'CollectionField',
|
||||||
|
'x-component-props': {
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
'x-read-pretty': true,
|
||||||
|
'x-decorator': null,
|
||||||
|
'x-decorator-props': {
|
||||||
|
labelStyle: {
|
||||||
|
display: 'none',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': '3w3zou3ceb3',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '4m9sepacwvm',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 2,
|
||||||
|
},
|
||||||
|
wpmysa656gq: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-decorator': 'TableV2.Column.Decorator',
|
||||||
|
'x-toolbar': 'TableColumnSchemaToolbar',
|
||||||
|
'x-settings': 'fieldSettings:TableColumn',
|
||||||
|
'x-component': 'TableV2.Column',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
username: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
'x-collection-field': 'users.username',
|
||||||
|
'x-component': 'CollectionField',
|
||||||
|
'x-component-props': {
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
'x-read-pretty': true,
|
||||||
|
'x-decorator': null,
|
||||||
|
'x-decorator-props': {
|
||||||
|
labelStyle: {
|
||||||
|
display: 'none',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': '38dn4mm3hr5',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '9ed6nyhlgzi',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 3,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'sc4a347zrvr',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'z8gp6wsukkv',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '60rzu0t7mm9',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'po4tzdbip1j',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
h9rg0fz8izl: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid.Row',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
acu1j5bgeeh: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid.Col',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
azoaet9funq: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-acl-action-props': {
|
||||||
|
skipScopeCheck: true,
|
||||||
|
},
|
||||||
|
'x-acl-action': 'users:create',
|
||||||
|
'x-decorator': 'FormBlockProvider',
|
||||||
|
'x-use-decorator-props': 'useCreateFormBlockDecoratorProps',
|
||||||
|
'x-decorator-props': {
|
||||||
|
dataSource: 'main',
|
||||||
|
collection: 'users',
|
||||||
|
},
|
||||||
|
'x-toolbar': 'BlockSchemaToolbar',
|
||||||
|
'x-settings': 'blockSettings:createForm',
|
||||||
|
'x-component': 'CardItem',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
pfltqojjolr: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'FormV2',
|
||||||
|
'x-use-component-props': 'useCreateFormBlockProps',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
grid: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid',
|
||||||
|
'x-initializer': 'form:configureFields',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
y4g2q6tyb0a: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid.Row',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
thgbnha840e: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'Grid.Col',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
roles: {
|
||||||
|
'x-uid': 'ivyzmc9lc21',
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'string',
|
||||||
|
'x-toolbar': 'FormItemSchemaToolbar',
|
||||||
|
'x-settings': 'fieldSettings:FormItem',
|
||||||
|
'x-component': 'CollectionField',
|
||||||
|
'x-decorator': 'FormItem',
|
||||||
|
'x-collection-field': 'users.roles',
|
||||||
|
'x-component-props': {
|
||||||
|
fieldNames: {
|
||||||
|
label: 'name',
|
||||||
|
value: 'name',
|
||||||
|
},
|
||||||
|
mode: 'SubTable',
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
default: null,
|
||||||
|
properties: {
|
||||||
|
eoizayhit92: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-component': 'AssociationField.SubTable',
|
||||||
|
'x-initializer': 'table:configureColumns',
|
||||||
|
'x-initializer-props': {
|
||||||
|
action: false,
|
||||||
|
},
|
||||||
|
'x-index': 1,
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
nhe3d7uuyur: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-decorator': 'TableV2.Column.Decorator',
|
||||||
|
'x-toolbar': 'TableColumnSchemaToolbar',
|
||||||
|
'x-settings': 'fieldSettings:TableColumn',
|
||||||
|
'x-component': 'TableV2.Column',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
name: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
'x-collection-field': 'roles.name',
|
||||||
|
'x-component': 'CollectionField',
|
||||||
|
'x-component-props': {
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
'x-decorator': 'FormItem',
|
||||||
|
'x-decorator-props': {
|
||||||
|
labelStyle: {
|
||||||
|
display: 'none',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': 'e89fxf1mg7i',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'kxbrpz5jmc7',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
jgnjc800er5: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-decorator': 'TableV2.Column.Decorator',
|
||||||
|
'x-toolbar': 'TableColumnSchemaToolbar',
|
||||||
|
'x-settings': 'fieldSettings:TableColumn',
|
||||||
|
'x-component': 'TableV2.Column',
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
properties: {
|
||||||
|
title: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
'x-collection-field': 'roles.title',
|
||||||
|
'x-component': 'CollectionField',
|
||||||
|
'x-component-props': {
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
'x-decorator': 'FormItem',
|
||||||
|
'x-decorator-props': {
|
||||||
|
labelStyle: {
|
||||||
|
display: 'none',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': 'bankqu2es91',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'uwyyk7ix2lb',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'ff16rxs8lbo',
|
||||||
|
'x-async': false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '4nagabglobc',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'noqp2jcfp2j',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'a330n90aoyf',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
vpwq72gj933: {
|
||||||
|
_isJSONSchemaObject: true,
|
||||||
|
version: '2.0',
|
||||||
|
type: 'void',
|
||||||
|
'x-initializer': 'createForm:configureActions',
|
||||||
|
'x-component': 'ActionBar',
|
||||||
|
'x-component-props': {
|
||||||
|
layout: 'one-column',
|
||||||
|
},
|
||||||
|
'x-app-version': '1.4.0-alpha.1',
|
||||||
|
'x-uid': '1nauytag1dh',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '342ktwn88zo',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '84tmhiuph4u',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'j70955c17aq',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'vtz6tq8n0mx',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': '1f4xbt4prbg',
|
||||||
|
'x-async': false,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'x-uid': 'ifb5nqtgnng',
|
||||||
|
'x-async': true,
|
||||||
|
'x-index': 1,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|||||||
@ -7,8 +7,10 @@
|
|||||||
* For more information, please refer to: https://www.nocobase.com/agreement.
|
* For more information, please refer to: https://www.nocobase.com/agreement.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
import { QuestionCircleOutlined } from '@ant-design/icons';
|
||||||
import { ISchema } from '@formily/json-schema';
|
import { ISchema } from '@formily/json-schema';
|
||||||
import { useField, useFieldSchema } from '@formily/react';
|
import { useField, useFieldSchema } from '@formily/react';
|
||||||
|
import { Tooltip } from 'antd';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { useApp, useSchemaToolbar } from '../../../../application';
|
import { useApp, useSchemaToolbar } from '../../../../application';
|
||||||
@ -380,6 +382,47 @@ export const tableColumnSettings = new SchemaSettings({
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'hidden',
|
||||||
|
type: 'switch',
|
||||||
|
useComponentProps() {
|
||||||
|
const field: any = useField();
|
||||||
|
const { t } = useTranslation();
|
||||||
|
const columnSchema = useFieldSchema();
|
||||||
|
const { dn } = useDesignable();
|
||||||
|
|
||||||
|
return {
|
||||||
|
title: (
|
||||||
|
<span>
|
||||||
|
{t('Hide column')}
|
||||||
|
<Tooltip
|
||||||
|
title={t(
|
||||||
|
'In configuration mode, the entire column becomes transparent. In non-configuration mode, the entire column will be hidden. Even if the entire column is hidden, its configured default values and other settings will still take effect.',
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<QuestionCircleOutlined style={{ marginLeft: 4, opacity: 0.65 }} />
|
||||||
|
</Tooltip>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
checked: field.componentProps.columnHidden,
|
||||||
|
onChange: (v) => {
|
||||||
|
const schema: ISchema = {
|
||||||
|
['x-uid']: columnSchema['x-uid'],
|
||||||
|
};
|
||||||
|
columnSchema['x-component-props'] = {
|
||||||
|
...columnSchema['x-component-props'],
|
||||||
|
columnHidden: v,
|
||||||
|
};
|
||||||
|
schema['x-component-props'] = columnSchema['x-component-props'];
|
||||||
|
field.componentProps.columnHidden = v;
|
||||||
|
dn.emit('patch', {
|
||||||
|
schema,
|
||||||
|
});
|
||||||
|
dn.refresh();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
fieldComponentSettingsItem,
|
fieldComponentSettingsItem,
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|||||||
@ -102,7 +102,7 @@ test.describe('add menu item', () => {
|
|||||||
|
|
||||||
// open link page
|
// open link page
|
||||||
await page.getByLabel(pageLink).click();
|
await page.getByLabel(pageLink).click();
|
||||||
await page.waitForTimeout(1000);
|
await page.waitForTimeout(2000);
|
||||||
|
|
||||||
// After clicking, it will redirect to another page, so we need to get the instance of the new page
|
// After clicking, it will redirect to another page, so we need to get the instance of the new page
|
||||||
const newPage = page.context().pages()[1];
|
const newPage = page.context().pages()[1];
|
||||||
|
|||||||
@ -121,13 +121,15 @@ const useTableColumns = (props: { showDel?: any; isSubTable?: boolean }, paginat
|
|||||||
}
|
}
|
||||||
}, []);
|
}, []);
|
||||||
const dataIndex = collectionFields?.length > 0 ? collectionFields[0].name : s.name;
|
const dataIndex = collectionFields?.length > 0 ? collectionFields[0].name : s.name;
|
||||||
|
const columnHidden = !!s['x-component-props']?.['columnHidden'];
|
||||||
return {
|
return {
|
||||||
title: <RecursionField name={s.name} schema={s} onlyRenderSelf />,
|
title: <RecursionField name={s.name} schema={s} onlyRenderSelf />,
|
||||||
dataIndex,
|
dataIndex,
|
||||||
key: s.name,
|
key: s.name,
|
||||||
sorter: s['x-component-props']?.['sorter'],
|
sorter: s['x-component-props']?.['sorter'],
|
||||||
width: 200,
|
columnHidden,
|
||||||
...s['x-component-props'],
|
...s['x-component-props'],
|
||||||
|
width: columnHidden && !designable ? 0 : s['x-component-props']?.width || 200,
|
||||||
render: (v, record) => {
|
render: (v, record) => {
|
||||||
// 这行代码会导致这里的测试不通过：packages/core/client/src/modules/blocks/data-blocks/table/__e2e__/schemaInitializer.test.ts:189
|
// 这行代码会导致这里的测试不通过：packages/core/client/src/modules/blocks/data-blocks/table/__e2e__/schemaInitializer.test.ts:189
|
||||||
// if (collectionFields?.length === 1 && collectionFields[0]['x-read-pretty'] && v == undefined) return null;
|
// if (collectionFields?.length === 1 && collectionFields[0]['x-read-pretty'] && v == undefined) return null;
|
||||||
@ -149,14 +151,25 @@ const useTableColumns = (props: { showDel?: any; isSubTable?: boolean }, paginat
|
|||||||
);
|
);
|
||||||
},
|
},
|
||||||
onCell: (record, rowIndex) => {
|
onCell: (record, rowIndex) => {
|
||||||
return { record, schema: s, rowIndex, isSubTable: props.isSubTable };
|
return {
|
||||||
|
record,
|
||||||
|
schema: s,
|
||||||
|
rowIndex,
|
||||||
|
isSubTable: props.isSubTable,
|
||||||
|
columnHidden,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onHeaderCell: () => {
|
||||||
|
return {
|
||||||
|
columnHidden,
|
||||||
|
};
|
||||||
},
|
},
|
||||||
} as TableColumnProps<any>;
|
} as TableColumnProps<any>;
|
||||||
}),
|
}),
|
||||||
|
|
||||||
// 这里不能把 columnsSchema 作为依赖，因为其每次都会变化，这里使用 hasChangedColumns 作为依赖
|
// 这里不能把 columnsSchema 作为依赖，因为其每次都会变化，这里使用 hasChangedColumns 作为依赖
|
||||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||||
[hasChangedColumns, field.value, field.address, collection, parentRecordData, schemaToolbarBigger],
|
[hasChangedColumns, field.value, field.address, collection, parentRecordData, schemaToolbarBigger, designable],
|
||||||
);
|
);
|
||||||
|
|
||||||
const tableColumns = useMemo(() => {
|
const tableColumns = useMemo(() => {
|
||||||
@ -440,7 +453,25 @@ const HeaderWrapperComponent = (props) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Style when Hidden is enabled in table column configuration
|
||||||
|
const columnHiddenStyle = {
|
||||||
|
borderRight: 'none',
|
||||||
|
paddingLeft: 0,
|
||||||
|
paddingRight: 0,
|
||||||
|
};
|
||||||
|
|
||||||
|
// Style when Hidden is enabled in configuration mode
|
||||||
|
const columnOpacityStyle = {
|
||||||
|
opacity: 0.3,
|
||||||
|
};
|
||||||
|
|
||||||
const HeaderCellComponent = (props) => {
|
const HeaderCellComponent = (props) => {
|
||||||
|
const { designable } = useDesignable();
|
||||||
|
|
||||||
|
if (props.columnHidden) {
|
||||||
|
return <th style={designable ? columnOpacityStyle : columnHiddenStyle}>{designable ? props.children : null}</th>;
|
||||||
|
}
|
||||||
|
|
||||||
return <th {...props} className={cls(props.className, headerClass)} />;
|
return <th {...props} className={cls(props.className, headerClass)} />;
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -453,7 +484,7 @@ const BodyRowComponent = (props: {
|
|||||||
return <SortableRow {...props} />;
|
return <SortableRow {...props} />;
|
||||||
};
|
};
|
||||||
|
|
||||||
const BodyCellComponent = (props) => {
|
const InternalBodyCellComponent = (props) => {
|
||||||
const { token } = useToken();
|
const { token } = useToken();
|
||||||
const inView = useContext(InViewContext);
|
const inView = useContext(InViewContext);
|
||||||
const isIndex = props.className?.includes('selection-column');
|
const isIndex = props.className?.includes('selection-column');
|
||||||
@ -474,6 +505,21 @@ const BodyCellComponent = (props) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const displayNone = { display: 'none' };
|
||||||
|
const BodyCellComponent = (props) => {
|
||||||
|
const { designable } = useDesignable();
|
||||||
|
|
||||||
|
if (props.columnHidden) {
|
||||||
|
return (
|
||||||
|
<td style={designable ? columnOpacityStyle : columnHiddenStyle}>
|
||||||
|
{designable ? props.children : <span style={displayNone}>{props.children}</span>}
|
||||||
|
</td>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return <InternalBodyCellComponent {...props} />;
|
||||||
|
};
|
||||||
|
|
||||||
interface TableProps {
|
interface TableProps {
|
||||||
/** @deprecated */
|
/** @deprecated */
|
||||||
useProps?: () => any;
|
useProps?: () => any;
|
||||||
|
|||||||
@ -363,7 +363,7 @@ export const SchemaSettingsFormItemTemplate = function FormItemTemplate(props) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export interface SchemaSettingsItemProps extends Omit<MenuItemProps, 'title'> {
|
export interface SchemaSettingsItemProps extends Omit<MenuItemProps, 'title'> {
|
||||||
title: string;
|
title: string | ReactNode;
|
||||||
}
|
}
|
||||||
export const SchemaSettingsItem: FC<SchemaSettingsItemProps> = (props) => {
|
export const SchemaSettingsItem: FC<SchemaSettingsItemProps> = (props) => {
|
||||||
const { pushMenuItem } = useCollectMenuItems();
|
const { pushMenuItem } = useCollectMenuItems();
|
||||||
@ -544,7 +544,7 @@ export const SchemaSettingsCascaderItem: FC<SchemaSettingsCascaderItemProps> = (
|
|||||||
};
|
};
|
||||||
|
|
||||||
export interface SchemaSettingsSwitchItemProps extends Omit<MenuItemProps, 'onChange'> {
|
export interface SchemaSettingsSwitchItemProps extends Omit<MenuItemProps, 'onChange'> {
|
||||||
title: string;
|
title: string | ReactNode;
|
||||||
checked?: boolean;
|
checked?: boolean;
|
||||||
onChange?: (v: boolean) => void;
|
onChange?: (v: boolean) => void;
|
||||||
}
|
}
|
||||||
@ -598,9 +598,7 @@ export const SchemaSettingsPopupItem: FC<SchemaSettingsPopupProps> = (props) =>
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export interface SchemaSettingsActionModalItemProps
|
export interface SchemaSettingsActionModalItemProps extends SchemaSettingsModalItemProps {
|
||||||
extends SchemaSettingsModalItemProps,
|
|
||||||
Omit<SchemaSettingsItemProps, 'onSubmit' | 'onClick'> {
|
|
||||||
uid?: string;
|
uid?: string;
|
||||||
initialSchema?: ISchema;
|
initialSchema?: ISchema;
|
||||||
schema?: ISchema;
|
schema?: ISchema;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user