All files / app/features/picture/components/pending-banner pending-banner.component.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
2x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
<ui-banner data-testid="pending-banner">
    <div
        class="pending-banner__header"
        [class.pending-banner__header--delete]="pending().pendingType === 'delete'"
    >
        <ui-icon
            name="schedule"
            class="pending-banner__icon"
            tooltip="Ожидает модерации"
        />
        <span
            class="pending-banner__text"
            data-testid="pending-banner-text"
        >
            {{ pendingLabel() }}
        </span>
    </div>
 
    @if (!isOwn()) {
        <div
            class="pending-banner__author"
            data-testid="pending-banner-author"
        >
            {{ pending().user }}
        </div>
    }
 
    @if (hasNewTitle()) {
        <div
            class="pending-banner__preview-title"
            data-testid="pending-banner-new-title"
        >
            {{ pending().title }}
        </div>
    }
 
    @if (hasNewImage()) {
        <img
            class="pending-banner__preview-image"
            [src]="pending().pendingImageUrl"
            alt="Превью нового изображения"
            tabindex="0"
            role="button"
            data-testid="pending-banner-new-image"
            (click)="emitImageClick()"
            (keydown.enter)="emitImageClick()"
            (keydown.space)="emitImageClick(); $event.preventDefault()"
        />
    }
 
    <div class="pending-banner__actions">
        @if (isOwn()) {
            <ui-button
                variant="outlined"
                testId="pending-banner-cancel"
                [disabled]="isBusy()"
                (click)="emitAction('cancel')"
            >
                Отменить
            </ui-button>
        } @else if (canModerate()) {
            <ui-button
                variant="outlined"
                accent="success"
                testId="pending-banner-approve"
                [disabled]="isBusy()"
                (click)="emitAction('approve')"
            >
                Одобрить
            </ui-button>
            <ui-button
                variant="outlined"
                accent="danger"
                testId="pending-banner-reject"
                [disabled]="isBusy()"
                (click)="emitAction('reject')"
            >
                Отклонить
            </ui-button>
        }
    </div>
</ui-banner>