up main page of csc
This commit is contained in:
parent
334b6c90cf
commit
7de81096bb
14 changed files with 165 additions and 37 deletions
|
@ -61,3 +61,4 @@ Angular CLI does not come with an end-to-end testing framework by default. You c
|
||||||
## Additional Resources
|
## Additional Resources
|
||||||
|
|
||||||
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
||||||
|
|
||||||
|
|
|
@ -74,7 +74,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.avatar-container {
|
.avatar-container {
|
||||||
background: white;
|
//background: white;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
<div [ngClass]="{highlighted, 'is-disabled': disabled}" class="filter-group">
|
<div [ngClass]="{highlighted, 'is-disabled': disabled}" class="filter-group">
|
||||||
|
<!-- disabled: {{ disabled }}-->
|
||||||
<div class="selectors">
|
<div class="selectors">
|
||||||
<sae-multi-selector
|
<sae-multi-selector
|
||||||
(availableChoicesChange)="onAvailableChoicesChange($event, 'engineType')"
|
(availableChoicesChange)="onAvailableChoicesChange($event, 'engineType')"
|
||||||
|
|
|
@ -46,6 +46,12 @@
|
||||||
.filter-group {
|
.filter-group {
|
||||||
|
|
||||||
|
|
||||||
|
&.is-disabled {
|
||||||
|
input {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.search {
|
.search {
|
||||||
display: flex;
|
display: flex;
|
||||||
min-height: 42px;
|
min-height: 42px;
|
||||||
|
@ -70,8 +76,8 @@
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
|
||||||
.chips-column {
|
.chips-column {
|
||||||
padding: 12px 12px;
|
padding: 12px 16px;
|
||||||
width: 218px;
|
width: 222px;
|
||||||
//border: solid 1px #ccc;
|
//border: solid 1px #ccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -20,8 +20,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&.is-disabled {
|
&.is-disabled {
|
||||||
color: #525668;
|
color: #8d91a4;
|
||||||
fill: #525668;
|
fill: #8d91a4;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -82,6 +82,7 @@
|
||||||
|
|
||||||
.is-disabled & {
|
.is-disabled & {
|
||||||
border-color: #525668;
|
border-color: #525668;
|
||||||
|
background: #8D91A4;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -57,3 +57,8 @@ Angular CLI does not come with an end-to-end testing framework by default. You c
|
||||||
## Additional Resources
|
## Additional Resources
|
||||||
|
|
||||||
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
|
||||||
|
|
||||||
|
## doing
|
||||||
|
|
||||||
|
display des dropdown de filtres
|
||||||
|
syncro from text et store
|
||||||
|
|
|
@ -32,18 +32,28 @@
|
||||||
<h2 class="title">
|
<h2 class="title">
|
||||||
Question analysis
|
Question analysis
|
||||||
</h2>
|
</h2>
|
||||||
@if (displayBotWarning) {
|
<!-- @if (displayBotWarning) {-->
|
||||||
<sae-bot-talks
|
|
||||||
[message]="appState.botMessage"></sae-bot-talks>
|
<sae-bot-talks
|
||||||
}
|
[message]="appState.botMessage"
|
||||||
|
[ngClass]="{ 'is-visible' : displayBotWarning }"></sae-bot-talks>
|
||||||
|
<!-- }-->
|
||||||
<!--filters-->
|
<!--filters-->
|
||||||
<!-- advanced filters-->
|
<!-- advanced filters-->
|
||||||
<div class="filters-container">
|
<div class="filters-container">
|
||||||
<sae-filters-group (selectionchange)="onSelectedChoicesChange()" [appState]="appState"
|
<sae-filters-group (selectionchange)="onSelectedChoicesChange()" [appState]="appState"
|
||||||
[disabled]="!appState.fromText.length"></sae-filters-group>
|
[disabled]="!appState.toText.length"></sae-filters-group>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<app-bottom-navigation></app-bottom-navigation>
|
<app-bottom-navigation></app-bottom-navigation>
|
||||||
|
|
||||||
|
fromText:
|
||||||
|
{{ appState.fromText }}
|
||||||
|
<br>
|
||||||
|
totext:
|
||||||
|
{{ appState.toText }}
|
||||||
|
|
||||||
|
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
|
|
||||||
|
|
|
@ -58,4 +58,16 @@
|
||||||
padding-bottom: 400px;
|
padding-bottom: 400px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
sae-bot-talks {
|
||||||
|
position: absolute;
|
||||||
|
top: 496px;
|
||||||
|
right: 0;
|
||||||
|
width: 100%;
|
||||||
|
visibility: hidden;
|
||||||
|
|
||||||
|
&.is-visible {
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,6 +6,7 @@ import {FeedbackButton} from 'sae-lib/buttons/feedback-button/feedback-button';
|
||||||
import {BotTalks} from 'sae-lib/chatbot/bot-talks/bot-talks';
|
import {BotTalks} from 'sae-lib/chatbot/bot-talks/bot-talks';
|
||||||
import {Store} from '@ngrx/store';
|
import {Store} from '@ngrx/store';
|
||||||
import {StateInterface} from '../../redux/reducers';
|
import {StateInterface} from '../../redux/reducers';
|
||||||
|
import {NgClass} from '@angular/common';
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -15,7 +16,8 @@ import {StateInterface} from '../../redux/reducers';
|
||||||
FiltersGroup,
|
FiltersGroup,
|
||||||
BottomNavigation,
|
BottomNavigation,
|
||||||
FeedbackButton,
|
FeedbackButton,
|
||||||
BotTalks
|
BotTalks,
|
||||||
|
NgClass
|
||||||
],
|
],
|
||||||
templateUrl: './main.html',
|
templateUrl: './main.html',
|
||||||
styleUrl: './main.scss'
|
styleUrl: './main.scss'
|
||||||
|
|
|
@ -44,7 +44,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
<div class="row filters-row">
|
<div class="row filters-row">
|
||||||
<sae-filters-group [hideChipsList]="true"></sae-filters-group>
|
<sae-filters-group [disabled]="disabledFilters" [hideChipsList]="true"></sae-filters-group>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
|
|
|
@ -29,6 +29,7 @@ export class SimilarCases {
|
||||||
public appState: any = {};
|
public appState: any = {};
|
||||||
activeTab: string = "summarized";
|
activeTab: string = "summarized";
|
||||||
displayHeaderTabs: boolean = false;
|
displayHeaderTabs: boolean = false;
|
||||||
|
disabledFilters: boolean = true;
|
||||||
|
|
||||||
constructor(private store: Store<StateInterface>) {
|
constructor(private store: Store<StateInterface>) {
|
||||||
this.store.select(state => state.app).subscribe(app => {
|
this.store.select(state => state.app).subscribe(app => {
|
||||||
|
|
|
@ -1,7 +1,9 @@
|
||||||
<div class="translate-texts is-{{disabled? 'disabled' : 'enabled'}}">
|
<div class="translate-texts is-{{disabled? 'disabled' : 'enabled'}}">
|
||||||
|
|
||||||
|
|
||||||
<div id="fromText">
|
<div [ngClass]="{
|
||||||
|
'is-focused' : fromTextFocused
|
||||||
|
}" id="fromText">
|
||||||
|
|
||||||
@if (!fileIsUploaded || !appState.fromText.length) {
|
@if (!fileIsUploaded || !appState.fromText.length) {
|
||||||
<!-- @if (appState.fromText.length == 0) {-->
|
<!-- @if (appState.fromText.length == 0) {-->
|
||||||
|
@ -46,9 +48,10 @@
|
||||||
@if (!fileIsUploaded) {
|
@if (!fileIsUploaded) {
|
||||||
<textarea
|
<textarea
|
||||||
(focus)="focusFromText()"
|
(focus)="focusFromText()"
|
||||||
|
(blur)="blurFromText()"
|
||||||
(keyup)="onFromTextChanged()"
|
(keyup)="onFromTextChanged()"
|
||||||
(ngModelChange)="onFromTextChanged()"
|
(ngModelChange)="onFromTextChanged()"
|
||||||
[(ngModel)]="appState.fromText"
|
[ngModel]="appState.fromText"
|
||||||
cols="30"
|
cols="30"
|
||||||
id="from_text"
|
id="from_text"
|
||||||
name="from_text"
|
name="from_text"
|
||||||
|
@ -57,7 +60,9 @@
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="toText">
|
<div [ngClass]="{
|
||||||
|
'is-focused' : toTextFocused
|
||||||
|
}" id="toText">
|
||||||
|
|
||||||
@if (loadingResume) {
|
@if (loadingResume) {
|
||||||
<div class="loading-container">
|
<div class="loading-container">
|
||||||
|
@ -72,9 +77,13 @@
|
||||||
<button (click)="emptyText('toText')" class="delete-button button">x</button>
|
<button (click)="emptyText('toText')" class="delete-button button">x</button>
|
||||||
}
|
}
|
||||||
@if (!loadingResume) {
|
@if (!loadingResume) {
|
||||||
<textarea [(ngModel)]="toText" cols="30" id="to_text" name="to_text" rows="10"></textarea>
|
<textarea
|
||||||
|
[ngModel]="appState.toText"
|
||||||
|
(ngModelChange)="onToTextChanged()"
|
||||||
|
(keyup)="onToTextChanged()"
|
||||||
|
(focus)="focusToText()"
|
||||||
|
(blur)="blurToText()"
|
||||||
|
cols="30" id="to_text" name="to_text" rows="10"></textarea>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -17,13 +17,17 @@
|
||||||
background: white;
|
background: white;
|
||||||
height: 235px;
|
height: 235px;
|
||||||
width: 648px;
|
width: 648px;
|
||||||
overflow-y: auto;
|
overflow: hidden;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
|
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
padding: variables.$spacing-4 42px variables.$spacing-4 variables.$spacing-4;
|
padding: variables.$spacing-4 42px variables.$spacing-4 variables.$spacing-4;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.is-focused {
|
||||||
|
outline: 3px solid #255B8E;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.delete-button {
|
.delete-button {
|
||||||
|
@ -77,6 +81,10 @@
|
||||||
line-height: 140%;
|
line-height: 140%;
|
||||||
width: 370px;
|
width: 370px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.click-file-upload {
|
.click-file-upload {
|
||||||
|
|
|
@ -17,7 +17,8 @@ export class TranslateTexts {
|
||||||
public loadingResume: boolean = false;
|
public loadingResume: boolean = false;
|
||||||
public mode: string = 'demo';
|
public mode: string = 'demo';
|
||||||
public debounceEnabled: boolean = true;
|
public debounceEnabled: boolean = true;
|
||||||
public textFocused: boolean = false;
|
public fromTextFocused: boolean = false;
|
||||||
|
public toTextFocused: boolean = false;
|
||||||
|
|
||||||
|
|
||||||
public fileIsUploaded: boolean = false;
|
public fileIsUploaded: boolean = false;
|
||||||
|
@ -45,7 +46,7 @@ export class TranslateTexts {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onToTextChanged(e: any): void {
|
onToTextChanged(e?: any): void {
|
||||||
console.log('text changed toText', e)
|
console.log('text changed toText', e)
|
||||||
// launch request
|
// launch request
|
||||||
// in demo mode, fill some filters
|
// in demo mode, fill some filters
|
||||||
|
@ -61,14 +62,68 @@ export class TranslateTexts {
|
||||||
// in demo mode, load demo filters
|
// in demo mode, load demo filters
|
||||||
console.log('demo mode, on émet updateFilters')
|
console.log('demo mode, on émet updateFilters')
|
||||||
|
|
||||||
const newFilters = [
|
|
||||||
['filter demo 1', 'filter demo 2'],
|
|
||||||
['filter demo 3'],
|
|
||||||
['filter demo 4', 'filter demo ABCD'],
|
|
||||||
['filter demo 5'],
|
|
||||||
]
|
|
||||||
// this.updateFilters.emit(newFilters);
|
|
||||||
this.updateFilters.emit();
|
this.updateFilters.emit();
|
||||||
|
this.store.dispatch({
|
||||||
|
type: ActionTypes.UPDATE_APP,
|
||||||
|
payload: {
|
||||||
|
toText: e && typeof e.value === 'function' ? e.value() : this.appState.toText,
|
||||||
|
filters: {
|
||||||
|
engineType:
|
||||||
|
{
|
||||||
|
// availableList: ['filter demo 1', 'filter demo 2'],
|
||||||
|
selectedList: [{
|
||||||
|
label: 'filter demo 1',
|
||||||
|
value: 'DEF',
|
||||||
|
}, {
|
||||||
|
label: 'filter demo 2',
|
||||||
|
value: 'DEF',
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
findings: {
|
||||||
|
availableList: [{
|
||||||
|
label: 'DEF',
|
||||||
|
value: 'DEF',
|
||||||
|
}],
|
||||||
|
selectedList: [{
|
||||||
|
label: 'GER',
|
||||||
|
value: 'GER',
|
||||||
|
}, {
|
||||||
|
label: '134D',
|
||||||
|
value: '134D',
|
||||||
|
},]
|
||||||
|
},
|
||||||
|
ata: {
|
||||||
|
availableList: [{
|
||||||
|
label: 'DEF',
|
||||||
|
value: 'DEF',
|
||||||
|
}],
|
||||||
|
selectedList: []
|
||||||
|
},
|
||||||
|
partNumber: {
|
||||||
|
availableList: [{
|
||||||
|
label: 'DEF',
|
||||||
|
value: 'DEF',
|
||||||
|
}],
|
||||||
|
selectedList: []
|
||||||
|
},
|
||||||
|
technicalManual: {
|
||||||
|
availableList: [{
|
||||||
|
label: 'DEF',
|
||||||
|
value: 'DEF',
|
||||||
|
}],
|
||||||
|
selectedList: [{
|
||||||
|
label: 'DEF',
|
||||||
|
value: 'DEF',
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
onOffWing: {
|
||||||
|
availableList: [],
|
||||||
|
selectedList: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
this.loadingResume = false;
|
this.loadingResume = false;
|
||||||
}, this.debounceEnabled ? this.debounceDuration : 0);
|
}, this.debounceEnabled ? this.debounceDuration : 0);
|
||||||
}
|
}
|
||||||
|
@ -80,7 +135,14 @@ export class TranslateTexts {
|
||||||
|
|
||||||
console.log('text changed fromText', e)
|
console.log('text changed fromText', e)
|
||||||
|
|
||||||
// this.store.dispatch({})
|
// Update the fromText property in the Redux store
|
||||||
|
this.store.dispatch({
|
||||||
|
type: ActionTypes.UPDATE_APP,
|
||||||
|
payload: {
|
||||||
|
fromText: this.fromText
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// run research after a delay
|
// run research after a delay
|
||||||
if (this.mode !== 'production') {
|
if (this.mode !== 'production') {
|
||||||
this.loadingResume = true;
|
this.loadingResume = true;
|
||||||
|
@ -94,13 +156,14 @@ export class TranslateTexts {
|
||||||
this.fromTimeout = setTimeout(() => {
|
this.fromTimeout = setTimeout(() => {
|
||||||
// in demo mode, make a fake resume
|
// in demo mode, make a fake resume
|
||||||
console.log('demo mode')
|
console.log('demo mode')
|
||||||
this.toText = "Résumé de démo à titre d'exemple"
|
|
||||||
this.loadingResume = false;
|
this.loadingResume = false;
|
||||||
|
|
||||||
this.store.dispatch({
|
this.store.dispatch({
|
||||||
type: ActionTypes.UPDATE_APP,
|
type: ActionTypes.UPDATE_APP,
|
||||||
state: {
|
payload: {
|
||||||
displayBot: true
|
displayBot: true,
|
||||||
|
toText: "Résumé de démo à titre d'exemple"
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
@ -140,10 +203,19 @@ export class TranslateTexts {
|
||||||
}
|
}
|
||||||
|
|
||||||
focusFromText(e?: any) {
|
focusFromText(e?: any) {
|
||||||
console.log('focus from text', e)
|
|
||||||
console.log('focus from text')
|
|
||||||
this.onRemoveFileSelected()
|
this.onRemoveFileSelected()
|
||||||
// this.fromText = ' '
|
this.fromTextFocused = true
|
||||||
this.textFocused = true
|
}
|
||||||
|
|
||||||
|
blurFromText() {
|
||||||
|
this.fromTextFocused = false
|
||||||
|
}
|
||||||
|
|
||||||
|
focusToText() {
|
||||||
|
this.toTextFocused = true
|
||||||
|
}
|
||||||
|
|
||||||
|
blurToText() {
|
||||||
|
this.toTextFocused = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue