Compare commits
56 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
e75be49be4
|
|||
|
505fb8cb08
|
|||
|
e5c9265588
|
|||
|
02003ec80e
|
|||
|
133470b6f2
|
|||
|
4a6230c439
|
|||
|
fdc7d80bbf
|
|||
|
352551e168
|
|||
|
7aec050419
|
|||
| 4289034436 | |||
8f8858f100
|
|||
|
d98fb0d5b2
|
|||
|
5014bf5bc5
|
|||
|
0708cabc75
|
|||
|
4fcb26cf93
|
|||
|
269def20d1
|
|||
|
b8de9e0e42
|
|||
|
7b2b598588
|
|||
|
e0b61486b0
|
|||
|
3f86f7412f
|
|||
|
6454d960de
|
|||
|
37154c188b
|
|||
|
8da7578a0a
|
|||
| 2a64094006 | |||
| e9ce9644ff | |||
|
52439aa5bc
|
|||
|
ccf865687b
|
|||
|
cac34db1fd
|
|||
|
faf3893180
|
|||
|
c33dfcfddd
|
|||
|
019e14ab1f
|
|||
|
b5790196c6
|
|||
|
94a64ca690
|
|||
| a6ce04c903 | |||
| 165c154233 | |||
|
318547db46
|
|||
|
e60c09e19c
|
|||
|
4834d1484c
|
|||
|
4b6342727e
|
|||
|
cb5fa52cd9
|
|||
|
947d01cf7f
|
|||
|
3563394fb3
|
|||
|
269d7a7def
|
|||
|
e95f2333b0
|
|||
|
950217e0a3
|
|||
|
5e65fb3301
|
|||
|
2a294cde04
|
|||
|
e95420d79c
|
|||
|
cffbd17dc7
|
|||
|
00de8c3d75
|
|||
|
1f4711d07a
|
|||
|
30e3396897
|
|||
|
5291e049a1
|
|||
|
08fbb504c9
|
|||
|
e9ca1d3e5d
|
|||
|
9fe53b0b9c
|
96
CHANGELOG.md
96
CHANGELOG.md
@@ -2,10 +2,106 @@
|
||||
|
||||
All notable changes to this project will be documented in this file. Dates are displayed in UTC.
|
||||
|
||||
#### [1.3.0](https://git.odit.services/lfk/frontend/compare/1.2.0...1.3.0)
|
||||
|
||||
- feat(donations): Implemented donation deletion via confirm modal [`505fb8c`](https://git.odit.services/lfk/frontend/commit/505fb8cb08b81a7dcb08561bdda0f6464f140d3e)
|
||||
- feat(donationsoverview): Switched donations overview to datatable [`133470b`](https://git.odit.services/lfk/frontend/commit/133470b6f2a63ec087f27c98ef260648a8672e5f)
|
||||
- feat(donations): Implemented add donation payment via datatable refresh [`e5c9265`](https://git.odit.services/lfk/frontend/commit/e5c92655886ad9a6fcd7565fadd7955c477c3595)
|
||||
- feat(donations): Donations reactive create and load into datatable [`02003ec`](https://git.odit.services/lfk/frontend/commit/02003ec80efc16aabd126710a6eeac18df43f841)
|
||||
- feat(DonationsOverview): i18n loading text [`8f8858f`](https://git.odit.services/lfk/frontend/commit/8f8858f10071ddf9988d0ec0e3c4a891db24a102)
|
||||
- new license file version [CI SKIP] [`4289034`](https://git.odit.services/lfk/frontend/commit/4289034436869750205a946247e7ab5f9892fe98)
|
||||
|
||||
#### [1.2.0](https://git.odit.services/lfk/frontend/compare/1.1.0...1.2.0)
|
||||
|
||||
> 19 April 2023
|
||||
|
||||
- feat(donoroverview): Added datatable formatters [`d98fb0d`](https://git.odit.services/lfk/frontend/commit/d98fb0d5b288c987a45ccbf2bb026ccaab539a71)
|
||||
- 🚀RELEASE v1.2.0 [`fdc7d80`](https://git.odit.services/lfk/frontend/commit/fdc7d80bbf9bd698128e9ec4f91fa813499777a9)
|
||||
- feat(donors): Load donors paginated [`5014bf5`](https://git.odit.services/lfk/frontend/commit/5014bf5bc5873cfe4ae04d71b4aff12b257dd2e3)
|
||||
- feat(donorsoverview): Dynamicly add newly generated donors [`352551e`](https://git.odit.services/lfk/frontend/commit/352551e168b5dced5e7353e82655908d82d28af0)
|
||||
- feat(donorsoverview): Implemented delete confirmation with datatable [`7aec050`](https://git.odit.services/lfk/frontend/commit/7aec050419f6f1bf853c3e1bc655b01725ed3b65)
|
||||
|
||||
#### [1.1.0](https://git.odit.services/lfk/frontend/compare/1.0.0...1.1.0)
|
||||
|
||||
> 19 April 2023
|
||||
|
||||
- 🚀RELEASE v1.1.0 [`0708cab`](https://git.odit.services/lfk/frontend/commit/0708cabc75e63a876e54a0b343318f8d934ae319)
|
||||
- feat(dashboar): Added total donors to overview [`e0b6148`](https://git.odit.services/lfk/frontend/commit/e0b61486b089aa1e611ef3569b1521fc331ec0e4)
|
||||
- feat(dashboard): Updated stats icons [`4fcb26c`](https://git.odit.services/lfk/frontend/commit/4fcb26cf9371e27e5d7e474b3558ef354e9114c0)
|
||||
- feat(dashboard): Added average sponsoring [`269def2`](https://git.odit.services/lfk/frontend/commit/269def20d114ededaba3153bbd50ec2ddd70e1c6)
|
||||
- feat(dashboard): Added total donations [`7b2b598`](https://git.odit.services/lfk/frontend/commit/7b2b59858839b98370af6fb1e6028ba0a1639186)
|
||||
- feat(dashboard): Added average distance [`b8de9e0`](https://git.odit.services/lfk/frontend/commit/b8de9e0e427b3a8b56e6354ad7168ae12c7cce85)
|
||||
- Lockfile [`3f86f74`](https://git.odit.services/lfk/frontend/commit/3f86f7412ffc4bc27328ad1f7d3c3118546e7e29)
|
||||
- Bumped client [`6454d96`](https://git.odit.services/lfk/frontend/commit/6454d960de3f9f5ea86679f157b3b7e7cffde74d)
|
||||
- new license file version [CI SKIP] [`2a64094`](https://git.odit.services/lfk/frontend/commit/2a640940062765a470387103a72ed14a2411d97b)
|
||||
|
||||
### [1.0.0](https://git.odit.services/lfk/frontend/compare/0.19.0...1.0.0)
|
||||
|
||||
> 19 April 2023
|
||||
|
||||
- 🚀RELEASE v1.0.0 [`8da7578`](https://git.odit.services/lfk/frontend/commit/8da7578a0a46a3e97d8c870e29399f6e8821c9fa)
|
||||
- Merge pull request 'feature/175-request_pagination' (#176) from feature/175-request_pagination into dev [`e9ce964`](https://git.odit.services/lfk/frontend/commit/e9ce9644ff03f981cec6e9ad56aa5fdf0ff71ef4)
|
||||
- Donation paginated loading [`ccf8656`](https://git.odit.services/lfk/frontend/commit/ccf865687b34016931a702c0a9b98a0a18e2b03a)
|
||||
- Paginated scan loading [`cac34db`](https://git.odit.services/lfk/frontend/commit/cac34db1fd3bf5dc7c7be64b3a76ca4c8c77938d)
|
||||
- Implemented Async loading of cards via pagination (500 cards per request) [`c33dfcf`](https://git.odit.services/lfk/frontend/commit/c33dfcfddddfed0902f3fa9b1d8a1d3e1560262f)
|
||||
- Paginated runner loading (1000 per page) [`faf3893`](https://git.odit.services/lfk/frontend/commit/faf3893180bb735bea6f1ea58c896686b89949fe)
|
||||
- Allways set loaded to true [`52439aa`](https://git.odit.services/lfk/frontend/commit/52439aa5bc8cfb1d78d5dfce55b1a0df640ad8f5)
|
||||
- Bumped lfk client [`019e14a`](https://git.odit.services/lfk/frontend/commit/019e14ab1f99906f13d36c7148d0f4b7894072f2)
|
||||
- new license file version [CI SKIP] [`a6ce04c`](https://git.odit.services/lfk/frontend/commit/a6ce04c90386f16abf235cc7b2f95aeea5011c7d)
|
||||
|
||||
#### [0.19.0](https://git.odit.services/lfk/frontend/compare/0.18.4...0.19.0)
|
||||
|
||||
> 17 April 2023
|
||||
|
||||
- 🚀RELEASE v0.19.0 [`94a64ca`](https://git.odit.services/lfk/frontend/commit/94a64ca69078c7fe2935eeb5f955fab95a79cb85)
|
||||
- Merge pull request 'feature/173-scanstation_configcodes' (#174) from feature/173-scanstation_configcodes into dev [`165c154`](https://git.odit.services/lfk/frontend/commit/165c1542338c58f2abf42fef2e7b84b40d1e2d9c)
|
||||
- I18n [`e60c09e`](https://git.odit.services/lfk/frontend/commit/e60c09e19c9cc20338906e84f4db4e009d926360)
|
||||
- Implemented config code generation [`4b63427`](https://git.odit.services/lfk/frontend/commit/4b6342727ee0ea38597750d8c99edc301f1ccc2d)
|
||||
- Styling [`4834d14`](https://git.odit.services/lfk/frontend/commit/4834d1484c3fb6ecd4a1b56aa9fbb8125c641a62)
|
||||
- Adjusted size on smaller devices [`318547d`](https://git.odit.services/lfk/frontend/commit/318547db46045e41de64d5688368e85cd6fb8035)
|
||||
- Lockfile [`947d01c`](https://git.odit.services/lfk/frontend/commit/947d01cf7fc7fe2ee88c56e017b0d663f1f3b4f9)
|
||||
- Barcode placeholder [`cb5fa52`](https://git.odit.services/lfk/frontend/commit/cb5fa52cd9a97490b50fb0c02c26615b49650c08)
|
||||
- Added bwip-js for barcode generation [`3563394`](https://git.odit.services/lfk/frontend/commit/3563394fb33d661890327e2ae08c400830b37844)
|
||||
|
||||
#### [0.18.4](https://git.odit.services/lfk/frontend/compare/0.18.3...0.18.4)
|
||||
|
||||
> 15 April 2023
|
||||
|
||||
- 🚀RELEASE v0.18.4 [`269d7a7`](https://git.odit.services/lfk/frontend/commit/269d7a7defdde059ef2bb5103262cf734e9babe9)
|
||||
- Hide address2 in orgs by default [`e95f233`](https://git.odit.services/lfk/frontend/commit/e95f2333b0b958ed00c0e097b43aac2e70ad0d38)
|
||||
|
||||
#### [0.18.3](https://git.odit.services/lfk/frontend/compare/0.18.2...0.18.3)
|
||||
|
||||
> 15 April 2023
|
||||
|
||||
- 🚀RELEASE v0.18.3 [`950217e`](https://git.odit.services/lfk/frontend/commit/950217e0a350f9999b879475edf41f2f11c48179)
|
||||
- Dont show adress 2 in runner overview [`5e65fb3`](https://git.odit.services/lfk/frontend/commit/5e65fb33013c3dad38e7ad6740b017ae206f278f)
|
||||
|
||||
#### [0.18.2](https://git.odit.services/lfk/frontend/compare/0.18.1...0.18.2)
|
||||
|
||||
> 15 April 2023
|
||||
|
||||
- 🚀RELEASE v0.18.2 [`2a294cd`](https://git.odit.services/lfk/frontend/commit/2a294cde040044bbebfb9c8b34b6c91b27772741)
|
||||
- Added timestamps to scanoverview [`cffbd17`](https://git.odit.services/lfk/frontend/commit/cffbd17dc77054048cc9b14891f960f9a3fd18cb)
|
||||
- Push in releaseit [`e95420d`](https://git.odit.services/lfk/frontend/commit/e95420d79c3227c0ca0cf0c0b599970c2b7d690e)
|
||||
|
||||
#### [0.18.1](https://git.odit.services/lfk/frontend/compare/0.18.0...0.18.1)
|
||||
|
||||
> 15 April 2023
|
||||
|
||||
- 🚀RELEASE v0.18.1 [`00de8c3`](https://git.odit.services/lfk/frontend/commit/00de8c3d75e90cd4614f42111f5f45bedde64130)
|
||||
- Missing scanstation translations [`30e3396`](https://git.odit.services/lfk/frontend/commit/30e33968978bf33cedb31bcbf63fac273e1664f5)
|
||||
- fix: button onclick a11y [`9fe53b0`](https://git.odit.services/lfk/frontend/commit/9fe53b0b9c71e8a6b4aa3f317327ffe729df0834)
|
||||
- fix(ConfirmStatsClientDeletion): ScanStationService -> StatsClientService [`5291e04`](https://git.odit.services/lfk/frontend/commit/5291e049a1d2e880fbe277095da91b70d4812c3f)
|
||||
- fix(ConfirmScanStationDeletion): donorControllerRemove -> scanStationControllerRemove [`08fbb50`](https://git.odit.services/lfk/frontend/commit/08fbb504c958415ce75e1e426296f870f0f1358d)
|
||||
|
||||
#### [0.18.0](https://git.odit.services/lfk/frontend/compare/0.17.3...0.18.0)
|
||||
|
||||
> 12 April 2023
|
||||
|
||||
- Moved filter function to typed version [`#171`](https://git.odit.services/lfk/frontend/issues/171)
|
||||
- ScansOverview: migrate to datatable [`#168`](https://git.odit.services/lfk/frontend/issues/168)
|
||||
- 🚀RELEASE v0.18.0 [`eb80406`](https://git.odit.services/lfk/frontend/commit/eb80406fdb8abf3f76bca742095e8f1f03480a56)
|
||||
- wip: ScansOverview -> new datatable [`c87561f`](https://git.odit.services/lfk/frontend/commit/c87561f63b90ab951daf91d9b8b54ba96a94cc7f)
|
||||
- Basic card table replace [`5662c3b`](https://git.odit.services/lfk/frontend/commit/5662c3b6da67c00c94254bf39f8820e531fc93ef)
|
||||
- RunnersOverview: table responsiveness [`bf1e715`](https://git.odit.services/lfk/frontend/commit/bf1e715261c0076fd8543dd1187c516209a73b16)
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.18.0-RELEASE_INFO</span>
|
||||
<span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-1.3.0-RELEASE_INFO</span>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<script src="/env.js"></script>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@odit/lfk-frontend",
|
||||
"version": "0.18.0",
|
||||
"version": "1.3.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"i18n-order": "node order.js",
|
||||
@@ -26,7 +26,7 @@
|
||||
"commit": true,
|
||||
"requireCleanWorkingDir": false,
|
||||
"commitMessage": "🚀RELEASE v${version}",
|
||||
"push": false,
|
||||
"push": true,
|
||||
"tag": true,
|
||||
"tagName": null,
|
||||
"tagAnnotation": "v${version}"
|
||||
@@ -39,9 +39,10 @@
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@odit/lfk-client-js": "0.14.3",
|
||||
"@odit/lfk-client-js": "1.1.0",
|
||||
"@paralleldrive/cuid2": "^2.2.0",
|
||||
"@tanstack/svelte-table": "^8.8.5",
|
||||
"bwip-js": "^3.4.0",
|
||||
"check-password-strength": "2.0.7",
|
||||
"csvtojson": "2.0.10",
|
||||
"gridjs": "3.4.0",
|
||||
|
||||
16
pnpm-lock.yaml
generated
16
pnpm-lock.yaml
generated
@@ -2,14 +2,17 @@ lockfileVersion: '6.0'
|
||||
|
||||
dependencies:
|
||||
'@odit/lfk-client-js':
|
||||
specifier: 0.14.3
|
||||
version: 0.14.3
|
||||
specifier: 1.1.0
|
||||
version: 1.1.0
|
||||
'@paralleldrive/cuid2':
|
||||
specifier: ^2.2.0
|
||||
version: 2.2.0
|
||||
'@tanstack/svelte-table':
|
||||
specifier: ^8.8.5
|
||||
version: 8.8.5(svelte@3.58.0)
|
||||
bwip-js:
|
||||
specifier: ^3.4.0
|
||||
version: 3.4.0
|
||||
check-password-strength:
|
||||
specifier: 2.0.7
|
||||
version: 2.0.7
|
||||
@@ -507,8 +510,8 @@ packages:
|
||||
'@octokit/openapi-types': 16.0.0
|
||||
dev: true
|
||||
|
||||
/@odit/lfk-client-js@0.14.3:
|
||||
resolution: {integrity: sha512-oOZ9jjzqcbMA0Sfwxn4q9+8hHckMU2IhAn7v0OAS54zcnquYQANnY4RMEoNIyXd0oEe1z8QewBjyBvFEDg6BmA==}
|
||||
/@odit/lfk-client-js@1.1.0:
|
||||
resolution: {integrity: sha512-yhjsi7YMzL9/fJ7o06yszzw15iZhao3VmX0G9oqZWFwYJd1M2td3Lvm76mXNzTVlbdG6W0W3+eEjcalBdo51Pg==}
|
||||
dev: false
|
||||
|
||||
/@odit/license-exporter@0.0.12:
|
||||
@@ -847,6 +850,11 @@ packages:
|
||||
run-applescript: 5.0.0
|
||||
dev: true
|
||||
|
||||
/bwip-js@3.4.0:
|
||||
resolution: {integrity: sha512-Gx9LIBhmEFmNH4FJsS+Rs+bG5hUcs+OBemEEQ2ZTLz8tue0PA/lM692Gf2yuYJ2yUpLGtK9tAexs85tXBPG/ww==}
|
||||
hasBin: true
|
||||
dev: false
|
||||
|
||||
/bytes@3.1.2:
|
||||
resolution: {integrity: sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==}
|
||||
engines: {node: '>= 0.8'}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -32,7 +32,7 @@
|
||||
export let original_data = {};
|
||||
export let current_cards = [];
|
||||
export const addCards = (cards) => {
|
||||
console.log(cards)
|
||||
console.log(cards);
|
||||
current_cards = current_cards.concat(...cards);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
@@ -155,15 +155,27 @@
|
||||
}).showToast();
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
RunnerCardService.runnerCardControllerGetAll().then((val) => {
|
||||
current_cards = val;
|
||||
onMount(async () => {
|
||||
let page = 0;
|
||||
while (page >= 0) {
|
||||
const cards = await RunnerCardService.runnerCardControllerGetAll(
|
||||
page,
|
||||
500
|
||||
);
|
||||
if (cards.length == 0) {
|
||||
page = -2;
|
||||
}
|
||||
|
||||
current_cards = current_cards.concat(...cards);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_cards,
|
||||
}));
|
||||
|
||||
dataLoaded = true;
|
||||
});
|
||||
page++;
|
||||
}
|
||||
console.log("All cards loaded");
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -229,7 +241,7 @@
|
||||
...options,
|
||||
data: current_cards,
|
||||
}));
|
||||
$table.resetRowSelection()
|
||||
$table.resetRowSelection();
|
||||
}}
|
||||
>
|
||||
{$_("delete-cards")}
|
||||
@@ -249,7 +261,10 @@
|
||||
</svg>
|
||||
</button>
|
||||
{/if}
|
||||
<GenerateRunnerCards cards_show={selected.length>0} bind:generate_cards={selectedCards} />
|
||||
<GenerateRunnerCards
|
||||
cards_show={selected.length > 0}
|
||||
bind:generate_cards={selectedCards}
|
||||
/>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="w-full">
|
||||
|
||||
@@ -35,7 +35,9 @@
|
||||
<p class="text-sm">{$_("this-might-take-a-moment")}</p>
|
||||
</div>
|
||||
{:then stats}
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 2xl:grid-cols-6 gap-4">
|
||||
<div
|
||||
class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 2xl:grid-cols-6 gap-4"
|
||||
>
|
||||
<StatCard
|
||||
title={$_("runners")}
|
||||
value={stats.total_runners}
|
||||
@@ -59,18 +61,67 @@
|
||||
href="/scans/"
|
||||
>
|
||||
<svg
|
||||
stroke="currentColor"
|
||||
fill="currentColor"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
size="24"
|
||||
class="stroke-current text-grey-500"
|
||||
height="24"
|
||||
width="24"
|
||||
height="24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><polyline points="22 12 18 12 15 21 9 3 6 12 2 12" /></svg
|
||||
viewBox="0 0 24 24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M2 4h2v16H2V4zm4 0h1v16H6V4zm2 0h2v16H8V4zm3 0h2v16h-2V4zm3 0h2v16h-2V4zm3 0h1v16h-1V4zm2 0h3v16h-3V4z"
|
||||
/></svg
|
||||
>
|
||||
</StatCard>
|
||||
<StatCard
|
||||
title={$_("total-donors")}
|
||||
value={stats.total_donors}
|
||||
href="/donors/"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z"
|
||||
/></svg
|
||||
>
|
||||
</StatCard>
|
||||
<StatCard
|
||||
title={$_("total-donation-count")}
|
||||
value={stats.total_donations}
|
||||
href="/donations/"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z"
|
||||
/></svg
|
||||
>
|
||||
</StatCard>
|
||||
<StatCard
|
||||
title={$_("average-donation")}
|
||||
value={`${(stats.average_donation / 100).toFixed(2)} €`}
|
||||
href="/donations/"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z"
|
||||
/></svg
|
||||
>
|
||||
</StatCard>
|
||||
<StatCard
|
||||
@@ -105,6 +156,22 @@
|
||||
/></svg
|
||||
>
|
||||
</StatCard>
|
||||
<StatCard
|
||||
title={$_("average-distance")}
|
||||
value={`${(stats.average_distance / 1000).toFixed(2)} km`}
|
||||
href="#"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height="24"
|
||||
width="24"
|
||||
><path d="M0 0h24v24H0z" fill="none" />
|
||||
<path
|
||||
d="M21 6H3c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 10H3V8h2v4h2V8h2v4h2V8h2v4h2V8h2v4h2V8h2v8z"
|
||||
/></svg
|
||||
>
|
||||
</StatCard>
|
||||
<StatCard
|
||||
title={$_("count_teams")}
|
||||
value={stats.total_teams}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import { clickOutside } from "../base/outsideclick";
|
||||
|
||||
|
||||
import {
|
||||
DonationService,
|
||||
DonorService,
|
||||
@@ -9,9 +9,10 @@
|
||||
} from "@odit/lfk-client-js";
|
||||
import Select from "svelte-select";
|
||||
import Toastify from "toastify-js";
|
||||
import { is_promise } from "svelte/internal";
|
||||
import { is_promise } from "svelte/internal";
|
||||
import { createEventDispatcher } from "svelte";
|
||||
export let modal_open;
|
||||
export let current_donations;
|
||||
const dispatch = createEventDispatcher();
|
||||
const getDonorLabel = (option) =>
|
||||
option.firstname + " " + (option.middlename || "") + " " + option.lastname;
|
||||
const filterDonors = (label, filterText, option) =>
|
||||
@@ -59,16 +60,16 @@ import { is_promise } from "svelte/internal";
|
||||
let amount_cent = Math.floor(amount_input * 100);
|
||||
processed_last_submit = false;
|
||||
const toast = Toastify({
|
||||
text: $_('adding-donation'),
|
||||
text: $_("adding-donation"),
|
||||
duration: -1,
|
||||
}).showToast();
|
||||
if (is_fixed) {
|
||||
let postdata = {
|
||||
donor,
|
||||
amount: amount_cent,
|
||||
paidAmount: 0
|
||||
paidAmount: 0,
|
||||
};
|
||||
if(is_paid){
|
||||
if (is_paid) {
|
||||
postdata.paidAmount = amount_cent;
|
||||
}
|
||||
DonationService.donationControllerPostFixed(postdata)
|
||||
@@ -79,12 +80,11 @@ import { is_promise } from "svelte/internal";
|
||||
modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_('donation_added'),
|
||||
text: $_("donation_added"),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
current_donations.push(result);
|
||||
current_donations = current_donations;
|
||||
dispatch("created", { donations: [result] });
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
@@ -108,12 +108,11 @@ import { is_promise } from "svelte/internal";
|
||||
modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_('donation_added'),
|
||||
text: $_("donation_added"),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
current_donations.push(result);
|
||||
current_donations = current_donations;
|
||||
dispatch("created", { donations: [result] });
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
@@ -128,6 +127,207 @@ import { is_promise } from "svelte/internal";
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if modal_open}
|
||||
<div
|
||||
class="fixed z-10 inset-0 overflow-y-auto"
|
||||
use:clickOutside
|
||||
on:click_outside={() => {
|
||||
modal_open = false;
|
||||
}}
|
||||
>
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{#if is_fixed}
|
||||
{$_("create-a-new-fixed-donation")}
|
||||
{:else}{$_("create-a-new-distance-donation")}{/if}
|
||||
</h3>
|
||||
<label class="content-center align-middle object-center">
|
||||
<span class="ml-2 text-base" class:text-gray-300={is_fixed}
|
||||
>{$_("distance-donation")}</span
|
||||
>
|
||||
<input
|
||||
class="toggle relative w-10 h-5 transition-all duration-200 ease-in-out bg-gray-400 rounded-full shadow-inner outline-none appearance-none align-middle"
|
||||
type="checkbox"
|
||||
bind:checked={is_fixed}
|
||||
/>
|
||||
<span class="ml-2 text-base" class:text-gray-300={!is_fixed}
|
||||
>{$_("fixed-donation")}</span
|
||||
>
|
||||
</label>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_(
|
||||
"please-provide-the-nessecary-information-to-create-a-new-donation"
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid grid-cols-6 gap-6">
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="donor"
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("donor")}</label
|
||||
>
|
||||
<Select
|
||||
containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
itemFilter={(label, filterText, option) =>
|
||||
filterDonors(label, filterText, option)}
|
||||
items={donors}
|
||||
showChevron={true}
|
||||
placeholder={$_("search-for-donor-name-or-id")}
|
||||
noOptionsMessage={$_("no-donors-found")}
|
||||
on:select={(selectedValue) =>
|
||||
(donor = selectedValue.detail.value.id)}
|
||||
on:clear={() => (donors = null)}
|
||||
/>
|
||||
</div>
|
||||
{#if !is_fixed}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="donor"
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("runner")}</label
|
||||
>
|
||||
<Select
|
||||
containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
itemFilter={(label, filterText, option) =>
|
||||
filterDonors(label, filterText, option)}
|
||||
items={runners}
|
||||
showChevron={true}
|
||||
placeholder={$_("search-for-runner-by-name-or-id")}
|
||||
noOptionsMessage={$_("no-runners-found")}
|
||||
on:select={(selectedValue) =>
|
||||
(runner = selectedValue.detail.value.id)}
|
||||
on:clear={() => (runner = null)}
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="donation_amount_eur"
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>
|
||||
{#if !is_fixed}
|
||||
{$_("amount-per-kilometer")}
|
||||
{:else}{$_("donation-amount")}{/if}</label
|
||||
>
|
||||
<div class="mt-1 flex rounded-md shadow-sm">
|
||||
<input
|
||||
autocomplete="off"
|
||||
class:border-red-500={!is_amount_valid}
|
||||
class:focus:border-red-500={!is_amount_valid}
|
||||
class:focus:ring-red-500={!is_amount_valid}
|
||||
bind:value={amount_input}
|
||||
type="number"
|
||||
step="0.01"
|
||||
name="donation_amount_eur"
|
||||
class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
|
||||
placeholder="2.00"
|
||||
/>
|
||||
<span
|
||||
class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm"
|
||||
>€</span
|
||||
>
|
||||
</div>
|
||||
{#if !is_amount_valid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("donation-amount-must-be-greater-that-0-00eur")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
{#if is_fixed}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="paid"
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("already-paid")}</label
|
||||
>
|
||||
<p class="text-gray-500">
|
||||
<input
|
||||
id="paid"
|
||||
bind:checked={is_paid}
|
||||
name="paid"
|
||||
type="checkbox"
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
|
||||
/>
|
||||
<span class="align-text-bottom">
|
||||
{#if is_paid}
|
||||
{$_("paid")}
|
||||
{:else}
|
||||
{$_("open")}
|
||||
{/if}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<button
|
||||
disabled={!createbtnenabled}
|
||||
class:opacity-50={!createbtnenabled}
|
||||
on:click={submit}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("create")}
|
||||
</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
modal_open = false;
|
||||
}}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("cancel")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
.toggle:before {
|
||||
content: "";
|
||||
@@ -152,173 +352,3 @@ import { is_promise } from "svelte/internal";
|
||||
left: 1.25rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
{#if modal_open}
|
||||
<div
|
||||
class="fixed z-10 inset-0 overflow-y-auto"
|
||||
|
||||
use:clickOutside
|
||||
on:click_outside={() => {
|
||||
modal_open = false;
|
||||
}}>
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop" />
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline">
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z" /></svg>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{#if is_fixed}
|
||||
{$_('create-a-new-fixed-donation')}
|
||||
{:else}{$_('create-a-new-distance-donation')}{/if}
|
||||
</h3>
|
||||
<label class="content-center align-middle object-center">
|
||||
<span
|
||||
class="ml-2 text-base"
|
||||
class:text-gray-300={is_fixed}>{$_('distance-donation')}</span>
|
||||
<input
|
||||
class="toggle relative w-10 h-5 transition-all duration-200 ease-in-out bg-gray-400 rounded-full shadow-inner outline-none appearance-none align-middle"
|
||||
type="checkbox"
|
||||
bind:checked={is_fixed} />
|
||||
<span
|
||||
class="ml-2 text-base "
|
||||
class:text-gray-300={!is_fixed}>{$_('fixed-donation')}</span>
|
||||
</label>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_('please-provide-the-nessecary-information-to-create-a-new-donation')}
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid grid-cols-6 gap-6">
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="donor"
|
||||
class="block text-sm font-medium text-gray-700">{$_('donor')}</label>
|
||||
<Select
|
||||
containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
itemFilter={(label, filterText, option) => filterDonors(label, filterText, option)}
|
||||
items={donors}
|
||||
showChevron={true}
|
||||
placeholder={$_('search-for-donor-name-or-id')}
|
||||
noOptionsMessage={$_('no-donors-found')}
|
||||
on:select={(selectedValue) => (donor = selectedValue.detail.value.id)}
|
||||
on:clear={() => (donors = null)} />
|
||||
</div>
|
||||
{#if !is_fixed}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="donor"
|
||||
class="block text-sm font-medium text-gray-700">{$_('runner')}</label>
|
||||
<Select
|
||||
containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
itemFilter={(label, filterText, option) => filterDonors(label, filterText, option)}
|
||||
items={runners}
|
||||
showChevron={true}
|
||||
placeholder={$_('search-for-runner-by-name-or-id')}
|
||||
noOptionsMessage={$_('no-runners-found')}
|
||||
on:select={(selectedValue) => (runner = selectedValue.detail.value.id)}
|
||||
on:clear={() => (runner = null)} />
|
||||
</div>
|
||||
{/if}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="donation_amount_eur"
|
||||
class="block text-sm font-medium text-gray-700">
|
||||
{#if !is_fixed}
|
||||
{$_('amount-per-kilometer')}
|
||||
{:else}{$_('donation-amount')}{/if}</label>
|
||||
<div class="mt-1 flex rounded-md shadow-sm">
|
||||
<input
|
||||
autocomplete="off"
|
||||
class:border-red-500={!is_amount_valid}
|
||||
class:focus:border-red-500={!is_amount_valid}
|
||||
class:focus:ring-red-500={!is_amount_valid}
|
||||
bind:value={amount_input}
|
||||
type="number"
|
||||
step="0.01"
|
||||
name="donation_amount_eur"
|
||||
class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
|
||||
placeholder="2.00" />
|
||||
<span
|
||||
class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm">€</span>
|
||||
</div>
|
||||
{#if !is_amount_valid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('donation-amount-must-be-greater-that-0-00eur')}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
{#if is_fixed}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="paid"
|
||||
class="block text-sm font-medium text-gray-700">{$_('already-paid')}</label>
|
||||
<p class="text-gray-500">
|
||||
<input
|
||||
id="paid"
|
||||
bind:checked={is_paid}
|
||||
name="paid"
|
||||
type="checkbox"
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" >
|
||||
<span class="align-text-bottom">
|
||||
|
||||
{#if is_paid}
|
||||
{$_('paid')}
|
||||
{:else}
|
||||
{$_('open')}
|
||||
{/if}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<button
|
||||
disabled={!createbtnenabled}
|
||||
class:opacity-50={!createbtnenabled}
|
||||
on:click={submit}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('create')}
|
||||
</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
modal_open = false;
|
||||
}}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('cancel')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
@@ -1,19 +1,21 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import { clickOutside } from "../base/outsideclick";
|
||||
|
||||
|
||||
import { DonationService } from "@odit/lfk-client-js";
|
||||
import Toastify from "toastify-js";
|
||||
import { createEventDispatcher } from "svelte";
|
||||
export let payment_modal_open = false;
|
||||
export let current_donations = [];
|
||||
export let editable = {};
|
||||
export let original_data = {};
|
||||
export let paid_amount_input = 0;
|
||||
$:processed_last_submit=true;
|
||||
const dispatch = createEventDispatcher();
|
||||
$: processed_last_submit = true;
|
||||
function focus(el) {
|
||||
el.focus();
|
||||
}
|
||||
$: createbtnenabled = is_paid_amount_valid && !(paid_amount_input*100 == original_data.paidAmount)
|
||||
$: createbtnenabled =
|
||||
is_paid_amount_valid &&
|
||||
!(paid_amount_input * 100 == original_data.paidAmount);
|
||||
$: is_paid_amount_valid = paid_amount_input > 0;
|
||||
(() => {
|
||||
document.onkeydown = (e) => {
|
||||
@@ -33,61 +35,56 @@
|
||||
if (processed_last_submit === true) {
|
||||
processed_last_submit = false;
|
||||
const toast = Toastify({
|
||||
text: $_('updating-donation'),
|
||||
text: $_("updating-donation"),
|
||||
duration: -1,
|
||||
}).showToast();
|
||||
const editable = Object.assign({}, original_data);
|
||||
editable.donor = editable.donor.id;
|
||||
editable.paidAmount = paid_amount_input*100;
|
||||
if(editable.responseType == "DISTANCEDONATION" || editable.runner){
|
||||
editable.paidAmount = paid_amount_input * 100;
|
||||
if (editable.responseType == "DISTANCEDONATION" || editable.runner) {
|
||||
editable.runner = editable.runner.id;
|
||||
DonationService.donationControllerPutDistance(original_data.id, editable)
|
||||
.then((result) => {
|
||||
let id = original_data.id;
|
||||
editable = {};
|
||||
original_data = {};
|
||||
payment_modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_('donation-updated'),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
current_donations[current_donations.findIndex((c) => c.id === id)] = result;
|
||||
current_donations = current_donations;
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
})
|
||||
.finally(() => {
|
||||
processed_last_submit = true;
|
||||
//
|
||||
toast.hideToast();
|
||||
});
|
||||
}
|
||||
else{
|
||||
DonationService.donationControllerPutFixed(original_data.id, editable)
|
||||
.then((result) => {
|
||||
let id = original_data.id;
|
||||
editable = {};
|
||||
original_data = {};
|
||||
payment_modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_('donation-updated'),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
current_donations[current_donations.findIndex((c) => c.id === id)] = result;
|
||||
current_donations = current_donations;
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
})
|
||||
.finally(() => {
|
||||
processed_last_submit = true;
|
||||
//
|
||||
toast.hideToast();
|
||||
});
|
||||
DonationService.donationControllerPutDistance(
|
||||
original_data.id,
|
||||
editable
|
||||
)
|
||||
.then((result) => {
|
||||
payment_modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_("donation-updated"),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
dispatch("created", { donation: response });
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
})
|
||||
.finally(() => {
|
||||
processed_last_submit = true;
|
||||
//
|
||||
toast.hideToast();
|
||||
});
|
||||
} else {
|
||||
DonationService.donationControllerPutFixed(original_data.id, editable)
|
||||
.then((result) => {
|
||||
payment_modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_("donation-updated"),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
dispatch("created", { donation: response });
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
})
|
||||
.finally(() => {
|
||||
processed_last_submit = true;
|
||||
//
|
||||
toast.hideToast();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -96,57 +93,71 @@
|
||||
{#if payment_modal_open}
|
||||
<div
|
||||
class="fixed z-10 inset-0 overflow-y-auto"
|
||||
|
||||
use:clickOutside
|
||||
on:click_outside={() => {
|
||||
payment_modal_open = false;
|
||||
}}>
|
||||
}}
|
||||
>
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop" />
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span>
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline">
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z" /></svg>
|
||||
d="M22 10v10a1 1 0 01-1 1H3a1 1 0 01-1-1V10h20zm0-2H2V4a1 1 0 011-1h18a1 1 0 011 1v4zm-7 8v2h4v-2h-4z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_('enter-payment')}
|
||||
{$_("enter-payment")}
|
||||
</h3>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_('you-can-enter-the-donations-paid-amount-manually-or-use-the-max-button-to-use-the-donations-exact-amount')}
|
||||
{$_(
|
||||
"you-can-enter-the-donations-paid-amount-manually-or-use-the-max-button-to-use-the-donations-exact-amount"
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid grid-cols gap-6">
|
||||
<div class="w-full">
|
||||
<label
|
||||
for="token"
|
||||
class="block text-sm font-medium text-gray-700">{$_('paid-amount')}</label>
|
||||
<div class="inline-flex border-gray-300 border rounded-l-md rounded-r-md bg-gray-50 text-gray-500 w-full">
|
||||
<input
|
||||
for="token"
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("paid-amount")}</label
|
||||
>
|
||||
<div
|
||||
class="inline-flex border-gray-300 border rounded-l-md rounded-r-md bg-gray-50 text-gray-500 w-full"
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
class:border-red-500={!is_paid_amount_valid}
|
||||
class:focus:border-red-500={!is_paid_amount_valid}
|
||||
@@ -156,47 +167,55 @@
|
||||
step="0.01"
|
||||
name="donation_amount_eur"
|
||||
class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm p-2"
|
||||
placeholder="2.00" />
|
||||
placeholder="2.00"
|
||||
/>
|
||||
<button
|
||||
on:click={
|
||||
()=>{
|
||||
paid_amount_input=paid_amount_input = (original_data.amount/100).toFixed(2);
|
||||
}
|
||||
}
|
||||
class="inline-flex items-center p-r-2 text-indigo-300 hover:text-indigo-700 text-sm">MAX</button>
|
||||
on:click={() => {
|
||||
paid_amount_input = paid_amount_input = (
|
||||
original_data.amount / 100
|
||||
).toFixed(2);
|
||||
}}
|
||||
class="inline-flex items-center p-r-2 text-indigo-300 hover:text-indigo-700 text-sm"
|
||||
>MAX</button
|
||||
>
|
||||
<span
|
||||
class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm">€</span>
|
||||
class="inline-flex items-center px-3 rounded-r-md border border-gray-300 bg-gray-50 text-gray-500 text-sm"
|
||||
>€</span
|
||||
>
|
||||
</div>
|
||||
{#if !is_paid_amount_valid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('payment-amount-must-be-greater-than-0-00eur')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("payment-amount-must-be-greater-than-0-00eur")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<button
|
||||
disabled={!createbtnenabled}
|
||||
class:opacity-50={!createbtnenabled}
|
||||
on:click={submit}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('save-changes')}
|
||||
</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
payment_modal_open = false;
|
||||
}}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('cancel')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<button
|
||||
disabled={!createbtnenabled}
|
||||
class:opacity-50={!createbtnenabled}
|
||||
on:click={submit}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("save-changes")}
|
||||
</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
payment_modal_open = false;
|
||||
}}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("cancel")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
122
src/components/donations/DeleteDonationModal.svelte
Normal file
122
src/components/donations/DeleteDonationModal.svelte
Normal file
@@ -0,0 +1,122 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import { clickOutside } from "../base/outsideclick";
|
||||
import { createEventDispatcher, onMount } from "svelte";
|
||||
export let modal_open;
|
||||
export let delete_donation = {
|
||||
id: 0,
|
||||
runner: {
|
||||
firstname: "",
|
||||
lastname: "",
|
||||
},
|
||||
donor: {
|
||||
firstname: "",
|
||||
lastname: "",
|
||||
},
|
||||
};
|
||||
const dispatch = createEventDispatcher();
|
||||
onMount(() => {
|
||||
document.onkeydown = (e) => {
|
||||
e = e || window.event;
|
||||
if (e.key === "Escape") {
|
||||
modal_open = false;
|
||||
}
|
||||
if (e.keyCode === 13) {
|
||||
if (createbtnenabled === true) {
|
||||
createbtnenabled = false;
|
||||
submit();
|
||||
}
|
||||
}
|
||||
};
|
||||
});
|
||||
async function submit() {
|
||||
dispatch("delete", { id: delete_donation.id });
|
||||
modal_open = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if modal_open}
|
||||
<div
|
||||
class="fixed z-10 inset-0 overflow-y-auto"
|
||||
use:clickOutside
|
||||
on:click_outside={() => {
|
||||
modal_open = false;
|
||||
}}
|
||||
>
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M14 2a8 8 0 013.3 15.3A8 8 0 116.7 6.7 8 8 0 0114 2zm-3 7H9v1a2.5 2.5 0 00-.16 5h2.25a.5.5 0 010 1H7v2h2v1h2v-1a2.5 2.5 0 00.16-5H8.91a.5.5 0 010-1H13v-2h-2V9zm3-5a5.99 5.99 0 00-4.48 2.01 8 8 0 018.47 8.47A6 6 0 0014 4z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_("confirm-delete")}
|
||||
</h3>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_("please-confirm-the-deletion-of-donation")}
|
||||
</p>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<span class="inline-block"
|
||||
><b>{$_("donor")}</b>: {delete_donation.donor.firstname}
|
||||
{delete_donation.donor.lastname}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<button
|
||||
on:click={submit}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("delete")}
|
||||
</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
modal_open = false;
|
||||
}}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("cancel")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
18
src/components/donations/DonationDonor.svelte
Normal file
18
src/components/donations/DonationDonor.svelte
Normal file
@@ -0,0 +1,18 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
export let donor;
|
||||
</script>
|
||||
|
||||
{#if !donor || donor.firstname == 0}
|
||||
{$_("donor-has-no-associated-donations")}
|
||||
{:else}
|
||||
<div class="flex items-center">
|
||||
<a
|
||||
href="../donors/{donor.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800"
|
||||
>{donor.firstname}
|
||||
{#if donor.middlename}{donor.middlename}{/if}
|
||||
{donor.lastname}</a
|
||||
>
|
||||
</div>
|
||||
{/if}
|
||||
18
src/components/donations/DonationRunner.svelte
Normal file
18
src/components/donations/DonationRunner.svelte
Normal file
@@ -0,0 +1,18 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
export let runner;
|
||||
</script>
|
||||
|
||||
{#if !runner || runner.firstname == 0}
|
||||
{$_("fixed-donation")}
|
||||
{:else}
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
<a
|
||||
href="../runners/{runner.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800"
|
||||
>{runner.firstname}
|
||||
{#if runner.middlename}{runner.middlename}{/if}
|
||||
{runner.lastname}</a
|
||||
>
|
||||
</div>
|
||||
{/if}
|
||||
16
src/components/donations/DonationStatus.svelte
Normal file
16
src/components/donations/DonationStatus.svelte
Normal file
@@ -0,0 +1,16 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
export let status;
|
||||
</script>
|
||||
|
||||
{#if status == "PAID"}
|
||||
<span
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800"
|
||||
>{$_("paid")}</span
|
||||
>
|
||||
{:else}
|
||||
<span
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800"
|
||||
>{$_("open")}</span
|
||||
>
|
||||
{/if}
|
||||
21
src/components/donations/DonationTableAction.svelte
Normal file
21
src/components/donations/DonationTableAction.svelte
Normal file
@@ -0,0 +1,21 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import TableActions from "../shared/TableActions.svelte";
|
||||
|
||||
export let detailsLink;
|
||||
export let detailsAction;
|
||||
export let deleteEnabled;
|
||||
export let deleteAction;
|
||||
export let paymentAction;
|
||||
</script>
|
||||
|
||||
<button
|
||||
on:click={paymentAction}
|
||||
class="text-[#025a21] hover:text-green-900 mr-4">{$_("enter-payment")}</button
|
||||
>
|
||||
<TableActions
|
||||
bind:detailsAction
|
||||
bind:detailsLink
|
||||
bind:deleteAction
|
||||
bind:deleteEnabled
|
||||
/>
|
||||
@@ -5,25 +5,33 @@
|
||||
import DonationsOverview from "./DonationsOverview.svelte";
|
||||
$: current_donations = [];
|
||||
export let modal_open = false;
|
||||
let addDonations;
|
||||
</script>
|
||||
|
||||
<section class="container p-5">
|
||||
<span class="mb-1 text-3xl font-extrabold leading-tight">
|
||||
{$_('donations')}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:CREATE')}
|
||||
{$_("donations")}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONATION:CREATE")}
|
||||
<button
|
||||
on:click={() => {
|
||||
modal_open = true;
|
||||
}}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('add-donation')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("add-donation")}
|
||||
</button>
|
||||
{/if}
|
||||
</span>
|
||||
<DonationsOverview bind:current_donations />
|
||||
<DonationsOverview bind:current_donations bind:addDonations />
|
||||
</section>
|
||||
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:CREATE')}
|
||||
<AddDonationModal bind:current_donations bind:modal_open />
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONATION:CREATE")}
|
||||
<AddDonationModal
|
||||
on:created={(event) => {
|
||||
console.log(event)
|
||||
addDonations(event.detail.donations);
|
||||
}}
|
||||
bind:modal_open
|
||||
/>
|
||||
{/if}
|
||||
|
||||
@@ -1,235 +1,279 @@
|
||||
<script>
|
||||
import { getLocaleFromNavigator, _ } from "svelte-i18n";
|
||||
import { DonationService, DonorService } from "@odit/lfk-client-js";
|
||||
import { _ } from "svelte-i18n";
|
||||
import { DonationService } from "@odit/lfk-client-js";
|
||||
import store from "../../store";
|
||||
import Toastify from "toastify-js";
|
||||
import DonationsEmptyState from "./DonationsEmptyState.svelte";
|
||||
import AddDonationPaymentModal from "./AddDonationPaymentModal.svelte";
|
||||
import { onMount } from "svelte";
|
||||
import {
|
||||
createSvelteTable,
|
||||
flexRender,
|
||||
getCoreRowModel,
|
||||
getFilteredRowModel,
|
||||
getPaginationRowModel,
|
||||
getSortedRowModel,
|
||||
renderComponent,
|
||||
} from "@tanstack/svelte-table";
|
||||
import { writable } from "svelte/store";
|
||||
import TableBottom from "../shared/TableBottom.svelte";
|
||||
import InputElement from "../shared/InputElement.svelte";
|
||||
import TableHeader from "../shared/TableHeader.svelte";
|
||||
import DonationDonor from "./DonationDonor.svelte";
|
||||
import DonationRunner from "./DonationRunner.svelte";
|
||||
import DonationStatus from "./DonationStatus.svelte";
|
||||
import DonationTableAction from "./DonationTableAction.svelte";
|
||||
import DeleteDonationModal from "./DeleteDonationModal.svelte";
|
||||
$: searchvalue = "";
|
||||
$: active_deletes = [];
|
||||
$: active_edits = [];
|
||||
$: selectedDonations =
|
||||
$table?.getSelectedRowModel().rows.map((row) => row.original) || [];
|
||||
$: selected =
|
||||
$table?.getSelectedRowModel().rows.map((row) => row.index) || [];
|
||||
$: dataLoaded = false;
|
||||
|
||||
export let current_donations = [];
|
||||
export let payment_modal_open = false;
|
||||
export let editable = {};
|
||||
export let original_data = {};
|
||||
export let paid_amount_input = 0;
|
||||
const donations_promise = DonationService.donationControllerGetAll().then(
|
||||
(val) => {
|
||||
current_donations = val;
|
||||
}
|
||||
);
|
||||
function should_display_based_on_id(id) {
|
||||
if (searchvalue.toString().slice(-1) === "*") {
|
||||
return id.toString().startsWith(searchvalue.replace("*", ""));
|
||||
}
|
||||
return id.toString() === searchvalue;
|
||||
}
|
||||
function open_payment_modal(donation) {
|
||||
editable = Object.assign({}, donation);
|
||||
original_data = Object.assign({}, donation);
|
||||
paid_amount_input = (donation.paidAmount/100).toFixed(2);
|
||||
payment_modal_open = true;
|
||||
export const addDonations = (donations) => {
|
||||
current_donations = current_donations.concat(...donations);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donations,
|
||||
}));
|
||||
};
|
||||
|
||||
//Section table
|
||||
const columns = [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: () => "id",
|
||||
filterFn: `equalsString`,
|
||||
},
|
||||
{
|
||||
accessorKey: "donor",
|
||||
header: () => $_("donor"),
|
||||
cell: (info) => {
|
||||
return renderComponent(DonationDonor, { donor: info.getValue() });
|
||||
},
|
||||
filterFn: `includesString`,
|
||||
},
|
||||
{
|
||||
accessorKey: "runner",
|
||||
header: () => $_("runner"),
|
||||
cell: (info) => {
|
||||
return renderComponent(DonationRunner, { runner: info.getValue() });
|
||||
},
|
||||
filterFn: `includesString`,
|
||||
},
|
||||
{
|
||||
accessorKey: "amountPerDistance",
|
||||
header: () => $_("amount-per-kilometer"),
|
||||
cell: (info) => {
|
||||
if (!info.getValue()) {
|
||||
return $_("fixed-donation");
|
||||
}
|
||||
return `${(info.getValue() / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString("de-DE", { valute: "EUR" })} €`;
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "amount",
|
||||
header: () => $_("donation-amount"),
|
||||
cell: (info) => {
|
||||
return `${(info.getValue() / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString("de-DE", { valute: "EUR" })} €`;
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "paidAmount",
|
||||
header: () => $_("total-paid-amount"),
|
||||
cell: (info) => {
|
||||
return `${(info.getValue() / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString("de-DE", { valute: "EUR" })} €`;
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "status",
|
||||
header: () => $_("status"),
|
||||
cell: (info) => {
|
||||
return renderComponent(DonationStatus, { status: info.getValue() });
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "actions",
|
||||
header: () => $_("action"),
|
||||
cell: (info) => {
|
||||
return renderComponent(DonationTableAction, {
|
||||
detailsLink: `./${info.row.original.id}`,
|
||||
deleteAction: () => {
|
||||
active_deletes = current_donations.filter(
|
||||
(r) => r.id == info.row.original.id
|
||||
);
|
||||
},
|
||||
paymentAction: () => {
|
||||
active_edits = current_donations.filter(
|
||||
(r) => r.id == info.row.original.id
|
||||
);
|
||||
},
|
||||
deleteEnabled:
|
||||
store.state.jwtinfo.userdetails.permissions.includes(
|
||||
"DONATION:DELETE"
|
||||
),
|
||||
});
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
},
|
||||
];
|
||||
const options = writable({
|
||||
data: [],
|
||||
columns: columns,
|
||||
initialState: {
|
||||
pagination: {
|
||||
pageSize: 50,
|
||||
},
|
||||
},
|
||||
enableRowSelection: true,
|
||||
getCoreRowModel: getCoreRowModel(),
|
||||
getFilteredRowModel: getFilteredRowModel(),
|
||||
getPaginationRowModel: getPaginationRowModel(),
|
||||
getSortedRowModel: getSortedRowModel(),
|
||||
});
|
||||
const table = createSvelteTable(options);
|
||||
|
||||
async function deleteDonation(delete_donation_id) {
|
||||
await DonationService.donationControllerRemove(delete_donation_id, true);
|
||||
current_donations = current_donations.filter(
|
||||
(r) => r.id !== delete_donation_id
|
||||
);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donations,
|
||||
}));
|
||||
Toastify({
|
||||
text: $_("donation-deleted"),
|
||||
duration: 3500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
}
|
||||
|
||||
onMount(async () => {
|
||||
let page = 0;
|
||||
while (page >= 0) {
|
||||
const donations = await DonationService.donationControllerGetAll(
|
||||
page,
|
||||
500
|
||||
);
|
||||
if (donations.length == 0) {
|
||||
page = -2;
|
||||
}
|
||||
|
||||
current_donations = current_donations.concat(...donations);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donations,
|
||||
}));
|
||||
|
||||
dataLoaded = true;
|
||||
page++;
|
||||
}
|
||||
console.log("All donations loaded");
|
||||
});
|
||||
</script>
|
||||
|
||||
<AddDonationPaymentModal bind:current_donations bind:original_data bind:editable bind:paid_amount_input bind:payment_modal_open />
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:GET')}
|
||||
{#await donations_promise}
|
||||
<AddDonationPaymentModal
|
||||
original_data={active_edits[0]}
|
||||
payment_modal_open={active_edits.length > 0}
|
||||
paid_amount_input={(active_edits[0]?.paidAmount || 0) / 100}
|
||||
on:created={(event) => {
|
||||
current_donations[
|
||||
current_donations.findIndex((d) => d.id === event.detail.donation.id)
|
||||
].paidAmount = event.detail.donation.paidAmount;
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donations,
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<DeleteDonationModal
|
||||
delete_donation={active_deletes[0]}
|
||||
modal_open={active_deletes.length > 0}
|
||||
on:delete={(event) => {
|
||||
deleteDonation(event.detail.id);
|
||||
}}
|
||||
/>
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONATION:GET")}
|
||||
{#if !dataLoaded}
|
||||
<div
|
||||
class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
|
||||
role="alert">
|
||||
<p class="font-bold">donations are being loaded</p>
|
||||
<p class="text-sm">{$_('this-might-take-a-moment')}</p>
|
||||
role="alert"
|
||||
>
|
||||
<p class="font-bold">{$_("donations-are-being-loaded")}</p>
|
||||
<p class="text-sm">{$_("this-might-take-a-moment")}</p>
|
||||
</div>
|
||||
{:then}
|
||||
{#if current_donations.length === 0}
|
||||
<DonationsEmptyState />
|
||||
{:else}
|
||||
<input
|
||||
type="search"
|
||||
bind:value={searchvalue}
|
||||
placeholder={$_('datatable.search')}
|
||||
aria-label={$_('datatable.search')}
|
||||
class="mb-4" />
|
||||
<div
|
||||
class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
|
||||
<table class="divide-y divide-gray-200 w-full">
|
||||
<thead class="bg-gray-50">
|
||||
<tr>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('donor')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('runner')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('amount-per-kilometer')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('donation-amount')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('paid-amount')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('status')}
|
||||
</th>
|
||||
<th scope="col" class="relative px-6 py-3">
|
||||
<span class="sr-only">{$_('action')}</span>
|
||||
{:else if current_donations.length === 0}
|
||||
<DonationsEmptyState />
|
||||
{:else}
|
||||
<input
|
||||
type="search"
|
||||
bind:value={searchvalue}
|
||||
placeholder={$_("datatable.search")}
|
||||
aria-label={$_("datatable.search")}
|
||||
class="mb-4"
|
||||
/>
|
||||
<div
|
||||
class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
|
||||
>
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
{#each $table.getHeaderGroups() as headerGroup}
|
||||
<tr class="select-none">
|
||||
<th class="inset-y-0 left-0 px-4 py-2 text-left w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={$table.getIsAllRowsSelected()}
|
||||
indeterminate={$table.getIsSomeRowsSelected()}
|
||||
on:change={() => $table.toggleAllRowsSelected()}
|
||||
/>
|
||||
</th>
|
||||
{#each headerGroup.headers as header}
|
||||
<TableHeader {header} />
|
||||
{/each}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-gray-200">
|
||||
{#each current_donations as donation}
|
||||
{#if donation.donor.firstname
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
searchvalue.toLowerCase()
|
||||
) || donation.donor.lastname
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
searchvalue.toLowerCase()
|
||||
) || donation.runner?.firstname
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
searchvalue.toLowerCase()
|
||||
) || donation.runner?.lastname
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
searchvalue.toLowerCase()
|
||||
) || should_display_based_on_id(donation.id)}
|
||||
<tr data-rowid="donation_{donation.id}">
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<a
|
||||
href="../donors/{donation.donor.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{donation.donor.firstname}
|
||||
{donation.donor.middlename || ''}
|
||||
{donation.donor.lastname}</a>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{#if donation.runner}
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
<a
|
||||
href="../runners/{donation.runner.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-gray-100 text-gray-800">{donation.runner.firstname}
|
||||
{donation.runner.middlename || ''}
|
||||
{donation.runner.lastname}</a>
|
||||
</div>
|
||||
{:else}
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{$_('fixed-donation')}
|
||||
</div>
|
||||
{/if}
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{#if donation.amountPerDistance}
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{(donation.amountPerDistance / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString('de-DE', { valute: 'EUR' })}€
|
||||
</div>
|
||||
{:else}
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{$_('fixed-donation')}
|
||||
</div>
|
||||
{/if}
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{(donation.amount / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString('de-DE', { valute: 'EUR' })}€
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{(donation.paidAmount / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString('de-DE', { valute: 'EUR' })}€
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{#if donation.status =="PAID"}
|
||||
<span
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">{$_('paid')}</span>
|
||||
{:else}
|
||||
<span
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-red-100 text-red-800">{$_('open')}</span>
|
||||
{/if}
|
||||
</td>
|
||||
{#if active_deletes[donation.id] === true}
|
||||
<td
|
||||
class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
||||
<button
|
||||
on:click={() => {
|
||||
active_deletes[donation.id] = false;
|
||||
}}
|
||||
tabindex="0"
|
||||
class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
DonationService.donationControllerRemove(donation.id, false).then(
|
||||
(resp) => {
|
||||
current_donations = current_donations.filter(
|
||||
(obj) => obj.id !== donation.id
|
||||
);
|
||||
Toastify({
|
||||
text: $_('donation-deleted'),
|
||||
duration: 500,
|
||||
backgroundColor:
|
||||
'linear-gradient(to right, #00b09b, #96c93d)',
|
||||
}).showToast();
|
||||
}
|
||||
);
|
||||
}}
|
||||
tabindex="0"
|
||||
class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
|
||||
</td>
|
||||
{:else}
|
||||
<td
|
||||
class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
||||
<button
|
||||
on:click={() => {open_payment_modal(donation);}}
|
||||
class="text-[#025a21] hover:text-green-900 mr-4">{$_('enter-payment')}</button>
|
||||
<a
|
||||
href="./{donation.id}"
|
||||
class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONATION:DELETE')}
|
||||
<button
|
||||
on:click={() => {
|
||||
active_deletes[donation.id] = true;
|
||||
}}
|
||||
tabindex="0"
|
||||
class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
|
||||
{/if}
|
||||
</td>
|
||||
{/if}
|
||||
</tr>
|
||||
{/if}
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{/if}
|
||||
{:catch error}
|
||||
<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
|
||||
<span class="inline-block align-middle mr-8">
|
||||
<b class="capitalize">{$_('general_promise_error')}</b>
|
||||
{error}
|
||||
</span>
|
||||
{/each}
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each $table.getRowModel().rows as row}
|
||||
<tr>
|
||||
<td class="inset-y-0 left-0 px-4 py-2 text-center w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={row.getIsSelected()}
|
||||
on:change={() => row.toggleSelected()}
|
||||
/>
|
||||
</td>
|
||||
{#each row.getVisibleCells() as cell}
|
||||
<td>
|
||||
<svelte:component
|
||||
this={flexRender(
|
||||
cell.column.columnDef.cell,
|
||||
cell.getContext()
|
||||
)}
|
||||
/>
|
||||
</td>
|
||||
{/each}
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{/await}
|
||||
<div class="h-2" />
|
||||
<TableBottom {table} {selected} />
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
@@ -1,15 +1,13 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import { clickOutside } from "../base/outsideclick";
|
||||
|
||||
import {
|
||||
DonorService
|
||||
} from "@odit/lfk-client-js";
|
||||
|
||||
import { DonorService } from "@odit/lfk-client-js";
|
||||
import isEmail from "validator/es/lib/isEmail";
|
||||
import isMobilePhone from "validator/es/lib/isMobilePhone";
|
||||
import Toastify from "toastify-js";
|
||||
import { createEventDispatcher } from "svelte";
|
||||
export let modal_open;
|
||||
export let current_donors;
|
||||
let firstname_input;
|
||||
let lastname_input;
|
||||
let middlename_input;
|
||||
@@ -19,6 +17,7 @@
|
||||
let address_input2;
|
||||
let address_zipcode;
|
||||
let address_city;
|
||||
const dispatch = createEventDispatcher();
|
||||
function focus(el) {
|
||||
el.focus();
|
||||
}
|
||||
@@ -75,7 +74,7 @@
|
||||
if (processed_last_submit === true) {
|
||||
processed_last_submit = false;
|
||||
const toast = Toastify({
|
||||
text: $_('donor-is-being-added'),
|
||||
text: $_("donor-is-being-added"),
|
||||
duration: -1,
|
||||
}).showToast();
|
||||
let address = {};
|
||||
@@ -92,7 +91,7 @@
|
||||
firstname: firstname_input_value,
|
||||
lastname: lastname_input_value,
|
||||
address,
|
||||
receiptNeeded: address_checked
|
||||
receiptNeeded: address_checked,
|
||||
};
|
||||
if (middlename_input_value) {
|
||||
postdata.middlename = middlename_input_value;
|
||||
@@ -112,12 +111,11 @@
|
||||
modal_open = false;
|
||||
//
|
||||
Toastify({
|
||||
text: $_('donor-added'),
|
||||
text: $_("donor-added"),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
current_donors.push(result);
|
||||
current_donors = current_donors;
|
||||
dispatch("created", { donors: [result] });
|
||||
})
|
||||
.catch((err) => {
|
||||
//
|
||||
@@ -134,58 +132,70 @@
|
||||
{#if modal_open}
|
||||
<div
|
||||
class="fixed z-10 inset-0 overflow-y-auto"
|
||||
|
||||
use:clickOutside
|
||||
on:click_outside={() => {
|
||||
modal_open = false;
|
||||
}}>
|
||||
}}
|
||||
>
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop" />
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span>
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline">
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" /></svg>
|
||||
d="M9.33 11.5h2.17A4.5 4.5 0 0 1 16 16H8.999L9 17h8v-1a5.578 5.578 0 0 0-.886-3H19a5 5 0 0 1 4.516 2.851C21.151 18.972 17.322 21 13 21c-2.761 0-5.1-.59-7-1.625L6 10.071A6.967 6.967 0 0 1 9.33 11.5zM5 19a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-9a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v9zM18 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6zm-7-3a3 3 0 1 1 0 6 3 3 0 0 1 0-6z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_('create-a-new-donor')}
|
||||
{$_("create-a-new-donor")}
|
||||
</h3>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_('please-provide-the-nessecary-information-to-add-a-new-donor')}
|
||||
{$_(
|
||||
"please-provide-the-nessecary-information-to-add-a-new-donor"
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid grid-cols-6 gap-6">
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="firstname"
|
||||
class="block text-sm font-medium text-gray-700">{$_('first-name')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("first-name")}</label
|
||||
>
|
||||
<input
|
||||
use:focus
|
||||
autocomplete="off"
|
||||
placeholder={$_('first-name')}
|
||||
placeholder={$_("first-name")}
|
||||
class:border-red-500={!isFirstnameValid}
|
||||
class:focus:border-red-500={!isFirstnameValid}
|
||||
class:focus:ring-red-500={!isFirstnameValid}
|
||||
@@ -193,34 +203,41 @@
|
||||
bind:this={firstname_input}
|
||||
type="text"
|
||||
name="firstname"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !isFirstnameValid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('first-name-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("first-name-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="trackname"
|
||||
class="block text-sm font-medium text-gray-700">{$_('middle-name')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("middle-name")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('middle-name')}
|
||||
placeholder={$_("middle-name")}
|
||||
bind:value={middlename_input_value}
|
||||
bind:this={middlename_input}
|
||||
type="text"
|
||||
name="trackname"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="lastname"
|
||||
class="block text-sm font-medium text-gray-700">{$_('last-name')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("last-name")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder="{$_('last-name')}"
|
||||
placeholder={$_("last-name")}
|
||||
class:border-red-500={!isLastnameValid}
|
||||
class:focus:border-red-500={!isLastnameValid}
|
||||
class:focus:ring-red-500={!isLastnameValid}
|
||||
@@ -228,21 +245,25 @@
|
||||
bind:this={lastname_input}
|
||||
type="text"
|
||||
name="lastname"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !isLastnameValid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('last-name-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("last-name-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="phone"
|
||||
class="block text-sm font-medium text-gray-700">{$_('phone')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("phone")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('phone')}
|
||||
placeholder={$_("phone")}
|
||||
class:border-red-500={!isPhoneValidOrEmpty}
|
||||
class:focus:border-red-500={!isPhoneValidOrEmpty}
|
||||
class:focus:ring-red-500={!isPhoneValidOrEmpty}
|
||||
@@ -250,21 +271,27 @@
|
||||
bind:this={phone_input}
|
||||
type="tel"
|
||||
name="phone"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !isPhoneValidOrEmpty}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{@html $_('the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{@html $_(
|
||||
"the-provided-phone-number-is-invalid-less-than-br-greater-than-please-enter-a-valid-international-number"
|
||||
)}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="email"
|
||||
class="block text-sm font-medium text-gray-700">{$_('e-mail-adress')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("e-mail-adress")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('e-mail-adress')}
|
||||
placeholder={$_("e-mail-adress")}
|
||||
class:border-red-500={!isEmailValidOrEmpty}
|
||||
class:focus:border-red-500={!isEmailValidOrEmpty}
|
||||
class:focus:ring-red-500={!isEmailValidOrEmpty}
|
||||
@@ -272,11 +299,13 @@
|
||||
bind:this={email_input}
|
||||
type="email"
|
||||
name="email"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !isEmailValidOrEmpty}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('valid-email-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("valid-email-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -287,19 +316,22 @@
|
||||
id="comments"
|
||||
name="comments"
|
||||
type="checkbox"
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-3 text-sm">
|
||||
<label
|
||||
for="comments"
|
||||
class="font-medium text-gray-700">{$_('receipt-needed')}</label>
|
||||
<label for="comments" class="font-medium text-gray-700"
|
||||
>{$_("receipt-needed")}</label
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
{#if address_checked === true}
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="address1"
|
||||
class="block text-sm font-medium text-gray-700">{$_('address')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("address")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder="Address"
|
||||
@@ -310,34 +342,41 @@
|
||||
bind:this={address_input1}
|
||||
type="text"
|
||||
name="address1"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !isAddress1Valid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('address-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("address-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="address2"
|
||||
class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("apartment-suite-etc")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('apartment-suite-etc')}
|
||||
placeholder={$_("apartment-suite-etc")}
|
||||
bind:value={address_input2_value}
|
||||
bind:this={address_input2}
|
||||
type="text"
|
||||
name="address2"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="zipcode"
|
||||
class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("zip-postal-code")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('zip-postal-code')}
|
||||
placeholder={$_("zip-postal-code")}
|
||||
class:border-red-500={!iszipcodevalid}
|
||||
class:focus:border-red-500={!iszipcodevalid}
|
||||
class:focus:ring-red-500={!iszipcodevalid}
|
||||
@@ -345,18 +384,22 @@
|
||||
bind:this={address_zipcode}
|
||||
type="text"
|
||||
name="zipcode"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !iszipcodevalid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('valid-zipcode-postal-code-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("valid-zipcode-postal-code-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="city"
|
||||
class="block text-sm font-medium text-gray-700">City</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>City</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder="City"
|
||||
@@ -367,11 +410,13 @@
|
||||
bind:this={address_city}
|
||||
type="text"
|
||||
name="city"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !iscityvalid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('valid-city-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("valid-city-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -386,16 +431,18 @@
|
||||
class:opacity-50={!createbtnenabled}
|
||||
on:click={submit}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('create')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("create")}
|
||||
</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
modal_open = false;
|
||||
}}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('cancel')}
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("cancel")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import { clickOutside } from "../base/outsideclick";
|
||||
|
||||
|
||||
import { DonorService } from "@odit/lfk-client-js";
|
||||
import Toastify from "toastify-js";
|
||||
import { createEventDispatcher } from "svelte";
|
||||
@@ -13,60 +13,61 @@
|
||||
dispatch("cancelDelete", { id: delete_donor.id });
|
||||
}
|
||||
function deleteDonor() {
|
||||
DonorService.donorControllerRemove(
|
||||
delete_donor.id,
|
||||
true
|
||||
)
|
||||
.then((resp) => {
|
||||
Toastify({
|
||||
text: $_('donor-deleted'),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
location.replace("./");
|
||||
})
|
||||
.catch((err) => {});
|
||||
dispatch("delete", { id: delete_donor.id });
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if modal_open}
|
||||
<div
|
||||
class="fixed z-10 inset-0 overflow-y-auto"
|
||||
|
||||
use:clickOutside
|
||||
on:click_outside={cancelDelete}>
|
||||
on:click_outside={cancelDelete}
|
||||
>
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop" />
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span>
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline">
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
<svg class="h-6 w-6 text-blue-600" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M9.33 11.5h2.17A4.5 4.5 0 0116 16H9v1h8v-1a5.58 5.58 0 00-.89-3H19a5 5 0 014.52 2.85A13.15 13.15 0 0113 21c-2.76 0-5.1-.59-7-1.63v-9.3a6.97 6.97 0 013.33 1.43zM5 19a1 1 0 01-1 1H2a1 1 0 01-1-1v-9a1 1 0 011-1h2a1 1 0 011 1v9zM18 5a3 3 0 110 6 3 3 0 010-6zm-7-3a3 3 0 110 6 3 3 0 010-6z"/></svg>
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
><path fill="none" d="M0 0h24v24H0z" /><path
|
||||
d="M9.33 11.5h2.17A4.5 4.5 0 0116 16H9v1h8v-1a5.58 5.58 0 00-.89-3H19a5 5 0 014.52 2.85A13.15 13.15 0 0113 21c-2.76 0-5.1-.59-7-1.63v-9.3a6.97 6.97 0 013.33 1.43zM5 19a1 1 0 01-1 1H2a1 1 0 01-1-1v-9a1 1 0 011-1h2a1 1 0 011 1v9zM18 5a3 3 0 110 6 3 3 0 010-6zm-7-3a3 3 0 110 6 3 3 0 010-6z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_('attention')}
|
||||
{$_("attention")}
|
||||
</h3>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_(
|
||||
'do-you-want-to-delete-this-donor-with-all-related-donations'
|
||||
"do-you-want-to-delete-this-donor-with-all-related-donations"
|
||||
)}
|
||||
<br />
|
||||
{$_('all-associated-donations-will-get-deleted-as-well')}
|
||||
<br />
|
||||
{$_("all-associated-donations-will-get-deleted-as-well")}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -76,14 +77,16 @@
|
||||
<button
|
||||
on:click={deleteDonor}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('confirm-delete-donor-with-all-donations')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("confirm-delete-donor-with-all-donations")}
|
||||
</button>
|
||||
<button
|
||||
on:click={cancelDelete}
|
||||
type="button"
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('cancel-keep-donor')}
|
||||
class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 shadow-sm px-4 py-2 bg-white text-base font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("cancel-keep-donor")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
14
src/components/donors/DonorAddress.svelte
Normal file
14
src/components/donors/DonorAddress.svelte
Normal file
@@ -0,0 +1,14 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
export let address;
|
||||
</script>
|
||||
|
||||
{#if !address || !address.address1}
|
||||
{$_("no-address")}
|
||||
{:else}
|
||||
{address.address1}<br />
|
||||
<!-- {address.address2 || ''}<br /> -->
|
||||
{address.postalcode}
|
||||
{address.city}
|
||||
{address.country}
|
||||
{/if}
|
||||
29
src/components/donors/DonorDonations.svelte
Normal file
29
src/components/donors/DonorDonations.svelte
Normal file
@@ -0,0 +1,29 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
export let donations;
|
||||
</script>
|
||||
|
||||
{#if !donations || donations.length == 0}
|
||||
{$_('donor-has-no-associated-donations')}
|
||||
{:else}
|
||||
{#each donations as donation}
|
||||
{#if donation.responseType === "DISTANCEDONATION"}
|
||||
<a
|
||||
href="../donations/{donation.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-600 text-white mr-1"
|
||||
>{donation.runner.firstname}
|
||||
{donation.runner.middlename || ""}
|
||||
{donation.runner.lastname}</a
|
||||
>
|
||||
{:else}
|
||||
<a
|
||||
href="../donations/{d.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-700 text-white mr-1"
|
||||
>{$_("fixed-donation")}:
|
||||
{(d.amount / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString("de-DE", { valute: "EUR" })}€</a
|
||||
>
|
||||
{/if}
|
||||
{/each}
|
||||
{/if}
|
||||
@@ -5,50 +5,73 @@
|
||||
import DonorsOverview from "./DonorsOverview.svelte";
|
||||
$: current_donors = [];
|
||||
export let modal_open = false;
|
||||
let addDonors;
|
||||
</script>
|
||||
|
||||
<section class="container p-5">
|
||||
<span class="mb-1 text-3xl font-extrabold leading-tight">
|
||||
{$_('donors')}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:CREATE')}
|
||||
{$_("donors")}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONOR:CREATE")}
|
||||
<button
|
||||
on:click={() => {
|
||||
modal_open = true;
|
||||
}}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('add-donor')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("add-donor")}
|
||||
</button>
|
||||
{/if}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONOR:GET")}
|
||||
<button
|
||||
on:click={() => {
|
||||
const data = (current_donors.filter(d=>d.receiptNeeded===true)).map(function (d) {
|
||||
d.address.address2=d.address.address2===""?"":" "+d.address.address2;
|
||||
const address=`${d.address.address1}${d.address.address2}, ${d.address.postalcode} ${d.address.city}, ${d.address.country}`;
|
||||
return [d.firstname,d.middlename,d.lastname,d.paidDonationAmount,address];
|
||||
})
|
||||
let csv = `${$_('csv_import__firstname')};${$_('csv_import__middlename')};${$_('csv_import__lastname')};${$_('total_donation_amount_in_eur')};${$_('address')}\n`;
|
||||
data.forEach(function(row) {
|
||||
csv += row.join(';');
|
||||
const data = current_donors
|
||||
.filter((d) => d.receiptNeeded === true)
|
||||
.map(function (d) {
|
||||
d.address.address2 =
|
||||
d.address.address2 === "" ? "" : " " + d.address.address2;
|
||||
const address = `${d.address.address1}${d.address.address2}, ${d.address.postalcode} ${d.address.city}, ${d.address.country}`;
|
||||
return [
|
||||
d.firstname,
|
||||
d.middlename,
|
||||
d.lastname,
|
||||
d.paidDonationAmount,
|
||||
address,
|
||||
];
|
||||
});
|
||||
let csv = `${$_("csv_import__firstname")};${$_(
|
||||
"csv_import__middlename"
|
||||
)};${$_("csv_import__lastname")};${$_(
|
||||
"total_donation_amount_in_eur"
|
||||
)};${$_("address")}\n`;
|
||||
data.forEach(function (row) {
|
||||
csv += row.join(";");
|
||||
csv += "\n";
|
||||
});
|
||||
let hiddenElement = document.createElement('a');
|
||||
hiddenElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(csv);
|
||||
hiddenElement.target = '_blank';
|
||||
hiddenElement.download = `${$_('filename_sponsoringquittungsliste')}.csv`;
|
||||
hiddenElement.click();
|
||||
hiddenElement.remove();
|
||||
});
|
||||
let hiddenElement = document.createElement("a");
|
||||
hiddenElement.href = "data:text/csv;charset=utf-8," + encodeURI(csv);
|
||||
hiddenElement.target = "_blank";
|
||||
hiddenElement.download = `${$_(
|
||||
"filename_sponsoringquittungsliste"
|
||||
)}.csv`;
|
||||
hiddenElement.click();
|
||||
hiddenElement.remove();
|
||||
}}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('sponsoring-quittungs-liste_herunterladen')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("sponsoring-quittungs-liste_herunterladen")}
|
||||
</button>
|
||||
{/if}
|
||||
</span>
|
||||
<DonorsOverview bind:current_donors />
|
||||
<DonorsOverview bind:current_donors bind:addDonors />
|
||||
</section>
|
||||
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:CREATE')}
|
||||
<AddDonorModal bind:current_donors bind:modal_open />
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONOR:CREATE")}
|
||||
<AddDonorModal
|
||||
on:created={(event) => {
|
||||
addDonors(event.detail.donors);
|
||||
}}
|
||||
bind:modal_open
|
||||
/>
|
||||
{/if}
|
||||
|
||||
@@ -5,214 +5,262 @@
|
||||
import DonorsEmptyState from "./DonorsEmptyState.svelte";
|
||||
import ConfirmDonorDeletion from "./ConfirmDonorDeletion.svelte";
|
||||
import Toastify from "toastify-js";
|
||||
import TableBottom from "../shared/TableBottom.svelte";
|
||||
import {
|
||||
createSvelteTable,
|
||||
flexRender,
|
||||
getCoreRowModel,
|
||||
getFilteredRowModel,
|
||||
getPaginationRowModel,
|
||||
getSortedRowModel,
|
||||
renderComponent,
|
||||
} from "@tanstack/svelte-table";
|
||||
import { writable } from "svelte/store";
|
||||
import { onMount } from "svelte";
|
||||
import InputElement from "../shared/InputElement.svelte";
|
||||
import TableHeader from "../shared/TableHeader.svelte";
|
||||
import TableActions from "../shared/TableActions.svelte";
|
||||
import DonorAddress from "./DonorAddress.svelte";
|
||||
import DonorDonations from "./DonorDonations.svelte";
|
||||
$: searchvalue = "";
|
||||
$: active_deletes = [];
|
||||
$: current_donations = [];
|
||||
$: selectedDonors =
|
||||
$table?.getSelectedRowModel().rows.map((row) => row.original) || [];
|
||||
$: selected =
|
||||
$table?.getSelectedRowModel().rows.map((row) => row.index) || [];
|
||||
|
||||
$: dataLoaded = false;
|
||||
|
||||
let modal_open = false;
|
||||
let delete_donor = {};
|
||||
export let current_donors = [];
|
||||
const donors_promise = DonorService.donorControllerGetAll().then((val) => {
|
||||
current_donors = val;
|
||||
export const addDonors = (donors) => {
|
||||
current_donors = current_donors.concat(...donors);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donors,
|
||||
}));
|
||||
};
|
||||
|
||||
//Section table
|
||||
const columns = [
|
||||
{
|
||||
accessorKey: "id",
|
||||
header: () => "id",
|
||||
filterFn: `equalsString`,
|
||||
},
|
||||
{
|
||||
accessorKey: "name",
|
||||
header: () => $_("name"),
|
||||
cell: (info) => {
|
||||
const d = info.row.original;
|
||||
if (d.middlename) {
|
||||
return `${d.firstname} ${d.middlename} ${d.lastname}`;
|
||||
} else {
|
||||
return `${d.firstname} ${d.lastname}`;
|
||||
}
|
||||
},
|
||||
filterFn: `includesString`,
|
||||
},
|
||||
{
|
||||
accessorKey: "address",
|
||||
header: () => $_("contact-information"),
|
||||
cell: (info) => {
|
||||
return renderComponent(DonorAddress, { address: info.getValue() });
|
||||
},
|
||||
filterFn: `includesString`,
|
||||
},
|
||||
{
|
||||
accessorKey: "sponsorings",
|
||||
header: () => $_("sponsorings"),
|
||||
cell: (info) => {
|
||||
const donations = current_donations.filter(
|
||||
(d) => d?.donor?.id == info.row.original.id
|
||||
);
|
||||
return renderComponent(DonorDonations, { donations });
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "donationAmount",
|
||||
header: () => $_("total-donation-amount"),
|
||||
cell: (info) => {
|
||||
return `${(info.getValue() / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString("de-DE", { valute: "EUR" })}€`;
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "paidDonationAmount",
|
||||
header: () => $_("total-paid-amount"),
|
||||
cell: (info) => {
|
||||
return `${(info.getValue() / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString("de-DE", { valute: "EUR" })}€`;
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "actions",
|
||||
header: () => $_("action"),
|
||||
cell: (info) => {
|
||||
return renderComponent(TableActions, {
|
||||
detailsLink: `./${info.row.original.id}`,
|
||||
deleteAction: () => {
|
||||
active_deletes = current_donors.filter(
|
||||
(r) => r.id == info.row.original.id
|
||||
);
|
||||
},
|
||||
deleteEnabled:
|
||||
store.state.jwtinfo.userdetails.permissions.includes(
|
||||
"DONOR:DELETE"
|
||||
),
|
||||
});
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
enableSorting: false,
|
||||
},
|
||||
];
|
||||
const options = writable({
|
||||
data: [],
|
||||
columns: columns,
|
||||
initialState: {
|
||||
pagination: {
|
||||
pageSize: 50,
|
||||
},
|
||||
},
|
||||
enableRowSelection: true,
|
||||
getCoreRowModel: getCoreRowModel(),
|
||||
getFilteredRowModel: getFilteredRowModel(),
|
||||
getPaginationRowModel: getPaginationRowModel(),
|
||||
getSortedRowModel: getSortedRowModel(),
|
||||
});
|
||||
const donation_promise = DonationService.donationControllerGetAll().then(
|
||||
(val) => {
|
||||
current_donations = val;
|
||||
}
|
||||
);
|
||||
const table = createSvelteTable(options);
|
||||
|
||||
function should_display_based_on_id(id) {
|
||||
if (searchvalue.toString().slice(-1) === "*") {
|
||||
return id.toString().startsWith(searchvalue.replace("*", ""));
|
||||
}
|
||||
return id.toString() === searchvalue;
|
||||
}
|
||||
|
||||
onMount(async () => {
|
||||
let page = 0;
|
||||
while (page >= 0) {
|
||||
const donors = await DonorService.donorControllerGetAll(page, 500);
|
||||
const donations = await DonationService.donationControllerGetAll(
|
||||
page,
|
||||
500
|
||||
);
|
||||
if (donors.length == 0 && donations.length == 0) {
|
||||
page = -2;
|
||||
}
|
||||
|
||||
current_donors = current_donors.concat(...donors);
|
||||
current_donations = current_donations.concat(...donors);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donors,
|
||||
}));
|
||||
|
||||
dataLoaded = true;
|
||||
page++;
|
||||
}
|
||||
|
||||
console.log("All donors loaded");
|
||||
});
|
||||
</script>
|
||||
|
||||
<ConfirmDonorDeletion
|
||||
on:cancelDelete={(event) => {
|
||||
modal_open = false;
|
||||
active_deletes[event.detail.id] = false;
|
||||
active_deletes = active_deletes.filter((a) => a.id !== event.detail.id);
|
||||
}}
|
||||
bind:modal_open
|
||||
bind:delete_donor />
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:GET')}
|
||||
{#await donors_promise && donation_promise}
|
||||
on:delete={async (event) => {
|
||||
await DonorService.donorControllerRemove(event.detail.id, true);
|
||||
Toastify({
|
||||
text: $_("donor-deleted"),
|
||||
duration: 500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
current_donors = current_donors.filter((d) => d.id !== event.detail.id);
|
||||
active_deletes = active_deletes.filter((a) => a.id !== event.detail.id);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_donors,
|
||||
}));
|
||||
}}
|
||||
modal_open={active_deletes.length > 0}
|
||||
delete_donor={active_deletes[0]}
|
||||
/>
|
||||
{active_deletes.length}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("DONOR:GET")}
|
||||
{#if !dataLoaded}
|
||||
<div
|
||||
class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
|
||||
role="alert">
|
||||
<p class="font-bold">{$_('donors-are-being-loaded')}</p>
|
||||
<p class="text-sm">{$_('this-might-take-a-moment')}</p>
|
||||
role="alert"
|
||||
>
|
||||
<p class="font-bold">{$_("donors-are-being-loaded")}</p>
|
||||
<p class="text-sm">{$_("this-might-take-a-moment")}</p>
|
||||
</div>
|
||||
{:then}
|
||||
{#if current_donors.length === 0}
|
||||
<DonorsEmptyState />
|
||||
{:else}
|
||||
<input
|
||||
type="search"
|
||||
bind:value={searchvalue}
|
||||
placeholder={$_('datatable.search')}
|
||||
aria-label={$_('datatable.search')}
|
||||
class="mb-4" />
|
||||
<div
|
||||
class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll">
|
||||
<table class="divide-y divide-gray-200 w-full">
|
||||
<thead class="bg-gray-50">
|
||||
<tr>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('name')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('contact-information')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('donations')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('total-donation-amount')}
|
||||
</th>
|
||||
<th
|
||||
scope="col"
|
||||
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
||||
{$_('total-paid-amount')}
|
||||
</th>
|
||||
<th scope="col" class="relative px-6 py-3">
|
||||
<span class="sr-only">{$_('action')}</span>
|
||||
{:else if current_donors.length === 0}
|
||||
<DonorsEmptyState />
|
||||
{:else}
|
||||
<input
|
||||
type="search"
|
||||
bind:value={searchvalue}
|
||||
placeholder={$_("datatable.search")}
|
||||
aria-label={$_("datatable.search")}
|
||||
class="mb-4"
|
||||
/>
|
||||
<div
|
||||
class="shadow border-b border-gray-200 sm:rounded-lg overflow-x-scroll"
|
||||
>
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
{#each $table.getHeaderGroups() as headerGroup}
|
||||
<tr class="select-none">
|
||||
<th class="inset-y-0 left-0 px-4 py-2 text-left w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={$table.getIsAllRowsSelected()}
|
||||
indeterminate={$table.getIsSomeRowsSelected()}
|
||||
on:change={() => $table.toggleAllRowsSelected()}
|
||||
/>
|
||||
</th>
|
||||
{#each headerGroup.headers as header}
|
||||
<TableHeader {header} />
|
||||
{/each}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-gray-200">
|
||||
{#each current_donors as donor}
|
||||
{#if donor.firstname
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
searchvalue.toLowerCase()
|
||||
) || donor.lastname
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
searchvalue.toLowerCase()
|
||||
) || should_display_based_on_id(donor.id)}
|
||||
<tr data-rowid="donor_{donor.id}">
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<div class="ml-4">
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{donor.firstname}
|
||||
{donor.middlename || ''}
|
||||
{donor.lastname}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{#if donor.email}
|
||||
<div class="text-sm text-gray-500">{donor.email}</div>
|
||||
{/if}
|
||||
{#if donor.phone}
|
||||
<div class="text-sm text-gray-500">{donor.phone}</div>
|
||||
{/if}
|
||||
{#if donor.address.address1 !== null}
|
||||
{donor.address.address1}<br />
|
||||
{donor.address.address2 || ''}<br />
|
||||
{donor.address.postalcode}
|
||||
{donor.address.city}
|
||||
{donor.address.country}
|
||||
{/if}
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{#if current_donations.filter((d) => d.donor.id == donor.id).length > 0}
|
||||
{#each current_donations.filter((o) => o.donor.id == donor.id) as d}
|
||||
{#if d.responseType === 'DISTANCEDONATION'}
|
||||
<a
|
||||
href="../donations/{d.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-blue-600 text-white mr-1">{d.runner.firstname}
|
||||
{d.runner.middlename || ''}
|
||||
{d.runner.lastname}</a>
|
||||
{:else}
|
||||
<a
|
||||
href="../donations/{d.id}"
|
||||
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-700 text-white mr-1">{$_('fixed-donation')}:
|
||||
{(d.amount / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString('de-DE', { valute: 'EUR' })}€</a>
|
||||
{/if}
|
||||
{/each}
|
||||
{:else}{$_('donor-has-no-associated-donations')}{/if}
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{(donor.donationAmount / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString('de-DE', { valute: 'EUR' })}€
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
{(donor.paidDonationAmount / 100)
|
||||
.toFixed(2)
|
||||
.toLocaleString('de-DE', { valute: 'EUR' })}€
|
||||
</td>
|
||||
{#if active_deletes[donor.id] === true}
|
||||
<td
|
||||
class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
||||
<button
|
||||
on:click={() => {
|
||||
active_deletes[donor.id] = false;
|
||||
}}
|
||||
tabindex="0"
|
||||
class="ml-4 text-indigo-600 hover:text-indigo-900 cursor-pointer">{$_('cancel-delete')}</button>
|
||||
<button
|
||||
on:click={() => {
|
||||
DonorService.donorControllerRemove(donor.id, false)
|
||||
.then((resp) => {
|
||||
current_donors = current_donors.filter((obj) => obj.id !== donor.id);
|
||||
Toastify({
|
||||
text: 'Donor deleted',
|
||||
duration: 500,
|
||||
backgroundColor:
|
||||
'linear-gradient(to right, #00b09b, #96c93d)',
|
||||
}).showToast();
|
||||
})
|
||||
.catch((err) => {
|
||||
modal_open = true;
|
||||
delete_donor = donor;
|
||||
});
|
||||
}}
|
||||
tabindex="0"
|
||||
class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('confirm-delete')}</button>
|
||||
</td>
|
||||
{:else}
|
||||
<td
|
||||
class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
|
||||
<a
|
||||
href="./{donor.id}"
|
||||
class="text-indigo-600 hover:text-indigo-900">{$_('details')}</a>
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('DONOR:DELETE')}
|
||||
<button
|
||||
on:click={() => {
|
||||
active_deletes[donor.id] = true;
|
||||
}}
|
||||
tabindex="0"
|
||||
class="ml-4 text-red-600 hover:text-red-900 cursor-pointer">{$_('delete')}</button>
|
||||
{/if}
|
||||
</td>
|
||||
{/if}
|
||||
</tr>
|
||||
{/if}
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{/if}
|
||||
{:catch error}
|
||||
<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
|
||||
<span class="inline-block align-middle mr-8">
|
||||
<b class="capitalize">{$_('general_promise_error')}</b>
|
||||
{error}
|
||||
</span>
|
||||
{/each}
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each $table.getRowModel().rows as row}
|
||||
<tr>
|
||||
<td class="inset-y-0 left-0 px-4 py-2 text-center w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={row.getIsSelected()}
|
||||
on:change={() => row.toggleSelected()}
|
||||
/>
|
||||
</td>
|
||||
{#each row.getVisibleCells() as cell}
|
||||
<td>
|
||||
<svelte:component
|
||||
this={flexRender(
|
||||
cell.column.columnDef.cell,
|
||||
cell.getContext()
|
||||
)}
|
||||
/>
|
||||
</td>
|
||||
{/each}
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{/await}
|
||||
<div class="h-2" />
|
||||
<TableBottom {table} {selected} />
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
@@ -119,9 +119,9 @@
|
||||
}
|
||||
}
|
||||
async function copy() {
|
||||
if(!editable.registrationKey){
|
||||
if (!editable.registrationKey) {
|
||||
Toastify({
|
||||
text: $_('you-have-to-save-your-changes-to-generate-a-link'),
|
||||
text: $_("you-have-to-save-your-changes-to-generate-a-link"),
|
||||
duration: 500,
|
||||
backgroundColor:
|
||||
"linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
|
||||
@@ -167,7 +167,8 @@
|
||||
passed_orgs={[]}
|
||||
passed_org={editable}
|
||||
opened_from="OrgDetail"
|
||||
bind:import_modal_open />
|
||||
bind:import_modal_open
|
||||
/>
|
||||
<ConfirmOrgDeletion bind:modal_open bind:delete_org />
|
||||
{#if data_loaded}
|
||||
<section class="container p-5">
|
||||
@@ -176,29 +177,35 @@
|
||||
<span data-id="org_actions_${editable.id}">
|
||||
<GenerateSponsoringContracts
|
||||
bind:sponsoring_contracts_show
|
||||
bind:generate_orgs />
|
||||
bind:generate_orgs
|
||||
/>
|
||||
<GenerateRunnerCards bind:cards_show bind:generate_orgs />
|
||||
<GenerateRunnerCertificates bind:certificates_show bind:generate_orgs />
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:IMPORT')}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("RUNNER:IMPORT")}
|
||||
<button
|
||||
on:click={() => {
|
||||
import_modal_open = true;
|
||||
}}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('import-runners')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("import-runners")}
|
||||
</button>
|
||||
{/if}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes('RUNNER:DELETE')}
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("RUNNER:DELETE")}
|
||||
{#if delete_triggered}
|
||||
<button
|
||||
on:click={deleteOrganization}
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('confirm-delete')}</button>
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>{$_("confirm-delete")}</button
|
||||
>
|
||||
<button
|
||||
on:click={() => {
|
||||
delete_triggered = !delete_triggered;
|
||||
}}
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm">{$_('cancel')}</button>
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-400 text-base font-medium text-white sm:w-auto sm:text-sm"
|
||||
>{$_("cancel")}</button
|
||||
>
|
||||
{/if}
|
||||
{#if !delete_triggered}
|
||||
<button
|
||||
@@ -206,7 +213,9 @@
|
||||
delete_triggered = true;
|
||||
}}
|
||||
type="button"
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('delete-organization')}</button>
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>{$_("delete-organization")}</button
|
||||
>
|
||||
{/if}
|
||||
{/if}
|
||||
{#if !delete_triggered}
|
||||
@@ -215,7 +224,9 @@
|
||||
disabled={!save_enabled}
|
||||
class:opacity-50={!save_enabled}
|
||||
type="button"
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm">{$_('save-changes')}</button>
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>{$_("save-changes")}</button
|
||||
>
|
||||
{/if}
|
||||
</span>
|
||||
</div>
|
||||
@@ -234,12 +245,13 @@
|
||||
class="h-3 w-3 stroke-current"
|
||||
height="1em"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"><path
|
||||
d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
|
||||
<polyline points="9 22 9 12 15 12 15 22" /></svg>
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
|
||||
<polyline points="9 22 9 12 15 12 15 22" /></svg
|
||||
>
|
||||
</li>
|
||||
<li class="flex items-center">
|
||||
<a class="mr-2" href="/">{$_('home')}</a><svg
|
||||
<a class="mr-2" href="/">{$_("home")}</a><svg
|
||||
stroke="currentColor"
|
||||
fill="none"
|
||||
stroke-width="2"
|
||||
@@ -249,24 +261,25 @@
|
||||
class="h-3 w-3 mr-2 stroke-current"
|
||||
height="1em"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"><line
|
||||
x1="5"
|
||||
y1="12"
|
||||
x2="19"
|
||||
y2="12" />
|
||||
<polyline points="12 5 19 12 12 19" /></svg>
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><line x1="5" y1="12" x2="19" y2="12" />
|
||||
<polyline points="12 5 19 12 12 19" /></svg
|
||||
>
|
||||
</li>
|
||||
<li class="mr-2 flex items-center">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M21 20h2v2H1v-2h2V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v17zm-2 0V4H5v16h14zM8 11h3v2H8v-2zm0-4h3v2H8V7zm0 8h3v2H8v-2zm5 0h3v2h-3v-2zm0-4h3v2h-3v-2zm0-4h3v2h-3V7z" /></svg>
|
||||
d="M21 20h2v2H1v-2h2V3a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v17zm-2 0V4H5v16h14zM8 11h3v2H8v-2zm0-4h3v2H8V7zm0 8h3v2H8v-2zm5 0h3v2h-3v-2zm0-4h3v2h-3v-2zm0-4h3v2h-3V7z"
|
||||
/></svg
|
||||
>
|
||||
</li>
|
||||
<li class="flex items-center">
|
||||
<a class="mr-2" href="./">{$_('organizations')}</a><svg
|
||||
<a class="mr-2" href="./">{$_("organizations")}</a><svg
|
||||
stroke="currentColor"
|
||||
fill="none"
|
||||
stroke-width="2"
|
||||
@@ -276,12 +289,10 @@
|
||||
class="h-3 w-3 mr-2 stroke-current"
|
||||
height="1em"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"><line
|
||||
x1="5"
|
||||
y1="12"
|
||||
x2="19"
|
||||
y2="12" />
|
||||
<polyline points="12 5 19 12 12 19" /></svg>
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><line x1="5" y1="12" x2="19" y2="12" />
|
||||
<polyline points="12 5 19 12 12 19" /></svg
|
||||
>
|
||||
</li>
|
||||
<li class="flex items-center">
|
||||
<span class="mr-2">Org-Details #{params.orgid}</span>
|
||||
@@ -291,35 +302,34 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-sm w-full">
|
||||
<label for="name" class="font-medium text-gray-700">{$_('name')}</label>
|
||||
<label for="name" class="font-medium text-gray-700">{$_("name")}</label>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('name')}
|
||||
placeholder={$_("name")}
|
||||
type="text"
|
||||
bind:value={editable.name}
|
||||
name="name"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="text-sm w-full">
|
||||
<label
|
||||
for="contact"
|
||||
class="font-medium text-gray-700">{$_('contact')}</label>
|
||||
<label for="contact" class="font-medium text-gray-700"
|
||||
>{$_("contact")}</label
|
||||
>
|
||||
<Select
|
||||
containerClasses="rounded-l-md mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
itemFilter={(label, filterText, option) => label
|
||||
.toLowerCase()
|
||||
.includes(
|
||||
filterText.toLowerCase()
|
||||
) || option.value.id
|
||||
.toString()
|
||||
.startsWith(filterText.toLowerCase())}
|
||||
itemFilter={(label, filterText, option) =>
|
||||
label.toLowerCase().includes(filterText.toLowerCase()) ||
|
||||
option.value.id.toString().startsWith(filterText.toLowerCase())}
|
||||
items={contacts}
|
||||
showChevron={true}
|
||||
placeholder={$_('no-contact-selected')}
|
||||
noOptionsMessage={$_('no-contact-found')}
|
||||
placeholder={$_("no-contact-selected")}
|
||||
noOptionsMessage={$_("no-contact-found")}
|
||||
bind:selectedValue={contact}
|
||||
on:select={(selectedValue) => (editable.contact = selectedValue.detail.value)}
|
||||
on:clear={() => (editable.contact = null)} />
|
||||
on:select={(selectedValue) =>
|
||||
(editable.contact = selectedValue.detail.value)}
|
||||
on:clear={() => (editable.contact = null)}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-start mt-2">
|
||||
@@ -329,43 +339,51 @@
|
||||
id="toggle_selfservice_feature"
|
||||
name="toggle_selfservice_feature"
|
||||
type="checkbox"
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-3 text-sm">
|
||||
<label
|
||||
for="toggle_selfservice_feature"
|
||||
class="font-medium text-gray-700">{$_('selfservice-registration')}</label>
|
||||
class="font-medium text-gray-700"
|
||||
>{$_("selfservice-registration")}</label
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
{#if editable.registrationEnabled}
|
||||
<div class="text-sm w-full">
|
||||
<div on:click={copy} class="inline-flex w-full">
|
||||
<button on:click={copy} class="inline-flex w-full">
|
||||
<p
|
||||
name="token"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2">
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
|
||||
>
|
||||
{#if editable.registrationKey}
|
||||
{registrationLink}
|
||||
{registrationLink}
|
||||
{:else}
|
||||
{$_('you-have-to-save-your-changes-to-generate-a-link')}
|
||||
{$_("you-have-to-save-your-changes-to-generate-a-link")}
|
||||
{/if}
|
||||
</p>
|
||||
<div
|
||||
class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer">
|
||||
class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
|
||||
d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
{#if editable.registrationKey}
|
||||
<p class="text-gray-500 text-xs">
|
||||
{$_('click-to-copy-the-link-into-your-clipboard')}
|
||||
</p>
|
||||
<p class="text-gray-500 text-xs">
|
||||
{$_("click-to-copy-the-link-into-your-clipboard")}
|
||||
</p>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
@@ -378,12 +396,14 @@
|
||||
id="toggle_address_checkbox"
|
||||
name="toggle_address_checkbox"
|
||||
type="checkbox"
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded" />
|
||||
class="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded"
|
||||
/>
|
||||
</div>
|
||||
<div class="ml-3 text-sm">
|
||||
<label
|
||||
for="toggle_address_checkbox"
|
||||
class="font-medium text-gray-700">{$_('address')}</label>
|
||||
class="font-medium text-gray-700">{$_("address")}</label
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -391,7 +411,9 @@
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="address1"
|
||||
class="block text-sm font-medium text-gray-700">{$_('address')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("address")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder="Address"
|
||||
@@ -401,65 +423,74 @@
|
||||
bind:value={editable.address.address1}
|
||||
type="text"
|
||||
name="address1"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !isAddress1Valid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('address-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("address-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="address2"
|
||||
class="block text-sm font-medium text-gray-700">{$_('apartment-suite-etc')}</label>
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("apartment-suite-etc")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('apartment-suite-etc')}
|
||||
placeholder={$_("apartment-suite-etc")}
|
||||
bind:value={editable.address.address2}
|
||||
type="text"
|
||||
name="address2"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="zipcode"
|
||||
class="block text-sm font-medium text-gray-700">{$_('zip-postal-code')}</label>
|
||||
<label for="zipcode" class="block text-sm font-medium text-gray-700"
|
||||
>{$_("zip-postal-code")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('zip-postal-code')}
|
||||
placeholder={$_("zip-postal-code")}
|
||||
class:border-red-500={!iszipcodevalid}
|
||||
class:focus:border-red-500={!iszipcodevalid}
|
||||
class:focus:ring-red-500={!iszipcodevalid}
|
||||
bind:value={editable.address.postalcode}
|
||||
type="text"
|
||||
name="zipcode"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !iszipcodevalid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('valid-zipcode-postal-code-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("valid-zipcode-postal-code-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-span-6">
|
||||
<label
|
||||
for="city"
|
||||
class="block text-sm font-medium text-gray-700">{$_('city')}</label>
|
||||
<label for="city" class="block text-sm font-medium text-gray-700"
|
||||
>{$_("city")}</label
|
||||
>
|
||||
<input
|
||||
autocomplete="off"
|
||||
placeholder={$_('city')}
|
||||
placeholder={$_("city")}
|
||||
class:border-red-500={!iscityvalid}
|
||||
class:focus:border-red-500={!iscityvalid}
|
||||
class:focus:ring-red-500={!iscityvalid}
|
||||
bind:value={editable.address.city}
|
||||
type="text"
|
||||
name="city"
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2" />
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
{#if !iscityvalid}
|
||||
<span
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1">
|
||||
{$_('valid-city-is-required')}
|
||||
class="flex items-center font-medium tracking-wide text-red-500 text-xs mt-1 ml-1"
|
||||
>
|
||||
{$_("valid-city-is-required")}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -469,7 +500,7 @@
|
||||
</section>
|
||||
{:else}
|
||||
{#await promise}
|
||||
{$_('organization-detail-is-being-loaded')}
|
||||
{$_("organization-detail-is-being-loaded")}
|
||||
{:catch error}
|
||||
<PromiseError />
|
||||
{/await}
|
||||
|
||||
@@ -132,7 +132,7 @@
|
||||
<div class="text-sm font-medium text-gray-900">
|
||||
{#if o.address.address1 !== null}
|
||||
{o.address.address1}<br />
|
||||
{o.address.address2 || ''}<br />
|
||||
<!-- {o.address.address2 || ''}<br /> -->
|
||||
{o.address.postalcode}
|
||||
{o.address.city}
|
||||
{o.address.country}
|
||||
|
||||
@@ -50,7 +50,6 @@
|
||||
}));
|
||||
};
|
||||
|
||||
|
||||
//Section table
|
||||
const columns = [
|
||||
{
|
||||
@@ -157,16 +156,7 @@
|
||||
}).showToast();
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
RunnerService.runnerControllerGetAll().then((val) => {
|
||||
current_runners = val;
|
||||
dataLoaded = true;
|
||||
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_runners,
|
||||
}));
|
||||
});
|
||||
onMount(async () => {
|
||||
RunnerTeamService.runnerTeamControllerGetAll().then((val) => {
|
||||
teams = val;
|
||||
});
|
||||
@@ -175,6 +165,24 @@
|
||||
orgs = val;
|
||||
}
|
||||
);
|
||||
|
||||
let page = 0;
|
||||
while (page >= 0) {
|
||||
const runners = await RunnerService.runnerControllerGetAll(page, 1000);
|
||||
if (runners.length == 0) {
|
||||
page = -2;
|
||||
}
|
||||
|
||||
current_runners = current_runners.concat(...runners);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_runners,
|
||||
}));
|
||||
|
||||
dataLoaded = true;
|
||||
page++;
|
||||
}
|
||||
console.log("All runners loaded");
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@@ -30,6 +30,7 @@
|
||||
$table?.getSelectedRowModel().rows.map((row) => row.index) || [];
|
||||
|
||||
$: active_delete = undefined;
|
||||
$: dataLoaded = false;
|
||||
export let current_scans = [];
|
||||
export const addScans = (scans) => {
|
||||
current_scans = current_scans.concat(...scans);
|
||||
@@ -39,15 +40,6 @@
|
||||
}));
|
||||
};
|
||||
|
||||
const scans_promise = ScanService.scanControllerGetAll().then((val) => {
|
||||
current_scans = val;
|
||||
// handler.setRows(val);
|
||||
current_scans = val;
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_scans,
|
||||
}));
|
||||
});
|
||||
let allTracks = [];
|
||||
TrackService.trackControllerGetAll().then((val) => {
|
||||
allTracks = val;
|
||||
@@ -95,6 +87,14 @@
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "timestamp",
|
||||
header: () => $_("timestamp"),
|
||||
cell: (info) => {
|
||||
return new Date(parseInt(info.getValue()) * 1000).toLocaleString();
|
||||
},
|
||||
enableColumnFilter: false,
|
||||
},
|
||||
{
|
||||
accessorKey: "distance",
|
||||
header: () => $_("distance"),
|
||||
@@ -175,6 +175,26 @@
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
}
|
||||
|
||||
onMount(async () => {
|
||||
let page = 0;
|
||||
while (page >= 0) {
|
||||
const scans = await ScanService.scanControllerGetAll(page, 500);
|
||||
if (scans.length == 0) {
|
||||
page = -2;
|
||||
}
|
||||
|
||||
current_scans = current_scans.concat(...scans);
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_scans,
|
||||
}));
|
||||
|
||||
dataLoaded = true;
|
||||
page++;
|
||||
}
|
||||
console.log("All scans loaded");
|
||||
});
|
||||
</script>
|
||||
|
||||
<DeleteScanModal
|
||||
@@ -185,7 +205,7 @@
|
||||
}}
|
||||
/>
|
||||
{#if store.state.jwtinfo.userdetails.permissions.includes("SCAN:GET")}
|
||||
{#await scans_promise}
|
||||
{#if !dataLoaded}
|
||||
<div
|
||||
class="bg-teal-lightest border-t-4 border-teal rounded-b text-teal-darkest px-4 py-3 shadow-md my-2"
|
||||
role="alert"
|
||||
@@ -193,105 +213,96 @@
|
||||
<p class="font-bold">{$_("scans-are-being-loaded")}</p>
|
||||
<p class="text-sm">{$_("this-might-take-a-moment")}</p>
|
||||
</div>
|
||||
{:then}
|
||||
{#if current_scans.length === 0}
|
||||
<ScansEmptyState />
|
||||
{:else}
|
||||
{#if selected.length > 0}
|
||||
<button
|
||||
type="button"
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
|
||||
id="options-menu"
|
||||
on:click={async () => {
|
||||
const prom = [];
|
||||
for (const scan of selectedScans) {
|
||||
prom.push(ScanService.scanControllerRemove(scan.id, true));
|
||||
}
|
||||
await Promise.all(prom);
|
||||
for (const scan of selectedScans) {
|
||||
current_scans = current_scans.filter((r) => r.id !== scan.id);
|
||||
}
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_scans,
|
||||
}));
|
||||
$table.resetRowSelection();
|
||||
Toastify({
|
||||
text: $_("scan-deleted"),
|
||||
duration: 3500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
}}
|
||||
{:else if current_scans.length === 0}
|
||||
<ScansEmptyState />
|
||||
{:else}
|
||||
{#if selected.length > 0}
|
||||
<button
|
||||
type="button"
|
||||
class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
|
||||
id="options-menu"
|
||||
on:click={async () => {
|
||||
const prom = [];
|
||||
for (const scan of selectedScans) {
|
||||
prom.push(ScanService.scanControllerRemove(scan.id, true));
|
||||
}
|
||||
await Promise.all(prom);
|
||||
for (const scan of selectedScans) {
|
||||
current_scans = current_scans.filter((r) => r.id !== scan.id);
|
||||
}
|
||||
options.update((options) => ({
|
||||
...options,
|
||||
data: current_scans,
|
||||
}));
|
||||
$table.resetRowSelection();
|
||||
Toastify({
|
||||
text: $_("scan-deleted"),
|
||||
duration: 3500,
|
||||
backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
|
||||
}).showToast();
|
||||
}}
|
||||
>
|
||||
{$_("delete-scans")}
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-5 h-5"
|
||||
>
|
||||
{$_("delete-scans")}
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-5 h-5"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
{/if}
|
||||
<div class="overflow-x-auto">
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
{#each $table.getHeaderGroups() as headerGroup}
|
||||
<tr class="select-none">
|
||||
<th class="inset-y-0 left-0 px-4 py-2 text-left w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={$table.getIsAllRowsSelected()}
|
||||
indeterminate={$table.getIsSomeRowsSelected()}
|
||||
on:change={() => $table.toggleAllRowsSelected()}
|
||||
/>
|
||||
</th>
|
||||
{#each headerGroup.headers as header}
|
||||
<TableHeader {header} />
|
||||
{/each}
|
||||
</tr>
|
||||
{/each}
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each $table.getRowModel().rows as row}
|
||||
<tr>
|
||||
<td class="inset-y-0 left-0 px-4 py-2 text-center w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={row.getIsSelected()}
|
||||
on:change={() => row.toggleSelected()}
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
{/if}
|
||||
<div class="overflow-x-auto">
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
{#each $table.getHeaderGroups() as headerGroup}
|
||||
<tr class="select-none">
|
||||
<th class="inset-y-0 left-0 px-4 py-2 text-left w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={$table.getIsAllRowsSelected()}
|
||||
indeterminate={$table.getIsSomeRowsSelected()}
|
||||
on:change={() => $table.toggleAllRowsSelected()}
|
||||
/>
|
||||
</th>
|
||||
{#each headerGroup.headers as header}
|
||||
<TableHeader {header} />
|
||||
{/each}
|
||||
</tr>
|
||||
{/each}
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each $table.getRowModel().rows as row}
|
||||
<tr>
|
||||
<td class="inset-y-0 left-0 px-4 py-2 text-center w-px">
|
||||
<InputElement
|
||||
type="checkbox"
|
||||
checked={row.getIsSelected()}
|
||||
on:change={() => row.toggleSelected()}
|
||||
/>
|
||||
</td>
|
||||
{#each row.getVisibleCells() as cell}
|
||||
<td>
|
||||
<svelte:component
|
||||
this={flexRender(
|
||||
cell.column.columnDef.cell,
|
||||
cell.getContext()
|
||||
)}
|
||||
/>
|
||||
</td>
|
||||
{#each row.getVisibleCells() as cell}
|
||||
<td>
|
||||
<svelte:component
|
||||
this={flexRender(
|
||||
cell.column.columnDef.cell,
|
||||
cell.getContext()
|
||||
)}
|
||||
/>
|
||||
</td>
|
||||
{/each}
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<TableBottom {table} {selected} />
|
||||
{/if}
|
||||
{:catch error}
|
||||
<div class="text-white px-6 py-4 border-0 rounded relative mb-4 bg-red-500">
|
||||
<span class="inline-block align-middle mr-8">
|
||||
<b class="capitalize">{$_("general_promise_error")}</b>
|
||||
{error}
|
||||
</span>
|
||||
{/each}
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{/await}
|
||||
<TableBottom {table} {selected} />
|
||||
{/if}
|
||||
{/if}
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
dispatch("cancelDelete", { id: delete_station.id });
|
||||
}
|
||||
function deleteStation() {
|
||||
ScanStationService.donorControllerRemove(
|
||||
ScanStationService.scanStationControllerRemove(
|
||||
delete_station.id,
|
||||
true
|
||||
)
|
||||
|
||||
@@ -1,14 +1,18 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
|
||||
import Toastify from "toastify-js";
|
||||
import { tick, createEventDispatcher } from "svelte";
|
||||
import bwipjs from "bwip-js";
|
||||
|
||||
export let copy_modal_open;
|
||||
export let new_station;
|
||||
const dispatch = createEventDispatcher();
|
||||
let valueCopy = null;
|
||||
let areaDom;
|
||||
let copied = false;
|
||||
$: is_qrcode = false;
|
||||
$: barcode = textToBase64Barcode(new_station.key, is_qrcode);
|
||||
|
||||
function close() {
|
||||
copy_modal_open = false;
|
||||
}
|
||||
@@ -36,91 +40,167 @@
|
||||
"linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
|
||||
}).showToast();
|
||||
}
|
||||
|
||||
// we can notifi by event or storage about copy status
|
||||
valueCopy = null;
|
||||
}
|
||||
|
||||
function textToBase64Barcode(text, is_qrcode) {
|
||||
const canvas = document.createElement("canvas");
|
||||
let bcid = "code128";
|
||||
if (is_qrcode) {
|
||||
bcid = "qrcode";
|
||||
}
|
||||
let codeconfig = {
|
||||
bcid,
|
||||
text: `${text}`,
|
||||
scale: 4,
|
||||
includetext: true,
|
||||
textxalign: "center",
|
||||
backgroundcolor: "ffffff",
|
||||
};
|
||||
if (bcid == "code128") {
|
||||
codeconfig.height = 10;
|
||||
}
|
||||
bwipjs.toCanvas(canvas, codeconfig);
|
||||
return canvas.toDataURL("image/png");
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if copy_modal_open}
|
||||
{#if valueCopy != null}
|
||||
<textarea bind:this={areaDom}>{valueCopy}</textarea>
|
||||
{/if}
|
||||
<div class="fixed z-10 inset-0 overflow-y-auto" >
|
||||
<div class="fixed z-10 inset-0 overflow-y-auto">
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop" />
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span>
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline">
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
viewBox="0 0 24 24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
|
||||
d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_('token')}
|
||||
{$_("token")}
|
||||
</h3>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_('the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again')}
|
||||
{$_(
|
||||
"the-scanstations-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again"
|
||||
)}
|
||||
<br />
|
||||
{$_('please-copy-the-token-and-store-it-somewhere-save')}
|
||||
{$_("please-copy-the-token-and-store-it-somewhere-save")}
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-2 mb-6">
|
||||
<label
|
||||
for="token"
|
||||
class="block text-sm font-medium text-gray-700">{$_('token')}</label>
|
||||
<div on:click={copy} class="inline-flex">
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("token")}</label
|
||||
>
|
||||
<button on:click={copy} class="inline-flex">
|
||||
<p
|
||||
name="token"
|
||||
class:bg-green-200={copied}
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2">
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
|
||||
>
|
||||
{new_station.key}
|
||||
</p>
|
||||
<div
|
||||
class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer">
|
||||
class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
|
||||
d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
<p class="text-gray-500 text-xs">
|
||||
{$_('click-to-copy-token-to-clipboard')}
|
||||
{$_("click-to-copy-token-to-clipboard")}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mx-auto text-center items-center">
|
||||
<h2 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_("config-codes")}
|
||||
</h2>
|
||||
<span class="flex items-center text-center">
|
||||
<p class="text-md text-gray-900 mr-3">Format:</p>
|
||||
<label for="codeswitch" class="text-md text-gray-900 mr-3"
|
||||
>Code128</label
|
||||
>
|
||||
<input
|
||||
id="codeswitch"
|
||||
type="checkbox"
|
||||
bind:checked={is_qrcode}
|
||||
class="relative shrink-0 w-[3.25rem] h-7 bg-gray-100 checked:bg-none checked:bg-blue-600 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 border border-transparent ring-1 ring-transparent focus:border-blue-600 focus:ring-blue-600 ring-offset-white focus:outline-none appearance-none before:inline-block before:w-6 before:h-6 before:bg-white checked:before:bg-blue-200 before:translate-x-0 checked:before:translate-x-full before:shadow before:rounded-full before:transform before:ring-0 before:transition before:ease-in-out before:duration-200 dark:before:bg-gray-400 dark:checked:before:bg-blue-200"
|
||||
/>
|
||||
<label for="codeswitch" class="text-md text-gray-900 ml-3"
|
||||
>QR-Code</label
|
||||
>
|
||||
</span>
|
||||
<h3 class="leading-6 font-medium text-gray-900">
|
||||
{$_("api-endpoint")}
|
||||
</h3>
|
||||
<img
|
||||
class:w-[50%]={is_qrcode}
|
||||
class:w-full={!is_qrcode}
|
||||
class="md:w-auto mb-2 mx-auto"
|
||||
alt="Registrierungscode"
|
||||
src={textToBase64Barcode(config.baseurl, is_qrcode)}
|
||||
/>
|
||||
<h3 class="leading-6 font-medium text-gray-900">{$_("token")}</h3>
|
||||
<img
|
||||
class:w-[50%]={is_qrcode}
|
||||
class:w-full={!is_qrcode}
|
||||
class="md:w-auto mb-2 mx-auto"
|
||||
alt="Registrierungscode"
|
||||
src={barcode}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse">
|
||||
<button
|
||||
on:click={close}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-green-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('yes-i-copied-the-token')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-green-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("yes-i-copied-the-token")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
import { clickOutside } from "../base/outsideclick";
|
||||
|
||||
import { ScanStationService } from "@odit/lfk-client-js";
|
||||
import { StatsClientService } from "@odit/lfk-client-js";
|
||||
import Toastify from "toastify-js";
|
||||
import { createEventDispatcher } from "svelte";
|
||||
export let modal_open;
|
||||
@@ -13,10 +12,7 @@
|
||||
dispatch("cancelDelete", { id: delete_station.id });
|
||||
}
|
||||
function deleteClient() {
|
||||
ScanStationService.donorControllerRemove(
|
||||
delete_station.id,
|
||||
true
|
||||
)
|
||||
StatsClientService.statsClientControllerRemove(delete_station.id, true)
|
||||
.then((resp) => {
|
||||
Toastify({
|
||||
text: $_('statsclient-deleted'),
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script>
|
||||
import { _ } from "svelte-i18n";
|
||||
|
||||
|
||||
import Toastify from "toastify-js";
|
||||
import { tick, createEventDispatcher } from "svelte";
|
||||
export let copy_modal_open;
|
||||
@@ -46,70 +46,87 @@
|
||||
{#if valueCopy != null}
|
||||
<textarea bind:this={areaDom}>{valueCopy}</textarea>
|
||||
{/if}
|
||||
<div class="fixed z-10 inset-0 overflow-y-auto" >
|
||||
<div class="fixed z-10 inset-0 overflow-y-auto">
|
||||
<div
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
|
||||
class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0"
|
||||
>
|
||||
<div class="fixed inset-0 transition-opacity" aria-hidden="true">
|
||||
<div
|
||||
class="absolute inset-0 bg-gray-500 opacity-75"
|
||||
data-id="modal_backdrop" />
|
||||
data-id="modal_backdrop"
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="hidden sm:inline-block sm:align-middle sm:h-screen"
|
||||
aria-hidden="true">​</span>
|
||||
aria-hidden="true">​</span
|
||||
>
|
||||
<div
|
||||
class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby="modal-headline">
|
||||
aria-labelledby="modal-headline"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-blue-600"
|
||||
fill="currentColor"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
viewBox="0 0 24 24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z" /></svg>
|
||||
d="M4 5v11h16V5H4zM2 4a1 1 0 011-1h18a1 1 0 011 1v14H2V4zM1 19h22v2H1v-2z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{$_('token')}
|
||||
{$_("token")}
|
||||
</h3>
|
||||
<div class="mt-2 mb-6">
|
||||
<p class="text-sm text-gray-500">
|
||||
{$_('the-statsclient-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again')}
|
||||
{$_(
|
||||
"the-statsclient-api-token-will-only-get-displayed-once-you-wont-be-able-to-change-or-view-it-again"
|
||||
)}
|
||||
<br />
|
||||
{$_('please-copy-the-token-and-store-it-somewhere-save')}
|
||||
{$_("please-copy-the-token-and-store-it-somewhere-save")}
|
||||
</p>
|
||||
</div>
|
||||
<div class="mt-2 mb-6">
|
||||
<label
|
||||
for="token"
|
||||
class="block text-sm font-medium text-gray-700">{$_('token')}</label>
|
||||
<div on:click={copy} class="inline-flex">
|
||||
class="block text-sm font-medium text-gray-700"
|
||||
>{$_("token")}</label
|
||||
>
|
||||
<button on:click={copy} class="inline-flex">
|
||||
<p
|
||||
name="token"
|
||||
class:bg-green-200={copied}
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2">
|
||||
class="mt-1 focus:ring-indigo-500 focus:border-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 p-2"
|
||||
>
|
||||
{new_client.key}
|
||||
</p>
|
||||
<div
|
||||
class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer">
|
||||
class="bg-gray-200 border-gray-300 border-t border-b border-r text-black rounded-r-md sm:text-sm p-2 mt-1 cursor-pointer"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
width="24"
|
||||
height="24"><path fill="none" d="M0 0h24v24H0z" />
|
||||
height="24"
|
||||
><path fill="none" d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z" /></svg>
|
||||
d="M7 4V2h10v2h3l1 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V5l1-1h3zm0 2H5v14h14V6h-2v2H7V6zm2-2v2h6V4H9z"
|
||||
/></svg
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
<p class="text-gray-500 text-xs">
|
||||
{$_('click-to-copy-token-to-clipboard')}
|
||||
{$_("click-to-copy-token-to-clipboard")}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -119,8 +136,9 @@
|
||||
<button
|
||||
on:click={close}
|
||||
type="button"
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-green-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm">
|
||||
{$_('yes-i-copied-the-token')}
|
||||
class="w-full inline-flex justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-blue-600 text-base font-medium text-white hover:bg-green-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:ml-3 sm:w-auto sm:text-sm"
|
||||
>
|
||||
{$_("yes-i-copied-the-token")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -33,15 +33,19 @@
|
||||
"all": "Alle",
|
||||
"all-associated-donations-will-get-deleted-as-well": "Alle Sponsorings dieser Sponsor:in werden ebenfalls gelöscht",
|
||||
"all-associated-runners-will-be-deleted-too": "Alle zugehörigen Läufer:innen werden auch gelöscht!",
|
||||
"all-associated-scans-will-get-deleted-as-well": "Alle Scans dieser Station werden ebenfalls gelöscht",
|
||||
"all-associated-teams-and-runners-will-be-deleted-too": "Alle assoziierten Teams und Läufer:innen werden auch gelöscht!",
|
||||
"already-paid": "Bereits bezahlt",
|
||||
"amount": "Anzahl",
|
||||
"amount-per-kilometer": "Betrag pro Kilometer",
|
||||
"apartment-suite-etc": "Apartment, Wohnung, etc.",
|
||||
"api-endpoint": "API-Endpunkt",
|
||||
"application_name": "Lauf für Kaya! - Admin",
|
||||
"applying-changes": "Änderungen anwenden",
|
||||
"attention": "Achtung!",
|
||||
"author": "Autor:in",
|
||||
"average-distance": "Durchschnittliche Strecke/Läufer:in",
|
||||
"average-donation": "Durchschnittliches Sponsoring",
|
||||
"bitte-bestaetige-diese-laeufer-fuer-den-import": "Bitte die Läufer:innen für den Import bestätigen.",
|
||||
"by": "von",
|
||||
"cancel": "Abbrechen",
|
||||
@@ -49,6 +53,7 @@
|
||||
"cancel-keep-donor": "Abbrechen, Sponsor:in behalten",
|
||||
"cancel-keep-my-profile": "Abbrechen, mein Profil behalten",
|
||||
"cancel-keep-organization": "Abbrechen und Organisation bearbeiten",
|
||||
"cancel-keep-station": "Abbrechen und Station behalten",
|
||||
"cancel-keep-statsclient": "Abbrechen und Statsclient behalten",
|
||||
"cancel-keep-team": "Abbrechen, Team behalten",
|
||||
"cannot-reset-your-password-directly": "Schade. \nWir können das Passwort leider nicht direkt zurücksetzen.\nBitte sende uns eine Mail in der du deine Identität bestätigst.",
|
||||
@@ -66,12 +71,14 @@
|
||||
"click-to-copy-token-to-clipboard": "Klicke auf den Token, um ihn in deine Zwischenablage zu kopieren",
|
||||
"close": "Schließen",
|
||||
"code": "Code",
|
||||
"config-codes": "Konfigurations-Codes",
|
||||
"configure-the-tracks-and-minimum-lap-times": "Bearbeite die Tracks und ihre minimale Rundenzeit",
|
||||
"confirm": "Bestätigen",
|
||||
"confirm-delete": "Löschung Bestätigen",
|
||||
"confirm-delete-donor-with-all-donations": "Bestätigen, Sponsor:in mit allen Sponsorings löschen",
|
||||
"confirm-delete-my-user-profile": "Bestätigung, mein Benutzerprofil löschen",
|
||||
"confirm-delete-organization-and-associated-teams-runners": "Bestätugung, lösche die Organisation und alle zugehörigen Teams und Läufer:innen.",
|
||||
"confirm-delete-station-with-all-scans": "Löschen der Scannerstation mit allen Scans bestätigen",
|
||||
"confirm-delete-statsclient": "Bestätigung, Statsclient löschen",
|
||||
"confirm-delete-team-and-associated-runners": "Bestätigung, lösche das Team mitsamt seinen Läufer:innen.",
|
||||
"confirm-deletion": "Löschung Bestätigen",
|
||||
@@ -176,6 +183,7 @@
|
||||
"donation-updated": "Sponsoring wurde aktualisiert",
|
||||
"donation_added": "Sponsoring hinzugefügt",
|
||||
"donations": "Sponsorings",
|
||||
"donations-are-being-loaded": "Sponsorings werden geladen...",
|
||||
"donor": "Sponsor:in",
|
||||
"donor-added": "Sponsor:in hinzugefügt",
|
||||
"donor-deleted": "Sponsor:in gelöscht",
|
||||
@@ -278,6 +286,7 @@
|
||||
"name": "Name",
|
||||
"name-is-required": "Der Gruppenname muss angegeben werden",
|
||||
"new-password": "Neues Passwort",
|
||||
"no-address": "Keine Adresse hinterlegt",
|
||||
"no-contact-found": "Keine Kontakte gefunden",
|
||||
"no-contact-selected": "Kein Kontakt ausgewählt",
|
||||
"no-contact-specified": "Kein Kontakt angegeben",
|
||||
@@ -319,6 +328,7 @@
|
||||
"permissions-updated": "Berechtigungen aktualisiert!",
|
||||
"phone": "Telefon",
|
||||
"please-confirm-the-deletion-of-card": "Bitte bestätige die Löschung der Karte",
|
||||
"please-confirm-the-deletion-of-donation": "Bitte bestätige die Löschung des Sponsorings",
|
||||
"please-confirm-the-deletion-of-runner": "Bitte bestätige die Löschung der Läufer:in",
|
||||
"please-confirm-the-deletion-of-scan": "Bitte bestätige die Löschung des Scans",
|
||||
"please-copy-the-token-and-store-it-somewhere-save": "Bitte kopiere dir den Token und bewahre ihn gut auf.",
|
||||
@@ -390,6 +400,7 @@
|
||||
"something-about-the-group": "Infos zur Gruppe",
|
||||
"sponsoring-quittungs-liste_herunterladen": "Sponsoring-Quittungs-Liste herunterladen",
|
||||
"sponsorings": "Sponsoringerklaerungen",
|
||||
"station-deleted": "Scannerstation gelöscht",
|
||||
"stats-are-being-loaded": "Die Statistiken werden geladen...",
|
||||
"statsclient-deleted": "Statsclient wurde gelöscht",
|
||||
"statsclient-is-being-added": "Statsclient wird angelegt...",
|
||||
@@ -424,10 +435,13 @@
|
||||
"this-card-is": "Diese Karte ist",
|
||||
"this-might-take-a-moment": "Das könnte einen kleinen Moment dauern",
|
||||
"this-scanstation-is": "Diese Station ist",
|
||||
"timestamp": "Timestamp",
|
||||
"token": "Token",
|
||||
"total-distance": "gelaufene Strecke",
|
||||
"total-donation-amount": "Gesamtbetrag",
|
||||
"total-donation-count": "Gesamte Sponsorings",
|
||||
"total-donations": "Spendensumme",
|
||||
"total-donors": "gesamte Sponsor:innen",
|
||||
"total-paid-amount": "Gezahlter Gesamtbetrag",
|
||||
"total-scans": "gesamte Scans",
|
||||
"total_donation_amount_in_eur": "Gesamtbetrag in €",
|
||||
|
||||
@@ -33,15 +33,19 @@
|
||||
"all": "all",
|
||||
"all-associated-donations-will-get-deleted-as-well": "All associated donations will get deleted as well",
|
||||
"all-associated-runners-will-be-deleted-too": "All associated runners will be deleted too!",
|
||||
"all-associated-scans-will-get-deleted-as-well": "All associated scans will get deleted as well",
|
||||
"all-associated-teams-and-runners-will-be-deleted-too": "All associated teams and runners will be deleted too!",
|
||||
"already-paid": "Already paid",
|
||||
"amount": "Amount",
|
||||
"amount-per-kilometer": "Amount per kilometer",
|
||||
"apartment-suite-etc": "Apartment, suite, etc.",
|
||||
"api-endpoint": "API-Endpoint",
|
||||
"application_name": "Lauf für Kaya! - Admin",
|
||||
"applying-changes": "Applying Changes",
|
||||
"attention": "Attention!",
|
||||
"author": "Author",
|
||||
"average-distance": "average distance",
|
||||
"average-donation": "average donation",
|
||||
"bitte-bestaetige-diese-laeufer-fuer-den-import": "Please confirm these runners for import.",
|
||||
"by": "by",
|
||||
"cancel": "Cancel",
|
||||
@@ -49,6 +53,7 @@
|
||||
"cancel-keep-donor": "Cancel, keep donor",
|
||||
"cancel-keep-my-profile": "Cancel, keep my profile",
|
||||
"cancel-keep-organization": "Cancel, keep organization",
|
||||
"cancel-keep-station": "Cancel, keep station",
|
||||
"cancel-keep-statsclient": "Cancel and keep statsclient",
|
||||
"cancel-keep-team": "Cancel, keep team",
|
||||
"cannot-reset-your-password-directly": "Bummer. We unfortunately cannot reset your password directly. Please send us a mail and confirm your identity",
|
||||
@@ -66,12 +71,14 @@
|
||||
"click-to-copy-token-to-clipboard": "Click to copy the token to your clipboard",
|
||||
"close": "Close",
|
||||
"code": "Code",
|
||||
"config-codes": "Config codes",
|
||||
"configure-the-tracks-and-minimum-lap-times": "configure the tracks & minimum lap times",
|
||||
"confirm": "Confirm",
|
||||
"confirm-delete": "Confirm Delete",
|
||||
"confirm-delete-donor-with-all-donations": "Confirm, delete donor with all donations",
|
||||
"confirm-delete-my-user-profile": "Confirm, delete my user profile",
|
||||
"confirm-delete-organization-and-associated-teams-runners": "Confirm, delete organization and associated teams+runners.",
|
||||
"confirm-delete-station-with-all-scans": "Confirm deletion of station with all scans",
|
||||
"confirm-delete-statsclient": "Confirm, delete statsclient",
|
||||
"confirm-delete-team-and-associated-runners": "Confirm, delete team and associated runners.",
|
||||
"confirm-deletion": "Confirm Deletion",
|
||||
@@ -176,6 +183,7 @@
|
||||
"donation-updated": "Donation updated",
|
||||
"donation_added": "Donation_added",
|
||||
"donations": "Donations",
|
||||
"donations-are-being-loaded": "donations are being loaded",
|
||||
"donor": "Donor",
|
||||
"donor-added": "Donor added",
|
||||
"donor-deleted": "donor deleted",
|
||||
@@ -278,6 +286,7 @@
|
||||
"name": "Name",
|
||||
"name-is-required": "Name is required",
|
||||
"new-password": "New password",
|
||||
"no-address": "no address",
|
||||
"no-contact-found": "No contacts found",
|
||||
"no-contact-selected": "No contact selected",
|
||||
"no-contact-specified": "no contact specified",
|
||||
@@ -319,6 +328,7 @@
|
||||
"permissions-updated": "Permissions updated!",
|
||||
"phone": "Phone",
|
||||
"please-confirm-the-deletion-of-card": "Please confirm the deletion of this card",
|
||||
"please-confirm-the-deletion-of-donation": "Please confirm the deletion of this donation",
|
||||
"please-confirm-the-deletion-of-runner": "Please confirm the deletion of this runner",
|
||||
"please-confirm-the-deletion-of-scan": "Please confirm the deletion of scan",
|
||||
"please-copy-the-token-and-store-it-somewhere-save": "Please copy the token and store it somewhere safe.",
|
||||
@@ -390,6 +400,7 @@
|
||||
"something-about-the-group": "Something about the group...",
|
||||
"sponsoring-quittungs-liste_herunterladen": "Download donor receipt list",
|
||||
"sponsorings": "Sponsorings",
|
||||
"station-deleted": "station deleted",
|
||||
"stats-are-being-loaded": "stats are being loaded...",
|
||||
"statsclient-deleted": "Deleted statsclient",
|
||||
"statsclient-is-being-added": "Statsclient is being added...",
|
||||
@@ -424,10 +435,13 @@
|
||||
"this-card-is": "This card is",
|
||||
"this-might-take-a-moment": "This might take a moment 👀",
|
||||
"this-scanstation-is": "This scanstation is",
|
||||
"timestamp": "timestamp",
|
||||
"token": "Token",
|
||||
"total-distance": "total distance",
|
||||
"total-donation-amount": "total donation amount",
|
||||
"total-donation-count": "total donations (count)",
|
||||
"total-donations": "total donations",
|
||||
"total-donors": "total donors",
|
||||
"total-paid-amount": "Total paid amount",
|
||||
"total-scans": "total scans",
|
||||
"total_donation_amount_in_eur": "Total donation amount in €",
|
||||
|
||||
Reference in New Issue
Block a user