Skip to content

Commit 74eddfa

Browse files
committed
change design of profile detail page like a project detail page
1 parent 26a07e7 commit 74eddfa

18 files changed

Lines changed: 1034 additions & 1179 deletions
Lines changed: 224 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,224 @@
1+
<!-- @format -->
2+
3+
<div class="detail">
4+
<section class="detail__bar">
5+
<app-back [path]="backPath"></app-back>
6+
</section>
7+
8+
<!-- замена project на detail в классах -->
9+
<div class="detail__body">
10+
<!-- @if(program) {
11+
<div class="info detail__section detail__info">
12+
<div class="info__cover">
13+
<img
14+
class="info__cover"
15+
[src]="
16+
program.coverImageAddress
17+
? program.coverImageAddress
18+
: '/assets/images/office/profile/detail/cover.png'
19+
"
20+
alt="cover"
21+
/>
22+
<app-avatar
23+
class="info__avatar"
24+
[url]="program.imageAddress"
25+
[hasBorder]="true"
26+
borderColor="dark-grey"
27+
[size]="123"
28+
></app-avatar>
29+
</div>
30+
31+
<div class="info__body">
32+
<div class="info__actions">
33+
@if (!program.isUserMember && !program.isUserManager && !registerDateExpired) { @if
34+
(program.name.includes("Кейс-чемпионат MIR")) {
35+
<a href="https://case-champ.ru/corporate#rec1176757836">
36+
<app-button appearance="outline" size="medium" customTypographyClass="text-body-12">
37+
зарегистрироваться
38+
</app-button>
39+
</a>
40+
} @else {
41+
<a [routerLink]="['/office/program', program.id, 'register']">
42+
<app-button appearance="outline" size="medium" customTypographyClass="text-body-12">
43+
зарегистрироваться
44+
</app-button>
45+
</a>
46+
} } @else if (program.isUserMember) {
47+
<app-button
48+
size="medium"
49+
(click)="toggleSubmitProjectModal()"
50+
customTypographyClass="text-body-12 bar__add-project"
51+
>
52+
<span>подать проект</span>
53+
<i appIcon icon="plus" appSquare="10"></i>
54+
</app-button>
55+
} @else if (program.isUserManager) {
56+
<a [routerLink]="'/office/program/' + program.id + '/projects-rating'">
57+
<app-button
58+
[appearance]="isProjectsRatingPage ? 'inline' : 'outline'"
59+
size="medium"
60+
customTypographyClass="text-body-12"
61+
>
62+
оценка проектов
63+
</app-button>
64+
</a>
65+
}
66+
67+
<a
68+
class="info__presentation"
69+
[href]="program.presentationAddress"
70+
download=""
71+
target="_blank"
72+
>
73+
<app-button
74+
[disabled]="program.isUserManager"
75+
[style.opacity]="program.isUserManager ? '0.3' : '1'"
76+
appearance="outline"
77+
size="medium"
78+
customTypographyClass="text-body-12"
79+
>
80+
<span>{{
81+
program.name.includes("Технолидеры Будущего")
82+
? "Каталог лучших стартапов 2022/23"
83+
: program.isUserManager
84+
? "аналитика"
85+
: "положение"
86+
}}</span>
87+
@if (program.isUserManager) {
88+
<app-tooltip
89+
[text]="'Скоро здесь будет аналитика по включенности участников и проектов'"
90+
[isVisible]="isTooltipVisible"
91+
[position]="'right'"
92+
[tooltipWidth]="180"
93+
customClass="content__hint"
94+
(show)="showTooltip()"
95+
(hide)="hideTooltip()"
96+
></app-tooltip>
97+
} @if (!program.isUserManager) {
98+
<i appIcon class="info__presentation-icon" icon="arrow-down" appSquare="6"></i>
99+
}
100+
</app-button>
101+
</a>
102+
103+
<div class="info__divider"></div>
104+
105+
TODO: внести ссылку на сайт программы когда это поле будет на бэке
106+
@if (!program.isUserManager) {
107+
<a class="info__more">
108+
<app-button
109+
appearance="outline"
110+
[disabled]="true"
111+
size="medium"
112+
customTypographyClass="text-body-12"
113+
>узнать подробнее</app-button
114+
>
115+
</a>
116+
} @else {
117+
<a [routerLink]="'/office/program/' + program.id + '/projects'">
118+
<app-button
119+
[appearance]="isProjectsPage ? 'inline' : 'outline'"
120+
size="medium"
121+
customTypographyClass="text-body-12"
122+
>
123+
проекты-участники
124+
</app-button>
125+
</a>
126+
} @if (!program.isUserManager) {
127+
TODO: добавить информацию с ссылок или чего-то в дизайне телефон но не у каждой программы есть телефон в контактах
128+
<a class="info__contacts">
129+
<app-button
130+
[disabled]="true"
131+
appearance="outline"
132+
size="medium"
133+
customTypographyClass="text-body-12"
134+
>информация с ссылок</app-button
135+
>
136+
</a>
137+
} @else {
138+
<a [routerLink]="'/office/program/' + program.id + '/members'">
139+
<app-button
140+
[appearance]="isMembersPage ? 'inline' : 'outline'"
141+
size="medium"
142+
customTypographyClass="text-body-12"
143+
>
144+
участники
145+
</app-button>
146+
</a>
147+
}
148+
</div>
149+
</div>
150+
</div>
151+
} -->
152+
153+
<!-- <app-modal [open]="showSubmitProjectModal()" (openChange)="toggleSubmitProjectModal()">
154+
<div class="cancel">
155+
<div class="cancel__top">
156+
<p class="cancel__title text-body-14">выберите проект для подачи</p>
157+
<p class="cancel__text text-body-10">
158+
после выбора проекта будет создан дубликат данного проекта для заполнения под конкретный
159+
конкурс
160+
</p>
161+
162+
<div class="project">
163+
<ul class="project__list" [class.project__list--scrollable]="memberProjects.length > 3">
164+
@for (project of memberProjects; track project.id) {
165+
<li class="project__item">
166+
<div class="project__item--info">
167+
<app-avatar [url]="project.imageAddress" [size]="40"></app-avatar>
168+
<p class="text-body-12">
169+
{{ project.name }}
170+
</p>
171+
</div>
172+
<app-input
173+
type="radio"
174+
[appValue]="project.id.toLocaleString()"
175+
[checked]="selectedProjectId === project.id"
176+
(change)="onProjectRadioChange($event)"
177+
></app-input>
178+
</li>
179+
}
180+
</ul>
181+
</div>
182+
</div>
183+
184+
<app-button
185+
size="medium"
186+
class="cancel__button"
187+
customTypographyClass="text-body-12"
188+
[disabled]="!selectedProjectId"
189+
(click)="addProjectModal()"
190+
>
191+
выбрать проект
192+
</app-button>
193+
</div>
194+
</app-modal>
195+
196+
<app-modal
197+
[open]="isAssignProjectToProgramModalOpen()"
198+
(openChange)="isAssignProjectToProgramModalOpen.set(!isAssignProjectToProgramModalOpen)"
199+
>
200+
<div class="cancel" style="padding: 24px">
201+
<div class="cancel__top">
202+
<p class="cancel__title text-body-14">поздравляем!</p>
203+
</div>
204+
205+
<p class="text-body-10 cancel__text">
206+
мы создали дубликат проекта, который вы привязали к выбранной программе
207+
<span
208+
><strong>{{ assignProjectToProgramModalMessage()?.partnerProgram }}</strong></span
209+
>, теперь его можно отредактировать!
210+
</p>
211+
212+
<app-button
213+
size="medium"
214+
class="cancel__button"
215+
customTypographyClass="text-body-12"
216+
(click)="closeAssignProjectToProgramModal()"
217+
>вперед</app-button
218+
>
219+
</div>
220+
</app-modal> -->
221+
222+
<router-outlet></router-outlet>
223+
</div>
224+
</div>

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

Whitespace-only changes.
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
/** @format */
2+
3+
import { CommonModule } from "@angular/common";
4+
import { Component, Input, OnDestroy, OnInit } from "@angular/core";
5+
import { ButtonComponent } from "@ui/components";
6+
import { BackComponent, IconComponent } from "@uilib";
7+
import { ModalComponent } from "@ui/components/modal/modal.component";
8+
import { RouterModule } from "@angular/router";
9+
10+
@Component({
11+
selector: "app-detail",
12+
templateUrl: "./detail.component.html",
13+
styleUrl: "./detail.component.scss",
14+
imports: [
15+
CommonModule,
16+
RouterModule,
17+
IconComponent,
18+
ButtonComponent,
19+
BackComponent,
20+
ModalComponent,
21+
],
22+
standalone: true,
23+
})
24+
export class DeatilComponent implements OnInit, OnDestroy {
25+
@Input({ required: true }) backPath!: string;
26+
27+
ngOnInit(): void {}
28+
29+
ngOnDestroy(): void {}
30+
}

0 commit comments

Comments
 (0)