fix update user and input styling
This commit is contained in:
parent
7292700cc9
commit
6a92858ac1
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path fill="#fff" d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>
|
||||
|
Before Width: | Height: | Size: 210 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black" width="24px" height="24px"><path d="M0 0h24v24H0z" fill="none"/><path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/></svg>
|
||||
|
Before Width: | Height: | Size: 199 B |
@ -1,4 +0,0 @@
|
||||
<svg fill="#FFFFFF" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>
|
||||
<path d="M0 0h24v24H0z" fill="none"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 265 B |
@ -1,4 +0,0 @@
|
||||
<svg fill="#FFFFFF" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/>
|
||||
<path d="M0 0h24v24H0z" fill="none"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 201 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path fill="#fff" d="M4 18h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zm0-5h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zM3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1z"/></svg>
|
||||
|
Before Width: | Height: | Size: 350 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path fill="#fff" d="M16.5 12c1.38 0 2.49-1.12 2.49-2.5S17.88 7 16.5 7C15.12 7 14 8.12 14 9.5s1.12 2.5 2.5 2.5zM9 11c1.66 0 2.99-1.34 2.99-3S10.66 5 9 5C7.34 5 6 6.34 6 8s1.34 3 3 3zm7.5 3c-1.83 0-5.5.92-5.5 2.75V19h11v-2.25c0-1.83-3.67-2.75-5.5-2.75zM9 13c-2.33 0-7 1.17-7 3.5V19h7v-2.25c0-.85.33-2.34 2.37-3.47C10.5 13.1 9.66 13 9 13z"/></svg>
|
||||
|
Before Width: | Height: | Size: 465 B |
19
src/App.vue
19
src/App.vue
@ -22,6 +22,23 @@ export default {
|
||||
body{
|
||||
margin: 0;
|
||||
}
|
||||
input{
|
||||
padding: 0 2rem 0 2rem;
|
||||
height: 2.5rem;
|
||||
color: #fff;
|
||||
background-color: #1d1d1d;
|
||||
border-radius: 1.25rem;
|
||||
border: 1px solid #fff;
|
||||
text-align: center;
|
||||
font-size: 1.1rem;
|
||||
margin: 0.5rem;
|
||||
appearance: none;
|
||||
outline: none;
|
||||
}
|
||||
input:focus{
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
*{
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #42b983 #2220;
|
||||
@ -50,7 +67,7 @@ body{
|
||||
top: 0;
|
||||
left: calc(50% - 35rem);
|
||||
padding: 0;
|
||||
min-height: calc(100%);
|
||||
min-height: 100%;
|
||||
width: 70rem;
|
||||
min-width: 18rem;
|
||||
background-color: #313131;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<button class="iconContainer" >
|
||||
<img class="icon" v-bind:src=ic alt="" />
|
||||
<img class="icon" :src=ic alt="" />
|
||||
</button>
|
||||
</template>
|
||||
|
||||
@ -15,6 +15,7 @@ name: "icon",
|
||||
|
||||
<style scoped>
|
||||
.iconContainer{
|
||||
position: relative;
|
||||
width: 3rem;
|
||||
height: 3rem;
|
||||
border-radius: 1.5rem;
|
||||
|
||||
@ -8,33 +8,34 @@ export class AdminAPI{
|
||||
|
||||
async sendRequest({path, obj={}, method=rest=>rest.get}){
|
||||
return await method(rest)(`${this.baseUrl}${path}?access_token=${this.accessToken}`)
|
||||
.send(JSON.stringify(obj)).set('accept', 'json').then(res => {
|
||||
.send(obj).set('accept', 'json').then(res => {
|
||||
return JSON.parse(res.text);
|
||||
});
|
||||
}
|
||||
|
||||
async getUsers(){
|
||||
return await this.sendRequest({path: 'users'});
|
||||
return await this.sendRequest({path: 'v2/users'});
|
||||
}
|
||||
async resetPassword(userId, newPassword){
|
||||
async resetPassword({userId, password}){
|
||||
return await this.sendRequest({
|
||||
path: `reset_password/${userId}`,
|
||||
path: `v1/reset_password/${userId}`,
|
||||
method: rest=>rest.post,
|
||||
obj: {
|
||||
new_password: newPassword,
|
||||
new_password: password,
|
||||
logout_devices: true
|
||||
}
|
||||
});
|
||||
}
|
||||
async createUser(userId, password, displayName, avatarUrl=undefined){
|
||||
async updateUser({userId, password, displayname, avatar_url=undefined}){
|
||||
return await this.sendRequest({
|
||||
path: `reset_password/${userId}`,
|
||||
path: `v2/users/${userId}`,
|
||||
method: rest=>rest.put,
|
||||
obj: {
|
||||
'password': password,
|
||||
'displayname': displayName,
|
||||
'avatar_url': avatarUrl,
|
||||
'admin': false,
|
||||
'deactivated': false
|
||||
password,
|
||||
displayname,
|
||||
avatar_url,
|
||||
admin: false,
|
||||
deactivated: false
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -1,36 +1,67 @@
|
||||
<template>
|
||||
<div class="admin">
|
||||
<h1>admin</h1>
|
||||
<h2>users</h2>
|
||||
<table v-if="users">
|
||||
<tr>
|
||||
<th class="left">user</th>
|
||||
<th class="mid">displayname</th>
|
||||
<th class="mid">deactivated</th>
|
||||
<th class="right">admin</th>
|
||||
</tr>
|
||||
<tr v-for="user in users.users" :key="user.name">
|
||||
<td class="left">{{user.name}}</td>
|
||||
<td class="mid">{{user.displayname}}</td>
|
||||
<td class="mid">{{user.deactivated}}</td>
|
||||
<td class="right">{{user.admin}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="tableScroll">
|
||||
<table v-if="users">
|
||||
<tr>
|
||||
<th class="left">user</th>
|
||||
<th class="mid">displayname</th>
|
||||
<th class="mid">deactivated</th>
|
||||
<th class="mid">admin</th>
|
||||
<th class="right edit">edit</th>
|
||||
</tr>
|
||||
<tr v-for="user in users.users" :key="user.name">
|
||||
<td class="left">{{user.name}}</td>
|
||||
<td class="mid">{{user.displayname}}</td>
|
||||
<td class="mid">{{user.deactivated}}</td>
|
||||
<td class="mid">{{user.admin}}</td>
|
||||
<td class="right edit">
|
||||
<icon @click.native="newUser.userId = user.name" class="editIcon" type="submit" ic="./sym/ic_create_white.svg"/>
|
||||
<icon class="editIcon" type="submit" ic="./sym/ic_delete_white.svg"/>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<h2>update user</h2>
|
||||
<div class="update">
|
||||
<input v-model="newUser.userId" type="text" placeholder="userId"><br>
|
||||
<input v-model="newUser.password" type="password" placeholder="password"><br>
|
||||
<input v-model="newUser.displayname" type="text" placeholder="displayname">
|
||||
</div>
|
||||
<textbtn @click.native="updateUser()" text="update user"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {matrix} from "@/main";
|
||||
import {AdminAPI} from "@/lib/AdminAPI";
|
||||
import icon from "@/components/icon";
|
||||
import textbtn from "@/components/textbtn";
|
||||
|
||||
export default {
|
||||
name: "admin",
|
||||
components:{
|
||||
icon,
|
||||
textbtn
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
users: undefined
|
||||
users: undefined,
|
||||
newUser:{
|
||||
userId: '',
|
||||
password: '',
|
||||
displayname: '',
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
async updateUser(){
|
||||
await this.api.updateUser(this.newUser);
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.api = new AdminAPI(matrix.baseUrl+'/_synapse/admin/v2/', matrix.accessToken);
|
||||
this.api = new AdminAPI(matrix.baseUrl+'/_synapse/admin/', matrix.accessToken);
|
||||
this.users = await this.api.getUsers('users');
|
||||
}
|
||||
}
|
||||
@ -39,12 +70,29 @@ export default {
|
||||
<style scoped>
|
||||
.admin{
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
padding: 1rem;
|
||||
}
|
||||
.editIcon{
|
||||
float: left;
|
||||
margin: 0 0.25rem;
|
||||
}
|
||||
.edit{
|
||||
width: 6rem;
|
||||
text-align: center;
|
||||
}
|
||||
.tableScroll{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
overflow-x: auto;
|
||||
}
|
||||
table {
|
||||
position: relative;
|
||||
margin: auto;
|
||||
width: calc(100% - 2rem);
|
||||
max-width: 40rem;
|
||||
max-width: 80%;
|
||||
background-color: #1f262b;
|
||||
box-shadow: 3px 3px 10px #333;
|
||||
border: 2px solid #fff;
|
||||
@ -52,8 +100,9 @@ table {
|
||||
border-spacing: 2px;
|
||||
border-radius: 0.75rem;
|
||||
color: #fff;
|
||||
font-size: 1.2rem;
|
||||
font-family: "Roboto", regular, sans-serif;
|
||||
font-size: 1rem;
|
||||
table-layout: auto;
|
||||
min-width: max-content;
|
||||
}
|
||||
|
||||
tr {
|
||||
@ -65,20 +114,21 @@ tr {
|
||||
th {
|
||||
margin: auto;
|
||||
background-color: #546E7A;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
padding: 1rem;
|
||||
border-radius: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
td {
|
||||
margin: auto;
|
||||
background-color: #37474F;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
padding: 0.5rem;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
|
||||
td.left, th.left {
|
||||
border-radius: 0.5rem 0 0 0.5rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
td.right, th.right {
|
||||
@ -87,5 +137,6 @@ td.right, th.right {
|
||||
|
||||
td.mid, th.mid {
|
||||
border-radius: 0 0 0 0;
|
||||
width: auto;
|
||||
}
|
||||
</style>
|
||||
@ -108,23 +108,6 @@ export default {
|
||||
height: min-content;
|
||||
width: 100%;
|
||||
}
|
||||
input{
|
||||
padding: 0 2rem 0 2rem;
|
||||
height: 2.5rem;
|
||||
color: #fff;
|
||||
background-color: #1d1d1d;
|
||||
border-radius: 1.25rem;
|
||||
border: 1px solid #fff;
|
||||
text-align: center;
|
||||
font-size: 1.1rem;
|
||||
margin: 0.5rem;
|
||||
appearance: none;
|
||||
outline: none;
|
||||
}
|
||||
input:focus{
|
||||
color: #000;
|
||||
background-color: #fff;
|
||||
}
|
||||
.throbber{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
|
||||
@ -102,19 +102,7 @@ export default {
|
||||
text-align: center;
|
||||
}
|
||||
input{
|
||||
padding: 0 2rem 0 2rem;
|
||||
height: 2.5rem;
|
||||
width: calc(100% - 6rem);
|
||||
left: 1rem;
|
||||
color: #fff;
|
||||
background-color: #1d1d1d;
|
||||
border-radius: 1.25rem;
|
||||
border: 1px solid #fff;
|
||||
text-align: center;
|
||||
font-size: 1.1rem;
|
||||
margin: 0.5rem;
|
||||
appearance: none;
|
||||
outline: none;
|
||||
width: calc(100% - 5rem);
|
||||
}
|
||||
.wideElement{
|
||||
display: block;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user