dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-06-18 22:11:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

added error message for server general settings.

Browse source
This commit is contained in:
supertiger1234 2019-08-10 11:58:52 +01:00
parent e0fc34f6ed
commit 48f3f80a6e
1 changed files with 74 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

120
src/components/app/Popouts/Popouts/ServerSettingsPanels/General.vue
View file

@ -1,40 +1,48 @@
<template>
<div class="content-inner">
<div class="top">
<profile-picture
class="server-avatar"
size="100px"
:url="update.avatar || `${avatarDomain}/${server.avatar}`"
/>
<div class="button" @click="$refs.avatarBrowser.click()">Edit Avatar</div>
<div class="content">
<errors-list-template :errors="errors" v-if="errors" />
<div class="content-inner">
<div class="top">
<profile-picture
class="server-avatar"
size="100px"
:url="update.avatar || `${avatarDomain}/${server.avatar}`"
/>
<div class="button" @click="$refs.avatarBrowser.click()">Edit Avatar</div>
<input
ref="avatarBrowser"
type="file"
accept=".jpeg, .jpg, .png, .gif"
class="hidden"
@change="avatarChangeEvent"
>
<div class="input">
<div class="input-title">Server Name</div>
<input
type="text"
ref="name"
placeholder="Channel Name"
:default-value.prop="server.name"
@input="inputEvent('name', $event)"
/>
<div class="input">
<div class="input-title">Server Name</div>
<input
type="text"
ref="name"
placeholder="Channel Name"
:default-value.prop="server.name"
@input="inputEvent('name', $event)"
/>
</div>
</div>
</div>
<div class="details">
<div class="options">
<drop-down
:items="channels"
:selected-item="defaultChannel"
name="Default Channel"
@change="changeEvent('default_channel_id', $event.channelID)"
/>
<div class="details">
<div class="options">
<drop-down
:items="channels"
:selected-item="defaultChannel"
name="Default Channel"
@change="changeEvent('default_channel_id', $event.channelID)"
/>
</div>
<div
class="button save-button"
:class="{disabled: requestSent}"
v-if="changed"
@click="updateServer()"
>{{requestSent ? 'Saving...' : 'Save Changes'}}</div>
</div>
<div class="button save-button" :class="{disabled: requestSent}" v-if="changed" @click="updateServer()">{{requestSent ? 'Saving...' : 'Save Changes'}}</div>
</div>
</div>
</template>
@ -43,17 +51,19 @@
import config from "@/config.js";
import { bus } from "@/main";
import ProfilePicture from "@/components/ProfilePictureTemplate.vue";
import ErrorsListTemplate from "@/components/app/errorsListTemplate";
import ServerService from "@/services/ServerService";
import DropDown from "./DropDownMenu";
import { mapState } from "vuex";
import path from "path";
export default {
components: { DropDown, ProfilePicture },
components: { DropDown, ProfilePicture, ErrorsListTemplate },
data() {
return {
requestSent: false,
changed: false,
errors: null,
avatarDomain: config.domain + "/avatars/",
update: {}
};
@ -68,17 +78,23 @@ export default {
async updateServer() {
if (this.requestSent) return;
this.requestSent = true;
const {ok, error, result} = await ServerService.updateServer(this.server.server_id, this.update);
const { ok, error, result } = await ServerService.updateServer(
this.server.server_id,
this.update
);
if (!ok) {
this.requestSent = false;
if (!error.response) {
return this.$store.dispatch('setGenericMessage', "Something went wrong. Try again later.")
if (error.response) {
if (error.response.data.message)
this.errors = [{ msg: error.response.data.message }];
else this.errors = error.response.data.errors;
} else {
this.errors = [{ msg: "Something went wrong." }];
}
return this.$store.dispatch('setGenericMessage', error.response.data.message)
this.requestSent = false;
return;
}
this.update = {};
this.requestSent = false;
},
avatarChangeEvent(e) {
if (!this.googleDriveLinked) {
@ -89,38 +105,47 @@ export default {
}
const file = event.target.files[0];
const _this = this;
const maxSize = 2092000;
const maxSize = 2092000;
if (file.size > maxSize) {
return this.$store.dispatch('setGenericMessage', "Image is larger than 2MB")
return this.$store.dispatch(
"setGenericMessage",
"Image is larger than 2MB"
);
}
event.target.value = "";
const allowedFormats = [".png", ".jpeg", ".gif", ".jpg"];
if (!allowedFormats.includes(path.extname(file.name).toLowerCase())) {
return this.$store.dispatch('setGenericMessage', "That file format is not allowed!");
return this.$store.dispatch(
"setGenericMessage",
"That file format is not allowed!"
);
}
let reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
_this.$set(_this.update, 'avatar', reader.result);
reader.onload = function() {
_this.$set(_this.update, "avatar", reader.result);
};
reader.onerror = function (error) {
console.log('Error: ', error);
return this.$store.dispatch('setGenericMessage', "Something went wrong. Try again later.")
reader.onerror = function(error) {
console.log("Error: ", error);
return this.$store.dispatch(
"setGenericMessage",
"Something went wrong. Try again later."
);
};
}
},
watch: {
update(obj) {
if ( Object.keys(obj).length === 0 ){
return this.changed = false
if (Object.keys(obj).length === 0) {
return (this.changed = false);
}
this.changed = true;
}
},
computed: {
googleDriveLinked() {
return this.$store.getters['settingsModule/settings'].GDriveLinked
return this.$store.getters["settingsModule/settings"].GDriveLinked;
},
server() {
const serverID = this.$store.state.popoutsModule.serverSettings.serverID;
@ -157,6 +182,9 @@ export default {
display: flex;
flex-direction: column;
}
.errors {
align-self: center;
}
.server-avatar {
align-self: center;
margin: 10px;