tykayn/ng-implementation
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

tab switch results

Browse source
This commit is contained in:
Tykayn 2025-09-15 17:46:00 +02:00 • committed by tykayn
parent 97ab7a0920
commit 89cb0f2635
16 changed files with 396 additions and 238 deletions
Download patch file Download diff file Expand all files Collapse all files

13
airwatch/src/app/chatbot/message-box/message-box.scss
View file

@ -2,9 +2,8 @@
:host {
width: 100%;
}
.avatar {
.avatar {
width: 32px;
height: 32px;
@ -23,10 +22,10 @@
}
}
}
.message {
.message {
.user-more-infos {
margin-top: -35px;
@ -139,10 +138,10 @@
}
}
}
}
.expanded-message-fullscreen {
.expanded-message-fullscreen {
display: none;
width: 50%;
@ -157,4 +156,6 @@
z-index: 100;
}
}
}

8
my-workspace/projects/sae-lib/buttons/copy/copy.html
View file

@ -1,7 +1,7 @@
<button class="button copy" (click)="copy()">
<button (click)="copy()" class="button copy">
<i class="ri-file-copy-2-fill"></i>
<span class="label">
Copy
</span>
<!-- <span class="label">-->
<!-- Copy-->
<!-- </span>-->
</button>

25
my-workspace/projects/sae-lib/chatbot/bot-talks/bot-talks.html
View file

@ -2,21 +2,22 @@
<!-- bot talks land-->
<!-- avatar-->
<div class="bubble">
<div class="message">
{{ message }}
<br>
<!-- @for (link of links; track link.title) {-->
<!-- <span class="link-title">-->
</div>
@if (appState?.dicaReference) {
<!-- {{ link.title }}-->
<!-- </span>-->
<!-- <span class="taget">-->
<!-- <a href="{{link.url}}">-->
<div class="dica-ref-container">
<!-- {{ link.label }}-->
<!-- &lt;!&ndash; copy button&ndash;&gt;-->
<!-- </a>-->
<!-- </span>-->
<!-- }-->
<div class="label">
Référence de DICA:
</div>
<div class="ref">
{{ appState.dicaReference }}
<app-copy [textToCopy]="appState.dicaReferenceURL"></app-copy>
</div>
</div>
}
</div>
<div class="avatar"></div>

35
my-workspace/projects/sae-lib/chatbot/bot-talks/bot-talks.scss
View file

@ -10,6 +10,36 @@
display: flex;
flex-direction: row;
align-items: center;
.message {
margin-bottom: 16px;
}
.dica-ref-container {
display: flex;
flex-direction: row;
align-items: center;
gap: 5px;
.label {
font-weight: 600;
}
.ref {
display: flex;
padding: 6px 10px 8px 10px;
align-items: center;
gap: 5px;
border-radius: 20px;
background: #C2A9FD;
}
}
}
.bubble {
@ -34,4 +64,9 @@
height: 32px;
border-radius: 8px;
}
app-copy button.copy {
background: transparent !important;
border: 0;
}
}

14
my-workspace/projects/sae-lib/chatbot/bot-talks/bot-talks.ts
View file

@ -1,18 +1,16 @@
import {Component, Input} from '@angular/core';
import {Copy} from '../../buttons/copy/copy';
@Component({
selector: 'sae-bot-talks',
imports: [],
imports: [
Copy
],
templateUrl: './bot-talks.html',
styleUrl: './bot-talks.scss'
})
export class BotTalks {
@Input() public message = 'Hello!';
@Input() public links: any = [
{
title: 'Refusal notice :',
label: 'DMP-00051341: Avis de refus',
url: 'https://www.cipherbliss.com/fake-link',
}]
@Input() public message: string = 'Hello!';
@Input() public appState: any = {};
}

8
sae-csc/src/app/app.html
View file

@ -1,14 +1,10 @@
<html>
<head>
<title>CSC implémentation</title>
<title>CSC Solution Matcher</title>
</head>
<body>
<!--<pre>-->
<!-- currentUrl:-->
<!-- {{ currentUrl }}-->
<!--</pre>-->
@if (currentUrl !== '/login' && currentUrl !== '/') {
<app-top-navigation [user]="appState.user"></app-top-navigation>
<app-top-navigation [user]="user"></app-top-navigation>
<sae-feedback-button></sae-feedback-button>
}
<router-outlet/>

4
sae-csc/src/app/app.ts
View file

@ -18,6 +18,7 @@ export class App {
public router = inject(Router);
currentUrl: string = '';
public appState: any = {};
public user: any = {};
protected readonly title = signal('implem');
constructor(private store: Store<StateInterface>) {
@ -25,6 +26,9 @@ export class App {
this.store.select(state => state.app).subscribe(appState => {
this.appState = appState;
});
this.store.select(state => state.user).subscribe(user => {
this.user = user;
});
this.router.events.pipe(
filter(event => event instanceof NavigationEnd)
).subscribe((event: any) => {

52
sae-csc/src/app/pages/similar-cases/case-result/case-result.html
View file

@ -2,42 +2,51 @@
<!--case result-->
<div class="title">
-7B / 72-21-02 / Booster blades stg 3 / LPC STG.3 BLADES DISLOCATION / 894773
<span class="label">
<div class="button button-toggle chevron">v</div>
7B / 72-21-02 / Booster blades stg 3 / LPC STG.3 BLADES DISLOCATION / 894773
</span>
<i class="ri-arrow-down-s-line"></i>
</div>
<div class="row tabs">
<div (click)="selectCaseTab('information')" class="tab-item is-active">
<div (click)="selectCaseTab('information')" [ngClass]="{ 'is-active' : activeTab == 'information' }"
class="tab-item">
<i class="ri-file-list-2-line"></i>
<div class="label">
Information
</div>
</div>
<div (click)="selectCaseTab('original_question')" class="tab-item">
<div (click)="selectCaseTab('original_question')" [ngClass]="{ 'is-active' : activeTab == 'information' }"
class="tab-item">
<i class="ri-file-list-2-line"></i>
<div class="label">
Original Question
</div>
</div>
<div (click)="selectCaseTab('answer_sent')" class="tab-item">
<div (click)="selectCaseTab('answer_sent')" [ngClass]="{ 'is-active' : activeTab == 'information' }"
class="tab-item">
<i class="ri-file-list-2-line"></i>
<div class="label">
Answer Sent
</div>
</div>
<div (click)="selectCaseTab('engine_part')" class="tab-item">
<div (click)="selectCaseTab('engine_part')" [ngClass]="{ 'is-active' : activeTab == 'information' }"
class="tab-item">
<i class="ri-file-list-2-line"></i>
<div class="label">
Engine part
</div>
</div>
<div (click)="selectCaseTab('findings')" class="tab-item">
<div (click)="selectCaseTab('findings')" [ngClass]="{ 'is-active' : activeTab == 'information' }" class="tab-item">
<i class="ri-file-list-2-line"></i>
<div class="label">
Findings
</div>
</div>
<div (click)="selectCaseTab('dica')" class="tab-item">
<div (click)="selectCaseTab('dica')" [ngClass]="{ 'is-active' : activeTab == 'information' }" class="tab-item">
<i class="ri-file-list-2-line"></i>
<div class="label">
DICA
@ -46,31 +55,40 @@
</div>
<div class="row selected-tab-content summary">
@if (activeTab == 'info') {
<strong>
AI’s summary :</strong>
<div class="content">
{{ case.info }}
</div>
}
@if (activeTab == 'dica') {
{{ case.DICA }}
{{ case.DICA_file }}
}
AI’s summary :</strong> Work stoppage case for CFM56-7B engine (ESN: 894773) at MTU Zhuhai. LPC Stage 3 blade
platform
dislocation detected during shop visit BSI. Maximum dislocation: 1.22mm axial, 0.63mm radial. Customer requests
evaluation, acceptance criteria, or DICA for further action. No corresponding limits in AMM 72-00-00 BSI inspection
chapter.
</div>
<div class="row case-more-infos">
<div class="info-item">
<span class="label">Date :</span>
<span class="value">2023-12-12</span>
<span class="value">{{ case.date }}</span>
</div>
<div class="info-item">
<span class="label">Chrono ID :</span>
<span class="value">CSC/CFM/2023-10/00446-A</span>
<span class="value">{{ case.chrono_id }}</span>
</div>
<div class="info-item">
<span class="label">Responsable Team :</span>
<span class="value">FO-CFM</span>
<span class="value">{{ case.responsable_team }}</span>
</div>
<div class="info-item">
<span class="label">GE Instruction:</span>
<span class="value">-</span>
<span class="value">{{ case.ge_instruction }}</span>
</div>
</div>
</div>

8
sae-csc/src/app/pages/similar-cases/case-result/case-result.scss
View file

@ -51,10 +51,16 @@
flex-direction: row;
align-items: start;
padding-bottom: 6px;
cursor: pointer;
label {
padding-left: 6px;
display: inline-block;
display: block;
flex-grow: 1;
}
&:hover {
font-weight: 600;
}
&.is-active {

9
sae-csc/src/app/pages/similar-cases/case-result/case-result.ts
View file

@ -1,19 +1,20 @@
import {Component, Input} from '@angular/core';
import {NgClass} from '@angular/common';
@Component({
selector: 'app-case-result',
imports: [],
imports: [
NgClass
],
templateUrl: './case-result.html',
styleUrl: './case-result.scss'
})
export class CaseResult {
@Input() case: any = {};
public activeTab: string = ''
public activeTab: string = 'information'
selectCaseTab(activeTab: string) {
console.log('todo')
this.activeTab = activeTab
}
}

56
sae-csc/src/app/pages/similar-cases/similar-cases.html
View file

@ -12,7 +12,7 @@
New question
<i class="ri-chat-ai-line"></i>
</button>
<button class="button">
<button class="button search-solutions">
Search solutions
<i class="ri-search-2-line"></i>
</button>
@ -21,8 +21,6 @@
@if (displayHeaderTabs) {
<div class="post-tabs">
<div class="tabs">
<div (click)="activeTab = 'summarized'"
[ngClass]="{ 'is-active' : activeTab == 'summarized' }"
class="tab-item ">
@ -40,8 +38,6 @@
} @else {
<!-- original question-->
{{ appState.fromText }}
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto cum dolor fugit illo laboriosam necessitatibus neque placeat quam ullam unde. Accusamus asperiores, aspernatur atque autem commodi, dicta doloremque doloribus enim error et illo ipsam labore laborum libero natus necessitatibus nemo officiis perferendis placeat, quo reprehenderit sapiente sint vitae voluptatem voluptatum?
}
</div>
</div>
@ -53,10 +49,11 @@
</header>
<main>
<div class="row bot-talks">
<div class="row-bot-talks">
<sae-bot-talks
[links]="[{}]"
[message]="'I found useful document(s) which can help to answer to this question ! Check if these documents are applied to similar cases'"></sae-bot-talks>
[appState]="appState"
[message]="'I found useful document(s) which can help to answer to this question ! Check if these documents are applied to similar cases'"
></sae-bot-talks>
</div>
<div class="tabs-container">
@ -64,13 +61,25 @@
<div class="columns">
<div class="column">
<div class="tab-button similar is-active">
<div
(click)="displayedTab = 'similar-cases'"
[ngClass]="{ 'is-active' : displayedTab == 'similar-cases' }"
class="tab-button similar "
>
Similar cases
</div>
</div>
<div class="column">
<div class="tab-button tech-manual">
Technical manual
<div
(click)="displayedTab = 'technical-manual'"
[ngClass]="{ 'is-active' : displayedTab == 'technical-manual' }"
class="tab-button tech-manual">
Associated documents
@if (appState.technicalManuals.length > 0) {
<span class="indicator"></span>
}
</div>
</div>
</div>
@ -78,9 +87,12 @@
<div class="tabs-body">
<div class="tabs-search">
<i class="ri-search-2-line search"></i>
<!-- <i class="ri-search-2-line search"></i>-->
<input class="search" placeholder="Use keywords for a precise research" type="text">
<button (click)="filterResults()" class="search-submit">
<i class="ri-send-plane-fill"></i>
</button>
</div>
<div class="tabs-results">
{{ appState.similarCases.length }} cases found, 3 cases suggested
@ -89,15 +101,15 @@
@if (displayedTab == 'similar-cases') {
<div id="similar_cases_tab">
<div class="row">
<div class="columns">
<div class="toggle-ai-suggestion column">
AI suggestions
<!-- applied-->
<!-- disabled-->
</div>
</div>
</div>
<!-- <div class="row">-->
<!-- <div class="columns">-->
<!-- <div class="toggle-ai-suggestion column">-->
<!-- AI suggestions-->
<!-- &lt;!&ndash; applied&ndash;&gt;-->
<!-- &lt;!&ndash; disabled&ndash;&gt;-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<div class="row cases-results">
<!-- boucle des résultats-->
@ -114,6 +126,8 @@
<div id="technical_manuals_tab">
<sae-bot-talks></sae-bot-talks>
(les manuels ici)
</div>
}
</div>

70
sae-csc/src/app/pages/similar-cases/similar-cases.scss
View file

@ -3,6 +3,16 @@
padding: 64px;
.indicator {
background: green;
width: 8px;
height: 8px;
border-radius: 100%;
margin-left: 16px;
display: inline-block;
}
.title-box {
color: #1B1D27;
font-family: Barlow;
@ -47,6 +57,12 @@
+ button {
margin-left: 4px;
}
&.search-solutions {
border-radius: 10px;
color: white;
background: var(--Gradient, linear-gradient(77deg, #073A7C -4.23%, #1767AD 51.8%, #255B8E 87.72%));
}
}
}
@ -54,6 +70,7 @@
border-radius: 10px;
background: #E3EAF1;
padding: 16px;
margin-top: 16px;
.tabs {
display: flex;
@ -105,10 +122,19 @@
}
}
.row-bot-talks {
margin-top: 1rem;
margin-bottom: 1rem;
}
.toggle-ai-suggestion {
color: #A86CFD;
}
.tabs-container {
margin-top: 32px;
}
.tabs-body {
padding: 24px 20px;
gap: 32px;
@ -126,9 +152,46 @@
line-height: 16px;
width: 100%;
min-width: 976px;
display: block;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 16px;
margin: 5px auto;
.search {
}
input {
width: 976px;
padding: 16px;
border: 0;
border-radius: 8px 0 0 8px;
background: #FFF;
}
.search-submit {
display: inline-flex;
padding: 9px 14px;
align-items: center;
gap: 10px;
border: 0;
display: inline-flex;
padding: 9px 14px;
align-items: center;
gap: 10px;
color: white;
height: 51px;
border-radius: 0 8px 8px 0;
background: linear-gradient(145deg, #55BCEC -21.82%, #005AA2 82.35%);
i {
font-size: 1.5rem;
}
}
}
.tabs-results {
@ -175,10 +238,7 @@
#similar_cases_tab {
.cases-results {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 16px;
app-case-result {
margin-bottom: 8px;

6
sae-csc/src/app/pages/similar-cases/similar-cases.ts
View file

@ -5,7 +5,6 @@ import {BottomNavigation} from '../../shared/navigation/bottom-navigation/bottom
import {StateInterface} from '../../redux/reducers';
import {Store} from '@ngrx/store';
import {NgClass} from '@angular/common';
import {MainButton} from 'sae-lib/buttons/main-button/main-button';
@Component({
selector: 'app-similar-cases',
@ -14,7 +13,7 @@ import {MainButton} from 'sae-lib/buttons/main-button/main-button';
CaseResult,
BottomNavigation,
NgClass,
MainButton,
],
templateUrl: './similar-cases.html',
styleUrl: './similar-cases.scss'
@ -33,4 +32,7 @@ export class SimilarCases {
});
}
filterResults() {
}
}

35
sae-csc/src/app/redux/initialState.ts
View file

@ -7,14 +7,21 @@ export const initialState: StateInterface = {
backendAPIRoot: "",
demoMode: true,
loading: false,
// fromText: "le texte",
fromText: "",
fromText: "le texte original",
// fromText: "",
fromFile: "",
toText: "",
botMessage: "",
dicaReference: "azhe ekhjfhkj e hkjzekjh",
dicaReferenceURL: "fgkj kjrjgik .pdf",
associatedDocuments: [{
label: 'un doc',
url: 'https://www.cipherbliss.com/un doc.pdf',
}],
filters: {
engineType: {
availableList: [{
label: 'choix 1',
value: 'choix 1',
}],
@ -47,6 +54,7 @@ export const initialState: StateInterface = {
similarCases: [
{
id: 1,
title: "7B / 72-21-02 / Booster blades stg 3 / LPC STG.3 BLADES DISLOCATION / 894773",
info: "Work stoppage case for CFM56-7B engine (ESN: 894773) at MTU Zhuhai. LPC Stage 3 blade platform dislocation detected during shop visit BSI. Maximum dislocation: 1.22mm axial, 0.63mm radial. Customer requests evaluation, acceptance criteria, or DICA for further action. No corresponding limits in AMM 72-00-00 BSI inspection chapter. ",
date: "2023-01-01",
chrono_id: "CSC/CFM/2023-10/00446-A",
@ -58,25 +66,29 @@ export const initialState: StateInterface = {
findings: "some findings were found here",
DICA: "one dica stuff",
DICA_file: "dica_file.pdf",
suggested: true,
}, {
id: 1,
id: 2,
title: "21-02 / Booster blades stg 3 / HOP / 894773",
info: "Bhlah lahl hl lhalhadlh No corresponding limits in AMM 72-00-00 BSI inspection chapter. ",
date: "2024-07-08",
chrono_id: "CSC/CFM/1234-10/00446-A",
responsable_team: "FO-CFM",
ge_instruction: "-",
responsable_team: "FO-ZERSEDGF",
ge_instruction: "sdifojsfdgjifkilj",
original_question: "blah abl a a jjdbblja bajdblad blab ladlb kaabl",
answer_sent: "dfosdoo osg ogf ogf kgof gfkdmdm gfkdfmkl km opsg gfsok sfol lorem",
engine_part: "ABD cd CD DC DC ZFR ETT HETHG",
findings: "some findings were found here",
DICA: "one dica stuff",
DICA_file: "dica_file_2.pdf",
suggested: true,
}, {
id: 1,
id: 3,
title: "21-02 / Stuff happens / HOP / 132316548564",
info: "Work stoppage case for CFM56-7B engine (ESN: 894773) at MTU Zhuhai. LPC Stage 3 blade platform dislocation detected during shop visit BSI. Maximum dislocation: 1.22mm axial, 0.63mm radial. Customer requests evaluation, acceptance criteria, or DICA for further action. No corresponding limits in AMM 72-00-00 BSI inspection chapter. ",
date: "2023-01-01",
chrono_id: "CSC/CFM/2023-10/00446-A",
responsable_team: "FO-CFM",
responsable_team: "FO-ABC",
ge_instruction: "-",
original_question: "blah abl a a jjdbblja bajdblad blab ladlb kaabl",
answer_sent: "dfosdoo osg ogf ogf kgof gfkdmdm gfkdfmkl km opsg gfsok sfol lorem",
@ -84,11 +96,18 @@ export const initialState: StateInterface = {
findings: "some findings were found here",
DICA: "one dica stuff",
DICA_file: "dica_file.pdf",
suggested: false,
},
],
searchInput: "",
enableAiSuggestion: false,
technicalManuals: [],
technicalManuals: [{
id: '123',
title: 'le manuel 123',
// content: 'blzdlbzdblzblzlb',
// url: 'example.com/url.pdf',
}],
resumeTitle: "Work stoppage case for CFM56-7B engine (ESN: 802379)...",
admin: {
pendingUsers: {},

24
sae-csc/src/app/redux/reducers/index.ts
View file

@ -71,17 +71,18 @@ export type SelectFilterType = {
}
export type technicalManualType = {
id: string;
title: string;
information: string;
originalQuestion: string;
answerSent: string;
caseSummary: string;
enginePart: object;
findings: object;
date: object;
chronoId: string;
teamInCharge: string;
partNumber: string;
// information: string;
// originalQuestion: string;
// answerSent: string;
// caseSummary: string;
// enginePart: object;
// findings: object;
// date: object;
// chronoId: string;
// teamInCharge: string;
// partNumber: string;
}
export type AppActions =
| UpdateUserAction
@ -106,6 +107,9 @@ export interface StateInterface {
fromText: string,
toText: string,
botMessage: string,
dicaReference: string,
dicaReferenceURL: string,
associatedDocuments: Array<any>,
filters: {
engineType: SelectFilterType,
findings: SelectFilterType,

5
sae-csc/src/app/shared/navigation/top-navigation/top-navigation.html
View file

@ -38,12 +38,11 @@
<!-- exit-->
<i class="ri-door-line"></i>
</a>
@if (appState.user) {
@if (user) {
<a class="navbar-item user-account-item">
<!-- user -->
<i class="ri-user-2-fill"></i>
{{ appState.user.login }}
{{ user.login }}
</a>
}