@chat21/chat21-ionic 3.4.16-rc1 → 3.4.16-rc2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -0
- package/package.json +1 -1
- package/src/app/components/conversation-detail/header-conversation-detail/header-conversation-detail.component.html +46 -44
- package/src/app/components/conversation-detail/header-conversation-detail/header-conversation-detail.component.scss +11 -1
package/CHANGELOG.md
CHANGED
package/package.json
CHANGED
|
@@ -9,55 +9,57 @@
|
|
|
9
9
|
<ion-title>
|
|
10
10
|
<ion-grid class="ion-no-padding ion-no-margin">
|
|
11
11
|
<ion-row>
|
|
12
|
-
<ion-col>
|
|
12
|
+
<ion-col [class.mobile]="isMobile">
|
|
13
13
|
<div *ngIf="conversationAvatar" class="avatar-and-typing-wpr" [ngClass]="{'mobile': isMobile}">
|
|
14
14
|
<!-- [ngStyle] = "{ 'left': platformName === 'ios' ? '55px' : '' }" -->
|
|
15
|
-
<div class="
|
|
16
|
-
<
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
<div class="info-container">
|
|
21
|
-
|
|
22
|
-
<!-- [ngClass] = "{ 'tile-info-with-ios': platformName === 'ios' ? '82px' : ''82px'' }" -->
|
|
23
|
-
<!-- (click)="onOpenCloseInfoConversation()" -->
|
|
24
|
-
<div class="tile-info-with"
|
|
25
|
-
[ngClass]="{ 'tile-info-with-ios': platformName === 'ios' }">
|
|
26
|
-
<span class="tile-username truncate">{{ conversationAvatar.conversation_with_fullname}} </span>
|
|
27
|
-
<!-- <span class="tile-username">{{ conversation_with_fullname }} </span> -->
|
|
15
|
+
<div class="conversation-info-container">
|
|
16
|
+
<div class="avatar-container" [ngClass]="{ 'avatar-container-ios': platformName === 'ios' }">
|
|
17
|
+
<app-avatar-profile
|
|
18
|
+
[itemAvatar]=conversationAvatar>
|
|
19
|
+
</app-avatar-profile>
|
|
28
20
|
</div>
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
<
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
<
|
|
21
|
+
<div class="info-container">
|
|
22
|
+
|
|
23
|
+
<!-- [ngClass] = "{ 'tile-info-with-ios': platformName === 'ios' ? '82px' : ''82px'' }" -->
|
|
24
|
+
<!-- (click)="onOpenCloseInfoConversation()" -->
|
|
25
|
+
<div class="tile-info-with"
|
|
26
|
+
[ngClass]="{ 'tile-info-with-ios': platformName === 'ios' }">
|
|
27
|
+
<span class="tile-username truncate">{{ conversationAvatar.conversation_with_fullname}} </span>
|
|
28
|
+
<!-- <span class="tile-username">{{ conversation_with_fullname }} </span> -->
|
|
29
|
+
</div>
|
|
30
|
+
|
|
31
|
+
<div class="subtitle-info">
|
|
32
|
+
<div class="conversation_project">
|
|
33
|
+
<!-- DIRECT CONV -->
|
|
34
|
+
<div *ngIf="isDirect">
|
|
35
|
+
<app-user-presence
|
|
36
|
+
[idUser]="conversationAvatar.conversation_with"
|
|
37
|
+
[isMobile]="isMobile"
|
|
38
|
+
[translationMap]="translationsMap">
|
|
39
|
+
</app-user-presence>
|
|
40
|
+
<!-- <svg xmlns="http://www.w3.org/2000/svg" height="15" width="15" viewBox="0 0 24 24" fill="#000000"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>
|
|
41
|
+
<span class="truncate">{{translationsMap.get('DIRECT_CHAT')}}</span> -->
|
|
42
|
+
</div>
|
|
43
|
+
<!-- GROUP CONV -->
|
|
44
|
+
<div *ngIf="conversationUid?.startsWith(CHANNEL_TYPE.GROUP)">
|
|
45
|
+
<svg xmlns="http://www.w3.org/2000/svg" height="15" width="15" viewBox="0 0 24 24" fill="#000000"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>
|
|
46
|
+
<span class="truncate">{{translationsMap.get('GROUP_CHAT')}}</span>
|
|
47
|
+
</div>
|
|
48
|
+
<!-- SUPPORT-GROUP CONV -->
|
|
49
|
+
<div *ngIf="conversationUid?.startsWith(CHANNEL_TYPE.SUPPORT_GROUP) && !IS_ON_MOBILE_DEVICE">
|
|
50
|
+
<img class="channel-icon" src="assets/images/channel_icons/chat21.svg" *ngIf="( (conversationAvatar?.request_channel && conversationAvatar?.request_channel === CHANNEL_TYPE.CHAT21) || !conversationAvatar?.request_channel) " >
|
|
51
|
+
<img class="channel-icon" src="assets/images/channel_icons/email-logo.svg" *ngIf="conversationAvatar?.request_channel && conversationAvatar?.request_channel === CHANNEL_TYPE.EMAIL" >
|
|
52
|
+
<img class="channel-icon" src="assets/images/channel_icons/form-logo_v2.svg" *ngIf="conversationAvatar?.request_channel && conversationAvatar?.request_channel === CHANNEL_TYPE.FORM" >
|
|
53
|
+
<img class="channel-icon" src="assets/images/channel_icons/messenger-logo.svg" *ngIf="conversationAvatar?.request_channel && conversationAvatar?.request_channel === CHANNEL_TYPE.MESSENGER" >
|
|
54
|
+
<img class="channel-icon" src="assets/images/channel_icons/whatsapp-logo.svg" *ngIf="conversationAvatar?.request_channel && conversationAvatar?.request_channel === CHANNEL_TYPE.WHATSAPP" >
|
|
55
|
+
<img class="channel-icon" src="assets/images/channel_icons/telegram-logo.svg" *ngIf="conversationAvatar?.request_channel && conversationAvatar?.request_channel === CHANNEL_TYPE.TELEGRAM" >
|
|
56
|
+
<img class="channel-icon" src="assets/images/channel_icons/voice.svg" *ngIf="conversationAvatar?.request_channel && conversationAvatar?.request_channel.startsWith(CHANNEL_TYPE.VOICE)" >
|
|
57
|
+
<span *ngIf="conversationAvatar?.project_name" class="truncate">{{conversationAvatar?.project_name}}</span>
|
|
58
|
+
<span *ngIf="!conversationAvatar?.project_name" class="truncate">{{conversationAvatar?.projectId}}</span>
|
|
59
|
+
</div>
|
|
58
60
|
</div>
|
|
61
|
+
|
|
59
62
|
</div>
|
|
60
|
-
|
|
61
63
|
</div>
|
|
62
64
|
</div>
|
|
63
65
|
<!-- COPILOT-OPTION -->
|
|
@@ -10,6 +10,7 @@ ion-header {
|
|
|
10
10
|
|
|
11
11
|
ion-toolbar{
|
|
12
12
|
height: var(--header-height);
|
|
13
|
+
--background: #fff;
|
|
13
14
|
&:not(.mobile){
|
|
14
15
|
--background: var(--list-bkg-color);
|
|
15
16
|
}
|
|
@@ -39,7 +40,9 @@ ion-header {
|
|
|
39
40
|
}
|
|
40
41
|
ion-grid{
|
|
41
42
|
ion-col:first-child{
|
|
42
|
-
|
|
43
|
+
&:not(.mobile){
|
|
44
|
+
min-width: calc(100% - 320px);
|
|
45
|
+
}
|
|
43
46
|
}
|
|
44
47
|
}
|
|
45
48
|
ion-avatar {
|
|
@@ -152,6 +155,7 @@ ion-header {
|
|
|
152
155
|
text-transform: unset;
|
|
153
156
|
padding: var(--button-padding);
|
|
154
157
|
border-radius: var(--button-border-radius);
|
|
158
|
+
font-size: 11px;
|
|
155
159
|
|
|
156
160
|
ion-icon{
|
|
157
161
|
margin-right: 4px;
|
|
@@ -174,11 +178,17 @@ ion-header {
|
|
|
174
178
|
|
|
175
179
|
.avatar-and-typing-wpr{
|
|
176
180
|
display: flex;
|
|
181
|
+
justify-content: space-between;
|
|
177
182
|
&.mobile{
|
|
178
183
|
margin-left: 25px;
|
|
179
184
|
}
|
|
180
185
|
}
|
|
181
186
|
|
|
187
|
+
.conversation-info-container{
|
|
188
|
+
display: flex;
|
|
189
|
+
flex-direction: row;
|
|
190
|
+
align-items: center;
|
|
191
|
+
}
|
|
182
192
|
.avatar-container {
|
|
183
193
|
// background-color: #fff;
|
|
184
194
|
color: #fff;
|