feat: add action column in product

apps/angular/projects/catalog/src/pages/product/product.component.html

@@ -12,6 +12,28 @@
   <div class="card-body">
     <ngx-datatable [rows]="items" [count]="count" [list]="list" default>
       <!-- TODO: localize column headers -->
+      <ngx-datatable-column [name]="'AbpUi::Actions' | abpLocalization" [sortable]="false">
+        <ng-template let-row="row" ngx-datatable-cell-template>
+          <div ngbDropdown container="body" class="d-inline-block">
+            <button
+              class="btn btn-primary btn-sm dropdown-toggle"
+              data-toggle="dropdown"
+              aria-haspopup="true"
+              ngbDropdownToggle
+            >
+              <i class="me-1 fa fa-cog"></i>{{ 'AbpUi::Actions' | abpLocalization }}
+            </button>
+            <div ngbDropdownMenu>
+              <button class="dropdown-item" (click)="onEdit(row)">
+                {{ 'AbpUi::Edit' | abpLocalization }}
+              </button>
+              <button class="dropdown-item" (click)="onDelete(row)">
+                {{ 'AbpUi::Delete' | abpLocalization }}
+              </button>
+            </div>
+          </div>
+        </ng-template>
+      </ngx-datatable-column>
       <ngx-datatable-column name="Code" prop="code"></ngx-datatable-column>
       <ngx-datatable-column name="Name" prop="name"></ngx-datatable-column>
       <ngx-datatable-column name="Price" prop="price"></ngx-datatable-column>

apps/angular/projects/catalog/src/pages/product/product.component.ts

@@ -24,4 +24,10 @@ export class ProductComponent implements OnInit {
       this.count = response.totalCount;
     });
   }
+
+  onEdit(row: ProductDto) {
+    // this.productService.edit(row);
+  }
+
+  onDelete(row: ProductDto) {}
 }

apps/angular/projects/catalog/src/pages/product/product.module.ts

@@ -2,11 +2,12 @@ import { CoreModule } from '@abp/ng.core';
 import { ThemeSharedModule } from '@abp/ng.theme.shared';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
+import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
 import { ProductRoutingModule } from './product-routing.module';
 import { ProductComponent } from './product.component';
 
 @NgModule({
   declarations: [ProductComponent],
-  imports: [CommonModule, ProductRoutingModule, ThemeSharedModule, CoreModule],
+  imports: [CommonModule, ProductRoutingModule, ThemeSharedModule, CoreModule, NgbDropdownModule],
 })
 export class ProductModule {}