Compare commits
1 Commits
main
...
feature/#2
Author | SHA1 | Date | |
---|---|---|---|
|
350e09cf24 |
@ -1,11 +1,2 @@
|
|||||||
.browserslistrc
|
|
||||||
.dockerignore
|
|
||||||
.drone.yml
|
|
||||||
.editorconfig
|
|
||||||
.git
|
.git
|
||||||
.gitignore
|
|
||||||
.reuse
|
|
||||||
Dockerfile
|
|
||||||
LICENSES
|
|
||||||
README.md
|
|
||||||
node_modules
|
node_modules
|
||||||
|
130
.drone.yml
130
.drone.yml
@ -4,118 +4,22 @@
|
|||||||
# SPDX-License-Identifier: AGPL-3.0-or-later
|
# SPDX-License-Identifier: AGPL-3.0-or-later
|
||||||
kind: pipeline
|
kind: pipeline
|
||||||
type: docker
|
type: docker
|
||||||
name: qa
|
name: default
|
||||||
|
|
||||||
trigger:
|
|
||||||
event:
|
|
||||||
- push
|
|
||||||
- pull_request
|
|
||||||
branch:
|
|
||||||
- main
|
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
- name: reuse
|
- name: reuse
|
||||||
image: fsfe/reuse:5.0.2-debian@sha256:7928d25ed14a1bc22758d917ebc6aecbb8bcd1a4da7aa748d7179c9011bbfb0b
|
image: fsfe/reuse:latest
|
||||||
- name: lint
|
- name: docker-publish
|
||||||
image: node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9
|
image: plugins/docker
|
||||||
commands:
|
settings:
|
||||||
- npm ci
|
registry: registry.wtf-eg.net
|
||||||
- npm run lint -- --no-fix
|
repo: registry.wtf-eg.net/ki-frontend
|
||||||
- name: audit
|
target: ki-frontend
|
||||||
image: node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9
|
auto_tag: true
|
||||||
commands:
|
username:
|
||||||
- npm install -g better-npm-audit
|
from_secret: "docker_username"
|
||||||
- better-npm-audit audit --production --level=moderate
|
password:
|
||||||
- name: docker-dry-run
|
from_secret: "docker_password"
|
||||||
image: plugins/docker:20.18.4@sha256:a8d3d86853c721492213264815f1d00d3ed13f42f5c1855a02f47fa4d5f1e042
|
when:
|
||||||
settings:
|
branch:
|
||||||
registry: git.wtf-eg.de
|
- main
|
||||||
repo: git.wtf-eg.de/kompetenzinventar/frontend
|
|
||||||
target: ki-frontend
|
|
||||||
dry_run: true
|
|
||||||
when:
|
|
||||||
event:
|
|
||||||
- pull_request
|
|
||||||
|
|
||||||
---
|
|
||||||
kind: pipeline
|
|
||||||
type: docker
|
|
||||||
name: build
|
|
||||||
|
|
||||||
trigger:
|
|
||||||
event:
|
|
||||||
- push
|
|
||||||
branch:
|
|
||||||
- main
|
|
||||||
|
|
||||||
depends_on:
|
|
||||||
- qa
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: docker-publish
|
|
||||||
image: plugins/docker:20.18.4@sha256:a8d3d86853c721492213264815f1d00d3ed13f42f5c1855a02f47fa4d5f1e042
|
|
||||||
settings:
|
|
||||||
registry: git.wtf-eg.de
|
|
||||||
repo: git.wtf-eg.de/kompetenzinventar/frontend
|
|
||||||
target: ki-frontend
|
|
||||||
auto_tag: true
|
|
||||||
username:
|
|
||||||
from_secret: "docker_username"
|
|
||||||
password:
|
|
||||||
from_secret: "docker_password"
|
|
||||||
|
|
||||||
---
|
|
||||||
kind: pipeline
|
|
||||||
type: docker
|
|
||||||
name: deploy
|
|
||||||
|
|
||||||
trigger:
|
|
||||||
event:
|
|
||||||
- push
|
|
||||||
branch:
|
|
||||||
- main
|
|
||||||
|
|
||||||
depends_on:
|
|
||||||
- build
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: deploy-dev
|
|
||||||
image: appleboy/drone-ssh:1.7.5@sha256:995677e073454912f26d4c0fdd2f9df2e1f5a30d6603d3f2ece667311b6babb3
|
|
||||||
settings:
|
|
||||||
host:
|
|
||||||
- dev01.wtf-eg.net
|
|
||||||
username: drone_deployment
|
|
||||||
key:
|
|
||||||
from_secret: "dev01_deployment_key"
|
|
||||||
command_timeout: 2m
|
|
||||||
script:
|
|
||||||
- echo "Executing forced command..."
|
|
||||||
|
|
||||||
---
|
|
||||||
kind: pipeline
|
|
||||||
type: docker
|
|
||||||
name: tag-release
|
|
||||||
|
|
||||||
trigger:
|
|
||||||
event:
|
|
||||||
- tag
|
|
||||||
|
|
||||||
steps:
|
|
||||||
- name: reuse
|
|
||||||
image: fsfe/reuse:5.0.2-debian@sha256:7928d25ed14a1bc22758d917ebc6aecbb8bcd1a4da7aa748d7179c9011bbfb0b
|
|
||||||
- name: lint
|
|
||||||
image: node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9
|
|
||||||
commands:
|
|
||||||
- npm ci
|
|
||||||
- npm run lint -- --no-fix
|
|
||||||
- name: docker-publish
|
|
||||||
image: plugins/docker:20.18.4@sha256:a8d3d86853c721492213264815f1d00d3ed13f42f5c1855a02f47fa4d5f1e042
|
|
||||||
settings:
|
|
||||||
registry: git.wtf-eg.de
|
|
||||||
repo: git.wtf-eg.de/kompetenzinventar/frontend
|
|
||||||
target: ki-frontend
|
|
||||||
auto_tag: true
|
|
||||||
username:
|
|
||||||
from_secret: "docker_username"
|
|
||||||
password:
|
|
||||||
from_secret: "docker_password"
|
|
||||||
|
@ -8,13 +8,10 @@ module.exports = {
|
|||||||
'eslint:recommended'
|
'eslint:recommended'
|
||||||
],
|
],
|
||||||
parserOptions: {
|
parserOptions: {
|
||||||
parser: '@babel/eslint-parser'
|
parser: 'babel-eslint'
|
||||||
},
|
},
|
||||||
rules: {
|
rules: {
|
||||||
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
||||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
|
||||||
'vue/multi-word-component-names': 'off',
|
|
||||||
'vue/no-useless-template-attributes': 'off',
|
|
||||||
'vue/no-reserved-component-names': 'off'
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
28
.reuse/dep5
Normal file
28
.reuse/dep5
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
Format: https://www.debian.org/doc/packaging-manuals/copyright-format/1.0/
|
||||||
|
Upstream-Name: ki-frontend
|
||||||
|
Upstream-Contact: Scammo <kontakt@samuelbrinkmann.de>
|
||||||
|
Source: https://git.wtf-eg.de/kompetenzinventar/ki-frontend
|
||||||
|
|
||||||
|
Files: package.json package-lock.json
|
||||||
|
Copyright: WTF Kooperative eG <https://wtf-eg.de/>
|
||||||
|
License: AGPL-3.0-or-later
|
||||||
|
|
||||||
|
Files: .browserslistrc .dockerignore .eslintrc.js .gitignore
|
||||||
|
Copyright: WTF Kooperative eG <https://wtf-eg.de/>
|
||||||
|
License: AGPL-3.0-or-later
|
||||||
|
|
||||||
|
Files: src/assets/img/wtf*
|
||||||
|
Copyright: WTF Kooperative eG <https://wtf-eg.de/>
|
||||||
|
License: LicenseRef-WTF
|
||||||
|
|
||||||
|
Files: src/assets/language_level.json src/assets/skill_level.json
|
||||||
|
Copyright: WTF Kooperative eG <https://wtf-eg.de/>
|
||||||
|
License: AGPL-3.0-or-later
|
||||||
|
|
||||||
|
Files: public/img/bootstrap-icons-1.5.0/*
|
||||||
|
Copyright: Copyright (c) 2019-2020 The Bootstrap Authors
|
||||||
|
License: MIT
|
||||||
|
|
||||||
|
Files: public/fonts/Lato*
|
||||||
|
Copyright: 2010-2015, Łukasz Dziedzic (dziedzic@typoland.com)
|
||||||
|
License: OFL-1.1-RFN
|
21
Dockerfile
21
Dockerfile
@ -2,27 +2,14 @@
|
|||||||
#
|
#
|
||||||
# SPDX-License-Identifier: AGPL-3.0-or-later
|
# SPDX-License-Identifier: AGPL-3.0-or-later
|
||||||
|
|
||||||
FROM node:20.18.0-alpine@sha256:c13b26e7e602ef2f1074aef304ce6e9b7dd284c419b35d89fcf3cc8e44a8def9 as builder
|
FROM node:14-alpine as builder
|
||||||
|
|
||||||
COPY package.json package-lock.json ./
|
COPY . ./
|
||||||
RUN npm install
|
|
||||||
|
|
||||||
COPY .eslintrc.js .
|
|
||||||
COPY babel.config.js .
|
|
||||||
COPY public public
|
|
||||||
COPY src src
|
|
||||||
|
|
||||||
RUN npm ci && npm run build
|
RUN npm ci && npm run build
|
||||||
|
|
||||||
|
|
||||||
FROM nginx:1.27-alpine@sha256:2140dad235c130ac861018a4e13a6bc8aea3a35f3a40e20c1b060d51a7efd250 as ki-frontend
|
FROM nginx as ki-frontend
|
||||||
|
|
||||||
LABEL org.opencontainers.image.source=https://git.wtf-eg.de/kompetenzinventar/ki-frontend.git
|
|
||||||
LABEL org.opencontainers.image.url=https://git.wtf-eg.de/kompetenzinventar/ki-frontend
|
|
||||||
LABEL org.opencontainers.image.documentation=https://git.wtf-eg.de/kompetenzinventar/ki-frontend#docker
|
|
||||||
LABEL org.opencontainers.image.vendor="WTF Kooperative eG"
|
|
||||||
|
|
||||||
WORKDIR /usr/share/nginx/html
|
|
||||||
|
|
||||||
|
COPY --from=builder /dist/ /usr/share/nginx/html/
|
||||||
COPY etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
|
COPY etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf
|
||||||
COPY --from=builder /dist .
|
|
||||||
|
@ -41,14 +41,6 @@ Folgende Kanäle gibt es für die Kommunikation über das Kompetenzinventar:
|
|||||||
npm ci
|
npm ci
|
||||||
```
|
```
|
||||||
|
|
||||||
### Pre requirements
|
|
||||||
|
|
||||||
* Node 20
|
|
||||||
* Wenn du eine andere node version installiert hast, kannst du [nvm](https://github.com/nvm-sh/nvm) benutzen um schnell zwischen node version zu wechseln
|
|
||||||
* NPM
|
|
||||||
* (KI-backend)[https://git.wtf-eg.de/kompetenzinventar/ki-backend] muss lokal laufen
|
|
||||||
|
|
||||||
|
|
||||||
### Konfigurationsdatei anpassen
|
### Konfigurationsdatei anpassen
|
||||||
|
|
||||||
```
|
```
|
||||||
@ -56,6 +48,7 @@ cp public/config.js.dev public/config.js
|
|||||||
vi public/config.js
|
vi public/config.js
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
### Compiles and hot-reloads for development
|
### Compiles and hot-reloads for development
|
||||||
```
|
```
|
||||||
npm run serve
|
npm run serve
|
||||||
|
40
REUSE.toml
40
REUSE.toml
@ -1,40 +0,0 @@
|
|||||||
version = 1
|
|
||||||
SPDX-PackageName = "ki-frontend"
|
|
||||||
SPDX-PackageSupplier = "Scammo <kontakt@samuelbrinkmann.de>"
|
|
||||||
SPDX-PackageDownloadLocation = "https://git.wtf-eg.de/kompetenzinventar/ki-frontend"
|
|
||||||
|
|
||||||
[[annotations]]
|
|
||||||
path = ["package.json", "package-lock.json", "renovate.json"]
|
|
||||||
precedence = "aggregate"
|
|
||||||
SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
|
|
||||||
SPDX-License-Identifier = "AGPL-3.0-or-later"
|
|
||||||
|
|
||||||
[[annotations]]
|
|
||||||
path = [".browserslistrc", ".dockerignore", ".eslintrc.js", ".gitignore", "REUSE.toml"]
|
|
||||||
precedence = "aggregate"
|
|
||||||
SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
|
|
||||||
SPDX-License-Identifier = "AGPL-3.0-or-later"
|
|
||||||
|
|
||||||
[[annotations]]
|
|
||||||
path = "src/assets/img/wtf**"
|
|
||||||
precedence = "aggregate"
|
|
||||||
SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
|
|
||||||
SPDX-License-Identifier = "LicenseRef-WTF"
|
|
||||||
|
|
||||||
[[annotations]]
|
|
||||||
path = ["src/assets/language_level.json", "src/assets/skill_level.json"]
|
|
||||||
precedence = "aggregate"
|
|
||||||
SPDX-FileCopyrightText = "WTF Kooperative eG <https://wtf-eg.de/>"
|
|
||||||
SPDX-License-Identifier = "AGPL-3.0-or-later"
|
|
||||||
|
|
||||||
[[annotations]]
|
|
||||||
path = "public/img/bootstrap-icons-1.5.0/**"
|
|
||||||
precedence = "aggregate"
|
|
||||||
SPDX-FileCopyrightText = "Copyright (c) 2019-2020 The Bootstrap Authors"
|
|
||||||
SPDX-License-Identifier = "MIT"
|
|
||||||
|
|
||||||
[[annotations]]
|
|
||||||
path = "public/fonts/Lato**"
|
|
||||||
precedence = "aggregate"
|
|
||||||
SPDX-FileCopyrightText = "2010-2015, Łukasz Dziedzic (dziedzic@typoland.com)"
|
|
||||||
SPDX-License-Identifier = "OFL-1.1-RFN"
|
|
@ -9,24 +9,10 @@ server {
|
|||||||
|
|
||||||
#access_log /var/log/nginx/host.access.log main;
|
#access_log /var/log/nginx/host.access.log main;
|
||||||
|
|
||||||
root /usr/share/nginx/html;
|
|
||||||
|
|
||||||
# routes without dots serve the index.html without caching
|
|
||||||
location / {
|
location / {
|
||||||
add_header Cache-Control "no-cache";
|
root /usr/share/nginx/html;
|
||||||
try_files $uri $uri/index.html /index.html;
|
index index.html index.htm;
|
||||||
}
|
try_files $uri $uri/ /index.html;
|
||||||
|
|
||||||
# static js and css files that get replaced instead of updated
|
|
||||||
location ~ \.(js|css) {
|
|
||||||
add_header Cache-Control "public, max-age=31536000, immutable";
|
|
||||||
try_files $uri =404;
|
|
||||||
}
|
|
||||||
|
|
||||||
# cache other static files for 30 days
|
|
||||||
location ~ \.(?!html) {
|
|
||||||
add_header Cache-Control "public, max-age=2592000";
|
|
||||||
try_files $uri =404;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#error_page 404 /404.html;
|
#error_page 404 /404.html;
|
||||||
|
31749
package-lock.json
generated
31749
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
39
package.json
39
package.json
@ -1,31 +1,28 @@
|
|||||||
{
|
{
|
||||||
"name": "@wtf/ki-frontend",
|
"name": "@wtf/ki-frontend",
|
||||||
"version": "1.1.0",
|
"version": "0.1.0",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve",
|
"serve": "vue-cli-service serve",
|
||||||
"build": "vue-cli-service build",
|
"build": "vue-cli-service build",
|
||||||
"lint": "vue-cli-service lint"
|
"lint": "vue-cli-service lint"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/eslint-parser": "7.25.9",
|
"@vue/cli-plugin-babel": "~4.5.0",
|
||||||
"@vue/cli-plugin-babel": "5.0.8",
|
"@vue/cli-plugin-eslint": "~4.5.0",
|
||||||
"@vue/cli-plugin-eslint": "5.0.8",
|
"@vue/cli-plugin-router": "~4.5.0",
|
||||||
"@vue/cli-plugin-router": "5.0.8",
|
"@vue/cli-service": "~4.5.0",
|
||||||
"@vue/cli-service": "5.0.8",
|
"@vue/compiler-sfc": "^3.0.0",
|
||||||
"@vue/compiler-sfc": "3.5.6",
|
"babel-eslint": "^10.1.0",
|
||||||
"bootstrap": "5.3.3",
|
"bootstrap": "^5.0.1",
|
||||||
"bootstrap-icons": "1.11.3",
|
"bootstrap-icons": "^1.5.0",
|
||||||
"core-js": "3.39.0",
|
"core-js": "^3.6.5",
|
||||||
"eslint": "8.57.1",
|
"eslint": "^6.7.2",
|
||||||
"eslint-plugin-vue": "9.30.0",
|
"eslint-plugin-vue": "^7.0.0",
|
||||||
"sass": "1.80.4",
|
"sass": "^1.37.5",
|
||||||
"sass-loader": "16.0.3",
|
"sass-loader": "^10.2.0",
|
||||||
"v-tooltip": "4.0.0-beta.17",
|
"v-tooltip": "^4.0.0-alpha.1",
|
||||||
"vue": "3.5.6",
|
"vue": "^3.0.0",
|
||||||
"vue-router": "4.4.5",
|
"vue-router": "^4.0.0-0",
|
||||||
"vuex": "4.1.0"
|
"vuex": "^4.0.2"
|
||||||
},
|
|
||||||
"optionalDependencies": {
|
|
||||||
"sass-embedded": "1.80.4"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,21 +0,0 @@
|
|||||||
{
|
|
||||||
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
|
|
||||||
"extends": [
|
|
||||||
"config:best-practices",
|
|
||||||
"group:linters",
|
|
||||||
"group:test",
|
|
||||||
"npm:unpublishSafe",
|
|
||||||
":disableDependencyDashboard",
|
|
||||||
":maintainLockFilesWeekly",
|
|
||||||
":pinAllExceptPeerDependencies",
|
|
||||||
":separateMultipleMajorReleases"
|
|
||||||
],
|
|
||||||
"packageRules": [
|
|
||||||
{
|
|
||||||
"matchPackageNames": [
|
|
||||||
"node"
|
|
||||||
],
|
|
||||||
"allowedVersions": "/^[1-9][02468]\\./"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
@ -14,7 +14,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
@update-values="this.$emit('update-values', this.values)"
|
@update-values="this.$emit('update-values', this.values)"
|
||||||
>
|
>
|
||||||
</profile-list>
|
</profile-list>
|
||||||
<div v-bind="$attrs" class="card-body bg-white">
|
<div v-bind="$attrs" class="card-body">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-12 col-md-4 col-lg-3 col-xl-2">
|
<div class="col-12 col-md-4 col-lg-3 col-xl-2">
|
||||||
<div class="form-control-plaintext form-control-sm">Eintrag hinzufügen:</div>
|
<div class="form-control-plaintext form-control-sm">Eintrag hinzufügen:</div>
|
||||||
@ -34,7 +34,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<div v-if="searchResults">
|
<div v-if="searchResults">
|
||||||
<ul class="list-group">
|
<ul class="list-group">
|
||||||
<li
|
<li
|
||||||
class="list-group-item bg-white"
|
class="list-group-item"
|
||||||
v-for="result in searchResults"
|
v-for="result in searchResults"
|
||||||
:key="result.id"
|
:key="result.id"
|
||||||
@click="addResult(result)"
|
@click="addResult(result)"
|
||||||
|
@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<div class="fw-bold text-white mb-2">Kompetenzinventar</div>
|
<div class="fw-bold text-white mb-2">Kompetenzinventar</div>
|
||||||
<ul class="list-unstyled">
|
<ul class="list-unstyled">
|
||||||
<li><a href="https://git.wtf-eg.de/kompetenzinventar">Quellcode</a></li>
|
<li><a href="https://git.wtf-eg.de/kompetenzinventar">Quellcode</a></li>
|
||||||
<li><a href="https://git.wtf-eg.de/kompetenzinventar/ki-doku/issues/new/choose">Problem melden</a></li>
|
<li><a href="https://git.wtf-eg.de/kompetenzinventar/ki-frontend/issues/new">Problem melden</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,50 +0,0 @@
|
|||||||
<!--
|
|
||||||
SPDX-FileCopyrightText: WTF Kooperative eG <https://wtf-eg.de/>
|
|
||||||
|
|
||||||
SPDX-License-Identifier: AGPL-3.0-or-later
|
|
||||||
-->
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<ul class="pagination">
|
|
||||||
<li
|
|
||||||
class="page-item"
|
|
||||||
:class="{ active: page === current }"
|
|
||||||
v-for="page in pages"
|
|
||||||
:key="page"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
class="page-link pointer"
|
|
||||||
:class="{ 'bg-white': page !== current }"
|
|
||||||
@click="onPageClicked(page)"
|
|
||||||
>
|
|
||||||
{{ page }}
|
|
||||||
</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'Paginator',
|
|
||||||
props: {
|
|
||||||
page: Number,
|
|
||||||
current: Number,
|
|
||||||
pages: Number
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
onPageClicked(page) {
|
|
||||||
if (page == this.current) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
this.$emit('page', page)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
|
||||||
<style>
|
|
||||||
.pointer {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -6,8 +6,22 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ul class="list-group list-group-flush">
|
<ul class="list-group list-group-flush">
|
||||||
|
<li
|
||||||
|
v-if="type == 'contacttype'"
|
||||||
|
class="list-group-item">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-6">
|
||||||
|
Kontaktart
|
||||||
|
<i class="bi bi-info-circle" v-tooltip="contactTypeTooltip"></i>
|
||||||
|
</div>
|
||||||
|
<div class="col-6">
|
||||||
|
Wert
|
||||||
|
<i class="bi bi-info-circle" v-tooltip="contactContentTooltip"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
<li
|
<li
|
||||||
class="list-group-item bg-white"
|
class="list-group-item"
|
||||||
v-for="(value, valueKey) in values"
|
v-for="(value, valueKey) in values"
|
||||||
:key="value.id"
|
:key="value.id"
|
||||||
>
|
>
|
||||||
@ -102,6 +116,14 @@ export default {
|
|||||||
levelSelection: levelJson,
|
levelSelection: levelJson,
|
||||||
languagesSelection: languagesJson,
|
languagesSelection: languagesJson,
|
||||||
editableValues: this.values,
|
editableValues: this.values,
|
||||||
|
contactTypeTooltip: {
|
||||||
|
content: 'Kontaktart z.B. E-Mail, Matrix, Twitter etc...',
|
||||||
|
html: true
|
||||||
|
},
|
||||||
|
contactContentTooltip: {
|
||||||
|
content: 'Wert: zB.: beate@beispiel.de, @beate:beispiel.de, beate_beispiel',
|
||||||
|
html: true
|
||||||
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
class="text-decoration-none d-flex"
|
class="text-decoration-none d-flex"
|
||||||
:to="{ path: `/s/profile/${profile.user_id}` }"
|
:to="{ path: `/s/profile/${profile.user_id}` }"
|
||||||
>
|
>
|
||||||
<div class="card w-100 bg-white">
|
<div class="card w-100">
|
||||||
<div class="card-body d-flex">
|
<div class="card-body d-flex">
|
||||||
<div class="d-flex align-items-center justify-content-center me-3">
|
<div class="d-flex align-items-center justify-content-center me-3">
|
||||||
<Avatar :name="profile.nickname"/>
|
<Avatar :name="profile.nickname"/>
|
||||||
|
@ -16,14 +16,6 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="profile?.address?.name">
|
|
||||||
<div class="d-flex align-items-center">
|
|
||||||
<i class="fs-4 bi bi-person-fill text-dark mx-2"></i>
|
|
||||||
<div class="text-white">
|
|
||||||
a.k.a. {{ profile.address.name }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-if="location">
|
<div v-if="location">
|
||||||
<div class="d-flex align-items-center">
|
<div class="d-flex align-items-center">
|
||||||
<i class="fs-4 bi bi-geo-alt-fill text-dark mx-2"></i>
|
<i class="fs-4 bi bi-geo-alt-fill text-dark mx-2"></i>
|
||||||
|
@ -11,7 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
</h3>
|
</h3>
|
||||||
<div class="card w-100">
|
<div class="card w-100">
|
||||||
<slot name="card-body">
|
<slot name="card-body">
|
||||||
<div class="card-body bg-white">
|
<div class="card-body">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
</slot>
|
</slot>
|
||||||
|
@ -95,11 +95,10 @@ export default {
|
|||||||
console.error(error);
|
console.error(error);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async submitFormEdit(isProfileVisible) {
|
async submitFormEdit() {
|
||||||
this.showErrorMessage = false
|
this.showErrorMessage = false
|
||||||
this.showSuccessMessage = false
|
this.showSuccessMessage = false
|
||||||
const userId = store.state.currentUserId
|
const userId = store.state.currentUserId
|
||||||
this.profile.visible = isProfileVisible;
|
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const body = JSON.stringify(this.profile)
|
const body = JSON.stringify(this.profile)
|
||||||
|
@ -12,10 +12,8 @@ export default {
|
|||||||
profiles: [],
|
profiles: [],
|
||||||
error: false,
|
error: false,
|
||||||
errorMessage: '',
|
errorMessage: '',
|
||||||
pages: 1,
|
|
||||||
query: {
|
query: {
|
||||||
search: '',
|
search: ''
|
||||||
page: 1
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -42,17 +40,11 @@ export default {
|
|||||||
state.errorMessage = errorMessage
|
state.errorMessage = errorMessage
|
||||||
},
|
},
|
||||||
setQuerySearch(state, search) {
|
setQuerySearch(state, search) {
|
||||||
state.query = {...state.query, search}
|
state.query.search = search
|
||||||
},
|
|
||||||
setPages(state, pages) {
|
|
||||||
state.pages = pages
|
|
||||||
},
|
|
||||||
setQueryPage(state, page) {
|
|
||||||
state.query = {...state.query, page}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
async search({state, commit, rootState, dispatch}) {
|
async search({state, commit, rootState}) {
|
||||||
if (state.searching) {
|
if (state.searching) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
@ -68,13 +60,11 @@ export default {
|
|||||||
commit('setErrorMessage', '')
|
commit('setErrorMessage', '')
|
||||||
|
|
||||||
const url = new URL(`${window.ki.apiUrl}/users/profiles`)
|
const url = new URL(`${window.ki.apiUrl}/users/profiles`)
|
||||||
|
|
||||||
if (state.query.search) {
|
if (state.query.search) {
|
||||||
url.searchParams.append('search', state.query.search)
|
url.searchParams.append('search', state.query.search)
|
||||||
}
|
}
|
||||||
|
|
||||||
url.searchParams.append('page', state.query.page)
|
|
||||||
|
|
||||||
const headers = {
|
const headers = {
|
||||||
Authorization: `Bearer ${rootState.token}`,
|
Authorization: `Bearer ${rootState.token}`,
|
||||||
}
|
}
|
||||||
@ -91,19 +81,8 @@ export default {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log(response.ok)
|
|
||||||
console.log(response.status)
|
|
||||||
console.log(state.query.page)
|
|
||||||
|
|
||||||
clearTimeout(timeoutId)
|
clearTimeout(timeoutId)
|
||||||
|
|
||||||
if (!response.ok && response.status === 404 && state.query.page != 1) {
|
|
||||||
commit('setQueryPage', 1)
|
|
||||||
commit('setSearching', false)
|
|
||||||
await dispatch('search')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
commit('setError', true)
|
commit('setError', true)
|
||||||
commit('clearProfiles')
|
commit('clearProfiles')
|
||||||
@ -114,7 +93,6 @@ export default {
|
|||||||
|
|
||||||
const responseData = await response.json()
|
const responseData = await response.json()
|
||||||
commit('setProfiles', responseData.profiles)
|
commit('setProfiles', responseData.profiles)
|
||||||
commit('setPages', responseData.pages)
|
|
||||||
commit('setSearching', false)
|
commit('setSearching', false)
|
||||||
commit('hideSpinner')
|
commit('hideSpinner')
|
||||||
}
|
}
|
||||||
|
@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
class="form-control"
|
class="form-control"
|
||||||
id="searchText"
|
id="searchText"
|
||||||
v-model="searchText"
|
v-model="searchText"
|
||||||
placeholder="Nick, Name, Fähigkeit, Sprache"
|
placeholder="Nick, Fähigkeit, Sprache"
|
||||||
ref="searchTextInput"
|
ref="searchTextInput"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@ -53,26 +53,12 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<p v-if="searchText !== ''">Probiere eine andere Suche.</p>
|
<p v-if="searchText !== ''">Probiere eine andere Suche.</p>
|
||||||
</div>
|
</div>
|
||||||
<div v-else-if="showResults">
|
<div v-else-if="showResults">
|
||||||
<div class="d-flex justify-content-around">
|
|
||||||
<Paginator
|
|
||||||
:pages="pages"
|
|
||||||
:current="currentPage"
|
|
||||||
@page="handlePageSelected"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<SearchResult
|
<SearchResult
|
||||||
v-for="profile in profiles"
|
v-for="profile in profiles"
|
||||||
:key="profile.user_id"
|
:key="profile.user_id"
|
||||||
class="mb-3"
|
class="mb-3"
|
||||||
:profile="profile"
|
:profile="profile"
|
||||||
/>
|
/>
|
||||||
<div class="d-flex justify-content-around">
|
|
||||||
<Paginator
|
|
||||||
:pages="pages"
|
|
||||||
:current="currentPage"
|
|
||||||
@page="handlePageSelected"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -81,29 +67,21 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<script>
|
<script>
|
||||||
import { mapState } from 'vuex'
|
import { mapState } from 'vuex'
|
||||||
|
|
||||||
import Paginator from '@/components/Paginator'
|
|
||||||
import SearchResult from '@/components/SearchResult'
|
import SearchResult from '@/components/SearchResult'
|
||||||
import Spinner from '@/components/Spinner'
|
import Spinner from '@/components/Spinner'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Search',
|
name: 'Search',
|
||||||
components: {
|
components: {
|
||||||
Paginator,
|
|
||||||
SearchResult,
|
SearchResult,
|
||||||
Spinner,
|
Spinner,
|
||||||
},
|
},
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
textChanged: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
computed: {
|
||||||
...mapState({
|
...mapState({
|
||||||
searching: state => state.search.searching,
|
searching: state => state.search.searching,
|
||||||
profiles: state => state.search.profiles,
|
profiles: state => state.search.profiles,
|
||||||
error: state => state.search.error,
|
error: state => state.search.error,
|
||||||
showSpinner: state => state.search.showSpinner,
|
showSpinner: state => state.search.showSpinner,
|
||||||
pages: state => state.search.pages,
|
|
||||||
}),
|
}),
|
||||||
searchText: {
|
searchText: {
|
||||||
get() {
|
get() {
|
||||||
@ -111,15 +89,6 @@ export default {
|
|||||||
},
|
},
|
||||||
set(text) {
|
set(text) {
|
||||||
this.$store.commit('search/setQuerySearch', text)
|
this.$store.commit('search/setQuerySearch', text)
|
||||||
this.textChanged = true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
currentPage: {
|
|
||||||
get() {
|
|
||||||
return this.$store.state.search.query.page
|
|
||||||
},
|
|
||||||
set(page) {
|
|
||||||
this.$store.commit('search/setQueryPage', page)
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
showNoResults() {
|
showNoResults() {
|
||||||
@ -140,37 +109,21 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleSubmit() {
|
handleSubmit() {
|
||||||
if (this.textChanged === true) {
|
this.$router.push({ query: { query: this.searchText }})
|
||||||
this.$store.commit('search/setQueryPage', 1)
|
|
||||||
}
|
|
||||||
this.pushState()
|
|
||||||
this.$store.dispatch('search/search')
|
this.$store.dispatch('search/search')
|
||||||
},
|
},
|
||||||
focusSearchText() {
|
focusSearchText() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs.searchTextInput.focus()
|
this.$refs.searchTextInput.focus()
|
||||||
})
|
})
|
||||||
},
|
|
||||||
handlePageSelected(page) {
|
|
||||||
this.currentPage = page
|
|
||||||
this.pushState()
|
|
||||||
this.$store.dispatch('search/search')
|
|
||||||
},
|
|
||||||
pushState() {
|
|
||||||
this.$router.push({ query: { query: this.searchText, page: this.currentPage }})
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
if (this.$route.query.query) {
|
if (this.$route.query.query !== undefined) {
|
||||||
this.searchText = this.$route.query.query
|
this.searchText = this.$route.query.query
|
||||||
this.$store.commit('search/clearProfiles')
|
this.$store.commit('search/clearProfiles')
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.$route.query.page) {
|
|
||||||
this.currentPage = parseInt(this.$route.query.page, 10)
|
|
||||||
this.$store.commit('search/clearProfiles')
|
|
||||||
}
|
|
||||||
|
|
||||||
this.$store.dispatch('search/search')
|
this.$store.dispatch('search/search')
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -12,10 +12,27 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<form @submit.prevent="submitFormEdit(false)">
|
<form @submit.prevent="submitFormEdit()">
|
||||||
<Section title="Grunddaten">
|
<Section title="Grunddaten">
|
||||||
|
<div class="mb-4">
|
||||||
|
<div class="form-check form-switch">
|
||||||
|
<input
|
||||||
|
class="form-check-input"
|
||||||
|
type="checkbox"
|
||||||
|
role="switch"
|
||||||
|
v-model="profile.visible"
|
||||||
|
id="visibility"
|
||||||
|
>
|
||||||
|
<label
|
||||||
|
class="form-check-label"
|
||||||
|
for="visibility">
|
||||||
|
Profil für angemeldete Benutzer sichtbar
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="row mb-4">
|
<div class="row mb-4">
|
||||||
<div class="col-12 col-md-4 mb-3 mb-md-0">
|
<div class="col-6 mb-3">
|
||||||
<label class="form-label">Nickname</label>
|
<label class="form-label">Nickname</label>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
@ -26,17 +43,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12 col-md-4 mb-3 mb-md-0">
|
<div class="col-6 mb-3">
|
||||||
<label class="form-label">Klarname (optional)</label>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
class="form-control"
|
|
||||||
id="realname"
|
|
||||||
maxlength="25"
|
|
||||||
v-model="profile.address.name"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="col-12 col-md-4">
|
|
||||||
<label class="form-label">
|
<label class="form-label">
|
||||||
Pronomen
|
Pronomen
|
||||||
<i class="bi bi-info-circle" v-tooltip="pronounsTooltip"></i>
|
<i class="bi bi-info-circle" v-tooltip="pronounsTooltip"></i>
|
||||||
@ -160,14 +167,14 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<auto-complete
|
<auto-complete
|
||||||
type="contacttype"
|
type="contacttype"
|
||||||
:values="profile.contacts"
|
:values="profile.contacts"
|
||||||
placeholder="z.B. E-Mail, Mobiltelefon, Matrix, Web"
|
placeholder="Zuerst Kontaktart: E-Mail, Matrix, Web, etc.."
|
||||||
@update-values="profile.contacts = $event"
|
@update-values="profile.contacts = $event"
|
||||||
></auto-complete>
|
></auto-complete>
|
||||||
</template>
|
</template>
|
||||||
</Section>
|
</Section>
|
||||||
|
|
||||||
<Section title="Sonstiges">
|
<Section title="Sonstiges">
|
||||||
<div class="mb-3 bg-white">
|
<div class="mb-3">
|
||||||
<label class="form-label">Über mich</label>
|
<label class="form-label">Über mich</label>
|
||||||
<textarea
|
<textarea
|
||||||
class="form-control"
|
class="form-control"
|
||||||
@ -205,17 +212,11 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<i class="bi bi-check-lg"></i>
|
<i class="bi bi-check-lg"></i>
|
||||||
Gespeichert
|
Gespeichert
|
||||||
</div>
|
</div>
|
||||||
<button
|
|
||||||
class="btn btn-secondary ms-3"
|
|
||||||
@click="submitFormEdit(false)"
|
|
||||||
>
|
|
||||||
Entwurf Speichern
|
|
||||||
</button>
|
|
||||||
<button
|
<button
|
||||||
class="btn btn-primary ms-3"
|
class="btn btn-primary ms-3"
|
||||||
@click="submitFormEdit(true)"
|
@click="submitFormEdit()"
|
||||||
>
|
>
|
||||||
Speichern und Veröffentlichen
|
Speichern
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -75,7 +75,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
<label class="form-label fw-bold">
|
<label class="form-label fw-bold">
|
||||||
Anmerkungen
|
Anmerkungen
|
||||||
</label>
|
</label>
|
||||||
<div class="line-break-text">{{ profile.availability_text }}</div>
|
<div>{{ profile.availability_text }}</div>
|
||||||
</div>
|
</div>
|
||||||
</Section>
|
</Section>
|
||||||
|
|
||||||
@ -98,11 +98,11 @@ SPDX-License-Identifier: AGPL-3.0-or-later
|
|||||||
title="Sonstiges">
|
title="Sonstiges">
|
||||||
<div v-if="profile.freetext" :class="{ 'lh-base': true, 'mb-4': profile.volunteerwork }">
|
<div v-if="profile.freetext" :class="{ 'lh-base': true, 'mb-4': profile.volunteerwork }">
|
||||||
<h5>Über mich</h5>
|
<h5>Über mich</h5>
|
||||||
<div class="line-break-text">{{ profile.freetext }}</div>
|
{{ profile.freetext }}
|
||||||
</div>
|
</div>
|
||||||
<div v-if="profile.volunteerwork" class="lh-base">
|
<div v-if="profile.volunteerwork" class="lh-base">
|
||||||
<h5>Ehrenamtliche Arbeit</h5>
|
<h5>Ehrenamtliche Arbeit</h5>
|
||||||
<div class="line-break-text">{{ profile.volunteerwork }}</div>
|
{{ profile.volunteerwork }}
|
||||||
</div>
|
</div>
|
||||||
</Section>
|
</Section>
|
||||||
</template>
|
</template>
|
||||||
@ -154,7 +154,4 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.line-break-text{
|
|
||||||
white-space: pre-line;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user