Skip to content

Commit 12cf11f

Browse files
AwakichAwakich
committed
add modals for no-projects, success & success invite logic
1 parent 7f401c3 commit 12cf11f

4 files changed

Lines changed: 204 additions & 184 deletions

File tree

‎projects/social_platform/src/app/office/features/detail/detail.component.html‎

Lines changed: 117 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -195,103 +195,6 @@
195195
</a>
196196
} }
197197

198-
<!-- <app-modal [open]="showSubmitProjectModal()" (openChange)="toggleSubmitProjectModal()">
199-
<div class="cancel">
200-
<div class="cancel__top">
201-
<p class="cancel__title text-body-14">
202-
{{
203-
memberProjects.length > 0 ? "выберите проект для подачи" : "создай свой проект!"
204-
}}
205-
</p>
206-
<p class="cancel__text text-body-10">
207-
{{
208-
memberProjects.length > 0
209-
? "после выбора проекта будет создан дубликат данного проекта для заполнения под конкретный конкурс"
210-
: "создай проект и не забудь вернуться в программу для его подачи"
211-
}}
212-
</p>
213-
214-
<div class="project">
215-
<ul
216-
class="project__list"
217-
[class.project__list--scrollable]="memberProjects.length > 3"
218-
>
219-
@for (project of memberProjects; track project.id) {
220-
<li class="project__item">
221-
<div class="project__item--info">
222-
<app-avatar [url]="project.imageAddress" [size]="40"></app-avatar>
223-
<p class="text-body-12">
224-
{{ project.name | truncate: 20 }}
225-
</p>
226-
</div>
227-
<app-input
228-
type="radio"
229-
[appValue]="project.id.toString()"
230-
[checked]="selectedProjectId === project.id"
231-
(change)="onProjectRadioChange($event)"
232-
></app-input>
233-
</li>
234-
}
235-
</ul>
236-
</div>
237-
</div>
238-
239-
<div class="cancel__buttons" style="margin: 0; flex-direction: column">
240-
@if (memberProjects.length > 0) {
241-
<app-button
242-
size="medium"
243-
class="cancel__button"
244-
customTypographyClass="text-body-12"
245-
[disabled]="!isProjectSelected"
246-
[class.cancel__button--disabled]="!isProjectSelected"
247-
(click)="addProjectModal()"
248-
>
249-
выбрать проект
250-
</app-button>
251-
252-
<p class="text-body-12">или</p>
253-
}
254-
255-
<app-button
256-
style="margin: 0"
257-
size="medium"
258-
class="cancel__button"
259-
(click)="addNewProject()"
260-
customTypographyClass="text-body-12"
261-
>создать новый проект</app-button
262-
>
263-
</div>
264-
</div>
265-
</app-modal> -->
266-
267-
<!-- <app-modal
268-
[open]="isAssignProjectToProgramModalOpen()"
269-
(openChange)="isAssignProjectToProgramModalOpen.set(!isAssignProjectToProgramModalOpen)"
270-
>
271-
<div class="cancel" style="padding: 24px">
272-
<div class="cancel__top">
273-
<p class="cancel__title text-body-14">поздравляем!</p>
274-
</div>
275-
276-
<p class="text-body-10 cancel__text">
277-
мы создали дубликат проекта, который вы привязали к выбранной программе
278-
<span
279-
><strong>{{ assignProjectToProgramModalMessage()?.partnerProgram }}</strong></span
280-
>
281-
, теперь его можно отредактировать!
282-
</p>
283-
284-
<app-button
285-
size="medium"
286-
class="cancel__button"
287-
customTypographyClass="text-body-12"
288-
(click)="closeAssignProjectToProgramModal()"
289-
>
290-
вперед
291-
</app-button>
292-
</div>
293-
</app-modal> -->
294-
295198
<app-modal
296199
[open]="isAssignProjectToProgramModalOpen()"
297200
(openChange)="
@@ -554,11 +457,10 @@ <h3 class="text-body-14 cancel__title" style="flex-wrap: wrap; width: 90%">
554457
>
555458
} @else {
556459
<app-button
557-
style="opacity: 0.5"
558460
size="medium"
559461
appearance="outline"
560-
[disabled]="true"
561462
customTypographyClass="text-body-12"
463+
(click)="inviteUser()"
562464
>пригласить</app-button
563465
>
564466
} @if (+profile.id !== +info().id) {
@@ -607,6 +509,122 @@ <h3 class="text-body-12 lists__title">подтвердить владение н
607509
</ul>
608510
}
609511
</app-modal>
512+
513+
@if (!showNoProjectsModal && showSendInviteModal) {
514+
<app-modal
515+
[open]="showSendInviteModal"
516+
(openChange)="showSendInviteModal = !showSendInviteModal"
517+
>
518+
<form class="project__invites" [formGroup]="inviteForm">
519+
@if (profileProjects().length) {
520+
<ul
521+
class="approve project__list"
522+
style="padding: 0"
523+
[class.project__list--scrollable]="profileProjects().length > 3"
524+
>
525+
<div class="lists__section">
526+
<h3 class="text-body-12 lists__title">выберите проект и роль для приглашения.</h3>
527+
<i
528+
appIcon
529+
icon="medal"
530+
class="lists__icon"
531+
style="margin-top: 1px"
532+
appSquare="12"
533+
></i>
534+
</div>
535+
536+
@for (project of profileProjects(); track project.id) {
537+
<li class="project__item">
538+
<div class="project__item--info">
539+
<app-avatar [url]="project.imageAddress" [size]="40"></app-avatar>
540+
<p class="text-body-12">
541+
{{ project.name | truncate: 20 }}
542+
</p>
543+
</div>
544+
<app-input
545+
type="radio"
546+
[appValue]="project.id.toString()"
547+
[checked]="selectedProjectId === project.id"
548+
(change)="onProjectRadioChange($event)"
549+
></app-input>
550+
</li>
551+
} @if (inviteForm.get("role"); as role) {
552+
<fieldset class="invite__role">
553+
<app-input
554+
size="big"
555+
id="invite_role"
556+
formControlName="role"
557+
[error]="role | controlError"
558+
placeholder="укажите роль в проекте"
559+
></app-input>
560+
@if ((role | controlError: "required")) {
561+
<div class="text-body-10 error">
562+
{{ errorMessage.VALIDATION_REQUIRED }}
563+
</div>
564+
}
565+
</fieldset>
566+
}
567+
568+
<app-button
569+
(click)="sendInvite()"
570+
customTypographyClass="text-body-12"
571+
appearance="outline"
572+
size="big"
573+
>
574+
<span>отправить приглашение</span>
575+
<i appIcon icon="plus" appSquare="8"></i>
576+
</app-button>
577+
</ul>
578+
}
579+
</form>
580+
</app-modal>
581+
}
582+
583+
<app-modal
584+
[open]="showNoProjectsModal"
585+
(openChange)="showNoProjectsModal = !showNoProjectsModal"
586+
>
587+
<div class="cancel" style="padding: 0px">
588+
<div class="cancel__top">
589+
<p class="cancel__title text-body-14">вы не являетесь лидером ни в одном проекте</p>
590+
</div>
591+
592+
<i appIcon icon="sad-smile" appSquare="50" style="margin: 36px 0px"></i>
593+
594+
<app-button
595+
style="width: 100%"
596+
customTypographyClass="text-body-12"
597+
size="big"
598+
(click)="routingToMyProjects()"
599+
>перейти в проекты</app-button
600+
>
601+
</div>
602+
</app-modal>
603+
604+
<app-modal
605+
[open]="showSuccessInviteModal"
606+
(openChange)="showSuccessInviteModal = !showSuccessInviteModal"
607+
>
608+
<div class="cancel" style="padding: 0px; width: 350px">
609+
<i appIcon icon="check" class="cancel__success" appSquare="60"></i>
610+
611+
<p
612+
class="cancel__title text-body-12"
613+
style="color: var(--grey-for-text); margin: 17px 0px"
614+
>
615+
приглашение отправлено
616+
</p>
617+
618+
<app-button
619+
style="width: 100%"
620+
customTypographyClass="text-body-12"
621+
size="big"
622+
(click)="routingToMyProjects()"
623+
>перейти в проекты</app-button
624+
>
625+
</div>
626+
</app-modal>
627+
610628
} @if (profile) { @if (profile.id === info().id) {
611629
<app-modal [open]="isProfileFill" (openChange)="isProfileFill = !isProfileFill">
612630
<div class="cancel">
@@ -655,25 +673,6 @@ <h3 class="text-body-12 lists__title">подтвердить владение н
655673
</p>
656674
</div>
657675
</app-modal>
658-
659-
<!-- <app-modal [open]="isSended" (openChange)="isSended = !isSended">
660-
<div class="cancel">
661-
<div class="cancel__top">
662-
<i
663-
(click)="isSended = false"
664-
appIcon
665-
appSquare="10"
666-
icon="cross"
667-
class="cancel__cross"
668-
></i>
669-
<p class="cancel__title text-body-14">твое CV уже ждет тебя на почте :)</p>
670-
</div>
671-
<p class="text-body-10 cancel__text">
672-
кстати, оно часто залетает в папку «Спам» — обязательно проверь и там тоже.<br />
673-
Технические сложности? Мы всегда на связи в Telegram — {{ "@procollab_support" }}
674-
</p>
675-
</div>
676-
</app-modal> -->
677676
</ng-template>
678677

679678
<router-outlet></router-outlet>

‎projects/social_platform/src/app/office/features/detail/detail.component.scss‎

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -161,23 +161,24 @@ $detail-bar-mb: 12px;
161161
display: flex;
162162
flex-direction: column;
163163
gap: 10px;
164-
align-items: center;
165164
max-height: none;
166165

167166
&--scrollable {
168-
max-height: 180px;
167+
max-height: 250px;
169168
overflow-y: auto;
170169
}
171170
}
172171

172+
&__invites {
173+
max-height: 250px;
174+
}
175+
173176
&__item {
174177
display: flex;
175178
flex-grow: 1;
176179
align-items: center;
177180
justify-content: space-between;
178-
width: 300px;
179-
margin-bottom: 12px;
180-
margin-left: 40px;
181+
margin-top: 8px;
181182

182183
&--info {
183184
display: flex;
@@ -243,6 +244,11 @@ $detail-bar-mb: 12px;
243244
z-index: 2;
244245
cursor: pointer;
245246
}
247+
248+
&__success {
249+
margin-top: 10px;
250+
color: var(--green);
251+
}
246252
}
247253

248254
.support {

0 commit comments

Comments
 (0)