Compare commits

..

No commits in common. "main" and "fix/npm-update" have entirely different histories.

11 changed files with 53 additions and 303 deletions

View File

@ -1,11 +1,2 @@
.browserslistrc
.dockerignore
.drone.yml
.editorconfig
.git
.gitignore
.reuse
Dockerfile
LICENSES
README.md
node_modules

View File

@ -4,110 +4,22 @@
# SPDX-License-Identifier: AGPL-3.0-or-later
kind: pipeline
type: docker
name: qa
trigger:
event:
- push
- pull_request
branch:
- main
name: default
steps:
- name: reuse
image: fsfe/reuse
- name: lint
image: node:20
commands:
- npm ci
- npm run lint
- name: docker-build
image: plugins/docker
settings:
registry: git.wtf-eg.de
repo: git.wtf-eg.de/kompetenzinventar/frontend
target: ki-frontend
dry_run: true
---
kind: pipeline
type: docker
name: build
trigger:
event:
- push
branch:
- main
depends_on:
- qa
steps:
- name: docker-publish
image: plugins/docker
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
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
- name: lint
image: node:20
commands:
- npm ci
- npm run lint
- name: docker-publish
image: plugins/docker
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"
- name: reuse
image: fsfe/reuse:latest
- name: docker-publish
image: plugins/docker
settings:
registry: registry.wtf-eg.net
repo: registry.wtf-eg.net/ki-frontend
target: ki-frontend
auto_tag: true
username:
from_secret: "docker_username"
password:
from_secret: "docker_password"
when:
branch:
- main

View File

@ -4,25 +4,12 @@
FROM node:14-alpine as builder
COPY package.json package-lock.json ./
RUN npm install
COPY .eslintrc.js .
COPY babel.config.js .
COPY public public
COPY src src
COPY . ./
RUN npm ci && npm run build
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 --from=builder /dist .

View File

@ -9,24 +9,10 @@ server {
#access_log /var/log/nginx/host.access.log main;
root /usr/share/nginx/html;
# routes without dots serve the index.html without caching
location / {
add_header Cache-Control "no-cache";
try_files $uri $uri/index.html /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;
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
#error_page 404 /404.html;

View File

@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
<div class="fw-bold text-white mb-2">Kompetenzinventar</div>
<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/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>
</div>
</div>

View File

@ -1,49 +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"
@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>

View File

@ -16,14 +16,6 @@ SPDX-License-Identifier: AGPL-3.0-or-later
</span>
</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 class="d-flex align-items-center">
<i class="fs-4 bi bi-geo-alt-fill text-dark mx-2"></i>

View File

@ -95,11 +95,10 @@ export default {
console.error(error);
}
},
async submitFormEdit(isProfileVisible) {
async submitFormEdit() {
this.showErrorMessage = false
this.showSuccessMessage = false
const userId = store.state.currentUserId
this.profile.visible = isProfileVisible;
try {
const body = JSON.stringify(this.profile)

View File

@ -12,10 +12,8 @@ export default {
profiles: [],
error: false,
errorMessage: '',
pages: 1,
query: {
search: '',
page: 1
search: ''
}
}
},
@ -42,17 +40,11 @@ export default {
state.errorMessage = errorMessage
},
setQuerySearch(state, search) {
state.query = {...state.query, search}
},
setPages(state, pages) {
state.pages = pages
},
setQueryPage(state, page) {
state.query = {...state.query, page}
state.query.search = search
}
},
actions: {
async search({state, commit, rootState, dispatch}) {
async search({state, commit, rootState}) {
if (state.searching) {
return
}
@ -68,13 +60,11 @@ export default {
commit('setErrorMessage', '')
const url = new URL(`${window.ki.apiUrl}/users/profiles`)
if (state.query.search) {
url.searchParams.append('search', state.query.search)
}
url.searchParams.append('page', state.query.page)
const headers = {
Authorization: `Bearer ${rootState.token}`,
}
@ -91,19 +81,8 @@ export default {
return
}
console.log(response.ok)
console.log(response.status)
console.log(state.query.page)
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) {
commit('setError', true)
commit('clearProfiles')
@ -114,7 +93,6 @@ export default {
const responseData = await response.json()
commit('setProfiles', responseData.profiles)
commit('setPages', responseData.pages)
commit('setSearching', false)
commit('hideSpinner')
}

View File

@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
class="form-control"
id="searchText"
v-model="searchText"
placeholder="Nick, Name, Fähigkeit, Sprache"
placeholder="Nick, Fähigkeit, Sprache"
ref="searchTextInput"
/>
</div>
@ -53,26 +53,12 @@ SPDX-License-Identifier: AGPL-3.0-or-later
<p v-if="searchText !== ''">Probiere eine andere Suche.</p>
</div>
<div v-else-if="showResults">
<div class="d-flex justify-content-around">
<Paginator
:pages="pages"
:current="currentPage"
@page="handlePageSelected"
/>
</div>
<SearchResult
v-for="profile in profiles"
:key="profile.user_id"
class="mb-3"
:profile="profile"
/>
<div class="d-flex justify-content-around">
<Paginator
:pages="pages"
:current="currentPage"
@page="handlePageSelected"
/>
</div>
</div>
</div>
</div>
@ -81,29 +67,21 @@ SPDX-License-Identifier: AGPL-3.0-or-later
<script>
import { mapState } from 'vuex'
import Paginator from '@/components/Paginator'
import SearchResult from '@/components/SearchResult'
import Spinner from '@/components/Spinner'
export default {
name: 'Search',
components: {
Paginator,
SearchResult,
Spinner,
},
data() {
return {
textChanged: false
}
},
computed: {
...mapState({
searching: state => state.search.searching,
profiles: state => state.search.profiles,
error: state => state.search.error,
showSpinner: state => state.search.showSpinner,
pages: state => state.search.pages,
}),
searchText: {
get() {
@ -111,15 +89,6 @@ export default {
},
set(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() {
@ -140,37 +109,21 @@ export default {
},
methods: {
handleSubmit() {
if (this.textChanged === true) {
this.$store.commit('search/setQueryPage', 1)
}
this.pushState()
this.$router.push({ query: { query: this.searchText }})
this.$store.dispatch('search/search')
},
focusSearchText() {
this.$nextTick(() => {
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() {
if (this.$route.query.query) {
if (this.$route.query.query !== undefined) {
this.searchText = this.$route.query.query
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')
}
};

View File

@ -12,10 +12,27 @@ SPDX-License-Identifier: AGPL-3.0-or-later
</div>
</div>
<div class="container">
<form @submit.prevent="submitFormEdit(false)">
<form @submit.prevent="submitFormEdit()">
<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="col-12 col-md-4 mb-3 mb-md-0">
<div class="col-6 mb-3">
<label class="form-label">Nickname</label>
<input
type="text"
@ -26,17 +43,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
required
/>
</div>
<div class="col-12 col-md-4 mb-3 mb-md-0">
<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">
<div class="col-6 mb-3">
<label class="form-label">
Pronomen
<i class="bi bi-info-circle" v-tooltip="pronounsTooltip"></i>
@ -205,17 +212,11 @@ SPDX-License-Identifier: AGPL-3.0-or-later
<i class="bi bi-check-lg"></i>
Gespeichert
</div>
<button
class="btn btn-secondary ms-3"
@click="submitFormEdit(false)"
>
Entwurf Speichern
</button>
<button
class="btn btn-primary ms-3"
@click="submitFormEdit(true)"
@click="submitFormEdit()"
>
Speichern und Veröffentlichen
Speichern
</button>
</div>
</div>