From 71d3605f4fff8c5a099715018b80bf79f466cf66 Mon Sep 17 00:00:00 2001
From: 2256907009 <2256907009@qq.com>
Date: Thu, 26 Mar 2026 17:20:00 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=99=9A=E6=8B=9F=E6=9C=BA=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=BC=BA=E5=88=B6=E6=93=8D=E4=BD=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/virtualization/VmDetail.vue | 63 +++++++++++++++++++--------
 1 file changed, 45 insertions(+), 18 deletions(-)

diff --git a/src/views/virtualization/VmDetail.vue b/src/views/virtualization/VmDetail.vue
index bfb9f1a..533b04f 100644
--- a/src/views/virtualization/VmDetail.vue
+++ b/src/views/virtualization/VmDetail.vue
@@ -497,6 +497,26 @@
       </el-tabs>
     </div>
 
+    <!-- 电源操作确认弹窗 -->
+    <el-dialog v-model="powerDialogVisible" :title="`${powerLabels[powerAction] || ''}虚拟机`" width="400px" destroy-on-close>
+      <div style="display: flex; align-items: flex-start; gap: 12px; padding: 8px 0">
+        <el-icon :size="22" :style="{ color: powerAction === 'stop' ? '#F56C6C' : powerAction === 'reboot' ? '#E6A23C' : '#409EFF', flexShrink: 0, marginTop: '-1px' }">
+          <WarningFilled />
+        </el-icon>
+        <div>
+          <div style="font-size: 15px; font-weight: 500; color: #303133; margin-bottom: 12px">
+            确定要{{ powerLabels[powerAction] }}虚拟机「{{ detail?.name }}」吗？
+          </div>
+          <el-checkbox v-model="powerForce" style="margin-bottom: 4px">强制执行</el-checkbox>
+          <div style="font-size: 12px; color: #909399; padding-left: 24px">勾选后将强制{{ powerLabels[powerAction] }}，可能导致数据丢失</div>
+        </div>
+      </div>
+      <template #footer>
+        <el-button @click="powerDialogVisible = false">取消</el-button>
+        <el-button :type="powerAction === 'stop' ? 'danger' : 'primary'" @click="submitPower">确定{{ powerLabels[powerAction] }}</el-button>
+      </template>
+    </el-dialog>
+
     <!-- 重装弹窗 -->
     <el-dialog v-model="rebuildDialogVisible" title="重装虚拟机" width="480px" destroy-on-close>
       <el-alert title="重装会清除当前虚拟机数据并使用新镜像重新创建，请谨慎操作！" type="warning" :closable="false" style="margin-bottom: 16px" />
@@ -1122,7 +1142,7 @@
 import { ref, reactive, computed, onMounted, onActivated, onDeactivated, onBeforeUnmount, nextTick, watch } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage, ElMessageBox } from 'element-plus'
-import { ArrowLeft, Refresh, ArrowDown, Plus, Search } from '@element-plus/icons-vue'
+import { ArrowLeft, Refresh, ArrowDown, Plus, Search, WarningFilled } from '@element-plus/icons-vue'
 import {
   getVmDetail, getVmStatus, getVmMetrics,
   startVm, stopVm, rebootVm, suspendVm, resumeVm,
@@ -1419,24 +1439,31 @@ const clearHistory = () => {
   for (const k in metricsHistory.netSeries) delete metricsHistory.netSeries[k]
 }
 
+const powerDialogVisible = ref(false)
+const powerAction = ref('')
+const powerForce = ref(false)
+const powerLabels = { start: '启动', stop: '停止', reboot: '重启', suspend: '暂停', resume: '恢复' }
+
 const handlePower = (action) => {
-  const labels = { start: '启动', stop: '停止', reboot: '重启', suspend: '暂停', resume: '恢复' }
-  ElMessageBox.confirm(`确定要${labels[action]}虚拟机「${detail.value?.name}」吗？`, `${labels[action]}确认`, {
-    confirmButtonText: '确定', cancelButtonText: '取消', type: action === 'stop' ? 'warning' : 'info'
-  }).then(async () => {
-    try {
-      const apis = { start: startVm, stop: stopVm, reboot: rebootVm, suspend: suspendVm, resume: resumeVm }
-      let res
-      if (action === 'resume') {
-        const fd = new FormData(); fd.append('service_id', serviceId.value); fd.append('vm_id', vmId.value)
-        res = await resumeVm(fd)
-      } else {
-        res = await apis[action]({ service_id: serviceId.value, vm_id: vmId.value })
-      }
-      if (res?.data?.code === 200) { ElMessage.success(`${labels[action]}成功`); loadDetail() }
-      else ElMessage.error(extractApiError(res?.data, `${labels[action]}失败`))
-    } catch (e) { ElMessage.error(extractApiError(e?.response?.data, `${labels[action]}失败`)) }
-  }).catch(() => {})
+  powerAction.value = action
+  powerForce.value = false
+  powerDialogVisible.value = true
+}
+
+const submitPower = async () => {
+  const action = powerAction.value
+  const label = powerLabels[action]
+  powerDialogVisible.value = false
+  try {
+    const apis = { start: startVm, stop: stopVm, reboot: rebootVm, suspend: suspendVm, resume: resumeVm }
+    const fd = new FormData()
+    fd.append('service_id', serviceId.value)
+    fd.append('vm_id', vmId.value)
+    if (powerForce.value) fd.append('force', true)
+    const res = await apis[action](fd)
+    if (res?.data?.code === 200) { ElMessage.success(`${label}成功`); loadDetail() }
+    else ElMessage.error(extractApiError(res?.data, `${label}失败`))
+  } catch (e) { ElMessage.error(extractApiError(e?.response?.data, `${label}失败`)) }
 }
 
 const handleRebuild = () => {