Fixed frontend
This commit is contained in:
parent
df93c5e091
commit
c290863e26
15
frontend/.eslintrc.cjs
Normal file
15
frontend/.eslintrc.cjs
Normal file
@ -0,0 +1,15 @@
|
||||
/* eslint-env node */
|
||||
require("@rushstack/eslint-patch/modern-module-resolution");
|
||||
|
||||
module.exports = {
|
||||
root: true,
|
||||
extends: [
|
||||
"plugin:vue/vue3-essential",
|
||||
"eslint:recommended",
|
||||
"@vue/eslint-config-typescript/recommended",
|
||||
"@vue/eslint-config-prettier",
|
||||
],
|
||||
parserOptions: {
|
||||
ecmaVersion: "latest",
|
||||
},
|
||||
};
|
||||
27
frontend/.gitignore
vendored
27
frontend/.gitignore
vendored
@ -1,21 +1,26 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
|
||||
@ -1,7 +0,0 @@
|
||||
{
|
||||
"tabWidth": 4,
|
||||
"useTabs": true,
|
||||
"singleQuote": true,
|
||||
"trailingComma": "none",
|
||||
"endOfLine": "lf"
|
||||
}
|
||||
46
frontend/README.md
Normal file
46
frontend/README.md
Normal file
@ -0,0 +1,46 @@
|
||||
# frontend
|
||||
|
||||
This template should help get you started developing with Vue 3 in Vite.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
|
||||
|
||||
## Type Support for `.vue` Imports in TS
|
||||
|
||||
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
|
||||
|
||||
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
|
||||
|
||||
1. Disable the built-in TypeScript Extension
|
||||
1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
|
||||
2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
|
||||
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
|
||||
|
||||
## Customize configuration
|
||||
|
||||
See [Vite Configuration Reference](https://vitejs.dev/config/).
|
||||
|
||||
## Project Setup
|
||||
|
||||
```sh
|
||||
npm install
|
||||
```
|
||||
|
||||
### Compile and Hot-Reload for Development
|
||||
|
||||
```sh
|
||||
npm run dev
|
||||
```
|
||||
|
||||
### Type-Check, Compile and Minify for Production
|
||||
|
||||
```sh
|
||||
npm run build
|
||||
```
|
||||
|
||||
### Lint with [ESLint](https://eslint.org/)
|
||||
|
||||
```sh
|
||||
npm run lint
|
||||
```
|
||||
@ -1,3 +0,0 @@
|
||||
module.exports = {
|
||||
presets: ['@vue/cli-plugin-babel/preset']
|
||||
};
|
||||
1
frontend/env.d.ts
vendored
Normal file
1
frontend/env.d.ts
vendored
Normal file
@ -0,0 +1 @@
|
||||
/// <reference types="vite/client" />
|
||||
@ -1,29 +0,0 @@
|
||||
module.exports = {
|
||||
parser: '@typescript-eslint/parser',
|
||||
parserOptions: {
|
||||
project: 'tsconfig.json',
|
||||
tsconfigRootDir: __dirname,
|
||||
sourceType: 'module'
|
||||
},
|
||||
plugins: ['@typescript-eslint/eslint-plugin', 'no-relative-import-paths'],
|
||||
extends: [
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:prettier/recommended'
|
||||
],
|
||||
root: true,
|
||||
env: {
|
||||
node: true,
|
||||
jest: true
|
||||
},
|
||||
ignorePatterns: ['.eslintrc.js'],
|
||||
rules: {
|
||||
'@typescript-eslint/interface-name-prefix': 'off',
|
||||
'@typescript-eslint/explicit-function-return-type': 'off',
|
||||
'@typescript-eslint/explicit-module-boundary-types': 'off',
|
||||
'@typescript-eslint/no-explicit-any': 'off',
|
||||
'no-relative-import-paths/no-relative-import-paths': [
|
||||
'error',
|
||||
{ allowSameFolder: true, rootDir: 'src' }
|
||||
]
|
||||
}
|
||||
};
|
||||
13
frontend/index.html
Normal file
13
frontend/index.html
Normal file
@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Vite App</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,64 +1,41 @@
|
||||
{
|
||||
"name": "frontend",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service build --watch --dest ../run/static",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.27.2",
|
||||
"class-transformer": "^0.5.1",
|
||||
"class-validator": "^0.13.2",
|
||||
"core-js": "^3.8.3",
|
||||
"filesize": "^9.0.11",
|
||||
"jwt-decode": "^3.1.2",
|
||||
"naive-ui": "^2.32.1",
|
||||
"stream-browserify": "^3.0.0",
|
||||
"util": "^0.12.4",
|
||||
"vue": "^3.2.13",
|
||||
"vue-router": "^4.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@typescript-eslint/eslint-plugin": "^5.4.0",
|
||||
"@typescript-eslint/parser": "^5.4.0",
|
||||
"@vue/cli-plugin-babel": "~5.0.0",
|
||||
"@vue/cli-plugin-eslint": "~5.0.0",
|
||||
"@vue/cli-plugin-router": "~5.0.0",
|
||||
"@vue/cli-plugin-typescript": "~5.0.0",
|
||||
"@vue/cli-service": "~5.0.0",
|
||||
"@vue/eslint-config-typescript": "^9.1.0",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-config-prettier": "^8.3.0",
|
||||
"eslint-plugin-prettier": "^4.0.0",
|
||||
"eslint-plugin-vue": "^8.0.3",
|
||||
"prettier": "^2.4.1",
|
||||
"sass": "^1.32.7",
|
||||
"sass-loader": "^12.0.0",
|
||||
"typescript": "~4.5.5",
|
||||
"vfonts": "^0.0.3"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"root": true,
|
||||
"env": {
|
||||
"node": true
|
||||
},
|
||||
"extends": [
|
||||
"plugin:vue/vue3-essential",
|
||||
"eslint:recommended",
|
||||
"@vue/typescript/recommended",
|
||||
"plugin:prettier/recommended"
|
||||
],
|
||||
"parserOptions": {
|
||||
"ecmaVersion": 2020
|
||||
},
|
||||
"rules": {}
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions",
|
||||
"not dead",
|
||||
"not ie 11"
|
||||
]
|
||||
"name": "frontend",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"license": "suck my dick",
|
||||
"scripts": {
|
||||
"dev": "vite build --outDir ../run/static --watch",
|
||||
"build": "run-p type-check build-only",
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --noEmit",
|
||||
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.27.2",
|
||||
"class-transformer": "^0.5.1",
|
||||
"class-validator": "^0.13.2",
|
||||
"filesize": "^9.0.11",
|
||||
"jwt-decode": "^3.1.2",
|
||||
"naive-ui": "^2.32.1",
|
||||
"stream-browserify": "^3.0.0",
|
||||
"util": "^0.12.4",
|
||||
"vue": "^3.2.37",
|
||||
"vue-router": "^4.1.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.1.4",
|
||||
"@types/node": "^18.7.14",
|
||||
"@vitejs/plugin-vue": "^3.0.1",
|
||||
"@vue/eslint-config-prettier": "^7.0.0",
|
||||
"@vue/eslint-config-typescript": "^11.0.0",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"eslint": "8.22.0",
|
||||
"eslint-plugin-vue": "^9.3.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"prettier": "^2.7.1",
|
||||
"sass": "^1.32.7",
|
||||
"typescript": "~4.7.4",
|
||||
"vite": "^3.0.4",
|
||||
"vue-tsc": "^0.39.5"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,22 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
||||
<!--suppress HtmlUnknownTarget -->
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong
|
||||
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't
|
||||
work properly without JavaScript enabled. Please enable it to
|
||||
continue.</strong
|
||||
>
|
||||
</noscript>
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
</html>
|
||||
@ -1,62 +1,62 @@
|
||||
<script setup async lang="ts">
|
||||
import { provide, ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import { TokenInjectType } from '@/api';
|
||||
import { provide, ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import type { TokenInjectType } from "@/api";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const jwt = ref<string | null>(localStorage.getItem('token'));
|
||||
const jwt = ref<string | null>(localStorage.getItem("token"));
|
||||
|
||||
function setToken(token: string) {
|
||||
jwt.value = token;
|
||||
localStorage.setItem('token', token);
|
||||
jwt.value = token;
|
||||
localStorage.setItem("token", token);
|
||||
}
|
||||
|
||||
function logout() {
|
||||
jwt.value = null;
|
||||
localStorage.removeItem('token');
|
||||
router.push({ name: 'login' });
|
||||
jwt.value = null;
|
||||
localStorage.removeItem("token");
|
||||
router.push({ name: "login" });
|
||||
}
|
||||
|
||||
provide<TokenInjectType>('jwt', {
|
||||
jwt,
|
||||
setToken,
|
||||
logout
|
||||
provide<TokenInjectType>("jwt", {
|
||||
jwt,
|
||||
setToken,
|
||||
logout,
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav>
|
||||
<template v-if="jwt != null">
|
||||
<router-link to="/">Files</router-link>
|
||||
<span style="margin-left: 2em" />
|
||||
<router-link to="/profile">Profile</router-link>
|
||||
<span style="margin-left: 2em" />
|
||||
<router-link to="/login" @click="logout()">Logout</router-link>
|
||||
</template>
|
||||
</nav>
|
||||
<router-view />
|
||||
<nav>
|
||||
<template v-if="jwt != null">
|
||||
<router-link to="/">Files</router-link>
|
||||
<span style="margin-left: 2em" />
|
||||
<router-link to="/profile">Profile</router-link>
|
||||
<span style="margin-left: 2em" />
|
||||
<router-link to="/login" @click="logout()">Logout</router-link>
|
||||
</template>
|
||||
</nav>
|
||||
<router-view />
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
#app {
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
nav {
|
||||
padding: 30px;
|
||||
padding: 30px;
|
||||
|
||||
a {
|
||||
font-weight: bold;
|
||||
color: #2c3e50;
|
||||
a {
|
||||
font-weight: bold;
|
||||
color: #2c3e50;
|
||||
|
||||
&.router-link-exact-active {
|
||||
color: #42b983;
|
||||
}
|
||||
}
|
||||
&.router-link-exact-active {
|
||||
color: #42b983;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import App from './App';
|
||||
import App from "./App.vue";
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Suspense>
|
||||
<App></App>
|
||||
<template #fallback>
|
||||
<div>Loading...</div>
|
||||
</template>
|
||||
</Suspense>
|
||||
<Suspense>
|
||||
<App></App>
|
||||
<template #fallback>
|
||||
<div>Loading...</div>
|
||||
</template>
|
||||
</Suspense>
|
||||
</template>
|
||||
|
||||
@ -1,54 +1,54 @@
|
||||
import { Requests, Responses, UserRole, get_token, post_token } from './base';
|
||||
import { Requests, Responses, UserRole, get_token, post_token } from "./base";
|
||||
|
||||
export const get_users = (token: string): Promise<Responses.Admin.GetUsers> =>
|
||||
get_token('/api/admin/users', token);
|
||||
get_token("/api/admin/users", token);
|
||||
|
||||
export const set_role = (
|
||||
user: number,
|
||||
role: UserRole,
|
||||
token: string
|
||||
user: number,
|
||||
role: UserRole,
|
||||
token: string
|
||||
): Promise<Responses.Admin.SetUserRole | Responses.ErrorResponse> =>
|
||||
post_token<Requests.Admin.SetUserRole>(
|
||||
'/api/admin/set_role',
|
||||
{
|
||||
user,
|
||||
role
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.Admin.SetUserRole>(
|
||||
"/api/admin/set_role",
|
||||
{
|
||||
user,
|
||||
role,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const logout = (
|
||||
user: number,
|
||||
token: string
|
||||
user: number,
|
||||
token: string
|
||||
): Promise<Responses.Admin.LogoutAllUser | Responses.ErrorResponse> =>
|
||||
post_token<Requests.Admin.LogoutAll>(
|
||||
'/api/admin/logout',
|
||||
{
|
||||
user
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.Admin.LogoutAll>(
|
||||
"/api/admin/logout",
|
||||
{
|
||||
user,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const delete_user = (
|
||||
user: number,
|
||||
token: string
|
||||
user: number,
|
||||
token: string
|
||||
): Promise<Responses.Admin.DeleteUser | Responses.ErrorResponse> =>
|
||||
post_token<Requests.Admin.DeleteUser>(
|
||||
'/api/admin/delete',
|
||||
{
|
||||
user
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.Admin.DeleteUser>(
|
||||
"/api/admin/delete",
|
||||
{
|
||||
user,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const disable_tfa = (
|
||||
user: number,
|
||||
token: string
|
||||
user: number,
|
||||
token: string
|
||||
): Promise<Responses.Admin.DisableTfa | Responses.ErrorResponse> =>
|
||||
post_token<Requests.Admin.DisableTfa>(
|
||||
'/api/admin/disable_2fa',
|
||||
{
|
||||
user
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.Admin.DisableTfa>(
|
||||
"/api/admin/disable_2fa",
|
||||
{
|
||||
user,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
@ -1,93 +1,93 @@
|
||||
import { Responses, Requests, post, post_token } from './base';
|
||||
import { Responses, Requests, post, post_token } from "./base";
|
||||
|
||||
export const auth_login = (
|
||||
username: string,
|
||||
password: string,
|
||||
otp?: string
|
||||
username: string,
|
||||
password: string,
|
||||
otp?: string
|
||||
): Promise<
|
||||
| Responses.Auth.LoginResponse
|
||||
| Responses.Auth.TfaRequiredResponse
|
||||
| Responses.ErrorResponse
|
||||
| Responses.Auth.LoginResponse
|
||||
| Responses.Auth.TfaRequiredResponse
|
||||
| Responses.ErrorResponse
|
||||
> =>
|
||||
post<Requests.Auth.LoginRequest>('/api/auth/login', {
|
||||
username: username,
|
||||
password: password,
|
||||
otp: otp
|
||||
});
|
||||
post<Requests.Auth.LoginRequest>("/api/auth/login", {
|
||||
username: username,
|
||||
password: password,
|
||||
otp: otp,
|
||||
});
|
||||
|
||||
export const auth_signup = (
|
||||
username: string,
|
||||
password: string
|
||||
username: string,
|
||||
password: string
|
||||
): Promise<Responses.Auth.SignupResponse | Responses.ErrorResponse> =>
|
||||
post<Requests.Auth.SignUpRequest>('/api/auth/signup', {
|
||||
username: username,
|
||||
password: password
|
||||
});
|
||||
post<Requests.Auth.SignUpRequest>("/api/auth/signup", {
|
||||
username: username,
|
||||
password: password,
|
||||
});
|
||||
|
||||
export const refresh_token = (
|
||||
token: string
|
||||
token: string
|
||||
): Promise<Responses.Auth.RefreshResponse | Responses.ErrorResponse> =>
|
||||
post_token('/api/auth/refresh', {}, token);
|
||||
post_token("/api/auth/refresh", {}, token);
|
||||
|
||||
export const change_password = (
|
||||
oldPw: string,
|
||||
newPw: string,
|
||||
token: string
|
||||
oldPw: string,
|
||||
newPw: string,
|
||||
token: string
|
||||
): Promise<Responses.Auth.ChangePasswordResponse | Responses.ErrorResponse> =>
|
||||
post_token<Requests.Auth.ChangePasswordRequest>(
|
||||
'/api/auth/change_password',
|
||||
{
|
||||
oldPassword: oldPw,
|
||||
newPassword: newPw
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.Auth.ChangePasswordRequest>(
|
||||
"/api/auth/change_password",
|
||||
{
|
||||
oldPassword: oldPw,
|
||||
newPassword: newPw,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const logout_all = (
|
||||
token: string
|
||||
token: string
|
||||
): Promise<Responses.Auth.LogoutAllResponse | Responses.ErrorResponse> =>
|
||||
post_token('/api/auth/logout_all', {}, token);
|
||||
post_token("/api/auth/logout_all", {}, token);
|
||||
|
||||
export function tfa_setup(
|
||||
mail: false,
|
||||
token: string
|
||||
mail: false,
|
||||
token: string
|
||||
): Promise<Responses.Auth.RequestTotpTfaResponse | Responses.ErrorResponse>;
|
||||
export function tfa_setup(
|
||||
mail: true,
|
||||
token: string
|
||||
mail: true,
|
||||
token: string
|
||||
): Promise<Responses.Auth.RequestEmailTfaResponse | Responses.ErrorResponse>;
|
||||
export function tfa_setup(
|
||||
mail: boolean,
|
||||
token: string
|
||||
mail: boolean,
|
||||
token: string
|
||||
): Promise<
|
||||
| Responses.Auth.RequestEmailTfaResponse
|
||||
| Responses.Auth.RequestTotpTfaResponse
|
||||
| Responses.ErrorResponse
|
||||
| Responses.Auth.RequestEmailTfaResponse
|
||||
| Responses.Auth.RequestTotpTfaResponse
|
||||
| Responses.ErrorResponse
|
||||
> {
|
||||
return post_token<Requests.Auth.TfaSetup>(
|
||||
'/api/auth/2fa/setup',
|
||||
{
|
||||
mail
|
||||
},
|
||||
token
|
||||
);
|
||||
return post_token<Requests.Auth.TfaSetup>(
|
||||
"/api/auth/2fa/setup",
|
||||
{
|
||||
mail,
|
||||
},
|
||||
token
|
||||
);
|
||||
}
|
||||
|
||||
export const tfa_complete = (
|
||||
mail: boolean,
|
||||
code: string,
|
||||
token: string
|
||||
mail: boolean,
|
||||
code: string,
|
||||
token: string
|
||||
): Promise<Responses.Auth.TfaCompletedResponse | Responses.ErrorResponse> =>
|
||||
post_token<Requests.Auth.TfaComplete>(
|
||||
'/api/auth/2fa/complete',
|
||||
{
|
||||
mail,
|
||||
code
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.Auth.TfaComplete>(
|
||||
"/api/auth/2fa/complete",
|
||||
{
|
||||
mail,
|
||||
code,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const tfa_disable = (
|
||||
token: string
|
||||
token: string
|
||||
): Promise<Responses.Auth.RemoveTfaResponse | Responses.ErrorResponse> =>
|
||||
post_token('/api/auth/2fa/disable', {}, token);
|
||||
post_token("/api/auth/2fa/disable", {}, token);
|
||||
|
||||
@ -1,62 +1,62 @@
|
||||
import axios from 'axios';
|
||||
import { Requests, Responses, UserRole } from '../dto';
|
||||
import axios from "axios";
|
||||
import { Requests, Responses, UserRole } from "../dto";
|
||||
export { Requests, Responses, UserRole };
|
||||
|
||||
export const post = <T extends Requests.BaseRequest>(url: string, data: T) =>
|
||||
axios
|
||||
.post(url, data, {
|
||||
headers: { 'Content-type': 'application/json' }
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
axios
|
||||
.post(url, data, {
|
||||
headers: { "Content-type": "application/json" },
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
|
||||
export const post_token = <T extends Requests.BaseRequest>(
|
||||
url: string,
|
||||
data: T,
|
||||
token: string
|
||||
url: string,
|
||||
data: T,
|
||||
token: string
|
||||
) =>
|
||||
axios
|
||||
.post(url, data, {
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + token,
|
||||
'Content-type': 'application/json'
|
||||
}
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
axios
|
||||
.post(url, data, {
|
||||
headers: {
|
||||
Authorization: "Bearer " + token,
|
||||
"Content-type": "application/json",
|
||||
},
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
|
||||
export const post_token_form = (
|
||||
url: string,
|
||||
data: FormData,
|
||||
token: string,
|
||||
onProgress: (progressEvent: ProgressEvent) => void
|
||||
url: string,
|
||||
data: FormData,
|
||||
token: string,
|
||||
onProgress: (progressEvent: ProgressEvent) => void
|
||||
) =>
|
||||
axios
|
||||
.post(url, data, {
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + token,
|
||||
'Content-type': 'multipart/form-data'
|
||||
},
|
||||
onUploadProgress: onProgress
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
axios
|
||||
.post(url, data, {
|
||||
headers: {
|
||||
Authorization: "Bearer " + token,
|
||||
"Content-type": "multipart/form-data",
|
||||
},
|
||||
onUploadProgress: onProgress,
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
export const get = (url: string) =>
|
||||
axios
|
||||
.get(url)
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
axios
|
||||
.get(url)
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
|
||||
export const get_token = (url: string, token: string) =>
|
||||
axios
|
||||
.get(url, {
|
||||
headers: { Authorization: 'Bearer ' + token }
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
axios
|
||||
.get(url, {
|
||||
headers: { Authorization: "Bearer " + token },
|
||||
})
|
||||
.then((res) => res.data)
|
||||
.catch((err) => err.response.data);
|
||||
|
||||
export const isErrorResponse = (
|
||||
res: Responses.BaseResponse
|
||||
res: Responses.BaseResponse
|
||||
): res is Responses.ErrorResponse => res.statusCode != 200;
|
||||
|
||||
@ -1,89 +1,84 @@
|
||||
import {
|
||||
Responses,
|
||||
Requests,
|
||||
get_token,
|
||||
post_token,
|
||||
post_token_form,
|
||||
isErrorResponse
|
||||
} from './base';
|
||||
Responses,
|
||||
Requests,
|
||||
get_token,
|
||||
post_token,
|
||||
post_token_form,
|
||||
isErrorResponse,
|
||||
} from "./base";
|
||||
|
||||
export const get_root = (
|
||||
token: string
|
||||
token: string
|
||||
): Promise<Responses.FS.GetRootResponse | Responses.ErrorResponse> =>
|
||||
get_token('/api/fs/root', token);
|
||||
get_token("/api/fs/root", token);
|
||||
|
||||
export const get_node = (
|
||||
token: string,
|
||||
node: number
|
||||
token: string,
|
||||
node: number
|
||||
): Promise<Responses.FS.GetNodeResponse | Responses.ErrorResponse> =>
|
||||
get_token(`/api/fs/node/${node}`, token);
|
||||
get_token(`/api/fs/node/${node}`, token);
|
||||
|
||||
export const get_path = (
|
||||
token: string,
|
||||
node: number
|
||||
token: string,
|
||||
node: number
|
||||
): Promise<Responses.FS.GetPathResponse | Responses.ErrorResponse> =>
|
||||
get_token(`/api/fs/path/${node}`, token);
|
||||
get_token(`/api/fs/path/${node}`, token);
|
||||
|
||||
export const create_folder = (
|
||||
token: string,
|
||||
parent: number,
|
||||
name: string
|
||||
token: string,
|
||||
parent: number,
|
||||
name: string
|
||||
): Promise<Responses.FS.CreateFolderResponse | Responses.ErrorResponse> =>
|
||||
post_token<Requests.FS.CreateFolderRequest>(
|
||||
'/api/fs/createFolder',
|
||||
{
|
||||
parent: parent,
|
||||
name: name
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.FS.CreateFolderRequest>(
|
||||
"/api/fs/createFolder",
|
||||
{
|
||||
parent: parent,
|
||||
name: name,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const create_file = (
|
||||
token: string,
|
||||
parent: number,
|
||||
name: string
|
||||
token: string,
|
||||
parent: number,
|
||||
name: string
|
||||
): Promise<Responses.FS.CreateFileResponse | Responses.ErrorResponse> =>
|
||||
post_token<Requests.FS.CreateFileRequest>(
|
||||
'/api/fs/createFile',
|
||||
{
|
||||
parent: parent,
|
||||
name: name
|
||||
},
|
||||
token
|
||||
);
|
||||
post_token<Requests.FS.CreateFileRequest>(
|
||||
"/api/fs/createFile",
|
||||
{
|
||||
parent: parent,
|
||||
name: name,
|
||||
},
|
||||
token
|
||||
);
|
||||
|
||||
export const delete_node = (
|
||||
token: string,
|
||||
node: number
|
||||
token: string,
|
||||
node: number
|
||||
): Promise<Responses.FS.DeleteResponse | Responses.ErrorResponse> =>
|
||||
post_token(`/api/fs/delete/${node}`, {}, token);
|
||||
post_token(`/api/fs/delete/${node}`, {}, token);
|
||||
|
||||
export const upload_file = async (
|
||||
token: string,
|
||||
parent: number,
|
||||
file: File,
|
||||
onProgress: (progressEvent: ProgressEvent) => void
|
||||
token: string,
|
||||
parent: number,
|
||||
file: File,
|
||||
onProgress: (progressEvent: ProgressEvent) => void
|
||||
): Promise<Responses.FS.UploadFileResponse | Responses.ErrorResponse> => {
|
||||
const node = await create_file(token, parent, file.name);
|
||||
if (isErrorResponse(node)) return node;
|
||||
const node = await create_file(token, parent, file.name);
|
||||
if (isErrorResponse(node)) return node;
|
||||
|
||||
const form = new FormData();
|
||||
form.set('file', file);
|
||||
return post_token_form(
|
||||
`/api/fs/upload/${node.id}`,
|
||||
form,
|
||||
token,
|
||||
onProgress
|
||||
);
|
||||
const form = new FormData();
|
||||
form.set("file", file);
|
||||
return post_token_form(`/api/fs/upload/${node.id}`, form, token, onProgress);
|
||||
};
|
||||
|
||||
export function download_file(token: string, id: number) {
|
||||
const form = document.createElement('form');
|
||||
form.method = 'post';
|
||||
form.target = '_blank';
|
||||
form.action = '/api/fs/download';
|
||||
form.innerHTML = `<input type="hidden" name="jwtToken" value="${token}"><input type="hidden" name="id" value="${id}">`;
|
||||
document.body.appendChild(form);
|
||||
form.submit();
|
||||
document.body.removeChild(form);
|
||||
const form = document.createElement("form");
|
||||
form.method = "post";
|
||||
form.target = "_blank";
|
||||
form.action = "/api/fs/download";
|
||||
form.innerHTML = `<input type="hidden" name="jwtToken" value="${token}"><input type="hidden" name="id" value="${id}">`;
|
||||
document.body.appendChild(form);
|
||||
form.submit();
|
||||
document.body.removeChild(form);
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
export { Requests, Responses, UserRole, isErrorResponse } from './base';
|
||||
export * as Auth from './auth';
|
||||
export * as FS from './fs';
|
||||
export * as User from './user';
|
||||
export * as Admin from './admin';
|
||||
export * from './util';
|
||||
export { Requests, Responses, UserRole, isErrorResponse } from "./base";
|
||||
export * as Auth from "./auth";
|
||||
export * as FS from "./fs";
|
||||
export * as User from "./user";
|
||||
export * as Admin from "./admin";
|
||||
export * from "./util";
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import { Responses, get_token, post_token } from '@/api/base';
|
||||
import { Responses, get_token, post_token } from "@/api/base";
|
||||
|
||||
export const get_user_info = (
|
||||
token: string
|
||||
token: string
|
||||
): Promise<Responses.User.UserInfoResponse | Responses.ErrorResponse> =>
|
||||
get_token('/api/user/info', token);
|
||||
get_token("/api/user/info", token);
|
||||
|
||||
export const delete_user = (
|
||||
token: string
|
||||
token: string
|
||||
): Promise<Responses.User.DeleteUserResponse | Responses.ErrorResponse> =>
|
||||
post_token('/api/user/delete', {}, token);
|
||||
post_token("/api/user/delete", {}, token);
|
||||
|
||||
@ -1,25 +1,26 @@
|
||||
import jwtDecode, { JwtPayload } from 'jwt-decode';
|
||||
import { Ref, UnwrapRef } from 'vue';
|
||||
import { isErrorResponse } from './base';
|
||||
import { refresh_token } from './auth';
|
||||
import type { JwtPayload } from "jwt-decode";
|
||||
import type { Ref, UnwrapRef } from "vue";
|
||||
import jwtDecode from "jwt-decode";
|
||||
import { isErrorResponse } from "./base";
|
||||
import { refresh_token } from "./auth";
|
||||
|
||||
export async function check_token(
|
||||
token: TokenInjectType
|
||||
token: TokenInjectType
|
||||
): Promise<string | void> {
|
||||
if (!token.jwt.value) return token.logout();
|
||||
const payload = jwtDecode<JwtPayload>(token.jwt.value);
|
||||
if (!payload) return token.logout();
|
||||
// Expires in more than 60 Minute
|
||||
if (payload.exp && payload.exp > Math.floor(Date.now() / 1000 + 60 * 60))
|
||||
return token.jwt.value;
|
||||
const new_token = await refresh_token(token.jwt.value);
|
||||
if (isErrorResponse(new_token)) return token.logout();
|
||||
token.setToken(new_token.jwt);
|
||||
return new_token.jwt;
|
||||
if (!token.jwt.value) return token.logout();
|
||||
const payload = jwtDecode<JwtPayload>(token.jwt.value);
|
||||
if (!payload) return token.logout();
|
||||
// Expires in more than 60 Minute
|
||||
if (payload.exp && payload.exp > Math.floor(Date.now() / 1000 + 60 * 60))
|
||||
return token.jwt.value;
|
||||
const new_token = await refresh_token(token.jwt.value);
|
||||
if (isErrorResponse(new_token)) return token.logout();
|
||||
token.setToken(new_token.jwt);
|
||||
return new_token.jwt;
|
||||
}
|
||||
|
||||
export type TokenInjectType = {
|
||||
jwt: Ref<UnwrapRef<string | null>>;
|
||||
setToken: (token: string) => void;
|
||||
logout: () => void;
|
||||
jwt: Ref<UnwrapRef<string | null>>;
|
||||
setToken: (token: string) => void;
|
||||
logout: () => void;
|
||||
};
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 6.7 KiB |
1
frontend/src/assets/logo.svg
Normal file
1
frontend/src/assets/logo.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69" xmlns:v="https://vecta.io/nano"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
|
||||
|
After Width: | Height: | Size: 308 B |
@ -1,40 +1,41 @@
|
||||
<script setup lang="ts">
|
||||
import { defineEmits, defineProps, inject } from 'vue';
|
||||
import { check_token, FS, Responses, TokenInjectType } from '@/api';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { defineEmits, defineProps, inject } from "vue";
|
||||
import { check_token, FS, Responses } from "@/api";
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
const props = defineProps<{
|
||||
node: Responses.FS.GetNodeResponse;
|
||||
node: Responses.FS.GetNodeResponse;
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'reloadNode'): void;
|
||||
(e: "reloadNode"): void;
|
||||
}>();
|
||||
|
||||
async function del() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await FS.delete_node(token, props.node.id);
|
||||
emit('reloadNode');
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await FS.delete_node(token, props.node.id);
|
||||
emit("reloadNode");
|
||||
}
|
||||
|
||||
async function download() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
FS.download_file(token, props.node.id);
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
FS.download_file(token, props.node.id);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<td>
|
||||
<router-link :to="'/fs/' + props.node.id">{{ node.name }}</router-link>
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" @click="download()" v-if="props.node.isFile">Download</a>
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" @click="del()" v-if="props.node.name !== '..'">delete</a>
|
||||
</td>
|
||||
<td>
|
||||
<router-link :to="'/fs/' + props.node.id">{{ node.name }}</router-link>
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" @click="download()" v-if="props.node.isFile">Download</a>
|
||||
</td>
|
||||
<td>
|
||||
<a href="#" @click="del()" v-if="props.node.name !== '..'">delete</a>
|
||||
</td>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,108 +1,102 @@
|
||||
<script setup lang="ts">
|
||||
import { defineEmits, defineProps, inject, reactive, ref, watch } from 'vue';
|
||||
import { FS, Responses, check_token, TokenInjectType } from '@/api';
|
||||
import DirEntry from '@/components/FSView/DirEntry.vue';
|
||||
import UploadFileDialog from '@/components/UploadDialog/UploadFileDialog.vue';
|
||||
import { NModal } from 'naive-ui';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { defineEmits, defineProps, inject, reactive, ref, watch } from "vue";
|
||||
import { FS, Responses, check_token } from "@/api";
|
||||
import DirEntry from "@/components/FSView/DirEntry.vue";
|
||||
import UploadFileDialog from "@/components/UploadDialog/UploadFileDialog.vue";
|
||||
import { NModal } from "naive-ui";
|
||||
|
||||
const props = defineProps<{
|
||||
node: Responses.FS.GetNodeResponse;
|
||||
node: Responses.FS.GetNodeResponse;
|
||||
}>();
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: 'reloadNode'): void;
|
||||
(e: 'gotoRoot'): void;
|
||||
(e: "reloadNode"): void;
|
||||
(e: "gotoRoot"): void;
|
||||
}>();
|
||||
|
||||
const fileInput = ref<HTMLInputElement>();
|
||||
const uploadDialog = ref();
|
||||
const uploadDialogShow = ref(false);
|
||||
|
||||
const new_folder_name = ref('');
|
||||
const new_folder_name = ref("");
|
||||
const files = ref<File[]>([]);
|
||||
const nodes = ref<Responses.FS.GetNodeResponse[]>([]);
|
||||
const hasParent = ref(false);
|
||||
const parentNode = reactive<Responses.FS.GetNodeResponse>({
|
||||
id: 0,
|
||||
statusCode: 200,
|
||||
isFile: false,
|
||||
parent: null,
|
||||
name: '..'
|
||||
id: 0,
|
||||
statusCode: 200,
|
||||
isFile: false,
|
||||
parent: null,
|
||||
name: "..",
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.node,
|
||||
async (to) => {
|
||||
parentNode.id = to.parent ?? 0;
|
||||
hasParent.value = to.parent != null;
|
||||
nodes.value = [];
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Promise.all(
|
||||
to.children?.map(async (child) => {
|
||||
nodes.value.push(
|
||||
(await FS.get_node(
|
||||
token,
|
||||
child
|
||||
)) as Responses.FS.GetNodeResponse
|
||||
);
|
||||
}) ?? []
|
||||
);
|
||||
},
|
||||
{ immediate: true }
|
||||
() => props.node,
|
||||
async (to) => {
|
||||
parentNode.id = to.parent ?? 0;
|
||||
hasParent.value = to.parent != null;
|
||||
nodes.value = [];
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Promise.all(
|
||||
to.children?.map(async (child) => {
|
||||
nodes.value.push(
|
||||
(await FS.get_node(token, child)) as Responses.FS.GetNodeResponse
|
||||
);
|
||||
}) ?? []
|
||||
);
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
async function newFolder() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await FS.create_folder(token, props.node.id, new_folder_name.value);
|
||||
emit('reloadNode');
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await FS.create_folder(token, props.node.id, new_folder_name.value);
|
||||
emit("reloadNode");
|
||||
}
|
||||
|
||||
async function uploadFiles() {
|
||||
files.value = Array.from(fileInput.value?.files ?? []);
|
||||
if (files.value.length == 0) return;
|
||||
uploadDialogShow.value = true;
|
||||
files.value = Array.from(fileInput.value?.files ?? []);
|
||||
if (files.value.length == 0) return;
|
||||
uploadDialogShow.value = true;
|
||||
}
|
||||
async function uploadFilesDialogOpen() {
|
||||
await uploadDialog.value?.startUpload(props.node.id);
|
||||
uploadDialogShow.value = false;
|
||||
if (fileInput.value) fileInput.value.value = '';
|
||||
emit('reloadNode');
|
||||
await uploadDialog.value?.startUpload(props.node.id);
|
||||
uploadDialogShow.value = false;
|
||||
if (fileInput.value) fileInput.value.value = "";
|
||||
emit("reloadNode");
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Folder name"
|
||||
v-model="new_folder_name"
|
||||
/>
|
||||
<a href="#" @click="newFolder()">create folder</a>
|
||||
</div>
|
||||
<div>
|
||||
<input type="file" ref="fileInput" multiple />
|
||||
<a href="#" @click="uploadFiles()">upload files</a>
|
||||
</div>
|
||||
<table>
|
||||
<tr v-if="hasParent">
|
||||
<DirEntry :node="parentNode" @reloadNode="emit('reloadNode')" />
|
||||
</tr>
|
||||
<tr v-for="n in nodes" :key="n.id">
|
||||
<DirEntry :node="n" @reloadNode="emit('reloadNode')" />
|
||||
</tr>
|
||||
</table>
|
||||
<n-modal
|
||||
v-model:show="uploadDialogShow"
|
||||
:close-on-esc="false"
|
||||
:mask-closable="false"
|
||||
:on-after-enter="uploadFilesDialogOpen"
|
||||
>
|
||||
<UploadFileDialog ref="uploadDialog" :files="files" />
|
||||
</n-modal>
|
||||
<div>
|
||||
<input type="text" placeholder="Folder name" v-model="new_folder_name" />
|
||||
<a href="#" @click="newFolder()">create folder</a>
|
||||
</div>
|
||||
<div>
|
||||
<input type="file" ref="fileInput" multiple />
|
||||
<a href="#" @click="uploadFiles()">upload files</a>
|
||||
</div>
|
||||
<table>
|
||||
<tr v-if="hasParent">
|
||||
<DirEntry :node="parentNode" @reloadNode="emit('reloadNode')" />
|
||||
</tr>
|
||||
<tr v-for="n in nodes" :key="n.id">
|
||||
<DirEntry :node="n" @reloadNode="emit('reloadNode')" />
|
||||
</tr>
|
||||
</table>
|
||||
<n-modal
|
||||
v-model:show="uploadDialogShow"
|
||||
:close-on-esc="false"
|
||||
:mask-closable="false"
|
||||
:on-after-enter="uploadFilesDialogOpen"
|
||||
>
|
||||
<UploadFileDialog ref="uploadDialog" :files="files" />
|
||||
</n-modal>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,38 +1,39 @@
|
||||
<script setup lang="ts">
|
||||
import { defineProps, inject } from 'vue';
|
||||
import { check_token, FS, Responses, TokenInjectType } from '@/api';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { defineProps, inject } from "vue";
|
||||
import { check_token, FS, Responses } from "@/api";
|
||||
|
||||
const props = defineProps<{
|
||||
node: Responses.FS.GetNodeResponse;
|
||||
node: Responses.FS.GetNodeResponse;
|
||||
}>();
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
async function del() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await FS.delete_node(token, props.node.id);
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await FS.delete_node(token, props.node.id);
|
||||
}
|
||||
|
||||
async function download() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
FS.download_file(token, props.node.id);
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
FS.download_file(token, props.node.id);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<router-link :to="'/fs/' + props.node.parent ?? 0">..</router-link>
|
||||
</div>
|
||||
<div>
|
||||
<a href="#" @click="download()" v-if="props.node.isFile">Download</a>
|
||||
</div>
|
||||
<div>
|
||||
<router-link :to="'/fs/' + props.node.parent ?? 0" @click="del()">
|
||||
delete
|
||||
</router-link>
|
||||
</div>
|
||||
<div>
|
||||
<router-link :to="'/fs/' + props.node.parent ?? 0">..</router-link>
|
||||
</div>
|
||||
<div>
|
||||
<a href="#" @click="download()" v-if="props.node.isFile">Download</a>
|
||||
</div>
|
||||
<div>
|
||||
<router-link :to="'/fs/' + props.node.parent ?? 0" @click="del()">
|
||||
delete
|
||||
</router-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,156 +1,140 @@
|
||||
<template>
|
||||
<div class="hello">
|
||||
<h1>{{ msg }}</h1>
|
||||
<p>
|
||||
For a guide and recipes on how to configure / customize this
|
||||
project,<br />
|
||||
check out the
|
||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-cli documentation</a
|
||||
>.
|
||||
</p>
|
||||
<h3>Installed CLI Plugins</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>babel</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>router</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vuex</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>eslint</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>typescript</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Essential Links</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://vuejs.org" target="_blank" rel="noopener"
|
||||
>Core Docs</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://forum.vuejs.org" target="_blank" rel="noopener"
|
||||
>Forum</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://chat.vuejs.org" target="_blank" rel="noopener"
|
||||
>Community Chat</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://twitter.com/vuejs"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>Twitter</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://news.vuejs.org" target="_blank" rel="noopener"
|
||||
>News</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Ecosystem</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href="https://router.vuejs.org"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vue-router</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://vuex.vuejs.org" target="_blank" rel="noopener"
|
||||
>vuex</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-devtools#vue-devtools"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vue-devtools</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://vue-loader.vuejs.org"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vue-loader</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/awesome-vue"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>awesome-vue</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="hello">
|
||||
<h1>{{ msg }}</h1>
|
||||
<p>
|
||||
For a guide and recipes on how to configure / customize this project,<br />
|
||||
check out the
|
||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-cli documentation</a
|
||||
>.
|
||||
</p>
|
||||
<h3>Installed CLI Plugins</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>babel</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>router</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vuex</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>eslint</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>typescript</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Essential Links</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://forum.vuejs.org" target="_blank" rel="noopener"
|
||||
>Forum</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://chat.vuejs.org" target="_blank" rel="noopener"
|
||||
>Community Chat</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
|
||||
>Twitter</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h3>Ecosystem</h3>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://router.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-router</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/vue-devtools#vue-devtools"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>vue-devtools</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
|
||||
>vue-loader</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/vuejs/awesome-vue"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>awesome-vue</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { defineComponent } from "vue";
|
||||
|
||||
export default defineComponent({
|
||||
name: 'HelloWorld',
|
||||
props: {
|
||||
msg: String
|
||||
}
|
||||
name: "HelloWorld",
|
||||
props: {
|
||||
msg: String,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped lang="scss">
|
||||
h3 {
|
||||
margin: 40px 0 0;
|
||||
margin: 40px 0 0;
|
||||
}
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
li {
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
display: inline-block;
|
||||
margin: 0 10px;
|
||||
}
|
||||
a {
|
||||
color: #42b983;
|
||||
color: #42b983;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,51 +1,52 @@
|
||||
<script setup lang="ts">
|
||||
import { defineProps, defineExpose, ref } from 'vue';
|
||||
import { isErrorResponse, FS } from '@/api';
|
||||
import { NProgress } from 'naive-ui';
|
||||
import filesize from 'filesize';
|
||||
import type { Status } from "naive-ui/es/progress/src/interface";
|
||||
import { defineProps, defineExpose, ref } from "vue";
|
||||
import { isErrorResponse, FS } from "@/api";
|
||||
import { NProgress } from "naive-ui";
|
||||
import filesize from "filesize";
|
||||
|
||||
const props = defineProps<{
|
||||
file: File;
|
||||
file: File;
|
||||
}>();
|
||||
|
||||
const progress = ref(0);
|
||||
const percentage = ref(0);
|
||||
const err = ref('');
|
||||
const status = ref('info');
|
||||
const err = ref("");
|
||||
const status = ref<Status>("info");
|
||||
|
||||
async function startUpload(parent: number, token: string) {
|
||||
const resp = await FS.upload_file(token, parent, props.file, (e) => {
|
||||
progress.value = e.loaded;
|
||||
percentage.value = (e.loaded / e.total) * 100;
|
||||
});
|
||||
percentage.value = 100;
|
||||
if (isErrorResponse(resp)) {
|
||||
err.value = resp.message ?? 'Error';
|
||||
status.value = 'error';
|
||||
} else status.value = 'success';
|
||||
const resp = await FS.upload_file(token, parent, props.file, (e) => {
|
||||
progress.value = e.loaded;
|
||||
percentage.value = (e.loaded / e.total) * 100;
|
||||
});
|
||||
percentage.value = 100;
|
||||
if (isErrorResponse(resp)) {
|
||||
err.value = resp.message ?? "Error";
|
||||
status.value = "error";
|
||||
} else status.value = "success";
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
startUpload
|
||||
startUpload,
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="percentage < 100">
|
||||
{{ file.name }} - {{ filesize(progress) }} / {{ filesize(file.size) }} -
|
||||
{{ Math.floor(percentage * 1000) / 1000 }}%
|
||||
</div>
|
||||
<div v-else-if="err !== ''">{{ file.name }} - Error: {{ err }}</div>
|
||||
<div v-else>{{ file.name }} - Completed</div>
|
||||
<n-progress
|
||||
type="line"
|
||||
:percentage="percentage"
|
||||
:height="20"
|
||||
:status="status"
|
||||
border-radius="10px 0"
|
||||
fill-border-radius="10px 0"
|
||||
:show-indicator="false"
|
||||
/>
|
||||
<div v-if="percentage < 100">
|
||||
{{ file.name }} - {{ filesize(progress) }} / {{ filesize(file.size) }} -
|
||||
{{ Math.floor(percentage * 1000) / 1000 }}%
|
||||
</div>
|
||||
<div v-else-if="err !== ''">{{ file.name }} - Error: {{ err }}</div>
|
||||
<div v-else>{{ file.name }} - Completed</div>
|
||||
<n-progress
|
||||
type="line"
|
||||
:percentage="percentage"
|
||||
:height="20"
|
||||
:status="status"
|
||||
border-radius="10px 0"
|
||||
fill-border-radius="10px 0"
|
||||
:show-indicator="false"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,48 +1,44 @@
|
||||
<script setup lang="ts">
|
||||
import { defineProps, defineExpose, ref, inject } from 'vue';
|
||||
import { check_token, TokenInjectType } from '@/api';
|
||||
import UploadEntry from '@/components/UploadDialog/UploadEntry.vue';
|
||||
import { NCard } from 'naive-ui';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { defineProps, defineExpose, ref, inject } from "vue";
|
||||
import { check_token } from "@/api";
|
||||
import UploadEntry from "@/components/UploadDialog/UploadEntry.vue";
|
||||
import { NCard } from "naive-ui";
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
const entries = ref<typeof UploadEntry[]>([]);
|
||||
const done = ref(false);
|
||||
let canCloseResolve = null;
|
||||
let canCloseResolve: (value: unknown) => void = () => null;
|
||||
const canClose = new Promise((r) => (canCloseResolve = r));
|
||||
|
||||
async function startUpload(parent: number) {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Promise.all(
|
||||
entries.value.map((entry) => entry.startUpload(parent, token))
|
||||
);
|
||||
done.value = true;
|
||||
await canClose;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Promise.all(
|
||||
entries.value.map((entry) => entry.startUpload(parent, token))
|
||||
);
|
||||
done.value = true;
|
||||
await canClose;
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
startUpload
|
||||
startUpload,
|
||||
});
|
||||
defineProps<{
|
||||
files: File[];
|
||||
files: File[];
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<n-card title="Upload Files">
|
||||
<div>
|
||||
<UploadEntry
|
||||
v-for="f in files"
|
||||
:key="f.name"
|
||||
ref="entries"
|
||||
:file="f"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<button v-if="done" @click="canCloseResolve()">Close</button>
|
||||
</div>
|
||||
</n-card>
|
||||
<n-card title="Upload Files">
|
||||
<div>
|
||||
<UploadEntry v-for="f in files" :key="f.name" ref="entries" :file="f" />
|
||||
</div>
|
||||
<div>
|
||||
<button v-if="done" @click="canCloseResolve(null)">Close</button>
|
||||
</div>
|
||||
</n-card>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
export * as Requests from './requests';
|
||||
export * as Responses from './responses';
|
||||
export * as Requests from "./requests";
|
||||
export * as Responses from "./responses";
|
||||
export {
|
||||
UserRole,
|
||||
validateSync,
|
||||
validateAsync,
|
||||
validateAsyncInline
|
||||
} from './utils';
|
||||
UserRole,
|
||||
validateSync,
|
||||
validateAsync,
|
||||
validateAsyncInline,
|
||||
} from "./utils";
|
||||
|
||||
@ -1,15 +1,15 @@
|
||||
import { BaseRequest } from './base';
|
||||
import { IsEnum, IsNumber } from 'class-validator';
|
||||
import { UserRole } from '@/dto';
|
||||
import { BaseRequest } from "./base";
|
||||
import { IsEnum, IsNumber } from "class-validator";
|
||||
import { UserRole } from "@/dto";
|
||||
|
||||
export class AdminRequest extends BaseRequest {
|
||||
@IsNumber()
|
||||
user: number;
|
||||
@IsNumber()
|
||||
user: number;
|
||||
}
|
||||
|
||||
export class SetUserRole extends AdminRequest {
|
||||
@IsEnum(UserRole)
|
||||
role: UserRole;
|
||||
@IsEnum(UserRole)
|
||||
role: UserRole;
|
||||
}
|
||||
|
||||
export class LogoutAll extends AdminRequest {}
|
||||
|
||||
@ -1,50 +1,50 @@
|
||||
import { BaseRequest } from './base';
|
||||
import { BaseRequest } from "./base";
|
||||
import {
|
||||
IsBoolean,
|
||||
IsEmail,
|
||||
IsNotEmpty,
|
||||
IsOptional,
|
||||
IsString
|
||||
} from 'class-validator';
|
||||
IsBoolean,
|
||||
IsEmail,
|
||||
IsNotEmpty,
|
||||
IsOptional,
|
||||
IsString,
|
||||
} from "class-validator";
|
||||
|
||||
export class SignUpRequest extends BaseRequest {
|
||||
@IsEmail()
|
||||
username: string;
|
||||
@IsEmail()
|
||||
username: string;
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
password: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
password: string;
|
||||
}
|
||||
|
||||
export class LoginRequest extends SignUpRequest {
|
||||
@IsOptional()
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
otp?: string;
|
||||
@IsOptional()
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
otp?: string;
|
||||
}
|
||||
|
||||
export class TfaSetup extends BaseRequest {
|
||||
@IsNotEmpty()
|
||||
@IsBoolean()
|
||||
mail: boolean;
|
||||
@IsNotEmpty()
|
||||
@IsBoolean()
|
||||
mail: boolean;
|
||||
}
|
||||
|
||||
export class TfaComplete extends BaseRequest {
|
||||
@IsNotEmpty()
|
||||
@IsBoolean()
|
||||
mail: boolean;
|
||||
@IsNotEmpty()
|
||||
@IsBoolean()
|
||||
mail: boolean;
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
code: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
code: string;
|
||||
}
|
||||
|
||||
export class ChangePasswordRequest extends BaseRequest {
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
oldPassword: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
oldPassword: string;
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
newPassword: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
newPassword: string;
|
||||
}
|
||||
|
||||
@ -1,14 +1,14 @@
|
||||
import { BaseRequest } from './base';
|
||||
import { IsInt, IsNotEmpty, IsString, Min } from 'class-validator';
|
||||
import { BaseRequest } from "./base";
|
||||
import { IsInt, IsNotEmpty, IsString, Min } from "class-validator";
|
||||
|
||||
export class CreateFolderRequest extends BaseRequest {
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
parent: number;
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
parent: number;
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
name: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
name: string;
|
||||
}
|
||||
|
||||
export class CreateFileRequest extends CreateFolderRequest {}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
export * from './base';
|
||||
export * as Auth from './auth';
|
||||
export * as FS from './fs';
|
||||
export * as Admin from './admin';
|
||||
export * from "./base";
|
||||
export * as Auth from "./auth";
|
||||
export * as FS from "./fs";
|
||||
export * as Admin from "./admin";
|
||||
|
||||
@ -1,58 +1,58 @@
|
||||
import { SuccessResponse } from './base';
|
||||
import { SuccessResponse } from "./base";
|
||||
import {
|
||||
IsArray,
|
||||
IsBoolean,
|
||||
IsEnum,
|
||||
IsNotEmpty,
|
||||
IsNumber,
|
||||
IsString,
|
||||
ValidateNested
|
||||
} from 'class-validator';
|
||||
import { UserRole, ValidateConstructor } from '../utils';
|
||||
IsArray,
|
||||
IsBoolean,
|
||||
IsEnum,
|
||||
IsNotEmpty,
|
||||
IsNumber,
|
||||
IsString,
|
||||
ValidateNested,
|
||||
} from "class-validator";
|
||||
import { UserRole, ValidateConstructor } from "../utils";
|
||||
|
||||
@ValidateConstructor
|
||||
export class GetUsersEntry {
|
||||
constructor(
|
||||
id: number,
|
||||
gitlab: boolean,
|
||||
name: string,
|
||||
role: UserRole,
|
||||
tfaEnabled: boolean
|
||||
) {
|
||||
this.id = id;
|
||||
this.gitlab = gitlab;
|
||||
this.name = name;
|
||||
this.role = role;
|
||||
this.tfaEnabled = tfaEnabled;
|
||||
}
|
||||
constructor(
|
||||
id: number,
|
||||
gitlab: boolean,
|
||||
name: string,
|
||||
role: UserRole,
|
||||
tfaEnabled: boolean
|
||||
) {
|
||||
this.id = id;
|
||||
this.gitlab = gitlab;
|
||||
this.name = name;
|
||||
this.role = role;
|
||||
this.tfaEnabled = tfaEnabled;
|
||||
}
|
||||
|
||||
@IsNumber()
|
||||
id: number;
|
||||
@IsNumber()
|
||||
id: number;
|
||||
|
||||
@IsBoolean()
|
||||
gitlab: boolean;
|
||||
@IsBoolean()
|
||||
gitlab: boolean;
|
||||
|
||||
@IsString()
|
||||
@IsNotEmpty()
|
||||
name: string;
|
||||
@IsString()
|
||||
@IsNotEmpty()
|
||||
name: string;
|
||||
|
||||
@IsEnum(UserRole)
|
||||
role: UserRole;
|
||||
@IsEnum(UserRole)
|
||||
role: UserRole;
|
||||
|
||||
@IsBoolean()
|
||||
tfaEnabled: boolean;
|
||||
@IsBoolean()
|
||||
tfaEnabled: boolean;
|
||||
}
|
||||
|
||||
@ValidateConstructor
|
||||
export class GetUsers extends SuccessResponse {
|
||||
constructor(users: GetUsersEntry[]) {
|
||||
super();
|
||||
this.users = users;
|
||||
}
|
||||
constructor(users: GetUsersEntry[]) {
|
||||
super();
|
||||
this.users = users;
|
||||
}
|
||||
|
||||
@IsArray()
|
||||
@ValidateNested({ each: true })
|
||||
users: GetUsersEntry[];
|
||||
@IsArray()
|
||||
@ValidateNested({ each: true })
|
||||
users: GetUsersEntry[];
|
||||
}
|
||||
|
||||
export class LogoutAllUser extends SuccessResponse {}
|
||||
|
||||
@ -1,33 +1,33 @@
|
||||
import { SuccessResponse } from './base';
|
||||
import { IsBase32, IsJWT, IsNotEmpty } from 'class-validator';
|
||||
import { ValidateConstructor } from '../utils';
|
||||
import { SuccessResponse } from "./base";
|
||||
import { IsBase32, IsJWT, IsNotEmpty } from "class-validator";
|
||||
import { ValidateConstructor } from "../utils";
|
||||
|
||||
@ValidateConstructor
|
||||
export class LoginResponse extends SuccessResponse {
|
||||
constructor(jwt: string) {
|
||||
super();
|
||||
this.jwt = jwt;
|
||||
}
|
||||
constructor(jwt: string) {
|
||||
super();
|
||||
this.jwt = jwt;
|
||||
}
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsJWT()
|
||||
jwt: string;
|
||||
@IsNotEmpty()
|
||||
@IsJWT()
|
||||
jwt: string;
|
||||
}
|
||||
|
||||
@ValidateConstructor
|
||||
export class RequestTotpTfaResponse extends SuccessResponse {
|
||||
constructor(qrCode: string, secret: string) {
|
||||
super();
|
||||
this.qrCode = qrCode;
|
||||
this.secret = secret;
|
||||
}
|
||||
constructor(qrCode: string, secret: string) {
|
||||
super();
|
||||
this.qrCode = qrCode;
|
||||
this.secret = secret;
|
||||
}
|
||||
|
||||
@IsNotEmpty()
|
||||
qrCode: string;
|
||||
@IsNotEmpty()
|
||||
qrCode: string;
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsBase32()
|
||||
secret: string;
|
||||
@IsNotEmpty()
|
||||
@IsBase32()
|
||||
secret: string;
|
||||
}
|
||||
|
||||
export class TfaRequiredResponse extends SuccessResponse {}
|
||||
|
||||
@ -1,25 +1,25 @@
|
||||
import { IsNumber, Max, Min } from 'class-validator';
|
||||
import { IsNumber, Max, Min } from "class-validator";
|
||||
|
||||
export class BaseResponse {
|
||||
constructor(statusCode: number) {
|
||||
this.statusCode = statusCode;
|
||||
}
|
||||
constructor(statusCode: number) {
|
||||
this.statusCode = statusCode;
|
||||
}
|
||||
|
||||
@IsNumber()
|
||||
@Min(100)
|
||||
@Max(599)
|
||||
statusCode: number;
|
||||
@IsNumber()
|
||||
@Min(100)
|
||||
@Max(599)
|
||||
statusCode: number;
|
||||
}
|
||||
|
||||
export class SuccessResponse extends BaseResponse {
|
||||
constructor() {
|
||||
super(200);
|
||||
}
|
||||
constructor() {
|
||||
super(200);
|
||||
}
|
||||
|
||||
declare statusCode: 200;
|
||||
declare statusCode: 200;
|
||||
}
|
||||
|
||||
export class ErrorResponse extends BaseResponse {
|
||||
declare statusCode: 400 | 401 | 403;
|
||||
message?: string;
|
||||
declare statusCode: 400 | 401 | 403;
|
||||
message?: string;
|
||||
}
|
||||
|
||||
@ -1,87 +1,87 @@
|
||||
import { SuccessResponse } from './base';
|
||||
import { SuccessResponse } from "./base";
|
||||
import {
|
||||
IsBoolean,
|
||||
IsInt,
|
||||
IsNotEmpty,
|
||||
IsOptional,
|
||||
IsString,
|
||||
Min
|
||||
} from 'class-validator';
|
||||
import { ValidateConstructor } from '../utils';
|
||||
IsBoolean,
|
||||
IsInt,
|
||||
IsNotEmpty,
|
||||
IsOptional,
|
||||
IsString,
|
||||
Min,
|
||||
} from "class-validator";
|
||||
import { ValidateConstructor } from "../utils";
|
||||
|
||||
@ValidateConstructor
|
||||
export class GetRootResponse extends SuccessResponse {
|
||||
constructor(rootId: number) {
|
||||
super();
|
||||
this.rootId = rootId;
|
||||
}
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
rootId: number;
|
||||
constructor(rootId: number) {
|
||||
super();
|
||||
this.rootId = rootId;
|
||||
}
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
rootId: number;
|
||||
}
|
||||
|
||||
export class GetNodeResponse extends SuccessResponse {
|
||||
constructor(
|
||||
id: number,
|
||||
name: string,
|
||||
isFile: boolean,
|
||||
parent: number | null
|
||||
) {
|
||||
super();
|
||||
this.id = id;
|
||||
this.name = name;
|
||||
this.isFile = isFile;
|
||||
this.parent = parent;
|
||||
}
|
||||
constructor(
|
||||
id: number,
|
||||
name: string,
|
||||
isFile: boolean,
|
||||
parent: number | null
|
||||
) {
|
||||
super();
|
||||
this.id = id;
|
||||
this.name = name;
|
||||
this.isFile = isFile;
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
id: number;
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
id: number;
|
||||
|
||||
@IsString()
|
||||
name: string;
|
||||
@IsString()
|
||||
name: string;
|
||||
|
||||
@IsBoolean()
|
||||
isFile: boolean;
|
||||
@IsBoolean()
|
||||
isFile: boolean;
|
||||
|
||||
@IsOptional()
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
parent: number | null;
|
||||
@IsOptional()
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
parent: number | null;
|
||||
|
||||
@IsOptional()
|
||||
@IsInt({ each: true })
|
||||
@Min(1, { each: true })
|
||||
children?: number[];
|
||||
@IsOptional()
|
||||
@IsInt({ each: true })
|
||||
@Min(1, { each: true })
|
||||
children?: number[];
|
||||
|
||||
@IsOptional()
|
||||
@IsInt()
|
||||
@Min(0)
|
||||
size?: number;
|
||||
@IsOptional()
|
||||
@IsInt()
|
||||
@Min(0)
|
||||
size?: number;
|
||||
}
|
||||
|
||||
@ValidateConstructor
|
||||
export class GetPathResponse extends SuccessResponse {
|
||||
constructor(path: string) {
|
||||
super();
|
||||
this.path = path;
|
||||
}
|
||||
constructor(path: string) {
|
||||
super();
|
||||
this.path = path;
|
||||
}
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
path: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
path: string;
|
||||
}
|
||||
|
||||
@ValidateConstructor
|
||||
export class CreateFolderResponse extends SuccessResponse {
|
||||
constructor(id: number) {
|
||||
super();
|
||||
this.id = id;
|
||||
}
|
||||
constructor(id: number) {
|
||||
super();
|
||||
this.id = id;
|
||||
}
|
||||
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
id: number;
|
||||
@IsInt()
|
||||
@Min(1)
|
||||
id: number;
|
||||
}
|
||||
|
||||
export class UploadFileResponse extends SuccessResponse {}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
export * from './base';
|
||||
export * as Auth from './auth';
|
||||
export * as FS from './fs';
|
||||
export * as User from './user';
|
||||
export * as Admin from './admin';
|
||||
export * from "./base";
|
||||
export * as Auth from "./auth";
|
||||
export * as FS from "./fs";
|
||||
export * as User from "./user";
|
||||
export * as Admin from "./admin";
|
||||
|
||||
@ -1,25 +1,25 @@
|
||||
import { SuccessResponse } from './base';
|
||||
import { ValidateConstructor } from '../utils';
|
||||
import { IsBoolean, IsNotEmpty, IsString } from 'class-validator';
|
||||
import { SuccessResponse } from "./base";
|
||||
import { ValidateConstructor } from "../utils";
|
||||
import { IsBoolean, IsNotEmpty, IsString } from "class-validator";
|
||||
|
||||
@ValidateConstructor
|
||||
export class UserInfoResponse extends SuccessResponse {
|
||||
constructor(name: string, gitlab: boolean, tfaEnabled: boolean) {
|
||||
super();
|
||||
this.name = name;
|
||||
this.gitlab = gitlab;
|
||||
this.tfaEnabled = tfaEnabled;
|
||||
}
|
||||
constructor(name: string, gitlab: boolean, tfaEnabled: boolean) {
|
||||
super();
|
||||
this.name = name;
|
||||
this.gitlab = gitlab;
|
||||
this.tfaEnabled = tfaEnabled;
|
||||
}
|
||||
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
name: string;
|
||||
@IsNotEmpty()
|
||||
@IsString()
|
||||
name: string;
|
||||
|
||||
@IsBoolean()
|
||||
gitlab: boolean;
|
||||
@IsBoolean()
|
||||
gitlab: boolean;
|
||||
|
||||
@IsBoolean()
|
||||
tfaEnabled: boolean;
|
||||
@IsBoolean()
|
||||
tfaEnabled: boolean;
|
||||
}
|
||||
|
||||
export class DeleteUserResponse extends SuccessResponse {}
|
||||
|
||||
@ -1,43 +1,43 @@
|
||||
import { validate, validateSync as _validateSync } from 'class-validator';
|
||||
import { validate, validateSync as _validateSync } from "class-validator";
|
||||
|
||||
export enum UserRole {
|
||||
ADMIN = 2,
|
||||
USER = 1,
|
||||
DISABLED = 0
|
||||
ADMIN = 2,
|
||||
USER = 1,
|
||||
DISABLED = 0,
|
||||
}
|
||||
|
||||
export function validateSync<T extends object>(data: T): void {
|
||||
const errors = _validateSync(data);
|
||||
if (errors.length > 0) {
|
||||
console.error('Validation failed, errors: ', errors);
|
||||
throw new Error('Validation failed');
|
||||
}
|
||||
const errors = _validateSync(data);
|
||||
if (errors.length > 0) {
|
||||
console.error("Validation failed, errors: ", errors);
|
||||
throw new Error("Validation failed");
|
||||
}
|
||||
}
|
||||
|
||||
export async function validateAsync<T extends object>(data: T): Promise<void> {
|
||||
const errors = await validate(data);
|
||||
if (errors.length > 0) {
|
||||
console.error('Validation failed, errors: ', errors);
|
||||
throw new Error('Validation failed');
|
||||
}
|
||||
const errors = await validate(data);
|
||||
if (errors.length > 0) {
|
||||
console.error("Validation failed, errors: ", errors);
|
||||
throw new Error("Validation failed");
|
||||
}
|
||||
}
|
||||
|
||||
export async function validateAsyncInline<T extends object>(
|
||||
data: T
|
||||
data: T
|
||||
): Promise<T> {
|
||||
await validateAsync(data);
|
||||
return data;
|
||||
await validateAsync(data);
|
||||
return data;
|
||||
}
|
||||
|
||||
export function ValidateConstructor<
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
T extends { new (...args: any[]): any }
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
T extends { new (...args: any[]): any }
|
||||
>(constr: T) {
|
||||
return class extends constr {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
constructor(...args: any[]) {
|
||||
super(...args);
|
||||
validateSync(this);
|
||||
}
|
||||
};
|
||||
return class extends constr {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
constructor(...args: any[]) {
|
||||
super(...args);
|
||||
validateSync(this);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
import { createApp } from 'vue';
|
||||
import router from './router';
|
||||
import AppAsyncWrapper from './AppAsyncWrapper.vue';
|
||||
import { createApp } from "vue";
|
||||
import AppAsyncWrapper from "./AppAsyncWrapper.vue";
|
||||
import router from "./router";
|
||||
|
||||
const app = createApp(AppAsyncWrapper);
|
||||
app.use(router);
|
||||
app.config.unwrapInjectedRef = true;
|
||||
app.mount('#app');
|
||||
app.mount("#app");
|
||||
|
||||
@ -1,63 +1,64 @@
|
||||
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router';
|
||||
import LoginView from '@/views/LoginView.vue';
|
||||
import SignupView from '@/views/SignupView.vue';
|
||||
import HomeView from '@/views/HomeView.vue';
|
||||
import AboutView from '@/views/AboutView.vue';
|
||||
import FSView from '@/views/FSView.vue';
|
||||
import SetTokenView from '@/views/SetTokenView.vue';
|
||||
import ProfileView from '@/views/ProfileView.vue';
|
||||
import TFAView from '@/views/TFAView.vue';
|
||||
import AdminView from '@/views/AdminView.vue';
|
||||
import type { RouteRecordRaw } from "vue-router";
|
||||
import { createRouter, createWebHistory } from "vue-router";
|
||||
import LoginView from "@/views/LoginView.vue";
|
||||
import SignupView from "@/views/SignupView.vue";
|
||||
import HomeView from "@/views/HomeView.vue";
|
||||
import AboutView from "@/views/AboutView.vue";
|
||||
import FSView from "@/views/FSView.vue";
|
||||
import SetTokenView from "@/views/SetTokenView.vue";
|
||||
import ProfileView from "@/views/ProfileView.vue";
|
||||
import TFAView from "@/views/TFAView.vue";
|
||||
import AdminView from "@/views/AdminView.vue";
|
||||
|
||||
const routes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/',
|
||||
name: 'home',
|
||||
component: HomeView
|
||||
},
|
||||
{
|
||||
path: '/profile',
|
||||
name: 'profile',
|
||||
component: ProfileView
|
||||
},
|
||||
{
|
||||
path: '/profile/2fa-enable',
|
||||
name: '2fa',
|
||||
component: TFAView
|
||||
},
|
||||
{
|
||||
path: '/admin',
|
||||
component: AdminView
|
||||
},
|
||||
{
|
||||
path: '/about',
|
||||
component: AboutView
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
name: 'login',
|
||||
component: LoginView
|
||||
},
|
||||
{
|
||||
path: '/signup',
|
||||
name: 'signup',
|
||||
component: SignupView
|
||||
},
|
||||
{
|
||||
path: '/fs/:node_id',
|
||||
name: 'fs',
|
||||
component: FSView
|
||||
},
|
||||
{
|
||||
path: "/",
|
||||
name: "home",
|
||||
component: HomeView,
|
||||
},
|
||||
{
|
||||
path: "/profile",
|
||||
name: "profile",
|
||||
component: ProfileView,
|
||||
},
|
||||
{
|
||||
path: "/profile/2fa-enable",
|
||||
name: "2fa",
|
||||
component: TFAView,
|
||||
},
|
||||
{
|
||||
path: "/admin",
|
||||
component: AdminView,
|
||||
},
|
||||
{
|
||||
path: "/about",
|
||||
component: AboutView,
|
||||
},
|
||||
{
|
||||
path: "/login",
|
||||
name: "login",
|
||||
component: LoginView,
|
||||
},
|
||||
{
|
||||
path: "/signup",
|
||||
name: "signup",
|
||||
component: SignupView,
|
||||
},
|
||||
{
|
||||
path: "/fs/:node_id",
|
||||
name: "fs",
|
||||
component: FSView,
|
||||
},
|
||||
|
||||
{
|
||||
path: '/set_token',
|
||||
component: SetTokenView
|
||||
}
|
||||
{
|
||||
path: "/set_token",
|
||||
component: SetTokenView,
|
||||
},
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHistory(process.env.BASE_URL),
|
||||
routes
|
||||
history: createWebHistory(import.meta.env.BASE_URL),
|
||||
routes,
|
||||
});
|
||||
|
||||
export default router;
|
||||
|
||||
6
frontend/src/shims-vue.d.ts
vendored
6
frontend/src/shims-vue.d.ts
vendored
@ -1,6 +0,0 @@
|
||||
/* eslint-disable */
|
||||
declare module '*.vue' {
|
||||
import type { DefineComponent } from 'vue';
|
||||
const component: DefineComponent<{}, {}, any>;
|
||||
export default component;
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="about">
|
||||
<h1>This is an about page</h1>
|
||||
</div>
|
||||
<div class="about">
|
||||
<h1>This is an about page</h1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -1,109 +1,104 @@
|
||||
<script setup lang="ts">
|
||||
import { inject, onBeforeMount, ref } from 'vue';
|
||||
import {
|
||||
Responses,
|
||||
check_token,
|
||||
TokenInjectType,
|
||||
Admin,
|
||||
isErrorResponse
|
||||
} from '@/api';
|
||||
import { onBeforeRouteUpdate } from 'vue-router';
|
||||
import router from '@/router';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { inject, onBeforeMount, ref } from "vue";
|
||||
import { Responses, check_token, Admin, isErrorResponse } from "@/api";
|
||||
import { onBeforeRouteUpdate } from "vue-router";
|
||||
import router from "@/router";
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
const users = ref<Responses.Admin.GetUsersEntry[]>([]);
|
||||
|
||||
onBeforeRouteUpdate(async () => {
|
||||
await updatePanel();
|
||||
await updatePanel();
|
||||
});
|
||||
onBeforeMount(async () => {
|
||||
await updatePanel();
|
||||
await updatePanel();
|
||||
});
|
||||
async function updatePanel() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
|
||||
const res = await Admin.get_users(token);
|
||||
if (isErrorResponse(res)) return router.replace({ path: '/' });
|
||||
users.value = res.users;
|
||||
const res = await Admin.get_users(token);
|
||||
if (isErrorResponse(res)) return router.replace({ path: "/" });
|
||||
users.value = res.users;
|
||||
}
|
||||
|
||||
async function setRole(user: number, roleStr: string) {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
|
||||
const res = await Admin.set_role(user, parseInt(roleStr, 10), token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
const res = await Admin.set_role(user, parseInt(roleStr, 10), token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
}
|
||||
|
||||
async function disableTfa(user: number) {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
|
||||
const res = await Admin.disable_tfa(user, token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
const res = await Admin.disable_tfa(user, token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
}
|
||||
|
||||
async function logoutUser(user: number) {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
|
||||
const res = await Admin.logout(user, token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
const res = await Admin.logout(user, token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
}
|
||||
|
||||
async function deleteUser(user: number) {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
|
||||
const res = await Admin.delete_user(user, token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
const res = await Admin.delete_user(user, token);
|
||||
if (isErrorResponse(res)) console.error(res.message);
|
||||
await updatePanel();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Role</th>
|
||||
<th>Tfa Status</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
<tr v-for="user in users" :key="user.id">
|
||||
<td>{{ user.name }}</td>
|
||||
<td>{{ user.gitlab ? 'Gitlab' : 'Password' }}</td>
|
||||
<td>
|
||||
<select @change="setRole(user.id, $event.target.value)">
|
||||
<option value="0" :selected="user.role === 0 ? true : null">
|
||||
Disabled
|
||||
</option>
|
||||
<option value="1" :selected="user.role === 1 ? true : null">
|
||||
User
|
||||
</option>
|
||||
<option value="2" :selected="user.role === 2 ? true : null">
|
||||
Admin
|
||||
</option>
|
||||
</select>
|
||||
</td>
|
||||
<td v-if="user.gitlab"></td>
|
||||
<td v-else>
|
||||
{{ user.tfaEnabled ? 'Enabled' : 'Disabled' }}
|
||||
</td>
|
||||
<td>
|
||||
<button v-if="user.tfaEnabled" @click="disableTfa(user.id)">
|
||||
Disable Tfa
|
||||
</button>
|
||||
<button @click="logoutUser(user.id)">Logout all</button>
|
||||
<button @click="deleteUser(user.id)">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Role</th>
|
||||
<th>Tfa Status</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
<tr v-for="user in users" :key="user.id">
|
||||
<td>{{ user.name }}</td>
|
||||
<td>{{ user.gitlab ? "Gitlab" : "Password" }}</td>
|
||||
<td>
|
||||
<select @change="setRole(user.id, ($event.target as HTMLSelectElement).value)">
|
||||
<option value="0" :selected="user.role === 0 ? true : undefined">
|
||||
Disabled
|
||||
</option>
|
||||
<option value="1" :selected="user.role === 1 ? true : undefined">
|
||||
User
|
||||
</option>
|
||||
<option value="2" :selected="user.role === 2 ? true : undefined">
|
||||
Admin
|
||||
</option>
|
||||
</select>
|
||||
</td>
|
||||
<td v-if="user.gitlab"></td>
|
||||
<td v-else>
|
||||
{{ user.tfaEnabled ? "Enabled" : "Disabled" }}
|
||||
</td>
|
||||
<td>
|
||||
<button v-if="user.tfaEnabled" @click="disableTfa(user.id)">
|
||||
Disable Tfa
|
||||
</button>
|
||||
<button @click="logoutUser(user.id)">Logout all</button>
|
||||
<button @click="deleteUser(user.id)">Delete</button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,70 +1,65 @@
|
||||
<script setup lang="ts">
|
||||
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
|
||||
import { inject, onBeforeMount, ref } from 'vue';
|
||||
import {
|
||||
check_token,
|
||||
FS,
|
||||
Responses,
|
||||
isErrorResponse,
|
||||
TokenInjectType
|
||||
} from '@/api';
|
||||
import DirViewer from '@/components/FSView/DirViewer.vue';
|
||||
import FileViewer from '@/components/FSView/FileViewer.vue';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { onBeforeRouteUpdate, useRoute, useRouter } from "vue-router";
|
||||
import { inject, onBeforeMount, ref } from "vue";
|
||||
import { check_token, FS, Responses, isErrorResponse } from "@/api";
|
||||
import DirViewer from "@/components/FSView/DirViewer.vue";
|
||||
import FileViewer from "@/components/FSView/FileViewer.vue";
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
const path = ref('');
|
||||
const path = ref("");
|
||||
const node = ref<Responses.FS.GetNodeResponse | null>(null);
|
||||
|
||||
async function fetch_node(node_id: number) {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
let [p, n] = [
|
||||
await FS.get_path(token, node_id),
|
||||
await FS.get_node(token, node_id)
|
||||
];
|
||||
if (isErrorResponse(p)) return gotoRoot();
|
||||
if (isErrorResponse(n)) return gotoRoot();
|
||||
[path.value, node.value] = [p.path, n];
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const [p, n] = [
|
||||
await FS.get_path(token, node_id),
|
||||
await FS.get_node(token, node_id),
|
||||
];
|
||||
if (isErrorResponse(p)) return gotoRoot();
|
||||
if (isErrorResponse(n)) return gotoRoot();
|
||||
[path.value, node.value] = [p.path, n];
|
||||
}
|
||||
|
||||
onBeforeRouteUpdate(async (to) => {
|
||||
await fetch_node(Number(to.params.node_id));
|
||||
await fetch_node(Number(to.params.node_id));
|
||||
});
|
||||
|
||||
async function reloadNode() {
|
||||
await fetch_node(Number(route.params.node_id));
|
||||
await fetch_node(Number(route.params.node_id));
|
||||
}
|
||||
onBeforeMount(async () => {
|
||||
await reloadNode();
|
||||
await reloadNode();
|
||||
});
|
||||
|
||||
async function gotoRoot() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const rootRes = await FS.get_root(token);
|
||||
if (isErrorResponse(rootRes)) return jwt.logout();
|
||||
const root = rootRes.rootId;
|
||||
await router.replace({
|
||||
name: 'fs',
|
||||
params: { node_id: root }
|
||||
});
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const rootRes = await FS.get_root(token);
|
||||
if (isErrorResponse(rootRes)) return jwt.logout();
|
||||
const root = rootRes.rootId;
|
||||
await router.replace({
|
||||
name: "fs",
|
||||
params: { node_id: root },
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="node">
|
||||
<div>Path: {{ path }}</div>
|
||||
<DirViewer
|
||||
v-if="!node.isFile"
|
||||
:node="node"
|
||||
@reloadNode="reloadNode"
|
||||
@gotoRoot="gotoRoot"
|
||||
/>
|
||||
<FileViewer v-else :node="node" />
|
||||
</div>
|
||||
<div v-if="node">
|
||||
<div>Path: {{ path }}</div>
|
||||
<DirViewer
|
||||
v-if="!node.isFile"
|
||||
:node="node"
|
||||
@reloadNode="reloadNode"
|
||||
@gotoRoot="gotoRoot"
|
||||
/>
|
||||
<FileViewer v-else :node="node" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,28 +1,29 @@
|
||||
<template><p></p></template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onBeforeRouteUpdate, useRouter } from 'vue-router';
|
||||
import { inject, onBeforeMount } from 'vue';
|
||||
import { FS, check_token, isErrorResponse, TokenInjectType } from '@/api';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { onBeforeRouteUpdate, useRouter } from "vue-router";
|
||||
import { inject, onBeforeMount } from "vue";
|
||||
import { FS, check_token, isErrorResponse } from "@/api";
|
||||
|
||||
const router = useRouter();
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
async function start_redirect() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const root = await FS.get_root(token);
|
||||
if (isErrorResponse(root)) return jwt.logout();
|
||||
await router.replace({
|
||||
name: 'fs',
|
||||
params: { node_id: root.rootId }
|
||||
});
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const root = await FS.get_root(token);
|
||||
if (isErrorResponse(root)) return jwt.logout();
|
||||
await router.replace({
|
||||
name: "fs",
|
||||
params: { node_id: root.rootId },
|
||||
});
|
||||
}
|
||||
|
||||
onBeforeRouteUpdate(async () => {
|
||||
await start_redirect();
|
||||
await start_redirect();
|
||||
});
|
||||
onBeforeMount(async () => {
|
||||
await start_redirect();
|
||||
await start_redirect();
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -1,61 +1,62 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, inject } from 'vue';
|
||||
import { Auth, FS, isErrorResponse, TokenInjectType } from '@/api';
|
||||
import { useRouter } from 'vue-router';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { ref, inject } from "vue";
|
||||
import { Auth, FS, isErrorResponse } from "@/api";
|
||||
import { useRouter } from "vue-router";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const username = ref('');
|
||||
const password = ref('');
|
||||
const otp = ref('');
|
||||
const username = ref("");
|
||||
const password = ref("");
|
||||
const otp = ref("");
|
||||
|
||||
const error = ref('');
|
||||
const error = ref("");
|
||||
|
||||
const requestOtp = ref(false);
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
async function login() {
|
||||
error.value = '';
|
||||
if (username.value === '' || password.value === '') {
|
||||
error.value = 'Email and/or Password missing';
|
||||
return;
|
||||
}
|
||||
const res = await (requestOtp.value
|
||||
? Auth.auth_login(username.value, password.value, otp.value)
|
||||
: Auth.auth_login(username.value, password.value));
|
||||
if (isErrorResponse(res)) error.value = 'Login failed: ' + res.message;
|
||||
else if ('jwt' in res) {
|
||||
const root = await FS.get_root(res.jwt);
|
||||
if (isErrorResponse(root)) {
|
||||
error.value = 'Get root failed: ' + root.message;
|
||||
return;
|
||||
}
|
||||
jwt.setToken(res.jwt);
|
||||
await router.push({
|
||||
name: 'fs',
|
||||
params: { node_id: root.rootId }
|
||||
});
|
||||
} else {
|
||||
error.value = '';
|
||||
requestOtp.value = true;
|
||||
}
|
||||
error.value = "";
|
||||
if (username.value === "" || password.value === "") {
|
||||
error.value = "Email and/or Password missing";
|
||||
return;
|
||||
}
|
||||
const res = await (requestOtp.value
|
||||
? Auth.auth_login(username.value, password.value, otp.value)
|
||||
: Auth.auth_login(username.value, password.value));
|
||||
if (isErrorResponse(res)) error.value = "Login failed: " + res.message;
|
||||
else if ("jwt" in res) {
|
||||
const root = await FS.get_root(res.jwt);
|
||||
if (isErrorResponse(root)) {
|
||||
error.value = "Get root failed: " + root.message;
|
||||
return;
|
||||
}
|
||||
jwt.setToken(res.jwt);
|
||||
await router.push({
|
||||
name: "fs",
|
||||
params: { node_id: root.rootId },
|
||||
});
|
||||
} else {
|
||||
error.value = "";
|
||||
requestOtp.value = true;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<template v-if="!requestOtp">
|
||||
<input type="email" placeholder="Email" v-model="username" />
|
||||
<input type="password" placeholder="Password" v-model="password" />
|
||||
<a href="/api/auth/gitlab">Login with gitlab</a>
|
||||
<router-link to="signup">Signup instead?</router-link>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>Please input your 2 factor authentication code</div>
|
||||
<input type="text" placeholder="Code" v-model="otp" />
|
||||
</template>
|
||||
<button @click="login()">Login</button>
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<template v-if="!requestOtp">
|
||||
<input type="email" placeholder="Email" v-model="username" />
|
||||
<input type="password" placeholder="Password" v-model="password" />
|
||||
<a href="/api/auth/gitlab">Login with gitlab</a>
|
||||
<router-link to="signup">Signup instead?</router-link>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>Please input your 2 factor authentication code</div>
|
||||
<input type="text" placeholder="Code" v-model="otp" />
|
||||
</template>
|
||||
<button @click="login()">Login</button>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,124 +1,106 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, inject, onBeforeMount } from 'vue';
|
||||
import {
|
||||
Auth,
|
||||
User,
|
||||
check_token,
|
||||
isErrorResponse,
|
||||
TokenInjectType,
|
||||
Responses
|
||||
} from '@/api';
|
||||
import { onBeforeRouteUpdate } from 'vue-router';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { ref, inject, onBeforeMount } from "vue";
|
||||
import { Auth, User, check_token, isErrorResponse, Responses } from "@/api";
|
||||
import { onBeforeRouteUpdate } from "vue-router";
|
||||
|
||||
const error = ref('');
|
||||
const oldPw = ref('');
|
||||
const newPw = ref('');
|
||||
const newPw2 = ref('');
|
||||
const error = ref("");
|
||||
const oldPw = ref("");
|
||||
const newPw = ref("");
|
||||
const newPw2 = ref("");
|
||||
const user = ref<Responses.User.UserInfoResponse | null>(null);
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
onBeforeRouteUpdate(async () => {
|
||||
await updateProfile();
|
||||
await updateProfile();
|
||||
});
|
||||
onBeforeMount(async () => {
|
||||
await updateProfile();
|
||||
await updateProfile();
|
||||
});
|
||||
async function updateProfile() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
|
||||
const res = await User.get_user_info(token);
|
||||
if (isErrorResponse(res)) return jwt.logout();
|
||||
user.value = res;
|
||||
const res = await User.get_user_info(token);
|
||||
if (isErrorResponse(res)) return jwt.logout();
|
||||
user.value = res;
|
||||
}
|
||||
|
||||
async function deleteUser() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await User.delete_user(token);
|
||||
jwt.logout();
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await User.delete_user(token);
|
||||
jwt.logout();
|
||||
}
|
||||
|
||||
async function logoutAll() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Auth.logout_all(token);
|
||||
jwt.logout();
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Auth.logout_all(token);
|
||||
jwt.logout();
|
||||
}
|
||||
|
||||
async function changePw() {
|
||||
if (oldPw.value === '' || newPw.value === '' || newPw2.value === '') {
|
||||
error.value = 'Password missing';
|
||||
return;
|
||||
}
|
||||
if (newPw.value !== newPw2.value) {
|
||||
error.value = "Passwords don't match";
|
||||
return;
|
||||
}
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const res = await Auth.change_password(oldPw.value, newPw.value, token);
|
||||
if (isErrorResponse(res))
|
||||
error.value = 'Password change failed: ' + res.message;
|
||||
else jwt.logout();
|
||||
if (oldPw.value === "" || newPw.value === "" || newPw2.value === "") {
|
||||
error.value = "Password missing";
|
||||
return;
|
||||
}
|
||||
if (newPw.value !== newPw2.value) {
|
||||
error.value = "Passwords don't match";
|
||||
return;
|
||||
}
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
const res = await Auth.change_password(oldPw.value, newPw.value, token);
|
||||
if (isErrorResponse(res))
|
||||
error.value = "Password change failed: " + res.message;
|
||||
else jwt.logout();
|
||||
}
|
||||
|
||||
async function tfaDisable() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Auth.tfa_disable(token);
|
||||
jwt.logout();
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
await Auth.tfa_disable(token);
|
||||
jwt.logout();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<template v-if="user">
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<div>User: {{ user.name }}</div>
|
||||
<div>Signed in with {{ user.gitlab ? 'gitlab' : 'password' }}</div>
|
||||
<template v-if="!user.gitlab">
|
||||
<div>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Old password"
|
||||
v-model="oldPw"
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="New password"
|
||||
v-model="newPw"
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Repeat new password"
|
||||
v-model="newPw2"
|
||||
/>
|
||||
<button @click="changePw">Change</button>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
2 Factor authentication:
|
||||
{{ user.tfaEnabled ? 'Enabled' : 'Disabled' }}
|
||||
</div>
|
||||
<div>
|
||||
<a href="#" v-if="user.tfaEnabled" @click="tfaDisable">
|
||||
Disable
|
||||
</a>
|
||||
<router-link to="/profile/2fa-enable" v-else>
|
||||
Enable
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div>
|
||||
<a href="#" @click="logoutAll">Logout everywhere</a>
|
||||
<a href="#" @click="deleteUser">Delete Account</a>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>Loading...</div>
|
||||
</template>
|
||||
<template v-if="user">
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<div>User: {{ user.name }}</div>
|
||||
<div>Signed in with {{ user.gitlab ? "gitlab" : "password" }}</div>
|
||||
<template v-if="!user.gitlab">
|
||||
<div>
|
||||
<input type="password" placeholder="Old password" v-model="oldPw" />
|
||||
<input type="password" placeholder="New password" v-model="newPw" />
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Repeat new password"
|
||||
v-model="newPw2"
|
||||
/>
|
||||
<button @click="changePw">Change</button>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
2 Factor authentication:
|
||||
{{ user.tfaEnabled ? "Enabled" : "Disabled" }}
|
||||
</div>
|
||||
<div>
|
||||
<a href="#" v-if="user.tfaEnabled" @click="tfaDisable"> Disable </a>
|
||||
<router-link to="/profile/2fa-enable" v-else> Enable </router-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<div>
|
||||
<a href="#" @click="logoutAll">Logout everywhere</a>
|
||||
<a href="#" @click="deleteUser">Delete Account</a>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>Loading...</div>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,19 +1,19 @@
|
||||
<script setup lang="ts">
|
||||
import { inject } from 'vue';
|
||||
import { TokenInjectType } from '@/api';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { inject } from "vue";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
if ('token' in route.query) jwt.setToken(route.query['token'] as string);
|
||||
router.replace({ path: '/' });
|
||||
if ("token" in route.query) jwt.setToken(route.query["token"] as string);
|
||||
router.replace({ path: "/" });
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<router-link to="/">Click here to go home</router-link>
|
||||
<router-link to="/">Click here to go home</router-link>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,35 +1,35 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { Auth, isErrorResponse } from '@/api';
|
||||
import { ref } from "vue";
|
||||
import { Auth, isErrorResponse } from "@/api";
|
||||
|
||||
const username = ref('');
|
||||
const password = ref('');
|
||||
const password2 = ref('');
|
||||
const error = ref('');
|
||||
const username = ref("");
|
||||
const password = ref("");
|
||||
const password2 = ref("");
|
||||
const error = ref("");
|
||||
|
||||
async function signup() {
|
||||
if (username.value === '' || password.value === '') {
|
||||
error.value = 'Email and/or Password missing';
|
||||
return;
|
||||
}
|
||||
if (password.value !== password2.value) {
|
||||
error.value = "Passwords don't match";
|
||||
return;
|
||||
}
|
||||
const res = await Auth.auth_signup(username.value, password.value);
|
||||
error.value = isErrorResponse(res)
|
||||
? 'Signup failed: ' + res.message
|
||||
: 'Signup successful, please wait till an admin unlocks your account.';
|
||||
if (username.value === "" || password.value === "") {
|
||||
error.value = "Email and/or Password missing";
|
||||
return;
|
||||
}
|
||||
if (password.value !== password2.value) {
|
||||
error.value = "Passwords don't match";
|
||||
return;
|
||||
}
|
||||
const res = await Auth.auth_signup(username.value, password.value);
|
||||
error.value = isErrorResponse(res)
|
||||
? "Signup failed: " + res.message
|
||||
: "Signup successful, please wait till an admin unlocks your account.";
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<input type="email" placeholder="Email" v-model="username" />
|
||||
<input type="password" placeholder="Password" v-model="password" />
|
||||
<input type="password" placeholder="Repeat password" v-model="password2" />
|
||||
<button @click="signup()">Signup</button>
|
||||
<router-link to="login">Login instead?</router-link>
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<input type="email" placeholder="Email" v-model="username" />
|
||||
<input type="password" placeholder="Password" v-model="password" />
|
||||
<input type="password" placeholder="Repeat password" v-model="password2" />
|
||||
<button @click="signup()">Signup</button>
|
||||
<router-link to="login">Login instead?</router-link>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
@ -1,89 +1,90 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, inject } from 'vue';
|
||||
import { Auth, check_token, isErrorResponse, TokenInjectType } from '@/api';
|
||||
import type { TokenInjectType } from "@/api";
|
||||
import { ref, inject } from "vue";
|
||||
import { Auth, check_token, isErrorResponse } from "@/api";
|
||||
|
||||
enum state {
|
||||
SELECT,
|
||||
MAIL,
|
||||
TOTP
|
||||
SELECT,
|
||||
MAIL,
|
||||
TOTP,
|
||||
}
|
||||
|
||||
const currentState = ref<state>(state.SELECT);
|
||||
|
||||
const error = ref('');
|
||||
const qrImage = ref('');
|
||||
const secret = ref('');
|
||||
const code = ref('');
|
||||
const error = ref("");
|
||||
const qrImage = ref("");
|
||||
const secret = ref("");
|
||||
const code = ref("");
|
||||
|
||||
const jwt = inject<TokenInjectType>('jwt') as TokenInjectType;
|
||||
const jwt = inject<TokenInjectType>("jwt") as TokenInjectType;
|
||||
|
||||
async function selectMail() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
error.value = 'Working...';
|
||||
const res = await Auth.tfa_setup(true, token);
|
||||
if (isErrorResponse(res))
|
||||
error.value = 'Failed to select 2fa type: ' + res.message;
|
||||
else {
|
||||
error.value = '';
|
||||
currentState.value = state.MAIL;
|
||||
}
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
error.value = "Working...";
|
||||
const res = await Auth.tfa_setup(true, token);
|
||||
if (isErrorResponse(res))
|
||||
error.value = "Failed to select 2fa type: " + res.message;
|
||||
else {
|
||||
error.value = "";
|
||||
currentState.value = state.MAIL;
|
||||
}
|
||||
}
|
||||
|
||||
async function selectTotp() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
error.value = 'Working...';
|
||||
const res = await Auth.tfa_setup(false, token);
|
||||
if (isErrorResponse(res))
|
||||
error.value = 'Failed to select 2fa type: ' + res.message;
|
||||
else {
|
||||
qrImage.value = res.qrCode;
|
||||
secret.value = res.secret;
|
||||
error.value = '';
|
||||
currentState.value = state.TOTP;
|
||||
}
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
error.value = "Working...";
|
||||
const res = await Auth.tfa_setup(false, token);
|
||||
if (isErrorResponse(res))
|
||||
error.value = "Failed to select 2fa type: " + res.message;
|
||||
else {
|
||||
qrImage.value = res.qrCode;
|
||||
secret.value = res.secret;
|
||||
error.value = "";
|
||||
currentState.value = state.TOTP;
|
||||
}
|
||||
}
|
||||
|
||||
async function submit() {
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
error.value = 'Working...';
|
||||
const res = await Auth.tfa_complete(
|
||||
currentState.value === state.MAIL,
|
||||
code.value,
|
||||
token
|
||||
);
|
||||
if (isErrorResponse(res))
|
||||
error.value = 'Failed to submit code: ' + res.message;
|
||||
else jwt.logout();
|
||||
const token = await check_token(jwt);
|
||||
if (!token) return;
|
||||
error.value = "Working...";
|
||||
const res = await Auth.tfa_complete(
|
||||
currentState.value === state.MAIL,
|
||||
code.value,
|
||||
token
|
||||
);
|
||||
if (isErrorResponse(res))
|
||||
error.value = "Failed to submit code: " + res.message;
|
||||
else jwt.logout();
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<template v-if="currentState === state.SELECT">
|
||||
<div>Select 2 Factor authentication type:</div>
|
||||
<div>
|
||||
<button @click="selectMail">Mail</button>
|
||||
<button @click="selectTotp">Google Authenticator</button>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="currentState === state.MAIL">
|
||||
<div>Please enter the code you got by mail</div>
|
||||
<input type="text" placeholder="Code" v-model="code" />
|
||||
<button @click="submit()">Submit</button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<img :src="qrImage" alt="QrCode" />
|
||||
<details>
|
||||
<summary>Show manual input code</summary>
|
||||
{{ secret }}
|
||||
</details>
|
||||
<div>Please enter the current code</div>
|
||||
<input type="text" placeholder="Code" v-model="code" />
|
||||
<button @click="submit()">Submit</button>
|
||||
</template>
|
||||
<div v-if="error !== ''" v-text="error"></div>
|
||||
<template v-if="currentState === state.SELECT">
|
||||
<div>Select 2 Factor authentication type:</div>
|
||||
<div>
|
||||
<button @click="selectMail">Mail</button>
|
||||
<button @click="selectTotp">Google Authenticator</button>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="currentState === state.MAIL">
|
||||
<div>Please enter the code you got by mail</div>
|
||||
<input type="text" placeholder="Code" v-model="code" />
|
||||
<button @click="submit()">Submit</button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<img :src="qrImage" alt="QrCode" />
|
||||
<details>
|
||||
<summary>Show manual input code</summary>
|
||||
{{ secret }}
|
||||
</details>
|
||||
<div>Please enter the current code</div>
|
||||
<input type="text" placeholder="Code" v-model="code" />
|
||||
<button @click="submit()">Submit</button>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
8
frontend/tsconfig.config.json
Normal file
8
frontend/tsconfig.config.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.node.json",
|
||||
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*"],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"types": ["node"]
|
||||
}
|
||||
}
|
||||
@ -1,32 +1,19 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
"module": "esnext",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
"moduleResolution": "node",
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": true,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"useDefineForClassFields": true,
|
||||
"sourceMap": true,
|
||||
"emitDecoratorMetadata": true,
|
||||
"experimentalDecorators": true,
|
||||
"strictPropertyInitialization": false,
|
||||
"baseUrl": ".",
|
||||
"types": ["webpack-env"],
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
},
|
||||
"lib": ["esnext", "dom", "dom.iterable", "scripthost"]
|
||||
},
|
||||
"include": [
|
||||
"src/**/*.ts",
|
||||
"src/**/*.tsx",
|
||||
"src/**/*.vue",
|
||||
"tests/**/*.ts",
|
||||
"tests/**/*.tsx"
|
||||
],
|
||||
"exclude": ["node_modules"]
|
||||
"extends": "@vue/tsconfig/tsconfig.web.json",
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"experimentalDecorators": true,
|
||||
"emitDecoratorMetadata": true,
|
||||
"strictPropertyInitialization": false,
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.config.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
14
frontend/vite.config.ts
Normal file
14
frontend/vite.config.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import { fileURLToPath, URL } from "node:url";
|
||||
|
||||
import { defineConfig } from "vite";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [vue()],
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": fileURLToPath(new URL("./src", import.meta.url)),
|
||||
},
|
||||
},
|
||||
});
|
||||
@ -1,12 +0,0 @@
|
||||
const { defineConfig } = require('@vue/cli-service');
|
||||
module.exports = defineConfig({
|
||||
transpileDependencies: true,
|
||||
configureWebpack: {
|
||||
resolve: {
|
||||
fallback: {
|
||||
crypto: false,
|
||||
stream: require.resolve('stream-browserify')
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
5370
frontend/yarn.lock
5370
frontend/yarn.lock
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user