up main page of csc
This commit is contained in:
Tykayn
tykayn
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
|
||||
|
||||
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 {
|
||||
background: white;
|
||||
//background: white;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
<div [ngClass]="{highlighted, 'is-disabled': disabled}" class="filter-group">
|
||||
<!-- disabled: {{ disabled }}-->
|
||||
<div class="selectors">
|
||||
<sae-multi-selector
|
||||
(availableChoicesChange)="onAvailableChoicesChange($event, 'engineType')"
|
||||
|
|
@ -60,7 +61,7 @@
|
|||
@if (!hideChipsList) {
|
||||
<div (click)="highlighted = !highlighted" class="chips-listing">
|
||||
<!-- liste de chips-->
|
||||
|
||||
|
||||
<div class="chips-column">
|
||||
@for (elem of appState.filters.engineType.selectedList; track elem.label) {
|
||||
<button class="button chips is-rounded is-small">
|
||||
|
|
|
|||
|
|
@ -46,6 +46,12 @@
|
|||
.filter-group {
|
||||
|
||||
|
||||
&.is-disabled {
|
||||
input {
|
||||
background: grey;
|
||||
}
|
||||
}
|
||||
|
||||
.search {
|
||||
display: flex;
|
||||
min-height: 42px;
|
||||
|
|
@ -70,8 +76,8 @@
|
|||
overflow-y: auto;
|
||||
|
||||
.chips-column {
|
||||
padding: 12px 12px;
|
||||
width: 218px;
|
||||
padding: 12px 16px;
|
||||
width: 222px;
|
||||
//border: solid 1px #ccc;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -20,8 +20,8 @@
|
|||
}
|
||||
|
||||
&.is-disabled {
|
||||
color: #525668;
|
||||
fill: #525668;
|
||||
color: #8d91a4;
|
||||
fill: #8d91a4;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -82,6 +82,7 @@
|
|||
|
||||
.is-disabled & {
|
||||
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
|
||||
|
||||
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">
|
||||
Question analysis
|
||||
</h2>
|
||||
@if (displayBotWarning) {
|
||||
<sae-bot-talks
|
||||
[message]="appState.botMessage"></sae-bot-talks>
|
||||
}
|
||||
<!-- @if (displayBotWarning) {-->
|
||||
|
||||
<sae-bot-talks
|
||||
[message]="appState.botMessage"
|
||||
[ngClass]="{ 'is-visible' : displayBotWarning }"></sae-bot-talks>
|
||||
<!-- }-->
|
||||
<!--filters-->
|
||||
<!-- advanced filters-->
|
||||
<div class="filters-container">
|
||||
<sae-filters-group (selectionchange)="onSelectedChoicesChange()" [appState]="appState"
|
||||
[disabled]="!appState.fromText.length"></sae-filters-group>
|
||||
[disabled]="!appState.toText.length"></sae-filters-group>
|
||||
</div>
|
||||
</div>
|
||||
<app-bottom-navigation></app-bottom-navigation>
|
||||
|
||||
fromText:
|
||||
{{ appState.fromText }}
|
||||
<br>
|
||||
totext:
|
||||
{{ appState.toText }}
|
||||
|
||||
|
||||
</main>
|
||||
<footer>
|
||||
|
||||
|
|
|
|||
|
|
@ -58,4 +58,16 @@
|
|||
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 {Store} from '@ngrx/store';
|
||||
import {StateInterface} from '../../redux/reducers';
|
||||
import {NgClass} from '@angular/common';
|
||||
|
||||
|
||||
@Component({
|
||||
|
|
@ -15,7 +16,8 @@ import {StateInterface} from '../../redux/reducers';
|
|||
FiltersGroup,
|
||||
BottomNavigation,
|
||||
FeedbackButton,
|
||||
BotTalks
|
||||
BotTalks,
|
||||
NgClass
|
||||
],
|
||||
templateUrl: './main.html',
|
||||
styleUrl: './main.scss'
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
}
|
||||
|
||||
<div class="row filters-row">
|
||||
<sae-filters-group [hideChipsList]="true"></sae-filters-group>
|
||||
<sae-filters-group [disabled]="disabledFilters" [hideChipsList]="true"></sae-filters-group>
|
||||
</div>
|
||||
</header>
|
||||
<main>
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@ export class SimilarCases {
|
|||
public appState: any = {};
|
||||
activeTab: string = "summarized";
|
||||
displayHeaderTabs: boolean = false;
|
||||
disabledFilters: boolean = true;
|
||||
|
||||
constructor(private store: Store<StateInterface>) {
|
||||
this.store.select(state => state.app).subscribe(app => {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
<div class="translate-texts is-{{disabled? 'disabled' : 'enabled'}}">
|
||||
|
||||
|
||||
<div id="fromText">
|
||||
<div [ngClass]="{
|
||||
'is-focused' : fromTextFocused
|
||||
}" id="fromText">
|
||||
|
||||
@if (!fileIsUploaded || !appState.fromText.length) {
|
||||
<!-- @if (appState.fromText.length == 0) {-->
|
||||
|
|
@ -46,9 +48,10 @@
|
|||
@if (!fileIsUploaded) {
|
||||
<textarea
|
||||
(focus)="focusFromText()"
|
||||
(blur)="blurFromText()"
|
||||
(keyup)="onFromTextChanged()"
|
||||
(ngModelChange)="onFromTextChanged()"
|
||||
[(ngModel)]="appState.fromText"
|
||||
[ngModel]="appState.fromText"
|
||||
cols="30"
|
||||
id="from_text"
|
||||
name="from_text"
|
||||
|
|
@ -57,7 +60,9 @@
|
|||
}
|
||||
</div>
|
||||
|
||||
<div id="toText">
|
||||
<div [ngClass]="{
|
||||
'is-focused' : toTextFocused
|
||||
}" id="toText">
|
||||
|
||||
@if (loadingResume) {
|
||||
<div class="loading-container">
|
||||
|
|
@ -72,9 +77,13 @@
|
|||
<button (click)="emptyText('toText')" class="delete-button button">x</button>
|
||||
}
|
||||
@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>
|
||||
|
||||
|
|
|
|||
|
|
@ -17,13 +17,17 @@
|
|||
background: white;
|
||||
height: 235px;
|
||||
width: 648px;
|
||||
overflow-y: auto;
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
|
||||
|
||||
textarea {
|
||||
padding: variables.$spacing-4 42px variables.$spacing-4 variables.$spacing-4;
|
||||
}
|
||||
|
||||
&.is-focused {
|
||||
outline: 3px solid #255B8E;
|
||||
}
|
||||
}
|
||||
|
||||
.delete-button {
|
||||
|
|
@ -77,6 +81,10 @@
|
|||
line-height: 140%;
|
||||
width: 370px;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.click-file-upload {
|
||||
|
|
|
|||
|
|
@ -17,7 +17,8 @@ export class TranslateTexts {
|
|||
public loadingResume: boolean = false;
|
||||
public mode: string = 'demo';
|
||||
public debounceEnabled: boolean = true;
|
||||
public textFocused: boolean = false;
|
||||
public fromTextFocused: boolean = false;
|
||||
public toTextFocused: 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)
|
||||
// launch request
|
||||
// in demo mode, fill some filters
|
||||
|
|
@ -61,14 +62,68 @@ export class TranslateTexts {
|
|||
// in demo mode, load demo filters
|
||||
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.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.debounceEnabled ? this.debounceDuration : 0);
|
||||
}
|
||||
|
|
@ -80,7 +135,14 @@ export class TranslateTexts {
|
|||
|
||||
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
|
||||
if (this.mode !== 'production') {
|
||||
this.loadingResume = true;
|
||||
|
|
@ -94,13 +156,14 @@ export class TranslateTexts {
|
|||
this.fromTimeout = setTimeout(() => {
|
||||
// in demo mode, make a fake resume
|
||||
console.log('demo mode')
|
||||
this.toText = "Résumé de démo à titre d'exemple"
|
||||
|
||||
this.loadingResume = false;
|
||||
|
||||
this.store.dispatch({
|
||||
type: ActionTypes.UPDATE_APP,
|
||||
state: {
|
||||
displayBot: true
|
||||
payload: {
|
||||
displayBot: true,
|
||||
toText: "Résumé de démo à titre d'exemple"
|
||||
}
|
||||
})
|
||||
|
||||
|
|
@ -140,10 +203,19 @@ export class TranslateTexts {
|
|||
}
|
||||
|
||||
focusFromText(e?: any) {
|
||||
console.log('focus from text', e)
|
||||
console.log('focus from text')
|
||||
this.onRemoveFileSelected()
|
||||
// this.fromText = ' '
|
||||
this.textFocused = true
|
||||
this.fromTextFocused = true
|
||||
}
|
||||
|
||||
blurFromText() {
|
||||
this.fromTextFocused = false
|
||||
}
|
||||
|
||||
focusToText() {
|
||||
this.toTextFocused = true
|
||||
}
|
||||
|
||||
blurToText() {
|
||||
this.toTextFocused = false
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue