diff --git a/packages/grid/src/components/field-menu/field-menu.component.html b/packages/grid/src/components/field-menu/field-menu.component.html
index b8e09e9f..22352406 100644
--- a/packages/grid/src/components/field-menu/field-menu.component.html
+++ b/packages/grid/src/components/field-menu/field-menu.component.html
@@ -3,11 +3,14 @@
@if (menu.type === 'divider') {
} @else {
+ @let disabled = !!(menu.disabled && menu.disabled(aiTable, field));
+ @let isRemoveField = menu.type === 'removeField';
{{ menu.name! }}
diff --git a/packages/grid/src/components/field-menu/field-menu.component.ts b/packages/grid/src/components/field-menu/field-menu.component.ts
index c668f2f1..f4996e80 100644
--- a/packages/grid/src/components/field-menu/field-menu.component.ts
+++ b/packages/grid/src/components/field-menu/field-menu.component.ts
@@ -10,19 +10,24 @@ import {
import { ThyIcon } from 'ngx-tethys/icon';
import { AITable } from '../../core';
import { AITableFieldMenuItem } from '../../types/field';
+import { NgClass } from '@angular/common';
@Component({
selector: 'field-menu',
templateUrl: './field-menu.component.html',
standalone: true,
changeDetection: ChangeDetectionStrategy.OnPush,
+ host: {
+ class: 'field-menu'
+ },
imports: [
ThyIcon,
ThyDivider,
ThyDropdownMenuComponent,
ThyDropdownMenuItemDirective,
ThyDropdownMenuItemNameDirective,
- ThyDropdownMenuItemIconDirective
+ ThyDropdownMenuItemIconDirective,
+ NgClass
]
})
export class FieldMenu extends ThyDropdownAbstractMenu {
diff --git a/packages/grid/src/components/field-menu/field-menu.scss b/packages/grid/src/components/field-menu/field-menu.scss
new file mode 100644
index 00000000..5e104f0e
--- /dev/null
+++ b/packages/grid/src/components/field-menu/field-menu.scss
@@ -0,0 +1,12 @@
+@use 'ngx-tethys/styles/variables.scss';
+
+.field-menu {
+ .remove-field {
+ &:hover {
+ .thy-icon {
+ color: variables.$danger;
+ }
+ color: variables.$danger !important;
+ }
+ }
+}
diff --git a/packages/grid/src/styles/styles.scss b/packages/grid/src/styles/styles.scss
index 86196bec..4d9f90bd 100644
--- a/packages/grid/src/styles/styles.scss
+++ b/packages/grid/src/styles/styles.scss
@@ -3,6 +3,8 @@
@use 'ngx-tethys/styles/variables.scss';
@use '../components/cell-editors/cell-editor.scss';
@use '../components/cell-views/select/option.scss';
+@use '../components/field-menu/field-menu.scss';
+
.ai-table-dom-grid {
display: table;
width: 100%;
diff --git a/src/app/component/table.component.html b/src/app/component/table.component.html
index 440a328c..b163c321 100644
--- a/src/app/component/table.component.html
+++ b/src/app/component/table.component.html
@@ -52,7 +52,7 @@
复制
-
+
删除
diff --git a/src/app/component/table.scss b/src/app/component/table.scss
new file mode 100644
index 00000000..208abc61
--- /dev/null
+++ b/src/app/component/table.scss
@@ -0,0 +1,7 @@
+@use 'ngx-tethys/styles/variables.scss';
+
+.remove-icon {
+ &:hover {
+ color: variables.$danger !important;
+ }
+}
diff --git a/src/styles.scss b/src/styles.scss
index c49f1206..3c05fbec 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,4 +1,5 @@
/* You can add global styles to this file, and also import other style files */
-@import '../packages/grid/src/styles/styles.scss';
-@import './app/app.component.scss';
\ No newline at end of file
+@forward '../packages/grid/src/styles/styles.scss';
+@forward './app/app.component.scss';
+@forward './app/component/table.scss';