Compare commits
	
		
			32 Commits
		
	
	
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| c63adf557b | |||
| 077b33f031 | |||
| 52a6b3dc77 | |||
| 8b5e1cac13 | |||
| 20c6a420e9 | |||
| 53800b4fa3 | |||
| debbd9219c | |||
| 9b261bf200 | |||
| 713dd15312 | |||
| 64382880c4 | |||
| 9e06c46411 | |||
| 8cfddb5029 | |||
| e5a01bcd76 | |||
| 851190e6a7 | |||
| 1603a097f7 | |||
| c2b615294e | |||
| c64762831f | |||
| 9b446abc1f | |||
| 5d974e562e | |||
| a030f6b738 | |||
| 1249248a9d | |||
| 0bd6d543bf | |||
| 92d7bfd594 | |||
| 917cb6be34 | |||
| d159cb59be | |||
| 9812d79d4d | |||
| 4663214ede | |||
| 9c9ceaa666 | |||
| 602d80bd14 | |||
| 45ee4ab812 | |||
| 020c310865 | |||
| 1102d29c0e | 
							
								
								
									
										17
									
								
								.drone.yml
									
									
									
									
									
								
							
							
						
						
									
										17
									
								
								.drone.yml
									
									
									
									
									
								
							| @@ -25,23 +25,6 @@ type: kubernetes | |||||||
| name: build:dev | name: build:dev | ||||||
|  |  | ||||||
| steps: | steps: | ||||||
|   # - name: run full license export |  | ||||||
|   #   depends_on: ["clone"] |  | ||||||
|   #   image: node:alpine |  | ||||||
|   #   commands: |  | ||||||
|   #     - yarn |  | ||||||
|   #     - yarn licenses:export |  | ||||||
|   # - name: push new licenses file to repo |  | ||||||
|   #   depends_on: ["run full license export"] |  | ||||||
|   #   image: appleboy/drone-git-push |  | ||||||
|   #   settings: |  | ||||||
|   #     branch: dev |  | ||||||
|   #     commit: true |  | ||||||
|   #     commit_message: new license file version [CI SKIP] |  | ||||||
|   #     author_email: bot@odit.services |  | ||||||
|   #     remote: git@git.odit.services:lfk/selfservice.git |  | ||||||
|   #     ssh_key: |  | ||||||
|   #       from_secret: git_ssh |  | ||||||
|   - name: build dev |   - name: build dev | ||||||
|     image: plugins/docker |     image: plugins/docker | ||||||
|     depends_on: [clone] |     depends_on: [clone] | ||||||
|   | |||||||
							
								
								
									
										76
									
								
								CHANGELOG.md
									
									
									
									
									
								
							
							
						
						
									
										76
									
								
								CHANGELOG.md
									
									
									
									
									
								
							| @@ -2,8 +2,84 @@ | |||||||
|  |  | ||||||
| All notable changes to this project will be documented in this file. Dates are displayed in UTC. | All notable changes to this project will be documented in this file. Dates are displayed in UTC. | ||||||
|  |  | ||||||
|  | #### [0.7.11](https://git.odit.services/lfk/selfservice/compare/0.7.10...0.7.11) | ||||||
|  |  | ||||||
|  | - Profile: improved mobile responsiveness/ design + toast clear [`077b33f`](https://git.odit.services/lfk/selfservice/commit/077b33f03180d0bd6c45becaaa63d3408c645deb) | ||||||
|  | - fix: registration code download button style [`52a6b3d`](https://git.odit.services/lfk/selfservice/commit/52a6b3dc776b806eaa8fee058a1c381ab63a8ea5) | ||||||
|  |  | ||||||
|  | #### [0.7.10](https://git.odit.services/lfk/selfservice/compare/0.7.9...0.7.10) | ||||||
|  |  | ||||||
|  | > 1 February 2023 | ||||||
|  |  | ||||||
|  | - Configureable barcode format via bwp-js [`9e06c46`](https://git.odit.services/lfk/selfservice/commit/9e06c464118c5b5d0cd78c8b8379523bf3bfdbd4) | ||||||
|  | - Added download for registration code [`53800b4`](https://git.odit.services/lfk/selfservice/commit/53800b4fa355bb972e51e71b5b1f98772deed114) | ||||||
|  | - 🚀Bumped version to v0.7.10 [`8b5e1ca`](https://git.odit.services/lfk/selfservice/commit/8b5e1cac1353373b13cf9d570deb7cadcd437247) | ||||||
|  | - Pinned version [`6438288`](https://git.odit.services/lfk/selfservice/commit/64382880c40ba5c1e3c9004ce7fc65099849cd44) | ||||||
|  |  | ||||||
|  | #### [0.7.9](https://git.odit.services/lfk/selfservice/compare/0.7.8...0.7.9) | ||||||
|  |  | ||||||
|  | > 1 February 2023 | ||||||
|  |  | ||||||
|  | - migrate to bwip-js [`8cfddb5`](https://git.odit.services/lfk/selfservice/commit/8cfddb502964be7edf45cdc524344ea2f7f20142) | ||||||
|  | - fix codeconfig.height [`9b261bf`](https://git.odit.services/lfk/selfservice/commit/9b261bf20023561a7c9691dff33c9a6d2b5c0cac) | ||||||
|  | - 🚀Bumped version to v0.7.9 [`debbd92`](https://git.odit.services/lfk/selfservice/commit/debbd9219cb53dbd48cf0cb7bee329b765ce4647) | ||||||
|  | - drop jsbarcode [`713dd15`](https://git.odit.services/lfk/selfservice/commit/713dd153126851e8cf1045bf5ba3ca702a39c738) | ||||||
|  |  | ||||||
|  | #### [0.7.8](https://git.odit.services/lfk/selfservice/compare/0.7.7...0.7.8) | ||||||
|  |  | ||||||
|  | > 1 February 2023 | ||||||
|  |  | ||||||
|  | - add barcode to profile [`851190e`](https://git.odit.services/lfk/selfservice/commit/851190e6a7f8b9cccbf05e60f9b50b96c196959c) | ||||||
|  | - 🚀Bumped version to v0.7.8 [`e5a01bc`](https://git.odit.services/lfk/selfservice/commit/e5a01bcd7629164655cacd10dd1f014260c67c4b) | ||||||
|  | - certificate generation: success toast styling [`1603a09`](https://git.odit.services/lfk/selfservice/commit/1603a097f71ed85c901baf8da04cb06b86474649) | ||||||
|  |  | ||||||
|  | #### [0.7.7](https://git.odit.services/lfk/selfservice/compare/0.7.6...0.7.7) | ||||||
|  |  | ||||||
|  | > 31 January 2023 | ||||||
|  |  | ||||||
|  | - 🚀Bumped version to v0.7.7 [`c2b6152`](https://git.odit.services/lfk/selfservice/commit/c2b615294e605db37695b13cec1158f535986911) | ||||||
|  | - fix: registration w/o phone [`c647628`](https://git.odit.services/lfk/selfservice/commit/c64762831f1e6dffc9cbc3f531e23435b455a5a9) | ||||||
|  |  | ||||||
|  | #### [0.7.6](https://git.odit.services/lfk/selfservice/compare/0.7.5...0.7.6) | ||||||
|  |  | ||||||
|  | > 31 January 2023 | ||||||
|  |  | ||||||
|  | - update texts of pdf generation status toasts [`#44`](https://git.odit.services/lfk/selfservice/issues/44) | ||||||
|  | - 🚀Bumped version to v0.7.6 [`9b446ab`](https://git.odit.services/lfk/selfservice/commit/9b446abc1fa231bb1f5a78c545400c617eaa4af5) | ||||||
|  | - update release script [`5d974e5`](https://git.odit.services/lfk/selfservice/commit/5d974e562ed1ed5aeac579afe000c2dca945ff71) | ||||||
|  |  | ||||||
|  | #### [0.7.5](https://git.odit.services/lfk/selfservice/compare/0.7.4...0.7.5) | ||||||
|  |  | ||||||
|  | > 30 January 2023 | ||||||
|  |  | ||||||
|  | - fix: relativ links [`917cb6b`](https://git.odit.services/lfk/selfservice/commit/917cb6be340844bcc2318bf73cec37c3c831fd5d) | ||||||
|  | - 🚀Bumped version to v0.7.5 [`1249248`](https://git.odit.services/lfk/selfservice/commit/1249248a9d3e0d72665bca6871a651f2491a4039) | ||||||
|  | - 2023 [`9812d79`](https://git.odit.services/lfk/selfservice/commit/9812d79d4de820ce791f69634c5861f4f04ad7f1) | ||||||
|  | - update nginx base [`0bd6d54`](https://git.odit.services/lfk/selfservice/commit/0bd6d543bf60b7a333b96d5d319269d4bf50db96) | ||||||
|  | - updated base node image [`92d7bfd`](https://git.odit.services/lfk/selfservice/commit/92d7bfd59407273f86809b53ffc9f67fb8ba0ec7) | ||||||
|  | - AGB link [`d159cb5`](https://git.odit.services/lfk/selfservice/commit/d159cb59be35f963abc89c42732ba6110d27830c) | ||||||
|  |  | ||||||
|  | #### [0.7.4](https://git.odit.services/lfk/selfservice/compare/0.7.3...0.7.4) | ||||||
|  |  | ||||||
|  | > 21 April 2021 | ||||||
|  |  | ||||||
|  | - Updated dronefile [`9c9ceaa`](https://git.odit.services/lfk/selfservice/commit/9c9ceaa6664f6ea21a536a12f04e552156e81da4) | ||||||
|  | - 🚀Bumped version to v0.7.4 [`4663214`](https://git.odit.services/lfk/selfservice/commit/4663214ede3880386b5389885e32c953571290e6) | ||||||
|  |  | ||||||
|  | #### [0.7.3](https://git.odit.services/lfk/selfservice/compare/0.7.2...0.7.3) | ||||||
|  |  | ||||||
|  | > 21 April 2021 | ||||||
|  |  | ||||||
|  | - 🚀Bumped version to v0.7.3 [`602d80b`](https://git.odit.services/lfk/selfservice/commit/602d80bd14c4bd00a24b746be1e74d9e41af0445) | ||||||
|  | - Merge pull request 'Button fixes bugfix/42-button_links' (#43) from bugfix/42-button_links into dev [`45ee4ab`](https://git.odit.services/lfk/selfservice/commit/45ee4ab81260adf5b938d9f5359d256cce879acb) | ||||||
|  | - Removed useless register now button [`1102d29`](https://git.odit.services/lfk/selfservice/commit/1102d29c0e174b7a34fc4d3e6fe32d2dfb276765) | ||||||
|  | - Fixed register button link [`020c310`](https://git.odit.services/lfk/selfservice/commit/020c310865912b8f0752069e1c7e2adf71ab9835) | ||||||
|  |  | ||||||
| #### [0.7.2](https://git.odit.services/lfk/selfservice/compare/0.7.1...0.7.2) | #### [0.7.2](https://git.odit.services/lfk/selfservice/compare/0.7.1...0.7.2) | ||||||
|  |  | ||||||
|  | > 14 April 2021 | ||||||
|  |  | ||||||
|  | - 🚀Bumped version to v0.7.2 [`1a3af20`](https://git.odit.services/lfk/selfservice/commit/1a3af200dd41c8cc4271690ed72bef911901ce54) | ||||||
| - Document generation hotfix 🐞 [`b74bea0`](https://git.odit.services/lfk/selfservice/commit/b74bea03401c672ae774aaddc6da5beb67e2890e) | - Document generation hotfix 🐞 [`b74bea0`](https://git.odit.services/lfk/selfservice/commit/b74bea03401c672ae774aaddc6da5beb67e2890e) | ||||||
|  |  | ||||||
| #### [0.7.1](https://git.odit.services/lfk/selfservice/compare/0.7.0...0.7.1) | #### [0.7.1](https://git.odit.services/lfk/selfservice/compare/0.7.0...0.7.1) | ||||||
|   | |||||||
| @@ -1,10 +1,10 @@ | |||||||
| FROM node:15.9.0-alpine3.13 | FROM registry.odit.services/hub/library/node:15.9.0-alpine3.13 | ||||||
| WORKDIR /app | WORKDIR /app | ||||||
| COPY . . | COPY . . | ||||||
| RUN yarn | RUN yarn | ||||||
| RUN yarn build | RUN yarn build | ||||||
| RUN yarn postbuild | RUN yarn postbuild | ||||||
| # final image | # final image | ||||||
| FROM fholzer/nginx-brotli:v1.19.1 | FROM registry.odit.services/library/nginx-brotli:3.15 | ||||||
| COPY --from=0 /app/dist /usr/share/nginx/html | COPY --from=0 /app/dist /usr/share/nginx/html | ||||||
| COPY ./nginx.conf /etc/nginx/nginx.conf | COPY ./nginx.conf /etc/nginx/nginx.conf | ||||||
							
								
								
									
										103
									
								
								package.json
									
									
									
									
									
								
							
							
						
						
									
										103
									
								
								package.json
									
									
									
									
									
								
							| @@ -1,51 +1,52 @@ | |||||||
| { | { | ||||||
| 	"name": "@odit/lfk-selfservice", | 	"name": "@odit/lfk-selfservice", | ||||||
| 	"version": "0.7.2", | 	"version": "0.7.11", | ||||||
| 	"scripts": { | 	"scripts": { | ||||||
| 		"dev": "vite", | 		"dev": "vite", | ||||||
| 		"build": "vite build", | 		"build": "vite build", | ||||||
| 		"release": "release-it --only-version", | 		"release": "release-it", | ||||||
| 		"postbuild": "node env_fix.js" | 		"postbuild": "node env_fix.js" | ||||||
| 	}, | 	}, | ||||||
| 	"dependencies": { | 	"dependencies": { | ||||||
| 		"marked": "2.0.3", | 		"bwip-js": "3.2.2", | ||||||
| 		"redaxios": "0.4.1", | 		"marked": "2.0.3", | ||||||
| 		"toastify-js": "1.10.0", | 		"redaxios": "0.4.1", | ||||||
| 		"validator": "13.5.2", | 		"toastify-js": "1.10.0", | ||||||
| 		"vue-i18n": "9.1.4", | 		"validator": "13.5.2", | ||||||
| 		"vue-toastification": "2.0.0-rc.1", | 		"vue-i18n": "9.1.4", | ||||||
| 		"vue": "3.0.9", | 		"vue-toastification": "2.0.0-rc.1", | ||||||
| 		"vue-router": "4.0.5" | 		"vue": "3.0.9", | ||||||
| 	}, | 		"vue-router": "4.0.5" | ||||||
| 	"devDependencies": { | 	}, | ||||||
| 		"@tailwindcss/jit": "0.1.18", | 	"devDependencies": { | ||||||
| 		"@tailwindcss/aspect-ratio": "0.2.0", | 		"@tailwindcss/jit": "0.1.18", | ||||||
| 		"@tailwindcss/forms": "0.3.2", | 		"@tailwindcss/aspect-ratio": "0.2.0", | ||||||
| 		"@tailwindcss/line-clamp": "0.2.0", | 		"@tailwindcss/forms": "0.3.2", | ||||||
| 		"@tailwindcss/typography": "0.4.0", | 		"@tailwindcss/line-clamp": "0.2.0", | ||||||
| 		"@vitejs/plugin-vue": "1.2.1", | 		"@tailwindcss/typography": "0.4.0", | ||||||
| 		"@vue/compiler-sfc": "3.0.11", | 		"@vitejs/plugin-vue": "1.2.1", | ||||||
| 		"autoprefixer": "10.2.5", | 		"@vue/compiler-sfc": "3.0.11", | ||||||
| 		"tailwindcss": "2.1.1", | 		"autoprefixer": "10.2.5", | ||||||
| 		"release-it": "14.6.1", | 		"tailwindcss": "2.1.1", | ||||||
| 		"vite": "2.1.5" | 		"release-it": "14.6.1", | ||||||
| 	}, | 		"vite": "2.1.5" | ||||||
| 	"release-it": { | 	}, | ||||||
| 		"git": { | 	"release-it": { | ||||||
| 			"commit": true, | 		"git": { | ||||||
| 			"requireCleanWorkingDir": false, | 			"commit": true, | ||||||
| 			"commitMessage": "🚀Bumped version to v${version}", | 			"requireCleanWorkingDir": false, | ||||||
| 			"requireBranch": "dev", | 			"commitMessage": "🚀Bumped version to v${version}", | ||||||
| 			"push": false, | 			"requireBranch": "dev", | ||||||
| 			"tag": true, | 			"push": true, | ||||||
| 			"tagName": null, | 			"tag": true, | ||||||
| 			"tagAnnotation": "v${version}" | 			"tagName": null, | ||||||
| 		}, | 			"tagAnnotation": "v${version}" | ||||||
| 		"npm": { | 		}, | ||||||
| 			"publish": false | 		"npm": { | ||||||
| 		}, | 			"publish": false | ||||||
| 		"hooks": { | 		}, | ||||||
| 			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node order_i18n.js  && git add src/locales" | 		"hooks": { | ||||||
| 		} | 			"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node order_i18n.js  && git add src/locales" | ||||||
| 	} | 		} | ||||||
| } | 	} | ||||||
|  | } | ||||||
|   | |||||||
							
								
								
									
										3129
									
								
								pnpm-lock.yaml
									
									
									
										generated
									
									
									
										Normal file
									
								
							
							
						
						
									
										3129
									
								
								pnpm-lock.yaml
									
									
									
										generated
									
									
									
										Normal file
									
								
							
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							| @@ -7,8 +7,11 @@ const config = { | |||||||
| 	baseurl_selfservice: '/selfservice/', | 	baseurl_selfservice: '/selfservice/', | ||||||
| 	// full url (including fqdn) | 	// full url (including fqdn) | ||||||
| 	baseurl_documentserver: 'http://localhost:4010/documents', | 	baseurl_documentserver: 'http://localhost:4010/documents', | ||||||
|  | 	// optional, will fallback to code128 | ||||||
|  | 	code_format: 'ean13', | ||||||
| 	// optional, will fallback to baseurl_selfservice/imprint | 	// optional, will fallback to baseurl_selfservice/imprint | ||||||
| 	url_imprint: '', | 	url_imprint: '', | ||||||
| 	// optional, will fallback to baseurl_selfservice/privacy | 	// optional, will fallback to baseurl_selfservice/privacy | ||||||
| 	url_privacy: '' | 	url_privacy: '', | ||||||
|  | 	codeformat: 'code39' | ||||||
| }; | }; | ||||||
|   | |||||||
| @@ -2,7 +2,7 @@ | |||||||
|   <footer class="text-gray-400 bg-gray-900 body-font"> |   <footer class="text-gray-400 bg-gray-900 body-font"> | ||||||
|     <div class="container px-5 py-8 mx-auto flex items-center sm:flex-row flex-col"> |     <div class="container px-5 py-8 mx-auto flex items-center sm:flex-row flex-col"> | ||||||
|       <p class="text-sm text-gray-400 sm:ml-4 sm:pl-4 sm:py-2 sm:mt-0 mt-4"> |       <p class="text-sm text-gray-400 sm:ml-4 sm:pl-4 sm:py-2 sm:mt-0 mt-4"> | ||||||
|         Lauf für Kaya! Selfservice - Copyright © 2021 + proudly powered by |         Lauf für Kaya! Selfservice - Copyright © 2023 + proudly powered by | ||||||
|         <a |         <a | ||||||
|           class="underline" |           class="underline" | ||||||
|           target="_blank" |           target="_blank" | ||||||
|   | |||||||
| @@ -29,7 +29,7 @@ | |||||||
|               placeholder="Passwort" |               placeholder="Passwort" | ||||||
|             /> |             /> | ||||||
|             <div class="absolute inset-y-0 right-0 pr-3 flex items-center text-sm"> |             <div class="absolute inset-y-0 right-0 pr-3 flex items-center text-sm"> | ||||||
|               <a href="./reset" class="text-gray-900 underline">Passwort vergessen?</a> |               <a href="/selfservice/reset" class="text-gray-900 underline">Passwort vergessen?</a> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
| @@ -80,7 +80,7 @@ | |||||||
|         </div> |         </div> | ||||||
|         <div class="mt-6"> |         <div class="mt-6"> | ||||||
|           <a |           <a | ||||||
|             href="./register" |             href="/selfservice/register" | ||||||
|             class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" |             class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" | ||||||
|           >Account erstellen</a> |           >Account erstellen</a> | ||||||
|         </div> |         </div> | ||||||
| @@ -101,7 +101,7 @@ function login() { | |||||||
|   axios.get("").then((res) => { |   axios.get("").then((res) => { | ||||||
|     loading.value = false; |     loading.value = false; | ||||||
|     Toastify({ |     Toastify({ | ||||||
|       text: "This is a toast", |       text: "Login läuft...", | ||||||
|       duration: 3000, |       duration: 3000, | ||||||
|     }).showToast(); |     }).showToast(); | ||||||
|   }); |   }); | ||||||
|   | |||||||
| @@ -29,7 +29,7 @@ | |||||||
|               placeholder="Passwort" |               placeholder="Passwort" | ||||||
|             /> |             /> | ||||||
|             <div class="absolute inset-y-0 right-0 pr-3 flex items-center text-sm"> |             <div class="absolute inset-y-0 right-0 pr-3 flex items-center text-sm"> | ||||||
|               <a href="./reset" class="text-gray-900 underline">Passwort vergessen?</a> |               <a href="/selfservice/reset" class="text-gray-900 underline">Passwort vergessen?</a> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
| @@ -80,7 +80,7 @@ | |||||||
|         </div> |         </div> | ||||||
|         <div class="mt-6"> |         <div class="mt-6"> | ||||||
|           <a |           <a | ||||||
|             href="./register" |             href="/selfservice/register" | ||||||
|             class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" |             class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" | ||||||
|           >Account erstellen</a> |           >Account erstellen</a> | ||||||
|         </div> |         </div> | ||||||
| @@ -101,7 +101,7 @@ function login() { | |||||||
|   axios.get("").then((res) => { |   axios.get("").then((res) => { | ||||||
|     loading.value = false; |     loading.value = false; | ||||||
|     Toastify({ |     Toastify({ | ||||||
|       text: "This is a toast", |       text: "Login läuft...", | ||||||
|       duration: 3000, |       duration: 3000, | ||||||
|     }).showToast(); |     }).showToast(); | ||||||
|   }); |   }); | ||||||
|   | |||||||
| @@ -13,6 +13,7 @@ | |||||||
|     "deletion_in_progress": "Daten werden gelöscht...", |     "deletion_in_progress": "Daten werden gelöscht...", | ||||||
|     "distance": "Distanz", |     "distance": "Distanz", | ||||||
|     "download_certificate": "Urkunde herunterladen", |     "download_certificate": "Urkunde herunterladen", | ||||||
|  |     "download_registrationcode": "Registrierungscode herunterladen", | ||||||
|     "e_mail_adress": "E-Mail Adresse", |     "e_mail_adress": "E-Mail Adresse", | ||||||
|     "go_to_login": "Zum Login", |     "go_to_login": "Zum Login", | ||||||
|     "i_accept": "Ich habe die ", |     "i_accept": "Ich habe die ", | ||||||
| @@ -38,11 +39,12 @@ | |||||||
|     "profile": "Profil", |     "profile": "Profil", | ||||||
|     "provide_address": "Adresse angeben?", |     "provide_address": "Adresse angeben?", | ||||||
|     "register": { |     "register": { | ||||||
|         "register_now": "Jetzt für den Lauf für Kaya! 2021 registrieren." |         "register_now": "Jetzt für den Lauf für Kaya! 2023 registrieren." | ||||||
|     }, |     }, | ||||||
|     "register_now": "Jetzt registrieren!", |     "register_now": "Jetzt registrieren!", | ||||||
|     "register_now_small": "Jetzt registrieren", |     "register_now_small": "Jetzt registrieren", | ||||||
|     "registrieren": "Registrieren", |     "registrieren": "Registrieren", | ||||||
|  |     "registrierungscode": "Registrierungscode", | ||||||
|     "resend_the_registration_mail": "Registrierungsmail erneut versenden", |     "resend_the_registration_mail": "Registrierungsmail erneut versenden", | ||||||
|     "save_changes": "Änderungen speichern", |     "save_changes": "Änderungen speichern", | ||||||
|     "sponsoring": "Sponsoring", |     "sponsoring": "Sponsoring", | ||||||
|   | |||||||
| @@ -13,6 +13,7 @@ | |||||||
|     "deletion_in_progress": "Deletion in progress...", |     "deletion_in_progress": "Deletion in progress...", | ||||||
|     "distance": "Distance", |     "distance": "Distance", | ||||||
|     "download_certificate": "Download certificate", |     "download_certificate": "Download certificate", | ||||||
|  |     "download_registrationcode": "Download registrationcode", | ||||||
|     "e_mail_adress": "mail address", |     "e_mail_adress": "mail address", | ||||||
|     "go_to_login": "Go To Login", |     "go_to_login": "Go To Login", | ||||||
|     "i_accept": "I have read and accepted the ", |     "i_accept": "I have read and accepted the ", | ||||||
| @@ -38,7 +39,7 @@ | |||||||
|     "profile": "Profile", |     "profile": "Profile", | ||||||
|     "provide_address": "Provide a postal address?", |     "provide_address": "Provide a postal address?", | ||||||
|     "register": { |     "register": { | ||||||
|         "register_now": "Register now for Lauf für Kaya! 2021." |         "register_now": "Register now for Lauf für Kaya! 2023." | ||||||
|     }, |     }, | ||||||
|     "register_now": "Register now!", |     "register_now": "Register now!", | ||||||
|     "register_now_small": "Register now", |     "register_now_small": "Register now", | ||||||
|   | |||||||
| @@ -11,10 +11,10 @@ | |||||||
|         <div class="mt-6 sm:flex place-content-center"> |         <div class="mt-6 sm:flex place-content-center"> | ||||||
|           <a |           <a | ||||||
|             class="w-full sm:w-auto inline-flex px-6 py-3 border border-transparent text-base font-semibold rounded-md text-gray-900 bg-white shadow-sm hover:text-gray-600 focus:outline-none focus:text-gray-600 transition ease-in-out duration-150 xl:text-lg xl:py-4" |             class="w-full sm:w-auto inline-flex px-6 py-3 border border-transparent text-base font-semibold rounded-md text-gray-900 bg-white shadow-sm hover:text-gray-600 focus:outline-none focus:text-gray-600 transition ease-in-out duration-150 xl:text-lg xl:py-4" | ||||||
|             href="./register/" |             href="/selfservice/register/" | ||||||
|           >{{ $t('register_now') }}</a> |           >{{ $t('register_now') }}</a> | ||||||
|           <a |           <a | ||||||
|             href="./profile/" |             href="/selfservice/profile/" | ||||||
|             class="mt-4 sm:ml-4 sm:mt-0 w-full sm:w-auto inline-flex px-6 py-3 border border-transparent text-base font-semibold rounded-md text-white bg-gray-800 shadow-sm hover:bg-gray-700 focus:outline-none focus:bg-gray-700 transition ease-in-out duration-150 xl:text-lg xl:py-4" |             class="mt-4 sm:ml-4 sm:mt-0 w-full sm:w-auto inline-flex px-6 py-3 border border-transparent text-base font-semibold rounded-md text-white bg-gray-800 shadow-sm hover:bg-gray-700 focus:outline-none focus:bg-gray-700 transition ease-in-out duration-150 xl:text-lg xl:py-4" | ||||||
|           >{{ $t('view_my_data') }}</a> |           >{{ $t('view_my_data') }}</a> | ||||||
|         </div> |         </div> | ||||||
|   | |||||||
| @@ -3,19 +3,82 @@ | |||||||
|     <section class="text-white body-font"> |     <section class="text-white body-font"> | ||||||
|       <div class="container mx-auto flex items-center md:flex-row flex-col"> |       <div class="container mx-auto flex items-center md:flex-row flex-col"> | ||||||
|         <div |         <div | ||||||
|           class="flex flex-col md:pr-10 md:mb-0 mb-6 pr-0 w-full md:w-auto md:text-left text-center text-black dark:text-gray-200" |           class=" | ||||||
|  |             flex flex-col | ||||||
|  |             md:pr-10 md:mb-0 | ||||||
|  |             mb-6 | ||||||
|  |             pr-0 | ||||||
|  |             w-full | ||||||
|  |             md:w-auto md:text-left | ||||||
|  |             text-center text-black | ||||||
|  |             dark:text-gray-200 | ||||||
|  |           " | ||||||
|         > |         > | ||||||
|           <p |           <p | ||||||
|             class="text-3xl font-bold whitespace-nowrap" |             class="text-3xl font-bold whitespace-nowrap" | ||||||
|             v-text="(state.firstname || '') + ' ' + (state.middlename || '') + ' ' + (state.lastname || '')" |             v-text=" | ||||||
|  |               (state.firstname || '') + | ||||||
|  |               ' ' + | ||||||
|  |               (state.middlename || '') + | ||||||
|  |               ' ' + | ||||||
|  |               (state.lastname || '') | ||||||
|  |             " | ||||||
|           ></p> |           ></p> | ||||||
|           <p class="text-md whitespace-nowrap">{{ state.group }}</p> |           <p class="text-md whitespace-nowrap">{{ state.group }}</p> | ||||||
|         </div> |         </div> | ||||||
|         <div class="inline-flex md:ml-auto md:mr-0 mx-auto items-center"> |         <div class="inline-flex md:ml-auto md:mr-0 mx-auto items-center"> | ||||||
|           <div v-if="(state.delete_active === false)"> |           <div v-if="state.delete_active === false"> | ||||||
|             <button |             <button | ||||||
|               type="button" |               type="button" | ||||||
|               class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-blue-500 hover:bg-blue-600 hover:shadow-lg" |               class=" | ||||||
|  |                 focus:border-black focus:ring-2 focus:ring-black | ||||||
|  |                 text-white text-sm | ||||||
|  |                 py-2.5 | ||||||
|  |                 px-5 | ||||||
|  |                 rounded-md | ||||||
|  |                 bg-blue-500 | ||||||
|  |                 hover:bg-blue-600 hover:shadow-lg | ||||||
|  |                 w-full | ||||||
|  |                 md:w-auto | ||||||
|  |                 mb-1 | ||||||
|  |                 md:mr-1 | ||||||
|  |               " | ||||||
|  |               @click="get_registration" | ||||||
|  |             > | ||||||
|  |               <svg | ||||||
|  |                 xmlns="http://www.w3.org/2000/svg" | ||||||
|  |                 width="24" | ||||||
|  |                 height="24" | ||||||
|  |                 viewBox="0 0 24 24" | ||||||
|  |                 fill="none" | ||||||
|  |                 stroke="currentColor" | ||||||
|  |                 stroke-width="2" | ||||||
|  |                 stroke-linecap="round" | ||||||
|  |                 stroke-linejoin="round" | ||||||
|  |                 class="feather feather-download" | ||||||
|  |                 style="display: inline; height: 1rem; vertical-align: sub" | ||||||
|  |               > | ||||||
|  |                 <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" /> | ||||||
|  |                 <polyline points="7 10 12 15 17 10" /> | ||||||
|  |                 <line x1="12" y1="15" x2="12" y2="3" /> | ||||||
|  |               </svg> | ||||||
|  |               {{ $t("download_registrationcode") }} | ||||||
|  |             </button> | ||||||
|  |             <button | ||||||
|  |               type="button" | ||||||
|  |               class=" | ||||||
|  |                 focus:border-black focus:ring-2 focus:ring-black | ||||||
|  |                 text-white text-sm | ||||||
|  |                 py-2.5 | ||||||
|  |                 px-5 | ||||||
|  |                 rounded-md | ||||||
|  |                 bg-blue-500 | ||||||
|  |                 hover:bg-blue-600 hover:shadow-lg | ||||||
|  |                 w-full | ||||||
|  |                 md:w-auto | ||||||
|  |                 mb-1 | ||||||
|  |                 md:mr-1 | ||||||
|  |               " | ||||||
|               @click="get_certificate" |               @click="get_certificate" | ||||||
|             > |             > | ||||||
|               <svg |               <svg | ||||||
| @@ -29,18 +92,32 @@ | |||||||
|                 stroke-linecap="round" |                 stroke-linecap="round" | ||||||
|                 stroke-linejoin="round" |                 stroke-linejoin="round" | ||||||
|                 class="feather feather-download" |                 class="feather feather-download" | ||||||
|                 style="display: inline;height: 1rem;vertical-align: sub;" |                 style="display: inline; height: 1rem; vertical-align: sub" | ||||||
|               > |               > | ||||||
|                 <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" /> |                 <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" /> | ||||||
|                 <polyline points="7 10 12 15 17 10" /> |                 <polyline points="7 10 12 15 17 10" /> | ||||||
|                 <line x1="12" y1="15" x2="12" y2="3" /> |                 <line x1="12" y1="15" x2="12" y2="3" /> | ||||||
|               </svg> |               </svg> | ||||||
|               {{ $t('download_certificate') }} |               {{ $t("download_certificate") }} | ||||||
|             </button> |             </button> | ||||||
|             <button |             <button | ||||||
|               type="button" |               type="button" | ||||||
|               class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-red-600 hover:bg-red-700 hover:shadow-lg ml-1" |               class=" | ||||||
|               @click="() => { state.delete_active = true }" |                 focus:border-black focus:ring-2 focus:ring-black | ||||||
|  |                 text-white text-sm | ||||||
|  |                 py-2.5 | ||||||
|  |                 px-5 | ||||||
|  |                 rounded-md | ||||||
|  |                 bg-red-600 | ||||||
|  |                 hover:bg-red-700 hover:shadow-lg | ||||||
|  |                 w-full | ||||||
|  |                 md:w-auto | ||||||
|  |               " | ||||||
|  |               @click=" | ||||||
|  |                 () => { | ||||||
|  |                   state.delete_active = true; | ||||||
|  |                 } | ||||||
|  |               " | ||||||
|             > |             > | ||||||
|               <svg |               <svg | ||||||
|                 xmlns="http://www.w3.org/2000/svg" |                 xmlns="http://www.w3.org/2000/svg" | ||||||
| @@ -53,7 +130,7 @@ | |||||||
|                 stroke-linecap="round" |                 stroke-linecap="round" | ||||||
|                 stroke-linejoin="round" |                 stroke-linejoin="round" | ||||||
|                 class="feather feather-download" |                 class="feather feather-download" | ||||||
|                 style="display: inline;height: 1rem;vertical-align: sub;" |                 style="display: inline; height: 1rem; vertical-align: sub" | ||||||
|               > |               > | ||||||
|                 <path d="M0 0h24v24H0z" /> |                 <path d="M0 0h24v24H0z" /> | ||||||
|                 <path |                 <path | ||||||
| @@ -61,14 +138,26 @@ | |||||||
|                   d="M17 6h5v2h-2v13a1 1 0 01-1 1H5a1 1 0 01-1-1V8H2V6h5V3a1 1 0 011-1h8a1 1 0 011 1v3zm1 2H6v12h12V8zm-5 6l2 2-1 1-2-2-2 2-1-1 2-2-2-2 1-1 2 2 2-2 1 1-2 2zM9 4v2h6V4H9z" |                   d="M17 6h5v2h-2v13a1 1 0 01-1 1H5a1 1 0 01-1-1V8H2V6h5V3a1 1 0 011-1h8a1 1 0 011 1v3zm1 2H6v12h12V8zm-5 6l2 2-1 1-2-2-2 2-1-1 2-2-2-2 1-1 2 2 2-2 1 1-2 2zM9 4v2h6V4H9z" | ||||||
|                 /> |                 /> | ||||||
|               </svg> |               </svg> | ||||||
|               {{ $t('delete_my_data') }} |               {{ $t("delete_my_data") }} | ||||||
|             </button> |             </button> | ||||||
|           </div> |           </div> | ||||||
|           <div v-if="(state.delete_active === true)"> |           <div v-if="state.delete_active === true"> | ||||||
|             <button |             <button | ||||||
|               type="button" |               type="button" | ||||||
|               class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-blue-500 hover:bg-blue-600 hover:shadow-lg" |               class=" | ||||||
|               @click="() => { state.delete_active = false }" |                 focus:border-black focus:ring-2 focus:ring-black | ||||||
|  |                 text-white text-sm | ||||||
|  |                 py-2.5 | ||||||
|  |                 px-5 | ||||||
|  |                 rounded-md | ||||||
|  |                 bg-blue-500 | ||||||
|  |                 hover:bg-blue-600 hover:shadow-lg | ||||||
|  |               " | ||||||
|  |               @click=" | ||||||
|  |                 () => { | ||||||
|  |                   state.delete_active = false; | ||||||
|  |                 } | ||||||
|  |               " | ||||||
|             > |             > | ||||||
|               <svg |               <svg | ||||||
|                 xmlns="http://www.w3.org/2000/svg" |                 xmlns="http://www.w3.org/2000/svg" | ||||||
| @@ -81,16 +170,28 @@ | |||||||
|                 stroke-linecap="round" |                 stroke-linecap="round" | ||||||
|                 stroke-linejoin="round" |                 stroke-linejoin="round" | ||||||
|                 class="feather feather-download" |                 class="feather feather-download" | ||||||
|                 style="display: inline;height: 1rem;vertical-align: sub;" |                 style="display: inline; height: 1rem; vertical-align: sub" | ||||||
|               > |               > | ||||||
|                 <path fill="none" d="M0 0h24v24H0z" /> |                 <path fill="none" d="M0 0h24v24H0z" /> | ||||||
|                 <path fill="currentColor" d="M12 11l5-5 1 1-5 5 5 5-1 1-5-5-5 5-1-1 5-5-5-5 1-1z" /> |                 <path | ||||||
|  |                   fill="currentColor" | ||||||
|  |                   d="M12 11l5-5 1 1-5 5 5 5-1 1-5-5-5 5-1-1 5-5-5-5 1-1z" | ||||||
|  |                 /> | ||||||
|               </svg> |               </svg> | ||||||
|               {{ $t('cancel_keep_my_data') }} |               {{ $t("cancel_keep_my_data") }} | ||||||
|             </button> |             </button> | ||||||
|             <button |             <button | ||||||
|               type="button" |               type="button" | ||||||
|               class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-red-600 hover:bg-red-700 hover:shadow-lg ml-1" |               class=" | ||||||
|  |                 focus:border-black focus:ring-2 focus:ring-black | ||||||
|  |                 text-white text-sm | ||||||
|  |                 py-2.5 | ||||||
|  |                 px-5 | ||||||
|  |                 rounded-md | ||||||
|  |                 bg-red-600 | ||||||
|  |                 hover:bg-red-700 hover:shadow-lg | ||||||
|  |                 ml-1 | ||||||
|  |               " | ||||||
|               @click="delete_me" |               @click="delete_me" | ||||||
|             > |             > | ||||||
|               <svg |               <svg | ||||||
| @@ -104,7 +205,7 @@ | |||||||
|                 stroke-linecap="round" |                 stroke-linecap="round" | ||||||
|                 stroke-linejoin="round" |                 stroke-linejoin="round" | ||||||
|                 class="feather feather-download" |                 class="feather feather-download" | ||||||
|                 style="display: inline;height: 1rem;vertical-align: sub;" |                 style="display: inline; height: 1rem; vertical-align: sub" | ||||||
|               > |               > | ||||||
|                 <path d="M0 0h24v24H0z" /> |                 <path d="M0 0h24v24H0z" /> | ||||||
|                 <path |                 <path | ||||||
| @@ -112,7 +213,7 @@ | |||||||
|                   d="M17 6h5v2h-2v13a1 1 0 01-1 1H5a1 1 0 01-1-1V8H2V6h5V3a1 1 0 011-1h8a1 1 0 011 1v3zm1 2H6v12h12V8zm-5 6l2 2-1 1-2-2-2 2-1-1 2-2-2-2 1-1 2 2 2-2 1 1-2 2zM9 4v2h6V4H9z" |                   d="M17 6h5v2h-2v13a1 1 0 01-1 1H5a1 1 0 01-1-1V8H2V6h5V3a1 1 0 011-1h8a1 1 0 011 1v3zm1 2H6v12h12V8zm-5 6l2 2-1 1-2-2-2 2-1-1 2-2-2-2 1-1 2 2 2-2 1 1-2 2zM9 4v2h6V4H9z" | ||||||
|                 /> |                 /> | ||||||
|               </svg> |               </svg> | ||||||
|               {{ $t('confirm_delete_all_of_my_data') }} |               {{ $t("confirm_delete_all_of_my_data") }} | ||||||
|             </button> |             </button> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
| @@ -124,66 +225,170 @@ | |||||||
|           <div class="flex lg:flex-wrap flex-row lg:space-x-2"> |           <div class="flex lg:flex-wrap flex-row lg:space-x-2"> | ||||||
|             <div class="flex-none"> |             <div class="flex-none"> | ||||||
|               <button |               <button | ||||||
|                 @click="() => { state.activetab = 'profile' }" |                 @click=" | ||||||
|                 :class="{ 'tab-active border-b-2 font-medium border-blue-500': (state.activetab === 'profile') }" |                   () => { | ||||||
|  |                     state.activetab = 'profile'; | ||||||
|  |                   } | ||||||
|  |                 " | ||||||
|  |                 :class="{ | ||||||
|  |                   'tab-active border-b-2 font-medium border-blue-500': | ||||||
|  |                     state.activetab === 'profile', | ||||||
|  |                 }" | ||||||
|                 class="tab tab-underline py-4 px-6 block" |                 class="tab tab-underline py-4 px-6 block" | ||||||
|                 type="button" |                 type="button" | ||||||
|               >{{ $t('profile') }}</button> |               > | ||||||
|  |                 {{ $t("profile") }} | ||||||
|  |               </button> | ||||||
|             </div> |             </div> | ||||||
|             <div class="flex-none"> |             <div class="flex-none"> | ||||||
|               <button |               <button | ||||||
|                 @click="() => { state.activetab = 'laptimes' }" |                 @click=" | ||||||
|                 :class="{ 'tab-active border-b-2 font-medium border-blue-500': (state.activetab === 'laptimes') }" |                   () => { | ||||||
|  |                     state.activetab = 'laptimes'; | ||||||
|  |                   } | ||||||
|  |                 " | ||||||
|  |                 :class="{ | ||||||
|  |                   'tab-active border-b-2 font-medium border-blue-500': | ||||||
|  |                     state.activetab === 'laptimes', | ||||||
|  |                 }" | ||||||
|                 class="tab tab-underline py-4 px-6 block" |                 class="tab tab-underline py-4 px-6 block" | ||||||
|                 type="button" |                 type="button" | ||||||
|               >{{ $t('lap_times') }}</button> |               > | ||||||
|  |                 {{ $t("lap_times") }} | ||||||
|  |               </button> | ||||||
|             </div> |             </div> | ||||||
|             <div class="flex-none"> |             <div class="flex-none"> | ||||||
|               <button |               <button | ||||||
|                 @click="() => { state.activetab = 'sponsorings' }" |                 @click=" | ||||||
|                 :class="{ 'tab-active border-b-2 font-medium border-blue-500': (state.activetab === 'sponsorings') }" |                   () => { | ||||||
|  |                     state.activetab = 'sponsorings'; | ||||||
|  |                   } | ||||||
|  |                 " | ||||||
|  |                 :class="{ | ||||||
|  |                   'tab-active border-b-2 font-medium border-blue-500': | ||||||
|  |                     state.activetab === 'sponsorings', | ||||||
|  |                 }" | ||||||
|                 class="tab tab-underline py-4 px-6 block" |                 class="tab tab-underline py-4 px-6 block" | ||||||
|                 type="button" |                 type="button" | ||||||
|               >{{ $t('sponsoring') }}</button> |               > | ||||||
|  |                 {{ $t("sponsoring") }} | ||||||
|  |               </button> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|           <div v-if="(state.activetab === 'profile')" class="tab-content block"> |           <div v-if="state.activetab === 'profile'" class="tab-content block"> | ||||||
|             <div class="py-4 w-full"> |             <div class="py-4 w-full"> | ||||||
|               <div class="flex flex-col"> |               <div class="flex flex-col"> | ||||||
|                 <form class="form flex flex-wrap w-full"> |                 <form class="form flex flex-wrap w-full"> | ||||||
|                   <div class="w-full"> |                   <div class="w-full"> | ||||||
|                     <div class="form-element"> |                     <div class="form-element"> | ||||||
|                       <div class="text-lg">{{ $t('vorname') }}</div> |                       <div class="text-lg">{{ $t("registrierungscode") }}</div> | ||||||
|  |                       <img alt="Registrierungscode" :src="state.barcode" /> | ||||||
|  |                       <div class="text-lg">{{ $t("vorname") }}</div> | ||||||
|                       <p |                       <p | ||||||
|                         class="h-10 w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out" |                         class=" | ||||||
|  |                           h-10 | ||||||
|  |                           w-full | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                           rounded | ||||||
|  |                           text-base | ||||||
|  |                           outline-none | ||||||
|  |                           dark:text-gray-100 | ||||||
|  |                           text-gray-600 | ||||||
|  |                           py-1 | ||||||
|  |                           px-3 | ||||||
|  |                           leading-8 | ||||||
|  |                           transition-colors | ||||||
|  |                           duration-200 | ||||||
|  |                           ease-in-out | ||||||
|  |                         " | ||||||
|                         v-text="state.firstname" |                         v-text="state.firstname" | ||||||
|                       /> |                       /> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="form-element"> |                     <div class="form-element"> | ||||||
|                       <div class="text-lg">{{ $t('mittelname') }}</div> |                       <div class="text-lg">{{ $t("mittelname") }}</div> | ||||||
|                       <p |                       <p | ||||||
|                         class="h-10 w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out" |                         class=" | ||||||
|  |                           h-10 | ||||||
|  |                           w-full | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                           rounded | ||||||
|  |                           text-base | ||||||
|  |                           outline-none | ||||||
|  |                           dark:text-gray-100 | ||||||
|  |                           text-gray-600 | ||||||
|  |                           py-1 | ||||||
|  |                           px-3 | ||||||
|  |                           leading-8 | ||||||
|  |                           transition-colors | ||||||
|  |                           duration-200 | ||||||
|  |                           ease-in-out | ||||||
|  |                         " | ||||||
|                         v-text="state.middlename" |                         v-text="state.middlename" | ||||||
|                       /> |                       /> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="form-element"> |                     <div class="form-element"> | ||||||
|                       <div class="text-lg">{{ $t('nachname') }}</div> |                       <div class="text-lg">{{ $t("nachname") }}</div> | ||||||
|                       <p |                       <p | ||||||
|                         class="h-10 w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out" |                         class=" | ||||||
|  |                           h-10 | ||||||
|  |                           w-full | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                           rounded | ||||||
|  |                           text-base | ||||||
|  |                           outline-none | ||||||
|  |                           dark:text-gray-100 | ||||||
|  |                           text-gray-600 | ||||||
|  |                           py-1 | ||||||
|  |                           px-3 | ||||||
|  |                           leading-8 | ||||||
|  |                           transition-colors | ||||||
|  |                           duration-200 | ||||||
|  |                           ease-in-out | ||||||
|  |                         " | ||||||
|                         v-text="state.lastname" |                         v-text="state.lastname" | ||||||
|                       /> |                       /> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="form-element"> |                     <div class="form-element"> | ||||||
|                       <div class="text-lg">{{ $t('e_mail_adress') }}</div> |                       <div class="text-lg">{{ $t("e_mail_adress") }}</div> | ||||||
|                       <p |                       <p | ||||||
|                         class="h-10 w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out" |                         class=" | ||||||
|  |                           h-10 | ||||||
|  |                           w-full | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                           rounded | ||||||
|  |                           text-base | ||||||
|  |                           outline-none | ||||||
|  |                           dark:text-gray-100 | ||||||
|  |                           text-gray-600 | ||||||
|  |                           py-1 | ||||||
|  |                           px-3 | ||||||
|  |                           leading-8 | ||||||
|  |                           transition-colors | ||||||
|  |                           duration-200 | ||||||
|  |                           ease-in-out | ||||||
|  |                         " | ||||||
|                         v-text="state.email" |                         v-text="state.email" | ||||||
|                       /> |                       /> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="form-element"> |                     <div class="form-element"> | ||||||
|                       <div class="text-lg">{{ $t('phone_number') }}</div> |                       <div class="text-lg">{{ $t("phone_number") }}</div> | ||||||
|                       <p |                       <p | ||||||
|                         class="h-10 w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out" |                         class=" | ||||||
|  |                           h-10 | ||||||
|  |                           w-full | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                           rounded | ||||||
|  |                           text-base | ||||||
|  |                           outline-none | ||||||
|  |                           dark:text-gray-100 | ||||||
|  |                           text-gray-600 | ||||||
|  |                           py-1 | ||||||
|  |                           px-3 | ||||||
|  |                           leading-8 | ||||||
|  |                           transition-colors | ||||||
|  |                           duration-200 | ||||||
|  |                           ease-in-out | ||||||
|  |                         " | ||||||
|                         v-text="state.phone" |                         v-text="state.phone" | ||||||
|                       /> |                       /> | ||||||
|                     </div> |                     </div> | ||||||
| @@ -192,7 +397,7 @@ | |||||||
|               </div> |               </div> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|           <div v-if="(state.activetab === 'laptimes')" class="tab-content block"> |           <div v-if="state.activetab === 'laptimes'" class="tab-content block"> | ||||||
|             <div class="py-4 w-full"> |             <div class="py-4 w-full"> | ||||||
|               <section class="text-gray-400 dark:bg-gray-900 body-font"> |               <section class="text-gray-400 dark:bg-gray-900 body-font"> | ||||||
|                 <div class="container mx-auto"> |                 <div class="container mx-auto"> | ||||||
| @@ -202,15 +407,37 @@ | |||||||
|                       class="table-auto w-full text-left whitespace-no-wrap" |                       class="table-auto w-full text-left whitespace-no-wrap" | ||||||
|                     > |                     > | ||||||
|                       <thead |                       <thead | ||||||
|                         class="text-black bg-gray-300 dark:text-white text-sm dark:bg-gray-800" |                         class=" | ||||||
|  |                           text-black | ||||||
|  |                           bg-gray-300 | ||||||
|  |                           dark:text-white | ||||||
|  |                           text-sm | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                         " | ||||||
|                       > |                       > | ||||||
|                         <tr> |                         <tr> | ||||||
|                           <th |                           <th | ||||||
|                             class="px-4 py-3 title-font tracking-wider font-medium" |                             class=" | ||||||
|                           >{{ $t('distance') }}</th> |                               px-4 | ||||||
|  |                               py-3 | ||||||
|  |                               title-font | ||||||
|  |                               tracking-wider | ||||||
|  |                               font-medium | ||||||
|  |                             " | ||||||
|  |                           > | ||||||
|  |                             {{ $t("distance") }} | ||||||
|  |                           </th> | ||||||
|                           <th |                           <th | ||||||
|                             class="px-4 py-3 title-font tracking-wider font-medium" |                             class=" | ||||||
|                           >{{ $t('lap_time') }}</th> |                               px-4 | ||||||
|  |                               py-3 | ||||||
|  |                               title-font | ||||||
|  |                               tracking-wider | ||||||
|  |                               font-medium | ||||||
|  |                             " | ||||||
|  |                           > | ||||||
|  |                             {{ $t("lap_time") }} | ||||||
|  |                           </th> | ||||||
|                         </tr> |                         </tr> | ||||||
|                       </thead> |                       </thead> | ||||||
|                       <tbody class="text-gray-900 dark:text-gray-50"> |                       <tbody class="text-gray-900 dark:text-gray-50"> | ||||||
| @@ -222,20 +449,32 @@ | |||||||
|                         </tr> |                         </tr> | ||||||
|                       </tbody> |                       </tbody> | ||||||
|                     </table> |                     </table> | ||||||
|                     <div v-else class="text-center font-bold text-black dark:text-white text-2xl"> |                     <div | ||||||
|  |                       v-else | ||||||
|  |                       class=" | ||||||
|  |                         text-center | ||||||
|  |                         font-bold | ||||||
|  |                         text-black | ||||||
|  |                         dark:text-white | ||||||
|  |                         text-2xl | ||||||
|  |                       " | ||||||
|  |                     > | ||||||
|                       <img |                       <img | ||||||
|                         src="../assets/empty_laps.svg" |                         src="../assets/empty_laps.svg" | ||||||
|                         style="height:25rem; margin:0 auto;" |                         style="height: 25rem; margin: 0 auto" | ||||||
|                         :alt="[[$t('no_laps_scans_were_recorded_yet')]]" |                         :alt="[[$t('no_laps_scans_were_recorded_yet')]]" | ||||||
|                       /> |                       /> | ||||||
|                       {{ $t('no_laps_scans_were_recorded_yet') }} |                       {{ $t("no_laps_scans_were_recorded_yet") }} | ||||||
|                     </div> |                     </div> | ||||||
|                   </div> |                   </div> | ||||||
|                 </div> |                 </div> | ||||||
|               </section> |               </section> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|           <div v-if="(state.activetab === 'sponsorings')" class="tab-content block"> |           <div | ||||||
|  |             v-if="state.activetab === 'sponsorings'" | ||||||
|  |             class="tab-content block" | ||||||
|  |           > | ||||||
|             <div class="py-4 w-full"> |             <div class="py-4 w-full"> | ||||||
|               <section class="text-gray-400 dark:bg-gray-900 body-font"> |               <section class="text-gray-400 dark:bg-gray-900 body-font"> | ||||||
|                 <div class="container mx-auto"> |                 <div class="container mx-auto"> | ||||||
| @@ -245,16 +484,48 @@ | |||||||
|                       class="table-auto w-full text-left whitespace-no-wrap" |                       class="table-auto w-full text-left whitespace-no-wrap" | ||||||
|                     > |                     > | ||||||
|                       <thead |                       <thead | ||||||
|                         class="text-black bg-gray-300 dark:text-white text-sm dark:bg-gray-800" |                         class=" | ||||||
|  |                           text-black | ||||||
|  |                           bg-gray-300 | ||||||
|  |                           dark:text-white | ||||||
|  |                           text-sm | ||||||
|  |                           dark:bg-gray-800 | ||||||
|  |                         " | ||||||
|                       > |                       > | ||||||
|                         <tr> |                         <tr> | ||||||
|                           <th class="px-4 py-3 title-font tracking-wider font-medium">Name</th> |  | ||||||
|                           <th |                           <th | ||||||
|                             class="px-4 py-3 title-font tracking-wider font-medium" |                             class=" | ||||||
|                           >{{ $t('amount_per_kilometer_in_eur') }}</th> |                               px-4 | ||||||
|  |                               py-3 | ||||||
|  |                               title-font | ||||||
|  |                               tracking-wider | ||||||
|  |                               font-medium | ||||||
|  |                             " | ||||||
|  |                           > | ||||||
|  |                             Name | ||||||
|  |                           </th> | ||||||
|                           <th |                           <th | ||||||
|                             class="px-4 py-3 title-font tracking-wider font-medium" |                             class=" | ||||||
|                           >{{ $t('current_total_amount_in_eur') }}</th> |                               px-4 | ||||||
|  |                               py-3 | ||||||
|  |                               title-font | ||||||
|  |                               tracking-wider | ||||||
|  |                               font-medium | ||||||
|  |                             " | ||||||
|  |                           > | ||||||
|  |                             {{ $t("amount_per_kilometer_in_eur") }} | ||||||
|  |                           </th> | ||||||
|  |                           <th | ||||||
|  |                             class=" | ||||||
|  |                               px-4 | ||||||
|  |                               py-3 | ||||||
|  |                               title-font | ||||||
|  |                               tracking-wider | ||||||
|  |                               font-medium | ||||||
|  |                             " | ||||||
|  |                           > | ||||||
|  |                             {{ $t("current_total_amount_in_eur") }} | ||||||
|  |                           </th> | ||||||
|                         </tr> |                         </tr> | ||||||
|                       </thead> |                       </thead> | ||||||
|                       <tbody class="text-gray-900 dark:text-gray-50"> |                       <tbody class="text-gray-900 dark:text-gray-50"> | ||||||
| @@ -268,51 +539,86 @@ | |||||||
|                           </td> |                           </td> | ||||||
|                           <td class="px-4 py-3"> |                           <td class="px-4 py-3"> | ||||||
|                             <span |                             <span | ||||||
|                               v-text="(s.amountPerDistance / 100) |                               v-text=" | ||||||
|                               .toFixed(2) |                                 (s.amountPerDistance / 100) | ||||||
|                               .toLocaleString('de-DE', { valute: 'EUR' })" |                                   .toFixed(2) | ||||||
|                             ></span>€ |                                   .toLocaleString('de-DE', { valute: 'EUR' }) | ||||||
|  |                               " | ||||||
|  |                             ></span | ||||||
|  |                             >€ | ||||||
|                           </td> |                           </td> | ||||||
|                           <td class="px-4 py-3"> |                           <td class="px-4 py-3"> | ||||||
|                             <span |                             <span | ||||||
|                               v-text="(s.amount / 100) |                               v-text=" | ||||||
|                               .toFixed(2) |                                 (s.amount / 100) | ||||||
|                               .toLocaleString('de-DE', { valute: 'EUR' })" |                                   .toFixed(2) | ||||||
|                             ></span>€ |                                   .toLocaleString('de-DE', { valute: 'EUR' }) | ||||||
|  |                               " | ||||||
|  |                             ></span | ||||||
|  |                             >€ | ||||||
|                           </td> |                           </td> | ||||||
|                         </tr> |                         </tr> | ||||||
|                       </tbody> |                       </tbody> | ||||||
|                       <tfoot class="text-gray-900 dark:text-gray-50"> |                       <tfoot class="text-gray-900 dark:text-gray-50"> | ||||||
|                         <tr> |                         <tr> | ||||||
|                           <td class="px-4 py-3">{{ $t('total') }}</td> |                           <td class="px-4 py-3">{{ $t("total") }}</td> | ||||||
|                           <td class="px-4 py-3"> |                           <td class="px-4 py-3"> | ||||||
|                             <span |                             <span | ||||||
|                               v-text="(state.sponsorings.reduce(function(sum, current) { |                               v-text=" | ||||||
|                               return sum + current.amountPerDistance; |                                 ( | ||||||
|                             }, 0) / 100) |                                   state.sponsorings.reduce(function ( | ||||||
|                               .toFixed(2) |                                     sum, | ||||||
|                               .toLocaleString('de-DE', { valute: 'EUR' })" |                                     current | ||||||
|                             ></span>€ |                                   ) { | ||||||
|  |                                     return sum + current.amountPerDistance; | ||||||
|  |                                   }, | ||||||
|  |                                   0) / 100 | ||||||
|  |                                 ) | ||||||
|  |                                   .toFixed(2) | ||||||
|  |                                   .toLocaleString('de-DE', { valute: 'EUR' }) | ||||||
|  |                               " | ||||||
|  |                             ></span | ||||||
|  |                             >€ | ||||||
|                           </td> |                           </td> | ||||||
|                           <td class="px-4 py-3"> |                           <td class="px-4 py-3"> | ||||||
|                             <span |                             <span | ||||||
|                               v-text="(state.sponsorings.reduce(function(sum, current) { |                               v-text=" | ||||||
|                               return sum + current.amount; |                                 ( | ||||||
|                             }, 0) / 100) |                                   state.sponsorings.reduce(function ( | ||||||
|                               .toFixed(2) |                                     sum, | ||||||
|                               .toLocaleString('de-DE', { valute: 'EUR' })" |                                     current | ||||||
|                             ></span>€ |                                   ) { | ||||||
|  |                                     return sum + current.amount; | ||||||
|  |                                   }, | ||||||
|  |                                   0) / 100 | ||||||
|  |                                 ) | ||||||
|  |                                   .toFixed(2) | ||||||
|  |                                   .toLocaleString('de-DE', { valute: 'EUR' }) | ||||||
|  |                               " | ||||||
|  |                             ></span | ||||||
|  |                             >€ | ||||||
|                           </td> |                           </td> | ||||||
|                         </tr> |                         </tr> | ||||||
|                       </tfoot> |                       </tfoot> | ||||||
|                     </table> |                     </table> | ||||||
|                     <div v-else class="text-center font-bold text-black dark:text-white text-2xl"> |                     <div | ||||||
|  |                       v-else | ||||||
|  |                       class=" | ||||||
|  |                         text-center | ||||||
|  |                         font-bold | ||||||
|  |                         text-black | ||||||
|  |                         dark:text-white | ||||||
|  |                         text-2xl | ||||||
|  |                       " | ||||||
|  |                     > | ||||||
|                       <img |                       <img | ||||||
|                         src="../assets/empty_laps.svg" |                         src="../assets/empty_laps.svg" | ||||||
|                         style="height:25rem; margin:0 auto;" |                         style="height: 25rem; margin: 0 auto" | ||||||
|                         :alt="[[$t('no_sponsorings_for_you_were_recorded_yet')]]" |                         :alt="[ | ||||||
|  |                           [$t('no_sponsorings_for_you_were_recorded_yet')], | ||||||
|  |                         ]" | ||||||
|                       /> |                       /> | ||||||
|                       {{ $t('no_sponsorings_for_you_were_recorded_yet') }} |                       {{ $t("no_sponsorings_for_you_were_recorded_yet") }} | ||||||
|                     </div> |                     </div> | ||||||
|                   </div> |                   </div> | ||||||
|                 </div> |                 </div> | ||||||
| @@ -327,10 +633,27 @@ | |||||||
|  |  | ||||||
| <script setup> | <script setup> | ||||||
| import { reactive } from "vue"; | import { reactive } from "vue"; | ||||||
| import { useToast } from "vue-toastification"; | import { TYPE, useToast } from "vue-toastification"; | ||||||
| import axios from "redaxios"; | import axios from "redaxios"; | ||||||
|  | import bwipjs from "bwip-js"; | ||||||
|  |  | ||||||
|  | function textToBase64Barcode(text) { | ||||||
|  |   var canvas = document.createElement("canvas"); | ||||||
|  |   bwipjs.toCanvas(canvas, { | ||||||
|  |     bcid: config.codeformat || "code39", | ||||||
|  |     text: text, | ||||||
|  |     scale: 3, | ||||||
|  |     height: 10, | ||||||
|  |     // width: 10, | ||||||
|  |     includetext: true, | ||||||
|  |     textxalign: "center", | ||||||
|  |     backgroundcolor: "ffffff", | ||||||
|  |   }); | ||||||
|  |   return canvas.toDataURL("image/png"); | ||||||
|  | } | ||||||
|  |  | ||||||
| const state = reactive({ | const state = reactive({ | ||||||
|  |   barcode: "", | ||||||
|   phone: "", |   phone: "", | ||||||
|   email: "", |   email: "", | ||||||
|   firstname: "", |   firstname: "", | ||||||
| @@ -341,14 +664,15 @@ const state = reactive({ | |||||||
|   group: "", |   group: "", | ||||||
|   activetab: "profile", |   activetab: "profile", | ||||||
|   delete_active: false, |   delete_active: false, | ||||||
|   fullobject: {} |   fullobject: {}, | ||||||
| }) | }); | ||||||
| const toast = useToast(); | const toast = useToast(); | ||||||
| const props = defineProps({ | const props = defineProps({ | ||||||
|   token: String |   token: String, | ||||||
| }) | }); | ||||||
| const accesstoken = atob(props.token); | const accesstoken = atob(props.token); | ||||||
| axios.get(`${config.baseurl}api/runners/me/${accesstoken}`) | axios | ||||||
|  |   .get(`${config.baseurl}api/runners/me/${accesstoken}`) | ||||||
|   .then(({ data }) => { |   .then(({ data }) => { | ||||||
|     state.phone = data.phone; |     state.phone = data.phone; | ||||||
|     state.email = data.email; |     state.email = data.email; | ||||||
| @@ -358,65 +682,100 @@ axios.get(`${config.baseurl}api/runners/me/${accesstoken}`) | |||||||
|     state.group = data.group; |     state.group = data.group; | ||||||
|     state.sponsorings = data.distanceDonations; |     state.sponsorings = data.distanceDonations; | ||||||
|     state.fullobject = data; |     state.fullobject = data; | ||||||
|   }).catch((error) => { |     state.barcode = textToBase64Barcode(data.id ?? "???"); | ||||||
|     toast.error("An error occured while loading your profile data"); |  | ||||||
|   }) |   }) | ||||||
| axios.get(`${config.baseurl}api/runners/me/${accesstoken}/scans`) |   .catch((error) => { | ||||||
|  |     toast.clear(); | ||||||
|  |     toast.error("Profil konnte nicht geladen werden..."); | ||||||
|  |   }); | ||||||
|  | axios | ||||||
|  |   .get(`${config.baseurl}api/runners/me/${accesstoken}/scans`) | ||||||
|   .then(({ data }) => { |   .then(({ data }) => { | ||||||
|     data.map(function(s) { |     data.map(function (s) { | ||||||
|       s.lapTime = Math.floor(s.lapTime / 60) + 'min ' + (Math.floor(s.lapTime % 60) + "").padStart(2, "0") + "s" |       s.lapTime = | ||||||
|       s.distance = Math.floor(s.distance / 1000) + 'km ' + (Math.floor(s.distance % 1000) + "").padStart(3, "0") + "m" |         Math.floor(s.lapTime / 60) + | ||||||
|  |         "min " + | ||||||
|  |         (Math.floor(s.lapTime % 60) + "").padStart(2, "0") + | ||||||
|  |         "s"; | ||||||
|  |       s.distance = | ||||||
|  |         Math.floor(s.distance / 1000) + | ||||||
|  |         "km " + | ||||||
|  |         (Math.floor(s.distance % 1000) + "").padStart(3, "0") + | ||||||
|  |         "m"; | ||||||
|       return s; |       return s; | ||||||
|     }) |     }); | ||||||
|     data.filter(s => s.valid === true); |     data.filter((s) => s.valid === true); | ||||||
|     state.scans = data; |     state.scans = data; | ||||||
|   }).catch((error) => { |  | ||||||
|     toast.error("An error occured while loading your profile data"); |  | ||||||
|   }) |   }) | ||||||
|  |   .catch((error) => { | ||||||
|  |     toast.error("Profil konnte nicht geladen werden..."); | ||||||
|  |   }); | ||||||
| function delete_me() { | function delete_me() { | ||||||
|   toast("Deletion in progress..."); |   toast.clear(); | ||||||
|   let url = `${config.baseurl}api/runners/me/${accesstoken}?force=true` |   toast("Profil wird gelöscht..."); | ||||||
|   axios.delete(url) |   let url = `${config.baseurl}api/runners/me/${accesstoken}?force=true`; | ||||||
|  |   axios | ||||||
|  |     .delete(url) | ||||||
|     .then(() => { |     .then(() => { | ||||||
|       toast("All Data deleted!"); |       toast.clear(); | ||||||
|  |       toast("Alle Daten gelöscht!"); | ||||||
|       location.replace(`${config.baseurl_selfservice}`); |       location.replace(`${config.baseurl_selfservice}`); | ||||||
|     }) |     }) | ||||||
|     .catch((error) => { |     .catch((error) => { | ||||||
|       toast.error("An error occured while deleting your profile data"); |       toast.clear(); | ||||||
|  |       toast.error("Profil konnte nicht gelöscht werden..."); | ||||||
|     }); |     }); | ||||||
| } | } | ||||||
| function get_certificate() { | function get_certificate() { | ||||||
|   toast("Generation in progress..."); |   toast("Urkunde wird generiert..."); | ||||||
|   const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2); |   const browserlocale = ( | ||||||
|  |     (navigator.languages && navigator.languages[0]) || | ||||||
|  |     "" | ||||||
|  |   ).substr(0, 2); | ||||||
|   let url = `${config.baseurl_documentserver}certificates?locale=${browserlocale}&download=true&key=${config.documentserver_key}`; |   let url = `${config.baseurl_documentserver}certificates?locale=${browserlocale}&download=true&key=${config.documentserver_key}`; | ||||||
|   let postdata = Object.assign({}, state.fullobject); |   let postdata = Object.assign({}, state.fullobject); | ||||||
|   postdata.group = { |   postdata.group = { | ||||||
|     name: postdata.group |     name: postdata.group, | ||||||
|   } |   }; | ||||||
|   postdata = [postdata] |   postdata = [postdata]; | ||||||
|   axios.post(url, postdata, { |   axios | ||||||
|     responseType: "blob" |     .post(url, postdata, { | ||||||
|   }) |       responseType: "blob", | ||||||
|  |     }) | ||||||
|     .then((response) => { |     .then((response) => { | ||||||
|       console.log(response) |       console.log(response); | ||||||
|       if (response.status != "200") { |       if (response.status != "200") { | ||||||
|         toast.error("An error occured while generateing your certificate!"); |         toast.error("Urkunde konnte nicht generiert werden..."); | ||||||
|       } else { |       } else { | ||||||
|         var fileURL = window.URL.createObjectURL(new Blob([response.data], { type: 'application/pdf' })); |         var fileURL = window.URL.createObjectURL( | ||||||
|         var fileLink = document.createElement('a'); |           new Blob([response.data], { type: "application/pdf" }) | ||||||
|  |           ); | ||||||
|  |         var fileLink = document.createElement("a"); | ||||||
|  |  | ||||||
|         fileLink.href = fileURL; |         fileLink.href = fileURL; | ||||||
|         fileLink.setAttribute('download', 'Certificate.pdf'); |         fileLink.setAttribute("download", "Certificate.pdf"); | ||||||
|         document.body.appendChild(fileLink); |         document.body.appendChild(fileLink); | ||||||
|  |          | ||||||
|         fileLink.click(); |         fileLink.click(); | ||||||
|         fileLink.remove(); |         fileLink.remove(); | ||||||
|         toast("Document generated!"); |         toast.clear(); | ||||||
|  |         toast("Urkunde generiert!", { type: TYPE.SUCCESS }); | ||||||
|       } |       } | ||||||
|     }) |     }) | ||||||
|     .catch((err) => { |     .catch((err) => { | ||||||
|       console.error(err); |       console.error(err); | ||||||
|       toast.error("An error occured while generating your certificate"); |       toast.clear(); | ||||||
|  |       toast.error("Urkunde konnte nicht generiert werden..."); | ||||||
|     }); |     }); | ||||||
| } | } | ||||||
|  | function get_registration() { | ||||||
|  |   toast.clear(); | ||||||
|  |   toast("Registrierungscode wird generiert..."); | ||||||
|  |   var a = document.createElement("a"); | ||||||
|  |   a.href = state.barcode; | ||||||
|  |   a.download = "LfK23_Registrierungscode.png"; | ||||||
|  |   a.click(); | ||||||
|  |   toast.clear(); | ||||||
|  |   toast("Registrierungscode generiert!", { type: TYPE.SUCCESS }); | ||||||
|  | } | ||||||
| </script> | </script> | ||||||
| @@ -1,104 +1,104 @@ | |||||||
| <template> | <template> | ||||||
|     <div class="min-h-screen flex items-center justify-center"> |     <div class="min-h-screen flex items-center justify-center"> | ||||||
|         <div class="max-w-md w-full py-12 px-6"> |         <div class="max-w-md w-full py-12 px-6"> | ||||||
|             <img class="mx-auto h-24 w-auto" src="/favicon.png" alt /> |             <img class="mx-auto h-24 w-auto" src="/favicon.png" alt /> | ||||||
|             <h1 |             <h1 | ||||||
|                 class="sm:text-3xl text-2xl font-medium title-font mb-4 text-center" |                 class="sm:text-3xl text-2xl font-medium title-font mb-4 text-center" | ||||||
|             >Lauf für Kaya! - {{ $t('profile') }}</h1> |             >Lauf für Kaya! - {{ $t('profile') }}</h1> | ||||||
|             <p class="mx-auto leading-relaxed text-base text-center"> |             <p class="mx-auto leading-relaxed text-base text-center"> | ||||||
|                 {{ $t('you_have_not_provided_a_valid_access_key') }} |                 {{ $t('you_have_not_provided_a_valid_access_key') }} | ||||||
|                 <br /> |                 <br /> | ||||||
|                 {{ $t('access_is_only_provided_via_your_email_link') }} |                 {{ $t('access_is_only_provided_via_your_email_link') }} | ||||||
|             </p> |             </p> | ||||||
|             <div class="mt-6"> |             <div class="mt-6"> | ||||||
|                 <div class="relative"> |                 <div class="relative"> | ||||||
|                     <div class="absolute inset-0 flex items-center"> |                     <div class="absolute inset-0 flex items-center"> | ||||||
|                         <div class="w-full border-t border-gray-300"></div> |                         <div class="w-full border-t border-gray-300"></div> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="relative flex justify-center text-sm"> |                     <div class="relative flex justify-center text-sm"> | ||||||
|                         <span |                         <span | ||||||
|                             class="px-2 bg-white dark:bg-gray-900" |                             class="px-2 bg-white dark:bg-gray-900" | ||||||
|                         >{{ $t('lost_your_registration_mail') }}</span> |                         >{{ $t('lost_your_registration_mail') }}</span> | ||||||
|                     </div> |                     </div> | ||||||
|                 </div> |                 </div> | ||||||
|                 <div class="mt-4"> |                 <div class="mt-4"> | ||||||
|                     <label for="email_address" class="block font-medium"> |                     <label for="email_address" class="block font-medium"> | ||||||
|                         {{ $t('e_mail_adress') }} |                         {{ $t('e_mail_adress') }} | ||||||
|                         <span class="font-bold">*</span> |                         <span class="font-bold">*</span> | ||||||
|                     </label> |                     </label> | ||||||
|                     <input |                     <input | ||||||
|                         v-model="user_email" |                         v-model="user_email" | ||||||
|                         name="email_address" |                         name="email_address" | ||||||
|                         id="email_address" |                         id="email_address" | ||||||
|                         autocomplete="off" |                         autocomplete="off" | ||||||
|                         :placeholder="[[$t('e_mail_adress')]]" |                         :placeholder="[[$t('e_mail_adress')]]" | ||||||
|                         type="email" |                         type="email" | ||||||
|                         :class="{ 'border-red-500': (!isEmail(user_email)), 'border-green-300': (isEmail(user_email)) }" |                         :class="{ 'border-red-500': (!isEmail(user_email)), 'border-green-300': (isEmail(user_email)) }" | ||||||
|                         class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-2 bg-gray-50 text-gray-500 rounded-md p-2" |                         class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|                     /> |                     /> | ||||||
|                     <p |                     <p | ||||||
|                         v-if="!isEmail(user_email)" |                         v-if="!isEmail(user_email)" | ||||||
|                         class="text-sm" |                         class="text-sm" | ||||||
|                     >{{ $t('please_provide_valid_mail') }}</p> |                     >{{ $t('please_provide_valid_mail') }}</p> | ||||||
|                 </div> |                 </div> | ||||||
|                 <div class="mt-2"> |                 <div class="mt-2"> | ||||||
|                     <a |                     <a | ||||||
|                         :disabled="(!state.submit_enabled)" |                         :disabled="(!state.submit_enabled)" | ||||||
|                         :class="{ 'opacity-50': (!state.submit_enabled), 'cursor-not-allowed': (!state.submit_enabled) }" |                         :class="{ 'opacity-50': (!state.submit_enabled), 'cursor-not-allowed': (!state.submit_enabled) }" | ||||||
|                         @click="resendMail" |                         @click="resendMail" | ||||||
|                         class="block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 dark:bg-gray-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" |                         class="block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 dark:bg-gray-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" | ||||||
|                     >{{ $t('resend_the_registration_mail') }}</a> |                     >{{ $t('resend_the_registration_mail') }}</a> | ||||||
|                 </div> |                 </div> | ||||||
|             </div> |             </div> | ||||||
|             <div class="mt-12"> |             <div class="mt-12"> | ||||||
|                 <div class="relative"> |                 <div class="relative"> | ||||||
|                     <div class="absolute inset-0 flex items-center"> |                     <div class="absolute inset-0 flex items-center"> | ||||||
|                         <div class="w-full border-t border-gray-300"></div> |                         <div class="w-full border-t border-gray-300"></div> | ||||||
|                     </div> |                     </div> | ||||||
|                     <div class="relative flex justify-center text-sm"> |                     <div class="relative flex justify-center text-sm"> | ||||||
|                         <span class="px-2 bg-white dark:bg-gray-900">{{ $t('not_registered_yet') }}</span> |                         <span class="px-2 bg-white dark:bg-gray-900">{{ $t('not_registered_yet') }}</span> | ||||||
|                     </div> |                     </div> | ||||||
|                 </div> |                 </div> | ||||||
|                 <div class="mt-2"> |                 <div class="mt-2"> | ||||||
|                     <a |                     <a | ||||||
|                         href="./register/" |                         href="/selfservice/register/" | ||||||
|                         class="text-white block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 bg-blue-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" |                         class="text-white block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 bg-blue-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" | ||||||
|                     >{{ $t('register_now_small') }}</a> |                     >{{ $t('register_now_small') }}</a> | ||||||
|                 </div> |                 </div> | ||||||
|             </div> |             </div> | ||||||
|         </div> |         </div> | ||||||
|     </div> |     </div> | ||||||
| </template> | </template> | ||||||
|    |    | ||||||
|   <script setup> |   <script setup> | ||||||
| import { computed, ref, reactive, defineProps } from "vue"; | import { computed, ref, reactive, defineProps } from "vue"; | ||||||
| import axios from "redaxios"; | import axios from "redaxios"; | ||||||
| import isEmail from 'validator/es/lib/isEmail'; | import isEmail from 'validator/es/lib/isEmail'; | ||||||
| import isMobilePhone from 'validator/es/lib/isMobilePhone'; | import isMobilePhone from 'validator/es/lib/isMobilePhone'; | ||||||
| import isPostalCode from 'validator/es/lib/isPostalCode'; | import isPostalCode from 'validator/es/lib/isPostalCode'; | ||||||
| import { useToast } from "vue-toastification"; | import { useToast } from "vue-toastification"; | ||||||
|  |  | ||||||
| let user_email = ref(""); | let user_email = ref(""); | ||||||
| //  | //  | ||||||
| const state = reactive({ | const state = reactive({ | ||||||
|     org_name: "", |     org_name: "", | ||||||
|     org_teams: [], |     org_teams: [], | ||||||
|     submit_enabled: computed(() => isEmail(user_email.value)) |     submit_enabled: computed(() => isEmail(user_email.value)) | ||||||
| }) | }) | ||||||
| const toast = useToast(); | const toast = useToast(); | ||||||
| function resendMail() { | function resendMail() { | ||||||
|     if (isEmail(user_email.value)) { |     if (isEmail(user_email.value)) { | ||||||
|         toast("sending password reset mail..."); |         toast("Login-Link wird angefordert..."); | ||||||
|         const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2); |         const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2); | ||||||
|         axios.post(`${config.baseurl}api/runners/forgot?mail=${user_email.value}&locale=${browserlocale}`) |         axios.post(`${config.baseurl}api/runners/forgot?mail=${user_email.value}&locale=${browserlocale}`) | ||||||
|             .then(({ data }) => { |             .then(({ data }) => { | ||||||
|                 console.log(data); |                 console.log(data); | ||||||
|                 toast("sent password reset mail to " + user_email.value + "!"); |                 toast("Login-Link gesendet an " + user_email.value + "!"); | ||||||
|             }) |             }) | ||||||
|             .catch((error) => { |             .catch((error) => { | ||||||
|                 console.log(error); |                 console.log(error); | ||||||
|                 toast("user does not exist..."); |                 toast("Fehler beim Anfordern des Login-Links..."); | ||||||
|             }); |             }); | ||||||
|     } |     } | ||||||
| } | } | ||||||
| </script> | </script> | ||||||
| @@ -1,338 +1,322 @@ | |||||||
| <template> | <template> | ||||||
|   <div class="min-h-screen flex items-center justify-center"> |   <div class="min-h-screen flex items-center justify-center"> | ||||||
|     <div class="max-w-md w-full py-12 px-6"> |     <div class="max-w-md w-full py-12 px-6"> | ||||||
|       <img class="mx-auto h-24 w-auto" src="/favicon.png" alt /> |       <img class="mx-auto h-24 w-auto" src="/favicon.png" alt /> | ||||||
|       <h1 |       <h1 | ||||||
|         class="sm:text-3xl text-2xl font-medium title-font mb-4 text-center" |         class="sm:text-3xl text-2xl font-medium title-font mb-4 text-center" | ||||||
|       >Lauf für Kaya! - {{ $t('registrieren') }}</h1> |       >Lauf für Kaya! - {{ $t('registrieren') }}</h1> | ||||||
|       <p class="mx-auto leading-relaxed text-base text-center">{{ $t('register.register_now') }}</p> |       <p class="mx-auto leading-relaxed text-base text-center">{{ $t('register.register_now') }}</p> | ||||||
|       <p |       <p | ||||||
|         v-if="state.org_name !== ''" |         v-if="state.org_name !== ''" | ||||||
|         class="mx-auto leading-relaxed text-base text-center" |         class="mx-auto leading-relaxed text-base text-center" | ||||||
|       >{{ $t('organization') }}: {{ state.org_name }}</p> |       >{{ $t('organization') }}: {{ state.org_name }}</p> | ||||||
|       <p |       <p | ||||||
|         v-if="state.org_name !== '' && state.org_teams.length > 0" |         v-if="state.org_name !== '' && state.org_teams.length > 0" | ||||||
|         class="mx-auto leading-relaxed text-base text-center" |         class="mx-auto leading-relaxed text-base text-center" | ||||||
|       >Team:</p> |       >Team:</p> | ||||||
|       <select |       <select | ||||||
|         v-model="org_team" |         v-model="org_team" | ||||||
|         v-if="state.org_name !== '' && state.org_teams.length > 0" |         v-if="state.org_name !== '' && state.org_teams.length > 0" | ||||||
|         class="w-full border bg-white rounded px-3 py-2 outline-none block mt-1 text-sm dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 form-select focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray" |         class="w-full border bg-white rounded px-3 py-2 outline-none block mt-1 text-sm dark:text-gray-300 dark:border-gray-600 dark:bg-gray-700 form-select focus:border-purple-400 focus:outline-none focus:shadow-outline-purple dark:focus:shadow-outline-gray" | ||||||
|       > |       > | ||||||
|         <option v-for="t in state.org_teams" :key="t.id" :value="t.id">{{ t.name }}</option> |         <option v-for="t in state.org_teams" :key="t.id" :value="t.id">{{ t.name }}</option> | ||||||
|       </select> |       </select> | ||||||
|       <p |       <p | ||||||
|         v-if="state.org_name === ''" |         v-if="state.org_name === ''" | ||||||
|         class="mx-auto leading-relaxed text-base text-center" |         class="mx-auto leading-relaxed text-base text-center" | ||||||
|       >Bürgerlauf</p> |       >Bürgerlauf</p> | ||||||
|       <div class="mt-4"> |       <div class="mt-4"> | ||||||
|         <label for="first_name" class="block font-medium"> |         <label for="first_name" class="block font-medium"> | ||||||
|           {{ $t('vorname') }} |           {{ $t('vorname') }} | ||||||
|           <span class="font-bold">*</span> |           <span class="font-bold">*</span> | ||||||
|         </label> |         </label> | ||||||
|         <input |         <input | ||||||
|           v-model="userdetails.firstname" |           v-model="userdetails.firstname" | ||||||
|           name="firstname" |           name="firstname" | ||||||
|           id="first_name" |           id="first_name" | ||||||
|           autocomplete="off" |           autocomplete="off" | ||||||
|           :placeholder="[[$t('vorname')]]" |           :placeholder="[[$t('vorname')]]" | ||||||
|           type="text" |           type="text" | ||||||
|           :class="{ 'border-red-500': (!userdetails.firstname.trim()), 'border-green-300': (userdetails.firstname.trim()) }" |           :class="{ 'border-red-500': (!userdetails.firstname.trim()), 'border-green-300': (userdetails.firstname.trim()) }" | ||||||
|           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|         /> |         /> | ||||||
|         <!--  --> |         <!--  --> | ||||||
|         <label for="middle_name" class="block font-medium">{{ $t('mittelname') }}</label> |         <label for="middle_name" class="block font-medium">{{ $t('mittelname') }}</label> | ||||||
|         <input |         <input | ||||||
|           v-model="userdetails.middlename" |           v-model="userdetails.middlename" | ||||||
|           name="middlename" |           name="middlename" | ||||||
|           id="middle_name" |           id="middle_name" | ||||||
|           autocomplete="off" |           autocomplete="off" | ||||||
|           :placeholder="[[$t('mittelname')]]" |           :placeholder="[[$t('mittelname')]]" | ||||||
|           type="text" |           type="text" | ||||||
|           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|         /> |         /> | ||||||
|         <!--  --> |         <!--  --> | ||||||
|         <label for="last_name" class="block font-medium"> |         <label for="last_name" class="block font-medium"> | ||||||
|           {{ $t('nachname') }} |           {{ $t('nachname') }} | ||||||
|           <span class="font-bold">*</span> |           <span class="font-bold">*</span> | ||||||
|         </label> |         </label> | ||||||
|         <input |         <input | ||||||
|           v-model="userdetails.lastname" |           v-model="userdetails.lastname" | ||||||
|           name="lastname" |           name="lastname" | ||||||
|           id="last_name" |           id="last_name" | ||||||
|           autocomplete="off" |           autocomplete="off" | ||||||
|           :placeholder="[[$t('nachname')]]" |           :placeholder="[[$t('nachname')]]" | ||||||
|           type="text" |           type="text" | ||||||
|           :class="{ 'border-red-500': (!userdetails.lastname.trim()), 'border-green-300': (userdetails.lastname.trim()) }" |           :class="{ 'border-red-500': (!userdetails.lastname.trim()), 'border-green-300': (userdetails.lastname.trim()) }" | ||||||
|           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|         /> |         /> | ||||||
|         <!--  --> |         <!--  --> | ||||||
|         <label for="email_address" class="block font-medium"> |         <label for="email_address" class="block font-medium"> | ||||||
|           {{ $t('e_mail_adress') }} |           {{ $t('e_mail_adress') }} | ||||||
|           <span class="font-bold">*</span> |           <span class="font-bold">*</span> | ||||||
|         </label> |         </label> | ||||||
|         <input |         <input | ||||||
|           v-model="userdetails.mail" |           v-model="userdetails.mail" | ||||||
|           name="email_address" |           name="email_address" | ||||||
|           id="email_address" |           id="email_address" | ||||||
|           autocomplete="off" |           autocomplete="off" | ||||||
|           :placeholder="[[$t('e_mail_adress')]]" |           :placeholder="[[$t('e_mail_adress')]]" | ||||||
|           type="email" |           type="email" | ||||||
|           :class="{ 'border-red-500': (!isEmail(userdetails.mail)), 'border-green-300': (isEmail(userdetails.mail)) }" |           :class="{ 'border-red-500': (!isEmail(userdetails.mail)), 'border-green-300': (isEmail(userdetails.mail)) }" | ||||||
|           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-2 bg-gray-50 text-gray-500 rounded-md p-2" |           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|         /> |         /> | ||||||
|         <p v-if="!isEmail(userdetails.mail)" class="text-sm">{{ $t('please_provide_valid_mail') }}</p> |         <p v-if="!isEmail(userdetails.mail)" class="text-sm">{{ $t('please_provide_valid_mail') }}</p> | ||||||
|         <!--  --> |         <!--  --> | ||||||
|         <label for="phone" class="select-none block font-medium">{{ $t('phone_number') }}</label> |         <label for="phone" class="select-none block font-medium">{{ $t('phone_number') }}</label> | ||||||
|         <input |         <input | ||||||
|           v-model="userdetails.phone" |           v-model="userdetails.phone" | ||||||
|           name="phone" |           name="phone" | ||||||
|           id="phone" |           id="phone" | ||||||
|           autocomplete="off" |           autocomplete="off" | ||||||
|           :placeholder="[[$t('phone_number')]]" |           :placeholder="[[$t('phone_number')]]" | ||||||
|           type="text" |           type="text" | ||||||
|           :class="{ 'border-red-500': (!isMobilePhone(userdetails.phone) && userdetails.phone.trim()), 'border-green-300': (isMobilePhone(userdetails.phone) && userdetails.phone.trim()) }" |           :class="{ 'border-red-500': (!isMobilePhone(userdetails.phone) && userdetails.phone.trim()), 'border-green-300': (isMobilePhone(userdetails.phone) && userdetails.phone.trim()) }" | ||||||
|           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-2 bg-gray-50 text-gray-500 rounded-md p-2" |           class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|         /> |         /> | ||||||
|         <p |         <p | ||||||
|           v-if="(!isMobilePhone(userdetails.phone) && userdetails.phone.trim())" |           v-if="(!isMobilePhone(userdetails.phone) && userdetails.phone.trim())" | ||||||
|           class="text-sm" |           class="text-sm" | ||||||
|         >{{ $t('this_is_not_a_valid_international_phone_number') }}</p> |         >{{ $t('this_is_not_a_valid_international_phone_number') }}</p> | ||||||
|         <!--  --> |         <!--  --> | ||||||
|         <div class="grid grid-cols-6 mt-6"> |         <div class="grid grid-cols-6 mt-6"> | ||||||
|           <div class="col-span-6"></div> |           <div class="col-span-6"></div> | ||||||
|           <div class="flex items-start col-span-6"> |           <div class="flex items-start col-span-6"> | ||||||
|             <div class="flex items-center h-5"> |             <div class="flex items-center h-5"> | ||||||
|               <input |               <input | ||||||
|                 v-model="provide_address" |                 v-model="provide_address" | ||||||
|                 id="address_activated" |                 id="address_activated" | ||||||
|                 name="address_activated" |                 name="address_activated" | ||||||
|                 type="checkbox" |                 type="checkbox" | ||||||
|                 class="h-4 w-4 text-indigo-600 border-gray-300 rounded" |                 class="h-4 w-4 text-indigo-600 border-gray-300 rounded" | ||||||
|               /> |               /> | ||||||
|             </div> |             </div> | ||||||
|             <div class="ml-3 text-sm"> |             <div class="ml-3 text-sm"> | ||||||
|               <label |               <label | ||||||
|                 for="address_activated" |                 for="address_activated" | ||||||
|                 class="font-medium text-gray-400 select-none" |                 class="font-medium text-gray-400 select-none" | ||||||
|               >{{ $t('provide_address') }}</label> |               >{{ $t('provide_address') }}</label> | ||||||
|             </div> |             </div> | ||||||
|           </div> |           </div> | ||||||
|           <div v-if="provide_address === true" class="col-span-6"> |           <div v-if="provide_address === true" class="col-span-6"> | ||||||
|             <div class="col-span-6"> |             <div class="col-span-6"> | ||||||
|               <label for="street" class="block font-medium"> |               <label for="street" class="block font-medium"> | ||||||
|                 {{ $t('strasse') }} |                 {{ $t('strasse') }} | ||||||
|                 <span class="font-bold">*</span> |                 <span class="font-bold">*</span> | ||||||
|               </label> |               </label> | ||||||
|               <input |               <input | ||||||
|                 v-model="userdetails.address.street" |                 v-model="userdetails.address.street" | ||||||
|                 type="text" |                 type="text" | ||||||
|                 name="street" |                 name="street" | ||||||
|                 :placeholder="[[$t('strasse')]]" |                 :placeholder="[[$t('strasse')]]" | ||||||
|                 id="street" |                 id="street" | ||||||
|                 autocomplete="street-address" |                 autocomplete="street-address" | ||||||
|                 :class="{ 'border-red-500': (!userdetails.address.street.trim()), 'border-green-300': (userdetails.address.street.trim()) }" |                 :class="{ 'border-red-500': (!userdetails.address.street.trim()), 'border-green-300': (userdetails.address.street.trim()) }" | ||||||
|                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|               /> |               /> | ||||||
|             </div> |             </div> | ||||||
|             <div class="col-span-6"> |             <div class="col-span-6"> | ||||||
|               <label for="address2" class="block font-medium">{{ $t('apartment_suite_etc') }}</label> |               <label for="address2" class="block font-medium">{{ $t('apartment_suite_etc') }}</label> | ||||||
|               <input |               <input | ||||||
|                 v-model="userdetails.address.address2" |                 v-model="userdetails.address.address2" | ||||||
|                 type="text" |                 type="text" | ||||||
|                 name="address2" |                 name="address2" | ||||||
|                 :placeholder="[[$t('apartment_suite_etc')]]" |                 :placeholder="[[$t('apartment_suite_etc')]]" | ||||||
|                 id="address2" |                 id="address2" | ||||||
|                 autocomplete="street-address" |                 autocomplete="street-address" | ||||||
|                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|               /> |               /> | ||||||
|             </div> |             </div> | ||||||
|             <div class="col-span-6 sm:col-span-6 lg:col-span-2"> |             <div class="col-span-6 sm:col-span-6 lg:col-span-2"> | ||||||
|               <label for="city" class="block font-medium"> |               <label for="city" class="block font-medium"> | ||||||
|                 {{ $t('ort') }} |                 {{ $t('ort') }} | ||||||
|                 <span class="font-bold">*</span> |                 <span class="font-bold">*</span> | ||||||
|               </label> |               </label> | ||||||
|               <input |               <input | ||||||
|                 v-model="userdetails.address.city" |                 v-model="userdetails.address.city" | ||||||
|                 type="text" |                 type="text" | ||||||
|                 name="city" |                 name="city" | ||||||
|                 :placeholder="[[$t('ort')]]" |                 :placeholder="[[$t('ort')]]" | ||||||
|                 id="city" |                 id="city" | ||||||
|                 :class="{ 'border-red-500': (!userdetails.address.city.trim()), 'border-green-300': (userdetails.address.city.trim()) }" |                 :class="{ 'border-red-500': (!userdetails.address.city.trim()), 'border-green-300': (userdetails.address.city.trim()) }" | ||||||
|                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|               /> |               /> | ||||||
|             </div> |             </div> | ||||||
|             <div class="col-span-6 sm:col-span-3 lg:col-span-2"> |             <div class="col-span-6 sm:col-span-3 lg:col-span-2"> | ||||||
|               <label for="postal_code" class="block font-medium"> |               <label for="postal_code" class="block font-medium"> | ||||||
|                 {{ $t('plz') }} |                 {{ $t('plz') }} | ||||||
|                 <span class="font-bold">*</span> |                 <span class="font-bold">*</span> | ||||||
|               </label> |               </label> | ||||||
|               <input |               <input | ||||||
|                 v-model="userdetails.address.zipcode" |                 v-model="userdetails.address.zipcode" | ||||||
|                 type="text" |                 type="text" | ||||||
|                 name="postal_code" |                 name="postal_code" | ||||||
|                 :placeholder="[[$t('plz')]]" |                 :placeholder="[[$t('plz')]]" | ||||||
|                 id="postal_code" |                 id="postal_code" | ||||||
|                 autocomplete="postal-code" |                 autocomplete="postal-code" | ||||||
|                 :class="{ 'border-red-500': (!isPostalCode(userdetails.address.zipcode, 'DE')), 'border-green-300': (isPostalCode(userdetails.address.zipcode, 'DE')) }" |                 :class="{ 'border-red-500': (!isPostalCode(userdetails.address.zipcode, 'DE')), 'border-green-300': (isPostalCode(userdetails.address.zipcode, 'DE')) }" | ||||||
|                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" |                 class="dark:bg-gray-800 mt-1 block w-full shadow-sm sm:text-sm border-gray-300 border-2 bg-gray-50 text-gray-500 rounded-md p-2" | ||||||
|               /> |               /> | ||||||
|             </div> |             </div> | ||||||
|             <p |             <p | ||||||
|               v-if="!isPostalCode(userdetails.address.zipcode, 'DE')" |               v-if="!isPostalCode(userdetails.address.zipcode, 'DE')" | ||||||
|               class="text-sm" |               class="text-sm" | ||||||
|             >{{ $t('please_provide_a_valid_zipcode') }}</p> |             >{{ $t('please_provide_a_valid_zipcode') }}</p> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
|         <div class="flex items-start mt-6"> |         <div class="flex items-start mt-6"> | ||||||
|           <div class="flex items-center h-5"> |           <div class="flex items-center h-5"> | ||||||
|             <input |             <input | ||||||
|               v-model="agb_accepted" |               v-model="agb_accepted" | ||||||
|               id="agb_accepted" |               id="agb_accepted" | ||||||
|               name="agb_accepted" |               name="agb_accepted" | ||||||
|               type="checkbox" |               type="checkbox" | ||||||
|               class="h-4 w-4 text-indigo-600 border-gray-300 rounded" |               class="h-4 w-4 text-indigo-600 border-gray-300 rounded" | ||||||
|             /> |             /> | ||||||
|           </div> |           </div> | ||||||
|           <div class="ml-3 text-sm"> |           <div class="ml-3 text-sm"> | ||||||
|             <label for="agb_accepted" class="font-medium text-gray-400 select-none"> |             <label for="agb_accepted" class="font-medium text-gray-400 select-none"> | ||||||
|               {{ $t('i_accept', { tos: $t('tos') }) }} |               {{ $t('i_accept', { tos: $t('tos') }) }} | ||||||
|               <a |               <a | ||||||
|                 target="_blank" |                 target="_blank" | ||||||
|                 rel="noreferrer,noopener" |                 rel="noreferrer,noopener" | ||||||
|                 href |                 href="https://lauf-fuer-kaya.de/datenschutz/" | ||||||
|                 class="underline" |                 class="underline" | ||||||
|               >{{ $t('tos') }}</a> |               >{{ $t('tos') }}</a> | ||||||
|               {{ $t('i_accept_end') }} |               {{ $t('i_accept_end') }} | ||||||
|               <span class="font-bold">*</span> |               <span class="font-bold">*</span> | ||||||
|             </label> |             </label> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
|         <div class="flex items-start mt-6"> |         <div class="flex items-start mt-6"> | ||||||
|           <div class="flex items-center h-5"> |           <div class="flex items-center h-5"> | ||||||
|             <input |             <input | ||||||
|               v-model="data_confirmed" |               v-model="data_confirmed" | ||||||
|               id="data_confirmed" |               id="data_confirmed" | ||||||
|               name="data_confirmed" |               name="data_confirmed" | ||||||
|               type="checkbox" |               type="checkbox" | ||||||
|               class="h-4 w-4 text-indigo-600 border-gray-300 rounded" |               class="h-4 w-4 text-indigo-600 border-gray-300 rounded" | ||||||
|             /> |             /> | ||||||
|           </div> |           </div> | ||||||
|           <div class="ml-3 text-sm"> |           <div class="ml-3 text-sm"> | ||||||
|             <label for="data_confirmed" class="font-medium text-gray-400 select-none"> |             <label for="data_confirmed" class="font-medium text-gray-400 select-none"> | ||||||
|               {{ $t('confirm_personal_data') }} |               {{ $t('confirm_personal_data') }} | ||||||
|               <span class="font-bold">*</span> |               <span class="font-bold">*</span> | ||||||
|             </label> |             </label> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
|         <div class="mt-6"> |         <div class="mt-6"> | ||||||
|           <button |           <button | ||||||
|             @click="login" |             @click="login" | ||||||
|             :disabled="(!state.submit_enabled)" |             :disabled="(!state.submit_enabled)" | ||||||
|             :class="{ 'opacity-50': (!state.submit_enabled), 'cursor-not-allowed': (!state.submit_enabled) }" |             :class="{ 'opacity-50': (!state.submit_enabled), 'cursor-not-allowed': (!state.submit_enabled) }" | ||||||
|             class="text-white block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 bg-blue-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" |             class="text-white block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 bg-blue-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" | ||||||
|           >{{ $t('registrieren') }}</button> |           >{{ $t('registrieren') }}</button> | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|       <div class="mt-6"> |     </div> | ||||||
|         <div class="relative"> |   </div> | ||||||
|           <div class="absolute inset-0 flex items-center"> | </template> | ||||||
|             <div class="w-full border-t border-gray-300"></div> |  | ||||||
|           </div> | <script setup> | ||||||
|           <div class="relative flex justify-center text-sm"> | import { computed, ref, reactive, defineProps } from "vue"; | ||||||
|             <span class="px-2 bg-white dark:bg-gray-900">{{ $t('already_have_an_account') }}</span> | import axios from "redaxios"; | ||||||
|           </div> | import isEmail from 'validator/es/lib/isEmail'; | ||||||
|         </div> | import isMobilePhone from 'validator/es/lib/isMobilePhone'; | ||||||
|         <div class="mt-6"> | import isPostalCode from 'validator/es/lib/isPostalCode'; | ||||||
|           <a | import { useToast } from "vue-toastification"; | ||||||
|             href="./login" |  | ||||||
|             class="block w-full text-center py-2 px-3 border-2 border-gray-300 rounded-md p-1 dark:bg-gray-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm" | const props = defineProps({ | ||||||
|           >{{ $t('go_to_login') }}</a> |   token: String | ||||||
|         </div> | }) | ||||||
|       </div> | if (props.token) { | ||||||
|     </div> |   axios.get(`${config.baseurl}api/organizations/selfservice/${props.token}`) | ||||||
|   </div> |     .then(({ data }) => { | ||||||
| </template> |       state.org_name = data.name; | ||||||
|  |       state.org_teams = data.teams; | ||||||
| <script setup> |       org_team.value = data.teams[0]?.id; | ||||||
| import { computed, ref, reactive, defineProps } from "vue"; |     }) | ||||||
| import axios from "redaxios"; |     .catch((error) => { | ||||||
| import isEmail from 'validator/es/lib/isEmail'; |       console.log(error); | ||||||
| import isMobilePhone from 'validator/es/lib/isMobilePhone'; |     }); | ||||||
| import isPostalCode from 'validator/es/lib/isPostalCode'; | } | ||||||
| import { useToast } from "vue-toastification"; |  | ||||||
|  | let userdetails = ref({ firstname: "", lastname: "", middlename: "", mail: "", phone: "", address: { street: "", address2: "", city: "", zipcode: "" } }); | ||||||
| const props = defineProps({ | let provide_address = ref(false); | ||||||
|   token: String | let agb_accepted = ref(false); | ||||||
| }) | let data_confirmed = ref(false); | ||||||
| if (props.token) { | let org_team = ref(""); | ||||||
|   axios.get(`${config.baseurl}api/organizations/selfservice/${props.token}`) | //  | ||||||
|     .then(({ data }) => { | const state = reactive({ | ||||||
|       state.org_name = data.name; |   org_name: "", | ||||||
|       state.org_teams = data.teams; |   org_teams: [], | ||||||
|       org_team.value = data.teams[0]?.id; |   submit_enabled: computed(() => agb_accepted.value === true && data_confirmed.value === true && (isMobilePhone(userdetails.value.phone) || !userdetails.value.phone.trim()) && isEmail(userdetails.value.mail) | ||||||
|     }) |     && userdetails.value.firstname | ||||||
|     .catch((error) => { |     && userdetails.value.lastname && (provide_address.value === false || provide_address.value === true && (userdetails.value.address.street.trim() && userdetails.value.address.city.trim() && isPostalCode(userdetails.value.address.zipcode, "DE")))) | ||||||
|       console.log(error); | }) | ||||||
|     }); | const toast = useToast(); | ||||||
| } | function login() { | ||||||
|  |   userdetails = userdetails.value; | ||||||
| let userdetails = ref({ firstname: "", lastname: "", middlename: "", mail: "", phone: "", address: { street: "", address2: "", city: "", zipcode: "" } }); |   if (userdetails?.phone === "" || isMobilePhone(userdetails.phone)) { | ||||||
| let provide_address = ref(false); |     if (isEmail(userdetails.mail)) { | ||||||
| let agb_accepted = ref(false); |       let postdata = { | ||||||
| let data_confirmed = ref(false); |         "email": userdetails.mail, | ||||||
| let org_team = ref(""); |         "firstname": userdetails.firstname, | ||||||
| //  |         "middlename": userdetails.middlename, | ||||||
| const state = reactive({ |         "lastname": userdetails.lastname, | ||||||
|   org_name: "", |         "address": {} | ||||||
|   org_teams: [], |       } | ||||||
|   submit_enabled: computed(() => agb_accepted.value === true && data_confirmed.value === true && (isMobilePhone(userdetails.value.phone) || !userdetails.value.phone.trim()) && isEmail(userdetails.value.mail) |       if (isMobilePhone(userdetails.phone)) { | ||||||
|     && userdetails.value.firstname |         postdata.phone = userdetails.phone; | ||||||
|     && userdetails.value.lastname && (provide_address.value === false || provide_address.value === true && (userdetails.value.address.street.trim() && userdetails.value.address.city.trim() && isPostalCode(userdetails.value.address.zipcode, "DE")))) |       } | ||||||
| }) |       if (provide_address.value === true) { | ||||||
| const toast = useToast(); |         postdata.address = { | ||||||
| function login() { |           address1: userdetails.address.street, | ||||||
|   userdetails = userdetails.value; |           address2: userdetails.address.address2 || "", | ||||||
|   if (userdetails.phone === "" || isMobilePhone(userdetails.phone)) { |           city: userdetails.address.city, | ||||||
|     if (isEmail(userdetails.mail)) { |           postalcode: userdetails.address.zipcode, | ||||||
|       let postdata = { |           country: "DE", | ||||||
|         "email": userdetails.mail, |         } | ||||||
|         "firstname": userdetails.firstname, |       } | ||||||
|         "middlename": userdetails.middlename, |       if (state.org_name !== '' && state.org_teams.length > 0) { | ||||||
|         "lastname": userdetails.lastname, |         postdata.team = org_team.value; | ||||||
|         "address": {} |       } | ||||||
|       } |       toast("Registrierung läuft..."); | ||||||
|       if (isMobilePhone(userdetails.phone)) { |       const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2); | ||||||
|         postdata.phone = userdetails.phone; |       let url = `${config.baseurl}api/runners/register/?locale=${browserlocale}`; | ||||||
|       } |       if (props.token) { | ||||||
|       if (provide_address.value === true) { |         url = `${config.baseurl}api/runners/register/${props.token}/?locale=${browserlocale}` | ||||||
|         postdata.address = { |       } | ||||||
|           address1: userdetails.address.street, |       axios.post(url, postdata) | ||||||
|           address2: userdetails.address.address2 || "", |         .then(({ data }) => { | ||||||
|           city: userdetails.address.city, |           const token = btoa(data.token); | ||||||
|           postalcode: userdetails.address.zipcode, |           // alert(token); | ||||||
|           country: "DE", |           location.replace(`${config.baseurl_selfservice}profile/${token}`); | ||||||
|         } |         }) | ||||||
|       } |         .catch((error) => { | ||||||
|       if (state.org_name !== '' && state.org_teams.length > 0) { |           console.log(error); | ||||||
|         postdata.team = org_team.value; |         }); | ||||||
|       } |     } | ||||||
|       toast("registration in progress..."); |   } | ||||||
|       const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2); | } | ||||||
|       let url = `${config.baseurl}api/runners/register/?locale=${browserlocale}`; |  | ||||||
|       if (props.token) { |  | ||||||
|         url = `${config.baseurl}api/runners/register/${props.token}/?locale=${browserlocale}` |  | ||||||
|       } |  | ||||||
|       axios.post(url, postdata) |  | ||||||
|         .then(({ data }) => { |  | ||||||
|           const token = btoa(data.token); |  | ||||||
|           // alert(token); |  | ||||||
|           location.replace(`${config.baseurl_selfservice}profile/${token}`); |  | ||||||
|         }) |  | ||||||
|         .catch((error) => { |  | ||||||
|           console.log(error); |  | ||||||
|         }); |  | ||||||
|     } |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| </script> | </script> | ||||||
		Reference in New Issue
	
	Block a user