You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@submarine.apache.org by li...@apache.org on 2020/05/19 15:30:42 UTC
[submarine] branch master updated: SUBMARINE-504. Enable angular
style check in github actions
This is an automated email from the ASF dual-hosted git repository.
liuxun pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/submarine.git
The following commit(s) were added to refs/heads/master by this push:
new 0bf5b71 SUBMARINE-504. Enable angular style check in github actions
0bf5b71 is described below
commit 0bf5b71163fa366b1f91e7d9c5b6e4ce02b827b1
Author: pingsutw <pi...@gmail.com>
AuthorDate: Tue May 19 00:26:40 2020 +0800
SUBMARINE-504. Enable angular style check in github actions
### What is this PR for?
- Enable angular style check in github actions
- Fix code style in workbench-ng
### What type of PR is it?
[Improvement]
### Todos
* [ ] - Task
### What is the Jira issue?
https://issues.apache.org/jira/browse/SUBMARINE-504
### How should this be tested?
https://github.com/pingsutw/hadoop-submarine/actions/runs/107861642
https://travis-ci.org/github/pingsutw/hadoop-submarine/builds/688248808
### Screenshots (if appropriate)
### Questions:
* Does the licenses files need update? No
* Is there breaking changes for older versions? No
* Does this needs documentation? No
Author: pingsutw <pi...@gmail.com>
Closes #292 from pingsutw/SUBMARINE-504 and squashes the following commits:
30e51df [pingsutw] address comment issue
d678f55 [pingsutw] update
2df7488 [pingsutw] SUBMARINE-504. Enable angular style check in github actions
---
.github/workflows/master.yml | 14 +-
.../{lint-java.sh => style-check/lint-angular.sh} | 17 +-
dev-support/{ => style-check}/lint-java.sh | 0
dev-support/{ => style-check}/lint-scala.sh | 0
submarine-workbench/workbench-web-ng/.prettierrc | 3 +-
submarine-workbench/workbench-web-ng/package.json | 9 +-
.../workbench-web-ng/src/app/app-routing.module.ts | 4 +-
.../workbench-web-ng/src/app/app.component.ts | 2 +-
.../src/app/components/components.module.ts | 3 +-
.../page-layout/page-layout.component.html | 11 +-
.../page-layout/page-layout.component.ts | 6 +-
.../src/app/interfaces/experiment-spec.ts | 2 +-
.../workbench-web-ng/src/app/interfaces/project.ts | 32 +-
.../workbench-web-ng/src/app/interfaces/role.ts | 2 +-
.../src/app/interfaces/sys-dept-item.ts | 2 +-
.../src/app/interfaces/sys-dept-select.ts | 2 +-
.../src/app/interfaces/sys-team.ts | 4 +-
.../src/app/pages/user/login/login.component.html | 5 +-
.../src/app/pages/user/login/login.component.ts | 13 +-
.../pages/user/register/register.component.html | 188 +++---
.../app/pages/user/register/register.component.ts | 18 +-
.../app/pages/workbench/data/data.component.html | 694 ++++++++++++++-------
.../src/app/pages/workbench/data/data.component.ts | 141 ++---
.../workbench/experiment/experiment.component.html | 153 ++++-
.../workbench/experiment/experiment.component.ts | 35 +-
.../workbench/experiment/experiment.module.ts | 4 +-
.../app/pages/workbench/home/home.component.html | 270 ++++----
.../src/app/pages/workbench/home/home.component.ts | 71 ++-
.../interpreter-add-modal.component.html | 14 +-
.../interpreter-add-modal.component.ts | 2 +-
.../interpreter/interpreter.component.html | 24 +-
.../workbench/interpreter/interpreter.component.ts | 17 +-
.../data-dict-config-modal.component.html | 105 +++-
.../data-dict-config-modal.component.ts | 46 +-
.../data-dict-modal/data-dict-modal.component.html | 16 +-
.../manager/data-dict/data-dict.component.html | 18 +-
.../manager/data-dict/data-dict.component.ts | 16 +-
.../manager/department/department.component.html | 409 +++++++-----
.../manager/department/department.component.ts | 284 +++++----
.../workbench/manager/manager-routing.module.ts | 2 +-
.../pages/workbench/manager/manager.component.ts | 4 +-
.../app/pages/workbench/manager/manager.module.ts | 13 +-
.../manager/user-drawer/user-drawer.component.html | 8 +-
.../manager/user-drawer/user-drawer.component.ts | 106 ++--
.../user-password-modal.component.html | 21 +-
.../workbench/manager/user/user.component.html | 98 +--
.../pages/workbench/manager/user/user.component.ts | 51 +-
.../app/pages/workbench/model/model.component.ts | 7 +-
.../pages/workbench/workbench-routing.module.ts | 5 +-
.../app/pages/workbench/workbench.component.html | 32 +-
.../src/app/pages/workbench/workbench.component.ts | 7 +-
.../src/app/pages/workbench/workbench.module.ts | 3 +-
.../new-project-page.component.html | 219 ++++---
.../new-project-page/new-project-page.component.ts | 79 +--
.../workspace/project/project.component.html | 140 +++--
.../workspace/project/project.component.ts | 105 ++--
.../workspace/release/release.component.html | 50 +-
.../workspace/release/release.component.ts | 8 +-
.../workspace/shared/shared.component.html | 50 +-
.../workbench/workspace/shared/shared.component.ts | 8 +-
.../workbench/workspace/team/team.component.html | 75 +--
.../workbench/workspace/team/team.component.ts | 148 ++---
.../workspace/training/training.component.html | 84 ++-
.../workspace/training/training.component.ts | 35 +-
.../workbench/workspace/workspace.component.html | 41 +-
.../workbench/workspace/workspace.component.ts | 10 +-
.../pages/workbench/workspace/workspace.module.ts | 47 +-
.../src/app/services/auth.service.ts | 4 +-
.../src/app/services/department.service.ts | 50 +-
.../src/app/services/experiment.service.ts | 11 +-
.../src/app/services/project.service.ts | 39 +-
.../src/app/services/system-utils.service.ts | 28 +-
.../src/app/services/team.service.ts | 97 +--
.../src/app/services/user.service.ts | 79 +--
.../workbench-web-ng/src/index.html | 22 +-
submarine-workbench/workbench-web-ng/src/main.ts | 2 +-
76 files changed, 2557 insertions(+), 1887 deletions(-)
diff --git a/.github/workflows/master.yml b/.github/workflows/master.yml
index cec0da3..fb03794 100644
--- a/.github/workflows/master.yml
+++ b/.github/workflows/master.yml
@@ -1,12 +1,6 @@
name: Submarine
-on:
- push:
- branches:
- - master
- pull_request:
- branches:
- - master
+on: [push, pull_request]
jobs:
build:
@@ -90,6 +84,8 @@ jobs:
restore-keys: |
${{ runner.os }}-maven-io-
- name: Java Style
- run: ./dev-support/lint-java.sh
+ run: ./dev-support/style-check/lint-java.sh
- name: Scala Style
- run: ./dev-support/lint-scala.sh
+ run: ./dev-support/style-check/lint-scala.sh
+ - name: Angular Style
+ run: ./dev-support/style-check/lint-angular.sh
diff --git a/dev-support/lint-java.sh b/dev-support/style-check/lint-angular.sh
similarity index 58%
copy from dev-support/lint-java.sh
copy to dev-support/style-check/lint-angular.sh
index 6b1dea6..4d2a29f 100755
--- a/dev-support/lint-java.sh
+++ b/dev-support/style-check/lint-angular.sh
@@ -1,4 +1,4 @@
-#!/usr/bin/env bash
+#!/usr/bin/env bash
#
# Licensed to the Apache Software Foundation (ASF) under one or more
@@ -17,15 +17,18 @@
# limitations under the License.
#
-export MAVEN_OPTS="-Xmx2g -XX:ReservedCodeCacheSize=512m -Dorg.slf4j.simpleLogger.defaultLogLevel=WARN"
-mvn --no-transfer-progress install -DskipTests -pl "!org.apache.submarine:submarine-cloud"
+npm install prettier@^2.0.5
-ERRORS=$(mvn checkstyle:check | grep ERROR)
+WORKBENCH_NG=./submarine-workbench/workbench-web-ng
-if test ! -z "$ERRORS"; then
- echo -e "Checkstyle checks failed at following occurrences:\n$ERRORS"
- find . -name checkstyle-output.xml | xargs cat | grep -v checkstyle | grep -v "<?xml"
+PRETTIER_ERRORS=$(./node_modules/.bin/prettier --check --trailing-comma none "$WORKBENCH_NG/src/**/*.{ts,html}" | grep "Forgot to run Prettier?")
+
+
+if test "$PRETTIER_ERRORS"; then
+ echo -e "prettier checks failed at following occurrences:\n$PRETTIER_ERRORS\n"
+ echo -e "Please use \\033[31m"./node_modules/.bin/prettier --write --trailing-comma none "$WORKBENCH_NG/src/**/*.{ts,html}""\\033[0m to format code automatically\n"
exit 1
else
echo -e "Checkstyle checks passed."
fi
+
diff --git a/dev-support/lint-java.sh b/dev-support/style-check/lint-java.sh
similarity index 100%
rename from dev-support/lint-java.sh
rename to dev-support/style-check/lint-java.sh
diff --git a/dev-support/lint-scala.sh b/dev-support/style-check/lint-scala.sh
similarity index 100%
rename from dev-support/lint-scala.sh
rename to dev-support/style-check/lint-scala.sh
diff --git a/submarine-workbench/workbench-web-ng/.prettierrc b/submarine-workbench/workbench-web-ng/.prettierrc
index 4b9bb8a..d46557d 100644
--- a/submarine-workbench/workbench-web-ng/.prettierrc
+++ b/submarine-workbench/workbench-web-ng/.prettierrc
@@ -8,7 +8,8 @@
{
"files": ".prettierrc",
"options": {
- "parser": "json"
+ "parser": "json",
+ "trailingComma": "none"
}
}
]
diff --git a/submarine-workbench/workbench-web-ng/package.json b/submarine-workbench/workbench-web-ng/package.json
index a535ce0..7e944dd 100644
--- a/submarine-workbench/workbench-web-ng/package.json
+++ b/submarine-workbench/workbench-web-ng/package.json
@@ -2,6 +2,7 @@
"name": "workbench-web-ng",
"version": "0.0.0",
"scripts": {
+ "precommit": "lint-staged",
"ng": "ng",
"start": "ng serve --proxy-config proxy.conf.js",
"build": "ng build",
@@ -21,6 +22,7 @@
"@angular/platform-browser-dynamic": "~8.2.9",
"@angular/router": "~8.2.9",
"date-fns": "^2.6.0",
+ "lint-staged": "^10.2.2",
"lodash": "^4.17.15",
"md5": "^2.2.1",
"ng-zorro-antd": "8.1.2",
@@ -28,6 +30,11 @@
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
},
+ "lint-staged": {
+ "src/**/*.{js,json,ts,html}": [
+ "prettier --write --trailing-comma none --single-quote"
+ ]
+ },
"devDependencies": {
"@angular-devkit/build-angular": "^0.803.21",
"@angular/cli": "~8.3.9",
@@ -47,7 +54,7 @@
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
- "prettier": "^1.17.0",
+ "prettier": "^2.0.5",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
diff --git a/submarine-workbench/workbench-web-ng/src/app/app-routing.module.ts b/submarine-workbench/workbench-web-ng/src/app/app-routing.module.ts
index 6ca7ea4..2020a21 100644
--- a/submarine-workbench/workbench-web-ng/src/app/app-routing.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/app-routing.module.ts
@@ -30,11 +30,11 @@ const routes: Routes = [
{
path: 'workbench',
canActivate: [AuthGuard],
- loadChildren: () => import('./pages/workbench/workbench.module').then(m => m.WorkbenchModule)
+ loadChildren: () => import('./pages/workbench/workbench.module').then((m) => m.WorkbenchModule)
},
{
path: 'user',
- loadChildren: () => import('./pages/user/user.module').then(m => m.UserModule)
+ loadChildren: () => import('./pages/user/user.module').then((m) => m.UserModule)
}
];
diff --git a/submarine-workbench/workbench-web-ng/src/app/app.component.ts b/submarine-workbench/workbench-web-ng/src/app/app.component.ts
index 51425c4..833cdae 100644
--- a/submarine-workbench/workbench-web-ng/src/app/app.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/app.component.ts
@@ -31,7 +31,7 @@ export class AppComponent implements OnInit {
constructor(private router: Router, private title: Title) {}
ngOnInit(): void {
- this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(() => {
+ this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe(() => {
const paths = this.router.url.split('/');
this.title.setTitle(`Submarine - ${paths[paths.length - 1]}`);
diff --git a/submarine-workbench/workbench-web-ng/src/app/components/components.module.ts b/submarine-workbench/workbench-web-ng/src/app/components/components.module.ts
index bfbd54c..435e27d 100644
--- a/submarine-workbench/workbench-web-ng/src/app/components/components.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/components/components.module.ts
@@ -28,5 +28,4 @@ import { PageLayoutComponent } from './page-layout/page-layout.component';
imports: [CommonModule, RouterModule, NgZorroAntdModule],
exports: [PageLayoutComponent]
})
-export class ComponentsModule {
-}
+export class ComponentsModule {}
diff --git a/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.html b/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.html
index 354e2ec..b4d2143 100644
--- a/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.html
@@ -17,16 +17,16 @@
~ under the License.
-->
-<div [ngStyle]="!title ? {margin: '-24px -24px 0'} : null">
- <nz-page-header [nzTitle]="title|titlecase" *ngIf="breadCrumb">
+<div [ngStyle]="!title ? { margin: '-24px -24px 0' } : null">
+ <nz-page-header [nzTitle]="title | titlecase" *ngIf="breadCrumb">
<nz-breadcrumb nz-page-header-breadcrumb>
<nz-breadcrumb-item *ngFor="let item of breadCrumb">
- <a *ngIf="item.routerLink" [routerLink]="item.routerLink">{{item.title|titlecase}}</a>
- <span *ngIf="!item.routerLink">{{item.title|titlecase}}</span>
+ <a *ngIf="item.routerLink" [routerLink]="item.routerLink">{{ item.title | titlecase }}</a>
+ <span *ngIf="!item.routerLink">{{ item.title | titlecase }}</span>
</nz-breadcrumb-item>
</nz-breadcrumb>
<nz-page-header-content *ngIf="description">
- <p>{{description}}</p>
+ <p>{{ description }}</p>
</nz-page-header-content>
</nz-page-header>
@@ -34,4 +34,3 @@
<ng-content></ng-content>
</div>
</div>
-
diff --git a/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.ts b/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.ts
index 66e7eb8..ec0774d 100644
--- a/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/components/page-layout/page-layout.component.ts
@@ -34,9 +34,7 @@ export class PageLayoutComponent implements OnInit {
@Input() description: string;
@Input() breadCrumb: BreadCrumbItem[];
- constructor() {
- }
+ constructor() {}
- ngOnInit() {
- }
+ ngOnInit() {}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/interfaces/experiment-spec.ts b/submarine-workbench/workbench-web-ng/src/app/interfaces/experiment-spec.ts
index 1f239da..98906bf 100644
--- a/submarine-workbench/workbench-web-ng/src/app/interfaces/experiment-spec.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/interfaces/experiment-spec.ts
@@ -18,5 +18,5 @@
*/
export class ExperimentSpec {
- // TODO(pingsutw): After refactor submarine experiment spec, we could start implementing it.
+ // TODO(pingsutw): After refactor submarine experiment spec, we could start implementing it.
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/interfaces/project.ts b/submarine-workbench/workbench-web-ng/src/app/interfaces/project.ts
index 7a1e250..956529f 100644
--- a/submarine-workbench/workbench-web-ng/src/app/interfaces/project.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/interfaces/project.ts
@@ -19,19 +19,19 @@
import { BaseEntity } from './base-entity';
-export interface Project extends BaseEntity{
- name: string;
- description: string;
- tags: string[];
- inputTagVisibility: boolean;
- projectInputTag: string;
- starNum: number;
- likeNum: number;
- messageNum: number;
- permission: string;
- projectFilesList: string[];
- teamName: string;
- type: string;
- userName: string;
- visibility: string;
- }
+export interface Project extends BaseEntity {
+ name: string;
+ description: string;
+ tags: string[];
+ inputTagVisibility: boolean;
+ projectInputTag: string;
+ starNum: number;
+ likeNum: number;
+ messageNum: number;
+ permission: string;
+ projectFilesList: string[];
+ teamName: string;
+ type: string;
+ userName: string;
+ visibility: string;
+}
diff --git a/submarine-workbench/workbench-web-ng/src/app/interfaces/role.ts b/submarine-workbench/workbench-web-ng/src/app/interfaces/role.ts
index 1464300..2e84f92 100644
--- a/submarine-workbench/workbench-web-ng/src/app/interfaces/role.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/interfaces/role.ts
@@ -37,6 +37,6 @@ export class Role {
this.creatorId = role.creatorId;
this.createTime = role.createTime;
this.deleted = role.deleted;
- this.permissions = role.permissions.map(permission => new Permission(permission));
+ this.permissions = role.permissions.map((permission) => new Permission(permission));
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-item.ts b/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-item.ts
index 563320e..a0241c5 100644
--- a/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-item.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-item.ts
@@ -26,7 +26,7 @@ export interface SysDeptItem {
sortOrder: number;
children: SysDeptItem[];
id: string;
- parent?: SysDeptItem
+ parent?: SysDeptItem;
parentCode?: string;
level?: number;
expand?: boolean;
diff --git a/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-select.ts b/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-select.ts
index 5929e7b..223a24b 100644
--- a/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-select.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-dept-select.ts
@@ -29,6 +29,6 @@ export class SysDeptSelect {
this.value = data.value;
this.title = data.title;
this.disabled = data.disabled;
- this.children = data.children.map(item => new SysDeptSelect(item));
+ this.children = data.children.map((item) => new SysDeptSelect(item));
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-team.ts b/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-team.ts
index 5626713..0d6bb4a 100644
--- a/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-team.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/interfaces/sys-team.ts
@@ -20,6 +20,6 @@
import { BaseEntity } from './base-entity';
export interface SysTeam extends BaseEntity {
- teamName: string;
- owner: string;
+ teamName: string;
+ owner: string;
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.html
index 2f1804d..cbf02c4 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.html
@@ -39,7 +39,10 @@
</label>
<a class="login-form-forgot" [routerLink]="['/user/register']">Forgot password</a>
<button nz-button class="login-form-button" [nzType]="'primary'">Sign In</button>
- <span>New to Submarine? <a [routerLink]="['/user/register']">Create an account!</a></span>
+ <span>
+ New to Submarine?
+ <a [routerLink]="['/user/register']">Create an account!</a>
+ </span>
</nz-form-control>
</nz-form-item>
</form>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.ts
index 3f2f09b..40917f4 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/user/login/login.component.ts
@@ -54,7 +54,7 @@ export class LoginComponent implements OnInit {
() => {
this.loginSuccess();
},
- error => {
+ (error) => {
this.requestFailed(error);
}
);
@@ -74,11 +74,12 @@ export class LoginComponent implements OnInit {
}
requestFailed(error: Error) {
- this.nzNotificationService.error('Login Failed',
- 'Username and password are incorrect, ' +
- 'please try again or create an account',
+ this.nzNotificationService.error(
+ 'Login Failed',
+ 'Username and password are incorrect, please try again or create an account',
{
- nzDuration: 4000
- });
+ nzDuration: 4000
+ }
+ );
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.html
index e974c77..a9adbbb 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.html
@@ -17,91 +17,103 @@
~ under the License.
-->
- <form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()" style="width: 550px;">
- <nz-form-item>
- <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="usernameTpl" [nzOffset]="5">
- <nz-input-group nzPrefixIcon="user">
- <input type="text" id ="username" nz-input formControlName="username" placeholder="Username" />
- </nz-input-group>
- <ng-template #usernameTpl let-control>
- <ng-container *ngIf="control.hasError('required')">
- Enter your username!
- </ng-container>
- <ng-container *ngIf="control.hasError('usernameIsExisted')">
- The username already exists!
- </ng-container>
- </ng-template>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item>
- <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="emailTpl" [nzOffset]="5">
- <nz-input-group nzPrefixIcon="mail">
- <input nz-input formControlName="email" id="email" placeholder="Email" />
- </nz-input-group>
- <ng-template #emailTpl let-control>
- <ng-container *ngIf="control.hasError('required')">
- Type your email!
- </ng-container>
- <ng-container *ngIf="control.hasError('emailIsExisted')">
- The email is already used!
- </ng-container>
- <ng-container *ngIf="control.hasError('email')">
- The email is invalid!
- </ng-container>
- </ng-template>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item>
- <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="passwordTpl" [nzOffset]="5">
- <nz-input-group nzPrefixIcon="lock">
- <input
- type="password"
- nz-input
- formControlName="password"
- placeholder="Password"
- (ngModelChange)="updateConfirmValidator()"
- />
- </nz-input-group>
- <ng-template #passwordTpl let-control>
- <ng-container *ngIf="!control.hasError('validPasswordLength') && !control.hasError('required')">
- Password's length must be in 6 ~ 20 characters.
- </ng-container>
- <ng-container *ngIf="control.hasError('required')">
- Type your password!
- </ng-container>
- </ng-template>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item>
- <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="errorTpl" [nzOffset]="5">
- <nz-input-group nzPrefixIcon="lock">
- <input nz-input type="password" formControlName="checkPassword" id="checkPassword" placeholder="Re-enter password"/>
- </nz-input-group>
- <ng-template #errorTpl let-control>
- <ng-container *ngIf="control.hasError('required')">
- Type your password again!
- </ng-container>
- <ng-container *ngIf="control.hasError('confirm')">
- Passwords must match!
- </ng-container>
- </ng-template>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item nz-row class="register-area">
- <nz-form-control [nzSpan]="14" [nzOffset]="5">
- <label nz-checkbox formControlName="agree">
- <span>I have read the <a>agreement</a></span>
- </label>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item nz-row class="register-area">
- <nz-form-control [nzSpan]="14" [nzOffset]="5">
- <button nz-button nzType="primary" nzBlock [disabled]="!validateForm.valid">Sign Up</button>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item>
- <nz-form-control [nzSpan]="14" [nzOffset]="5">
- <span>Already have an account? <a [routerLink]="['/user/login']">Sign-In</a></span>
- </nz-form-control>
- </nz-form-item>
- </form>
+<form nz-form [formGroup]="validateForm" (ngSubmit)="submitForm()" style="width: 550px;">
+ <nz-form-item>
+ <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="usernameTpl" [nzOffset]="5">
+ <nz-input-group nzPrefixIcon="user">
+ <input type="text" id="username" nz-input formControlName="username" placeholder="Username" />
+ </nz-input-group>
+ <ng-template #usernameTpl let-control>
+ <ng-container *ngIf="control.hasError('required')">
+ Enter your username!
+ </ng-container>
+ <ng-container *ngIf="control.hasError('usernameIsExisted')">
+ The username already exists!
+ </ng-container>
+ </ng-template>
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item>
+ <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="emailTpl" [nzOffset]="5">
+ <nz-input-group nzPrefixIcon="mail">
+ <input nz-input formControlName="email" id="email" placeholder="Email" />
+ </nz-input-group>
+ <ng-template #emailTpl let-control>
+ <ng-container *ngIf="control.hasError('required')">
+ Type your email!
+ </ng-container>
+ <ng-container *ngIf="control.hasError('emailIsExisted')">
+ The email is already used!
+ </ng-container>
+ <ng-container *ngIf="control.hasError('email')">
+ The email is invalid!
+ </ng-container>
+ </ng-template>
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item>
+ <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="passwordTpl" [nzOffset]="5">
+ <nz-input-group nzPrefixIcon="lock">
+ <input
+ type="password"
+ nz-input
+ formControlName="password"
+ placeholder="Password"
+ (ngModelChange)="updateConfirmValidator()"
+ />
+ </nz-input-group>
+ <ng-template #passwordTpl let-control>
+ <ng-container *ngIf="!control.hasError('validPasswordLength') && !control.hasError('required')">
+ Password's length must be in 6 ~ 20 characters.
+ </ng-container>
+ <ng-container *ngIf="control.hasError('required')">
+ Type your password!
+ </ng-container>
+ </ng-template>
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item>
+ <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="errorTpl" [nzOffset]="5">
+ <nz-input-group nzPrefixIcon="lock">
+ <input
+ nz-input
+ type="password"
+ formControlName="checkPassword"
+ id="checkPassword"
+ placeholder="Re-enter password"
+ />
+ </nz-input-group>
+ <ng-template #errorTpl let-control>
+ <ng-container *ngIf="control.hasError('required')">
+ Type your password again!
+ </ng-container>
+ <ng-container *ngIf="control.hasError('confirm')">
+ Passwords must match!
+ </ng-container>
+ </ng-template>
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item nz-row class="register-area">
+ <nz-form-control [nzSpan]="14" [nzOffset]="5">
+ <label nz-checkbox formControlName="agree">
+ <span>
+ I have read the
+ <a>agreement</a>
+ </span>
+ </label>
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item nz-row class="register-area">
+ <nz-form-control [nzSpan]="14" [nzOffset]="5">
+ <button nz-button nzType="primary" nzBlock [disabled]="!validateForm.valid">Sign Up</button>
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item>
+ <nz-form-control [nzSpan]="14" [nzOffset]="5">
+ <span>
+ Already have an account?
+ <a [routerLink]="['/user/login']">Sign-In</a>
+ </span>
+ </nz-form-control>
+ </nz-form-item>
+</form>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.ts
index 1bd05cb..9b5e589 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/user/register/register.component.ts
@@ -29,7 +29,7 @@ import { Router } from '@angular/router';
export class RegisterComponent implements OnInit {
validateForm: FormGroup;
// TODO(kevin85421): the mock data must be removed in the future
- existedUsernames = [ 'test', 'haha'];
+ existedUsernames = ['test', 'haha'];
existedEmails = ['test@gmail.com'];
constructor(private fb: FormBuilder, private router: Router) {}
@@ -49,7 +49,7 @@ export class RegisterComponent implements OnInit {
this.validateForm.controls[i].updateValueAndValidity();
}
this.router.navigate(['/user/login']);
- console.log("SubmitForm (Sign up Page)");
+ console.log('SubmitForm (Sign up Page)');
}
updateConfirmValidator(): void {
@@ -74,29 +74,29 @@ export class RegisterComponent implements OnInit {
} else {
return { agree: false };
}
- }
+ };
// Username cannot be the same with existed usernames
- checkExistedUsernames(control: FormControl): {[s: string]: boolean} {
+ checkExistedUsernames(control: FormControl): { [s: string]: boolean } {
if (this.existedUsernames.indexOf(control.value) !== -1) {
- return { 'usernameIsExisted': true };
+ return { usernameIsExisted: true };
}
return null;
}
// Email cannot be the same with existed emails
- checkExistedEmails(control: FormControl): {[s: string]: boolean} {
+ checkExistedEmails(control: FormControl): { [s: string]: boolean } {
if (this.existedEmails.indexOf(control.value) !== -1) {
- return { 'emailIsExisted': true };
+ return { emailIsExisted: true };
}
return null;
}
// Password must be longer than 6 characters and shorter than 20 characters
- checkPasswordLength(control: FormControl): {[s: string]: boolean} {
+ checkPasswordLength(control: FormControl): { [s: string]: boolean } {
const controlValue = String(control.value);
if (controlValue.length < 6 || controlValue.length > 20) {
- return { 'validPasswordLength': false };
+ return { validPasswordLength: false };
}
return null;
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.html
index 455f892..e9bd895 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.html
@@ -17,186 +17,76 @@
~ under the License.
-->
- <nz-layout style="margin: -24px -24px 16px;">
- <nz-layout class="inner-layout">
- <div id="dataOuter">
- <nz-breadcrumb>
- <nz-breadcrumb-item>
- <a [routerLink]="['/', 'workbench', 'home']">Home</a>
- </nz-breadcrumb-item>
- <nz-breadcrumb-item>Data</nz-breadcrumb-item>
- </nz-breadcrumb>
- <br/>
- <h2>Data</h2>
- <nz-content>A Submarine database is a collection of tables. A Submarine table is a collection of structured data. </nz-content>
- <br>
- </div>
-
- <div *ngIf="newTable==false">
- <div class="trainingDiv">
- <h1 style="margin-top: 15px;margin-left: 25px;">
- Database
- <button nz-button id="createBtn" [nzSize]='large' nzType="primary" style="margin-top: 8px;margin-right: 50px;float: right;" (click)="newTable=true;"><i nz-icon nzType="plus"></i>Create Table</button>
- </h1>
- </div>
- <div class="trainingDiv" style="margin-top: 2px;">
- <div nz-row>
- <div nz-col [nzSpan]="6">
- <h3 style="margin-left: 20px;margin-top: 20px;">Database & Table List</h3>
- <nz-select
- [nzMaxTagCount]="3"
- [nzMaxTagPlaceholder]="tagPlaceHolder"
- nzMode="multiple"
- nzPlaceHolder="Please select"
- [(ngModel)]="listOfDatabaseValue"
- style="width: 80%;margin-left: 20px;margin-top: 20px;"
- >
- <nz-option *ngFor="let database of listofDatabase" [nzLabel]="database" [nzValue]="database"></nz-option>
- </nz-select>
- <nz-input-group nzSearch style="width:80%;margin-top: 10px;margin-left: 20px;" [nzAddOnAfter]="suffixIconButton">
- <input type="text" nz-input placeholder="input search text" [(ngModel)]="searchValue" />
- </nz-input-group>
- <ng-template #suffixIconButton>
- <button nz-button nzSearch (click)="listSort()"><i nz-icon nzType="search"></i></button>
- </ng-template>
- </div>
- <div nz-col [nzSpan]="18">
- <nz-tabset>
- <nz-tab nzTitle="Schema">
- <nz-table #basicTable nzBordered [nzFrontPagination]="false" [nzData]="listData" [nzNoResult]="'No data'" [nzTitle]="addColButton">
- <thead>
- <tr>
- <th>Column Name</th>
- <th>Column Type</th>
- <th>Comment</th>
- <th>Action</th>
- </tr>
- </thead>
- <tbody>
- <tr *ngFor="let data of basicTable.data">
- <td>
- <ng-container *ngIf="!data.edit; else nameInputTpl">
- {{ data.name }}
- </ng-container>
- <ng-template #nameInputTpl>
- <input type="text" nz-input [(ngModel)]="data.nameTmp" />
- </ng-template>
- </td>
- <td>
- <ng-container *ngIf="!data.edit; else typeInputTpl">
- {{ data.type }}
- </ng-container>
- <ng-template #typeInputTpl>
- <input type="text" nz-input [(ngModel)]="data.typeTmp" />
- </ng-template>
- </td>
- <td>
- <ng-container *ngIf="!data.edit; else cmtInputTpl">
- {{ data.comment }}
- </ng-container>
- <ng-template #cmtInputTpl>
- <input type="text" nz-input [(ngModel)]="data.commentTmp" />
- </ng-template>
- </td>
- <td>
- <ng-container *ngIf="!data.edit; else actionInputTpl">
- <button nz-button nzType="link" (click)="data.edit=true;" style="padding-left: 2px;padding-right: 5px;">Edit</button>|<button nz-button nzType="link" (click)="removeCol(data.name)" style="padding-left: 2px;padding-right: 5px;">Delete</button>
- </ng-container>
- <ng-template #actionInputTpl>
- <button nz-button nzType="link" (click)="saveEdit(data);" style="padding-left: 2px;padding-right: 5px;">Save</button>|<button nz-button nzType="link" (click)="cancelEdit(data)" style="padding-left: 2px;padding-right: 5px;">Cancel</button>
- </ng-template>
- </td>
- </tr>
- </tbody>
- <ng-template #addColButton>
- <button nz-button nzSearch (click)="addCol()"><i nz-icon nzType="plus"></i>Add New Column</button>
- </ng-template>
- </nz-table>
- </nz-tab>
- <nz-tab nzTitle="Sample Data">
- <nz-spin [nzSpinning]="true" style="height: 50px;">
- </nz-spin>
- </nz-tab>
- </nz-tabset>
- </div>
- </div>
- </div>
+<nz-layout style="margin: -24px -24px 16px;">
+ <nz-layout class="inner-layout">
+ <div id="dataOuter">
+ <nz-breadcrumb>
+ <nz-breadcrumb-item>
+ <a [routerLink]="['/', 'workbench', 'home']">Home</a>
+ </nz-breadcrumb-item>
+ <nz-breadcrumb-item>Data</nz-breadcrumb-item>
+ </nz-breadcrumb>
+ <br />
+ <h2>Data</h2>
+ <nz-content>
+ A Submarine database is a collection of tables. A Submarine table is a collection of structured data.
+ </nz-content>
+ <br />
+ </div>
+
+ <div *ngIf="newTable == false">
+ <div class="trainingDiv">
+ <h1 style="margin-top: 15px; margin-left: 25px;">
+ Database
+ <button
+ nz-button
+ id="createBtn"
+ [nzSize]="large"
+ nzType="primary"
+ style="margin-top: 8px; margin-right: 50px; float: right;"
+ (click)="newTable = true"
+ >
+ <i nz-icon nzType="plus"></i>
+ Create Table
+ </button>
+ </h1>
</div>
- <div *ngIf="newTable">
- <div class="trainingDiv">
- <h2 style="margin-top: 15px;margin-left: 25px;">
- Create a Table in Three Steps
- <button nz-button nzType="primary" nzShape="circle" style="float:right;margin-right: 15px;" (click)="newTable=false;"><i nz-icon
- nzType="close" nzTheme="outline"></i></button>
- </h2>
- </div>
- <div class="trainingDiv" style="margin-top: 2px;">
- <div style="padding-left:25%;padding-right:25%;margin-top: 30px;">
- <nz-steps [nzCurrent]="newTablePage">
- <nz-step nzTitle="Specify Data Source"></nz-step>
- <nz-step nzTitle="Specify Table Attributes"></nz-step>
- <nz-step nzTitle="Review Table Data"></nz-step>
- </nz-steps>
+ <div class="trainingDiv" style="margin-top: 2px;">
+ <div nz-row>
+ <div nz-col [nzSpan]="6">
+ <h3 style="margin-left: 20px; margin-top: 20px;">Database & Table List</h3>
+ <nz-select
+ [nzMaxTagCount]="3"
+ [nzMaxTagPlaceholder]="tagPlaceHolder"
+ nzMode="multiple"
+ nzPlaceHolder="Please select"
+ [(ngModel)]="listOfDatabaseValue"
+ style="width: 80%; margin-left: 20px; margin-top: 20px;"
+ >
+ <nz-option *ngFor="let database of listOfDatabase" [nzLabel]="database" [nzValue]="database"></nz-option>
+ </nz-select>
+ <nz-input-group
+ nzSearch
+ style="width: 80%; margin-top: 10px; margin-left: 20px;"
+ [nzAddOnAfter]="suffixIconButton"
+ >
+ <input type="text" nz-input placeholder="input search text" [(ngModel)]="searchValue" />
+ </nz-input-group>
+ <ng-template #suffixIconButton>
+ <button nz-button nzSearch (click)="listSort()"><i nz-icon nzType="search"></i></button>
+ </ng-template>
</div>
- <div [ngSwitch]="newTablePage">
- <form [formGroup]="createTable">
- <div *ngSwitchCase="0">
- <div>
- <label class="form-label" style="margin-top: 62px;">Data soruce:</label>
- <nz-radio-group class="form-control" style="margin-top: 55px;" formControlName="dataSource">
- <label nz-radio-button nzValue="upload">Upload File</label>
- <label nz-radio-button nzValue="hdfs">HDFS</label>
- <label nz-radio-button nzValue="s3" nzDisabled>S3</label>
- </nz-radio-group>
- <div>
- <label class="form-label">Path:</label>
- <nz-input-group nzAddOnBefore="file://" style="width: 400px;margin-top: 25px;">
- <input type="text" nz-input class="form-control" formControlName="path" />
- </nz-input-group>
- </div>
- <div style="margin-left: 38%;" *ngIf="createTable.get('dataSource').value=='upload'">
- <label style="float:left;width:200px;text-align: right;padding-right: 12px;clear: left;margin-top: 32px;color: black;margin-left: -21%;">Upload Files:</label>
- <nz-upload nzAction="https://jsonplaceholder.typicode.com/posts/">
- <button nz-button style="margin-top: 25px;"><i nz-icon nzType="upload"></i><span>Click to Upload</span></button>
- </nz-upload>
- </div>
- <div>
- <label class="form-label">File Type:</label>
- <nz-select style="width: 200px;margin-top: 25px;" nzShowSearch nzAllowClear nzPlaceHolder="Select file type" class="form-control" formControlName="fileType">
- <nz-option nzLabel="csv" nzValue="csv"></nz-option>
- <nz-option nzLabel="csv" nzValue="csv"></nz-option>
- <nz-option nzLabel="csv" nzValue="csv"></nz-option>
- </nz-select>
- </div>
- <div>
- <label class="form-label"><span class="red-star">* </span> Column Delimiter:</label>
- <input type="text" style="width: 50px;margin-top: 25px;" nz-input class="form-control" formControlName="columnDelimiter" />
- <label nz-checkbox style="margin-left: 20px;" class="form-control" formControlName="header">First row is header</label>
- </div>
- </div>
- <div style="margin-top: 32px;text-align: center;">
- <button id="firstNextBtn" nz-button nzType="primary" [disabled]="!createTable.get('columnDelimiter').valid" (click)="newTablePage = newTablePage + 1">Create Table with UI </button>
- <button style="margin-left: 5px;" nz-button nzType="default" [disabled]="true" (click)="openNotebook()">Create Table in Notebook </button>
- </div>
- </div>
- <div *ngSwitchCase="1">
- <div>
- <label class="form-label">Database Name:</label>
- <nz-select style="width: 200px;margin-top: 25px;" nzShowSearch nzAllowClear nzPlaceHolder="Select database" class="form-control" formControlName="dataBaseName">
- <nz-option nzLabel="default" nzValue="default"></nz-option>
- <nz-option nzLabel="db1" nzValue="db1"></nz-option>
- <nz-option nzLabel="db2" nzValue="db2"></nz-option>
- </nz-select>
- </div>
- <div>
- <label class="form-label"><span class="red-star">* </span> Table Name:</label>
- <input id="tableName" type="text" style="width: 200px;margin-top: 25px;" nz-input class="form-control" formControlName="tableName" />
- </div>
- <div>
- <label class="form-label">Parse Columns:</label>
- <button nz-button style="margin-top: 25px;" nzType="default" (click)="parseColumn()"><i nz-icon nzType="sync" nzTheme="outline"></i>Parse </button>
- </div>
- <nz-table #createTTable style="margin-left:30%;margin-right:30%;margin-top: 25px;" nzBordered [nzFrontPagination]="false" [nzData]="listCreateData" [nzNoResult]="'No data'" [nzTitle]="addCreateColButton">
+ <div nz-col [nzSpan]="18">
+ <nz-tabset>
+ <nz-tab nzTitle="Schema">
+ <nz-table
+ #basicTable
+ nzBordered
+ [nzFrontPagination]="false"
+ [nzData]="listData"
+ [nzNoResult]="'No data'"
+ [nzTitle]="addColButton"
+ >
<thead>
<tr>
<th>Column Name</th>
@@ -206,94 +96,426 @@
</tr>
</thead>
<tbody>
- <tr *ngFor="let data of createTTable.data">
+ <tr *ngFor="let data of basicTable.data">
<td>
- <ng-container *ngIf="!data.edit; else nameCreateInputTpl">
+ <ng-container *ngIf="!data.edit; else nameInputTpl">
{{ data.name }}
</ng-container>
- <ng-template #nameCreateInputTpl>
- <input type="text" style="width: 120px;" nz-input [ngModelOptions]="{standalone: true}" [(ngModel)]="data.nameTmp" />
+ <ng-template #nameInputTpl>
+ <input type="text" nz-input [(ngModel)]="data.nameTmp" />
</ng-template>
</td>
<td>
- <ng-container *ngIf="!data.edit; else typeCreateInputTpl">
+ <ng-container *ngIf="!data.edit; else typeInputTpl">
{{ data.type }}
</ng-container>
- <ng-template #typeCreateInputTpl>
- <input style="width: 120px;" type="text" nz-input [(ngModel)]="data.typeTmp" [ngModelOptions]="{standalone: true}" />
+ <ng-template #typeInputTpl>
+ <input type="text" nz-input [(ngModel)]="data.typeTmp" />
</ng-template>
</td>
<td>
- <ng-container *ngIf="!data.edit; else cmtCreateInputTpl">
+ <ng-container *ngIf="!data.edit; else cmtInputTpl">
{{ data.comment }}
</ng-container>
- <ng-template #cmtCreateInputTpl>
- <input type="text" style="width: 120px;" nz-input [(ngModel)]="data.commentTmp" [ngModelOptions]="{standalone: true}" />
+ <ng-template #cmtInputTpl>
+ <input type="text" nz-input [(ngModel)]="data.commentTmp" />
</ng-template>
</td>
<td>
- <ng-container *ngIf="!data.edit">
- <button nz-button nzType="link" (click)="data.edit=true;" style="padding-left: 2px;padding-right: 5px;">Edit</button>|<button nz-button nzType="link" (click)="removeCreateCol(data.name)" style="padding-left: 2px;padding-right: 5px;">Delete</button>
- </ng-container>
- <ng-container *ngIf="data.edit">
- <button nz-button nzType="link" (click)="saveCreateEdit(data);" style="padding-left: 2px;padding-right: 5px;">Save</button>|<button nz-button nzType="link" (click)="cancelCreateEdit(data)" style="padding-left: 2px;padding-right: 5px;">Cancel</button>
+ <ng-container *ngIf="!data.edit; else actionInputTpl">
+ <button
+ nz-button
+ nzType="link"
+ (click)="data.edit = true"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Edit
+ </button>
+ |
+ <button
+ nz-button
+ nzType="link"
+ (click)="removeCol(data.name)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Delete
+ </button>
</ng-container>
+ <ng-template #actionInputTpl>
+ <button
+ nz-button
+ nzType="link"
+ (click)="saveEdit(data)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Save
+ </button>
+ |
+ <button
+ nz-button
+ nzType="link"
+ (click)="cancelEdit(data)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Cancel
+ </button>
+ </ng-template>
</td>
</tr>
</tbody>
- <ng-template #addCreateColButton>
- <button nz-button nzSearch (click)="addCreateCol()"><i nz-icon nzType="plus"></i>Add New Column</button>
+ <ng-template #addColButton>
+ <button nz-button nzSearch (click)="addCol()">
+ <i nz-icon nzType="plus"></i>
+ Add New Column
+ </button>
</ng-template>
</nz-table>
- <div style="margin-top: 32px;text-align: center;">
- <button nz-button nzType="default" (click)="newTablePage = newTablePage - 1">Previous Step </button>
- <button id="secondNextBtn" style="margin-left: 5px;" nz-button nzType="primary" [disabled]="!createTable.get('tableName').valid" (click)="newTablePage = newTablePage + 1">Next Step </button>
- </div>
- </div>
- <div *ngSwitchCase="2">
- <nz-spin [nzSpinning]="true">
- <h3 style="margin-top: 50px;">Sample Data</h3>
- </nz-spin>
- <div style="margin-top: 32px;text-align: center;">
- <button nz-button nzType="default" (click)="newTablePage = newTablePage - 1">Previous Step </button>
- <button id="submit" style="margin-left: 5px;" nz-button nzType="primary" type="button" (click)="submit()">Submit</button>
- </div>
- </div>
- </form>
+ </nz-tab>
+ <nz-tab nzTitle="Sample Data">
+ <nz-spin [nzSpinning]="true" style="height: 50px;"></nz-spin>
+ </nz-tab>
+ </nz-tabset>
</div>
</div>
- <div class="trainingDiv" style="margin-top: 2px;padding-left: 100px;">
- <div [ngSwitch]="newTablePage">
+ </div>
+ </div>
+ <div *ngIf="newTable">
+ <div class="trainingDiv">
+ <h2 style="margin-top: 15px; margin-left: 25px;">
+ Create a Table in Three Steps
+ <button
+ nz-button
+ nzType="primary"
+ nzShape="circle"
+ style="float: right; margin-right: 15px;"
+ (click)="newTable = false"
+ >
+ <i nz-icon nzType="close" nzTheme="outline"></i>
+ </button>
+ </h2>
+ </div>
+ <div class="trainingDiv" style="margin-top: 2px;">
+ <div style="padding-left: 25%; padding-right: 25%; margin-top: 30px;">
+ <nz-steps [nzCurrent]="newTablePage">
+ <nz-step nzTitle="Specify Data Source"></nz-step>
+ <nz-step nzTitle="Specify Table Attributes"></nz-step>
+ <nz-step nzTitle="Review Table Data"></nz-step>
+ </nz-steps>
+ </div>
+ <div [ngSwitch]="newTablePage">
+ <form [formGroup]="createTable">
<div *ngSwitchCase="0">
- <h3 style="color: gray;"><strong>Description</strong></h3>
- <h4 style="color: gray;margin-top: 20px;"><strong>Data source</strong></h4>
- <h4 style="color: gray;">Upload one or more local files to the store and create table structures and data based on the file to content.</h4>
- <h4 style="color: gray;margin-top: 15px;"><strong>Path</strong></h4>
- <h4 style="color: gray;">Specify the storage path of the file.</h4>
- <h4 style="color: gray;margin-top: 15px;"><strong>Upload Files</strong></h4>
- <h4 style="color: gray;">When using the `upload file` mode, add the local file to the upload list by clicking the `Select File` button. Click the `Start Upload` button to upload the file to the specified storage directory.</h4>
- <h4 style="color: gray;margin-top: 15px;"><strong>File type</strong></h4>
- <h4 style="color: gray;">Select the type of file to upload, the system will parse the file according to the file type you choose.</h4>
- <h4 style="color: gray;margin-top: 15px;"><strong>Column Delimiter</strong></h4>
- <h4 style="color: gray;">Sets the separator for each column in the record, and the system splits the field based on the separator.</h4>
- <h4 style="color: gray;margin-top: 15px;"><strong>Create Table with UI</strong></h4>
- <h4 style="color: gray;">Use the UI operation interface to set the table schema, preview the data, and create the table step by step.</h4>
- <h4 style="color: gray;margin-top: 15px;"><strong>Create Table in Notebook</strong></h4>
- <h4 style="color: gray;">Create a table by handwriting the code through the notebook.</h4>
+ <div>
+ <label class="form-label" style="margin-top: 62px;">Data soruce:</label>
+ <nz-radio-group class="form-control" style="margin-top: 55px;" formControlName="dataSource">
+ <label nz-radio-button nzValue="upload">Upload File</label>
+ <label nz-radio-button nzValue="hdfs">HDFS</label>
+ <label nz-radio-button nzValue="s3" nzDisabled>S3</label>
+ </nz-radio-group>
+ <div>
+ <label class="form-label">Path:</label>
+ <nz-input-group nzAddOnBefore="file://" style="width: 400px; margin-top: 25px;">
+ <input type="text" nz-input class="form-control" formControlName="path" />
+ </nz-input-group>
+ </div>
+ <div style="margin-left: 38%;" *ngIf="createTable.get('dataSource').value == 'upload'">
+ <label
+ style="
+ float: left;
+ width: 200px;
+ text-align: right;
+ padding-right: 12px;
+ clear: left;
+ margin-top: 32px;
+ color: black;
+ margin-left: -21%;
+ "
+ >
+ Upload Files:
+ </label>
+ <nz-upload nzAction="https://jsonplaceholder.typicode.com/posts/">
+ <button nz-button style="margin-top: 25px;">
+ <i nz-icon nzType="upload"></i>
+ <span>Click to Upload</span>
+ </button>
+ </nz-upload>
+ </div>
+ <div>
+ <label class="form-label">File Type:</label>
+ <nz-select
+ style="width: 200px; margin-top: 25px;"
+ nzShowSearch
+ nzAllowClear
+ nzPlaceHolder="Select file type"
+ class="form-control"
+ formControlName="fileType"
+ >
+ <nz-option nzLabel="csv" nzValue="csv"></nz-option>
+ <nz-option nzLabel="csv" nzValue="csv"></nz-option>
+ <nz-option nzLabel="csv" nzValue="csv"></nz-option>
+ </nz-select>
+ </div>
+ <div>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Column Delimiter:
+ </label>
+ <input
+ type="text"
+ style="width: 50px; margin-top: 25px;"
+ nz-input
+ class="form-control"
+ formControlName="columnDelimiter"
+ />
+ <label nz-checkbox style="margin-left: 20px;" class="form-control" formControlName="header">
+ First row is header
+ </label>
+ </div>
+ </div>
+ <div style="margin-top: 32px; text-align: center;">
+ <button
+ id="firstNextBtn"
+ nz-button
+ nzType="primary"
+ [disabled]="!createTable.get('columnDelimiter').valid"
+ (click)="newTablePage = newTablePage + 1"
+ >
+ Create Table with UI
+ </button>
+ <button style="margin-left: 5px;" nz-button nzType="default" [disabled]="true" (click)="openNotebook()">
+ Create Table in Notebook
+ </button>
+ </div>
</div>
<div *ngSwitchCase="1">
- <h3 style="color: gray;"><strong>Description</strong></h3>
- <h4 style="color: gray;margin-top: 20px;"><strong>Database Name</strong></h4>
- <h4 style="color: gray;">Select which database belongs to which table you want to create.</h4>
- <h4 style="color: gray;margin-top: 20px;"><strong>Table Name</strong></h4>
- <h4 style="color: gray;">Set the name of the table and automatically check if the table name conflicts.</h4>
- <h4 style="color: gray;margin-top: 20px;"><strong>Parse Columns</strong></h4>
- <h4 style="color: gray;">Click the Parse button to analyze the schema field and type of the table from the uploaded file.</h4>
- <h4 style="color: gray;margin-top: 20px;"><strong>Columns Attributes Table</strong></h4>
- <h4 style="color: gray;">You can modify the field name and type for the analyzed schema.</h4>
+ <div>
+ <label class="form-label">Database Name:</label>
+ <nz-select
+ style="width: 200px; margin-top: 25px;"
+ nzShowSearch
+ nzAllowClear
+ nzPlaceHolder="Select database"
+ class="form-control"
+ formControlName="dataBaseName"
+ >
+ <nz-option nzLabel="default" nzValue="default"></nz-option>
+ <nz-option nzLabel="db1" nzValue="db1"></nz-option>
+ <nz-option nzLabel="db2" nzValue="db2"></nz-option>
+ </nz-select>
+ </div>
+ <div>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Table Name:
+ </label>
+ <input
+ id="tableName"
+ type="text"
+ style="width: 200px; margin-top: 25px;"
+ nz-input
+ class="form-control"
+ formControlName="tableName"
+ />
+ </div>
+ <div>
+ <label class="form-label">Parse Columns:</label>
+ <button nz-button style="margin-top: 25px;" nzType="default" (click)="parseColumn()">
+ <i nz-icon nzType="sync" nzTheme="outline"></i>
+ Parse
+ </button>
+ </div>
+ <nz-table
+ #createTTable
+ style="margin-left: 30%; margin-right: 30%; margin-top: 25px;"
+ nzBordered
+ [nzFrontPagination]="false"
+ [nzData]="listCreateData"
+ [nzNoResult]="'No data'"
+ [nzTitle]="addCreateColButton"
+ >
+ <thead>
+ <tr>
+ <th>Column Name</th>
+ <th>Column Type</th>
+ <th>Comment</th>
+ <th>Action</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let data of createTTable.data">
+ <td>
+ <ng-container *ngIf="!data.edit; else nameCreateInputTpl">
+ {{ data.name }}
+ </ng-container>
+ <ng-template #nameCreateInputTpl>
+ <input
+ type="text"
+ style="width: 120px;"
+ nz-input
+ [ngModelOptions]="{ standalone: true }"
+ [(ngModel)]="data.nameTmp"
+ />
+ </ng-template>
+ </td>
+ <td>
+ <ng-container *ngIf="!data.edit; else typeCreateInputTpl">
+ {{ data.type }}
+ </ng-container>
+ <ng-template #typeCreateInputTpl>
+ <input
+ style="width: 120px;"
+ type="text"
+ nz-input
+ [(ngModel)]="data.typeTmp"
+ [ngModelOptions]="{ standalone: true }"
+ />
+ </ng-template>
+ </td>
+ <td>
+ <ng-container *ngIf="!data.edit; else cmtCreateInputTpl">
+ {{ data.comment }}
+ </ng-container>
+ <ng-template #cmtCreateInputTpl>
+ <input
+ type="text"
+ style="width: 120px;"
+ nz-input
+ [(ngModel)]="data.commentTmp"
+ [ngModelOptions]="{ standalone: true }"
+ />
+ </ng-template>
+ </td>
+ <td>
+ <ng-container *ngIf="!data.edit">
+ <button
+ nz-button
+ nzType="link"
+ (click)="data.edit = true"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Edit
+ </button>
+ |
+ <button
+ nz-button
+ nzType="link"
+ (click)="removeCreateCol(data.name)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Delete
+ </button>
+ </ng-container>
+ <ng-container *ngIf="data.edit">
+ <button
+ nz-button
+ nzType="link"
+ (click)="saveCreateEdit(data)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Save
+ </button>
+ |
+ <button
+ nz-button
+ nzType="link"
+ (click)="cancelCreateEdit(data)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Cancel
+ </button>
+ </ng-container>
+ </td>
+ </tr>
+ </tbody>
+ <ng-template #addCreateColButton>
+ <button nz-button nzSearch (click)="addCreateCol()">
+ <i nz-icon nzType="plus"></i>
+ Add New Column
+ </button>
+ </ng-template>
+ </nz-table>
+ <div style="margin-top: 32px; text-align: center;">
+ <button nz-button nzType="default" (click)="newTablePage = newTablePage - 1">Previous Step</button>
+ <button
+ id="secondNextBtn"
+ style="margin-left: 5px;"
+ nz-button
+ nzType="primary"
+ [disabled]="!createTable.get('tableName').valid"
+ (click)="newTablePage = newTablePage + 1"
+ >
+ Next Step
+ </button>
+ </div>
+ </div>
+ <div *ngSwitchCase="2">
+ <nz-spin [nzSpinning]="true">
+ <h3 style="margin-top: 50px;">Sample Data</h3>
+ </nz-spin>
+ <div style="margin-top: 32px; text-align: center;">
+ <button nz-button nzType="default" (click)="newTablePage = newTablePage - 1">Previous Step</button>
+ <button
+ id="submit"
+ style="margin-left: 5px;"
+ nz-button
+ nzType="primary"
+ type="button"
+ (click)="submit()"
+ >
+ Submit
+ </button>
+ </div>
</div>
+ </form>
+ </div>
+ </div>
+ <div class="trainingDiv" style="margin-top: 2px; padding-left: 100px;">
+ <div [ngSwitch]="newTablePage">
+ <div *ngSwitchCase="0">
+ <h3 style="color: gray;"><strong>Description</strong></h3>
+ <h4 style="color: gray; margin-top: 20px;"><strong>Data source</strong></h4>
+ <h4 style="color: gray;">
+ Upload one or more local files to the store and create table structures and data based on the file to
+ content.
+ </h4>
+ <h4 style="color: gray; margin-top: 15px;"><strong>Path</strong></h4>
+ <h4 style="color: gray;">Specify the storage path of the file.</h4>
+ <h4 style="color: gray; margin-top: 15px;"><strong>Upload Files</strong></h4>
+ <h4 style="color: gray;">
+ When using the `upload file` mode, add the local file to the upload list by clicking the `Select File`
+ button. Click the `Start Upload` button to upload the file to the specified storage directory.
+ </h4>
+ <h4 style="color: gray; margin-top: 15px;"><strong>File type</strong></h4>
+ <h4 style="color: gray;">
+ Select the type of file to upload, the system will parse the file according to the file type you choose.
+ </h4>
+ <h4 style="color: gray; margin-top: 15px;"><strong>Column Delimiter</strong></h4>
+ <h4 style="color: gray;">
+ Sets the separator for each column in the record, and the system splits the field based on the separator.
+ </h4>
+ <h4 style="color: gray; margin-top: 15px;"><strong>Create Table with UI</strong></h4>
+ <h4 style="color: gray;">
+ Use the UI operation interface to set the table schema, preview the data, and create the table step by
+ step.
+ </h4>
+ <h4 style="color: gray; margin-top: 15px;"><strong>Create Table in Notebook</strong></h4>
+ <h4 style="color: gray;">Create a table by handwriting the code through the notebook.</h4>
+ </div>
+ <div *ngSwitchCase="1">
+ <h3 style="color: gray;"><strong>Description</strong></h3>
+ <h4 style="color: gray; margin-top: 20px;"><strong>Database Name</strong></h4>
+ <h4 style="color: gray;">Select which database belongs to which table you want to create.</h4>
+ <h4 style="color: gray; margin-top: 20px;"><strong>Table Name</strong></h4>
+ <h4 style="color: gray;">Set the name of the table and automatically check if the table name conflicts.</h4>
+ <h4 style="color: gray; margin-top: 20px;"><strong>Parse Columns</strong></h4>
+ <h4 style="color: gray;">
+ Click the Parse button to analyze the schema field and type of the table from the uploaded file.
+ </h4>
+ <h4 style="color: gray; margin-top: 20px;"><strong>Columns Attributes Table</strong></h4>
+ <h4 style="color: gray;">You can modify the field name and type for the analyzed schema.</h4>
</div>
</div>
</div>
+ </div>
</nz-layout>
</nz-layout>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.ts
index 61ce83c..8005fd5 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/data/data.component.ts
@@ -18,7 +18,7 @@
*/
import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormControl, Validators } from '@angular/forms';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
@Component({
selector: 'submarine-data',
@@ -26,12 +26,11 @@ import { FormGroup, FormControl, Validators } from '@angular/forms';
styleUrls: ['./data.component.scss']
})
export class DataComponent implements OnInit {
-
listOfDatabaseValue = ['default'];
- listofDatabase = ['db1', 'db2', 'default'];
- searchValue = "";
+ listOfDatabase = ['db1', 'db2', 'default'];
+ searchValue = '';
- listData= [
+ listData = [
{
name: 'col-0',
type: 'string',
@@ -53,128 +52,122 @@ export class DataComponent implements OnInit {
];
listCount = 2;
- //Create table part
+ // Create table part
newTable = false;
newTablePage = 0;
createTable: FormGroup;
listCreateData = [];
- constructor() { }
+ constructor() {}
ngOnInit() {
- this.createTable = new FormGroup({
- 'dataSource': new FormControl("upload"),
- 'path': new FormControl(null),
- 'uploadFile': new FormControl(null),
- 'fileType': new FormControl(null),
- 'columnDelimiter': new FormControl('.', [Validators.required]),
- 'header': new FormControl('false'),
-
- 'dataBaseName': new FormControl('db1'),
- 'tableName': new FormControl(null, [Validators.required])
+ this.createTable = new FormGroup({
+ dataSource: new FormControl('upload'),
+ path: new FormControl(null),
+ uploadFile: new FormControl(null),
+ fileType: new FormControl(null),
+ columnDelimiter: new FormControl('.', [Validators.required]),
+ header: new FormControl('false'),
+
+ dataBaseName: new FormControl('db1'),
+ tableName: new FormControl(null, [Validators.required])
});
}
- //TODO(jasoonn): Perform sorting
- listSort(){
+ // TODO(jasoonn): Perform sorting
+ listSort() {
console.log('sort list according to ' + this.searchValue);
}
- cancelEdit(data){
+ cancelEdit(data) {
data.nameTmp = data.name;
data.typeTmp = data.type;
data.commentTmp = data.comment;
data.edit = false;
}
- //TODO(jasoonn): Update remote database
- saveEdit(data){
+ // TODO(jasoonn): Update remote database
+ saveEdit(data) {
data.name = data.nameTmp;
data.type = data.typeTmp;
data.comment = data.commentTmp;
data.edit = false;
}
- addCol(){
- this.listData.push(
- {
- name: 'col-' + this.listCount,
- type: 'string',
- comment: 'comment...',
- nameTmp: 'col-' + this.listCount,
- typeTmp: 'string',
- commentTmp: 'comment...',
- edit: false
- }
- );
- this.listData=[...this.listData];
- this.listCount ++;
+ addCol() {
+ this.listData.push({
+ name: 'col-' + this.listCount,
+ type: 'string',
+ comment: 'comment...',
+ nameTmp: 'col-' + this.listCount,
+ typeTmp: 'string',
+ commentTmp: 'comment...',
+ edit: false
+ });
+ this.listData = [...this.listData];
+ this.listCount++;
}
- removeCol(name){
- this.listData = this.listData.filter(d => d.name !== name);
+ removeCol(name) {
+ this.listData = this.listData.filter((d) => d.name !== name);
}
- //TODO(jasoonn): Create Table in Notebook
- openNotebook(){
+ // TODO(jasoonn): Create Table in Notebook
+ openNotebook() {
this.newTable = false;
this.newTablePage = 0;
}
- //TODO(jasoonn): Parse column while creating Table
- parseColumn(){
- ;
- }
+ // TODO(jasoonn): Parse column while creating Table
+ parseColumn() {}
- addCreateCol(){
- this.listCreateData.push(
- {
- name: 'col_' + this.listCreateData.length,
- type: 'string',
- comment: 'comment...',
- nameTmp: 'col_' + this.listCreateData.length,
- typeTmp: 'string',
- commentTmp: 'comment...',
- edit: false
- }
- );
- this.listCreateData=[...this.listCreateData];
+ addCreateCol() {
+ this.listCreateData.push({
+ name: 'col_' + this.listCreateData.length,
+ type: 'string',
+ comment: 'comment...',
+ nameTmp: 'col_' + this.listCreateData.length,
+ typeTmp: 'string',
+ commentTmp: 'comment...',
+ edit: false
+ });
+ this.listCreateData = [...this.listCreateData];
}
- removeCreateCol(name){
- this.listCreateData = this.listCreateData.filter(d => d.name !== name);
+ removeCreateCol(name) {
+ this.listCreateData = this.listCreateData.filter((d) => d.name !== name);
}
- cancelCreateEdit(data){
+ cancelCreateEdit(data) {
data.nameTmp = data.name;
data.typeTmp = data.type;
data.commentTmp = data.comment;
data.edit = false;
}
- //TODO(jasoonn): Update remote database
- saveCreateEdit(data){
+ // TODO(jasoonn): Update remote database
+ saveCreateEdit(data) {
data.name = data.nameTmp;
data.type = data.typeTmp;
data.comment = data.commentTmp;
data.edit = false;
}
- //TODO(jasoonn): Create table
- submit(){
+ // TODO(jasoonn): Create table
+ submit() {
this.newTable = false;
this.newTablePage = 0;
console.log(this.createTable);
- this.createTable = new FormGroup({
- 'dataSource': new FormControl("upload"),
- 'path': new FormControl(null),
- 'uploadFile': new FormControl(null),
- 'fileType': new FormControl(null),
- 'columnDelimiter': new FormControl('.', [Validators.required]),
- 'header': new FormControl('false'),
-
- 'dataBaseName': new FormControl('db1'),
- 'tableName': new FormControl(null, [Validators.required])
+ this.createTable = new FormGroup({
+ dataSource: new FormControl('upload'),
+ path: new FormControl(null),
+ uploadFile: new FormControl(null),
+ fileType: new FormControl(null),
+ columnDelimiter: new FormControl('.', [Validators.required]),
+ header: new FormControl('false'),
+
+ dataBaseName: new FormControl('db1'),
+ tableName: new FormControl(null, [Validators.required])
});
this.listCreateData = [];
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.html
index 82fc8d1..61c7ddd 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.html
@@ -26,10 +26,10 @@
</nz-breadcrumb-item>
<nz-breadcrumb-item>experiment</nz-breadcrumb-item>
</nz-breadcrumb>
- <br/>
+ <br />
<h2>Experiment</h2>
<nz-content>A experiment is a way of running a adhoc, pre-defined or pipeline on a scheduled basis.</nz-content>
- <br/>
+ <br />
</div>
</nz-layout>
<div id="experimentData">
@@ -39,14 +39,27 @@
<label nz-radio-button nzValue="Own">Owned By Me</label>
<label nz-radio-button nzValue="Access">Accessable By Me</label>
</nz-radio-group>
- <nz-input-group nzSearch style="width:300px;margin-top: 15px;margin-left:10px;margin-right:5px;" [nzAddOnAfter]="suffixIconButton">
+ <nz-input-group
+ nzSearch
+ style="width: 300px; margin-top: 15px; margin-left: 10px; margin-right: 5px;"
+ [nzAddOnAfter]="suffixIconButton"
+ >
<input type="text" nz-input placeholder="input search text" />
</nz-input-group>
<ng-template #suffixIconButton>
<button nz-button nzType="primary" nzSearch><i nz-icon nzType="search"></i></button>
</ng-template>
- <button nz-button id="openExperiment" nzType="primary" style="margin-right: 30px;margin-bottom: 15px;margin-top: 15px;" (click)="isVisible=true;"><i nz-icon nzType="plus"></i>New Experiment</button>
+ <button
+ nz-button
+ id="openExperiment"
+ nzType="primary"
+ style="margin-right: 30px; margin-bottom: 15px; margin-top: 15px;"
+ (click)="isVisible = true"
+ >
+ <i nz-icon nzType="plus"></i>
+ New Experiment
+ </button>
</div>
<nz-table id="releaseTable" nzBordered #basicTable [nzData]="experimentList" [nzNoResult]="'No data'">
<thead>
@@ -69,8 +82,12 @@
<td>{{ data.runningTime }}</td>
<td>{{ data.finishedTime }}</td>
<td>{{ data.status }}</td>
- <td *ngIf="data.status === 'Succeeded'"><nz-progress nzStrokeLinecap="round" [nzPercent]="100"></nz-progress></td>
- <td *ngIf="data.status !== 'Succeeded'"><nz-progress nzStrokeLinecap="round" [nzPercent]="50"></nz-progress></td>
+ <td *ngIf="data.status === 'Succeeded'">
+ <nz-progress nzStrokeLinecap="round" [nzPercent]="100"></nz-progress>
+ </td>
+ <td *ngIf="data.status !== 'Succeeded'">
+ <nz-progress nzStrokeLinecap="round" [nzPercent]="50"></nz-progress>
+ </td>
<td class="td-action" nzRight="0px">
<a (click)="startExperiment(data)">Start</a>
<a nz-dropdown [nzDropdownMenu]="more">
@@ -99,12 +116,12 @@
</nz-table>
</div>
<nz-modal
- [(nzVisible)]="isVisible"
- nzTitle="Create Experiment"
- [(nzOkText)]="okText"
- [nzOkLoading]="isOkLoading"
- (nzOnCancel)="isVisible=false;"
- [nzWidth]="740"
+ [(nzVisible)]="isVisible"
+ nzTitle="Create Experiment"
+ [(nzOkText)]="okText"
+ [nzOkLoading]="isOkLoading"
+ (nzOnCancel)="isVisible = false"
+ [nzWidth]="740"
>
<div>
<nz-steps [nzCurrent]="current">
@@ -116,50 +133,122 @@
<div>
<form [formGroup]="createExperiment">
<div *nzModalFooter>
- <button nz-button nzType="default" (click)="isVisible=false;"> Cancel </button>
- <button id="go" nz-button nzType="primary" [disabled]="!(createExperiment.get('experimentName').valid && createExperiment.get('description').valid)" (click)="handleOk()">{{okText}}</button>
- <button *ngIf="current>0" nz-button nzType="default" style="float: left;" (click)="current=current-1;okText = 'Next Step';">Prev Step</button>
+ <button nz-button nzType="default" (click)="isVisible = false">Cancel</button>
+ <button
+ id="go"
+ nz-button
+ nzType="primary"
+ [disabled]="!(createExperiment.get('experimentName').valid && createExperiment.get('description').valid)"
+ (click)="handleOk()"
+ >
+ {{ okText }}
+ </button>
+ <button
+ *ngIf="current > 0"
+ nz-button
+ nzType="default"
+ style="float: left;"
+ (click)="current = current - 1; okText = 'Next Step'"
+ >
+ Prev Step
+ </button>
</div>
<div [ngSwitch]="current" style="margin-top: 30px;">
<div *ngSwitchCase="0">
<div>
- <label class="form-label"><span class="red-star">* </span> Experiment Name:</label>
- <input type="text" id="experimentName" style="margin-top: 32px;width: 350px;" class="form-control" formControlName="experimentName">
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Experiment Name:
+ </label>
+ <input
+ type="text"
+ id="experimentName"
+ style="margin-top: 32px; width: 350px;"
+ class="form-control"
+ formControlName="experimentName"
+ />
</div>
<div>
- <label class="form-label"><span class="red-star">* </span>Description:</label>
- <textarea rows="6" class="form-control" style="margin-top: 32px;width: 350px;" formControlName="description"></textarea>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Description:
+ </label>
+ <textarea
+ rows="6"
+ class="form-control"
+ style="margin-top: 32px; width: 350px;"
+ formControlName="description"
+ ></textarea>
</div>
</div>
<div *ngSwitchCase="1" id="page2">
<div>
- <label class="form-label"><span class="red-star">* </span> Experiment Spec:</label>
- <nz-select formControlName="experimentSpec" nzPlaceHolder="Choose" style="width: 350px;margin-top: 30px;">
- <nz-option *ngFor="let experimentSpec of ExperimentSpecs" [nzValue]="experimentSpec" [nzLabel]="experimentSpec"></nz-option>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Experiment Spec:
+ </label>
+ <nz-select
+ formControlName="experimentSpec"
+ nzPlaceHolder="Choose"
+ style="width: 350px; margin-top: 30px;"
+ >
+ <nz-option
+ *ngFor="let experimentSpec of ExperimentSpecs"
+ [nzValue]="experimentSpec"
+ [nzLabel]="experimentSpec"
+ ></nz-option>
</nz-select>
</div>
<div>
- <label class="form-label"><span class="red-star">* </span> Rule Template:</label>
- <nz-select formControlName="ruleTemplate" nzPlaceHolder="Choose" style="width: 350px;margin-top: 30px;">
- <nz-option *ngFor="let ruleTemplate of ruleTemplates" [nzValue]="ruleTemplate" [nzLabel]="ruleTemplate"></nz-option>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Rule Template:
+ </label>
+ <nz-select formControlName="ruleTemplate" nzPlaceHolder="Choose" style="width: 350px; margin-top: 30px;">
+ <nz-option
+ *ngFor="let ruleTemplate of ruleTemplates"
+ [nzValue]="ruleTemplate"
+ [nzLabel]="ruleTemplate"
+ ></nz-option>
</nz-select>
</div>
<div>
- <label class="form-label"><span class="red-star">* </span> Rule Type:</label>
- <nz-radio-group formControlName="ruleType" style="width: 350px;margin-top: 30px;margin-bottom: 30px;">
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Rule Type:
+ </label>
+ <nz-radio-group formControlName="ruleType" style="width: 350px; margin-top: 30px; margin-bottom: 30px;">
<label *ngFor="let ruletype of ruleTypes" nz-radio [nzValue]="ruletype">{{ ruletype }}</label>
</nz-radio-group>
</div>
</div>
<div *ngSwitchCase="2">
<div>
- <label class="pg3-form-label"><span class="red-star">* </span> Start Date:</label>
- <nz-date-picker [nzFormat]="'yyyy/MM/dd'" formControlName="startDate" style="width: 350px;margin-top: 30px;"></nz-date-picker>
+ <label class="pg3-form-label">
+ <span class="red-star">*</span>
+ Start Date:
+ </label>
+ <nz-date-picker
+ [nzFormat]="'yyyy/MM/dd'"
+ formControlName="startDate"
+ style="width: 350px; margin-top: 30px;"
+ ></nz-date-picker>
</div>
<div>
- <label class="pg3-form-label"><span class="red-star">* </span> Schedule Cycle:</label>
- <nz-select formControlName="scheduleCycle" nzPlaceHolder="Choose" style="width: 195px;margin-top: 30px;margin-bottom: 30px;">
- <nz-option *ngFor="let scheduleCycle of scheduleCycles" [nzValue]="scheduleCycle" [nzLabel]="scheduleCycle"></nz-option>
+ <label class="pg3-form-label">
+ <span class="red-star">*</span>
+ Schedule Cycle:
+ </label>
+ <nz-select
+ formControlName="scheduleCycle"
+ nzPlaceHolder="Choose"
+ style="width: 195px; margin-top: 30px; margin-bottom: 30px;"
+ >
+ <nz-option
+ *ngFor="let scheduleCycle of scheduleCycles"
+ [nzValue]="scheduleCycle"
+ [nzLabel]="scheduleCycle"
+ ></nz-option>
</nz-select>
</div>
</div>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.ts
index 3935628..c2c7134 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.component.ts
@@ -29,7 +29,6 @@ import { NzMessageService } from 'ng-zorro-antd';
styleUrls: ['./experiment.component.scss']
})
export class ExperimentComponent implements OnInit {
-
experimentList: ExperimentInfo[] = [];
// About show existing experiments
showExperiment = 'All';
@@ -46,20 +45,17 @@ export class ExperimentComponent implements OnInit {
ruleTypes = ['Strong', 'Weak'];
scheduleCycles = ['Month', 'Week'];
- constructor(
- private experimentService: ExperimentService,
- private nzMessageService: NzMessageService
- ) { }
+ constructor(private experimentService: ExperimentService, private nzMessageService: NzMessageService) {}
ngOnInit() {
- this.createExperiment = new FormGroup({
- 'experimentName': new FormControl(null, Validators.required),
- 'description': new FormControl(null, [Validators.required]),
- 'experimentSpec': new FormControl('Adhoc'),
- 'ruleTemplate': new FormControl('Template1'),
- 'ruleType': new FormControl('Strong'),
- 'startDate': new FormControl(new Date()),
- 'scheduleCycle': new FormControl('Month')
+ this.createExperiment = new FormGroup({
+ experimentName: new FormControl(null, Validators.required),
+ description: new FormControl(null, [Validators.required]),
+ experimentSpec: new FormControl('Adhoc'),
+ ruleTemplate: new FormControl('Template1'),
+ ruleType: new FormControl('Strong'),
+ startDate: new FormControl(new Date()),
+ scheduleCycle: new FormControl('Month')
});
this.fetchExperimentList();
}
@@ -80,18 +76,17 @@ export class ExperimentComponent implements OnInit {
}
fetchExperimentList() {
- this.experimentService
- .fetchExperimentList()
- .subscribe(( list ) => {
- this.experimentList = list;
- });
+ this.experimentService.fetchExperimentList().subscribe((list) => {
+ this.experimentList = list;
+ });
}
onDeleteExperiment(data: ExperimentInfo) {
this.experimentService.deleteExperiment(data.jobId).subscribe(
() => {
this.nzMessageService.success('Delete user success!');
this.fetchExperimentList();
- }, err => {
+ },
+ (err) => {
this.nzMessageService.success(err.message);
}
);
@@ -103,7 +98,7 @@ export class ExperimentComponent implements OnInit {
}
// TODO(jasoonn): Perform part of list
showChange() {
- console.log("Change to " + this.showExperiment);
+ console.log('Change to ' + this.showExperiment);
}
// TODO(jasoonn): Start experiment
startExperiment(Experiment) {
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.module.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.module.ts
index 042d3c9..5eaefa5 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment.module.ts
@@ -1,4 +1,4 @@
-import { NgModule } from "@angular/core";
+import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
/*
@@ -21,6 +21,6 @@ import { ReactiveFormsModule } from '@angular/forms';
*/
@NgModule({
- exports: [ReactiveFormsModule]
+ exports: [ReactiveFormsModule]
})
export class ExperimentModule {}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.html
index 6ecf4a5..44d6afd 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.html
@@ -19,152 +19,176 @@
<div>
<div nz-row>
- <div nz-col nzSpan="24">
- <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height:200px;">
- <nz-card nzTitle="Session" [nzExtra]="sessionExplanation" style="height:188px">
- <nz-statistic [nzValue]="numRunningSession | number" [nzTitle]="'Running'" [nzValueStyle]="{ color: '#1890ff' }"></nz-statistic>
- </nz-card>
- <ng-template #sessionExplanation>
- <a nz-icon nzType="info-circle"></a>
- </ng-template>
- </div>
- <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height:200px;">
- <nz-card nzTitle="Job" [nzExtra]="jobExplanation" style="height:188px">
- <nz-statistic [nzValue]="numRunningJob | number" [nzTitle]="'Running'" [nzValueStyle]="{ color: '#1890ff' }"></nz-statistic>
- </nz-card>
- <ng-template #jobExplanation>
- <a nz-icon nzType="info-circle"></a>
- </ng-template>
- </div>
- <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height:200px;">
- <nz-card nzTitle="GPU / CPU" [nzExtra]="GpuCpuExplanation" style="height:188px">
- <div nz-col nzSpan="24">
- <p>GPU</p>
- <nz-progress [nzPercent]="usedGPUpercent"></nz-progress>
- </div>
- <div nz-col nzSpan="24" style="padding-top: 5px;">
- <p>CPU</p>
- <nz-progress [nzPercent]="usedCPUpercent"></nz-progress>
+ <div nz-col nzSpan="24">
+ <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height: 200px;">
+ <nz-card nzTitle="Session" [nzExtra]="sessionExplanation" style="height: 188px;">
+ <nz-statistic
+ [nzValue]="numRunningSession | number"
+ [nzTitle]="'Running'"
+ [nzValueStyle]="{ color: '#1890ff' }"
+ ></nz-statistic>
+ </nz-card>
+ <ng-template #sessionExplanation>
+ <a nz-icon nzType="info-circle"></a>
+ </ng-template>
+ </div>
+ <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height: 200px;">
+ <nz-card nzTitle="Job" [nzExtra]="jobExplanation" style="height: 188px;">
+ <nz-statistic
+ [nzValue]="numRunningJob | number"
+ [nzTitle]="'Running'"
+ [nzValueStyle]="{ color: '#1890ff' }"
+ ></nz-statistic>
+ </nz-card>
+ <ng-template #jobExplanation>
+ <a nz-icon nzType="info-circle"></a>
+ </ng-template>
+ </div>
+ <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height: 200px;">
+ <nz-card nzTitle="GPU / CPU" [nzExtra]="GpuCpuExplanation" style="height: 188px;">
+ <div nz-col nzSpan="24">
+ <p>GPU</p>
+ <nz-progress [nzPercent]="usedGPUpercent"></nz-progress>
+ </div>
+ <div nz-col nzSpan="24" style="padding-top: 5px;">
+ <p>CPU</p>
+ <nz-progress [nzPercent]="usedCPUpercent"></nz-progress>
+ </div>
+ </nz-card>
+ <ng-template #GpuCpuExplanation>
+ <a nz-icon nzType="info-circle"></a>
+ </ng-template>
+ </div>
+ <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height: 200px;">
+ <nz-card nzTitle="Memory(GB)" [nzExtra]="memoryExplanation" style="height: 188px;">
+ <div nz-col nzSpan="24">
+ <div nz-col nzSpan="8">
+ <nz-statistic [nzValue]="usedMemory" [nzTitle]="'Used(GB)'"></nz-statistic>
</div>
- </nz-card>
- <ng-template #GpuCpuExplanation>
- <a nz-icon nzType="info-circle"></a>
- </ng-template>
- </div>
- <div nz-col nzXl="12" nzXXl="6" style="padding-right: 4px; padding-left: 4px; height:200px;">
- <nz-card nzTitle="Memory(GB)" [nzExtra]="memoryExplanation" style="height:188px">
- <div nz-col nzSpan="24">
- <div nz-col nzSpan="8">
- <nz-statistic [nzValue]="usedMemory" [nzTitle]="'Used(GB)'"></nz-statistic>
- </div>
- <div nz-col nzSpan="8">
- <nz-statistic [nzValue]="totalMemory" [nzTitle]="'Total(GB)'"></nz-statistic>
- </div>
- <div nz-col nzSpan="8">
- <nz-statistic
- [nzValue]="usedMemoryPercent | number: '1.0-1'"
- [nzTitle]="'Used(%)'"
- [nzSuffix]="'%'"
- [nzValueStyle]="{ color: '#1890ff' }"
- >
- </nz-statistic>
- </div>
+ <div nz-col nzSpan="8">
+ <nz-statistic [nzValue]="totalMemory" [nzTitle]="'Total(GB)'"></nz-statistic>
</div>
- <div nz-col nzSpan="24" style="padding-top: 5px;">
- <nz-progress [nzPercent]="usedMemoryPercent | number: '1.0-1'"></nz-progress>
+ <div nz-col nzSpan="8">
+ <nz-statistic
+ [nzValue]="usedMemoryPercent | number: '1.0-1'"
+ [nzTitle]="'Used(%)'"
+ [nzSuffix]="'%'"
+ [nzValueStyle]="{ color: '#1890ff' }"
+ ></nz-statistic>
</div>
- </nz-card>
- <ng-template #memoryExplanation>
- <a nz-icon nzType="info-circle"></a>
- </ng-template>
- </div>
+ </div>
+ <div nz-col nzSpan="24" style="padding-top: 5px;">
+ <nz-progress [nzPercent]="usedMemoryPercent | number: '1.0-1'"></nz-progress>
+ </div>
+ </nz-card>
+ <ng-template #memoryExplanation>
+ <a nz-icon nzType="info-circle"></a>
+ </ng-template>
</div>
+ </div>
</div>
</div>
<div nz-row>
- <div nz-col nzXl="24" nzXXl="16">
- <div nz-col nzSpan="24" style="height: 200px; padding-left: 4px; padding-right:4px;">
- <nz-card nzTitle="Quick Start" style="height: 200px;">
- <div style="padding: 10px;">
- <div nz-col nzSpan="24" style="height: 50px; font-size: 16px;">
- <div nz-col nzSpan="6">
- <i nz-icon nzType="book" nzTheme="outline"></i>
- <a> New Notebook</a>
- </div>
- <div nz-col nzSpan="6">
- <i nz-icon nzType="rocket" nzTheme="outline"></i>
- <a> New Session</a>
- </div>
- <div nz-col nzSpan="6">
- <i nz-icon nzType="cluster" nzTheme="outline"></i>
- <a> New Job</a>
- </div>
- <div nz-col nzSpan="6">
- <i nz-icon nzType="bar-chart" nzTheme="outline"></i>
- <a> New Data</a>
- </div>
+ <div nz-col nzXl="24" nzXXl="16">
+ <div nz-col nzSpan="24" style="height: 200px; padding-left: 4px; padding-right: 4px;">
+ <nz-card nzTitle="Quick Start" style="height: 200px;">
+ <div style="padding: 10px;">
+ <div nz-col nzSpan="24" style="height: 50px; font-size: 16px;">
+ <div nz-col nzSpan="6">
+ <i nz-icon nzType="book" nzTheme="outline"></i>
+ <a>New Notebook</a>
</div>
- <div nz-col nzSpan="24" style="height: 50px; font-size: 16px;">
- <div nz-col nzSpan="6">
- <i nz-icon nzType="experiment" nzTheme="outline"></i>
- <a> New Model</a>
- </div>
- <div nz-col nzSpan="6">
- <i nz-icon nzType="calculator" nzTheme="outline"></i>
- <a> New Experiment</a>
- </div>
+ <div nz-col nzSpan="6">
+ <i nz-icon nzType="rocket" nzTheme="outline"></i>
+ <a>New Session</a>
+ </div>
+ <div nz-col nzSpan="6">
+ <i nz-icon nzType="cluster" nzTheme="outline"></i>
+ <a>New Job</a>
+ </div>
+ <div nz-col nzSpan="6">
+ <i nz-icon nzType="bar-chart" nzTheme="outline"></i>
+ <a>New Data</a>
</div>
</div>
- </nz-card>
- </div>
- <div nz-col nzSpan="24">
- <div style="padding-top: 12px; padding-left: 4px; padding-right: 4px; padding-bottom: 12px;">
- <nz-card nzTitle="Open Recent">
- <div nz-col nzSpan="12" style="height: 120px; padding-left: 4px; padding-right: 4px;" *ngFor="let displayOpenRecentListItem of displayOpenRecentList">
- <nz-card nzHoverable style="height: 114px;">
- <nz-card-meta
- [nzTitle]="displayOpenRecentListItem.title"
- [nzDescription]="displayOpenRecentListItem.description"
- [nzAvatar]="avatarTemplate"
- ></nz-card-meta>
- </nz-card>
- <ng-template #avatarTemplate>
- <nz-avatar [nzSrc]="displayOpenRecentListItem.avatarType"></nz-avatar>
- </ng-template>
+ <div nz-col nzSpan="24" style="height: 50px; font-size: 16px;">
+ <div nz-col nzSpan="6">
+ <i nz-icon nzType="experiment" nzTheme="outline"></i>
+ <a>New Model</a>
</div>
- <div nz-col nzSpan="24" style="position: relative; padding-top: 15px;">
- <div style="position: absolute; left: 50%; margin-right: -50%; transform: translate(-50%, -50%)">
- <nz-pagination [nzPageSize]="openRecentPageSize" [nzPageIndex]="openRecentPageIndex" [nzTotal]="openRecentList.length" nzSimple (nzPageIndexChange)="openRecentChangePage($event)"></nz-pagination>
- </div>
+ <div nz-col nzSpan="6">
+ <i nz-icon nzType="calculator" nzTheme="outline"></i>
+ <a>New Experiment</a>
</div>
- </nz-card>
+ </div>
</div>
- </div>
+ </nz-card>
</div>
- <div nz-col nzXl="24" nzXXl="8">
- <div nz-col nzSpan="24" style="padding-left: 4px; padding-right: 4px;">
- <nz-card nzTitle="What's news?" [nzExtra]="extraTemplate">
- <div style="height: 120px;" *ngFor="let displayNewsListItem of displayNewsList">
+ <div nz-col nzSpan="24">
+ <div style="padding-top: 12px; padding-left: 4px; padding-right: 4px; padding-bottom: 12px;">
+ <nz-card nzTitle="Open Recent">
+ <div
+ nz-col
+ nzSpan="12"
+ style="height: 120px; padding-left: 4px; padding-right: 4px;"
+ *ngFor="let displayOpenRecentListItem of displayOpenRecentList"
+ >
<nz-card nzHoverable style="height: 114px;">
<nz-card-meta
- [nzTitle]="displayNewsListItem.title"
- [nzDescription]="displayNewsListItem.newsTime | date: 'medium'"
- [nzAvatar]="newsAvatarTemplate"
+ [nzTitle]="displayOpenRecentListItem.title"
+ [nzDescription]="displayOpenRecentListItem.description"
+ [nzAvatar]="avatarTemplate"
></nz-card-meta>
</nz-card>
- <ng-template #newsAvatarTemplate>
- <nz-avatar nzIcon="user"></nz-avatar>
+ <ng-template #avatarTemplate>
+ <nz-avatar [nzSrc]="displayOpenRecentListItem.avatarType"></nz-avatar>
</ng-template>
</div>
- <div style="position: relative; padding-top: 15px;">
- <div style="position: absolute; left: 50%; margin-right: -50%; transform: translate(-50%, -50%)">
- <nz-pagination [nzPageSize]="newsPageSize" [nzPageIndex]="newsPageIndex" [nzTotal]="newsList.length" nzSimple (nzPageIndexChange)="newsChangePage($event)"></nz-pagination>
+ <div nz-col nzSpan="24" style="position: relative; padding-top: 15px;">
+ <div style="position: absolute; left: 50%; margin-right: -50%; transform: translate(-50%, -50%);">
+ <nz-pagination
+ [nzPageSize]="openRecentPageSize"
+ [nzPageIndex]="openRecentPageIndex"
+ [nzTotal]="openRecentList.length"
+ nzSimple
+ (nzPageIndexChange)="openRecentChangePage($event)"
+ ></nz-pagination>
</div>
</div>
</nz-card>
- <ng-template #extraTemplate>
- <a>More</a>
- </ng-template>
</div>
</div>
+ </div>
+ <div nz-col nzXl="24" nzXXl="8">
+ <div nz-col nzSpan="24" style="padding-left: 4px; padding-right: 4px;">
+ <nz-card nzTitle="What's news?" [nzExtra]="extraTemplate">
+ <div style="height: 120px;" *ngFor="let displayNewsListItem of displayNewsList">
+ <nz-card nzHoverable style="height: 114px;">
+ <nz-card-meta
+ [nzTitle]="displayNewsListItem.title"
+ [nzDescription]="displayNewsListItem.newsTime | date: 'medium'"
+ [nzAvatar]="newsAvatarTemplate"
+ ></nz-card-meta>
+ </nz-card>
+ <ng-template #newsAvatarTemplate>
+ <nz-avatar nzIcon="user"></nz-avatar>
+ </ng-template>
+ </div>
+ <div style="position: relative; padding-top: 15px;">
+ <div style="position: absolute; left: 50%; margin-right: -50%; transform: translate(-50%, -50%);">
+ <nz-pagination
+ [nzPageSize]="newsPageSize"
+ [nzPageIndex]="newsPageIndex"
+ [nzTotal]="newsList.length"
+ nzSimple
+ (nzPageIndexChange)="newsChangePage($event)"
+ ></nz-pagination>
+ </div>
+ </div>
+ </nz-card>
+ <ng-template #extraTemplate>
+ <a>More</a>
+ </ng-template>
+ </div>
+ </div>
</div>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.ts
index 6231fc6..88b07a1 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/home/home.component.ts
@@ -44,77 +44,77 @@ export class HomeComponent implements OnInit {
newsList = [
{
title: 'Submarine supports yarn 2.7.x',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 123',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 123',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 123',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 123',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 123',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 456',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 456',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 456',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 456',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
},
{
title: 'Submarine supports yarn 2.7.x 456',
- newsTime: this.publishedTime,
+ newsTime: this.publishedTime,
iconType: 'user'
}
];
@@ -123,97 +123,97 @@ export class HomeComponent implements OnInit {
openRecentList = [
{
title: 'Project1',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project1',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project1',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project1',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project1',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project1',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project2',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project2',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project2',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project2',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project2',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project2',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project3',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project3',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project3',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project3',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project3',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
},
{
title: 'Project3',
- description: 'This is the description',
+ description: 'This is the description',
avatarType: 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'
}
];
- displayOpenRecentList = []
+ displayOpenRecentList = [];
openRecentPageSize: number;
// constructor
@@ -254,8 +254,7 @@ export class HomeComponent implements OnInit {
}
}
- ngOnInit() {
- }
+ ngOnInit() {}
openRecentChangePage(event: number) {
const pageIndex: number = event;
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.html
index db18911..db578de 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.html
@@ -17,15 +17,21 @@
~ under the License.
-->
-<nz-modal [nzVisible]="visible" [nzTitle]="modalTitle" nzCancelText="Close" nzOkText="Ok" (nzOnCancel)="hideModal()"
- (nzOnOk)="submitForm()">
+<nz-modal
+ [nzVisible]="visible"
+ [nzTitle]="modalTitle"
+ nzCancelText="Close"
+ nzOkText="Ok"
+ (nzOnCancel)="hideModal()"
+ (nzOnOk)="submitForm()"
+>
<form nz-form nzLayout="horizontal" [formGroup]="form">
<nz-form-item>
<nz-form-label nzRequired>
Name
</nz-form-label>
<nz-form-control>
- <input id="inputNewInterpreterName" type="text" nz-input formControlName="interpreterName"/>
+ <input id="inputNewInterpreterName" type="text" nz-input formControlName="interpreterName" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -33,7 +39,7 @@
Type
</nz-form-label>
<nz-form-control>
- <input id="inputNewInterpreterType" nz-input formControlName="interpreterType"/>
+ <input id="inputNewInterpreterType" nz-input formControlName="interpreterType" />
</nz-form-control>
</nz-form-item>
</form>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.ts
index 52704a3..ef6d90d 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter-add-modal/interpreter-add-modal.component.ts
@@ -41,7 +41,7 @@ export class InterpreterAddModalComponent implements OnChanges {
});
}
- ngOnChanges (changes: SimpleChanges) {
+ ngOnChanges(changes: SimpleChanges) {
this.form.reset({
interpreterName: this.interpreterName,
interpreterType: this.interpreterType
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.html
index 1ec7654..1506a59 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.html
@@ -26,10 +26,10 @@
</nz-breadcrumb-item>
<nz-breadcrumb-item>Interpreter</nz-breadcrumb-item>
</nz-breadcrumb>
- <br/>
+ <br />
<h2>Interpreter</h2>
<nz-content>Users can manage their Interpreters.</nz-content>
- <br/>
+ <br />
</div>
</nz-layout>
</nz-layout>
@@ -37,25 +37,29 @@
<nz-card>
<div class="interpreter-table-operate">
<form nz-row nz-form [nzLayout]="'inline'" [formGroup]="interpreterQueryForm">
- <nz-form-item nz-col nzSpan="8">
+ <nz-form-item nz-col nzSpan="8">
<nz-form-label nz-col nzSpan="4">Name</nz-form-label>
<nz-form-control nz-col nzSpan="20">
- <input nz-input formControlName="interpreterName" placeholder="Enter Interpreter Name"/>
+ <input nz-input formControlName="interpreterName" placeholder="Enter Interpreter Name" />
</nz-form-control>
</nz-form-item>
<nz-form-item nz-col nzSpan="8">
<nz-form-label nz-col nzSpan="4">Status</nz-form-label>
<nz-form-control nz-col nzSpan="20">
- <nz-cascader [nzOptions]="statusOptions" formControlName="interpreterStatus" nzPlaceHolder="Enter Interpreter Status"></nz-cascader>
+ <nz-cascader
+ [nzOptions]="statusOptions"
+ formControlName="interpreterStatus"
+ nzPlaceHolder="Enter Interpreter Status"
+ ></nz-cascader>
</nz-form-control>
</nz-form-item>
<nz-form-item nz-col nzSpan="8">
<nz-form-control>
- <button nz-button style="margin-left: 8px" nzType="primary" (click)="queryInterpreter()">
+ <button nz-button style="margin-left: 8px;" nzType="primary" (click)="queryInterpreter()">
<i nz-icon nzType="search"></i>
Query
- </button>
- <button nz-button style="margin-left: 8px" (click)="onShowAddInterpreterModal()" id="interpreterAddButton">
+ </button>
+ <button nz-button style="margin-left: 8px;" (click)="onShowAddInterpreterModal()" id="interpreterAddButton">
<i nz-icon nzType="plus"></i>
Add
</button>
@@ -71,7 +75,7 @@
<th>Type</th>
<th>Status</th>
<th>Progress</th>
- <th>Last Updated</th>
+ <th>Last Updated</th>
<th nzRight="0px">Action</th>
</tr>
</thead>
@@ -85,7 +89,7 @@
<td>
<nz-progress nzStrokeLinecap="round" [nzPercent]="data.progress"></nz-progress>
</td>
- <td>{{ data.lastUpdated | date: 'medium'}}</td>
+ <td>{{ data.lastUpdated | date: 'medium' }}</td>
<td class="td-action" nzRight="0px">
<a>
<i nz-icon nzType="edit" nzTheme="outline"></i>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.ts
index f170552..0486e41 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/interpreter/interpreter.component.ts
@@ -61,11 +61,11 @@ export class InterpreterComponent implements OnInit {
}
];
- statusColor: {[key: string]: string} = {
+ statusColor: { [key: string]: string } = {
Running: 'blue',
Idle: 'green'
- }
- interpreterQueryForm: FormGroup
+ };
+ interpreterQueryForm: FormGroup;
// TODO(kevin85421)
lastUpdatedTime: number = Date.now();
interpreterInfoList: InterpreterInfo[] = [
@@ -83,7 +83,7 @@ export class InterpreterComponent implements OnInit {
progress: 65,
lastUpdated: this.lastUpdatedTime
}
- ]
+ ];
// TODO(kevin85421)
queryInterpreter() {
@@ -96,11 +96,10 @@ export class InterpreterComponent implements OnInit {
// TODO(kevin85421)
killInterpreter() {}
- ngOnInit() {
- }
+ ngOnInit() {}
onShowAddInterpreterModal() {
- this.addModalTitle = "Add";
+ this.addModalTitle = 'Add';
this.addModalVisible = true;
}
@@ -108,7 +107,7 @@ export class InterpreterComponent implements OnInit {
this.addModalVisible = false;
}
- updateNewInterpreter(newInterpreter: {interpreterName: string, interpreterType: string}) {
+ updateNewInterpreter(newInterpreter: { interpreterName: string; interpreterType: string }) {
this.interpreterInfoList = [
...this.interpreterInfoList,
{
@@ -118,7 +117,7 @@ export class InterpreterComponent implements OnInit {
progress: 0,
lastUpdated: this.lastUpdatedTime
}
- ]
+ ];
this.onHideAddInterpreterModal();
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.html
index 62739f2..3579662 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.html
@@ -17,20 +17,27 @@
~ under the License.
-->
-<nz-modal [nzVisible]="visible" [nzTitle]="modalTitle" nzCancelText="Close" nzOkText="Ok" (nzOnCancel)="hideModal()"
- (nzOnOk)="hideModal()" [nzWidth]="modalWidth">
+<nz-modal
+ [nzVisible]="visible"
+ [nzTitle]="modalTitle"
+ nzCancelText="Close"
+ nzOkText="Ok"
+ (nzOnCancel)="hideModal()"
+ (nzOnOk)="hideModal()"
+ [nzWidth]="modalWidth"
+>
<div class="dictItem-table-operate">
<form nz-form [nzLayout]="'inline'" [formGroup]="dictItemListForm">
<nz-form-item>
<nz-form-label>Name</nz-form-label>
<nz-form-control>
- <input nz-input formControlName="dictItemName" placeholder="Enter Item Name"/>
+ <input nz-input formControlName="dictItemName" placeholder="Enter Item Name" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label>Code</nz-form-label>
<nz-form-control>
- <input nz-input formControlName="dictItemCode" placeholder="Enter Item Code"/>
+ <input nz-input formControlName="dictItemCode" placeholder="Enter Item Code" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -39,7 +46,7 @@
<i nz-icon nzType="search"></i>
Query
</button>
- <button id="{{ 'dataDictItemAdd' + dictCode }}" nz-button style="margin-left: 8px" (click)="addDictItem()">
+ <button id="{{ 'dataDictItemAdd' + dictCode }}" nz-button style="margin-left: 8px;" (click)="addDictItem()">
<i nz-icon nzType="plus"></i>
Add
</button>
@@ -61,19 +68,44 @@
<tbody>
<tr *ngIf="showNewRow">
<td>
- <input id="{{ 'newItemCode' + dictCode }}" type="text" nz-input nzSize="small" formControlName="newItemCode"/>
+ <input
+ id="{{ 'newItemCode' + dictCode }}"
+ type="text"
+ nz-input
+ nzSize="small"
+ formControlName="newItemCode"
+ />
</td>
<td>
- <input id="{{ 'newItemName' + dictCode }}" type="text" nz-input nzSize="small" formControlName="newItemName"/>
+ <input
+ id="{{ 'newItemName' + dictCode }}"
+ type="text"
+ nz-input
+ nzSize="small"
+ formControlName="newItemName"
+ />
</td>
<td>
- <nz-cascader id="{{ 'newItemStatus' + dictCode }}" nzSize="small" [nzOptions]="statusOptions" formControlName="newItemStatus"></nz-cascader>
+ <nz-cascader
+ id="{{ 'newItemStatus' + dictCode }}"
+ nzSize="small"
+ [nzOptions]="statusOptions"
+ formControlName="newItemStatus"
+ ></nz-cascader>
</td>
<td>
- <button *ngIf="newItemForm.get('newItemCode').valid &&
- newItemForm.get('newItemName').valid &&
- newItemForm.get('newItemStatus').valid; else disabledAddButtonTpl"
- nzSize="small" nz-button nzType="default" (click)="addNewItemToList()">
+ <button
+ *ngIf="
+ newItemForm.get('newItemCode').valid &&
+ newItemForm.get('newItemName').valid &&
+ newItemForm.get('newItemStatus').valid;
+ else disabledAddButtonTpl
+ "
+ nzSize="small"
+ nz-button
+ nzType="default"
+ (click)="addNewItemToList()"
+ >
<i nz-icon nzType="file-add"></i>
Add
</button>
@@ -83,7 +115,7 @@
Add
</button>
</ng-template>
- <button nzSize="small" nz-button nzType="default" style="margin-left: 8px" (click)="cancelAddDictItem()">
+ <button nzSize="small" nz-button nzType="default" style="margin-left: 8px;" (click)="cancelAddDictItem()">
<i nz-icon nzType="undo"></i>
Cancel
</button>
@@ -92,24 +124,33 @@
<tr *ngFor="let dictItem of table.data; index as dictItemIndex">
<td>
<ng-container *ngIf="!dictItem.edit; else codeInputTpl">
- {{ dictItem.code }}
+ {{ dictItem.code }}
</ng-container>
<ng-template #codeInputTpl>
- <input type="text" nz-input nzSize="small" formControlName="selectedDictItemCode"/>
+ <input type="text" nz-input nzSize="small" formControlName="selectedDictItemCode" />
</ng-template>
</td>
<td>
<ng-container *ngIf="!dictItem.edit; else nameInputTpl">
- {{ dictItem.name }}
+ {{ dictItem.name }}
</ng-container>
<ng-template #nameInputTpl>
- <input type="text" nz-input nzSize="small" formControlName="selectedDictItemName"/>
+ <input type="text" nz-input nzSize="small" formControlName="selectedDictItemName" />
</ng-template>
</td>
<td>
- <nz-tag *ngIf="!dictItem.edit && (dictItem.status == 'available')" [nzColor]="'blue'">{{ dictItem.status }}</nz-tag>
- <nz-tag *ngIf="!dictItem.edit && (dictItem.status == 'unavailable')" [nzColor]="'red'">{{ dictItem.status }}</nz-tag>
- <nz-cascader *ngIf="dictItem.edit" nzSize="small" [nzOptions]="statusOptions" formControlName="selectedDictItemStatus"></nz-cascader>
+ <nz-tag *ngIf="!dictItem.edit && dictItem.status == 'available'" [nzColor]="'blue'">
+ {{ dictItem.status }}
+ </nz-tag>
+ <nz-tag *ngIf="!dictItem.edit && dictItem.status == 'unavailable'" [nzColor]="'red'">
+ {{ dictItem.status }}
+ </nz-tag>
+ <nz-cascader
+ *ngIf="dictItem.edit"
+ nzSize="small"
+ [nzOptions]="statusOptions"
+ formControlName="selectedDictItemStatus"
+ ></nz-cascader>
</td>
<td>
<ng-container *ngIf="!dictItem.edit; else saveTpl">
@@ -119,10 +160,18 @@
</a>
</ng-container>
<ng-template #saveTpl>
- <button *ngIf="newItemForm.get('selectedDictItemCode').valid &&
- newItemForm.get('selectedDictItemName').valid &&
- newItemForm.get('selectedDictItemStatus').valid; else disabledSaveButtonTpl"
- nzSize="small" nz-button nzType="default" (click)="saveEdit(dictItemIndex)">
+ <button
+ *ngIf="
+ newItemForm.get('selectedDictItemCode').valid &&
+ newItemForm.get('selectedDictItemName').valid &&
+ newItemForm.get('selectedDictItemStatus').valid;
+ else disabledSaveButtonTpl
+ "
+ nzSize="small"
+ nz-button
+ nzType="default"
+ (click)="saveEdit(dictItemIndex)"
+ >
<i nz-icon nzType="save" nzTheme="outline"></i>
Save
</button>
@@ -132,7 +181,13 @@
Save
</button>
</ng-template>
- <button nzSize="small" nz-button nzType="default" style="margin-left: 8px" (click)="cancelEdit(dictItemIndex)">
+ <button
+ nzSize="small"
+ nz-button
+ nzType="default"
+ style="margin-left: 8px;"
+ (click)="cancelEdit(dictItemIndex)"
+ >
<i nz-icon nzType="undo" nzTheme="outline"></i>
Cancel
</button>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.ts
index 1711a17..836d8c7 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-config-modal/data-dict-config-modal.component.ts
@@ -34,7 +34,6 @@ interface DictItemInfo {
styleUrls: ['./data-dict-config-modal.component.scss']
})
export class DataDictConfigModalComponent implements OnChanges {
-
constructor(private fb: FormBuilder) {
this.dictItemListForm = this.fb.group({
dictItemCode: ['', [Validators.required]],
@@ -67,7 +66,7 @@ export class DataDictConfigModalComponent implements OnChanges {
// TODO(kevin85421): mock data
dictItemList: { [id: string]: DictItemInfo[] } = {
- "PROJECT_TYPE": [
+ PROJECT_TYPE: [
{
code: 'PROJECT_TYPE_NOTEBOOK',
name: 'notebook',
@@ -105,7 +104,7 @@ export class DataDictConfigModalComponent implements OnChanges {
edit: false
}
],
- "PROJECT_VISIBILITY": [
+ PROJECT_VISIBILITY: [
{
code: 'PROJECT_VISIBILITY_PRIVATE',
name: 'private',
@@ -125,7 +124,7 @@ export class DataDictConfigModalComponent implements OnChanges {
edit: false
}
],
- "PROJECT_PERMISSION": [
+ PROJECT_PERMISSION: [
{
code: 'PROJECT_PERMISSION_VIEW',
name: 'can view',
@@ -145,7 +144,7 @@ export class DataDictConfigModalComponent implements OnChanges {
edit: false
}
],
- "SYS_USER_SEX": [
+ SYS_USER_SEX: [
{
code: 'SYS_USER_SEX_MALE',
name: 'Male',
@@ -159,7 +158,7 @@ export class DataDictConfigModalComponent implements OnChanges {
edit: false
}
],
- "SYS_USER_STATUS": [
+ SYS_USER_STATUS: [
{
code: 'SYS_USER_STATUS_AVAILABLE',
name: 'Available',
@@ -235,9 +234,14 @@ export class DataDictConfigModalComponent implements OnChanges {
}
this.selectedDictItemList[dictItemIndex].edit = true;
this.selectedItemIndex = dictItemIndex;
- this.newItemForm.setValue({ newItemCode: '', newItemName: '', newItemStatus: '',
- selectedDictItemCode: dictItemCode, selectedDictItemName: dictItemName,
- selectedDictItemStatus: dictItemStatus});
+ this.newItemForm.setValue({
+ newItemCode: '',
+ newItemName: '',
+ newItemStatus: '',
+ selectedDictItemCode: dictItemCode,
+ selectedDictItemName: dictItemName,
+ selectedDictItemStatus: dictItemStatus
+ });
}
saveEdit(dictItemIndex: number) {
@@ -249,9 +253,14 @@ export class DataDictConfigModalComponent implements OnChanges {
cancelEdit(dictItemIndex: number) {
this.selectedItemIndex = 0;
- this.newItemForm.setValue({ newItemCode: '', newItemName: '', newItemStatus: '',
- selectedDictItemCode: '', selectedDictItemName: '',
- selectedDictItemStatus: ''});
+ this.newItemForm.setValue({
+ newItemCode: '',
+ newItemName: '',
+ newItemStatus: '',
+ selectedDictItemCode: '',
+ selectedDictItemName: '',
+ selectedDictItemStatus: ''
+ });
if (this.selectedDictItemList.length !== 0) {
this.selectedDictItemList[dictItemIndex].edit = false;
}
@@ -285,10 +294,15 @@ export class DataDictConfigModalComponent implements OnChanges {
edit: false
},
...this.dictItemList[this.dictCode]
- ]
- this.newItemForm.setValue({ newItemCode: '', newItemName: '', newItemStatus: '',
- selectedDictItemCode: '', selectedDictItemName: '',
- selectedDictItemStatus: ''});
+ ];
+ this.newItemForm.setValue({
+ newItemCode: '',
+ newItemName: '',
+ newItemStatus: '',
+ selectedDictItemCode: '',
+ selectedDictItemName: '',
+ selectedDictItemStatus: ''
+ });
this.cancelAddDictItem();
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-modal/data-dict-modal.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-modal/data-dict-modal.component.html
index 7d2cd8d..593599c 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-modal/data-dict-modal.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict-modal/data-dict-modal.component.html
@@ -17,15 +17,21 @@
~ under the License.
-->
-<nz-modal [nzVisible]="visible" [nzTitle]="modalTitle" nzCancelText="Close" nzOkText="Ok" (nzOnCancel)="hideModal()"
- (nzOnOk)="submitForm()">
+<nz-modal
+ [nzVisible]="visible"
+ [nzTitle]="modalTitle"
+ nzCancelText="Close"
+ nzOkText="Ok"
+ (nzOnCancel)="hideModal()"
+ (nzOnOk)="submitForm()"
+>
<form nz-form nzLayout="horizontal" [formGroup]="form">
<nz-form-item>
<nz-form-label nzRequired>
Dictionary Code
</nz-form-label>
<nz-form-control>
- <input id="inputNewDictCode" type="text" nz-input formControlName="dictCode"/>
+ <input id="inputNewDictCode" type="text" nz-input formControlName="dictCode" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -33,7 +39,7 @@
Dictionary Name
</nz-form-label>
<nz-form-control>
- <input id="inputNewDictName" nz-input formControlName="dictName"/>
+ <input id="inputNewDictName" nz-input formControlName="dictName" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -41,7 +47,7 @@
Description
</nz-form-label>
<nz-form-control>
- <input id="inputNewDictDescription" nz-input formControlName="description"/>
+ <input id="inputNewDictDescription" nz-input formControlName="description" />
</nz-form-control>
</nz-form-item>
</form>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.html
index 3375b79..4208e4e 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.html
@@ -23,13 +23,13 @@
<nz-form-item>
<nz-form-label>Dictionary Name</nz-form-label>
<nz-form-control>
- <input nz-input formControlName="dictName" placeholder="Enter Dictionary Name"/>
+ <input nz-input formControlName="dictName" placeholder="Enter Dictionary Name" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label>Dictionary Code</nz-form-label>
<nz-form-control>
- <input nz-input formControlName="dictCode" placeholder="Enter Dictionary Code"/>
+ <input nz-input formControlName="dictCode" placeholder="Enter Dictionary Code" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -38,7 +38,7 @@
<i nz-icon nzType="search"></i>
Query
</button>
- <button nz-button style="margin-left: 8px" (click)="onShowAddDataDictModal()">
+ <button nz-button style="margin-left: 8px;" (click)="onShowAddDataDictModal()">
<i nz-icon nzType="plus"></i>
Add
</button>
@@ -60,7 +60,7 @@
</thead>
<tbody>
<tr *ngFor="let data of table.data; index as dictItemIndex">
- <td nzLeft="0px">{{ dictItemIndex+1 }}</td>
+ <td nzLeft="0px">{{ dictItemIndex + 1 }}</td>
<td id="{{ 'dataDictCode' + data.dictCode }}">{{ data.dictCode }}</td>
<td>{{ data.dictName }}</td>
<td>{{ data.description }}</td>
@@ -78,7 +78,13 @@
</a>
<nz-dropdown-menu #more="nzDropdownMenu">
<ul nz-menu nzSelectable>
- <li nz-menu-item (click)="onShowConfigModal(data, dictItemIndex)" id="{{ 'dataDictConfiguration' + data.dictCode }}">Configuration</li>
+ <li
+ nz-menu-item
+ (click)="onShowConfigModal(data, dictItemIndex)"
+ id="{{ 'dataDictConfiguration' + data.dictCode }}"
+ >
+ Configuration
+ </li>
<li
id="{{ 'dataDictDelete' + data.dictCode }}"
nz-menu-item
@@ -103,7 +109,7 @@
[visible]="dataDictModalVisible"
[dictCode]="selectedDictCode"
[dictName]="selectedDictName"
- [description]="selectedDescription"
+ [description]="selectedDescription"
(close)="onHideDataDictModal()"
(ok)="updateDataDict($event)"
></submarine-data-dict-modal>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.ts
index 6fa38d3..6f3c1b5 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/data-dict/data-dict.component.ts
@@ -26,10 +26,8 @@ import { SysDictItem } from '@submarine/interfaces/sys-dict-item';
templateUrl: './data-dict.component.html',
styleUrls: ['./data-dict.component.scss']
})
-
export class DataDictComponent implements OnInit {
- constructor(private fb: FormBuilder) {
- }
+ constructor(private fb: FormBuilder) {}
dataDictForm: FormGroup;
// TODO(kevin85421): (mock data) Replace it with sys-dict-item.ts
sysDictList = [
@@ -94,7 +92,7 @@ export class DataDictComponent implements OnInit {
queryDataDict() {}
// TODO(kevin85421)
onShowAddDataDictModal() {
- this.modalTitle = "Add";
+ this.modalTitle = 'Add';
this.selectedDictCode = '';
this.dataDictModalVisible = true;
}
@@ -102,7 +100,7 @@ export class DataDictComponent implements OnInit {
// Edit Data Dictionary Modal
onShowEditDataDictModal(data, dictItemIndex: number) {
// set selected dict variables
- this.modalTitle = "Edit";
+ this.modalTitle = 'Edit';
this.selectedDictCode = data.dictCode;
this.selectedDictName = data.dictName;
this.selectedDescription = data.description;
@@ -118,12 +116,12 @@ export class DataDictComponent implements OnInit {
this.selectedDictName = '';
this.selectedDescription = '';
this.selectedDictID = 0;
- this.modalTitle = "";
+ this.modalTitle = '';
// hide edit modal
this.dataDictModalVisible = false;
}
- updateDataDict(dataDictItem: {dictCode: string, dictName: string, description: string}) {
+ updateDataDict(dataDictItem: { dictCode: string; dictName: string; description: string }) {
if (this.modalTitle === 'Edit') {
if (this.sysDictList[this.selectedDictID].dictCode !== dataDictItem.dictCode) {
this.editDictCodeChanged = true;
@@ -142,7 +140,7 @@ export class DataDictComponent implements OnInit {
description: dataDictItem.description,
status: 'available'
}
- ]
+ ];
}
this.onHideDataDictModal();
@@ -167,6 +165,6 @@ export class DataDictComponent implements OnInit {
// delete dataDictItem
onDeleteDataDictItem(data) {
- this.sysDictList = this.sysDictList.filter(d => d.dictCode !== data.dictCode);
+ this.sysDictList = this.sysDictList.filter((d) => d.dictCode !== data.dictCode);
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.html
index 4cde529..22e5ec2 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.html
@@ -18,169 +18,278 @@
-->
<nz-card>
- <div class="department-header">
- <form nz-form [nzLayout]="'inline'" [formGroup]="dapartmentDictForm">
- <nz-form-item>
- <nz-form-label>Code</nz-form-label>
- <nz-form-control>
- <input nz-input formControlName="departmentCode" style="width: 400px;" placeholder="Please enter department code"/>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item>
- <nz-form-label>Name</nz-form-label>
- <nz-form-control>
- <input nz-input formControlName="departmentName" style="width: 400px;" placeholder="Please enter department name"/>
- </nz-form-control>
- </nz-form-item>
- <nz-form-item>
- <nz-form-control>
- <button nz-button nzType="primary" (click)="queryDepartment()">
- <i nz-icon nzType="search"></i>
- Query
- </button>
- <button nz-button id='btnAddDepartment' style="margin-left: 8px" (click)="addDept()">
- <i nz-icon nzType="plus"></i>
- Add
- </button>
- </nz-form-control>
- </nz-form-item>
- </form>
- </div>
-
- <nz-table *ngIf="isLoading==false" id='departmentTable' #expandTable nzBordered [nzData]="isExpandTable ? listOfMapData : filterArr">
- <thead>
- <tr>
- <th nzWidth="15%">Code</th>
- <th nzWidth="10%">Name</th>
- <th nzWidth="25%">Parent Deptartment</th>
- <th nzWidth="25%">Description</th>
- <th nzWidth="10%">Status</th>
- <th>Action</th>
- </tr>
- </thead>
- <tbody *ngIf="isExpandTable">
- <ng-container *ngFor="let data of expandTable.data">
- <ng-container *ngFor="let item of mapOfExpandedData[data.key]">
- <tr *ngIf="(item.parent && item.parent.expand) || !item.parent">
- <td
- [nzIndentSize]="item.level * 20"
- [nzShowExpand]="item.children!==null"
- [(nzExpand)]="item.expand"
- (nzExpandChange)="collapse(mapOfExpandedData[data.key], item, $event)"
- >
- {{ item.deptCode }}
- </td>
- <td>{{ item.deptName }}</td>
- <td>{{ showParent(item) }}</td>
- <td>{{ item.description }}</td>
- <td><nz-tag [nzColor]="item.deleted===1? 'red' : 'blue'">{{ item.deleted? 'Deleted' : 'Available' }}</nz-tag></td>
- <td>
- <button nz-button nzType="link" (click)="editDepartment(item)" style="padding-left: 2px;padding-right: 5px;">Edit</button>
- |
- <button *ngIf="item.deleted===0" nz-button nzType="link" (click)="deleteDepartment(item)" style="padding-left: 2px;padding-right: 5px;">Delete</button>
- <button *ngIf="item.deleted===1" nz-button nzType="link" (click)="restoreDepartment(item)" style="padding-left: 2px;padding-right: 5px;">Restore</button>
- </td>
- </tr>
- </ng-container>
- </ng-container>
- </tbody>
+ <div class="department-header">
+ <form nz-form [nzLayout]="'inline'" [formGroup]="dapartmentDictForm">
+ <nz-form-item>
+ <nz-form-label>Code</nz-form-label>
+ <nz-form-control>
+ <input
+ nz-input
+ formControlName="departmentCode"
+ style="width: 400px;"
+ placeholder="Please enter department code"
+ />
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item>
+ <nz-form-label>Name</nz-form-label>
+ <nz-form-control>
+ <input
+ nz-input
+ formControlName="departmentName"
+ style="width: 400px;"
+ placeholder="Please enter department name"
+ />
+ </nz-form-control>
+ </nz-form-item>
+ <nz-form-item>
+ <nz-form-control>
+ <button nz-button nzType="primary" (click)="queryDepartment()">
+ <i nz-icon nzType="search"></i>
+ Query
+ </button>
+ <button nz-button id="btnAddDepartment" style="margin-left: 8px;" (click)="addDept()">
+ <i nz-icon nzType="plus"></i>
+ Add
+ </button>
+ </nz-form-control>
+ </nz-form-item>
+ </form>
+ </div>
- <tbody *ngIf="!isExpandTable">
- <ng-container *ngFor="let item of expandTable.data">
- <tr>
+ <nz-table
+ *ngIf="isLoading == false"
+ id="departmentTable"
+ #expandTable
+ nzBordered
+ [nzData]="isExpandTable ? listOfMapData : filterArr"
+ >
+ <thead>
+ <tr>
+ <th nzWidth="15%">Code</th>
+ <th nzWidth="10%">Name</th>
+ <th nzWidth="25%">Parent Deptartment</th>
+ <th nzWidth="25%">Description</th>
+ <th nzWidth="10%">Status</th>
+ <th>Action</th>
+ </tr>
+ </thead>
+ <tbody *ngIf="isExpandTable">
+ <ng-container *ngFor="let data of expandTable.data">
+ <ng-container *ngFor="let item of mapOfExpandedData[data.key]">
+ <tr *ngIf="(item.parent && item.parent.expand) || !item.parent">
+ <td
+ [nzIndentSize]="item.level * 20"
+ [nzShowExpand]="item.children !== null"
+ [(nzExpand)]="item.expand"
+ (nzExpandChange)="collapse(mapOfExpandedData[data.key], item, $event)"
+ >
+ {{ item.deptCode }}
+ </td>
<td>{{ item.deptName }}</td>
- <td>{{ item.deptCode }}</td>
<td>{{ showParent(item) }}</td>
<td>{{ item.description }}</td>
- <td><nz-tag [nzColor]="item.deleted===1? 'red' : 'blue'">{{ item.deleted? 'Available': 'Deleted' }}</nz-tag></td>
<td>
- <button nz-button nzType="link" (click)="editDepartment(item)" style="padding-left: 2px;padding-right: 5px;">Edit</button>
+ <nz-tag [nzColor]="item.deleted === 1 ? 'red' : 'blue'">
+ {{ item.deleted ? 'Deleted' : 'Available' }}
+ </nz-tag>
+ </td>
+ <td>
+ <button
+ nz-button
+ nzType="link"
+ (click)="editDepartment(item)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Edit
+ </button>
|
- <button *ngIf="item.deleted===0" nz-button nzType="link" (click)="deleteDepartment(item)" style="padding-left: 2px;padding-right: 5px;">Delete</button>
- <button *ngIf="item.deleted===1" nz-button nzType="link" (click)="restoreDepartment(item)" style="padding-left: 2px;padding-right: 5px;">Restore</button>
+ <button
+ *ngIf="item.deleted === 0"
+ nz-button
+ nzType="link"
+ (click)="deleteDepartment(item)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Delete
+ </button>
+ <button
+ *ngIf="item.deleted === 1"
+ nz-button
+ nzType="link"
+ (click)="restoreDepartment(item)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Restore
+ </button>
</td>
</tr>
</ng-container>
- </tbody>
- </nz-table>
- <nz-spin *ngIf="isLoading" [nzSpinning]="true" style="height: 50px;">
- </nz-spin>
-</nz-card>
+ </ng-container>
+ </tbody>
+ <tbody *ngIf="!isExpandTable">
+ <ng-container *ngFor="let item of expandTable.data">
+ <tr>
+ <td>{{ item.deptName }}</td>
+ <td>{{ item.deptCode }}</td>
+ <td>{{ showParent(item) }}</td>
+ <td>{{ item.description }}</td>
+ <td>
+ <nz-tag [nzColor]="item.deleted === 1 ? 'red' : 'blue'">
+ {{ item.deleted ? 'Available' : 'Deleted' }}
+ </nz-tag>
+ </td>
+ <td>
+ <button
+ nz-button
+ nzType="link"
+ (click)="editDepartment(item)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Edit
+ </button>
+ |
+ <button
+ *ngIf="item.deleted === 0"
+ nz-button
+ nzType="link"
+ (click)="deleteDepartment(item)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Delete
+ </button>
+ <button
+ *ngIf="item.deleted === 1"
+ nz-button
+ nzType="link"
+ (click)="restoreDepartment(item)"
+ style="padding-left: 2px; padding-right: 5px;"
+ >
+ Restore
+ </button>
+ </td>
+ </tr>
+ </ng-container>
+ </tbody>
+ </nz-table>
+ <nz-spin *ngIf="isLoading" [nzSpinning]="true" style="height: 50px;"></nz-spin>
+</nz-card>
<nz-drawer
- [(nzVisible)]="isVisible"
- nzClosable = "true"
- nzTitle="Add Department"
- (nzOnClose)="isVisible=false;"
- [nzWidth]="700"
+ [(nzVisible)]="isVisible"
+ nzClosable="true"
+ nzTitle="Add Department"
+ (nzOnClose)="isVisible = false"
+ [nzWidth]="700"
>
-<form [formGroup]="newDepartmentForm">
- <div>
- <label *ngIf="newDepartmentForm.get('code').valid" id='validCode' class="form-label"><span class="red-star">* </span> Code:</label>
- <label *ngIf="!newDepartmentForm.get('code').valid" id='invalidCode' class="form-label"><span class="red-star">* </span> Code:</label>
- <input
- nz-input
- id='codeInput'
- type="text"
- placeholder="Please enter department code"
- style="margin-top: 25px;width: 70%;"
- class="form-control"
- formControlName="code">
- </div>
- <h4 style="color: red;margin-left: 22%;">{{ (newDepartmentForm.get('code').valid || (!editMode&&!newDepartmentForm.get('code').touched)) ? "" : formCodeErrMsg }}<br></h4>
- <div>
- <label class="form-label" style="margin-top: 5px;"><span class="red-star">* </span> Name:</label>
- <input
- nz-input
- id='nameInput'
- type="text"
- placeholder="Please enter department name"
- style="margin-top: 1px;width: 70%;"
- class="form-control"
- formControlName="name"
- >
- </div>
- <h4 style="color: red;margin-left: 22%;">{{ (newDepartmentForm.get('name').valid || (!editMode&&!newDepartmentForm.get('name').touched)) ? "" : "Please entry department name!" }}<br></h4>
- <div>
- <label class="form-label" style="margin-top: 5px;"> Parent:</label>
- <nz-tree-select
- [ngStyle]="{'border': parentCodeValid? '0px' : '1px solid red'}"
- style="width: 70%;margin-top: 1px;"
- [nzExpandedKeys]="expandKeys"
- [nzNodes]="sysTreeParent"
- nzShowSearch
- nzPlaceHolder="Please select"
- class="form-control"
- formControlName="parent"
+ <form [formGroup]="newDepartmentForm">
+ <div>
+ <label *ngIf="newDepartmentForm.get('code').valid" id="validCode" class="form-label">
+ <span class="red-star">*</span>
+ Code:
+ </label>
+ <label *ngIf="!newDepartmentForm.get('code').valid" id="invalidCode" class="form-label">
+ <span class="red-star">*</span>
+ Code:
+ </label>
+ <input
+ nz-input
+ id="codeInput"
+ type="text"
+ placeholder="Please enter department code"
+ style="margin-top: 25px; width: 70%;"
+ class="form-control"
+ formControlName="code"
+ />
+ </div>
+ <h4 style="color: red; margin-left: 22%;">
+ {{
+ newDepartmentForm.get('code').valid || (!editMode && !newDepartmentForm.get('code').touched)
+ ? ''
+ : formCodeErrMsg
+ }}
+ <br />
+ </h4>
+ <div>
+ <label class="form-label" style="margin-top: 5px;">
+ <span class="red-star">*</span>
+ Name:
+ </label>
+ <input
+ nz-input
+ id="nameInput"
+ type="text"
+ placeholder="Please enter department name"
+ style="margin-top: 1px; width: 70%;"
+ class="form-control"
+ formControlName="name"
+ />
+ </div>
+ <h4 style="color: red; margin-left: 22%;">
+ {{
+ newDepartmentForm.get('name').valid || (!editMode && !newDepartmentForm.get('name').touched)
+ ? ''
+ : 'Please entry department name!'
+ }}
+ <br />
+ </h4>
+ <div>
+ <label class="form-label" style="margin-top: 5px;">Parent:</label>
+ <nz-tree-select
+ [ngStyle]="{ border: parentCodeValid ? '0px' : '1px solid red' }"
+ style="width: 70%; margin-top: 1px;"
+ [nzExpandedKeys]="expandKeys"
+ [nzNodes]="sysTreeParent"
+ nzShowSearch
+ nzPlaceHolder="Please select"
+ class="form-control"
+ formControlName="parent"
+ ></nz-tree-select>
+ </div>
+ <h4 style="color: red; margin-left: 22%;">
+ {{ parentCodeValid ? '' : 'Cannot change parent to itself or its child!' }}
+ <br />
+ </h4>
+ <div>
+ <label class="form-label" style="margin-top: 5px;">Sort:</label>
+ <nz-input-number class="form-control" formControlName="sort" style="margin-top: 1px;"></nz-input-number>
+ </div>
+ <div>
+ <label class="form-label">Status:</label>
+ <nz-switch
+ nzCheckedChildren="Available"
+ nzUnCheckedChildren="Deleted"
+ class="form-control"
+ formControlName="deleted"
+ style="margin-top: 30px;"
+ ></nz-switch>
+ </div>
+ <div>
+ <label class="form-label">Description:</label>
+ <textarea
+ rows="6"
+ nz-input
+ class="form-control"
+ formControlName="description"
+ style="width: 70%; margin-top: 25px;"
+ ></textarea>
+ </div>
+ </form>
+ <div class="footer">
+ <button type="button" (click)="isVisible = false" class="ant-btn" style="margin-right: 8px;">
+ <span>Cancel</span>
+ </button>
+ <button
+ nz-button
+ type="button"
+ [nzLoading]="submitBtnIsLoading"
+ (click)="submitDepartment()"
+ class="ant-btn ant-btn-primary"
+ id="btnSubmit"
+ [disabled]="!newDepartmentForm.get('name').valid || !newDepartmentForm.get('code').valid || !parentCodeValid"
>
- </nz-tree-select>
+ <span>Submit</span>
+ </button>
</div>
- <h4 style="color: red;margin-left: 22%;">{{ parentCodeValid ? "" : "Cannot change parent to itself or its child!" }}<br></h4>
- <div>
- <label class="form-label" style="margin-top: 5px;"> Sort:</label>
- <nz-input-number class="form-control" formControlName="sort" style="margin-top: 1px;"></nz-input-number>
- </div>
- <div>
- <label class="form-label" > Status:</label>
- <nz-switch nzCheckedChildren="Available" nzUnCheckedChildren="Deleted" class="form-control" formControlName="deleted" style="margin-top: 30px;"></nz-switch>
- </div>
- <div>
- <label class="form-label">Description:</label>
- <textarea rows="6" nz-input class="form-control" formControlName="description" style="width: 70%;margin-top: 25px;"></textarea>
- </div>
-
-</form>
-<div class="footer">
- <button type="button" (click)="isVisible = false;" class="ant-btn" style="margin-right: 8px;"><span>Cancel</span></button>
- <button
- nz-button
- type="button"
- [nzLoading]="submitBtnIsLoading"
- (click)="submitDepartment()"
- class="ant-btn ant-btn-primary"
- id='btnSubmit'
- [disabled]="!(newDepartmentForm.get('name')).valid || !(newDepartmentForm.get('code').valid) || !parentCodeValid"
- ><span>Submit</span></button>
-</div>
</nz-drawer>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.ts
index e2d613e..59862df 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/department/department.component.ts
@@ -18,20 +18,19 @@
*/
import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormControl, Validators, ValidationErrors } from '@angular/forms';
-import { DepartmentService } from '@submarine/services';
+import { FormControl, FormGroup, ValidationErrors, Validators } from '@angular/forms';
import { SysDeptItem } from '@submarine/interfaces/sys-dept-item';
import { SysDeptSelect } from '@submarine/interfaces/sys-dept-select';
+import { DepartmentService } from '@submarine/services';
import { NzMessageService } from 'ng-zorro-antd';
-
@Component({
- selector: 'app-department',
+ selector: 'submarine-department',
templateUrl: './department.component.html',
styleUrls: ['./department.component.scss']
})
export class DepartmentComponent implements OnInit {
- //About display departments
+ // About display departments
sysTreeParent: SysDeptSelect[] = [];
sysDeptTreeList: SysDeptItem[] = [];
listOfMapData: SysDeptItem[] = [];
@@ -40,49 +39,56 @@ export class DepartmentComponent implements OnInit {
isExpandTable = true;
filterArr: SysDeptItem[] = [];
mapOfExpandedData: { [key: string]: SysDeptItem[] } = {};
- //About new or edit department
+ // About new or edit department
newDepartmentForm: FormGroup;
editMode = false;
editNode: SysDeptItem;
submitBtnIsLoading = false;
- formCodeErrMsg = "";
+ formCodeErrMsg = '';
parentCodeValid = true;
isVisible = false;
- constructor(private departmentService: DepartmentService, private nzMessageService:NzMessageService) { }
+ constructor(private departmentService: DepartmentService, private nzMessageService: NzMessageService) {}
ngOnInit() {
this.dapartmentDictForm = new FormGroup({
- 'departmentName': new FormControl(''),
- 'departmentCode': new FormControl('')
+ departmentName: new FormControl(''),
+ departmentCode: new FormControl('')
});
this.newDepartmentForm = new FormGroup({
- 'code': new FormControl(null, [Validators.required, this.checkRequire.bind(this), this.checkIfParent.bind(this)], this.duplicateDeptCodeCheck.bind(this)),
- 'name': new FormControl(null, Validators.required),
- 'parent': new FormControl(null, this.checkEditParent.bind(this)),
- 'sort': new FormControl(0),
- 'deleted': new FormControl(null),
- 'description' : new FormControl("")
+ code: new FormControl(
+ null,
+ [Validators.required, this.checkRequire.bind(this), this.checkIfParent.bind(this)],
+ this.duplicateDeptCodeCheck.bind(this)
+ ),
+ name: new FormControl(null, Validators.required),
+ parent: new FormControl(null, this.checkEditParent.bind(this)),
+ sort: new FormControl(0),
+ deleted: new FormControl(null),
+ description: new FormControl('')
});
this.loadDepartment();
}
- queryDepartment(){
+ queryDepartment() {
this.filterArr = [];
- Object.keys(this.mapOfExpandedData).forEach(item => {
- this.mapOfExpandedData[item].forEach(node => {
- if (node.deptName.includes(this.dapartmentDictForm.get('departmentName').value) && node.deptCode.includes(this.dapartmentDictForm.get('departmentCode').value)){
+ Object.keys(this.mapOfExpandedData).forEach((item) => {
+ this.mapOfExpandedData[item].forEach((node) => {
+ if (
+ node.deptName.includes(this.dapartmentDictForm.get('departmentName').value) &&
+ node.deptCode.includes(this.dapartmentDictForm.get('departmentCode').value)
+ ) {
this.filterArr.push(node);
}
- });
+ });
});
this.isExpandTable = false;
- this.filterArr=[...this.filterArr];
+ this.filterArr = [...this.filterArr];
}
- submitDepartment(){
+ submitDepartment() {
this.submitBtnIsLoading = true;
- if (this.editMode === true){
+ if (this.editMode === true) {
this.editNode.deptName = this.newDepartmentForm.get('name').value;
this.editNode.deptCode = this.newDepartmentForm.get('code').value;
this.editNode.description = this.newDepartmentForm.get('description').value;
@@ -90,58 +96,66 @@ export class DepartmentComponent implements OnInit {
this.editNode.sortOrder = this.newDepartmentForm.get('sort').value;
this.editNode.parentCode = this.newDepartmentForm.get('parent').value;
this.setDepartment(this.editNode);
- }
- else{
- this.departmentService.createDept({
- deptName: this.newDepartmentForm.get('name').value,
- deptCode: this.newDepartmentForm.get('code').value,
- sortOrder: this.newDepartmentForm.get('sort').value,
- description: this.newDepartmentForm.get('description').value,
- deleted: this.newDepartmentForm.get('deleted').value ? 0 : 1,
- parentCode: this.newDepartmentForm.get('parent').value
- }).subscribe(() => {
- this.nzMessageService.success('Add department success!');
- this.loadDepartment();
- this.isVisible = false;
- this.submitBtnIsLoading = false;
- }, err => {
- this.nzMessageService.error(err.message);
- this.submitBtnIsLoading = false;
- });
+ } else {
+ this.departmentService
+ .createDept({
+ deptName: this.newDepartmentForm.get('name').value,
+ deptCode: this.newDepartmentForm.get('code').value,
+ sortOrder: this.newDepartmentForm.get('sort').value,
+ description: this.newDepartmentForm.get('description').value,
+ deleted: this.newDepartmentForm.get('deleted').value ? 0 : 1,
+ parentCode: this.newDepartmentForm.get('parent').value
+ })
+ .subscribe(
+ () => {
+ this.nzMessageService.success('Add department success!');
+ this.loadDepartment();
+ this.isVisible = false;
+ this.submitBtnIsLoading = false;
+ },
+ (err) => {
+ this.nzMessageService.error(err.message);
+ this.submitBtnIsLoading = false;
+ }
+ );
}
}
- addDept(){
- this.departmentService.fetchSysDeptSelect().subscribe(list => {
+ addDept() {
+ this.departmentService.fetchSysDeptSelect().subscribe((list) => {
this.sysTreeParent = list;
});
this.parentCodeValid = true;
this.newDepartmentForm = new FormGroup({
- 'code': new FormControl("", [Validators.required, this.checkRequire.bind(this), this.checkIfParent.bind(this)], this.duplicateDeptCodeCheck.bind(this)),
- 'name': new FormControl(null, Validators.required),
- 'parent': new FormControl(null),
- 'sort': new FormControl(0),
- 'deleted': new FormControl(null),
- 'description' : new FormControl("")
+ code: new FormControl(
+ '',
+ [Validators.required, this.checkRequire.bind(this), this.checkIfParent.bind(this)],
+ this.duplicateDeptCodeCheck.bind(this)
+ ),
+ name: new FormControl(null, Validators.required),
+ parent: new FormControl(null),
+ sort: new FormControl(0),
+ deleted: new FormControl(null),
+ description: new FormControl('')
});
- this.formCodeErrMsg = "Please entry department code!";
- this.isVisible=true;
+ this.formCodeErrMsg = 'Please entry department code!';
+ this.isVisible = true;
this.editMode = false;
}
- loadDepartment(){
- this.departmentService.fetchSysDeptList().subscribe(list => {
+ loadDepartment() {
+ this.departmentService.fetchSysDeptList().subscribe((list) => {
this.listOfMapData = list;
- this.listOfMapData.forEach(item => {
+ this.listOfMapData.forEach((item) => {
this.mapOfExpandedData[item.key] = this.convertTreeToList(item);
});
this.isLoading = false;
});
}
- setDepartment(node: SysDeptItem){
- this.departmentService.editDept(
- {
+ setDepartment(node: SysDeptItem) {
+ this.departmentService
+ .editDept({
deptCode: node.deptCode,
deptName: node.deptName,
sortOrder: node.sortOrder,
@@ -149,52 +163,61 @@ export class DepartmentComponent implements OnInit {
description: node.description,
deleted: node.deleted,
parentCode: node.parentCode
- }
- ).subscribe(() => {
- this.nzMessageService.success('Update success!');
- this.loadDepartment();
- this.isVisible = false;
- this.submitBtnIsLoading = false;
- }, err => {
- this.nzMessageService.error(err.message);
- });
+ })
+ .subscribe(
+ () => {
+ this.nzMessageService.success('Update success!');
+ this.loadDepartment();
+ this.isVisible = false;
+ this.submitBtnIsLoading = false;
+ },
+ (err) => {
+ this.nzMessageService.error(err.message);
+ }
+ );
}
- deleteDepartment(node: SysDeptItem){
+ deleteDepartment(node: SysDeptItem) {
node.deleted = 1;
this.setDepartment(node);
}
- restoreDepartment(node: SysDeptItem){
+ restoreDepartment(node: SysDeptItem) {
node.deleted = 0;
this.setDepartment(node);
}
- editDepartment(node: SysDeptItem){
- this.departmentService.fetchSysDeptSelect().subscribe(list => {
+ editDepartment(node: SysDeptItem) {
+ this.departmentService.fetchSysDeptSelect().subscribe((list) => {
this.sysTreeParent = list;
});
this.newDepartmentForm = new FormGroup({
- 'code': new FormControl(node.deptCode, [Validators.required, this.checkRequire.bind(this), this.checkIfParent.bind(this)], this.duplicateDeptCodeCheck.bind(this)),
- 'name': new FormControl(node.deptName, Validators.required),
- 'parent': new FormControl(node.parent?node.parent.key:null),
- 'sort': new FormControl(node.sortOrder),
- 'deleted': new FormControl(node.deleted === 0 ? true : false),
- 'description' : new FormControl(node.description)
+ code: new FormControl(
+ node.deptCode,
+ [Validators.required, this.checkRequire.bind(this), this.checkIfParent.bind(this)],
+ this.duplicateDeptCodeCheck.bind(this)
+ ),
+ name: new FormControl(node.deptName, Validators.required),
+ parent: new FormControl(node.parent ? node.parent.key : null),
+ sort: new FormControl(node.sortOrder),
+ deleted: new FormControl(node.deleted === 0 ? true : false),
+ description: new FormControl(node.description)
});
this.editNode = node;
this.editMode = true;
this.isVisible = true;
- this.parentCodeValid = true;;
+ this.parentCodeValid = true;
}
collapse(array: SysDeptItem[], data: SysDeptItem, $event: boolean): void {
if ($event === false) {
if (data.children) {
- data.children.forEach(d => {
- const target = array.find(a => a.key === d.key)!;
+ data.children.forEach((d) => {
+ const target = array.find((a) => a.key === d.key)!;
target.expand = false;
- if (target.key === data.key) return;
+ if (target.key === data.key) {
+ return;
+ }
this.collapse(array, target, false);
});
} else {
@@ -228,102 +251,97 @@ export class DepartmentComponent implements OnInit {
}
}
- showParent(node: SysDeptItem){
+ showParent(node: SysDeptItem) {
if (node.parent) {
return node.parent.deptName;
}
- return 'None'
+ return 'None';
}
- duplicateDeptCodeCheck(control: FormControl): Promise<ValidationErrors|null>{
- var params = {
+ duplicateDeptCodeCheck(control: FormControl): Promise<ValidationErrors | null> {
+ const params = {
tableName: 'sys_department',
fieldName: 'dept_code',
fieldVal: control.value,
- dataId: this.editMode? this.editNode.id :undefined
- }
+ dataId: this.editMode ? this.editNode.id : undefined
+ };
const promise = new Promise((resolve, reject) => {
- this.departmentService.codeCheck(params).then((success) => {
- if (success){
- resolve(null);
+ this.departmentService.codeCheck(params).then(
+ (success) => {
+ if (success) {
+ resolve(null);
+ } else {
+ this.formCodeErrMsg = 'This value already exists is not available!';
+ resolve({ 'Duplicate Code': true });
+ }
+ },
+ (err) => {
+ reject(err);
}
- else{
- this.formCodeErrMsg = "This value already exists is not available!";
- resolve({"Duplicate Code": true});
- }
- },(err)=>{
- reject(err);
- });
+ );
});
return promise;
}
- checkIfParent(control: FormControl): {[key: string]:any}|null{
- if (this.editMode){
- if(this.editNode.children == null||this.editNode.deptCode===control.value){
+ checkIfParent(control: FormControl): { [key: string]: any } | null {
+ if (this.editMode) {
+ if (this.editNode.children == null || this.editNode.deptCode === control.value) {
return null;
- }
- else{
- console.log(this.newDepartmentForm.get('code'))
- var mesg = this.editNode.deptCode + 'is the parent code of other departments, can not be modified!';
+ } else {
+ console.log(this.newDepartmentForm.get('code'));
+ const mesg = this.editNode.deptCode + 'is the parent code of other departments, can not be modified!';
this.formCodeErrMsg = mesg;
- return {mesg: true};
+ return { mesg: true };
}
- }
- else{
+ } else {
return null;
}
}
- checkRequire(control: FormControl): {[key: string]:any}|null{
- if (control.value === ""){
- var mesg = "Please enter department code!";
+ checkRequire(control: FormControl): { [key: string]: any } | null {
+ if (control.value === '') {
+ const mesg = 'Please enter department code!';
this.formCodeErrMsg = mesg;
- return {mesg: true}
- }
- else{
- this.formCodeErrMsg = "";
+ return { mesg: true };
+ } else {
+ this.formCodeErrMsg = '';
return null;
}
}
- //Use code to find node
- checkNodeCode(node: SysDeptItem, targetCode: string, checkExistCode: string){
+ // Use code to find node
+ checkNodeCode(node: SysDeptItem, targetCode: string, checkExistCode: string) {
if (node.deptCode === targetCode) {
this.checkCodeExist(node, checkExistCode);
- }
- else{
- if (node.children !== null){
- for (let i=0;i<node.children.length;i++){
+ } else {
+ if (node.children !== null) {
+ for (let i = 0; i < node.children.length; i++) {
this.checkNodeCode(node.children[i], targetCode, checkExistCode);
}
}
}
}
- //Check node exist under the node
- checkCodeExist(node: SysDeptItem, targetCode: string){
- if (node.deptCode === targetCode){
+ // Check node exist under the node
+ checkCodeExist(node: SysDeptItem, targetCode: string) {
+ if (node.deptCode === targetCode) {
this.parentCodeValid = false;
- }
- else{
- if (node.children !== null){
- node.children.forEach(element => {
+ } else {
+ if (node.children !== null) {
+ node.children.forEach((element) => {
this.checkCodeExist(element, targetCode);
});
}
-
}
}
- checkEditParent(control: FormControl): {[key: string]:any}|null{
+ checkEditParent(control: FormControl): { [key: string]: any } | null {
this.parentCodeValid = true;
- if (this.editMode){
- this.listOfMapData.forEach(element => {
- this.checkNodeCode(element, this.editNode.deptCode,control.value);
+ if (this.editMode) {
+ this.listOfMapData.forEach((element) => {
+ this.checkNodeCode(element, this.editNode.deptCode, control.value);
});
}
return null;
}
-
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager-routing.module.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager-routing.module.ts
index d34a575..e27dcc1 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager-routing.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager-routing.module.ts
@@ -20,9 +20,9 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { DataDictComponent } from '@submarine/pages/workbench/manager/data-dict/data-dict.component';
+import { DepartmentComponent } from './department/department.component';
import { ManagerComponent } from './manager.component';
import { UserComponent } from './user/user.component';
-import { DepartmentComponent } from './department/department.component';
const routes: Routes = [
{
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.component.ts
index 4239164..6612041 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.component.ts
@@ -25,7 +25,7 @@ import _ from 'lodash';
interface HeaderInfo {
title: string;
description: string;
- breadCrumb: Array<{ title: string, routerLink?: string }>;
+ breadCrumb: Array<{ title: string; routerLink?: string }>;
}
@Component({
@@ -88,7 +88,7 @@ export class ManagerComponent implements OnInit {
currentHeaderInfo: HeaderInfo;
constructor(private route: ActivatedRoute, private location: Location, private router: Router) {
- this.router.events.subscribe(event => {
+ this.router.events.subscribe((event) => {
if (event instanceof NavigationEnd) {
const lastMatch = _.last(event.urlAfterRedirects.split('/'));
this.currentHeaderInfo = this.headerInfo[lastMatch];
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.module.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.module.ts
index 8300149..4c065fa 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/manager.module.ts
@@ -26,15 +26,24 @@ import { NgZorroAntdModule } from 'ng-zorro-antd';
import { DataDictConfigModalComponent } from './data-dict-config-modal/data-dict-config-modal.component';
import { DataDictModalComponent } from './data-dict-modal/data-dict-modal.component';
import { DataDictComponent } from './data-dict/data-dict.component';
+import { DepartmentComponent } from './department/department.component';
import { ManagerRoutingModule } from './manager-routing.module';
import { ManagerComponent } from './manager.component';
import { UserDrawerComponent } from './user-drawer/user-drawer.component';
import { UserPasswordModalComponent } from './user-password-modal/user-password-modal.component';
import { UserComponent } from './user/user.component';
-import { DepartmentComponent } from './department/department.component';
@NgModule({
- declarations: [UserComponent, ManagerComponent, DataDictComponent, UserPasswordModalComponent, UserDrawerComponent, DataDictModalComponent, DataDictConfigModalComponent, DepartmentComponent],
+ declarations: [
+ UserComponent,
+ ManagerComponent,
+ DataDictComponent,
+ UserPasswordModalComponent,
+ UserDrawerComponent,
+ DataDictModalComponent,
+ DataDictConfigModalComponent,
+ DepartmentComponent
+ ],
imports: [CommonModule, ManagerRoutingModule, NgZorroAntdModule, ComponentsModule, FormsModule, ReactiveFormsModule]
})
export class ManagerModule {}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.html
index 9ae9b64..e4686e7 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.html
@@ -85,7 +85,7 @@
Confirm
</nz-form-label>
<nz-form-control [nzSpan]="controlSpan" [nzErrorTip]="confirmErrorTpl">
- <input type="password" nz-input formControlName="confirm" placeholder="Please confirm password"/>
+ <input type="password" nz-input formControlName="confirm" placeholder="Please confirm password" />
<ng-template #confirmErrorTpl let-control>
<ng-container *ngIf="control.hasError('required')">
@@ -104,7 +104,7 @@
Real Name
</nz-form-label>
<nz-form-control [nzSpan]="controlSpan" nzErrorTip="Please input account's real name">
- <input type="text" nz-input formControlName="realName" placeholder="User's real name" [readOnly]="readonly"/>
+ <input type="text" nz-input formControlName="realName" placeholder="User's real name" [readOnly]="readonly" />
</nz-form-control>
</nz-form-item>
@@ -153,7 +153,7 @@
email
</nz-form-label>
<nz-form-control [nzSpan]="controlSpan" [nzErrorTip]="emailErrorTip">
- <input type="email" nz-input formControlName="email" [readOnly]="readonly"/>
+ <input type="email" nz-input formControlName="email" [readOnly]="readonly" />
<ng-template #emailErrorTip let-control>
<ng-container *ngIf="control.hasError('email')">
@@ -172,7 +172,7 @@
Phone
</nz-form-label>
<nz-form-control [nzSpan]="controlSpan" [nzErrorTip]="phoneErrorTip">
- <input type="text" nz-input formControlName="phone" [readOnly]="readonly"/>
+ <input type="text" nz-input formControlName="phone" [readOnly]="readonly" />
<ng-template #phoneErrorTip let-control>
<ng-container *ngIf="control.hasError('duplicated')">
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.ts
index a480af4..33f5c4c 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-drawer/user-drawer.component.ts
@@ -47,37 +47,35 @@ export class UserDrawerComponent implements OnInit, OnChanges {
statusDictSelect: SysDictItem[] = [];
title = 'Add';
- constructor(private fb: FormBuilder, private systemUtilsService: SystemUtilsService) {
- }
+ constructor(private fb: FormBuilder, private systemUtilsService: SystemUtilsService) {}
ngOnInit() {
- this.form = this.fb.group(
- {
- userName: new FormControl('',
- {
- updateOn: 'blur',
- validators: [Validators.required],
- asyncValidators: [this.userNameValidator]
- }
- ),
- password: ['', [Validators.required, Validators.pattern(/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/)]],
- confirm: ['', this.confirmValidator],
- realName: ['', Validators.required],
- deptCode: [],
- sex: [],
- status: [],
- birthday: [],
- email: new FormControl('', {
- updateOn: 'blur',
- validators: [Validators.email],
- asyncValidators: [this.emailValidator]
- }),
- phone: new FormControl('', {
- updateOn: 'blur',
- asyncValidators: [this.phoneValidator]
- })
- }
- );
+ this.form = this.fb.group({
+ userName: new FormControl('', {
+ updateOn: 'blur',
+ validators: [Validators.required],
+ asyncValidators: [this.userNameValidator]
+ }),
+ password: [
+ '',
+ [Validators.required, Validators.pattern(/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,./]).{8,}$/)]
+ ],
+ confirm: ['', this.confirmValidator],
+ realName: ['', Validators.required],
+ deptCode: [],
+ sex: [],
+ status: [],
+ birthday: [],
+ email: new FormControl('', {
+ updateOn: 'blur',
+ validators: [Validators.email],
+ asyncValidators: [this.emailValidator]
+ }),
+ phone: new FormControl('', {
+ updateOn: 'blur',
+ asyncValidators: [this.phoneValidator]
+ })
+ });
zip(
this.systemUtilsService.fetchSysDictByCode(SysDictCode.USER_SEX),
@@ -117,7 +115,7 @@ export class UserDrawerComponent implements OnInit, OnChanges {
disabled: readOnly
},
birthday: {
- value: (sysUser && sysUser.birthday) ? new Date(sysUser.birthday) : '',
+ value: sysUser && sysUser.birthday ? new Date(sysUser.birthday) : '',
disabled: readOnly
},
email: sysUser ? sysUser.email : '',
@@ -137,27 +135,29 @@ export class UserDrawerComponent implements OnInit, OnChanges {
this.form.controls[key].updateValueAndValidity();
}
- this.form.statusChanges.pipe(
- startWith(this.form.status),
- filter(status => status !== 'PENDING'),
- take(1),
- map(status => status === 'VALID')
- ).subscribe(valid => {
- if (valid) {
- const sysUser = this.sysUser ? this.sysUser : {};
- const formData = { ...sysUser, ...this.form.value };
-
- delete formData.confirm;
- delete formData['sex@dict'];
- delete formData['status@dict'];
-
- if (formData.birthday) {
- formData.birthday = format(formData.birthday, 'yyyy-MM-dd HH:mm:ss');
- }
+ this.form.statusChanges
+ .pipe(
+ startWith(this.form.status),
+ filter((status) => status !== 'PENDING'),
+ take(1),
+ map((status) => status === 'VALID')
+ )
+ .subscribe((valid) => {
+ if (valid) {
+ const sysUser = this.sysUser ? this.sysUser : {};
+ const formData = { ...sysUser, ...this.form.value };
+
+ delete formData.confirm;
+ delete formData['sex@dict'];
+ delete formData['status@dict'];
+
+ if (formData.birthday) {
+ formData.birthday = format(formData.birthday, 'yyyy-MM-dd HH:mm:ss');
+ }
- this.submit.emit(formData);
- }
- });
+ this.submit.emit(formData);
+ }
+ });
}
generateTitle(): string {
@@ -190,7 +190,7 @@ export class UserDrawerComponent implements OnInit, OnChanges {
new Observable((observer: Observer<ValidationErrors | null>) => {
this.systemUtilsService
.duplicateCheckUsername(control.value, this.sysUser && this.sysUser.id)
- .subscribe(status => {
+ .subscribe((status) => {
if (status) {
observer.next(null);
} else {
@@ -210,7 +210,7 @@ export class UserDrawerComponent implements OnInit, OnChanges {
this.systemUtilsService
.duplicateCheckUserEmail(control.value, this.sysUser && this.sysUser.id)
- .subscribe(status => {
+ .subscribe((status) => {
if (status) {
observer.next(null);
} else {
@@ -230,7 +230,7 @@ export class UserDrawerComponent implements OnInit, OnChanges {
this.systemUtilsService
.duplicateCheckUserPhone(control.value, this.sysUser && this.sysUser.id)
- .subscribe(status => {
+ .subscribe((status) => {
if (status) {
observer.next(null);
} else {
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-password-modal/user-password-modal.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-password-modal/user-password-modal.component.html
index 9ae1ea9..da3f3de 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-password-modal/user-password-modal.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user-password-modal/user-password-modal.component.html
@@ -17,15 +17,21 @@
~ under the License.
-->
-<nz-modal [nzVisible]="visible" nzTitle="Reset Password" nzCancelText="Close" nzOkText="Ok" (nzOnCancel)="hideModal()"
- (nzOnOk)="submitForm()">
+<nz-modal
+ [nzVisible]="visible"
+ nzTitle="Reset Password"
+ nzCancelText="Close"
+ nzOkText="Ok"
+ (nzOnCancel)="hideModal()"
+ (nzOnOk)="submitForm()"
+>
<form nz-form nzLayout="horizontal" [formGroup]="form">
<nz-form-item>
<nz-form-label>
Account Name
</nz-form-label>
<nz-form-control>
- <input type="text" nz-input readonly formControlName="accountName"/>
+ <input type="text" nz-input readonly formControlName="accountName" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -33,12 +39,7 @@
Password
</nz-form-label>
<nz-form-control nzHasFeedback nzErrorTip="Please input new password">
- <input
- nz-input
- type="password"
- formControlName="password"
- (ngModelChange)="validateConfirmPassword()"
- />
+ <input nz-input type="password" formControlName="password" (ngModelChange)="validateConfirmPassword()" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -46,7 +47,7 @@
Confirm Password
</nz-form-label>
<nz-form-control nzHasFeedback [nzErrorTip]="passwordErrorTpl">
- <input type="password" nz-input formControlName="confirm"/>
+ <input type="password" nz-input formControlName="confirm" />
<ng-template #passwordErrorTpl let-control>
<ng-container *ngIf="control.hasError('required')">
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.html
index d13467a..13cd98f 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.html
@@ -24,7 +24,7 @@
<nz-form-label>Department</nz-form-label>
<nz-form-control>
<nz-tree-select
- style="width: 171px"
+ style="width: 171px;"
nzAllowClear
nzDefaultExpandAll
nzShowSearch
@@ -37,13 +37,13 @@
<nz-form-item>
<nz-form-label>Account Name</nz-form-label>
<nz-form-control>
- <input nz-input formControlName="accountName"/>
+ <input nz-input formControlName="accountName" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label>Email</nz-form-label>
<nz-form-control>
- <input nz-input formControlName="email"/>
+ <input nz-input formControlName="email" />
</nz-form-control>
</nz-form-item>
<nz-form-item>
@@ -52,7 +52,7 @@
<i nz-icon nzType="search"></i>
Query
</button>
- <button nz-button style="margin-left: 8px" (click)="onShowUserDrawer()">
+ <button nz-button style="margin-left: 8px;" (click)="onShowUserDrawer()">
<i nz-icon nzType="plus"></i>
Add User
</button>
@@ -63,53 +63,53 @@
<nz-table #table [nzData]="userList" [nzScroll]="{ x: '1100px' }" nzNoResult="No result" nzBordered>
<thead>
- <tr>
- <th>Account Name</th>
- <th>Real Name</th>
- <th>Department</th>
- <th>Role</th>
- <th>Status</th>
- <th>Sex</th>
- <th>Email</th>
- <th nzWidth="120px">Create Time</th>
- <th nzWidth="120px" nzRight="0px">Action</th>
- </tr>
+ <tr>
+ <th>Account Name</th>
+ <th>Real Name</th>
+ <th>Department</th>
+ <th>Role</th>
+ <th>Status</th>
+ <th>Sex</th>
+ <th>Email</th>
+ <th nzWidth="120px">Create Time</th>
+ <th nzWidth="120px" nzRight="0px">Action</th>
+ </tr>
</thead>
<tbody>
- <tr *ngFor="let data of table.data">
- <td>{{ data.userName }}</td>
- <td>{{ data.realName }}</td>
- <td>{{ data.deptName }}</td>
- <td>{{ data.roleName }}</td>
- <td>{{ data['status@dict'] }}</td>
- <td>{{ data['sex@dict'] }}</td>
- <td>{{ data.email }}</td>
- <td>{{ data.createTime }}</td>
- <td class="td-action" nzRight="0px">
- <a (click)="onShowUserDrawer(data)">Edit</a>
- <a nz-dropdown [nzDropdownMenu]="more">
- More
- <i nz-icon nzType="down"></i>
- </a>
- <nz-dropdown-menu #more="nzDropdownMenu">
- <ul nz-menu nzSelectable>
- <li nz-menu-item (click)="onShowUserDrawer(data, true)">Details</li>
- <li nz-menu-item (click)="onShowResetPasswordModal(data)">Password</li>
- <li
- nz-menu-item
- nz-popconfirm
- nzPlacement="left"
- nzTitle="Confirm to delete?"
- nzCancelText="Cancel"
- nzOkText="Ok"
- (nzOnConfirm)="onDeleteUser(data)"
- >
- Delete
- </li>
- </ul>
- </nz-dropdown-menu>
- </td>
- </tr>
+ <tr *ngFor="let data of table.data">
+ <td>{{ data.userName }}</td>
+ <td>{{ data.realName }}</td>
+ <td>{{ data.deptName }}</td>
+ <td>{{ data.roleName }}</td>
+ <td>{{ data['status@dict'] }}</td>
+ <td>{{ data['sex@dict'] }}</td>
+ <td>{{ data.email }}</td>
+ <td>{{ data.createTime }}</td>
+ <td class="td-action" nzRight="0px">
+ <a (click)="onShowUserDrawer(data)">Edit</a>
+ <a nz-dropdown [nzDropdownMenu]="more">
+ More
+ <i nz-icon nzType="down"></i>
+ </a>
+ <nz-dropdown-menu #more="nzDropdownMenu">
+ <ul nz-menu nzSelectable>
+ <li nz-menu-item (click)="onShowUserDrawer(data, true)">Details</li>
+ <li nz-menu-item (click)="onShowResetPasswordModal(data)">Password</li>
+ <li
+ nz-menu-item
+ nz-popconfirm
+ nzPlacement="left"
+ nzTitle="Confirm to delete?"
+ nzCancelText="Cancel"
+ nzOkText="Ok"
+ (nzOnConfirm)="onDeleteUser(data)"
+ >
+ Delete
+ </li>
+ </ul>
+ </nz-dropdown-menu>
+ </td>
+ </tr>
</tbody>
</nz-table>
</nz-card>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.ts
index 3c544e0..a00f0da 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/manager/user/user.component.ts
@@ -63,13 +63,12 @@ export class UserComponent implements OnInit {
private deptService: DepartmentService,
private fb: FormBuilder,
private nzMessageService: NzMessageService
- ) {
- }
+ ) {}
ngOnInit() {
this.fetchUserList();
- this.deptService.fetchSysDeptSelect().subscribe(list => {
+ this.deptService.fetchSysDeptSelect().subscribe((list) => {
this.sysDeptTreeList = list;
});
@@ -122,11 +121,14 @@ export class UserComponent implements OnInit {
this.resetPasswordModalVisible = false;
- this.userService.changePassword(id, password).subscribe(() => {
- this.nzMessageService.success('Change password success!');
- }, () => {
- this.nzMessageService.error('Change password error');
- });
+ this.userService.changePassword(id, password).subscribe(
+ () => {
+ this.nzMessageService.success('Change password success!');
+ },
+ () => {
+ this.nzMessageService.error('Change password error');
+ }
+ );
}
onShowUserDrawer(sysUser?: SysUser, readOnly = false) {
@@ -143,19 +145,25 @@ export class UserComponent implements OnInit {
this.userDrawerVisible = false;
if (formData.id) {
- this.userService.updateUser(formData).subscribe(() => {
- this.nzMessageService.success('Update user success!');
- this.queryUserList();
- }, err => {
- this.nzMessageService.error(err.message);
- });
+ this.userService.updateUser(formData).subscribe(
+ () => {
+ this.nzMessageService.success('Update user success!');
+ this.queryUserList();
+ },
+ (err) => {
+ this.nzMessageService.error(err.message);
+ }
+ );
} else {
- this.userService.createUser(formData).subscribe(() => {
- this.nzMessageService.success('Add user success!');
- this.queryUserList();
- }, err => {
- this.nzMessageService.error(err.message);
- });
+ this.userService.createUser(formData).subscribe(
+ () => {
+ this.nzMessageService.success('Add user success!');
+ this.queryUserList();
+ },
+ (err) => {
+ this.nzMessageService.error(err.message);
+ }
+ );
}
}
@@ -164,7 +172,8 @@ export class UserComponent implements OnInit {
() => {
this.nzMessageService.success('Delete user success!');
this.fetchUserList();
- }, err => {
+ },
+ (err) => {
this.nzMessageService.success(err.message);
}
);
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/model/model.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/model/model.component.ts
index 2489c69..1835f44 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/model/model.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/model/model.component.ts
@@ -25,10 +25,7 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./model.component.scss']
})
export class ModelComponent implements OnInit {
+ constructor() {}
- constructor() { }
-
- ngOnInit() {
- }
-
+ ngOnInit() {}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench-routing.module.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench-routing.module.ts
index a4d6326..de8591c 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench-routing.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench-routing.module.ts
@@ -63,7 +63,7 @@ const routes: Routes = [
},
{
path: 'manager',
- loadChildren: () => import('./manager/manager.module').then(m => m.ManagerModule)
+ loadChildren: () => import('./manager/manager.module').then((m) => m.ManagerModule)
}
]
}
@@ -72,5 +72,4 @@ const routes: Routes = [
@NgModule({
imports: [RouterModule.forChild(routes)]
})
-export class WorkbenchRoutingModule {
-}
+export class WorkbenchRoutingModule {}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.html
index 59dd8bd..973ddb4 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.html
@@ -27,7 +27,7 @@
>
<div class="sidebar-logo">
<a routerLink="/workbench/dashboard" target="_blank">
- <img src="/assets/logo.png" alt="logo"/>
+ <img src="/assets/logo.png" alt="logo" />
<h1>Submarine</h1>
</a>
</div>
@@ -40,9 +40,17 @@
</li>
</ul>
</li>
- <li *ngIf="!menu.children" nz-menu-item nz-tooltip [nzTitle]="menu.title" nzPlacement="right" nzMatchRouter [routerLink]="menu.routerLink">
- <i nz-icon [nzType]="menu.iconType"></i>
- <span>{{ menu.title }}</span>
+ <li
+ *ngIf="!menu.children"
+ nz-menu-item
+ nz-tooltip
+ [nzTitle]="menu.title"
+ nzPlacement="right"
+ nzMatchRouter
+ [routerLink]="menu.routerLink"
+ >
+ <i nz-icon [nzType]="menu.iconType"></i>
+ <span>{{ menu.title }}</span>
</li>
</ng-container>
</ul>
@@ -55,19 +63,25 @@
</div>
<div class="header-operation">
- <div nz-dropdown *ngIf="userInfo$ | async as userInfo" [nzDropdownMenu]="userInfoMenu"
- class="operation-user-info">
+ <div
+ nz-dropdown
+ *ngIf="userInfo$ | async as userInfo"
+ [nzDropdownMenu]="userInfoMenu"
+ class="operation-user-info"
+ >
<nz-avatar nzIcon="user" nzSize="small"></nz-avatar>
- {{userInfo.name}}
+ {{ userInfo.name }}
</div>
<nz-dropdown-menu #userInfoMenu="nzDropdownMenu">
<ul nz-menu>
<li nz-menu-item nzDisabled>
- <i nz-icon nzType="setting"></i>UserInfo setting
+ <i nz-icon nzType="setting"></i>
+ UserInfo setting
</li>
<li nz-menu-divider></li>
<li nz-menu-item (click)="logout()">
- <i nz-icon nzType="logout"></i>Sign out
+ <i nz-icon nzType="logout"></i>
+ Sign out
</li>
</ul>
</nz-dropdown-menu>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.ts
index 0f5ab4b..70e1b99 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.component.ts
@@ -100,13 +100,12 @@ export class WorkbenchComponent implements OnInit {
private authService: AuthService,
private userService: UserService,
private nzNotificationService: NzNotificationService
- ) {
- }
+ ) {}
ngOnInit() {
if (this.authService.isLoggedIn) {
this.userInfo$ = this.userService.fetchUserInfo().pipe(
- tap(userInfo => {
+ tap((userInfo) => {
this.nzNotificationService.success('Welcome', `Welcome back, ${userInfo.name}`);
})
);
@@ -114,7 +113,7 @@ export class WorkbenchComponent implements OnInit {
}
logout() {
- this.authService.logout().subscribe(isLogout => {
+ this.authService.logout().subscribe((isLogout) => {
if (isLogout) {
this.router.navigate(['/user/login']);
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.module.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.module.ts
index 2573f12..ba34d02 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workbench.module.ts
@@ -54,5 +54,4 @@ import { WorkspaceModule } from './workspace/workspace.module';
InterpreterModule
]
})
-export class WorkbenchModule {
-}
+export class WorkbenchModule {}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.html
index 97f04be..bcfebcc 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.html
@@ -17,11 +17,12 @@
~ under the License.
-->
-<button nz-button nzType="primary" nzShape="circle" style="float:right;margin: 15px;" (click)="clearProject()"><i nz-icon
- nzType="close" nzTheme="outline"></i></button>
-<br>
-<h1 style="margin-left: 30px;"> Create New Project</h1>
-<div style="padding-left:300px;padding-right:300px;">
+<button nz-button nzType="primary" nzShape="circle" style="float: right; margin: 15px;" (click)="clearProject()">
+ <i nz-icon nzType="close" nzTheme="outline"></i>
+</button>
+<br />
+<h1 style="margin-left: 30px;">Create New Project</h1>
+<div style="padding-left: 300px; padding-right: 300px;">
<nz-steps [nzCurrent]="current">
<nz-step nzTitle="Basic Information"></nz-step>
<nz-step nzTitle="Initial Project"></nz-step>
@@ -32,98 +33,136 @@
<div [ngSwitch]="current">
<div *ngSwitchCase="0">
<form #f="ngForm">
- <br>
+ <br />
<div>
- <label class="form-label"><span class="red-star">* </span> Project Name:</label>
- <input type="text" id="username" class="form-control" [(ngModel)]="newProjectContent.projectName"
- name="username" required>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Project Name:
+ </label>
+ <input
+ type="text"
+ id="username"
+ class="form-control"
+ [(ngModel)]="newProjectContent.projectName"
+ name="username"
+ required
+ />
</div>
<div>
- <label class="form-label"><span class="red-star">* </span>Description:</label>
- <textarea rows="6" class="form-control" name="projectDescriptin" [(ngModel)]="newProjectContent.description"
- required></textarea>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Description:
+ </label>
+ <textarea
+ rows="6"
+ class="form-control"
+ name="projectDescriptin"
+ [(ngModel)]="newProjectContent.description"
+ required
+ ></textarea>
</div>
<div>
- <label class="form-label"><span class="red-star">* </span>Visibility:</label>
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Visibility:
+ </label>
<nz-radio-group name="visibility" [(ngModel)]="newProjectContent.visibility">
- <label class="darkLabel" nz-radio nzValue="PROJECT_VISIBILITY_PRIVATE">Private - Only project collaborators can view or edit the
- project.</label>
- <label class="darkLabel" nz-radio nzValue="PROJECT_VISIBILITY_TEAM">Team - All members of the team can view the project.</label>
- <div *ngIf="newProjectContent.visibility==='PROJECT_VISIBILITY_TEAM'">
- <nz-select [(ngModel)]="newProjectContent.team" name="team" nzAllowClear nzPlaceHolder="Choose" style="margin-top: 10px;">
+ <label class="darkLabel" nz-radio nzValue="PROJECT_VISIBILITY_PRIVATE">
+ Private - Only project collaborators can view or edit the project.
+ </label>
+ <label class="darkLabel" nz-radio nzValue="PROJECT_VISIBILITY_TEAM">
+ Team - All members of the team can view the project.
+ </label>
+ <div *ngIf="newProjectContent.visibility === 'PROJECT_VISIBILITY_TEAM'">
+ <nz-select
+ [(ngModel)]="newProjectContent.team"
+ name="team"
+ nzAllowClear
+ nzPlaceHolder="Choose"
+ style="margin-top: 10px;"
+ >
<nz-option *ngFor="let team of teams" [nzValue]="team" [nzLabel]="team"></nz-option>
</nz-select>
</div>
- <label class="darkLabel" nz-radio nzValue="PROJECT_VISIBILITY_PUBLIC">Public - All authenticated users can view the
- project.</label>
+ <label class="darkLabel" nz-radio nzValue="PROJECT_VISIBILITY_PUBLIC">
+ Public - All authenticated users can view the project.
+ </label>
</nz-radio-group>
</div>
- <div *ngIf="newProjectContent.visibility==='PROJECT_VISIBILITY_TEAM'||newProjectContent.visibility==='PROJECT_VISIBILITY_PUBLIC'">
- <label class="form-label"><span class="red-star">* </span>Permission:</label>
+ <div
+ *ngIf="
+ newProjectContent.visibility === 'PROJECT_VISIBILITY_TEAM' ||
+ newProjectContent.visibility === 'PROJECT_VISIBILITY_PUBLIC'
+ "
+ >
+ <label class="form-label">
+ <span class="red-star">*</span>
+ Permission:
+ </label>
<nz-radio-group name="permission" [(ngModel)]="newProjectContent.permission">
- <label class="darkLabel" nz-radio nzValue="PROJECT_PERMISSION_VIEW">Can View - All members can view the project.</label>
- <label class="darkLabel" nz-radio nzValue="PROJECT_PERMISSION_EDIT">Can Edit - All members can edit the project.</label>
- <label class="darkLabel" nz-radio nzValue="PROJECT_PERMISSION_EXECUTE">Can Execute - All members can execute the project.</label>
+ <label class="darkLabel" nz-radio nzValue="PROJECT_PERMISSION_VIEW">
+ Can View - All members can view the project.
+ </label>
+ <label class="darkLabel" nz-radio nzValue="PROJECT_PERMISSION_EDIT">
+ Can Edit - All members can edit the project.
+ </label>
+ <label class="darkLabel" nz-radio nzValue="PROJECT_PERMISSION_EXECUTE">
+ Can Execute - All members can execute the project.
+ </label>
</nz-radio-group>
</div>
</form>
<div class="centerDiv">
- <br>
+ <br />
<button nz-button nzType="primary" [disabled]="!f.valid" (click)="current = current + 1">
Next Step
</button>
</div>
</div>
- <div style="margin:20px;" *ngSwitchCase="1">
+ <div style="margin: 20px;" *ngSwitchCase="1">
<nz-tabset [nzTabPosition]="'top'" [nzType]="'card'" [(nzSelectedIndex)]="initialState">
-
<nz-tab [nzTitle]="blank">
<div class="newBlank">
<h3 style="padding-top: 130px;">Create a blank project</h3>
</div>
</nz-tab>
- <ng-template #blank> <i nz-icon nzType="file" nzTheme="outline"></i> Blank </ng-template>
+ <ng-template #blank>
+ <i nz-icon nzType="file" nzTheme="outline"></i>
+ Blank
+ </ng-template>
- <nz-tab [nzTitle]="template">
- <nz-table
- #rowSelectionTable
- [nzPageSize]="5"
- [nzData]="Templates"
- >
+ <nz-tab [nzTitle]="template">
+ <nz-table #rowSelectionTable [nzPageSize]="5" [nzData]="Templates">
<thead>
<tr>
- <th
- [(nzChecked)]="isAllDisplayDataChecked"
- [nzIndeterminate]="isIndeterminate"
- ></th>
+ <th [(nzChecked)]="isAllDisplayDataChecked" [nzIndeterminate]="isIndeterminate"></th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of rowSelectionTable.data">
- <td
- nzShowCheckbox
- [(nzChecked)]="data.checked"
- (nzCheckedChange)="refreshCheck(data)"
- ></td>
+ <td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="refreshCheck(data)"></td>
<td>{{ data.type }}</td>
<td>{{ data.desciption }}</td>
</tr>
</tbody>
</nz-table>
</nz-tab>
- <ng-template #template> <i nz-icon nzType="database" nzTheme="outline"></i> Template </ng-template>
+ <ng-template #template>
+ <i nz-icon nzType="database" nzTheme="outline"></i>
+ Template
+ </ng-template>
<nz-tab [nzTitle]="upload">
- <div id="newUpload">
+ <div id="newUpload">
<nz-upload
nzType="drag"
[nzMultiple]="true"
[nzLimit]="0"
nzAction="https://jsonplaceholder.typicode.com/posts/"
(nzChange)="handleChange($event)"
- >
+ >
<p class="ant-upload-drag-icon">
<i nz-icon nzType="inbox"></i>
</p>
@@ -133,52 +172,68 @@
</p>
</nz-upload>
</div>
-
</nz-tab>
- <ng-template #upload> <i nz-icon nzType="to-top" nzTheme="outline"></i> Upload </ng-template>
- <nz-tab [nzTitle]="github" [nzDisabled]="true"> upload</nz-tab>
- <ng-template #github> <i nz-icon nzType="github" nzTheme="outline"></i>Git Repo </ng-template>
+ <ng-template #upload>
+ <i nz-icon nzType="to-top" nzTheme="outline"></i>
+ Upload
+ </ng-template>
+ <nz-tab [nzTitle]="github" [nzDisabled]="true">upload</nz-tab>
+ <ng-template #github>
+ <i nz-icon nzType="github" nzTheme="outline"></i>
+ Git Repo
+ </ng-template>
</nz-tabset>
<div class="centerDiv">
- <br *ngIf="initialState!==1">
+ <br *ngIf="initialState !== 1" />
<button nz-button nzType="default" (click)="current = current - 1">
Previous Step
</button>
- <button nz-button nzType="primary" [disabled]="initialState===1 && !templateType" (click)="current = current + 1">
+ <button
+ nz-button
+ nzType="primary"
+ [disabled]="initialState === 1 && !templateType"
+ (click)="current = current + 1"
+ >
Next Step
</button>
</div>
</div>
<div *ngSwitchCase="2">
- <h3 style="margin:30px;color: rgb(82, 82, 82);"><strong>Project Files</strong></h3>
- <nz-table style="margin:30px;" nzBordered #basicTable [nzData]="newProjectContent.files" [nzNoResult]="'No data record'">
- <thead>
- <tr>
- <th nzWidth="300px">Name</th>
- <th nzWidth="40px">Size(KB)</th>
- <th nzWidth="80px">Last Modified</th>
- </tr>
- </thead>
- <tbody>
- <tr *ngFor="let data of basicTable.data">
- <td>{{ data.name }}</td>
- <td>{{ data.size/1024 }}</td>
- <td>{{ data.lastModifiedDate }}</td>
- </tr>
- </tbody>
- </nz-table>
- <div class="centerDiv">
- <br>
- <button nz-button nzType="default" (click)="current = current - 1" style="margin: 3px;">
- Previous Step
- </button>
- <button nz-button nzType="primary" (click)="done()" style="margin: 3px;">
- Save
- </button>
- <button nz-button nzType="primary" (click)="openNotebook()" [disabled]="true" style="margin: 3px;">
- Open in Notebook
- </button>
- </div>
+ <h3 style="margin: 30px; color: rgb(82, 82, 82);"><strong>Project Files</strong></h3>
+ <nz-table
+ style="margin: 30px;"
+ nzBordered
+ #basicTable
+ [nzData]="newProjectContent.files"
+ [nzNoResult]="'No data record'"
+ >
+ <thead>
+ <tr>
+ <th nzWidth="300px">Name</th>
+ <th nzWidth="40px">Size(KB)</th>
+ <th nzWidth="80px">Last Modified</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let data of basicTable.data">
+ <td>{{ data.name }}</td>
+ <td>{{ data.size / 1024 }}</td>
+ <td>{{ data.lastModifiedDate }}</td>
+ </tr>
+ </tbody>
+ </nz-table>
+ <div class="centerDiv">
+ <br />
+ <button nz-button nzType="default" (click)="current = current - 1" style="margin: 3px;">
+ Previous Step
+ </button>
+ <button nz-button nzType="primary" (click)="done()" style="margin: 3px;">
+ Save
+ </button>
+ <button nz-button nzType="primary" (click)="openNotebook()" [disabled]="true" style="margin: 3px;">
+ Open in Notebook
+ </button>
+ </div>
</div>
</div>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.ts
index 39409c9..aee324a 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/new-project-page/new-project-page.component.ts
@@ -17,10 +17,10 @@
* under the License.
*/
-import { Component, OnInit, ViewChild, Output, EventEmitter, Input } from '@angular/core';
+import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core';
import { NgForm } from '@angular/forms';
+import { ProjectService, UserService } from '@submarine/services';
import { NzMessageService } from 'ng-zorro-antd';
-import { UserService, ProjectService } from '@submarine/services';
interface AddProjectParams {
name: string;
@@ -35,53 +35,57 @@ interface AddProjectParams {
messageNum: number;
}
-
@Component({
- selector: 'app-new-project-page',
+ selector: 'submarine-new-project-page',
templateUrl: './new-project-page.component.html',
styleUrls: ['./new-project-page.component.scss']
})
export class NewProjectPageComponent implements OnInit {
- @Output() closeProjectPage = new EventEmitter<boolean>();
- @Output() addProject = new EventEmitter<AddProjectParams>();
+ @Output() readonly closeProjectPage = new EventEmitter<boolean>();
+ @Output() readonly addProject = new EventEmitter<AddProjectParams>();
@ViewChild('f', { static: true }) signupForm: NgForm;
- //TODO(jasoonn): get team from API
+ // TODO(jasoonn): get team from API
teams = ['ciil'];
-
+
current = 0;
- initialState=0;
-
- templateType="Python";
+ initialState = 0;
+
+ templateType = 'Python';
username = '';
-
- newProjectContent = { projectName: '', description: '', visibility: 'Private', team: '' ,permission: 'View', files: []};
+ newProjectContent = {
+ projectName: '',
+ description: '',
+ visibility: 'Private',
+ team: '',
+ permission: 'View',
+ files: []
+ };
Templates = [
- {type:'Python', description: 'Python Template', checked: true},
- {type:'R', description: 'R Template', checked: false},
- {type:'Spark', description: 'Spark Template', checked: false},
- {type:'Tensorflow', description: 'Tensorflow Template', checked: false},
- {type:'Pytorch', description: 'Pytorch Template', checked: false},
+ { type: 'Python', description: 'Python Template', checked: true },
+ { type: 'R', description: 'R Template', checked: false },
+ { type: 'Spark', description: 'Spark Template', checked: false },
+ { type: 'TensorFlow', description: 'TensorFlow Template', checked: false },
+ { type: 'PyTorch', description: 'PyTorch Template', checked: false }
];
-
constructor(
private msg: NzMessageService,
private projectService: ProjectService,
private userService: UserService
- ) { }
+ ) {}
ngOnInit() {
this.userService.fetchUserInfo().subscribe((data) => {
this.username = data.username;
- })
+ });
}
handleChange({ file, fileList }): void {
const status = file.status;
if (status !== 'uploading') {
console.log(file, fileList);
- console.log(this.newProjectContent.files)
+ console.log(this.newProjectContent.files);
}
if (status === 'done') {
this.msg.success(`${file.name} file uploaded successfully.`);
@@ -91,24 +95,25 @@ export class NewProjectPageComponent implements OnInit {
}
}
-
- clearProject(){
+ clearProject() {
this.closeProjectPage.emit(true);
}
- refreshCheck(template){
- if (template.checked === true){
- this.Templates.forEach(function(item, index, array){
- if (item.type !== template.type) array[index].checked = false;
+ refreshCheck(template) {
+ if (template.checked === true) {
+ this.Templates.forEach(function (item, index, array) {
+ if (item.type !== template.type) {
+ array[index].checked = false;
+ }
});
this.templateType = template.type;
+ } else {
+ this.templateType = '';
}
- else this.templateType = "";
-
}
- done(): void{
- var project = {
+ done(): void {
+ let project = {
name: this.newProjectContent.projectName,
userName: this.username,
description: this.newProjectContent.description,
@@ -119,13 +124,11 @@ export class NewProjectPageComponent implements OnInit {
starNum: 0,
likeNum: 0,
messageNum: 0
- }
- console.log(project)
+ };
+ console.log(project);
this.addProject.emit(project);
}
- //TODO(jasoonn): open in notebook
- openNotebook() {
- ;
- }
+ // TODO(jasoonn): open in notebook
+ openNotebook() {}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.html
index 58b4d88..0ff929c 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.html
@@ -17,64 +17,94 @@
~ under the License.
-->
-<br>
-<nz-spin *ngIf="!newProject && isLoading" style="height: 50px;">
-</nz-spin>
+<br />
+<nz-spin *ngIf="!newProject && isLoading" style="height: 50px;"></nz-spin>
<div *ngIf="!newProject && !isLoading">
- <div id="addProjectbtn">
- <button nz-button nzBlock (click)="newProject=true">+ Add New Project</button>
- </div>
- <div id="projectTagDiv">
- <div nz-row [nzGutter]="12" nzType="flex" nzJustify="start">
- <div *ngFor="let project of existProjects" nz-col [nzSpan]="8" id="projectDiv">
- <nz-card [nzTitle]="project.projectName" [nzActions]="[actionEdit, actionDownload, actionSetting, actionDelete]">
- <nz-tag *ngFor="let tag of project.tags" [nzMode]="'closeable'" (nzAfterClose)="handleCloseTag(project, tag)">{{ tag }}</nz-tag>
- <nz-tag *ngIf="!project.inputTagVisibility" class="editable-tag" nzNoAnimation (click)="showInput(project)">
- <i nz-icon nzType="plus"></i> New Tag
- </nz-tag>
- <input
- #inputElement
- nz-input
- nzSize="small"
- *ngIf="project.inputTagVisibility"
- type="text"
- [(ngModel)]="project.projectInputTag"
- id="projectInputTag"
- (blur)="handleInputConfirm(project)"
- (keydown.enter)="handleInputConfirm(project)"
- />
- <div>
- <br>
- {{ project.description}}
- <br>
- <br>
- <label>
- <i nz-icon nzType="star" nzTheme="outline"></i> {{ project.starNum }} |
- <i nz-icon nzType="like" nzTheme="outline"></i> {{ project.likeNum }} |
- <i nz-icon nzType="message" nzTheme="outline"></i> {{ project.msgNum }}
- </label>
- </div>
-
- <ng-template #actionEdit>
- <i nz-icon nzType="edit"></i>Edit
- </ng-template>
- <ng-template #actionDownload>
- <i nz-icon nzType="download"></i>Download
- </ng-template>
- <ng-template #actionSetting>
- <i nz-icon nzType="setting"></i>Setting
- </ng-template>
- <ng-template #actionDelete>
- <i nz-icon nzType="delete"></i>Delete
- </ng-template>
- </nz-card>
+ <div id="addProjectbtn">
+ <button nz-button nzBlock (click)="newProject = true">+ Add New Project</button>
+ </div>
+ <div id="projectTagDiv">
+ <div nz-row [nzGutter]="12" nzType="flex" nzJustify="start">
+ <div *ngFor="let project of existProjects" nz-col [nzSpan]="8" id="projectDiv">
+ <nz-card
+ [nzTitle]="project.projectName"
+ [nzActions]="[actionEdit, actionDownload, actionSetting, actionDelete]"
+ >
+ <nz-tag *ngFor="let tag of project.tags" [nzMode]="'closeable'" (nzAfterClose)="handleCloseTag(project, tag)">
+ {{ tag }}
+ </nz-tag>
+ <nz-tag *ngIf="!project.inputTagVisibility" class="editable-tag" nzNoAnimation (click)="showInput(project)">
+ <i nz-icon nzType="plus"></i>
+ New Tag
+ </nz-tag>
+ <input
+ #inputElement
+ nz-input
+ nzSize="small"
+ *ngIf="project.inputTagVisibility"
+ type="text"
+ [(ngModel)]="project.projectInputTag"
+ id="projectInputTag"
+ (blur)="handleInputConfirm(project)"
+ (keydown.enter)="handleInputConfirm(project)"
+ />
+ <div>
+ <br />
+ {{ project.description }}
+ <br />
+ <br />
+ <label>
+ <i nz-icon nzType="star" nzTheme="outline"></i>
+ {{ project.starNum }} |
+ <i nz-icon nzType="like" nzTheme="outline"></i>
+ {{ project.likeNum }} |
+ <i nz-icon nzType="message" nzTheme="outline"></i>
+ {{ project.msgNum }}
+ </label>
</div>
- </div>
+
+ <ng-template #actionEdit>
+ <i nz-icon nzType="edit"></i>
+ Edit
+ </ng-template>
+ <ng-template #actionDownload>
+ <i nz-icon nzType="download"></i>
+ Download
+ </ng-template>
+ <ng-template #actionSetting>
+ <i nz-icon nzType="setting"></i>
+ Setting
+ </ng-template>
+ <ng-template #actionDelete>
+ <i nz-icon nzType="delete"></i>
+ Delete
+ </ng-template>
+ </nz-card>
+ </div>
+ <nz-card>
+ <ng-template #actionEdit>
+ <i nz-icon nzType="edit"></i>
+ Edit
+ </ng-template>
+ <ng-template #actionDownload>
+ <i nz-icon nzType="download"></i>
+ Download
+ </ng-template>
+ <ng-template #actionSetting>
+ <i nz-icon nzType="setting"></i>
+ Setting
+ </ng-template>
+ <ng-template #actionDelete>
+ <i nz-icon nzType="delete"></i>
+ Delete
+ </ng-template>
+ </nz-card>
</div>
+ </div>
</div>
<div *ngIf="newProject" id="projectNewDivOuter">
- <div id="projectNewDivInner">
- <app-new-project-page (addProject)="addProject($event)"></app-new-project-page>
- <!-- <app-new-project-page (closeProjectPage)="newProject=false;"></app-new-project-page> -->
- </div>
+ <div id="projectNewDivInner">
+ <submarine-new-project-page (addProject)="addProject($event)"></submarine-new-project-page>
+ <!-- <app-new-project-page (closeProjectPage)="newProject=false;"></app-new-project-page> -->
+ </div>
</div>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.ts
index 6788c29..b9c9246 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/project/project.component.ts
@@ -17,15 +17,15 @@
* under the License.
*/
-import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
-import { UserService, ProjectService } from '@submarine/services';
+import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { UserInfo } from '@submarine/interfaces';
+import { ProjectService, UserService } from '@submarine/services';
import { NzNotificationService } from 'ng-zorro-antd';
-import { tap } from 'rxjs/operators';
import { Observable } from 'rxjs';
+import { tap } from 'rxjs/operators';
@Component({
- selector: 'app-project',
+ selector: 'submarine-project',
templateUrl: './project.component.html',
styleUrls: ['./project.component.scss']
})
@@ -41,79 +41,82 @@ export class ProjectComponent implements OnInit {
private projectService: ProjectService,
private userService: UserService,
private nzNotificationService: NzNotificationService
- ) {
-
- }
+ ) {}
- //TODO(jasoonn): get projects data from server
+ // TODO(jasoonn): get projects data from server
async ngOnInit() {
- await this.userService.fetchUserInfo().toPromise().then(data => {
- this.username = data.username;
- });
- //TODO(chiajoukuo): add pagination
- var params = {
+ await this.userService
+ .fetchUserInfo()
+ .toPromise()
+ .then((data) => {
+ this.username = data.username;
+ });
+ // TODO(chiajoukuo): add pagination
+ let params = {
userName: this.username,
column: 'update_time',
order: 'desc',
- pageNo: ''+1,//this.pagination.current,
- pageSize: ''+99//this.pagination.pageSize
- }
- var res;
- this.projectService.fetchProjectList(params)
- .subscribe(
+ pageNo: '' + 1, // this.pagination.current,
+ pageSize: '' + 99 // this.pagination.pageSize
+ };
+ let res;
+ this.projectService.fetchProjectList(params).subscribe(
(data) => {
- res = data['records']
- for(var i=0; i<res.length; i++){
+ res = data.records;
+ for (let i = 0; i < res.length; i++) {
this.existProjects.push({
- projectName: res[i].name,
- description: res[i].description,
- tags: res[i].tags ===null?[]:res[i].tags, //['12', 'Tag 2']
- inputTagVisibility: false,
- projectInputTag: '',
- starNum: res[i].starNum,
- likeNum: res[i].likeNum,
+ projectName: res[i].name,
+ description: res[i].description,
+ tags: res[i].tags === null ? [] : res[i].tags, // ['12', 'Tag 2']
+ inputTagVisibility: false,
+ projectInputTag: '',
+ starNum: res[i].starNum,
+ likeNum: res[i].likeNum,
msgNum: res[i].messageNum
- })
+ });
}
},
- error => {
- console.log("ERROR", error)
+ (error) => {
+ console.log('ERROR', error);
}
);
-
}
- addProject(event){
+ addProject(event) {
this.existProjects.push({
- projectName: event.name,
- description: event.description,
+ projectName: event.name,
+ description: event.description,
tags: [],
- inputTagVisibility: false,
- projectInputTag: '',
- starNum: 0,
- likeNum: 0,
+ inputTagVisibility: false,
+ projectInputTag: '',
+ starNum: 0,
+ likeNum: 0,
msgNum: 0
- })
-
- this.projectService.addProject(event).subscribe(() => {
- }, err => {
- console.log("ERROR", err)
});
+
+ this.projectService.addProject(event).subscribe(
+ () => {},
+ (err) => {
+ console.log('ERROR', err);
+ }
+ );
this.newProject = false;
- console.log("proj", event);
+ console.log('proj', event);
}
-
- //TODO(jasoonn): Update tag in server
- handleCloseTag(project, tag){
- project.tags = project.tags.filter(itag => itag!==tag);
+ // TODO(jasoonn): Update tag in server
+ handleCloseTag(project, tag) {
+ project.tags = project.tags.filter((itag) => itag !== tag);
console.log(project);
console.log(tag);
}
- //TODO(jasoonn): update tag in server
+ // TODO(jasoonn): update tag in server
handleInputConfirm(project): void {
console.log(project.tags);
- if (project.projectInputTag && (project.tags == null || (project.tags != null && project.tags.indexOf(project.projectInputTag)=== -1))) {
+ if (
+ project.projectInputTag &&
+ (project.tags == null || (project.tags != null && project.tags.indexOf(project.projectInputTag) === -1))
+ ) {
console.log(project);
project.tags = [...project.tags, project.projectInputTag];
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.html
index e8ffded..67d0a8e 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.html
@@ -17,33 +17,33 @@
~ under the License.
-->
-<nz-input-group id="releaseTextInput" [nzSuffix]="suffixIconSearch">
- <input type="text" nz-input placeholder="input search text" />
+<nz-input-group id="releaseTextInput" [nzSuffix]="suffixIconSearch">
+ <input type="text" nz-input placeholder="input search text" />
</nz-input-group>
<ng-template #suffixIconSearch>
- <i nz-icon nzType="search"></i>
+ <i nz-icon nzType="search"></i>
</ng-template>
<nz-spin [nzSpinning]="isSpinning">
- <nz-table id="releaseTable" nzBordered #basicTable [nzData]="dataSet" [nzNoResult]="'No data'">
- <thead>
- <tr>
- <th nzWidth="60px">Name</th>
- <th nzWidth="60px">Owner</th>
- <th nzWidth="60px">Status</th>
- <th nzWidth="60px">Commit Info</th>
- <th nzWidth="60px">LastUpdated</th>
- <th nzWidth="60px">Action</th>
- </tr>
- </thead>
- <tbody>
- <tr *ngFor="let data of basicTable.data">
- <td>{{ data.name }}</td>
- <td>{{ data.owner }}</td>
- <td>{{ data.status }}</td>
- <td>{{ data.commitInfo }}</td>
- <td>{{ data.time }}</td>
- <td>{{ data.action }}</td>
- </tr>
- </tbody>
- </nz-table>
+ <nz-table id="releaseTable" nzBordered #basicTable [nzData]="dataSet" [nzNoResult]="'No data'">
+ <thead>
+ <tr>
+ <th nzWidth="60px">Name</th>
+ <th nzWidth="60px">Owner</th>
+ <th nzWidth="60px">Status</th>
+ <th nzWidth="60px">Commit Info</th>
+ <th nzWidth="60px">LastUpdated</th>
+ <th nzWidth="60px">Action</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let data of basicTable.data">
+ <td>{{ data.name }}</td>
+ <td>{{ data.owner }}</td>
+ <td>{{ data.status }}</td>
+ <td>{{ data.commitInfo }}</td>
+ <td>{{ data.time }}</td>
+ <td>{{ data.action }}</td>
+ </tr>
+ </tbody>
+ </nz-table>
</nz-spin>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.ts
index 93c64be..7465132 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/release/release.component.ts
@@ -20,16 +20,14 @@
import { Component, OnInit } from '@angular/core';
@Component({
- selector: 'app-release',
+ selector: 'submarine-release',
templateUrl: './release.component.html',
styleUrls: ['./release.component.scss']
})
export class ReleaseComponent implements OnInit {
isSpinning = true;
dataSet = [];
- constructor() { }
-
- ngOnInit() {
- }
+ constructor() {}
+ ngOnInit() {}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.html
index 65c62e2..7372c2c 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.html
@@ -17,33 +17,33 @@
~ under the License.
-->
-<nz-input-group id="sharedSearchInput" [nzSuffix]="suffixIconSearch">
- <input type="text" nz-input placeholder="input search text" />
+<nz-input-group id="sharedSearchInput" [nzSuffix]="suffixIconSearch">
+ <input type="text" nz-input placeholder="input search text" />
</nz-input-group>
<ng-template #suffixIconSearch>
- <i nz-icon nzType="search"></i>
+ <i nz-icon nzType="search"></i>
</ng-template>
<nz-spin [nzSpinning]="isSpinning">
- <nz-table id='sharedTable' nzBordered #basicTable [nzData]="dataSet" [nzNoResult]="'No data'">
- <thead>
- <tr>
- <th nzWidth="60px">Name</th>
- <th nzWidth="60px">Owner</th>
- <th nzWidth="60px">Status</th>
- <th nzWidth="60px">Commit Info</th>
- <th nzWidth="60px">LastUpdated</th>
- <th nzWidth="60px">Action</th>
- </tr>
- </thead>
- <tbody>
- <tr *ngFor="let data of basicTable.data">
- <td>{{ data.name }}</td>
- <td>{{ data.owner }}</td>
- <td>{{ data.status }}</td>
- <td>{{ data.commitInfo }}</td>
- <td>{{ data.time }}</td>
- <td>{{ data.action }}</td>
- </tr>
- </tbody>
- </nz-table>
+ <nz-table id="sharedTable" nzBordered #basicTable [nzData]="dataSet" [nzNoResult]="'No data'">
+ <thead>
+ <tr>
+ <th nzWidth="60px">Name</th>
+ <th nzWidth="60px">Owner</th>
+ <th nzWidth="60px">Status</th>
+ <th nzWidth="60px">Commit Info</th>
+ <th nzWidth="60px">LastUpdated</th>
+ <th nzWidth="60px">Action</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr *ngFor="let data of basicTable.data">
+ <td>{{ data.name }}</td>
+ <td>{{ data.owner }}</td>
+ <td>{{ data.status }}</td>
+ <td>{{ data.commitInfo }}</td>
+ <td>{{ data.time }}</td>
+ <td>{{ data.action }}</td>
+ </tr>
+ </tbody>
+ </nz-table>
</nz-spin>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.ts
index 1ac3172..77121c8 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/shared/shared.component.ts
@@ -19,17 +19,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
- selector: 'app-shared',
+ selector: 'submarine-shared',
templateUrl: './shared.component.html',
styleUrls: ['./shared.component.scss']
})
export class SharedComponent implements OnInit {
isSpinning = true;
dataSet = [];
-
- constructor() { }
- ngOnInit() {
- }
+ constructor() {}
+ ngOnInit() {}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.html
index 8f9be94..0f976a2 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.html
@@ -20,20 +20,20 @@
<!--Team Home-->
<div id="teamDiv">
<div align="right">
- <button nz-button id="btnAddTeam" nzType="primary" style="margin: 10px" (click)="addTeam()">
+ <button nz-button id="btnAddTeam" nzType="primary" style="margin: 10px;" (click)="addTeam()">
<i nz-icon nzType="plus"></i>
- Add Team
+ Add Team
</button>
</div>
<div>
<nz-table #teamListTable [nzData]="teamList" nzNoResult="No result">
<thead>
- <tr>
- <th>Name</th>
- <th>Owner</th>
- <th>Created Time</th>
- <th>Action</th>
- </tr>
+ <tr>
+ <th>Name</th>
+ <th>Owner</th>
+ <th>Created Time</th>
+ <th>Action</th>
+ </tr>
</thead>
<tbody>
<tr *ngFor="let team of teamListTable.data">
@@ -45,7 +45,8 @@
<nz-divider nzType="vertical"></nz-divider>
<a>Enter</a>
<nz-divider nzType="vertical"></nz-divider>
- <a (click)="deleteTeam(team)">Delete</a></td>
+ <a (click)="deleteTeam(team)">Delete</a>
+ </td>
</tr>
</tbody>
</nz-table>
@@ -59,52 +60,54 @@
[nzWidth]="540"
(nzOnClose)="closeDrawer()"
[nzVisible]="drawerVisible"
- [nzBodyStyle]="{ height: 'calc(100% - 55px)', overflow: 'auto', 'padding-bottom': '53px' }">
+ [nzBodyStyle]="{ height: 'calc(100% - 55px)', overflow: 'auto', 'padding-bottom': '53px' }"
+>
<!--Add Form-->
- <form
- nz-form
- [formGroup]="newTeamForm"
- nzLayout="horizontal"
- >
+ <form nz-form [formGroup]="newTeamForm" nzLayout="horizontal">
<nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>Team Name</nz-form-label>
- <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="formTeamNameErrMesg">
- <input nz-input id="inputNewTeamName" placeholder="Please input team name" formControlName="teamName"/>
- </nz-form-control>
+ <nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="formTeamNameErrMesg">
+ <input nz-input id="inputNewTeamName" placeholder="Please input team name" formControlName="teamName" />
+ </nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>Owner</nz-form-label>
- <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="This is required!">
- <input nz-input id="inputNewTeamOwner" type="text" placeholder="Please input owner" formControlName="owner"/>
- </nz-form-control>
+ <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="This is required!">
+ <input nz-input id="inputNewTeamOwner" type="text" placeholder="Please input owner" formControlName="owner" />
+ </nz-form-control>
</nz-form-item>
</form>
<div align="right">
- <button
- nz-button
- nzType="default"
- (click)="drawerVisible=flase;"
- style="margin-right: 8px;">Cancel</button>
- <button
- nz-button
+ <button nz-button nzType="default" (click)="drawerVisible = flase" style="margin-right: 8px;">Cancel</button>
+ <button
+ nz-button
id="submitNewTeamBtn"
- nzType="primary"
- [nzLoading] = "submitBtnIsLoading"
- (click)="submitNewTeam()"
+ nzType="primary"
+ [nzLoading]="submitBtnIsLoading"
+ (click)="submitNewTeam()"
style="margin-right: 8px;"
- [disabled] = "!newTeamForm.get('teamName').valid || !newTeamForm.get('owner').valid">Create</button>
+ [disabled]="!newTeamForm.get('teamName').valid || !newTeamForm.get('owner').valid"
+ >
+ Create
+ </button>
</div>
</nz-drawer>
<!--Detail-->
-<nz-modal [nzVisible]="overviewModalVisible" [nzWidth]="540" nzTitle="Overview" (nzOnCancel)="handleCancel()" (nzOnOk)="handleOk()">
+<nz-modal
+ [nzVisible]="overviewModalVisible"
+ [nzWidth]="540"
+ nzTitle="Overview"
+ (nzOnCancel)="handleCancel()"
+ (nzOnOk)="handleOk()"
+>
<h2>Team Name:</h2>
<p>{{ currentTeam_teamName }}</p>
<h2>ID:</h2>
- <p>{{ currentTeam_id }}</p>
+ <p>{{ currentTeam_id }}</p>
<h2>Owner:</h2>
- <p>{{ currentTeam_owner }}</p>
+ <p>{{ currentTeam_owner }}</p>
<h2>Create Time</h2>
- <p>{{ currentTeam_createTime }}</p>
+ <p>{{ currentTeam_createTime }}</p>
</nz-modal>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.ts
index fa359db..4605341 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/team/team.component.ts
@@ -18,82 +18,86 @@
*/
import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormControl, Validators, ValidationErrors } from '@angular/forms';
+import { FormControl, FormGroup, ValidationErrors, Validators } from '@angular/forms';
import { SysTeam } from '@submarine/interfaces';
import { TeamService } from '@submarine/services';
import { NzMessageService } from 'ng-zorro-antd';
-
-
@Component({
- selector: 'app-team',
+ selector: 'submarine-team',
templateUrl: './team.component.html',
styleUrls: ['./team.component.scss']
})
export class TeamComponent implements OnInit {
column: string = 'createdTime';
order: string = 'description';
- teamName: string = "";
+ teamName: string = '';
teamList: SysTeam[] = [];
- //Form
- newTeamForm: FormGroup; //For Adding Form
- formTeamNameErrMesg = "";
+ // Form
+ newTeamForm: FormGroup; // For Adding Form
+ formTeamNameErrMesg = '';
- //Drawer
+ // Drawer
drawerVisible = false;
submitBtnIsLoading = false;
- //Modal
+ // Modal
overviewModalVisible = false;
currentTeam_teamName: string;
currentTeam_id: string;
currentTeam_owner: string;
currentTeam_createTime: string;
- constructor(
- private teamService: TeamService,
- private nzMessageService: NzMessageService,
- ) { }
+ constructor(private teamService: TeamService, private nzMessageService: NzMessageService) {}
ngOnInit() {
this.newTeamForm = new FormGroup({
- 'teamName': new FormControl(null, [Validators.required, this.teamNameRequired.bind(this)], this.teamNameCheck.bind(this)),
- 'owner': new FormControl(null, Validators.required)
+ teamName: new FormControl(
+ null,
+ [Validators.required, this.teamNameRequired.bind(this)],
+ this.teamNameCheck.bind(this)
+ ),
+ owner: new FormControl(null, Validators.required)
});
this.getTeamList();
-
}
-
+
getTeamList() {
- this.teamService.getTeamList({
- column: this.column,
- order: this.order,
- teamName: this.teamName,
- }).subscribe(({ records }) => {
- this.teamList = records;
- console.log(records);
- })
+ this.teamService
+ .getTeamList({
+ column: this.column,
+ order: this.order,
+ teamName: this.teamName
+ })
+ .subscribe(({ records }) => {
+ this.teamList = records;
+ console.log(records);
+ });
}
submitNewTeam() {
this.submitBtnIsLoading = true;
- this.teamService.createTeam({
- teamName: this.newTeamForm.get('teamName').value,
- owner: this.newTeamForm.get('owner').value,
- createBy: this.newTeamForm.get('owner').value
- }).subscribe(
- () => {
- this.nzMessageService.success('Create team success!');
- this.getTeamList();
- this.drawerVisible = false ;
- this.submitBtnIsLoading = false ;
- this.newTeamForm.reset();
- }, err => {
- this.nzMessageService.error(err.message);
- this.submitBtnIsLoading = false ;
- })
+ this.teamService
+ .createTeam({
+ teamName: this.newTeamForm.get('teamName').value,
+ owner: this.newTeamForm.get('owner').value,
+ createBy: this.newTeamForm.get('owner').value
+ })
+ .subscribe(
+ () => {
+ this.nzMessageService.success('Create team success!');
+ this.getTeamList();
+ this.drawerVisible = false;
+ this.submitBtnIsLoading = false;
+ this.newTeamForm.reset();
+ },
+ (err) => {
+ this.nzMessageService.error(err.message);
+ this.submitBtnIsLoading = false;
+ }
+ );
}
deleteTeam(teamData: SysTeam) {
@@ -101,59 +105,59 @@ export class TeamComponent implements OnInit {
() => {
this.nzMessageService.success('Delete team success!');
this.getTeamList();
- }
- , err => {
+ },
+ (err) => {
this.nzMessageService.error(err.message);
}
- )
+ );
}
closeDrawer() {
- this.drawerVisible = false ;
- this.newTeamForm.reset({
- });
+ this.drawerVisible = false;
+ this.newTeamForm.reset({});
}
- addTeam(){
- this.drawerVisible = true ;
+ addTeam() {
+ this.drawerVisible = true;
}
- teamNameRequired(check: FormControl): {[key: string]:any}|null{
- if (check.value === "") {
- var errorMessage = "Please enter new team name!";
+ teamNameRequired(check: FormControl): { [key: string]: any } | null {
+ if (check.value === '') {
+ const errorMessage = 'Please enter new team name!';
this.formTeamNameErrMesg = errorMessage;
- return {mesg: true}
- }
- else {
- this.formTeamNameErrMesg = "";
+ return { mesg: true };
+ } else {
+ this.formTeamNameErrMesg = '';
return null;
}
}
- teamNameCheck(check: FormControl): Promise<ValidationErrors|null>{
- var params = {
+ teamNameCheck(check: FormControl): Promise<ValidationErrors | null> {
+ const params = {
tableName: 'team',
fieldName: 'team_name',
fieldVal: check.value
- }
+ };
const promise = new Promise((resolve, reject) => {
- this.teamService.newTeamNameCheck(params).then((success) => {
- if (success) {
- resolve(null);
- }
- else {
- this.formTeamNameErrMesg = "This value already exists is not available!";
- resolve({"Duplicate Name": true});
+ this.teamService.newTeamNameCheck(params).then(
+ (success) => {
+ if (success) {
+ resolve(null);
+ } else {
+ this.formTeamNameErrMesg = 'This value already exists is not available!';
+ resolve({ 'Duplicate Name': true });
+ }
+ },
+ (err) => {
+ reject(err);
}
- },(err)=>{
- reject(err);
- });
+ );
});
return promise;
}
showOverview(team) {
- this.overviewModalVisible = true ;
+ this.overviewModalVisible = true;
this.currentTeam_teamName = team.teamName;
this.currentTeam_id = team.id;
this.currentTeam_owner = team.owner;
@@ -161,10 +165,10 @@ export class TeamComponent implements OnInit {
}
handleOk() {
- this.overviewModalVisible = false ;
+ this.overviewModalVisible = false;
}
handleCancel() {
- this.overviewModalVisible = false ;
+ this.overviewModalVisible = false;
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.html
index cedfac5..57d201a 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.html
@@ -18,39 +18,57 @@
-->
<div id="trainingDiv">
- <h3 class="leaveBothMargin">
- Category:
- <button *ngFor="let category of categories" nz-button [nzType]="category.enable ? 'primary' : 'default'" [nzSize]="'small'" (click)="category.enable = ! category.enable" class="leaveMargin">
- {{ category.name }}
- </button>
- </h3>
- <hr class="horizontal_dotted_line"/>
- <h3 class="leaveBothMargin">
- Owner:
- <nz-select [(ngModel)]="tagValue" [nzSize]="size" nzMode="tags" nzPlaceHolder="Please select" id="trainingSearchTag">
- <nz-option *ngFor="let option of listOfOption" [nzLabel]="option.label" [nzValue]="option.value"></nz-option>
- </nz-select>
- <button nz-button [nzType]="ownProcess ? 'primary' : 'default'" [nzSize]="'default'" class="leaveMargin" (click)="ownProcess=!ownProcess">
- Myself
- </button>
- </h3>
-
- <hr class="horizontal_dotted_line"/>
- <h3 class="leaveBothMargin">
- Others:
- <label class="othersLabel">Active user:</label>
- <nz-select [(ngModel)]="userSelectedValue" nzPlaceHolder="Choose" class="leaveMargin">
- <nz-option nzValue="noLimit" nzLabel="No restriction"></nz-option>
- <nz-option *ngFor="let activeUser of activeUsers" [nzValue]="activeUser" [nzLabel]="activeUser"></nz-option>
- </nz-select>
- <label class="othersLabel">Rating:</label>
- <nz-select [(ngModel)]="ratingSelectedValue" nzPlaceHolder="Choose" class="leaveMargin">
- <nz-option nzValue="noLimit" nzLabel="No restriction"></nz-option>
- <nz-option *ngFor="let rating of ratings" [nzValue]="rating" [nzLabel]="rating"></nz-option>
- </nz-select>
- </h3>
+ <h3 class="leaveBothMargin">
+ Category:
+ <button
+ *ngFor="let category of categories"
+ nz-button
+ [nzType]="category.enable ? 'primary' : 'default'"
+ [nzSize]="'small'"
+ (click)="category.enable = !category.enable"
+ class="leaveMargin"
+ >
+ {{ category.name }}
+ </button>
+ </h3>
+ <hr class="horizontal_dotted_line" />
+ <h3 class="leaveBothMargin">
+ Owner:
+ <nz-select
+ [(ngModel)]="tagValue"
+ [nzSize]="size"
+ nzMode="tags"
+ nzPlaceHolder="Please select"
+ id="trainingSearchTag"
+ >
+ <nz-option *ngFor="let option of listOfOption" [nzLabel]="option.label" [nzValue]="option.value"></nz-option>
+ </nz-select>
+ <button
+ nz-button
+ [nzType]="ownProcess ? 'primary' : 'default'"
+ [nzSize]="'default'"
+ class="leaveMargin"
+ (click)="ownProcess = !ownProcess"
+ >
+ Myself
+ </button>
+ </h3>
+
+ <hr class="horizontal_dotted_line" />
+ <h3 class="leaveBothMargin">
+ Others:
+ <label class="othersLabel">Active user:</label>
+ <nz-select [(ngModel)]="userSelectedValue" nzPlaceHolder="Choose" class="leaveMargin">
+ <nz-option nzValue="noLimit" nzLabel="No restriction"></nz-option>
+ <nz-option *ngFor="let activeUser of activeUsers" [nzValue]="activeUser" [nzLabel]="activeUser"></nz-option>
+ </nz-select>
+ <label class="othersLabel">Rating:</label>
+ <nz-select [(ngModel)]="ratingSelectedValue" nzPlaceHolder="Choose" class="leaveMargin">
+ <nz-option nzValue="noLimit" nzLabel="No restriction"></nz-option>
+ <nz-option *ngFor="let rating of ratings" [nzValue]="rating" [nzLabel]="rating"></nz-option>
+ </nz-select>
+ </h3>
</div>
<div id="spanningDiv">
- <nz-spin [nzSpinning]="isSpinning">
- </nz-spin>
+ <nz-spin [nzSpinning]="isSpinning"></nz-spin>
</div>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.ts
index 1aeec39..b2bc3f9 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/training/training.component.ts
@@ -20,36 +20,33 @@
import { Component, OnInit } from '@angular/core';
@Component({
- selector: 'app-training',
+ selector: 'submarine-training',
templateUrl: './training.component.html',
styleUrls: ['./training.component.scss']
})
export class TrainingComponent implements OnInit {
isSpinning = true;
- constructor() { }
+ constructor() {}
categories = [
- {name: "Category1", enable:false},
- {name: "Category2", enable:false},
- {name: "Category3", enable:false},
- {name: "Category4", enable:false},
- {name: "Category5", enable:false},
- {name: "Category6", enable:false},
- {name: "Category7", enable:false}
+ { name: 'Category1', enable: false },
+ { name: 'Category2', enable: false },
+ { name: 'Category3', enable: false },
+ { name: 'Category4', enable: false },
+ { name: 'Category5', enable: false },
+ { name: 'Category6', enable: false },
+ { name: 'Category7', enable: false }
];
ownProcess = false;
tagValue = ['a10', 'c12', 'tag'];
userSelectedValue = 'noLimit';
- ratingSelectedValue = 'noLimit'
- activeUsers = ["John", "Jason"];
- ratings = ["Execellent", "Good", "Moderate"];
-
- ngOnInit() {
-
- }
+ ratingSelectedValue = 'noLimit';
+ activeUsers = ['John', 'Jason'];
+ ratings = ['Execellent', 'Good', 'Moderate'];
- performChange(){
- console.log('cool')
- }
+ ngOnInit() {}
+ performChange() {
+ console.log('cool');
+ }
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.html
index 0bc90c7..c68d8a5 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.html
@@ -25,35 +25,28 @@
</nz-breadcrumb-item>
<nz-breadcrumb-item>Workspace</nz-breadcrumb-item>
</nz-breadcrumb>
- <br/>
+ <br />
<h2>Project</h2>
- <nz-content>You can click on the project tree directory on the left and the project file list will be displayed on the right.</nz-content>
- <br/>
+ <nz-content>
+ You can click on the project tree directory on the left and the project file list will be displayed on the
+ right.
+ </nz-content>
+ <br />
<ul nz-menu nzMode="horizontal">
- <li nz-menu-item nzSelected (click)="switchState('project')">
- Project({{basicInfo.project}})
- </li>
- <li nz-menu-item (click)="switchState('release')">
- Release({{basicInfo.release}})
- </li>
- <li nz-menu-item (click)="switchState('training')">
- Training({{basicInfo.training}})
- </li>
- <li nz-menu-item (click)="switchState('team')">
- Team({{basicInfo.team}})
- </li>
- <li nz-menu-item (click)="switchState('shared')">
- Shared({{basicInfo.shared}})
- </li>
+ <li nz-menu-item nzSelected (click)="switchState('project')">Project({{ basicInfo.project }})</li>
+ <li nz-menu-item (click)="switchState('release')">Release({{ basicInfo.release }})</li>
+ <li nz-menu-item (click)="switchState('training')">Training({{ basicInfo.training }})</li>
+ <li nz-menu-item (click)="switchState('team')">Team({{ basicInfo.team }})</li>
+ <li nz-menu-item (click)="switchState('shared')">Shared({{ basicInfo.shared }})</li>
</ul>
</div>
-
+
<div [ngSwitch]="currentState">
- <app-project *ngSwitchCase="'project'"></app-project>
- <app-release *ngSwitchCase="'release'"></app-release>
- <app-training *ngSwitchCase="'training'"></app-training>
- <app-team *ngSwitchCase="'team'"></app-team>
- <app-shared *ngSwitchCase="'shared'"></app-shared>
+ <submarine-project *ngSwitchCase="'project'"></submarine-project>
+ <submarine-release *ngSwitchCase="'release'"></submarine-release>
+ <submarine-training *ngSwitchCase="'training'"></submarine-training>
+ <submarine-team *ngSwitchCase="'team'"></submarine-team>
+ <submarine-shared *ngSwitchCase="'shared'"></submarine-shared>
</div>
</nz-layout>
</nz-layout>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.ts
index 66c3fe8..49353a1 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.component.ts
@@ -24,7 +24,7 @@ import { Component, OnInit, ViewChild } from '@angular/core';
styleUrls: ['./workspace.component.scss']
})
export class WorkspaceComponent implements OnInit {
- @ViewChild('project', {static: true}) signupForm: any;
+ @ViewChild('project', { static: true }) signupForm: any;
basicInfo = {
project: 3,
@@ -36,13 +36,11 @@ export class WorkspaceComponent implements OnInit {
currentState = 'project';
- constructor() { }
+ constructor() {}
- ngOnInit() {
- }
+ ngOnInit() {}
- switchState(state: string){
+ switchState(state: string) {
this.currentState = state;
}
-
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.module.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.module.ts
index ad73361..96ef55c 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.module.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/workspace/workspace.module.ts
@@ -19,7 +19,7 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
-import { FormsModule , ReactiveFormsModule } from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ComponentsModule } from '@submarine/components/components.module';
import { NgZorroAntdModule } from 'ng-zorro-antd';
import { NewProjectPageComponent } from './project/new-project-page/new-project-page.component';
@@ -30,29 +30,22 @@ import { TeamComponent } from './team/team.component';
import { TrainingComponent } from './training/training.component';
@NgModule({
- declarations: [
- ProjectComponent,
- ReleaseComponent,
- TrainingComponent,
- TeamComponent,
- SharedComponent,
- NewProjectPageComponent,
- ],
- imports: [
- CommonModule,
- ComponentsModule,
- NgZorroAntdModule,
- FormsModule,
- ReactiveFormsModule
- ],
- exports: [
- ProjectComponent,
- ReleaseComponent,
- TrainingComponent,
- TeamComponent,
- SharedComponent,
- NewProjectPageComponent
- ]
- })
- export class WorkspaceModule {
- }
+ declarations: [
+ ProjectComponent,
+ ReleaseComponent,
+ TrainingComponent,
+ TeamComponent,
+ SharedComponent,
+ NewProjectPageComponent
+ ],
+ imports: [CommonModule, ComponentsModule, NgZorroAntdModule, FormsModule, ReactiveFormsModule],
+ exports: [
+ ProjectComponent,
+ ReleaseComponent,
+ TrainingComponent,
+ TeamComponent,
+ SharedComponent,
+ NewProjectPageComponent
+ ]
+})
+export class WorkspaceModule {}
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/auth.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/auth.service.ts
index 099ec2f..e7ad408 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/auth.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/auth.service.ts
@@ -53,7 +53,7 @@ export class AuthService {
};
return this.httpClient.post<Rest<SysUser>>(apiUrl, params).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
this.isLoggedIn = true;
this.localStorageService.set(this.authTokenKey, res.result.token);
@@ -67,7 +67,7 @@ export class AuthService {
logout() {
return this.httpClient.post<Rest<boolean>>(this.baseApi.getRestApi('/auth/logout'), {}).pipe(
- map(res => {
+ map((res) => {
if (res.result) {
this.isLoggedIn = false;
this.localStorageService.remove(this.authTokenKey);
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/department.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/department.service.ts
index 801108f..76df7d0 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/department.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/department.service.ts
@@ -19,26 +19,24 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
+import { ValidationErrors } from '@angular/forms';
import { Rest } from '@submarine/interfaces';
+import { SysDeptItem } from '@submarine/interfaces/sys-dept-item';
import { SysDeptSelect } from '@submarine/interfaces/sys-dept-select';
import { of, Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
import { BaseApiService } from './base-api.service';
-import { SysDeptItem } from '@submarine/interfaces/sys-dept-item';
-import { ValidationErrors } from '@angular/forms';
@Injectable({
providedIn: 'root'
})
export class DepartmentService {
-
- constructor(private baseApi: BaseApiService, private httpClient: HttpClient) {
- }
+ constructor(private baseApi: BaseApiService, private httpClient: HttpClient) {}
fetchSysDeptSelect(): Observable<SysDeptSelect[]> {
const apiUrl = this.baseApi.getRestApi('/sys/dept/queryIdTree');
return this.httpClient.get<Rest<SysDeptSelect[]>>(apiUrl).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
@@ -48,10 +46,10 @@ export class DepartmentService {
);
}
- fetchSysDeptList() : Observable<SysDeptItem[]> {
+ fetchSysDeptList(): Observable<SysDeptItem[]> {
const apiUrl = this.baseApi.getRestApi('/sys/dept/tree');
return this.httpClient.get<Rest<any>>(apiUrl).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
console.log(res.result);
return of(res.result.records);
@@ -62,21 +60,24 @@ export class DepartmentService {
);
}
- codeCheck(codeParams): Promise<ValidationErrors|null> {
+ codeCheck(codeParams): Promise<ValidationErrors | null> {
const promise = new Promise((resolve, reject) => {
const apiUrl = this.baseApi.getRestApi('/sys/duplicateCheck');
- this.httpClient.get<any>(apiUrl,{
- params: codeParams
- }).toPromise()
- .then((res: any) => {
- console.log(res)
- resolve(res.success);
- },
- err => {
- console.log(err);
- reject(err);
- }
- );
+ this.httpClient
+ .get<any>(apiUrl, {
+ params: codeParams
+ })
+ .toPromise()
+ .then(
+ (res: any) => {
+ console.log(res);
+ resolve(res.success);
+ },
+ (err) => {
+ console.log(err);
+ reject(err);
+ }
+ );
});
return promise;
}
@@ -84,8 +85,8 @@ export class DepartmentService {
createDept(params): Observable<SysDeptItem> {
const apiUrl = this.baseApi.getRestApi('/sys/dept/add');
return this.httpClient.post<Rest<SysDeptItem>>(apiUrl, params).pipe(
- switchMap(res => {
- console.log(res)
+ switchMap((res) => {
+ console.log(res);
if (res.success) {
return of(res.result);
} else {
@@ -98,7 +99,7 @@ export class DepartmentService {
editDept(params): Observable<boolean> {
const apiUrl = this.baseApi.getRestApi('/sys/dept/edit');
return this.httpClient.put<Rest<any>>(apiUrl, params).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(true);
} else {
@@ -107,5 +108,4 @@ export class DepartmentService {
})
);
}
-
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts
index beb972f..5fe67d6 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts
@@ -29,13 +29,12 @@ import { switchMap } from 'rxjs/operators';
providedIn: 'root'
})
export class ExperimentService {
- constructor(private baseApi: BaseApiService, private httpClient: HttpClient) {
- }
+ constructor(private baseApi: BaseApiService, private httpClient: HttpClient) {}
fetchExperimentList(): Observable<ExperimentInfo[]> {
const apiUrl = this.baseApi.getRestApi('/v1/jobs');
return this.httpClient.get<Rest<ExperimentInfo[]>>(apiUrl).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
console.log(res.result);
return of(res.result);
@@ -49,7 +48,7 @@ export class ExperimentService {
createExperiment(experimentSpec): Observable<ExperimentInfo> {
const apiUrl = this.baseApi.getRestApi('/v1/jobs');
return this.httpClient.post<Rest<ExperimentInfo>>(apiUrl, experimentSpec).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
@@ -62,7 +61,7 @@ export class ExperimentService {
editExperiment(experimentSpec): Observable<ExperimentInfo> {
const apiUrl = this.baseApi.getRestApi('/v1/jobs');
return this.httpClient.patch<Rest<ExperimentInfo>>(apiUrl, experimentSpec).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
@@ -75,7 +74,7 @@ export class ExperimentService {
deleteExperiment(id: string): Observable<ExperimentInfo> {
const apiUrl = this.baseApi.getRestApi('/v1/jobs/' + id);
return this.httpClient.delete<Rest<any>>(apiUrl).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/project.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/project.service.ts
index 6ac330c..22bbef9 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/project.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/project.service.ts
@@ -48,36 +48,29 @@ interface AddProjectParams {
providedIn: 'root'
})
export class ProjectService {
-
- constructor(
- private baseApi: BaseApiService,
- private httpClient: HttpClient
- ) {
-
- }
+ constructor(private baseApi: BaseApiService, private httpClient: HttpClient) {}
fetchProjectList(queryParams: Partial<ProjectQueryParams>): Observable<ListResult<Project>> {
const apiUrl = this.baseApi.getRestApi('/project/list');
- console.log(apiUrl)
- return this.httpClient.get<Rest<ListResult<Project>>>(apiUrl, {params: queryParams})
- .pipe(
- switchMap(res => {
- if (res.success) {
- return of(res.result);
- } else {
- throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'get', queryParams);
- }
- })
- );;
-
+ console.log(apiUrl);
+ return this.httpClient
+ .get<Rest<ListResult<Project>>>(apiUrl, { params: queryParams })
+ .pipe(
+ switchMap((res) => {
+ if (res.success) {
+ return of(res.result);
+ } else {
+ throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'get', queryParams);
+ }
+ })
+ );
}
addProject(params: Partial<AddProjectParams>): Observable<Project> {
- console.log("addProject", params)
+ console.log('addProject', params);
const apiUrl = this.baseApi.getRestApi('/project/add');
- return this.httpClient.post<Rest<Project>>(apiUrl, params)
- .pipe(
- switchMap(res => {
+ return this.httpClient.post<Rest<Project>>(apiUrl, params).pipe(
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/system-utils.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/system-utils.service.ts
index 6046968..1a35344 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/system-utils.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/system-utils.service.ts
@@ -21,9 +21,9 @@ import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { ListResult, Rest } from '@submarine/interfaces';
import { SysDictItem } from '@submarine/interfaces/sys-dict-item';
-import { BaseApiService } from './base-api.service';
import { of, Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
+import { BaseApiService } from './base-api.service';
export enum SysDictCode {
'USER_SEX' = 'SYS_USER_SEX',
@@ -36,8 +36,7 @@ export enum SysDictCode {
export class SystemUtilsService {
dictItemCache: { [s: string]: ListResult<any> } = {};
- constructor(private httpClient: HttpClient, private baseApi: BaseApiService) {
- }
+ constructor(private httpClient: HttpClient, private baseApi: BaseApiService) {}
fetchSysDictByCode(code: SysDictCode): Observable<ListResult<SysDictItem>> {
if (this.dictItemCache[code]) {
@@ -47,7 +46,7 @@ export class SystemUtilsService {
const apiUrl = `${this.baseApi.getRestApi('/sys/dictItem/getDictItems')}/${code}`;
return this.httpClient.get<Rest<ListResult<SysDictItem>>>(apiUrl).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
this.dictItemCache[code] = res.result;
return of(res.result);
@@ -70,12 +69,7 @@ export class SystemUtilsService {
return this.duplicateCheck('sys_user', 'phone', phone, userId);
}
- private duplicateCheck(
- tableName: string,
- fieldName: string,
- fieldVal: string,
- dataId?: string
- ): Observable<boolean> {
+ private duplicateCheck(tableName: string, fieldName: string, fieldVal: string, dataId?: string): Observable<boolean> {
const apiUrl = this.baseApi.getRestApi('/sys/duplicateCheck');
const params = {
tableName,
@@ -84,12 +78,14 @@ export class SystemUtilsService {
dataId: dataId
};
- return this.httpClient.get<Rest<string>>(apiUrl, {
- params
- }).pipe(
- switchMap(res => {
- return of(res.success);
+ return this.httpClient
+ .get<Rest<string>>(apiUrl, {
+ params
})
- );
+ .pipe(
+ switchMap((res) => {
+ return of(res.success);
+ })
+ );
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/team.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/team.service.ts
index 47d9105..483da0f 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/team.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/team.service.ts
@@ -19,12 +19,12 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
-import { BaseApiService } from './base-api.service';
+import { ValidationErrors } from '@angular/forms';
import { ListResult, Rest } from '@submarine/interfaces';
+import { SysTeam } from '@submarine/interfaces/sys-team';
import { of, Observable } from 'rxjs';
import { switchMap } from 'rxjs/operators';
-import { SysTeam } from '@submarine/interfaces/sys-team';
-import { ValidationErrors } from '@angular/forms';
+import { BaseApiService } from './base-api.service';
interface TeamListQueryParams {
teamName: string;
@@ -36,38 +36,35 @@ interface TeamListQueryParams {
@Injectable({
providedIn: 'root'
})
-
export class TeamService {
-
- constructor(private httpClient: HttpClient, private baseApi: BaseApiService) {
- }
+ constructor(private httpClient: HttpClient, private baseApi: BaseApiService) {}
getTeamList(queryParams: Partial<TeamListQueryParams>): Observable<ListResult<SysTeam>> {
const apiUrl = this.baseApi.getRestApi('/team/list');
- return this.httpClient.get<Rest<ListResult<SysTeam>>>(apiUrl, {
- params: queryParams
- }).pipe(
- switchMap(res => {
- if (res.success) {
- console.log(res.result);
- return of(res.result);
- }
- else {
- throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'get', queryParams);
- }
+ return this.httpClient
+ .get<Rest<ListResult<SysTeam>>>(apiUrl, {
+ params: queryParams
})
- );
+ .pipe(
+ switchMap((res) => {
+ if (res.success) {
+ console.log(res.result);
+ return of(res.result);
+ } else {
+ throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'get', queryParams);
+ }
+ })
+ );
}
createTeam(params): Observable<SysTeam> {
const apiUrl = this.baseApi.getRestApi('/team/add');
return this.httpClient.post<Rest<SysTeam>>(apiUrl, params).pipe(
- switchMap(res => {
- console.log(res)
+ switchMap((res) => {
+ console.log(res);
if (res.success) {
return of(res.result);
- }
- else {
+ } else {
throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'post', params);
}
})
@@ -76,37 +73,41 @@ export class TeamService {
deleteTeam(id: string) {
const apiUrl = this.baseApi.getRestApi('/team/delete');
- return this.httpClient.delete<Rest<any>>(apiUrl, {
- params: {
- id
- }
- }).pipe(
- switchMap(res => {
- if (res.success) {
- return of(true);
- }
- else {
- throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'post', id);
+ return this.httpClient
+ .delete<Rest<any>>(apiUrl, {
+ params: {
+ id
}
})
- )
+ .pipe(
+ switchMap((res) => {
+ if (res.success) {
+ return of(true);
+ } else {
+ throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'post', id);
+ }
+ })
+ );
}
- newTeamNameCheck(nameParams): Promise<ValidationErrors|null> {
+ newTeamNameCheck(nameParams): Promise<ValidationErrors | null> {
const promise = new Promise((resolve, reject) => {
const apiUrl = this.baseApi.getRestApi('/sys/duplicateCheck');
- this.httpClient.get<any>(apiUrl,{
- params: nameParams
- }).toPromise()
- .then((res: any) => {
- console.log(res)
- resolve(res.success);
- },
- err => {
- console.log(err);
- reject(err);
- }
- );
+ this.httpClient
+ .get<any>(apiUrl, {
+ params: nameParams
+ })
+ .toPromise()
+ .then(
+ (res: any) => {
+ console.log(res);
+ resolve(res.success);
+ },
+ (err) => {
+ console.log(err);
+ reject(err);
+ }
+ );
});
return promise;
}
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/user.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/user.service.ts
index 65f914d..97d24c1 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/user.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/user.service.ts
@@ -42,13 +42,12 @@ interface UserListQueryParams {
export class UserService {
private userInfo: UserInfo;
- constructor(private httpClient: HttpClient, private baseApi: BaseApiService) {
- }
+ constructor(private httpClient: HttpClient, private baseApi: BaseApiService) {}
fetchUserInfo(): Observable<UserInfo> {
const apiUrl = this.baseApi.getRestApi('/sys/user/info');
return this.httpClient.get<Rest<UserInfo>>(apiUrl).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
this.userInfo = new UserInfo(res.result);
return of(this.userInfo);
@@ -61,41 +60,45 @@ export class UserService {
fetchUserList(queryParams: Partial<UserListQueryParams>): Observable<ListResult<SysUser>> {
const apiUrl = this.baseApi.getRestApi('/sys/user/list');
- return this.httpClient.get<Rest<ListResult<SysUser>>>(apiUrl, {
- params: queryParams
- }).pipe(
- switchMap(res => {
- if (res.success) {
- return of(res.result);
- } else {
- throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'get', queryParams);
- }
+ return this.httpClient
+ .get<Rest<ListResult<SysUser>>>(apiUrl, {
+ params: queryParams
})
- );
+ .pipe(
+ switchMap((res) => {
+ if (res.success) {
+ return of(res.result);
+ } else {
+ throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'get', queryParams);
+ }
+ })
+ );
}
changePassword(id: string, password: string): Observable<boolean> {
const apiUrl = this.baseApi.getRestApi('/sys/user/changePassword');
- return this.httpClient.put<Rest<any>>(apiUrl, {
- id,
- password: md5(password)
- }).pipe(
- switchMap(res => {
- if (res.success) {
- return of(true);
- } else {
- throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'put', { id, password });
- }
+ return this.httpClient
+ .put<Rest<any>>(apiUrl, {
+ id,
+ password: md5(password)
})
- );
+ .pipe(
+ switchMap((res) => {
+ if (res.success) {
+ return of(true);
+ } else {
+ throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'put', { id, password });
+ }
+ })
+ );
}
createUser(sysUser: Partial<SysUser>): Observable<SysUser> {
const apiUrl = this.baseApi.getRestApi('/sys/user/add');
return this.httpClient.post<Rest<SysUser>>(apiUrl, sysUser).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
@@ -109,7 +112,7 @@ export class UserService {
const apiUrl = this.baseApi.getRestApi('/sys/user/edit');
return this.httpClient.put<Rest<SysUser>>(apiUrl, sysUser).pipe(
- switchMap(res => {
+ switchMap((res) => {
if (res.success) {
return of(res.result);
} else {
@@ -122,18 +125,20 @@ export class UserService {
deleteUser(id: string): Observable<boolean> {
const apiUrl = this.baseApi.getRestApi(`/sys/user/delete`);
- return this.httpClient.delete<Rest<any>>(apiUrl, {
- params: {
- id
- }
- }).pipe(
- switchMap(res => {
- if (res.success) {
- return of(true);
- } else {
- throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'delete', id);
+ return this.httpClient
+ .delete<Rest<any>>(apiUrl, {
+ params: {
+ id
}
})
- );
+ .pipe(
+ switchMap((res) => {
+ if (res.success) {
+ return of(true);
+ } else {
+ throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'delete', id);
+ }
+ })
+ );
}
}
diff --git a/submarine-workbench/workbench-web-ng/src/index.html b/submarine-workbench/workbench-web-ng/src/index.html
index 2134e57..a88d57f 100644
--- a/submarine-workbench/workbench-web-ng/src/index.html
+++ b/submarine-workbench/workbench-web-ng/src/index.html
@@ -17,16 +17,16 @@
~ under the License.
-->
-<!doctype html>
+<!DOCTYPE html>
<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>Submarine</title>
- <base href="/">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="icon" type="image/x-icon" href="favicon.ico">
-</head>
-<body>
- <submarine-root></submarine-root>
-</body>
+ <head>
+ <meta charset="utf-8" />
+ <title>Submarine</title>
+ <base href="/" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <link rel="icon" type="image/x-icon" href="favicon.ico" />
+ </head>
+ <body>
+ <submarine-root></submarine-root>
+ </body>
</html>
diff --git a/submarine-workbench/workbench-web-ng/src/main.ts b/submarine-workbench/workbench-web-ng/src/main.ts
index 4613957..d697827 100644
--- a/submarine-workbench/workbench-web-ng/src/main.ts
+++ b/submarine-workbench/workbench-web-ng/src/main.ts
@@ -29,4 +29,4 @@ if (environment.production) {
platformBrowserDynamic()
.bootstrapModule(AppModule)
- .catch(err => console.error(err));
+ .catch((err) => console.error(err));
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@submarine.apache.org
For additional commands, e-mail: dev-help@submarine.apache.org