mirror of
https://github.com/Einundzwanzig-Podcast/einundzwanzig-portal.git
synced 2025-12-11 06:46:47 +00:00
voting added
This commit is contained in:
HolgerHatGarKeineNode
@@ -31,6 +31,8 @@
|
||||
|
||||
@include('livewire.frontend.navigation.bookcases')
|
||||
|
||||
@include('livewire.frontend.navigation.association')
|
||||
|
||||
@auth
|
||||
@include('livewire.frontend.navigation.profile')
|
||||
@endauth
|
||||
|
||||
@@ -0,0 +1,91 @@
|
||||
<div x-data="Components.popover({ open: false, focus: false })" x-init="init()" @keydown.escape="onEscape"
|
||||
@close-popover-group.window="onClosePopoverGroup">
|
||||
<button type="button" class="flex items-center gap-x-1 text-sm font-semibold leading-6 text-gray-900"
|
||||
@click="toggle" @mousedown="if (open) $event.preventDefault()" aria-expanded="true"
|
||||
:aria-expanded="open.toString()">
|
||||
{{ __('Project Funding') }}
|
||||
<svg class="h-5 w-5 flex-none text-gray-400" viewBox="0 0 20 20" fill="currentColor"
|
||||
aria-hidden="true">
|
||||
<path fill-rule="evenodd"
|
||||
d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<div x-show="open" x-transition:enter="transition ease-out duration-200"
|
||||
x-transition:enter-start="opacity-0 -translate-y-1"
|
||||
x-transition:enter-end="opacity-100 translate-y-0"
|
||||
x-transition:leave="transition ease-in duration-150"
|
||||
x-transition:leave-start="opacity-100 translate-y-0"
|
||||
x-transition:leave-end="opacity-0 -translate-y-1"
|
||||
x-description="'Product' flyout menu, show/hide based on flyout menu state."
|
||||
class="absolute inset-x-0 top-0 -z-10 bg-white pt-16 shadow-lg ring-1 ring-gray-900/5"
|
||||
x-ref="panel" @click.away="open = false" x-cloak>
|
||||
<div class="mx-auto grid max-w-7xl grid-cols-1 gap-y-10 gap-x-8 py-10 px-6 lg:grid-cols-2 lg:px-8">
|
||||
<div class="grid grid-cols-2 gap-x-6 sm:gap-x-8">
|
||||
<div>
|
||||
<h3 class="text-sm font-medium leading-6 text-gray-500">{{ __('Project Funding and Voting') }}</h3>
|
||||
<div class="mt-6 flow-root">
|
||||
<div class="-my-2">
|
||||
|
||||
<a href="{{ route('project.table.projectFunding', ['country' => $country]) }}"
|
||||
class="flex gap-x-4 py-2 text-sm font-semibold leading-6 text-gray-900">
|
||||
<i class="fa-thin fa-search flex-none text-gray-400"></i>
|
||||
{{ __('Submitted projects') }}
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="text-sm font-medium leading-6 text-gray-500">{{ __('Manage') }}</h3>
|
||||
<div class="mt-6 flow-root">
|
||||
<div class="-my-2">
|
||||
|
||||
<a href="{{ route('project.projectProposal.form', ['country' => $country]) }}"
|
||||
class="flex gap-x-4 py-2 text-sm font-semibold leading-6 text-gray-900">
|
||||
<i class="fa-thin fa-plus flex-none text-gray-400"></i>
|
||||
{{ __('Submit project for funding') }}
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 gap-10 sm:gap-8 lg:grid-cols-2">
|
||||
<h3 class="sr-only">Recent posts</h3>
|
||||
|
||||
@foreach($projectProposals as $item)
|
||||
<article
|
||||
class="relative isolate flex max-w-2xl flex-col gap-x-8 gap-y-6 sm:flex-row sm:items-start lg:flex-col lg:items-stretch">
|
||||
<div class="relative flex-none">
|
||||
<img
|
||||
class="aspect-[2/1] w-full rounded-lg bg-gray-100 object-cover sm:aspect-[16/9] sm:h-32 lg:h-auto"
|
||||
src="{{ $item->getFirstMediaUrl('main') }}"
|
||||
alt="">
|
||||
<div
|
||||
class="absolute inset-0 rounded-lg ring-1 ring-inset ring-gray-900/10"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center gap-x-4">
|
||||
<div
|
||||
class="relative z-10 rounded-full bg-gray-50 py-1.5 px-3 text-xs font-medium text-gray-600 hover:bg-gray-100">
|
||||
{{ $item->name }}
|
||||
</div>
|
||||
</div>
|
||||
<h4 class="mt-2 text-sm font-semibold leading-6 text-gray-900">
|
||||
<a href="{{ route('libraryItem.view', ['libraryItem' => $item]) }}">
|
||||
<span class="absolute inset-0"></span>
|
||||
{{ $item->name }}
|
||||
</a>
|
||||
</h4>
|
||||
<p class="mt-2 text-sm leading-6 text-gray-600 truncate">
|
||||
{{ $item->description }}
|
||||
</p>
|
||||
</div>
|
||||
</article>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,75 @@
|
||||
<div>
|
||||
{{-- HEADER --}}
|
||||
<livewire:frontend.header :country="null"/>
|
||||
|
||||
<div class="container p-4 mx-auto bg-21gray my-2">
|
||||
|
||||
<div class="pb-5 flex flex-row justify-between">
|
||||
<h3 class="text-lg font-medium leading-6 text-gray-200">{{ __('Project Proposal') }}</h3>
|
||||
<div class="flex flex-row space-x-2 items-center">
|
||||
<div>
|
||||
<x-button :href="$fromUrl">
|
||||
<i class="fa fa-thin fa-arrow-left"></i>
|
||||
{{ __('Back') }}
|
||||
</x-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form class="space-y-8 divide-y divide-gray-700 pb-24">
|
||||
<div class="space-y-8 divide-y divide-gray-700 sm:space-y-5">
|
||||
<div class="mt-6 sm:mt-5 space-y-6 sm:space-y-5">
|
||||
|
||||
<x-input.group :for=" md5('image')" :label="__('Main picture')">
|
||||
<div class="py-4">
|
||||
@if ($image)
|
||||
<div class="text-gray-200">{{ __('Preview') }}:</div>
|
||||
<img class="h-48 object-contain" src="{{ $image->temporaryUrl() }}">
|
||||
@endif
|
||||
@if ($projectProposal->getFirstMediaUrl('main'))
|
||||
<div class="text-gray-200">{{ __('Current picture') }}:</div>
|
||||
<img class="h-48 object-contain" src="{{ $projectProposal->getFirstMediaUrl('main') }}">
|
||||
@endif
|
||||
</div>
|
||||
<input class="text-gray-200" type="file" wire:model="image">
|
||||
@error('image') <span class="text-red-500">{{ $message }}</span> @enderror
|
||||
</x-input.group>
|
||||
|
||||
<x-input.group :for="md5('projectProposal.name')" :label="__('Name')">
|
||||
<x-input autocomplete="off" wire:model.debounce="projectProposal.name"
|
||||
:placeholder="__('Name')"/>
|
||||
</x-input.group>
|
||||
|
||||
<x-input.group :for="md5('projectProposal.name')" :label="__('Intended support in sats')">
|
||||
<x-input type="number" autocomplete="off" wire:model.debounce="projectProposal.support_in_sats"
|
||||
:placeholder="__('Intended support in sats')"/>
|
||||
</x-input.group>
|
||||
|
||||
<x-input.group :for="md5('projectProposal.description')">
|
||||
<x-slot name="label">
|
||||
<div>
|
||||
{{ __('Project description') }}
|
||||
</div>
|
||||
<div
|
||||
class="text-amber-500 text-xs py-2">{{ __('Please write a detailed and understandable application text, so that the vote on a possible support can take place.') }}</div>
|
||||
</x-slot>
|
||||
<div
|
||||
class="text-amber-500 text-xs py-2">{{ __('For images in Markdown, please use eg. Imgur or another provider.') }}</div>
|
||||
<x-input.simple-mde wire:model.defer="projectProposal.description"/>
|
||||
@error('projectProposal.description') <span
|
||||
class="text-red-500 py-2">{{ $message }}</span> @enderror
|
||||
</x-input.group>
|
||||
|
||||
<x-input.group :for="md5('save')" label="">
|
||||
<x-button primary wire:click="save">
|
||||
<i class="fa fa-thin fa-save"></i>
|
||||
{{ __('Save') }}
|
||||
</x-button>
|
||||
</x-input.group>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.js"></script>
|
||||
</div>
|
||||
@@ -0,0 +1,22 @@
|
||||
<div class="bg-21gray flex flex-col h-screen justify-between">
|
||||
{{-- HEADER --}}
|
||||
<livewire:frontend.header :country="$country"/>
|
||||
{{-- MAIN --}}
|
||||
<section class="w-full mb-12">
|
||||
<div class="max-w-screen-2xl mx-auto px-2 sm:px-10 space-y-4" id="table">
|
||||
<div class="md:flex md:items-center md:justify-between">
|
||||
<div class="min-w-0 flex-1">
|
||||
<h2 class="text-2xl font-bold leading-7 text-white sm:truncate sm:text-3xl sm:tracking-tight">
|
||||
{{ __('Submitted projects') }}
|
||||
</h2>
|
||||
</div>
|
||||
<div class="mt-4 flex md:mt-0 md:ml-4">
|
||||
{{----}}
|
||||
</div>
|
||||
</div>
|
||||
<livewire:tables.project-proposal-table :country="$country->code"/>
|
||||
</div>
|
||||
</section>
|
||||
{{-- FOOTER --}}
|
||||
<livewire:frontend.footer/>
|
||||
</div>
|
||||
@@ -0,0 +1,171 @@
|
||||
<div>
|
||||
{{-- HEADER --}}
|
||||
<livewire:frontend.header :country="null"/>
|
||||
|
||||
<div class="container p-4 mx-auto bg-21gray my-2">
|
||||
|
||||
<div class="pb-5 flex flex-row justify-between">
|
||||
<h3 class="text-lg font-medium leading-6 text-gray-200">{{ __('Voting') }}
|
||||
: {{ $projectProposal->name }}</h3>
|
||||
<div class="flex flex-row space-x-2 items-center">
|
||||
<div>
|
||||
<x-button :href="$fromUrl">
|
||||
<i class="fa fa-thin fa-arrow-left"></i>
|
||||
{{ __('Back') }}
|
||||
</x-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form class="space-y-8 divide-y divide-gray-700 pb-24">
|
||||
<div class="space-y-8 divide-y divide-gray-700 sm:space-y-5">
|
||||
<div class="mt-6 sm:mt-5 space-y-6 sm:space-y-5">
|
||||
|
||||
<div class="w-full flex space-x-4">
|
||||
<x-button lg primary wire:click="yes">
|
||||
Yes, support it!
|
||||
</x-button>
|
||||
<x-button lg primary wire:click="no">
|
||||
No, don't support it!
|
||||
</x-button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<x-input.group :for="md5('vote.reason')" :label="__('Reason')">
|
||||
<x-textarea autocomplete="off" wire:model.debounce="vote.reason"
|
||||
:placeholder="__('Reason')"/>
|
||||
</x-input.group>
|
||||
</div>
|
||||
|
||||
<div wire:ignore>
|
||||
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
|
||||
|
||||
<div
|
||||
x-data="{
|
||||
yes: [{{ $entitledVoters->pluck('votes')->collapse()->where('value', 1)->count() }},{{ $otherVoters->pluck('votes')->collapse()->where('value', 1)->count() }}],
|
||||
no: [{{ $entitledVoters->pluck('votes')->collapse()->where('value', 0)->count() }},{{ $otherVoters->pluck('votes')->collapse()->where('value', 0)->count() }}],
|
||||
labels: ['Entitled voters', 'Other voters',],
|
||||
init() {
|
||||
let chart = new ApexCharts(this.$refs.chart, this.options)
|
||||
chart.render()
|
||||
this.$watch('valuesEligible', () => {
|
||||
chart.updateOptions(this.options)
|
||||
})
|
||||
this.$watch('valuesOther', () => {
|
||||
chart.updateOptions(this.options)
|
||||
})
|
||||
},
|
||||
get options() {
|
||||
return {
|
||||
theme: { palette: 'palette3' },
|
||||
chart: { type: 'bar', toolbar: true, height: 350, stacked: true, stackType: '100%'},
|
||||
xaxis: { categories: this.labels },
|
||||
plotOptions: { bar: { horizontal: true } },
|
||||
series: [
|
||||
{
|
||||
name: 'Yes',
|
||||
data: this.yes,
|
||||
},
|
||||
{
|
||||
name: 'No',
|
||||
data: this.no,
|
||||
},
|
||||
],
|
||||
}
|
||||
}
|
||||
}"
|
||||
class="w-full"
|
||||
>
|
||||
<div x-ref="chart" class="rounded-lg bg-white p-8"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full grid grid-cols-2">
|
||||
|
||||
<div>
|
||||
<div class="border-b border-gray-200 bg-dark px-4 py-5 sm:px-6">
|
||||
<h3 class="text-base font-semibold leading-6 text-gray-200">Entitled voters</h3>
|
||||
</div>
|
||||
|
||||
<ul role="list" class="divide-y divide-gray-200">
|
||||
|
||||
@foreach($entitledVoters as $voter)
|
||||
@php
|
||||
$vote = $voter->votes->first();
|
||||
if (!$voter->votes->first()) {
|
||||
$text = __('not voted yet');
|
||||
} elseif (!$vote->value) {
|
||||
$text = __('Reason') . ': ' . $voter->votes->first()?->reason;
|
||||
}
|
||||
@endphp
|
||||
<li class="flex py-4">
|
||||
<img class="h-10 w-10 rounded-full" src="{{ $voter->profile_photo_url }}"
|
||||
alt="">
|
||||
<div class="ml-3">
|
||||
<p class="text-sm font-medium text-gray-200">
|
||||
{{ $voter->name }}
|
||||
@if($voter->votes->first()?->value)
|
||||
<x-badge green>{{ __('Yes') }}</x-badge>
|
||||
@endif
|
||||
@if($voter->votes->first() && !$voter->votes->first()?->value)
|
||||
<x-badge red>{{ __('No') }}</x-badge>
|
||||
@endif
|
||||
</p>
|
||||
<p class="text-sm text-gray-300">
|
||||
{{ $text ?? '' }}
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
@endforeach
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="border-b border-gray-200 bg-dark px-4 py-5 sm:px-6">
|
||||
<h3 class="text-base font-semibold leading-6 text-gray-200">Other voters</h3>
|
||||
</div>
|
||||
|
||||
<ul role="list" class="divide-y divide-gray-200">
|
||||
|
||||
@foreach($otherVoters as $voter)
|
||||
@php
|
||||
$vote = $voter->votes->first();
|
||||
if (!$voter->votes->first()) {
|
||||
$text = __('not voted yet');
|
||||
} elseif (!$vote->value) {
|
||||
$text = __('Reason') . ': ' . $voter->votes->first()?->reason;
|
||||
}
|
||||
@endphp
|
||||
<li class="flex py-4">
|
||||
<img class="h-10 w-10 rounded-full" src="{{ $voter->profile_photo_url }}"
|
||||
alt="">
|
||||
<div class="ml-3">
|
||||
<p class="text-sm font-medium text-gray-200">
|
||||
{{ $voter->name }}
|
||||
@if($voter->votes->first()?->value)
|
||||
<x-badge green>{{ __('Yes') }}</x-badge>
|
||||
@endif
|
||||
@if($voter->votes->first() && !$voter->votes->first()?->value)
|
||||
<x-badge red>{{ __('No') }}</x-badge>
|
||||
@endif
|
||||
</p>
|
||||
<p class="text-sm text-gray-300">
|
||||
{{ $text ?? '' }}
|
||||
</p>
|
||||
</div>
|
||||
</li>
|
||||
@endforeach
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.js"></script>
|
||||
</div>
|
||||
Reference in New Issue
Block a user