From 2a04e6cc3a4340bc4747db7f5a9db128e8f48c8d Mon Sep 17 00:00:00 2001 From: Sebastian Stehle Date: Sat, 22 Jun 2019 17:17:02 +0200 Subject: [PATCH] Temp --- src/Squidex/app-config/webpack.config.js | 13 +- .../app/features/settings/declarations.ts | 2 + src/Squidex/app/features/settings/module.ts | 70 +++++----- .../pages/clients/client.component.html | 28 +--- .../pages/clients/client.component.scss | 31 ----- .../pages/clients/client.component.ts | 46 +------ .../workflows/workflow-step.component.html | 59 ++++++++ .../workflows/workflow-step.component.scss | 28 ++++ .../workflows/workflow-step.component.ts | 62 +++++++++ .../workflows/workflows-page.component.html | 35 +++++ .../workflows/workflows-page.component.scss | 2 + .../workflows/workflows-page.component.ts | 48 +++++++ .../settings/settings-area.component.html | 6 + .../angular/forms/autocomplete.component.ts | 15 +- .../angular/forms/color-picker.component.html | 22 ++- .../angular/forms/color-picker.component.scss | 9 ++ .../angular/forms/color-picker.component.ts | 3 + .../angular/forms/dropdown.component.html | 26 ++++ .../angular/forms/dropdown.component.scss | 38 +++++ .../angular/forms/dropdown.component.ts | 130 ++++++++++++++++++ .../forms/editable-title.component.html | 23 ++++ .../forms/editable-title.component.scss | 33 +++++ .../angular/forms/editable-title.component.ts | 72 ++++++++++ .../angular/forms/tag-editor.component.ts | 18 +-- src/Squidex/app/framework/declarations.ts | 2 + src/Squidex/app/framework/internal.ts | 1 + src/Squidex/app/framework/module.ts | 6 + src/Squidex/app/framework/utils/keys.ts | 15 ++ .../app/shared/services/apps.service.ts | 1 + .../app/shared/services/workflows.service.ts | 16 ++- src/Squidex/app/theme/icomoon/demo.html | 18 ++- .../app/theme/icomoon/fonts/icomoon.eot | Bin 29780 -> 29888 bytes .../app/theme/icomoon/fonts/icomoon.svg | 1 + .../app/theme/icomoon/fonts/icomoon.ttf | Bin 29616 -> 29724 bytes .../app/theme/icomoon/fonts/icomoon.woff | Bin 29692 -> 29800 bytes src/Squidex/app/theme/icomoon/selection.json | 2 +- src/Squidex/app/theme/icomoon/style.css | 13 +- 37 files changed, 725 insertions(+), 169 deletions(-) create mode 100644 src/Squidex/app/features/settings/pages/workflows/workflow-step.component.html create mode 100644 src/Squidex/app/features/settings/pages/workflows/workflow-step.component.scss create mode 100644 src/Squidex/app/features/settings/pages/workflows/workflow-step.component.ts create mode 100644 src/Squidex/app/features/settings/pages/workflows/workflows-page.component.html create mode 100644 src/Squidex/app/features/settings/pages/workflows/workflows-page.component.scss create mode 100644 src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts create mode 100644 src/Squidex/app/framework/angular/forms/dropdown.component.html create mode 100644 src/Squidex/app/framework/angular/forms/dropdown.component.scss create mode 100644 src/Squidex/app/framework/angular/forms/dropdown.component.ts create mode 100644 src/Squidex/app/framework/angular/forms/editable-title.component.html create mode 100644 src/Squidex/app/framework/angular/forms/editable-title.component.scss create mode 100644 src/Squidex/app/framework/angular/forms/editable-title.component.ts create mode 100644 src/Squidex/app/framework/utils/keys.ts diff --git a/src/Squidex/app-config/webpack.config.js b/src/Squidex/app-config/webpack.config.js index edaeaa5a8..6b9fcb4d0 100644 --- a/src/Squidex/app-config/webpack.config.js +++ b/src/Squidex/app-config/webpack.config.js @@ -31,7 +31,7 @@ const plugins = { module.exports = function(env) { const isDevServer = path.basename(require.main.filename) === 'webpack-dev-server.js'; const isProduction = env && env.production; - const isTesting = env && env.target === 'tests'; + const isTests = env && env.target === 'tests'; const isCoverage = env && env.coverage; const isJit = env && env.jit; @@ -43,7 +43,7 @@ module.exports = function(env) { * * See: https://webpack.js.org/configuration/devtool/ */ - devtool: isProduction ? undefined : (isTesting ? 'inline-source-map' : 'source-map'), + devtool: isProduction ? false : (isTests ? 'inline-source-map' : 'source-map'), /** * Options affecting the resolving of modules. @@ -181,7 +181,9 @@ module.exports = function(env) { } }; - if (!isTesting) { + console.log(JSON.stringify(config, null, 2)); + + if (!isTests) { /** * The entry point for the bundle. Our Angular app. * @@ -286,9 +288,8 @@ module.exports = function(env) { config.module.rules.push({ test: /\.ts$/, use: [{ - loader: 'awesome-typescript-loader' - }], - exclude: [/node_modules/] + loader: 'awesome-typescript-loader', options: { useCache: true, useBabel: true } + }] }) } else { config.module.rules.push({ diff --git a/src/Squidex/app/features/settings/declarations.ts b/src/Squidex/app/features/settings/declarations.ts index fdb82e6b5..17e095257 100644 --- a/src/Squidex/app/features/settings/declarations.ts +++ b/src/Squidex/app/features/settings/declarations.ts @@ -18,5 +18,7 @@ export * from './pages/patterns/patterns-page.component'; export * from './pages/plans/plans-page.component'; export * from './pages/roles/role.component'; export * from './pages/roles/roles-page.component'; +export * from './pages/workflows/workflow-step.component'; +export * from './pages/workflows/workflows-page.component'; export * from './settings-area.component'; \ No newline at end of file diff --git a/src/Squidex/app/features/settings/module.ts b/src/Squidex/app/features/settings/module.ts index 121e03d8b..29802f591 100644 --- a/src/Squidex/app/features/settings/module.ts +++ b/src/Squidex/app/features/settings/module.ts @@ -30,7 +30,9 @@ import { PlansPageComponent, RoleComponent, RolesPageComponent, - SettingsAreaComponent + SettingsAreaComponent, + WorkflowsPageComponent, + WorkflowStepComponent } from './declarations'; const routes: Routes = [ @@ -59,117 +61,121 @@ const routes: Routes = [ ] }, { - path: 'plans', - component: PlansPageComponent, + path: 'clients', + component: ClientsPageComponent, children: [ { path: 'history', component: HistoryComponent, data: { - channel: 'settings.plan' + channel: 'settings.clients' + } + }, + { + path: 'help', + component: HelpComponent, + data: { + helpPage: '05-integrated/clients' } } ] }, { - path: 'patterns', - component: PatternsPageComponent, + path: 'contributors', + component: ContributorsPageComponent, children: [ { path: 'history', component: HistoryComponent, data: { - channel: 'settings.patterns' + channel: 'settings.contributors' } }, { path: 'help', component: HelpComponent, data: { - helpPage: '05-integrated/patterns' + helpPage: '05-integrated/contributors' } } ] }, { - path: 'clients', - component: ClientsPageComponent, + path: 'languages', + component: LanguagesPageComponent, children: [ { path: 'history', component: HistoryComponent, data: { - channel: 'settings.clients' + channel: 'settings.languages' } }, { path: 'help', component: HelpComponent, data: { - helpPage: '05-integrated/clients' + helpPage: '05-integrated/languages' } } ] }, { - path: 'contributors', - component: ContributorsPageComponent, + path: 'patterns', + component: PatternsPageComponent, children: [ { path: 'history', component: HistoryComponent, data: { - channel: 'settings.contributors' + channel: 'settings.patterns' } }, { path: 'help', component: HelpComponent, data: { - helpPage: '05-integrated/contributors' + helpPage: '05-integrated/patterns' } } ] }, { - path: 'roles', - component: RolesPageComponent, + path: 'plans', + component: PlansPageComponent, children: [ { path: 'history', component: HistoryComponent, data: { - channel: 'settings.roles' - } - }, - { - path: 'help', - component: HelpComponent, - data: { - helpPage: '05-integrated/roles' + channel: 'settings.plan' } } ] }, { - path: 'languages', - component: LanguagesPageComponent, + path: 'roles', + component: RolesPageComponent, children: [ { path: 'history', component: HistoryComponent, data: { - channel: 'settings.languages' + channel: 'settings.roles' } }, { path: 'help', component: HelpComponent, data: { - helpPage: '05-integrated/languages' + helpPage: '05-integrated/roles' } } ] + }, + { + path: 'workflows', + component: WorkflowsPageComponent } ] } @@ -196,7 +202,9 @@ const routes: Routes = [ PlansPageComponent, RoleComponent, RolesPageComponent, - SettingsAreaComponent + SettingsAreaComponent, + WorkflowsPageComponent, + WorkflowStepComponent ] }) export class SqxFeatureSettingsModule { } \ No newline at end of file diff --git a/src/Squidex/app/features/settings/pages/clients/client.component.html b/src/Squidex/app/features/settings/pages/clients/client.component.html index 9b40afd96..d0d749f8e 100644 --- a/src/Squidex/app/features/settings/pages/clients/client.component.html +++ b/src/Squidex/app/features/settings/pages/clients/client.component.html @@ -2,27 +2,13 @@
-
-
- - - -
- - - - -
- - -

- {{client.name}} -

- - -
+
+ + +
diff --git a/src/Squidex/app/features/settings/pages/clients/client.component.scss b/src/Squidex/app/features/settings/pages/clients/client.component.scss index 904b3faa6..a273b9a38 100644 --- a/src/Squidex/app/features/settings/pages/clients/client.component.scss +++ b/src/Squidex/app/features/settings/pages/clients/client.component.scss @@ -18,14 +18,6 @@ $color-editor: #eceeef; } } -.col-name { - &:hover { - .client-edit { - display: inline-block; - } - } -} - .client { &-info { margin: 0; @@ -34,29 +26,6 @@ $color-editor: #eceeef; &-delete { vertical-align: top; } - - &-edit { - color: $color-border-dark; - display: none; - font-size: .9rem; - font-weight: normal; - padding: .6rem .25rem; - border: 0; - background: transparent; - vertical-align: baseline; - } - - &-name { - padding: .375rem 0; - font-family: -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; - font-size: 1.2rem; - font-weight: normal; - line-height: 1.5rem; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - display: inline-block; - margin: 0; - } } .no-padding { diff --git a/src/Squidex/app/features/settings/pages/clients/client.component.ts b/src/Squidex/app/features/settings/pages/clients/client.component.ts index 76c7bc9d3..fc92677c5 100644 --- a/src/Squidex/app/features/settings/pages/clients/client.component.ts +++ b/src/Squidex/app/features/settings/pages/clients/client.component.ts @@ -6,7 +6,6 @@ */ import { Component, Input, OnChanges, SimpleChanges } from '@angular/core'; -import { FormBuilder } from '@angular/forms'; import { AccessTokenDto, @@ -17,12 +16,9 @@ import { ClientsState, DialogModel, DialogService, - RenameClientForm, RoleDto } from '@app/shared'; -const ESCAPE_KEY = 27; - @Component({ selector: 'sqx-client', styleUrls: ['./client.component.scss'], @@ -35,13 +31,9 @@ export class ClientComponent implements OnChanges { @Input() public clientRoles: RoleDto[]; - public isRenaming = false; - public connectToken: AccessTokenDto; public connectDialog = new DialogModel(); - public renameForm = new RenameClientForm(this.formBuilder); - public connectHttpText: string; public connectCLINixText: string; public connectCLIWinText: string; @@ -53,15 +45,12 @@ export class ClientComponent implements OnChanges { private readonly apiUrl: ApiUrlConfig, private readonly clientsService: ClientsService, private readonly clientsState: ClientsState, - private readonly dialogs: DialogService, - private readonly formBuilder: FormBuilder + private readonly dialogs: DialogService ) { } public ngOnChanges(changes: SimpleChanges) { if (changes['client']) { - this.renameForm.load(this.client); - const app = this.appsState.appName; this.connectHttpText = connectHttpText(this.apiUrl, app, this.client); @@ -80,31 +69,8 @@ export class ClientComponent implements OnChanges { this.clientsState.update(this.client, { role }); } - public toggleRename() { - if (!this.client.canUpdate) { - return; - } - - this.isRenaming = !this.isRenaming; - } - - public rename() { - if (!this.client.canUpdate) { - return; - } - - const value = this.renameForm.submit(); - - if (value) { - this.clientsState.update(this.client, value) - .subscribe(() => { - this.renameForm.submitCompleted(); - - this.toggleRename(); - }, error => { - this.renameForm.submitFailed(error); - }); - } + public rename(name: string) { + this.clientsState.update(this.client, { name }); } public connect() { @@ -121,12 +87,6 @@ export class ClientComponent implements OnChanges { public trackByRole(index: number, role: RoleDto) { return role.name; } - - public onKeyDown(keyCode: number) { - if (keyCode === ESCAPE_KEY) { - this.toggleRename(); - } - } } function connectHttpText(apiUrl: ApiUrlConfig, app: string, client: { id: string, secret: string }) { diff --git a/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.html b/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.html new file mode 100644 index 000000000..3a6b20f9f --- /dev/null +++ b/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.html @@ -0,0 +1,59 @@ +
+
+
+ + +
+
+ + +
+
+ +
+
+ +
+
+ +
+
+
In Progress +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ + + +
{{target.name}} +
+
+
+
+
+ +
+
+
\ No newline at end of file diff --git a/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.scss b/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.scss new file mode 100644 index 000000000..415e44a21 --- /dev/null +++ b/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.scss @@ -0,0 +1,28 @@ +@import '_vars'; +@import '_mixins'; + +.color { + line-height: 2.8rem; +} + +.color-circle { + @include circle(12px); + border: 1px solid $color-border-dark; + background: $color-border; + display: inline-block; +} + +.transition { + & { + padding-left: 1rem; + margin-top: .25rem; + margin-bottom: .5rem; + line-height: 2rem; + } +} + +.step { + & { + margin-bottom: 1rem; + } +} \ No newline at end of file diff --git a/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.ts b/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.ts new file mode 100644 index 000000000..4da32e3c5 --- /dev/null +++ b/src/Squidex/app/features/settings/pages/workflows/workflow-step.component.ts @@ -0,0 +1,62 @@ +/* + * Squidex Headless CMS + * + * @license + * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. + */ + +import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core'; + +import { + WorkflowDto, + WorkflowStep, + WorkflowStepValues, + WorkflowTransition, + WorkflowTransitionView +} from '@app/shared'; + +@Component({ + selector: 'sqx-workflow-step', + styleUrls: ['./workflow-step.component.scss'], + templateUrl: './workflow-step.component.html' +}) +export class WorkflowStepComponent implements OnChanges { + @Input() + public workflow: WorkflowDto; + + @Input() + public step: WorkflowStep; + + @Output() + public transitionRemove = new EventEmitter(); + + @Output() + public update = new EventEmitter(); + + @Output() + public rename = new EventEmitter(); + + @Output() + public remove = new EventEmitter(); + + public openSteps: WorkflowStep[]; + + public transitions: WorkflowTransitionView[]; + + public ngOnChanges(changes: SimpleChanges) { + if (changes['workflow'] || changes['step']) { + this.openSteps = this.workflow.getOpenSteps(this.step); + + this.transitions = this.workflow.getTransitions(this.step); + } + } + + public changeName(name: string) { + this.rename.emit(name); + } + + public changeColor(color: string) { + this.update.emit({ color }); + } +} + diff --git a/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.html b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.html new file mode 100644 index 000000000..31430d112 --- /dev/null +++ b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.html @@ -0,0 +1,35 @@ + + + Workflows + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.scss b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.scss new file mode 100644 index 000000000..fbb752506 --- /dev/null +++ b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.scss @@ -0,0 +1,2 @@ +@import '_vars'; +@import '_mixins'; \ No newline at end of file diff --git a/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts new file mode 100644 index 000000000..897d5c6f0 --- /dev/null +++ b/src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts @@ -0,0 +1,48 @@ +/* + * Squidex Headless CMS + * + * @license + * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. + */ + +import { Component } from '@angular/core'; + +import { + WorkflowDto, + WorkflowStep, + WorkflowStepValues +} from '@app/shared'; + +@Component({ + selector: 'sqx-workflows-page', + styleUrls: ['./workflows-page.component.scss'], + templateUrl: './workflows-page.component.html' +}) +export class WorkflowsPageComponent { + public workflow = new WorkflowDto().setStep('Published', { color: 'green' }); + + public reload() { + return; + } + + public save() { + return; + } + + public addStep() { + this.workflow = this.workflow.setStep(`Step${this.workflow.steps.length + 1}`, {}); + } + + public updateStep(step: WorkflowStep, values: WorkflowStepValues) { + // this.workflow = this.workflow.setStep(step.name, values); + } + + public renameStep(step: WorkflowStep, newName: string) { + // this.workflow = this.workflow.renameStep(step.name, newName); + } + + public removeStep(step: WorkflowStep) { + // this.workflow = this.workflow.removeStep(step.name); + } +} + diff --git a/src/Squidex/app/features/settings/settings-area.component.html b/src/Squidex/app/features/settings/settings-area.component.html index 5669f4b3c..cee2481d3 100644 --- a/src/Squidex/app/features/settings/settings-area.component.html +++ b/src/Squidex/app/features/settings/settings-area.component.html @@ -43,6 +43,12 @@ +