feat: add order detail page localization and permission

apps/angular/projects/ordering/config/src/enums/policy-names.ts

@@ -1,7 +1,6 @@
 export const enum eOrderingPolicyNames {
-  Ordering = 'CatalogService.Products',
- 
-  ProductManagementCreate = 'CatalogService.Products.Create',
-  ProductManagementUpdate = 'CatalogService.Products.Update',
-  ProductManagementDelete = 'CatalogService.Products.Delete',
+  ordering = 'OrderingService.Orders',
+  detail = 'OrderingService.Orders.Orders',
+  setAsShipped = 'OrderingService.Orders.SetAsShipped',
+  setAsCancelled = 'OrderingService.Products.SetAsCancelled',
 }

apps/angular/projects/ordering/config/src/enums/route-names.ts

@@ -1,3 +1,3 @@
 export const enum eOrderingRouteNames {
-  Ordering = 'OrderingService::Menu:OrderManagement'
+  ordering = 'OrderingService::Menu:OrderManagement'
 }

apps/angular/projects/ordering/config/src/providers/route.provider.ts

@@ -12,8 +12,9 @@ export function configureRoutes(routesService: RoutesService) {
     routesService.add([
       {
         path: '/ordering',
-        name: eOrderingRouteNames.Ordering,
+        name: eOrderingRouteNames.ordering,
         layout: eLayoutType.application,
+        requiredPolicy:  eOrderingPolicyNames.ordering,
         parentName: null,
         iconClass: 'bi bi-collection-fill',
       },

apps/angular/projects/ordering/src/pages/orders/order-detail/order-detail.component.html

@@ -1,18 +1,18 @@
 <abp-modal [visible]='visible' (visibleChange)='visibleChange.emit($event)' [options]='modalOption'>
   <ng-template #abpHeader>
-    <h3>Order Detail</h3>
+    <h3>{{"OrderingService::ModalTitle" | abpLocalization }}</h3>
   </ng-template>
 
   <ng-template #abpBody>
 
     <div *ngIf='order'>
       <div class='container'>
-        <lib-order-detail-item label='Order Number'>#{{order.orderNo}}</lib-order-detail-item>
-        <lib-order-detail-item label='Order Status'>{{order.orderStatus}}</lib-order-detail-item>
-        <lib-order-detail-item label='Buyer Name'>{{order.buyer.name}}</lib-order-detail-item>
-        <lib-order-detail-item label='Buyer Email'>{{order.buyer.email}}</lib-order-detail-item>
+        <lib-order-detail-item [label]="'OrderingService::DisplayName:OrderNo' | abpLocalization">#{{order.orderNo}}</lib-order-detail-item>
+        <lib-order-detail-item [label]="'OrderingService::DisplayName:OrderStatus' | abpLocalization">{{order.orderStatus}}</lib-order-detail-item>
+        <lib-order-detail-item [label]="'OrderingService::DisplayName:BuyerName' | abpLocalization">{{order.buyer.name}}</lib-order-detail-item>
+        <lib-order-detail-item [label]="'OrderingService::DisplayName:BuyerEmail' | abpLocalization">{{order.buyer.email}}</lib-order-detail-item>
 
-        <lib-order-detail-item label='Address'>
+        <lib-order-detail-item  [label]="'OrderingService::DisplayName:Address' | abpLocalization">
         <span *ngIf='order.address as address'>
           {{address.description}} <br />
           {{address.street}}  <br />
@@ -20,35 +20,33 @@
           {{address.city}} / {{address.country}} <br />
         </span>
         </lib-order-detail-item>
-        <lib-order-detail-item label='Payment Method'>{{order.paymentMethod}}</lib-order-detail-item>
-        <lib-order-detail-item label='Total'>{{order.orderTotal | currency}}</lib-order-detail-item>
-
+        <lib-order-detail-item [label]="'OrderingService::DisplayName:PaymentMethod' | abpLocalization">{{order.paymentMethod}}</lib-order-detail-item>
+        <lib-order-detail-item [label]="'OrderingService::DisplayName:Total' | abpLocalization">{{order.orderTotal | currency}}</lib-order-detail-item>
       </div>
       <br><br><br>
 
       <ngx-datatable [rows]='(order.items)' default>
         <!-- TODO: localize column headers -->
-        <ngx-datatable-column name='ProductId' prop='productId'></ngx-datatable-column>
-        <ngx-datatable-column name='PictureUrl' prop='pictureUrl'>
+        <ngx-datatable-column [name]="'OrderingService::DisplayName:ProductId' | abpLocalization"  prop='productId'></ngx-datatable-column>
+        <ngx-datatable-column [name]="'OrderingService::DisplayName:PictureUrl' | abpLocalization" prop='pictureUrl'>
           <ng-template let-value='value' ngx-datatable-cell-template>
-            <img [src]="mediaServerUrl + '/product-images/' + value" width='80' />
+            <img [src]="mediaServerUrl + '/product-images/' + value" width='80' alt='' />
           </ng-template>
 
         </ngx-datatable-column>
-        <ngx-datatable-column name='ProductName' prop='productName'></ngx-datatable-column>
-        <ngx-datatable-column name='UnitPrice' prop='unitPrice'>
+        <ngx-datatable-column [name]="'OrderingService::DisplayName:ProductName' | abpLocalization" prop='productName'></ngx-datatable-column>
+        <ngx-datatable-column [name]="'OrderingService::DisplayName:UnitPrice' | abpLocalization" prop='unitPrice'>
           <ng-template let-value='value' ngx-datatable-cell-template>
             {{value | currency }}
           </ng-template>
         </ngx-datatable-column>
-        <ngx-datatable-column name='Units' prop='units'></ngx-datatable-column>
-        <ngx-datatable-column name='Discount' prop='discount'>
-
+        <ngx-datatable-column [name]="'OrderingService::DisplayName:Units' | abpLocalization" prop='units'></ngx-datatable-column>
+        <ngx-datatable-column  [name]="'OrderingService::DisplayName:Discount' | abpLocalization" prop='discount'>
           <ng-template let-value='value' ngx-datatable-cell-template>
             {{value }} %
           </ng-template>
         </ngx-datatable-column>
-        <ngx-datatable-column name='Total Price'>
+        <ngx-datatable-column [name]="'OrderingService::DisplayName:TotalPrice' | abpLocalization">
           <ng-template let-row='row' ngx-datatable-cell-template>
             {{(row.units * row.unitPrice) | currency }}
           </ng-template>

apps/angular/projects/ordering/src/pages/orders/orders.component.html

@@ -27,21 +27,24 @@
               <button
                 class="dropdown-item"
                 (click)='openModal(row)'
+                *abpPermission='permissions.detail'
               >
-                {{ 'AbpUi::Edit' | abpLocalization }}
+                {{ 'AbpUi::Detail' | abpLocalization }}
               </button>
               <button
                 class="dropdown-item"
                 (click)='setAsShipped(row)'
+                *abpPermission='permissions.setAsCancelled'
               >
-                {{ 'AbpOrdering::Permission:Orders.SetAsCancelled' | abpLocalization }}
+                {{ 'OrderingService::Permission:Orders.SetAsCancelled' | abpLocalization }}
               </button>
               <!-- Todo: Add permissions -->
               <button
               class="dropdown-item"
+              *abpPermission='permissions.setAsShipped'
               (click)='setAsCancelled(row)'
             >
-              {{ 'AbpOrdering::Permission:Orders.SetAsShipped' | abpLocalization }}
+              {{ 'OrderingService::Permission:Orders.SetAsShipped' | abpLocalization }}
             </button>
             </div>
           </div>

apps/angular/projects/ordering/src/pages/orders/orders.component.ts

@@ -3,6 +3,7 @@ import {  OrderService } from '../../lib/proxy/orders';
 import { OrderViewModel, toOrderViewModel } from '../../lib';
 import { Confirmation, ConfirmationService } from '@abp/ng.theme.shared';
 import { ListService } from '@abp/ng.core';
+import { eOrderingPolicyNames } from '@eshoponabp/ordering/config';
 
 @Component({
   selector: 'lib-orders',
@@ -18,6 +19,11 @@ export class OrdersComponent implements OnInit {
   isModalVisible = false;
   items: OrderViewModel[];
   count = 0;
+  permissions = {
+    detail: eOrderingPolicyNames.ordering,
+    setAsShipped: eOrderingPolicyNames.setAsShipped,
+    setAsCancelled: eOrderingPolicyNames.setAsCancelled,
+  };
 
   ngOnInit(): void {
 

services/ordering/src/EShopOnAbp.OrderingService.Domain.Shared/Localization/OrderingService/en.json

@@ -15,8 +15,21 @@
 
     "DisplayName:OrderNo": "Order No",
     "DisplayName:OrderDate": "Order Date",
-    "DisplayName:OrderTotal": "Total",
+    "DisplayName:OrderTotal": "Order Total",
     "DisplayName:OrderStatus": "Order Status", 
+  
+    "DisplayName:ProductId": "Product Id", 
+    "DisplayName:ProductName": "Product Name",
+    "DisplayName:PictureUrl": "Picture",
+    "DisplayName:Units": "Unit",
+    "DisplayName:UnitPrice": "Unit Price",
+    "DisplayName:Discount": "Discount",     
+    "DisplayName:TotalPrice": "Total Price",
+    "DisplayName:BuyerName": "Buyer Name", 
+    "DisplayName:BuyerEmail": "Buyer E-mail", 
+    "DisplayName:Address": "Address", 
+    "DisplayName:PaymentMethod": "Payment Method", 
+    "DisplayName:Total": "Total", 
     "Permission:Orders.SetAsCancelled": "Set As Cancelled",
     "Permission:Orders.SetAsShipped": "Set As Shipped"
   }