diff --git a/apps/frontend/src/app/core/core.module.ts b/apps/frontend/src/app/core/core.module.ts index 43045b2c..cdf02963 100644 --- a/apps/frontend/src/app/core/core.module.ts +++ b/apps/frontend/src/app/core/core.module.ts @@ -6,6 +6,7 @@ import {NgbxDarkmodeModule, THEME_ATTRIBUTE} from '@mean-stream/ngbx'; import {NgbAlertModule, NgbCollapseModule, NgbDropdownModule, NgbTooltipModule} from '@ng-bootstrap/ng-bootstrap'; import {CookieBannerComponent} from './cookie-banner/cookie-banner.component'; +import {InfoTableComponent} from './info-table/info-table.component'; import {LocationLinkComponent} from './location-link/location-link.component'; import {MarkdownComponent} from './markdown/markdown.component'; import {NavbarComponent} from './navbar/navbar.component'; @@ -20,6 +21,7 @@ import {TokenComponent} from './token/token.component'; LocationLinkComponent, LocationIconPipe, CookieBannerComponent, + InfoTableComponent, ], imports: [ CommonModule, @@ -41,6 +43,7 @@ import {TokenComponent} from './token/token.component'; LocationLinkComponent, LocationIconPipe, CookieBannerComponent, + InfoTableComponent, ], providers: [ { diff --git a/apps/frontend/src/app/core/info-table/info-table.component.html b/apps/frontend/src/app/core/info-table/info-table.component.html new file mode 100644 index 00000000..6628d6ab --- /dev/null +++ b/apps/frontend/src/app/core/info-table/info-table.component.html @@ -0,0 +1,61 @@ + + @if (poll.location; as location) { + + + + + } + @if (poll.settings.deadline; as deadline) { + + + + + } + @if (description && poll.description; as description) { + + + + + } + + + + + @if (stats) { + + + + + + + + + } +
+ + + +
+ + + {{ deadline | date: 'medium' }} +
+ + + +
+ + + {{ url }} +   + +
+ + + {{ poll.events }} {poll.events, plural, =1 {Option} other {Options}} +
+ + + {{ poll.participants }} {poll.participants, plural, =1 {Participant} other {Participants}} +
diff --git a/apps/frontend/src/app/core/info-table/info-table.component.scss b/apps/frontend/src/app/core/info-table/info-table.component.scss new file mode 100644 index 00000000..39e81336 --- /dev/null +++ b/apps/frontend/src/app/core/info-table/info-table.component.scss @@ -0,0 +1,5 @@ +table > tr > th:first-child { + width: 2rem; + padding: 0; + vertical-align: top; +} diff --git a/apps/frontend/src/app/core/info-table/info-table.component.ts b/apps/frontend/src/app/core/info-table/info-table.component.ts new file mode 100644 index 00000000..801c404a --- /dev/null +++ b/apps/frontend/src/app/core/info-table/info-table.component.ts @@ -0,0 +1,34 @@ +import {Component, Input, OnInit} from '@angular/core'; +import {ToastService} from '@mean-stream/ngbx'; + +import {ReadPoll} from '../../model'; + +@Component({ + selector: 'apollusia-info-table', + templateUrl: './info-table.component.html', + styleUrl: './info-table.component.scss', +}) +export class InfoTableComponent implements OnInit { + @Input({required: true}) poll: ReadPoll; + @Input() description = true; + @Input() stats = false; + + url = ''; + + constructor( + private toastService: ToastService, + ) { + } + + ngOnInit() { + this.url = `${document.baseURI}poll/${this.poll.id}/participate`; + } + + copyToClipboard() { + navigator.clipboard.writeText(this.url).then(() => { + this.toastService.success('Copy Poll Link', 'Successfully copied link to clipboard'); + }).catch(e => { + this.toastService.error('Copy Poll Link', 'Failed to copy link to clipboard', e); + }); + } +} diff --git a/apps/frontend/src/app/dashboard/card/card.component.html b/apps/frontend/src/app/dashboard/card/card.component.html index 0ccd7472..25a03f47 100644 --- a/apps/frontend/src/app/dashboard/card/card.component.html +++ b/apps/frontend/src/app/dashboard/card/card.component.html @@ -14,36 +14,7 @@
{{ poll.title }}
- @if (poll.description && !small) { -
- -
- } - diff --git a/apps/frontend/src/app/poll/choose-events/choose-events.component.html b/apps/frontend/src/app/poll/choose-events/choose-events.component.html index 37266a9b..83e4caa5 100644 --- a/apps/frontend/src/app/poll/choose-events/choose-events.component.html +++ b/apps/frontend/src/app/poll/choose-events/choose-events.component.html @@ -5,31 +5,13 @@

{{ poll?.title }}

-
- @if (poll?.location; as location) { -
- - + @if (poll) { +
+
+
- } - @if (poll?.settings?.deadline; as deadline) { -
- - {{ deadline | date: 'medium' }} -
- } - @if (poll?.description; as description) { -
- - -
- } -
- - {{ url }} -
-
+ } @if (closedReason) {
{{ closedReason }} @@ -41,7 +23,7 @@

} @if (!closedReason && poll?.settings?.maxParticipantEvents; as limit) { -
+
This poll is limited. You can select up to {{ limit }} choices.
diff --git a/apps/frontend/src/app/poll/choose-events/choose-events.component.ts b/apps/frontend/src/app/poll/choose-events/choose-events.component.ts index 50c8072d..13bdaf45 100644 --- a/apps/frontend/src/app/poll/choose-events/choose-events.component.ts +++ b/apps/frontend/src/app/poll/choose-events/choose-events.component.ts @@ -135,10 +135,6 @@ export class ChooseEventsComponent implements OnInit { // Primary Actions - copyToClipboard() { - navigator.clipboard.writeText(this.url).then().catch(e => console.log(e)); - } - sort(sortMethod: SortMethod) { if (this.currentSort === sortMethod.name) { this.currentSortDirection *= -1;