449 lines
15 KiB
JavaScript
449 lines
15 KiB
JavaScript
import inlinesvg from "./util/inlineSvg.js";
|
|
import employees from "./components/employees/index.js";
|
|
import employeedetails from "./components/employeedetails/index.js";
|
|
import inventory from "./components/inventory/index.js";
|
|
import ranks from "./components/ranks/index.js";
|
|
import rankdetails from "./components/rankdetails/index.js";
|
|
import vault from "./components/vault/index.js";
|
|
|
|
import logs from "./components/logs/index.js";
|
|
import overall from "./components/overall/index.js";
|
|
import outfit from "./components/outfit/index.js";
|
|
import adminlist from "./components/adminlist/index.js";
|
|
import createmenu from "./components/createmenu/index.js";
|
|
import jobdetails from "./components/jobdetails/index.js";
|
|
|
|
|
|
const Modules = {};
|
|
|
|
const store = Vuex.createStore({
|
|
state: {
|
|
notifications: [],
|
|
permissions : {},
|
|
companies : [],
|
|
itemImagesFolder: "",
|
|
companyData: {
|
|
pageaccess: [],
|
|
permissions: {},
|
|
theme: 'blue',
|
|
company: '',
|
|
companylabel: '',
|
|
logo: '',
|
|
location: null,
|
|
employees: []
|
|
},
|
|
playerInfo: {
|
|
name: false,
|
|
pp: false
|
|
},
|
|
jobInfo: {
|
|
name: false,
|
|
label: false,
|
|
level: false,
|
|
grade_label: false
|
|
},
|
|
selectedRank: false,
|
|
playerInventory: false,
|
|
companyInventory: false,
|
|
selectedEmployeeIdentifier: false,
|
|
certifications: [],
|
|
ranks: [],
|
|
vaultData: {},
|
|
vaultDataHistory: [],
|
|
adminSelectedBusinessName: false,
|
|
locales : {},
|
|
|
|
},
|
|
getters: {
|
|
getSelectedEmployee(state) {
|
|
return state.companyData.employees.find(employee => employee.identifier == state.selectedEmployeeIdentifier);
|
|
},
|
|
getAdminSelectedCompany(state) {
|
|
return state.companies.find(company => company.company == state.adminSelectedBusinessName);
|
|
}
|
|
},
|
|
actions: {
|
|
filternotificationdataAll({ commit }, oldData) {
|
|
commit("resetVaultDataHistory", oldData);
|
|
|
|
},
|
|
filternotificationdata({ commit }, { identifier, oldData }) {
|
|
let filteredData = oldData.filter(item => item.identifier == identifier);
|
|
commit("setVaultDataHistory", filteredData);
|
|
}
|
|
},
|
|
mutations: {
|
|
setLocales(state, payload){
|
|
state.locales = payload
|
|
},
|
|
setVaultDataHistory(state, payload){
|
|
state.vaultDataHistory = payload
|
|
},
|
|
resetVaultDataHistory(state, payload){
|
|
state.vaultDataHistory = payload
|
|
},
|
|
setPermissions(state, payload){
|
|
state.permissions = payload
|
|
},
|
|
setCompanies(state, payload){
|
|
state.companies = payload
|
|
},
|
|
setAdminSelectedBusinessName(state, payload){
|
|
state.adminSelectedBusinessName = payload
|
|
},
|
|
SendNotification(state, text) {
|
|
const time = 3000;
|
|
let id = Date.now();
|
|
if (state.notifications.length > 0) {
|
|
if (state.timeout) {
|
|
clearTimeout(state.timeout);
|
|
state.timeout = false;
|
|
}
|
|
state.notifications = [];
|
|
}
|
|
state.notifications.push({
|
|
id: id,
|
|
text: text,
|
|
time: time
|
|
});
|
|
state.timeout = setTimeout(() => {
|
|
state.notifications = state.notifications.filter(notification => notification.id != id);
|
|
}, time);
|
|
},
|
|
setRanks(state, payload) {
|
|
state.ranks = payload;
|
|
state.ranks.sort((a, b) => b.grade - a.grade);
|
|
},
|
|
setCompanyMoneyData(state, payload) {
|
|
state.vaultData = payload;
|
|
},
|
|
appendToCompanyMoneyLog(state, payload) {
|
|
state.vaultDataHistory.push(payload);
|
|
},
|
|
resetCompanyMoneyLog(state, payload) {
|
|
state.vaultDataHistory = payload;
|
|
},
|
|
setCertifications(state, payload) {
|
|
state.certifications = payload;
|
|
},
|
|
setSelectedRank(state, payload) {
|
|
state.selectedRank = payload;
|
|
},
|
|
setSelectedEmployeeIdentifier(state, payload) {
|
|
state.selectedEmployeeIdentifier = payload;
|
|
},
|
|
setPlayerInfo(state, payload) {
|
|
state.playerInfo[payload.type] = payload.value;
|
|
},
|
|
setCompanyData(state, payload) {
|
|
state.companyData = payload;
|
|
},
|
|
setItemImagesFolder(state, payload) {
|
|
state.itemImagesFolder = payload;
|
|
},
|
|
setJobInfo(state, payload) {
|
|
state.jobInfo = payload;
|
|
},
|
|
setPlayerInventory(state, payload) {
|
|
state.playerInventory = payload;
|
|
},
|
|
setPlayerCompanyInventory(state, payload) {
|
|
state.companyInventory = payload;
|
|
}
|
|
},
|
|
modules: Modules
|
|
});
|
|
|
|
const app = Vue.createApp({
|
|
components: {
|
|
vault: vault
|
|
},
|
|
data: () => ({
|
|
activeMenu: "",
|
|
activePage: "",
|
|
currentAction: false,
|
|
minute: 0,
|
|
hour: 0,
|
|
month: 0,
|
|
day: 0,
|
|
adminActivePage: ""
|
|
}),
|
|
computed: {
|
|
bg(){
|
|
if(this.companyData.theme == 'blue'){
|
|
return './assets/images/container-overlay.png'
|
|
}else{
|
|
return `./assets/images/${this.companyData.theme}/container-overlay.png`
|
|
}
|
|
},
|
|
formatTime() {
|
|
return `${this.day} ${this.month} ${this.hour}:${this.minute}`;
|
|
},
|
|
...Vuex.mapState({
|
|
companyData: state => state.companyData,
|
|
companyInventory: state => state.companyInventory,
|
|
notifications: state => state.notifications,
|
|
permissions : state => state.permissions,
|
|
locales : state => state.locales,
|
|
|
|
})
|
|
},
|
|
methods: {
|
|
keyHandler(e) {
|
|
if (e.which == 27) {
|
|
this.safeClose();
|
|
}
|
|
},
|
|
safeClose() {
|
|
// First notify the backend
|
|
postNUI("close");
|
|
// Then reset the UI state with a small delay to prevent Vue errors
|
|
this.$nextTick(() => {
|
|
this.activeMenu = "";
|
|
this.activePage = "";
|
|
this.adminActivePage = "";
|
|
});
|
|
},
|
|
setAdminActivePage(payload) {
|
|
this.adminActivePage = payload;
|
|
},
|
|
|
|
setTime() {
|
|
const date = new Date();
|
|
let Hour = date.getHours();
|
|
let Minute = date.getMinutes();
|
|
if (Hour < 10) {
|
|
Hour = "0" + Hour;
|
|
}
|
|
|
|
if (Minute < 10) {
|
|
Minute = "0" + Minute;
|
|
}
|
|
this.minute = Minute;
|
|
this.hour = Hour;
|
|
},
|
|
setDate() {
|
|
const date = new Date();
|
|
let day = date.getDate();
|
|
let month = date.getMonth();
|
|
let months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
|
|
if (day < 10) {
|
|
day = "0" + day;
|
|
}
|
|
|
|
this.month = months[month];
|
|
this.day = day;
|
|
},
|
|
setCurrentAction(payload) {
|
|
this.currentAction = payload;
|
|
},
|
|
formatInventoryData(data) {
|
|
let tempData = {};
|
|
|
|
for (let item of data) {
|
|
if (tempData[item.name]) {
|
|
tempData[item.name].amount += item.amount;
|
|
} else {
|
|
tempData[item.name] = {
|
|
name: item.name,
|
|
label: item.label,
|
|
amount: item.amount,
|
|
metadata: item.metadata
|
|
};
|
|
}
|
|
}
|
|
let formattedData = {};
|
|
let index = 1;
|
|
for (let key in tempData) {
|
|
formattedData[String(index)] = tempData[key];
|
|
index++;
|
|
}
|
|
return formattedData;
|
|
},
|
|
close(){
|
|
this.safeClose();
|
|
},
|
|
async eventHandler(event) {
|
|
switch (event.data.action) {
|
|
case "checkNui":
|
|
postNUI("loaded");
|
|
break;
|
|
case "close":
|
|
this.close()
|
|
break;
|
|
case "setItemImagesFolder":
|
|
this.setItemImagesFolder(event.data.payload);
|
|
break;
|
|
case "setJobInfo":
|
|
this.setJobInfo(event.data.payload);
|
|
break;
|
|
case "openMenu":
|
|
this.activeMenu = event.data.payload.type;
|
|
if (event.data.payload.type == "admin") {
|
|
this.adminActivePage = event.data.payload.page;
|
|
} else {
|
|
this.activePage = event.data.payload.page;
|
|
}
|
|
break;
|
|
case "setCompanyData":
|
|
this.setCompanyData(event.data.payload);
|
|
break;
|
|
case "setPlayerInfo":
|
|
this.setPlayerInfo({
|
|
type: event.data.payload.type,
|
|
value: event.data.payload.value
|
|
});
|
|
break;
|
|
case "PLAYER_INVENTORY":
|
|
this.$store.commit("setPlayerInventory", this.formatInventoryData(event.data.payload));
|
|
break;
|
|
case "COMPANY_INVENTORY":
|
|
this.$store.commit("setPlayerCompanyInventory", this.formatInventoryData(event.data.payload));
|
|
break;
|
|
case "setCertifications":
|
|
this.setCertifications(event.data.payload);
|
|
break;
|
|
case "sendNotification":
|
|
this.SendNotification(event.data.payload);
|
|
break;
|
|
case "PLAYER_MONEY_AND_COMPANY_MONEY":
|
|
this.$store.commit("setCompanyMoneyData", event.data.payload);
|
|
break;
|
|
case "UPDATE_COMPANY_MONEY_LOG":
|
|
this.$store.commit("appendToCompanyMoneyLog", event.data.payload);
|
|
break;
|
|
case "FIRST_UPDATE_COMPANY_MONEY_LOG":
|
|
this.$store.commit("resetCompanyMoneyLog", event.data.payload);
|
|
break;
|
|
case "setPermissions":
|
|
this.setPermissions(event.data.payload)
|
|
break
|
|
case "setCompanies":
|
|
this.setCompanies(event.data.payload)
|
|
break
|
|
case "setRanks":
|
|
const data = await postNUI("getRanks");
|
|
this.setRanks(data);
|
|
break
|
|
case "setLocales":
|
|
this.setLocales(event.data.payload)
|
|
break
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
setActivePage(payload) {
|
|
if(payload == 'employees' && !this.permissions.accessToEmployeePage){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
if(payload == 'ranks' && !this.permissions.accessToRanksPage){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
if(payload == 'vault' && !this.permissions.accessToCompanyPage){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
if(payload == 'inventory' && !this.permissions.accessToInventory){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
if(payload == 'logs' && !this.permissions.accessToClothingPage){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
if(payload == 'outfit' && !this.permissions.accessToClothingPage){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
if(payload == 'overall' && !this.permissions.accessToBusinessPage){
|
|
this.SendNotification("You don't have access to this page");
|
|
return
|
|
}
|
|
this.activePage = payload;
|
|
},
|
|
...Vuex.mapMutations({
|
|
setItemImagesFolder: "setItemImagesFolder",
|
|
setJobInfo: "setJobInfo",
|
|
setCompanyData: "setCompanyData",
|
|
setPlayerInfo: "setPlayerInfo",
|
|
setCertifications: "setCertifications",
|
|
setRanks: "setRanks",
|
|
SendNotification: "SendNotification",
|
|
setPermissions : "setPermissions",
|
|
setCompanies : "setCompanies",
|
|
setLocales : "setLocales",
|
|
})
|
|
},
|
|
watch: {
|
|
activePage(val, old) {
|
|
if (this.companyData && this.companyData.pageaccess && (val == "employees" || val == "ranks" || val == "vault" || val == "inventory" || val == "outfit")) {
|
|
if (!this.companyData.pageaccess.includes(val)) {
|
|
if (!old) {
|
|
this.setActivePage(false);
|
|
} else {
|
|
this.setActivePage(old);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
components: {
|
|
inlinesvg,
|
|
employees,
|
|
employeedetails,
|
|
inventory,
|
|
ranks,
|
|
rankdetails,
|
|
vault,
|
|
logs,
|
|
overall,
|
|
outfit,
|
|
adminlist,
|
|
createmenu,
|
|
jobdetails,
|
|
},
|
|
beforeDestroy() { },
|
|
mounted() {
|
|
document.querySelector('#app').style.display = 'block'
|
|
setTimeout(async () => {
|
|
const data = await postNUI("getRanks");
|
|
this.setRanks(data);
|
|
}, 2000);
|
|
|
|
window.addEventListener("keyup", this.keyHandler);
|
|
window.addEventListener("message", this.eventHandler);
|
|
this.setTime();
|
|
this.setDate();
|
|
setInterval(() => {
|
|
this.setTime();
|
|
}, 1000);
|
|
}
|
|
});
|
|
if (window.GetParentResourceName) {
|
|
resourceName = window.GetParentResourceName();
|
|
}
|
|
|
|
window.postNUI = async (name, data) => {
|
|
try {
|
|
const response = await fetch(`https://${resourceName}/${name}`, {
|
|
method: "POST",
|
|
mode: "cors",
|
|
cache: "no-cache",
|
|
credentials: "same-origin",
|
|
headers: {
|
|
"Content-Type": "application/json"
|
|
},
|
|
redirect: "follow",
|
|
referrerPolicy: "no-referrer",
|
|
body: JSON.stringify(data)
|
|
});
|
|
return !response.ok ? null : response.json();
|
|
} catch (error) {
|
|
// console.log(error)
|
|
}
|
|
};
|
|
app.use(store).mount("#app");
|
|
var resourceName = "mBossmenu";
|