mirror of
https://github.com/SecurityBrewery/catalyst.git
synced 2026-04-22 02:31:54 +02:00
refactor: improve setup and maintainability (#1067)
This commit is contained in:
Jonas Plum
GitHub
18
ui/src/store/catalyst.ts
Normal file
18
ui/src/store/catalyst.ts
Normal file
@@ -0,0 +1,18 @@
|
||||
import { useLocalStorage } from '@vueuse/core'
|
||||
import { defineStore } from 'pinia'
|
||||
import type { Ref } from 'vue'
|
||||
|
||||
type State = {
|
||||
sidebarCollapsed: Ref<boolean>
|
||||
}
|
||||
|
||||
export const useCatalystStore = defineStore('catalyst', {
|
||||
state: (): State => ({
|
||||
sidebarCollapsed: useLocalStorage('sidebarCollapsed', false)
|
||||
}),
|
||||
actions: {
|
||||
toggleSidebar() {
|
||||
this.sidebarCollapsed = !this.sidebarCollapsed
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -1,109 +0,0 @@
|
||||
import Vue from "vue";
|
||||
import Vuex, {ActionContext} from "vuex";
|
||||
import {API} from "@/services/api";
|
||||
import {UserData, TicketList, UserResponse, SettingsResponse} from "@/client";
|
||||
import axios, {AxiosResponse, AxiosResponseTransformer} from "axios";
|
||||
import {Alert} from "@/types/types";
|
||||
import {templateStore} from "./modules/templates";
|
||||
import {socketStore} from "@/store/modules/socket";
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
export default new Vuex.Store({
|
||||
modules: {
|
||||
templates: templateStore,
|
||||
socket: socketStore,
|
||||
},
|
||||
state: {
|
||||
user: {} as UserResponse,
|
||||
counts: {} as Record<string, number>,
|
||||
task_count: 0 as number,
|
||||
|
||||
settings: {} as SettingsResponse,
|
||||
userdata: {} as UserData,
|
||||
|
||||
alert: {} as Alert,
|
||||
showAlert: false as boolean,
|
||||
},
|
||||
getters: {
|
||||
timeformat: (state) => {
|
||||
if ('timeformat' in state.settings && state.settings.timeformat) {
|
||||
return state.settings.timeformat
|
||||
}
|
||||
return 'dd-MM-yyyy'
|
||||
}
|
||||
},
|
||||
mutations: {
|
||||
setUser (state, msg) {
|
||||
state.user = msg;
|
||||
},
|
||||
setCount (state, msg) {
|
||||
Vue.set(state.counts, msg.name, msg.count);
|
||||
},
|
||||
setTaskCount (state, msg) {
|
||||
state.task_count = msg;
|
||||
},
|
||||
setUserData (state, msg: UserData) {
|
||||
state.userdata = msg
|
||||
},
|
||||
setSettings (state, msg: SettingsResponse) {
|
||||
state.settings = msg
|
||||
},
|
||||
setAlert (state, msg: Alert) {
|
||||
state.showAlert = false;
|
||||
state.showAlert = true;
|
||||
state.alert = msg;
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
getUser (context: ActionContext<any, any>) {
|
||||
API.currentUser().then((response) => {
|
||||
context.commit("setUser", response.data);
|
||||
context.dispatch("fetchCount");
|
||||
})
|
||||
},
|
||||
getUserData (context: ActionContext<any, any>) {
|
||||
const defaultTransformers = axios.defaults.transformResponse as AxiosResponseTransformer[]
|
||||
const transformResponse = defaultTransformers.concat((data) => {
|
||||
data.notoast = true;
|
||||
return data
|
||||
});
|
||||
API.currentUserData({transformResponse: transformResponse}).then((response: AxiosResponse<UserData>) => {
|
||||
context.commit("setUserData", response.data);
|
||||
})
|
||||
},
|
||||
getSettings (context: ActionContext<any, any>) {
|
||||
API.getSettings().then((response: AxiosResponse<SettingsResponse>) => {
|
||||
context.commit("setSettings", response.data);
|
||||
context.dispatch("fetchCount");
|
||||
})
|
||||
},
|
||||
fetchCount (context: ActionContext<any, any>) {
|
||||
if (!context.state.user.id || !context.state.settings.ticketTypes) {
|
||||
return
|
||||
}
|
||||
|
||||
const username = context.state.user.id;
|
||||
Vue.lodash.forEach(context.state.settings.ticketTypes, (t) => {
|
||||
|
||||
API.listTickets(t.id,0,10,[],[], "status == 'open' AND (owner == '"+username+"' OR !owner)")
|
||||
.then((response: AxiosResponse<TicketList>) => {
|
||||
context.commit("setCount", {"name": t.id, "count": response.data.count});
|
||||
});
|
||||
API.listTasks().then((response) => {
|
||||
if (response.data) {
|
||||
context.commit("setTaskCount", response.data.length );
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
alertSuccess(context: ActionContext<any, any>, msg) {
|
||||
msg.type = "success"
|
||||
context.commit("setAlert", msg)
|
||||
},
|
||||
alertError(context: ActionContext<any, any>, msg) {
|
||||
msg.type = "error"
|
||||
context.commit("setAlert", msg)
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -1,64 +0,0 @@
|
||||
import Vue from "vue";
|
||||
import Vuex, {ActionContext} from "vuex";
|
||||
import lodash from "lodash";
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
interface State {
|
||||
socket: any;
|
||||
}
|
||||
|
||||
export const socketStore = {
|
||||
state: (): State => ({
|
||||
socket: {
|
||||
isConnected: false,
|
||||
message: '',
|
||||
reconnectError: false,
|
||||
}
|
||||
}),
|
||||
mutations: {
|
||||
SOCKET_ONOPEN (state: State, event: any) {
|
||||
// console.log("SOCKET_ONOPEN");
|
||||
Vue.prototype.$socket = event.currentTarget;
|
||||
state.socket.isConnected = true;
|
||||
},
|
||||
SOCKET_ONCLOSE (state: State, event: any) {
|
||||
// console.log("SOCKET_ONCLOSE");
|
||||
state.socket.isConnected = false;
|
||||
},
|
||||
SOCKET_ONERROR (state: State, event: any) {
|
||||
// console.log("SOCKET_ONERROR");
|
||||
console.error(state, event);
|
||||
},
|
||||
// default handler called for all methods
|
||||
SOCKET_ONMESSAGE (state: State, message: any) {
|
||||
// console.log("SOCKET_ONMESSAGE");
|
||||
state.socket.message = message;
|
||||
},
|
||||
// mutations for reconnect methods
|
||||
SOCKET_RECONNECT(state: State, count: any) {
|
||||
// console.log("SOCKET_RECONNECT");
|
||||
console.info(state, count);
|
||||
},
|
||||
SOCKET_RECONNECT_ERROR(state: State) {
|
||||
// console.log("SOCKET_RECONNECT_ERROR");
|
||||
state.socket.reconnectError = true;
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
sendMessage: function(context: ActionContext<any, any>, msg: any) {
|
||||
Vue.prototype.$socket.send(msg);
|
||||
},
|
||||
update: function (context: ActionContext<any, any>, msg: any) {
|
||||
// console.log("update", msg);
|
||||
if (!msg || !(lodash.has(msg, "ids")) || !msg["ids"]) {
|
||||
return
|
||||
}
|
||||
Vue.lodash.forEach(msg["ids"], (id) => {
|
||||
if (lodash.startsWith(id, "settings/")) {
|
||||
context.dispatch("getSetting")
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,75 +0,0 @@
|
||||
import Vue from "vue";
|
||||
import Vuex, {ActionContext} from "vuex";
|
||||
import {TicketTemplate} from "@/client";
|
||||
import {API} from "@/services/api";
|
||||
import {AxiosResponse} from "axios";
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
interface State {
|
||||
templates: Array<TicketTemplate>;
|
||||
}
|
||||
|
||||
export const templateStore = {
|
||||
state: (): State => ({
|
||||
templates: [],
|
||||
}),
|
||||
mutations: {
|
||||
setTemplates(state: State, msg: Array<TicketTemplate>) {
|
||||
state.templates = msg;
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
listTemplates(context: ActionContext<any, any>) {
|
||||
API.listTemplates().then((response: AxiosResponse<Array<TicketTemplate>>) => {
|
||||
context.commit("setTemplates", response.data)
|
||||
});
|
||||
},
|
||||
getTemplate(context: ActionContext<any, any>, id: string) {
|
||||
return new Promise((resolve) => {
|
||||
API.getTemplate(id).then((response: AxiosResponse<TicketTemplate>) => {
|
||||
resolve(response.data);
|
||||
}).catch(error => {
|
||||
context.dispatch("alertError", {name: "Template could not be loaded", details: error});
|
||||
});
|
||||
});
|
||||
},
|
||||
addTemplate(context: ActionContext<any, any>, template: TicketTemplate) {
|
||||
return new Promise((resolve) => {
|
||||
API.createTemplate(template).then(() => {
|
||||
context.dispatch("listTemplates").then(() => {
|
||||
context.dispatch("alertSuccess", {name: "Template created"}).then(() => {
|
||||
resolve({})
|
||||
});
|
||||
}).catch(error => {
|
||||
context.dispatch("alertError", {name: "Template created, but reload failed", details: error});
|
||||
});
|
||||
}).catch(error => {
|
||||
context.dispatch("alertError", {name: "Template could not be created", details: error});
|
||||
});
|
||||
});
|
||||
},
|
||||
updateTemplate(context: ActionContext<any, any>, msg: any) {
|
||||
API.updateTemplate(msg.id, msg.template).then(() => {
|
||||
context.dispatch("alertSuccess", {name: "Template updated"});
|
||||
}).catch(error => {
|
||||
context.dispatch("alertError", {name: "Template could not be updated", details: error});
|
||||
});
|
||||
},
|
||||
deleteTemplate(context: ActionContext<any, any>, id: string) {
|
||||
return new Promise((resolve) => {
|
||||
API.deleteTemplate(id).then(() => {
|
||||
context.dispatch("listTemplates").then(() => {
|
||||
context.dispatch("alertSuccess", {name: "Template deleted"}).then(() => {
|
||||
resolve({});
|
||||
});
|
||||
}).catch(error => {
|
||||
context.dispatch("alertError", {name: "Template deleted, but reload failed", details: error});
|
||||
});
|
||||
}).catch(error => {
|
||||
context.dispatch("alertError", {name: "Template could not be deleted", details: error});
|
||||
});
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user