diff --git a/Dockerfile b/Dockerfile
index 57e0ac6f4d2..b7ebfcba1ff 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -4,6 +4,7 @@ COPY schematics /workspace/schematics/
 COPY package.json package-lock.json /workspace/
 RUN npm i --ignore-scripts
 COPY projects/organization-management/src/app /workspace/projects/organization-management/src/app/
+COPY projects/requisition-management/src/app /workspace/projects/requisition-management/src/app/
 COPY src /workspace/src/
 COPY tsconfig.app.json tsconfig-es5.app.json tsconfig.json ngsw-config.json browserslist angular.json /workspace/
 RUN npm run build:schematics && npm run synchronize-lazy-components -- --ci
diff --git a/angular.json b/angular.json
index c30b80d244b..684c07f48e5 100644
--- a/angular.json
+++ b/angular.json
@@ -227,6 +227,52 @@
           }
         }
       }
+    },
+    "requisition-management": {
+      "projectType": "application",
+      "cli": {
+        "defaultCollection": "intershop-schematics"
+      },
+      "schematics": {
+        "intershop-schematics:page": {
+          "lazy": false
+        }
+      },
+      "root": "projects/requisition-management",
+      "sourceRoot": "projects/requisition-management/src",
+      "prefix": "ish",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/requisition-management",
+            "index": "projects/requisition-management/src/index.html",
+            "main": "projects/requisition-management/src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "projects/requisition-management/tsconfig.app.json",
+            "aot": false,
+            "styles": ["src/styles/themes/default/style.scss"],
+            "assets": [
+              { "glob": "**/*", "input": "src/assets/", "output": "/assets/" }
+            ],
+            "scripts": [],
+            "fileReplacements": [
+              {
+                "replace": "src/environments/environment.ts",
+                "with": "src/environments/environment.local.ts"
+              }
+            ]
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "requisition-management:build",
+            "disableHostCheck": true,
+            "host": "0.0.0.0"
+          }
+        }
+      }
     }
   },
   "defaultProject": "intershop-pwa",
diff --git a/jest.config.js b/jest.config.js
index 9e33d20f995..6e4072c4697 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -20,6 +20,7 @@ module.exports = {
   moduleNameMapper: {
     '^ish-(.*)$': '<rootDir>/src/app/$1',
     '^organization-management$': '<rootDir>/projects/organization-management/src/app/exports',
+    '^requisition-management$': '<rootDir>/projects/requisition-management/src/app/exports',
   },
   snapshotSerializers: [
     './src/jest-serializer/AngularHTMLSerializer.js',
diff --git a/projects/requisition-management/src/app.component.html b/projects/requisition-management/src/app.component.html
new file mode 100644
index 00000000000..e6398ae2961
--- /dev/null
+++ b/projects/requisition-management/src/app.component.html
@@ -0,0 +1,21 @@
+<div class="container main-container">
+  <div class="d-flex py-2 border-bottom">
+    <a
+      *ngIf="user$ | async as user; else notLoggedIn"
+      class="text-uppercase"
+      routerLink="/logout"
+      [queryParams]="{ returnUrl: '/login?returnUrl=/requisition-management' }"
+      >{{ 'account.logout.link' | translate }}</a
+    >
+    <ng-template #notLoggedIn>
+      <a
+        class="text-uppercase"
+        routerLink="/login"
+        [queryParams]="{ returnUrl: '/login?returnUrl=/requisition-management' }"
+        >{{ 'account.login.link' | translate }}</a
+      >
+    </ng-template>
+  </div>
+
+  <router-outlet></router-outlet>
+</div>
diff --git a/projects/requisition-management/src/app.component.ts b/projects/requisition-management/src/app.component.ts
new file mode 100644
index 00000000000..3f8f3ed04fc
--- /dev/null
+++ b/projects/requisition-management/src/app.component.ts
@@ -0,0 +1,21 @@
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { AccountFacade } from 'ish-core/facades/account.facade';
+import { User } from 'ish-core/models/user/user.model';
+
+@Component({
+  selector: 'ish-requisition-management-root',
+  templateUrl: './app.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+// tslint:disable-next-line: component-creation-test
+export class AppComponent implements OnInit {
+  user$: Observable<User>;
+
+  constructor(private accountFacade: AccountFacade) {}
+
+  ngOnInit() {
+    this.user$ = this.accountFacade.user$;
+  }
+}
diff --git a/projects/requisition-management/src/app.module.ts b/projects/requisition-management/src/app.module.ts
new file mode 100644
index 00000000000..fcaf5a867e4
--- /dev/null
+++ b/projects/requisition-management/src/app.module.ts
@@ -0,0 +1,47 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { RouterModule } from '@angular/router';
+
+import { CoreModule } from 'ish-core/core.module';
+import { AuthGuard } from 'ish-core/guards/auth.guard';
+import { LogoutGuard } from 'ish-core/guards/logout.guard';
+import { FormsSharedModule } from 'ish-shared/forms/forms.module';
+
+import { AppComponent } from './app.component';
+import { LoginComponent } from './login.component';
+
+@NgModule({
+  declarations: [AppComponent, LoginComponent],
+  imports: [
+    BrowserModule,
+    CoreModule,
+    FormsSharedModule,
+    NoopAnimationsModule,
+    RouterModule.forRoot([
+      {
+        path: 'login',
+        component: LoginComponent,
+      },
+      {
+        path: 'logout',
+        canActivate: [LogoutGuard],
+        component: LoginComponent,
+      },
+      {
+        path: 'requisition-management',
+        loadChildren: () => import('./app/requisition-management.module').then(m => m.RequisitionManagementModule),
+        canActivate: [AuthGuard],
+        canActivateChild: [AuthGuard],
+      },
+      {
+        path: '**',
+        redirectTo: 'requisition-management',
+        pathMatch: 'full',
+      },
+    ]),
+  ],
+  providers: [],
+  bootstrap: [AppComponent],
+})
+export class AppModule {}
diff --git a/projects/requisition-management/src/app/exports/index.ts b/projects/requisition-management/src/app/exports/index.ts
new file mode 100644
index 00000000000..41bad668425
--- /dev/null
+++ b/projects/requisition-management/src/app/exports/index.ts
@@ -0,0 +1,5 @@
+// tslint:disable: no-barrel-files
+
+export { RequisitionManagementModule } from '../requisition-management.module';
+
+export { RequisitionManagementBreadcrumbService } from '../services/requisition-management-breadcrumb/requisition-management-breadcrumb.service';
diff --git a/projects/requisition-management/src/app/facades/requisition-management.facade.ts b/projects/requisition-management/src/app/facades/requisition-management.facade.ts
new file mode 100644
index 00000000000..66e2d5fbbff
--- /dev/null
+++ b/projects/requisition-management/src/app/facades/requisition-management.facade.ts
@@ -0,0 +1,8 @@
+import { Injectable } from '@angular/core';
+import { Store } from '@ngrx/store';
+
+// tslint:disable:member-ordering
+@Injectable({ providedIn: 'root' })
+export class RequisitionManagementFacade {
+  constructor(private store: Store) {}
+}
diff --git a/projects/requisition-management/src/app/pages/approver/approver-page.component.html b/projects/requisition-management/src/app/pages/approver/approver-page.component.html
new file mode 100644
index 00000000000..45d9b6d85a9
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/approver/approver-page.component.html
@@ -0,0 +1,3 @@
+<h1>{{ 'account.requisitions.approvals' | translate }}</h1>
+
+<p>{{ 'account.requisitions.approvals.text' | translate }}</p>
diff --git a/projects/requisition-management/src/app/pages/approver/approver-page.component.spec.ts b/projects/requisition-management/src/app/pages/approver/approver-page.component.spec.ts
new file mode 100644
index 00000000000..2bf3132667a
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/approver/approver-page.component.spec.ts
@@ -0,0 +1,30 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { ApproverPageComponent } from './approver-page.component';
+
+describe('Approver Page Component', () => {
+  let component: ApproverPageComponent;
+  let fixture: ComponentFixture<ApproverPageComponent>;
+  let element: HTMLElement;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [RouterTestingModule, TranslateModule.forRoot()],
+      declarations: [ApproverPageComponent],
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ApproverPageComponent);
+    component = fixture.componentInstance;
+    element = fixture.nativeElement;
+  });
+
+  it('should be created', () => {
+    expect(component).toBeTruthy();
+    expect(element).toBeTruthy();
+    expect(() => fixture.detectChanges()).not.toThrow();
+  });
+});
diff --git a/projects/requisition-management/src/app/pages/approver/approver-page.component.ts b/projects/requisition-management/src/app/pages/approver/approver-page.component.ts
new file mode 100644
index 00000000000..fa101bad8dc
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/approver/approver-page.component.ts
@@ -0,0 +1,8 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'ish-approver-page',
+  templateUrl: './approver-page.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ApproverPageComponent {}
diff --git a/projects/requisition-management/src/app/pages/buyer/buyer-page.component.html b/projects/requisition-management/src/app/pages/buyer/buyer-page.component.html
new file mode 100644
index 00000000000..440aec6b011
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/buyer/buyer-page.component.html
@@ -0,0 +1,3 @@
+<h1>{{ 'account.requisitions.requisitions' | translate }}</h1>
+
+<p>{{ 'account.requisitions.requisitions.text' | translate }}</p>
diff --git a/projects/requisition-management/src/app/pages/buyer/buyer-page.component.spec.ts b/projects/requisition-management/src/app/pages/buyer/buyer-page.component.spec.ts
new file mode 100644
index 00000000000..ba9bfe467d1
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/buyer/buyer-page.component.spec.ts
@@ -0,0 +1,30 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { BuyerPageComponent } from './buyer-page.component';
+
+describe('Buyer Page Component', () => {
+  let component: BuyerPageComponent;
+  let fixture: ComponentFixture<BuyerPageComponent>;
+  let element: HTMLElement;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [RouterTestingModule, TranslateModule.forRoot()],
+      declarations: [BuyerPageComponent],
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BuyerPageComponent);
+    component = fixture.componentInstance;
+    element = fixture.nativeElement;
+  });
+
+  it('should be created', () => {
+    expect(component).toBeTruthy();
+    expect(element).toBeTruthy();
+    expect(() => fixture.detectChanges()).not.toThrow();
+  });
+});
diff --git a/projects/requisition-management/src/app/pages/buyer/buyer-page.component.ts b/projects/requisition-management/src/app/pages/buyer/buyer-page.component.ts
new file mode 100644
index 00000000000..f4539b88989
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/buyer/buyer-page.component.ts
@@ -0,0 +1,8 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'ish-buyer-page',
+  templateUrl: './buyer-page.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class BuyerPageComponent {}
diff --git a/projects/requisition-management/src/app/pages/requisition-management-routing.module.ts b/projects/requisition-management/src/app/pages/requisition-management-routing.module.ts
new file mode 100644
index 00000000000..77ce3169dc9
--- /dev/null
+++ b/projects/requisition-management/src/app/pages/requisition-management-routing.module.ts
@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+import { ApproverPageComponent } from './approver/approver-page.component';
+import { BuyerPageComponent } from './buyer/buyer-page.component';
+
+/**
+ * routes for the requisition management
+ *
+ * visible for testing
+ */
+export const routes: Routes = [
+  { path: 'approver', component: ApproverPageComponent },
+  { path: 'buyer', component: BuyerPageComponent },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class RequisitionManagementRoutingModule {}
diff --git a/projects/requisition-management/src/app/requisition-management.module.ts b/projects/requisition-management/src/app/requisition-management.module.ts
new file mode 100644
index 00000000000..7462aeb5706
--- /dev/null
+++ b/projects/requisition-management/src/app/requisition-management.module.ts
@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from 'ish-shared/shared.module';
+
+import { ApproverPageComponent } from './pages/approver/approver-page.component';
+import { BuyerPageComponent } from './pages/buyer/buyer-page.component';
+import { RequisitionManagementRoutingModule } from './pages/requisition-management-routing.module';
+import { RequisitionManagementStoreModule } from './store/requisition-management-store.module';
+
+@NgModule({
+  declarations: [ApproverPageComponent, BuyerPageComponent],
+  imports: [RequisitionManagementRoutingModule, RequisitionManagementStoreModule, SharedModule],
+})
+export class RequisitionManagementModule {}
diff --git a/projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.spec.ts b/projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.spec.ts
new file mode 100644
index 00000000000..cc9e7ffc7ec
--- /dev/null
+++ b/projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.spec.ts
@@ -0,0 +1,88 @@
+import { Component, Type } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { Route, Router } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { CoreStoreModule } from 'ish-core/store/core/core-store.module';
+
+import { routes } from '../../pages/requisition-management-routing.module';
+
+import { RequisitionManagementBreadcrumbService } from './requisition-management-breadcrumb.service';
+
+// tslint:disable-next-line: no-any
+function adaptRoutes(rts: Route[], cmp: Type<any>): Route[] {
+  return rts.map(r => ({
+    ...r,
+    component: r.component && cmp,
+    children: r.children && adaptRoutes(r.children, cmp),
+  }));
+}
+
+describe('Requisition Management Breadcrumb Service', () => {
+  let requisitionManagementBreadcrumbService: RequisitionManagementBreadcrumbService;
+  let router: Router;
+
+  beforeEach(() => {
+    @Component({ template: 'dummy' })
+    class DummyComponent {}
+    TestBed.configureTestingModule({
+      declarations: [DummyComponent],
+      imports: [
+        CoreStoreModule.forTesting(['router', 'configuration']),
+        RouterTestingModule.withRoutes([
+          ...adaptRoutes(routes, DummyComponent),
+          { path: '**', component: DummyComponent },
+        ]),
+        TranslateModule.forRoot(),
+      ],
+    });
+    requisitionManagementBreadcrumbService = TestBed.inject(RequisitionManagementBreadcrumbService);
+    router = TestBed.inject(Router);
+    router.initialNavigation();
+  });
+
+  it('should be created', () => {
+    expect(requisitionManagementBreadcrumbService).toBeTruthy();
+  });
+
+  describe('breadcrumb$', () => {
+    describe('unrelated routes', () => {
+      it('should not report a breadcrumb for unrelated routes', done => {
+        router.navigateByUrl('/foobar');
+        requisitionManagementBreadcrumbService.breadcrumb$('/my-account').subscribe(fail, fail, fail);
+        setTimeout(done, 2000);
+      });
+    });
+
+    describe('requisition management routes', () => {
+      it('should set breadcrumb for requisitions list view', done => {
+        router.navigateByUrl('/buyer');
+        requisitionManagementBreadcrumbService.breadcrumb$('/my-account').subscribe(breadcrumbData => {
+          expect(breadcrumbData).toMatchInlineSnapshot(`
+            Array [
+              Object {
+                "key": "account.requisitions.requisitions",
+              },
+            ]
+          `);
+          done();
+        });
+      });
+
+      it('should set breadcrumb for requisitions list view', done => {
+        router.navigateByUrl('/approver');
+        requisitionManagementBreadcrumbService.breadcrumb$('/my-account').subscribe(breadcrumbData => {
+          expect(breadcrumbData).toMatchInlineSnapshot(`
+            Array [
+              Object {
+                "key": "account.requisitions.approvals",
+              },
+            ]
+          `);
+          done();
+        });
+      });
+    });
+  });
+});
diff --git a/projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.ts b/projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.ts
new file mode 100644
index 00000000000..c0379f9d15c
--- /dev/null
+++ b/projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.ts
@@ -0,0 +1,29 @@
+import { Injectable } from '@angular/core';
+import { EMPTY, Observable, of } from 'rxjs';
+import { switchMap, withLatestFrom } from 'rxjs/operators';
+
+import { AppFacade } from 'ish-core/facades/app.facade';
+import { BreadcrumbItem } from 'ish-core/models/breadcrumb-item/breadcrumb-item.interface';
+import { whenFalsy, whenTruthy } from 'ish-core/utils/operators';
+
+@Injectable({ providedIn: 'root' })
+export class RequisitionManagementBreadcrumbService {
+  constructor(private appFacade: AppFacade) {}
+
+  breadcrumb$(prefix: string): Observable<BreadcrumbItem[]> {
+    return this.appFacade.routingInProgress$.pipe(
+      whenFalsy(),
+      withLatestFrom(this.appFacade.path$.pipe(whenTruthy())),
+      switchMap(([, path]) => {
+        if (path.endsWith('buyer')) {
+          return of([{ key: 'account.requisitions.requisitions' }]);
+        } else if (path.endsWith('approver')) {
+          return of([{ key: 'account.requisitions.approvals' }]);
+        }
+        // tslint:disable-next-line: no-console
+        console.log(prefix);
+        return EMPTY;
+      })
+    );
+  }
+}
diff --git a/projects/requisition-management/src/app/store/requisition-management-store.module.ts b/projects/requisition-management/src/app/store/requisition-management-store.module.ts
new file mode 100644
index 00000000000..db4909b55d2
--- /dev/null
+++ b/projects/requisition-management/src/app/store/requisition-management-store.module.ts
@@ -0,0 +1,28 @@
+import { NgModule } from '@angular/core';
+import { EffectsModule } from '@ngrx/effects';
+import { ActionReducerMap, StoreModule } from '@ngrx/store';
+import { pick } from 'lodash-es';
+
+import { resetOnLogoutMeta } from 'ish-core/utils/meta-reducers';
+
+import { RequisitionManagementState } from './requisition-management-store';
+
+const requisitionManagementReducers: ActionReducerMap<RequisitionManagementState> = {};
+
+const requisitionManagementEffects = [];
+
+const metaReducers = [resetOnLogoutMeta];
+
+@NgModule({
+  imports: [
+    EffectsModule.forFeature(requisitionManagementEffects),
+    StoreModule.forFeature('RequisitionManagement', requisitionManagementReducers, { metaReducers }),
+  ],
+})
+export class RequisitionManagementStoreModule {
+  static forTesting(...reducers: (keyof ActionReducerMap<RequisitionManagementState>)[]) {
+    return StoreModule.forFeature('RequisitionManagement', pick(requisitionManagementReducers, reducers), {
+      metaReducers,
+    });
+  }
+}
diff --git a/projects/requisition-management/src/app/store/requisition-management-store.ts b/projects/requisition-management/src/app/store/requisition-management-store.ts
new file mode 100644
index 00000000000..f2a78f0d5b1
--- /dev/null
+++ b/projects/requisition-management/src/app/store/requisition-management-store.ts
@@ -0,0 +1,6 @@
+import { createFeatureSelector } from '@ngrx/store';
+
+// tslint:disable-next-line: no-empty-interface
+export interface RequisitionManagementState {}
+
+export const getRequisitionManagementState = createFeatureSelector<RequisitionManagementState>('RequisitionManagement');
diff --git a/projects/requisition-management/src/index.html b/projects/requisition-management/src/index.html
new file mode 100644
index 00000000000..269111aba33
--- /dev/null
+++ b/projects/requisition-management/src/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Requisition Management</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+          <style>
          .commit-tease,
          .user-profile-mini-avatar,
          .avatar,
          .vcard-details,
          .signup-prompt-bg {
            display: none !IMPORTANT;
          }
        </style>
         <script>
          document.addEventListener('DOMContentLoaded', function() {
            this.querySelectorAll('a').forEach(anchor => {
              anchor.addEventListener('click', e => {
                e.preventDefault();

                const redact = new URLSearchParams(window.location.search).get('redact');
                const hasExistingParams = anchor.href.includes('?');
                window.location.href = anchor.href + (hasExistingParams ? `&redact=${redact}` : `?redact=${redact}`);
              });
            });
          });
        </script>
 </head>
+  <body>
+    <ish-requisition-management-root></ish-requisition-management-root>
+  </body>
+</html>
diff --git a/projects/requisition-management/src/login.component.ts b/projects/requisition-management/src/login.component.ts
new file mode 100644
index 00000000000..945b221aece
--- /dev/null
+++ b/projects/requisition-management/src/login.component.ts
@@ -0,0 +1,13 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  template: `
+    <div class="container">
+      <h1>Requisition Management</h1>
+      <ish-login-form loginType="email"></ish-login-form>
+    </div>
+  `,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+// tslint:disable-next-line: component-creation-test
+export class LoginComponent {}
diff --git a/projects/requisition-management/src/main.ts b/projects/requisition-management/src/main.ts
new file mode 100644
index 00000000000..a8471379523
--- /dev/null
+++ b/projects/requisition-management/src/main.ts
@@ -0,0 +1,7 @@
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app.module';
+
+platformBrowserDynamic()
+  .bootstrapModule(AppModule)
+  .catch(err => console.error(err));
diff --git a/projects/requisition-management/tsconfig.app.json b/projects/requisition-management/tsconfig.app.json
new file mode 100644
index 00000000000..f3466c0de84
--- /dev/null
+++ b/projects/requisition-management/tsconfig.app.json
@@ -0,0 +1,9 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/app",
+    "types": ["node"]
+  },
+  "files": ["src/main.ts", "../../src/polyfills.ts"],
+  "include": ["src/**/*.d.ts"]
+}
diff --git a/src/app/core/store/customer/customer-store.module.ts b/src/app/core/store/customer/customer-store.module.ts
index 96f4df183c5..376b6a477cb 100644
--- a/src/app/core/store/customer/customer-store.module.ts
+++ b/src/app/core/store/customer/customer-store.module.ts
@@ -20,6 +20,7 @@ import { CustomerState } from './customer-store';
 import { OrdersEffects } from './orders/orders.effects';
 import { ordersReducer } from './orders/orders.reducer';
 import { OrganizationManagementEffects } from './organization-management/organization-management.effects';
+import { RequisitionManagementEffects } from './requisition-management/requisition-management.effects';
 import { RestoreEffects } from './restore/restore.effects';
 import { UserEffects } from './user/user.effects';
 import { userReducer } from './user/user.reducer';
@@ -45,6 +46,7 @@ const customerEffects = [
   UserEffects,
   AuthorizationEffects,
   OrganizationManagementEffects,
+  RequisitionManagementEffects,
 ];
 
 const metaReducers = [resetOnLogoutMeta];
diff --git a/src/app/core/store/customer/requisition-management/requisition-management.effects.ts b/src/app/core/store/customer/requisition-management/requisition-management.effects.ts
new file mode 100644
index 00000000000..828b3e31f50
--- /dev/null
+++ b/src/app/core/store/customer/requisition-management/requisition-management.effects.ts
@@ -0,0 +1,17 @@
+import { Injectable } from '@angular/core';
+import { createEffect } from '@ngrx/effects';
+import { RequisitionManagementBreadcrumbService } from 'requisition-management';
+import { map } from 'rxjs/operators';
+
+import { setBreadcrumbData } from 'ish-core/store/core/viewconf';
+
+@Injectable()
+export class RequisitionManagementEffects {
+  constructor(private requisitionManagementBreadcrumbService: RequisitionManagementBreadcrumbService) {}
+
+  setRequisitionManagementBreadcrumb$ = createEffect(() =>
+    this.requisitionManagementBreadcrumbService
+      .breadcrumb$('/account/requisitions')
+      .pipe(map(breadcrumbData => setBreadcrumbData({ breadcrumbData })))
+  );
+}
diff --git a/src/app/pages/account/account-navigation/account-navigation.component.ts b/src/app/pages/account/account-navigation/account-navigation.component.ts
index 7cc220dc966..be199cfb6b2 100644
--- a/src/app/pages/account/account-navigation/account-navigation.component.ts
+++ b/src/app/pages/account/account-navigation/account-navigation.component.ts
@@ -47,6 +47,14 @@ export class AccountNavigationComponent implements OnInit, OnChanges {
       localizationKey: 'account.organization.user_management',
       permission: 'APP_B2B_MANAGE_USERS',
     },
+    '/account/requisitions/buyer': {
+      localizationKey: 'account.requisitions.requisitions',
+      permission: 'APP_B2B_ORDER_APPROVAL',
+    },
+    '/account/requisitions/approver': {
+      localizationKey: 'account.requisitions.approvals',
+      permission: 'APP_B2B_ORDER_APPROVAL',
+    },
     '/logout': { localizationKey: 'account.navigation.logout.link' },
   };
 
diff --git a/src/app/pages/account/account-page.module.ts b/src/app/pages/account/account-page.module.ts
index d85a68b372d..52b4b5ce76e 100644
--- a/src/app/pages/account/account-page.module.ts
+++ b/src/app/pages/account/account-page.module.ts
@@ -74,6 +74,14 @@ const accountPageRoutes: Routes = [
           permission: 'APP_B2B_MANAGE_USERS',
         },
       },
+      {
+        path: 'requisitions',
+        loadChildren: () => import('requisition-management').then(m => m.RequisitionManagementModule),
+        canActivate: [AuthorizationToggleGuard],
+        data: {
+          permission: 'APP_B2B_ORDER_APPROVAL',
+        },
+      },
     ],
   },
 ];
diff --git a/src/assets/i18n/en_US.json b/src/assets/i18n/en_US.json
index 0d72706897a..c029844a185 100644
--- a/src/assets/i18n/en_US.json
+++ b/src/assets/i18n/en_US.json
@@ -2876,5 +2876,9 @@
   "account.organization.user_management.new_user.confirmation": "The user \"{{0}}\" has been created.",
   "account.organization.user_management.update_user.confirmation": "The user \"{{0}}\" has been updated.",
   "subject.has.no.permission.assigned": "You do not have the required permission to perform this action.",
-  "user.not.authenticated": "You are not authenticated to access this page."
+  "user.not.authenticated": "You are not authenticated to access this page.",
+  "account.requisitions.requisitions": "Requisitions",
+  "account.requisitions.requisitions.text": "This list shows all your order requests that need to be approved by an approver. You can also view all requests that have been approved or rejected.",
+  "account.requisitions.approvals": "Approvals",
+  "account.requisitions.approvals.text": "This list shows all order requests that need to be approved by you. You can also display all the requests that you have already approved or that you have rejected."
 }
diff --git a/tsconfig.json b/tsconfig.json
index 0844fca7200..21f9f5235b1 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -19,6 +19,9 @@
       "ish-shell/*": ["src/app/shell/*"],
       "organization-management": [
         "projects/organization-management/src/app/exports"
+      ],
+      "requisition-management": [
+        "projects/requisition-management/src/app/exports"
       ]
     },
     "lib": ["es2018", "dom"],