mirror of
https://github.com/filebrowser/filebrowser.git
synced 2024-06-07 23:00:43 +00:00
Prettier success messages
This commit is contained in:
parent
338e73a8b2
commit
bb116fe5b0
50
api.go
50
api.go
@ -72,7 +72,7 @@ func serveAPI(c *requestContext, w http.ResponseWriter, r *http.Request) (int, e
|
||||
case "resource":
|
||||
return resourceHandler(c, w, r)
|
||||
case "users":
|
||||
if !c.us.Admin && !(r.URL.Path == "/self" && r.Method == http.MethodPut) {
|
||||
if !c.us.Admin && !((r.URL.Path == "/change-password" || r.URL.Path == "/change-css") && r.Method == http.MethodPut) {
|
||||
return http.StatusForbidden, nil
|
||||
}
|
||||
|
||||
@ -503,7 +503,7 @@ func usersPutHandler(c *requestContext, w http.ResponseWriter, r *http.Request)
|
||||
sid = strings.TrimSuffix(sid, "/")
|
||||
|
||||
id, err := strconv.Atoi(sid)
|
||||
if err != nil && sid != "self" {
|
||||
if err != nil && sid != "change-password" && sid != "change-css" {
|
||||
return http.StatusNotFound, err
|
||||
}
|
||||
|
||||
@ -520,33 +520,33 @@ func usersPutHandler(c *requestContext, w http.ResponseWriter, r *http.Request)
|
||||
return http.StatusBadRequest, errors.New("Invalid JSON")
|
||||
}
|
||||
|
||||
if sid == "self" {
|
||||
if u.Password != "" {
|
||||
pw, err := hashPassword(u.Password)
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
c.us.Password = pw
|
||||
err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "Password", pw)
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
return http.StatusOK, nil
|
||||
if sid == "change-password" {
|
||||
if u.Password == "" {
|
||||
return http.StatusBadRequest, errors.New("Password cannot be empty")
|
||||
}
|
||||
|
||||
if u.CSS != "" {
|
||||
c.us.CSS = u.CSS
|
||||
err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "CSS", u.CSS)
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
return http.StatusOK, nil
|
||||
pw, err := hashPassword(u.Password)
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
return http.StatusBadRequest, errors.New("Password or CSS is missing")
|
||||
c.us.Password = pw
|
||||
err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "Password", pw)
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
return http.StatusOK, nil
|
||||
}
|
||||
|
||||
if sid == "change-css" {
|
||||
c.us.CSS = u.CSS
|
||||
err = c.fm.db.UpdateField(&User{ID: c.us.ID}, "CSS", u.CSS)
|
||||
if err != nil {
|
||||
return http.StatusInternalServerError, err
|
||||
}
|
||||
|
||||
return http.StatusOK, nil
|
||||
}
|
||||
|
||||
// The username and the filesystem cannot be empty.
|
||||
|
@ -66,10 +66,6 @@ export default {
|
||||
watch: {
|
||||
'$route': 'fetchData',
|
||||
'reload': function () {
|
||||
this.$store.commit('setReload', false)
|
||||
this.$store.commit('resetSelected')
|
||||
this.$store.commit('multiple', false)
|
||||
this.$store.commit('closeHovers')
|
||||
this.fetchData()
|
||||
}
|
||||
},
|
||||
@ -82,6 +78,12 @@ export default {
|
||||
methods: {
|
||||
...mapMutations([ 'setLoading' ]),
|
||||
fetchData () {
|
||||
// Reset view information.
|
||||
this.$store.commit('setReload', false)
|
||||
this.$store.commit('resetSelected')
|
||||
this.$store.commit('multiple', false)
|
||||
this.$store.commit('closeHovers')
|
||||
|
||||
// Set loading to true and reset the error.
|
||||
this.setLoading(true)
|
||||
this.error = null
|
||||
|
@ -3,7 +3,7 @@
|
||||
<site-header></site-header>
|
||||
<sidebar></sidebar>
|
||||
<main>
|
||||
<router-view></router-view>
|
||||
<router-view v-on:css-updated="updateCSS"></router-view>
|
||||
</main>
|
||||
<prompts></prompts>
|
||||
</div>
|
||||
@ -23,12 +23,23 @@ export default {
|
||||
SiteHeader,
|
||||
Prompts
|
||||
},
|
||||
watch: {
|
||||
'$route': function () {
|
||||
// Reset selected items and multiple selection.
|
||||
this.$store.commit('resetSelected')
|
||||
this.$store.commit('multiple', false)
|
||||
this.$store.commit('closeHovers')
|
||||
mounted () {
|
||||
this.updateCSS()
|
||||
},
|
||||
methods: {
|
||||
updateCSS () {
|
||||
let css = this.$store.state.user.css
|
||||
|
||||
let style = document.querySelector('style[title="user-css"]')
|
||||
if (style !== undefined && style !== null) {
|
||||
style.parentElement.removeChild(style)
|
||||
}
|
||||
|
||||
style = document.createElement('style')
|
||||
style.title = 'user-css'
|
||||
style.type = 'text/css'
|
||||
style.appendChild(document.createTextNode(css))
|
||||
document.head.appendChild(style)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -20,7 +20,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
import { mapState, mapMutations } from 'vuex'
|
||||
import api from '@/utils/api'
|
||||
|
||||
export default {
|
||||
@ -50,6 +50,7 @@ export default {
|
||||
this.css = this.user.css
|
||||
},
|
||||
methods: {
|
||||
...mapMutations([ 'showSuccess' ]),
|
||||
changePassword (event) {
|
||||
event.preventDefault()
|
||||
|
||||
@ -58,8 +59,7 @@ export default {
|
||||
}
|
||||
|
||||
api.updatePassword(this.password).then(() => {
|
||||
console.log('Success')
|
||||
// TODO: show success
|
||||
this.showSuccess('Password updated!')
|
||||
}).catch(e => {
|
||||
this.$store.commit('showError', e)
|
||||
})
|
||||
@ -68,8 +68,9 @@ export default {
|
||||
event.preventDefault()
|
||||
|
||||
api.updateCSS(this.css).then(() => {
|
||||
console.log('Success')
|
||||
// TODO: show success
|
||||
this.$store.commit('setUserCSS', this.css)
|
||||
this.$emit('css-updated')
|
||||
this.showSuccess('Styles updated!')
|
||||
}).catch(e => {
|
||||
this.$store.commit('showError', e)
|
||||
})
|
||||
|
@ -90,7 +90,10 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
fetchData () {
|
||||
if (this.$route.path === '/users/new') return
|
||||
if (this.$route.path === '/users/new') {
|
||||
this.reset()
|
||||
return
|
||||
}
|
||||
|
||||
api.getUser(this.$route.params[0]).then(user => {
|
||||
this.id = user.ID
|
||||
@ -125,6 +128,19 @@ export default {
|
||||
this.$router.push({ path: '/users/new' })
|
||||
})
|
||||
},
|
||||
reset () {
|
||||
this.id = 0
|
||||
this.admin = false
|
||||
this.allowNew = false
|
||||
this.allowEdit = false
|
||||
this.allowCommands = false
|
||||
this.password = ''
|
||||
this.username = ''
|
||||
this.filesystem = ''
|
||||
this.rules = ''
|
||||
this.css = ''
|
||||
this.commands = ''
|
||||
},
|
||||
save (event) {
|
||||
event.preventDefault()
|
||||
let user = this.parseForm()
|
||||
@ -132,6 +148,7 @@ export default {
|
||||
if (this.$route.path === '/users/new') {
|
||||
api.newUser(user).then(location => {
|
||||
this.$router.push({ path: location })
|
||||
this.$store.commit('showSuccess', 'User created!')
|
||||
}).catch(e => {
|
||||
this.$store.commit('showError', e)
|
||||
})
|
||||
@ -140,7 +157,7 @@ export default {
|
||||
}
|
||||
|
||||
api.updateUser(user).then(location => {
|
||||
this.$router.push({ path: location })
|
||||
this.$store.commit('showSuccess', 'User updated!')
|
||||
}).catch(e => {
|
||||
this.$store.commit('showError', e)
|
||||
})
|
||||
|
@ -9,6 +9,7 @@
|
||||
<info v-else-if="showInfo"></info>
|
||||
<move v-else-if="showMove"></move>
|
||||
<error v-else-if="showError"></error>
|
||||
<success v-else-if="showSuccess"></success>
|
||||
|
||||
<div v-show="showOverlay" @click="resetPrompts" class="overlay"></div>
|
||||
</div>
|
||||
@ -22,6 +23,7 @@ import Rename from './Rename'
|
||||
import Download from './Download'
|
||||
import Move from './Move'
|
||||
import Error from './Error'
|
||||
import Success from './Success'
|
||||
import NewFile from './NewFile'
|
||||
import NewDir from './NewDir'
|
||||
import { mapState } from 'vuex'
|
||||
@ -34,6 +36,7 @@ export default {
|
||||
Rename,
|
||||
Error,
|
||||
Download,
|
||||
Success,
|
||||
Move,
|
||||
NewFile,
|
||||
NewDir,
|
||||
@ -42,6 +45,7 @@ export default {
|
||||
computed: {
|
||||
...mapState(['show']),
|
||||
showError: function () { return this.show === 'error' },
|
||||
showSuccess: function () { return this.show === 'success' },
|
||||
showInfo: function () { return this.show === 'info' },
|
||||
showHelp: function () { return this.show === 'help' },
|
||||
showDelete: function () { return this.show === 'delete' },
|
||||
|
20
assets/src/components/prompts/Success.vue
Normal file
20
assets/src/components/prompts/Success.vue
Normal file
@ -0,0 +1,20 @@
|
||||
<template>
|
||||
<div class="prompt success">
|
||||
<i class="material-icons">done</i>
|
||||
<h3>{{ $store.state.showMessage }}</h3>
|
||||
<div>
|
||||
<button @click="close" autofocus>OK</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'success',
|
||||
methods: {
|
||||
close () {
|
||||
this.$store.commit('closeHovers')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
@ -64,6 +64,7 @@
|
||||
background-color: #e9eaeb;
|
||||
}
|
||||
|
||||
.prompt.success i,
|
||||
.prompt.error i {
|
||||
color: #F44336;
|
||||
display: block;
|
||||
@ -72,6 +73,7 @@
|
||||
font-size: 5em;
|
||||
}
|
||||
|
||||
.prompt.success h3,
|
||||
.prompt.error h3 {
|
||||
text-align: center;
|
||||
}
|
||||
@ -80,6 +82,14 @@
|
||||
background-color: #F44336
|
||||
}
|
||||
|
||||
.prompt.success i {
|
||||
color: #8BC34A;
|
||||
}
|
||||
|
||||
.prompt.success button {
|
||||
background-color: #8BC34A;
|
||||
}
|
||||
|
||||
|
||||
/* * * * * * * * * * * * * * * *
|
||||
* PROMPT - MOVE *
|
||||
|
@ -14,17 +14,16 @@ const mutations = {
|
||||
},
|
||||
showError: (state, value) => {
|
||||
state.show = 'error'
|
||||
|
||||
if (typeof value !== 'object') {
|
||||
state.showMessage = value
|
||||
return
|
||||
}
|
||||
|
||||
state.showMessage = value.message
|
||||
state.showMessage = value
|
||||
},
|
||||
showSuccess: (state, value) => {
|
||||
state.show = 'success'
|
||||
state.showMessage = value
|
||||
},
|
||||
setLoading: (state, value) => { state.loading = value },
|
||||
setReload: (state, value) => { state.reload = value },
|
||||
setUser: (state, value) => (state.user = value),
|
||||
setUserCSS: (state, value) => (state.user.css = value),
|
||||
setJWT: (state, value) => (state.jwt = value),
|
||||
multiple: (state, value) => (state.multiple = value),
|
||||
addSelected: (state, value) => (state.selected.push(value)),
|
||||
|
@ -277,7 +277,7 @@ function updateUser (user) {
|
||||
function updatePassword (password) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let request = new window.XMLHttpRequest()
|
||||
request.open('PUT', `${store.state.baseURL}/api/users/self`, true)
|
||||
request.open('PUT', `${store.state.baseURL}/api/users/change-password`, true)
|
||||
request.setRequestHeader('Authorization', `Bearer ${store.state.jwt}`)
|
||||
|
||||
request.onload = () => {
|
||||
@ -298,7 +298,7 @@ function updatePassword (password) {
|
||||
function updateCSS (css) {
|
||||
return new Promise((resolve, reject) => {
|
||||
let request = new window.XMLHttpRequest()
|
||||
request.open('PUT', `${store.state.baseURL}/api/users/self`, true)
|
||||
request.open('PUT', `${store.state.baseURL}/api/users/change-css`, true)
|
||||
request.setRequestHeader('Authorization', `Bearer ${store.state.jwt}`)
|
||||
|
||||
request.onload = () => {
|
||||
|
Loading…
Reference in New Issue
Block a user