export data

src/app/tools/export.component.html

@@ -1,3 +1,25 @@
-<div class="page-header">
-    <h1>Export</h1>
-</div>
+<form (ngSubmit)="submit()">
+    <div class="page-header">
+        <h1>{{'exportVault' | i18n}}</h1>
+    </div>
+    <p>{{'exportMasterPassword' | i18n}}</p>
+    <div class="alert alert-warning" role="alert">
+        <h4 class="alert-heading">{{'warning' | i18n}}</h4>
+        <p class="mb-0">{{'exportWarning' | i18n}}</p>
+    </div>
+    <div class="row">
+        <div class="form-group col-6">
+            <label for="masterPassword">{{'masterPass' | i18n}}</label>
+            <div class="d-flex">
+                <input id="masterPassword" type="{{showPassword ? 'text' : 'password'}}" name="MasterPassword" class="text-monospace form-control"
+                    [(ngModel)]="masterPassword" required appAutofocus>
+                <button type="button" class="ml-1 btn btn-link" appBlurClick title="{{'toggleVisibility' | i18n}}" (click)="togglePassword()">
+                    <i class="fa fa-lg" [ngClass]="{'fa-eye': !showPassword, 'fa-eye-slash': showPassword}"></i>
+                </button>
+            </div>
+        </div>
+    </div>
+    <button appBlurClick type="submit" class="btn btn-primary">
+        {{'submit' | i18n}}
+    </button>
+</form>

src/app/tools/export.component.ts

@@ -1,9 +1,32 @@
-import {
-    Component,
-} from '@angular/core';
+import { ToasterService } from 'angular2-toaster';
+import { Angulartics2 } from 'angulartics2';
+
+import { Component } from '@angular/core';
+
+import { CryptoService } from 'jslib/abstractions/crypto.service';
+import { ExportService } from 'jslib/abstractions/export.service';
+import { I18nService } from 'jslib/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
+import { UserService } from 'jslib/abstractions/user.service';
+
+import { ExportComponent as BaseExportComponent } from 'jslib/angular/components/export.component';
 
 @Component({
     selector: 'app-export',
     templateUrl: 'export.component.html',
 })
-export class ExportComponent { }
+export class ExportComponent extends BaseExportComponent {
+    constructor(analytics: Angulartics2, toasterService: ToasterService,
+        cryptoService: CryptoService, userService: UserService,
+        i18nService: I18nService, platformUtilsService: PlatformUtilsService,
+        exportService: ExportService) {
+        super(analytics, toasterService, cryptoService, userService, i18nService, platformUtilsService,
+            exportService, window);
+    }
+
+    protected saved() {
+        super.saved();
+        this.masterPassword = null;
+        this.toasterService.popAsync('success', null, this.i18nService.t('exportSuccess'));
+    }
+}