Browse Source

Added alert box to save project but need a way to trigger an error?

kb/add-usage-guide
Matthew Aaron Raymer 2 years ago
parent
commit
2d78a46ef2
  1. 40
      src/views/NewEditProjectView.vue

40
src/views/NewEditProjectView.vue

@ -63,11 +63,10 @@
</button>
</div>
</section>
<div
class="hidden dismissable-alert bg-slate-100 p-5 rounded drop-shadow-lg absolute top-3 inset-x-3 transition-transform ease-in duration-300"
>
<div v-bind:class="computedAlertClassNames()">
<button
class="close-button bg-slate-200 w-8 leading-loose rounded-full absolute top-2 right-2"
@click="onClickClose()"
>
<i class="fa-solid fa-xmark"></i>
</button>
@ -200,10 +199,11 @@ export default class NewEditProjectView extends Vue {
console.log("Got resp data:", resp.data);
if (resp.data?.success?.fullIri) {
this.errorMessage = "";
this.alertTitle = "";
this.alertMessage = "";
useAppStore().setProjectId(resp.data.success.fullIri);
setTimeout(
function (that: Vue) {
console.log("THAT:", localStorage.getItem("projectId"));
const route = {
name: "project",
};
@ -218,13 +218,19 @@ export default class NewEditProjectView extends Vue {
let userMessage = "There was an error. See logs for more info.";
const serverError = error as AxiosError;
if (serverError) {
this.isAlertVisible = true;
if (serverError.message) {
this.alertTitle = "User Message";
userMessage = serverError.message; // This is info for the user.
this.alertMessage = userMessage;
} else {
console.log("Server gave an error:", serverError);
this.alertTitle = "Server Message";
this.alertMessage = JSON.stringify(serverError.toJSON());
}
} else {
console.log("Here's the full error trying to save the claim:", error);
this.alertTitle = "Claim Error";
this.alertMessage = error as string;
}
// Now set that error for the user to see.
this.errorMessage = userMessage;
@ -232,6 +238,12 @@ export default class NewEditProjectView extends Vue {
}
}
public onClickClose() {
this.isAlertVisible = false;
this.alertTitle = "";
this.alertMessage = "";
}
public async onSaveProjectClick() {
this.isHiddenSave = true;
this.isHiddenSpinner = false;
@ -249,5 +261,23 @@ export default class NewEditProjectView extends Vue {
public onCancelClick() {
this.$router.back();
}
isAlertVisible = false;
public computedAlertClassNames() {
return {
hidden: this.isAlertVisible,
"dismissable-alert": true,
"bg-slate-100": true,
"p-5": true,
rounded: true,
"drop-shadow-lg": true,
absolute: true,
"top-3": true,
"inset-x-3": true,
"transition-transform": true,
"ease-in": true,
"duration-300": true,
};
}
}
</script>

Loading…
Cancel
Save