diff --git a/apps/angular/projects/ordering/config/src/enums/policy-names.ts b/apps/angular/projects/ordering/config/src/enums/policy-names.ts
index 28b6edd3..6fd27f3c 100644
--- a/apps/angular/projects/ordering/config/src/enums/policy-names.ts
+++ b/apps/angular/projects/ordering/config/src/enums/policy-names.ts
@@ -1,6 +1,6 @@
 export const enum eOrderingPolicyNames {
   ordering = 'OrderingService.Orders',
-  detail = 'OrderingService.Orders.Orders',
-  setAsShipped = 'OrderingService.Orders.SetAsShipped',
-  setAsCancelled = 'OrderingService.Products.SetAsCancelled',
+  detail = 'OrderingService.Orders',
+  setAsShipped = 'OrderingService.SetAsShipped',
+  setAsCancelled = 'OrderingService.SetAsCancelled',
 }
diff --git a/apps/angular/projects/ordering/src/lib/components/order-status/order-status.component.ts b/apps/angular/projects/ordering/src/lib/components/order-status/order-status.component.ts
new file mode 100644
index 00000000..85194f8a
--- /dev/null
+++ b/apps/angular/projects/ordering/src/lib/components/order-status/order-status.component.ts
@@ -0,0 +1,33 @@
+import {ChangeDetectionStrategy, Component, Input} from '@angular/core';
+import {orderStatusOptions} from '../../proxy/orders';
+
+@Component({
+  selector: 'lib-order-status',
+  template: `
+    {{statusText}}
+  `,
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class OrderStatusComponent {
+
+  @Input()
+  set id(v: number) {
+    this.statusText = this.idToText(v);
+  }
+
+  options = orderStatusOptions;
+
+  statusText: string;
+
+  private idToText(id: number): string | null {
+    console.log('hello', new Date().toLocalISOString())
+    const item = this.options.find(x => x.value === id);
+
+    if (!item) {
+      return null;
+    }
+    return item.key;
+  }
+
+
+}
diff --git a/apps/angular/projects/ordering/src/lib/proxy/generate-proxy.json b/apps/angular/projects/ordering/src/lib/proxy/generate-proxy.json
index ee7eda0d..9c464296 100644
--- a/apps/angular/projects/ordering/src/lib/proxy/generate-proxy.json
+++ b/apps/angular/projects/ordering/src/lib/proxy/generate-proxy.json
@@ -212,7 +212,7 @@
                 "type": "System.Collections.Generic.List<EShopOnAbp.OrderingService.Orders.OrderDto>",
                 "typeSimple": "[EShopOnAbp.OrderingService.Orders.OrderDto]"
               },
-              "allowAnonymous": null,
+              "allowAnonymous": false,
               "implementFrom": "EShopOnAbp.OrderingService.Orders.IOrderAppService"
             },
             "GetListPagedAsyncByInput": {
@@ -1976,18 +1976,11 @@
           "typeSimple": "number",
           "isRequired": false
         },
-        {
-          "name": "OrderStatusId",
-          "jsonName": null,
-          "type": "System.Int32",
-          "typeSimple": "number",
-          "isRequired": false
-        },
         {
           "name": "OrderStatus",
           "jsonName": null,
-          "type": "System.String",
-          "typeSimple": "string",
+          "type": "EShopOnAbp.OrderingService.Orders.OrderStatus",
+          "typeSimple": "EShopOnAbp.OrderingService.Orders.OrderStatus",
           "isRequired": false
         },
         {
@@ -2046,6 +2039,24 @@
       "genericArguments": null,
       "properties": []
     },
+    "EShopOnAbp.OrderingService.Orders.OrderStatus": {
+      "baseType": "System.Enum",
+      "isEnum": true,
+      "enumNames": [
+        "Placed",
+        "Paid",
+        "Shipped",
+        "Cancelled"
+      ],
+      "enumValues": [
+        0,
+        1,
+        2,
+        3
+      ],
+      "genericArguments": null,
+      "properties": null
+    },
     "EShopOnAbp.OrderingService.Orders.BuyerDto": {
       "baseType": "Volo.Abp.Application.Dtos.EntityDto<System.Guid>",
       "isEnum": false,
diff --git a/apps/angular/projects/ordering/src/lib/proxy/orders/index.ts b/apps/angular/projects/ordering/src/lib/proxy/orders/index.ts
index d6641f7d..989de0e0 100644
--- a/apps/angular/projects/ordering/src/lib/proxy/orders/index.ts
+++ b/apps/angular/projects/ordering/src/lib/proxy/orders/index.ts
@@ -1,2 +1,3 @@
 export * from './models';
+export * from './order-status.enum';
 export * from './order.service';
diff --git a/apps/angular/projects/ordering/src/lib/proxy/orders/models.ts b/apps/angular/projects/ordering/src/lib/proxy/orders/models.ts
index da2b3c9a..31c23a05 100644
--- a/apps/angular/projects/ordering/src/lib/proxy/orders/models.ts
+++ b/apps/angular/projects/ordering/src/lib/proxy/orders/models.ts
@@ -1,4 +1,5 @@
 import type { EntityDto } from '@abp/ng.core';
+import type { OrderStatus } from './order-status.enum';
 
 export interface BuyerDto extends EntityDto<string> {
   name?: string;
@@ -30,8 +31,7 @@ export interface OrderCreateDto {
 export interface OrderDto extends EntityDto<string> {
   orderDate?: string;
   orderNo: number;
-  orderStatusId: number;
-  orderStatus?: string;
+  orderStatus: OrderStatus;
   paymentMethod?: string;
   buyer: BuyerDto;
   address: OrderAddressDto;
diff --git a/apps/angular/projects/ordering/src/lib/proxy/orders/order-status.enum.ts b/apps/angular/projects/ordering/src/lib/proxy/orders/order-status.enum.ts
new file mode 100644
index 00000000..d63bfc72
--- /dev/null
+++ b/apps/angular/projects/ordering/src/lib/proxy/orders/order-status.enum.ts
@@ -0,0 +1,10 @@
+import { mapEnumToOptions } from '@abp/ng.core';
+
+export enum OrderStatus {
+  Placed = 0,
+  Paid = 1,
+  Shipped = 2,
+  Cancelled = 3,
+}
+
+export const orderStatusOptions = mapEnumToOptions(OrderStatus);
diff --git a/apps/angular/projects/ordering/src/ordering.module.ts b/apps/angular/projects/ordering/src/ordering.module.ts
index 7c7702f5..5d342ad0 100644
--- a/apps/angular/projects/ordering/src/ordering.module.ts
+++ b/apps/angular/projects/ordering/src/ordering.module.ts
@@ -1,13 +1,18 @@
 import { NgModule } from '@angular/core';
 import { OrderingRoutingModule } from './ordering-routing.module';
+import { OrderStatusComponent } from './lib/components/order-status/order-status.component';
 
 
 @NgModule({
-  declarations: [],
+  declarations: [
+    OrderStatusComponent
+  ],
   imports: [
     OrderingRoutingModule
   ],
-  exports: []
+    exports: [
+        OrderStatusComponent
+    ]
 })
 export class OrderingModule {
 }
diff --git a/apps/angular/projects/ordering/src/pages/orders/orders.component.html b/apps/angular/projects/ordering/src/pages/orders/orders.component.html
index e50f6daf..162a7297 100644
--- a/apps/angular/projects/ordering/src/pages/orders/orders.component.html
+++ b/apps/angular/projects/ordering/src/pages/orders/orders.component.html
@@ -13,7 +13,7 @@
     <ngx-datatable [rows]="items" [count]="count" [list]="list" default>
       <!-- TODO: localize column headers -->
       <ngx-datatable-column name="" [sortable]='false' prop="id" >
-        <ng-template let-id="value" let-row="row" ngx-datatable-cell-template>
+        <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"
@@ -34,17 +34,17 @@
               <button
                 class="dropdown-item"
                 (click)='setAsShipped(row)'
-                *abpPermission='permissions.setAsCancelled'
+                *abpPermission='permissions.setAsShipped'
               >
-                {{ 'OrderingService::Permission:Orders.SetAsCancelled' | abpLocalization }}
+                {{ 'OrderingService::Permission:Orders.SetAsShipped' | abpLocalization }}
               </button>
               <!-- Todo: Add permissions -->
               <button
               class="dropdown-item"
-              *abpPermission='permissions.setAsShipped'
+              *abpPermission='permissions.setAsCancelled'
               (click)='setAsCancelled(row)'
             >
-              {{ 'OrderingService::Permission:Orders.SetAsShipped' | abpLocalization }}
+              {{ 'OrderingService::Permission:Orders.SetAsCancelled' | abpLocalization }}
             </button>
             </div>
           </div>
@@ -61,7 +61,11 @@
           <span>{{ value  | currency  }}</span >
         </ng-template>
       </ngx-datatable-column>
-      <ngx-datatable-column [name]="'OrderingService::DisplayName:OrderStatus' | abpLocalization" prop="orderStatus"></ngx-datatable-column>
+      <ngx-datatable-column [name]="'OrderingService::DisplayName:OrderStatus' | abpLocalization" prop="orderStatus">
+        <ng-template let-value="value" ngx-datatable-cell-template>
+            <lib-order-status [id]="value"></lib-order-status>
+        </ng-template>
+      </ngx-datatable-column>
     </ngx-datatable>
   </div>
 </div>
diff --git a/apps/angular/projects/ordering/src/pages/orders/orders.component.ts b/apps/angular/projects/ordering/src/pages/orders/orders.component.ts
index 723d6bd9..b5fff269 100644
--- a/apps/angular/projects/ordering/src/pages/orders/orders.component.ts
+++ b/apps/angular/projects/ordering/src/pages/orders/orders.component.ts
@@ -25,8 +25,10 @@ export class OrdersComponent implements OnInit {
     setAsCancelled: eOrderingPolicyNames.setAsCancelled,
   };
 
+
   ngOnInit(): void {
 
+    console.log(this.permissions)
     const ordersStreamCreator = query => this.service.getListPaged(query);
 
     this.list.hookToQuery(ordersStreamCreator).subscribe(response => {
diff --git a/apps/angular/projects/ordering/src/pages/orders/orders.module.ts b/apps/angular/projects/ordering/src/pages/orders/orders.module.ts
index fcc888c4..4397bc98 100644
--- a/apps/angular/projects/ordering/src/pages/orders/orders.module.ts
+++ b/apps/angular/projects/ordering/src/pages/orders/orders.module.ts
@@ -8,6 +8,7 @@ import { CoreModule } from '@abp/ng.core';
 import { OrderDetailComponent } from './order-detail/order-detail.component';
 import { OrderDetailItemComponent } from './order-detail/order-detail-item/order-detail-item.component';
 import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
+import {OrderingModule} from "../../ordering.module";
 
 
 @NgModule({
@@ -16,12 +17,13 @@ import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
     OrderDetailComponent,
     OrderDetailItemComponent
   ],
-  imports: [
-    CommonModule,
-    NgbDropdownModule,
-    OrdersRoutingModule,
-    ThemeSharedModule,
-    CoreModule,
-  ]
+    imports: [
+        CommonModule,
+        NgbDropdownModule,
+        OrdersRoutingModule,
+        ThemeSharedModule,
+        CoreModule,
+        OrderingModule,
+    ]
 })
 export class OrdersModule { }