implement disk delete (all disk actions finished)

Signed-off-by: Arthur Lu <learthurgo@gmail.com>
This commit is contained in:
Arthur Lu 2023-02-10 21:36:47 +00:00
parent bbebce3c99
commit 6fec7b61a7
2 changed files with 55 additions and 11 deletions

View File

@ -123,21 +123,16 @@ function addDiskLine (fieldset, busPrefix, busName, device, disk) {
diskMetaData.actionBarOrder.forEach((element) => { diskMetaData.actionBarOrder.forEach((element) => {
let action = document.createElement("img"); let action = document.createElement("img");
action.classList.add("clickable"); action.classList.add("clickable");
if (element === "delete_detach_attach" && diskMetaData[type][busPrefix].actions.includes("attach")){ // attach if (element === "detach_attach" && diskMetaData[type][busPrefix].actions.includes("attach")){ // attach
action.src = "images/actions/attach.svg"; action.src = "images/actions/attach.svg";
action.title = "Attach Disk"; action.title = "Attach Disk";
action.addEventListener("click", handleDiskAttach); action.addEventListener("click", handleDiskAttach);
} }
else if (element === "delete_detach_attach" && diskMetaData[type][busPrefix].actions.includes("detach")){ // detach else if (element === "detach_attach" && diskMetaData[type][busPrefix].actions.includes("detach")){ // detach
action.src = "images/actions/detach.svg"; action.src = "images/actions/detach.svg";
action.title = "Detach Disk"; action.title = "Detach Disk";
action.addEventListener("click", handleDiskDetach); action.addEventListener("click", handleDiskDetach);
} }
else if (element === "delete_detach_attach"){
let active = diskMetaData[type][busPrefix].actions.includes("delete") ? "active" : "inactive"; // delete
action.src = `images/actions/delete-${active}.svg`;
action.title = `Delete Disk`;
}
else { else {
let active = diskMetaData[type][busPrefix].actions.includes(element) ? "active" : "inactive"; // resize let active = diskMetaData[type][busPrefix].actions.includes(element) ? "active" : "inactive"; // resize
action.src = `images/actions/${element}-${active}.svg`; action.src = `images/actions/${element}-${active}.svg`;
@ -148,11 +143,16 @@ function addDiskLine (fieldset, busPrefix, busName, device, disk) {
else if (element === "resize") { else if (element === "resize") {
action.addEventListener("click", handleDiskResize); action.addEventListener("click", handleDiskResize);
} }
else { else if (element === "delete") {
console.log(`got invalid action ${element} at disk ${busName} ${device}`); action.addEventListener("click", handleDiskDelete);
}
else { // entry does not support anything in this category, override the src and title with nothing
action.src = "";
action.title = "";
} }
} }
action.id = `${busPrefix}${device}` action.id = `${busPrefix}${device}`
action.alt = action.title;
actionDiv.append(action); actionDiv.append(action);
}); });
field.append(actionDiv); field.append(actionDiv);
@ -317,11 +317,18 @@ async function handleDiskMove () {
dialog.callback = async (result, form) => { dialog.callback = async (result, form) => {
if (result === "confirm") { if (result === "confirm") {
let action = {storage: storageSelect.value, delete: deleteCheckbox.checked ? "1": "0"}
if (type === "qemu") { // if vm, move disk
action.disk = this.id;
}
else { // type is lxc, move volume
action.volume = this.id;
}
let body = { let body = {
node: node, node: node,
type: type, type: type,
vmid: vmid, vmid: vmid,
action: JSON.stringify({storage: storageSelect.value, disk: this.id, delete: deleteCheckbox.checked ? "1": "0"}) action: JSON.stringify(action)
} }
let result = await requestAPI("/disk/move", "POST", body); let result = await requestAPI("/disk/move", "POST", body);
if (result.status === 200) { if (result.status === 200) {
@ -337,6 +344,43 @@ async function handleDiskMove () {
dialog.show(); dialog.show();
} }
async function handleDiskDelete () {
let dialog = document.createElement("dialog-form");
document.body.append(dialog);
dialog.header = `Delete ${this.id}`;
let confirm = document.createElement("p");
confirm.innerHTML = "Are you sure you want to <strong>delete</strong> disk"
confirm.style.color = "#FF0000";
dialog.append(confirm)
let idtext = document.createElement("p");
idtext.innerText = this.id;
idtext.style.color = "#FF0000";
dialog.append(idtext);
dialog.callback = async (result, form) => {
if (result === "confirm") {
let body = {
node: node,
type: type,
vmid: vmid,
action: JSON.stringify({delete: this.id})
};
let result = await requestAPI("/disk/delete", "POST", body);
if (result.status === 200) {
await getConfig();
populateDisk();
}
else {
console.error(result);
}
}
};
dialog.show();
}
function getOrderedUsed(disks){ function getOrderedUsed(disks){
let ordered_keys = Object.keys(disks).sort((a,b) => {parseInt(a) - parseInt(b)}); // ordered integer list let ordered_keys = Object.keys(disks).sort((a,b) => {parseInt(a) - parseInt(b)}); // ordered integer list
return ordered_keys; return ordered_keys;

View File

@ -16,7 +16,7 @@ export class NetworkError extends Error {
export const resources = { export const resources = {
disk: { disk: {
actionBarOrder: ["move", "resize", "delete_detach_attach"], actionBarOrder: ["move", "resize", "detach_attach", "delete"],
lxc: { lxc: {
prefixOrder: ["rootfs", "mp", "unused"], prefixOrder: ["rootfs", "mp", "unused"],
rootfs: {name: "ROOTFS", icon: "images/resources/drive.svg", actions: ["move", "resize"]}, rootfs: {name: "ROOTFS", icon: "images/resources/drive.svg", actions: ["move", "resize"]},