96 lines
2.8 KiB
HTML
96 lines
2.8 KiB
HTML
<mat-card class="confirm-card mat-elevation-z">
|
|
<mat-card-header>
|
|
<mat-card-title>{{ data.title }}</mat-card-title>
|
|
</mat-card-header>
|
|
<mat-card-content>
|
|
<div class="add-row">
|
|
<button
|
|
mat-button
|
|
*ngIf="!isShowAddGroupField"
|
|
(click)="isShowAddGroupField = !isShowAddGroupField"
|
|
class="mat-mini-fab mat-button-base mat-accent mat-elevation-z"
|
|
>
|
|
<mat-icon>add</mat-icon>
|
|
<span class="mat-fab__label">{{ 'group.addNew' | translate }}</span>
|
|
</button>
|
|
<div *ngIf="isShowAddGroupField" class="input-groupname-box">
|
|
<mat-form-field
|
|
hintLabel="{{
|
|
'common.useOnlyForSpecialCharacter'
|
|
| translate: { specialCharacter: '-,_' }
|
|
}}"
|
|
>
|
|
<input
|
|
matInput
|
|
#inputGroupName
|
|
type="text"
|
|
maxlength="20"
|
|
placeholder="{{ 'group.name' | translate }}"
|
|
value=""
|
|
/>
|
|
|
|
<button
|
|
mat-button
|
|
matSuffix
|
|
mat-icon-button
|
|
aria-label="Clear"
|
|
(click)="inputGroupName.value = ''"
|
|
>
|
|
<mat-icon>close</mat-icon>
|
|
</button>
|
|
|
|
<mat-hint align="end"
|
|
>{{ inputGroupName.value?.length || 0 }}/20</mat-hint
|
|
>
|
|
</mat-form-field>
|
|
|
|
<div class="btn-box">
|
|
<button mat-stroked-button (click)="onClickAddGroupCancel()">
|
|
{{ 'common.messages.close' | translate }}
|
|
</button>
|
|
<button
|
|
mat-stroked-button
|
|
color="accent"
|
|
(click)="onClickAddGroup(inputGroupName.value)"
|
|
class="mat-accent"
|
|
>
|
|
{{ 'group.addNew' | translate }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<mat-selection-list #groups>
|
|
<mat-list-option
|
|
*ngFor="let groupBuddy of groupBuddyList$ | async"
|
|
[value]="groupBuddy.group"
|
|
>
|
|
<span class="title-name ellipsis"> {{ groupBuddy.group.name }} </span>
|
|
<span class="text-accent-color number"
|
|
>({{ groupBuddy.buddyList.length
|
|
}}{{ 'common.units.persons' | translate }})</span
|
|
>
|
|
</mat-list-option>
|
|
</mat-selection-list>
|
|
<!-- <div>
|
|
<ucap-group-expansion-panel
|
|
#groupExpansionPanel
|
|
[groupBuddyList]="groupBuddyList$ | async"
|
|
[checkable]="true"
|
|
>
|
|
</ucap-group-expansion-panel>
|
|
</div> -->
|
|
</mat-card-content>
|
|
<mat-card-actions class="button-farm flex-row">
|
|
<button
|
|
mat-stroked-button
|
|
(click)="onClickChoice(false)"
|
|
class="mat-primary"
|
|
>
|
|
{{ 'common.messages.no' | translate }}
|
|
</button>
|
|
<button mat-flat-button (click)="onClickChoice(true)" class="mat-primary">
|
|
{{ 'common.messages.yes' | translate }}
|
|
</button>
|
|
</mat-card-actions>
|
|
</mat-card>
|