feat(InstanceDetail): add delete instance button and functionality

Implement instance deletion feature with confirmation notification and navigation back to instances list. Also adjust header layout to accommodate the new button.
This commit is contained in:
2026-03-25 10:49:08 +08:00
parent ea49736779
commit d70193c15d

View File

@@ -5,6 +5,9 @@
<i class="fas fa-arrow-left"></i> Back <i class="fas fa-arrow-left"></i> Back
</button> </button>
<h2>{{ instanceName }} - Details</h2> <h2>{{ instanceName }} - Details</h2>
<button class="common-btn" @click="deleteInstance">
<i class="fas fa-trash"></i> Delete
</button>
</div> </div>
<div class="detail-content"> <div class="detail-content">
@@ -355,6 +358,16 @@ export default {
} }
}; };
const deleteInstance = async () => {
try {
await instanceApi.deleteInstance(instanceID.value);
showNotification('Instance deleted successfully', 'success');
router.push('/instances');
} catch (error) {
showNotification(error.message || 'Delete instance failed', 'error');
}
};
const restartInstance = async () => { const restartInstance = async () => {
try { try {
await instanceApi.restartInstance(instanceID.value); await instanceApi.restartInstance(instanceID.value);
@@ -544,7 +557,8 @@ export default {
handleEditConfiguration, handleEditConfiguration,
handleAddProxySubmit, handleAddProxySubmit,
handleStatusClick, handleStatusClick,
restartInstance restartInstance,
deleteInstance
}; };
} }
}; };
@@ -561,6 +575,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 16px; gap: 16px;
justify-content: space-between;
} }
.detail-content { .detail-content {