331 lines
13 KiB
JavaScript
331 lines
13 KiB
JavaScript
const app = new Vue({
|
|
el: "#app",
|
|
data: {
|
|
darkMode: false,
|
|
|
|
userUsername: "Lvorex",
|
|
userRank: { title: "Admin", color: "#F34240" },
|
|
userIcon: "",
|
|
userPermissions: undefined,
|
|
accountType: "",
|
|
|
|
notifyMenu: false,
|
|
newNotify: false,
|
|
searchValue: "",
|
|
|
|
giveVehiclePopup: undefined,
|
|
|
|
vehicleType: "",
|
|
vehicleImage: "img/CarImage.png",
|
|
vehicleClasses: [
|
|
{ class: "S+", value: 7 },
|
|
{ class: "S", value: 6 },
|
|
{ class: "A+", value: 5 },
|
|
{ class: "A", value: 4 },
|
|
{ class: "B", value: 3 },
|
|
{ class: "C", value: 2 },
|
|
{ class: "D", value: 1 },
|
|
{ class: "E", value: 0 }
|
|
],
|
|
|
|
selectedVehicle: {
|
|
selectedVehicleInputs: [
|
|
{ name: "Vehicle Manufacturer", class: "manufacturer", value: "GALLIVANTER" },
|
|
{ name: "Vehicle Model", class: "vehmodel", value: "Baller" },
|
|
{ name: "Vehicle Hash", class: "hash", value: "0x1C09CF5E" },
|
|
{ name: "Vehicle Category", class: "category", value: "SUV" },
|
|
{ name: "Vehicle Purchasable At", class: "shop", value: "PDM Motorspot, DELUXE Cars by Anthon" },
|
|
{ name: "Vehicle Default Price", class: "price", value: "$ 800,000" },
|
|
],
|
|
credentials: {
|
|
class: "B",
|
|
brand: "GALLIVANTER",
|
|
name: "Baller SUV"
|
|
}
|
|
},
|
|
|
|
selectedFile: undefined,
|
|
selectedImageUrl: "",
|
|
selectedImage: undefined
|
|
},
|
|
components: {
|
|
"m-navbar": navbarComp,
|
|
"left-navbar": leftNavbarComp
|
|
},
|
|
methods: {
|
|
giveVehicleToPlayer: async function() {
|
|
if (this.userPermissions["Vehicles"][5] === false) {
|
|
this.newNotify = {
|
|
desc: "Your rank is not enough.",
|
|
author: "System"
|
|
}
|
|
return
|
|
}
|
|
|
|
if (!this.giveVehiclePopup) return
|
|
const playerIdentifier = this.giveVehiclePopup.playerIdentifier
|
|
if (
|
|
playerIdentifier === "" ||
|
|
playerIdentifier.includes(" ")
|
|
) {
|
|
this.giveVehiclePopup.playerIdentifier = "Please enter a player id or identifier."
|
|
setTimeout(() => {
|
|
this.giveVehiclePopup.playerIdentifier = ""
|
|
}, 2000)
|
|
return
|
|
}
|
|
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/vehiclesGiveVehicleToPlayer.lvorex`, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key")),
|
|
model: this.selectedVehicle.credentials.model,
|
|
playerIdentifier: playerIdentifier
|
|
})
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) {
|
|
this.giveVehiclePopup.playerIdentifier = result.message
|
|
setTimeout(() => {
|
|
this.giveVehiclePopup.playerIdentifier = ""
|
|
}, 2000)
|
|
return
|
|
}
|
|
|
|
this.giveVehiclePopup = undefined
|
|
},
|
|
|
|
goBackToVehicles: function() {
|
|
location.href = "/Panel/Vehicles/"
|
|
},
|
|
|
|
triggerFileInput: function() {
|
|
document.getElementById("vinfo-left-right-realFile").click()
|
|
},
|
|
|
|
changeSelectedImage: function(event) {
|
|
if (this.userPermissions["Vehicles"][3] === false) {
|
|
this.newNotify = {
|
|
desc: "Your rank is not enough.",
|
|
author: "System"
|
|
}
|
|
return
|
|
}
|
|
|
|
const SentFile = event.target.files[0]
|
|
const fileReader = new FileReader()
|
|
let imageUrl = ""
|
|
const vm = this
|
|
fileReader.addEventListener("load", () => {
|
|
imageUrl = fileReader.result
|
|
vm.selectedFile = SentFile
|
|
console.log(SentFile.path)
|
|
vm.selectedImage = imageUrl
|
|
})
|
|
fileReader.readAsDataURL(SentFile)
|
|
},
|
|
|
|
uploadImage: async function() {
|
|
if (this.userPermissions["Vehicles"][3] === false) {
|
|
this.newNotify = {
|
|
desc: "Your rank is not enough.",
|
|
author: "System"
|
|
}
|
|
return
|
|
}
|
|
|
|
if (this.selectedImageUrl && this.selectedImageUrl.includes(":")) {
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/changeVehicleImageByLink.lvorex`, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key")),
|
|
model: this.selectedVehicle.credentials.model,
|
|
link: this.selectedImageUrl
|
|
})
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) return console.log(result.message)
|
|
document.getElementById("vinfo-left-right-file").style.backgroundImage = `url(${this.selectedImageUrl})`
|
|
this.vehicleImage = this.selectedImageUrl
|
|
return
|
|
}
|
|
if (!this.selectedImage) return
|
|
console.log(this.selectedFile)
|
|
const formData = new FormData()
|
|
formData.append("file", this.selectedFile)
|
|
formData.append("key", sha1(sessionStorage.getItem("uid-key")))
|
|
formData.append("model", this.selectedVehicle.credentials.model)
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/changeVehicleImage.lvorex`, {
|
|
method: "POST",
|
|
body: formData
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) return console.log(result.message)
|
|
|
|
document.getElementById("vinfo-left-right-file").style.backgroundImage = `url(${this.selectedImage})`
|
|
this.vehicleImage = this.selectedImage
|
|
this.selectedImage = undefined
|
|
},
|
|
|
|
clearImage: async function() {
|
|
if (this.userPermissions["Vehicles"][3] === false) {
|
|
this.newNotify = {
|
|
desc: "Your rank is not enough.",
|
|
author: "System"
|
|
}
|
|
return
|
|
}
|
|
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/clearVehicleImage.lvorex`, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key")),
|
|
model: this.selectedVehicle.credentials.model
|
|
})
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) return console.log(result.message)
|
|
|
|
document.getElementById("vinfo-left-right-file").style.backgroundImage = ""
|
|
this.vehicleImage = "img/CarImage.png"
|
|
this.selectedImage = undefined
|
|
},
|
|
|
|
changeVehicleClass: async function(c) {
|
|
if (this.userPermissions["Vehicles"][4] === false) {
|
|
this.newNotify = {
|
|
desc: "Your rank is not enough.",
|
|
author: "System"
|
|
}
|
|
return
|
|
}
|
|
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/changeVehicleClass.lvorex`, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key")),
|
|
model: this.selectedVehicle.credentials.model,
|
|
class: c
|
|
})
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) return console.log(result.message)
|
|
|
|
this.selectedVehicle.credentials.class = c
|
|
},
|
|
|
|
changeVehicleImportStatus: async function(status) {
|
|
if (this.userPermissions["Vehicles"][4] === false) {
|
|
this.newNotify = {
|
|
desc: "Your rank is not enough.",
|
|
author: "System"
|
|
}
|
|
return
|
|
}
|
|
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/changeVehicleImportStatus.lvorex`, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key")),
|
|
model: this.selectedVehicle.credentials.model,
|
|
import: Number(status)
|
|
})
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) return console.log(result.message)
|
|
|
|
this.selectedVehicle.credentials.import = status
|
|
}
|
|
},
|
|
mounted: async function() {
|
|
let result = await fetch(`${location.protocol}//${location.hostname}:${location.port}/controlKeyWithServer.lvorex`, {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json"
|
|
},
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key"))
|
|
})
|
|
})
|
|
|
|
result = await result.json()
|
|
if (result.code === 404) {
|
|
location.href = "/"
|
|
return
|
|
}
|
|
|
|
const userDetails = JSON.parse(result.message)
|
|
if (userDetails.permissions["Vehicles"][1] === false) {
|
|
location.href = "/Panel/Vehicles"
|
|
return
|
|
}
|
|
|
|
const userRankColors = {
|
|
"Not Authorized": "#9e9e9e",
|
|
Moderator: "#F34240",
|
|
Admin: "#F34240",
|
|
Owner: "#F34240",
|
|
}
|
|
|
|
this.darkMode = userDetails.darkMode === 1 ? true : false
|
|
this.userUsername = userDetails.username
|
|
this.userRank.title = userDetails.rank
|
|
this.userRank.color = "#F34240"
|
|
this.userIcon = userDetails.avatar
|
|
this.accountType = userDetails.accountType
|
|
this.userPermissions = userDetails.permissions
|
|
|
|
const fragments = new URLSearchParams(window.location.search)
|
|
const [
|
|
vehicleType,
|
|
vehicleModel
|
|
] = [
|
|
fragments.get("type"),
|
|
fragments.get("model"),
|
|
fragments.get("plate")
|
|
]
|
|
if (vehicleType === "server") {
|
|
let result = await fetch(`/getServerVehicles.lvorex`, {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
body: JSON.stringify({
|
|
key: sha1(sessionStorage.getItem("uid-key"))
|
|
})
|
|
})
|
|
result = await result.json()
|
|
if (result.code !== 200) return console.log(result.message)
|
|
const allVehicles = result.message
|
|
const NeededVehicle = allVehicles.find(v => v.model === vehicleModel)
|
|
this.selectedVehicle = {
|
|
selectedVehicleInputs: [
|
|
{ name: "Vehicle Manufacturer", class: "manufacturer", value: NeededVehicle.brand },
|
|
{ name: "Vehicle Model", class: "vehmodel", value: NeededVehicle.label },
|
|
{ name: "Vehicle Hash", class: "hash", value: NeededVehicle.hash },
|
|
{ name: "Vehicle Category", class: "category", value: NeededVehicle.category },
|
|
{ name: "Vehicle Purchasable At", class: "shop", value: NeededVehicle.shop },
|
|
{ name: "Vehicle Default Price", class: "price", value: `$ ${NeededVehicle.price.toLocaleString()}` },
|
|
],
|
|
credentials: {
|
|
class: NeededVehicle.class,
|
|
brand: NeededVehicle.brand,
|
|
name: NeededVehicle.label,
|
|
model: NeededVehicle.model,
|
|
import: NeededVehicle.import,
|
|
image: NeededVehicle.image
|
|
}
|
|
}
|
|
this.vehicleImage = NeededVehicle.image
|
|
if (this.vehicleImage !== "img/CarImage.png") {
|
|
document.getElementById("vinfo-left-right-file").style.backgroundImage = `url(${this.vehicleImage})`
|
|
}
|
|
}
|
|
|
|
document.getElementById("panel-content").style.backgroundImage = `url(../../img/panel${this.darkMode === true ? "Dark" : "Light"}ModeVehicles.png)`
|
|
document.getElementById("loading-container").style.opacity = 0
|
|
}
|
|
}) |