-
+
-
+
@@ -229,7 +255,7 @@
-
+
操作日志
实例监控
@@ -294,7 +320,7 @@
-
+
-
+
-
+
-
+
{
+ localStorage.setItem('vmDetailActiveTab', tab.index);
+};
+
// 端口管理
const portsList = ref([]);
const portsLoading = ref(false);
@@ -1004,6 +1042,17 @@ const reinstallRules = {
const reinstalling = ref(false);
const imagesList = ref([]);
+//开通虚拟机
+const handleOpen = async () => {
+ const res = await openInstance(route.query.instance_id)
+ console.log("开通虚拟机",res)
+ if (res.data.code === 200) {
+ ElMessage.success(res.data.msg);
+ } else {
+ ElMessage.error(res.data.msg);
+ }
+}
+
// 获取镜像列表
const fetchImagesList = async () => {
try {
@@ -1111,6 +1160,12 @@ const fetchDataVolumesList = async () => {
// 初始化数据
onMounted(() => {
if (route.query.instance_id) {
+ // 恢复上次选中的标签页
+ const savedTab = localStorage.getItem('vmDetailActiveTab');
+ if (savedTab) {
+ activeTabName.value = savedTab;
+ }
+
fetchVmInfo();
fetchPortsList();
fetchLogsList();
@@ -1424,6 +1479,83 @@ const handleExitRescue = async () => {
}
};
+// 暂停虚拟机
+const handlePause = async () => {
+ try {
+ ElMessageBox.confirm('确定要暂停该虚拟机吗?', '提示', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning'
+ }).then(async () => {
+ const formData = new FormData();
+ const res = await pauseInstance(formData, route.query.instance_id);
+ if (res && res.data && res.data.code === 200) {
+ ElMessage.success('暂停指令已发送');
+ setTimeout(() => {
+ fetchVmInfo();
+ }, 2000);
+ } else {
+ ElMessage.error('暂停失败: ' + (res.data.message || '未知错误'));
+ }
+ }).catch(() => {});
+ } catch (error) {
+ console.error('暂停虚拟机出错:', error);
+ ElMessage.error('暂停虚拟机出错');
+ }
+};
+
+// 恢复虚拟机
+const handleUnpause = async () => {
+ try {
+ ElMessageBox.confirm('确定要恢复该虚拟机吗?', '提示', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning'
+ }).then(async () => {
+ const res = await unpauseInstance(route.query.instance_id);
+ if (res && res.data && res.data.code === 200) {
+ ElMessage.success('恢复指令已发送');
+ setTimeout(() => {
+ fetchVmInfo();
+ }, 2000);
+ } else {
+ ElMessage.error('恢复失败: ' + (res.data.message || '未知错误'));
+ }
+ }).catch(() => {});
+ } catch (error) {
+ console.error('恢复虚拟机出错:', error);
+ ElMessage.error('恢复虚拟机出错');
+ }
+};
+
+// 删除虚拟机
+const handleDelete = async () => {
+ try {
+ ElMessageBox.confirm('确定要删除该虚拟机吗？此操作不可恢复！', '警告', {
+ confirmButtonText: '确定删除',
+ cancelButtonText: '取消',
+ type: 'error',
+ dangerouslyUseHTMLString: true,
+ message: '
{{
scope.row.container_state == 0
- ? "未构建"
+ ? "未支付"
: scope.row.container_state == 1
- ? "已构建"
+ ? "未构建"
: scope.row.container_state == 2
- ? "构建失败"
+ ? "已构建"
: scope.row.container_state == 3
- ? "已删除"
- : "未知状态"
+ ? "未知"
+ : scope.row.container_state == 4
+ ? "已删除"
+ : "未知状态"
}}
@@ -251,7 +257,7 @@
type="primary"
size="small"
:icon="Setting"
- @click="$router.push('/servers/containers?container_id=' + scope.row.container_id)"
+ @click="$router.push('/servers/container?container_id=' + scope.row.container_id)"
>
管理
@@ -610,7 +616,8 @@ import {
getFloatingIpList,
addFloatingIp,
delFloatingIp,
- addFloatingIpBatch
+ addFloatingIpBatch,
+ selectServerPlan
} from "@/utils/acs/server";
import { ElMessage, ElNotification } from 'element-plus';
import { copyDomText } from "@/utils/hide";
@@ -671,31 +678,43 @@ const initData = async () => {
try {
const userInfoRes = await getUserInfo();
console.log("获取用户信息", userInfoRes);
- if (userInfoRes && userInfoRes.data && userInfoRes.data.data) {
- // 根据API返回的用户信息设置用户类型
- const userType = userInfoRes.data.is_admin == true ? "1" : "0";
- localStorage.setItem("user_id", userInfoRes.real_name.UserId);
- localStorage.setItem("user_type", userType);
- console.log("获取到用户类型", userType);
+ if (userInfoRes && userInfoRes.data ) {
+ console.log("获取用户信息", userInfoRes);
+ localStorage.setItem("user_id", userInfoRes.data.user_id);
}
} catch (error) {
console.error("获取用户信息失败:", error);
- // 如果获取失败，默认设置为管理员权限确保功能可用
- localStorage.setItem("user_type", "1");
}
// 获取所有容器
- let usertype = localStorage.getItem("user_type");
- console.log("用户类型", usertype);
- if (usertype == "1") {
containerBox.server_id = route.query.server_id;
+ containerBox.user_id = localStorage.getItem("user_id");
let cons = await getContainer(containerBox);
- console.log("获取容器列表", cons);
if (cons && cons.data) {
user_servers.value = cons.data.data || [];
+ // user_servers.value = cons.data.data.forEach(async item => {
+ // item.plan_name = await selectServerPlan({
+ // server_type: 'dockerContainer',
+ // plan_id: item.plan_id
+ // })
+ // }
+ // )
+ for (const item of user_servers.value){
+ try{
+ const res = await selectServerPlan({
+ server_type: 'dockerContainer',
+ plan_id: item.plan_id
+ })
+ console.log("获取容器规格：", res);
+ item.plan_name = res.data.data.name;
+ }catch(error){
+ console.error("获取容器列表失败:", error);
+ ElMessage.error("获取容器列表失败");
+ }
+ }
+ console.log("获取容器列表", user_servers.value);
total.value = cons.data.count || 0;
}
- }
} catch (error) {
console.error("初始化数据失败:", error);
ElMessage.error("加载数据失败，请刷新页面重试");
@@ -727,7 +746,6 @@ const GetSpecs = async () => {
server_id: route.query.server_id,
count: 30
});
- console.log("服务器实例规格", plans.data.data);
spec_list.value = plans.data.data;
} catch (error) {
console.error("获取实例规格列表失败:", error);
@@ -929,8 +947,9 @@ const editSpec = async () => {
server_id: route.query.server_id,
server_type:TypeData.value
});
+ console.log("添加实例规格：",res)
- if (res.code == 200) {
+ if (res.data.code == 200) {
ElNotification({
title: '添加成功',
message: `已成功添加规格 "${spec_form.name}"`,
@@ -939,7 +958,7 @@ const editSpec = async () => {
});
centerDialogVisible.value = false;
} else {
- ElMessage.error(res.data.message || "添加失败");
+ ElMessage.error(res.data.msg || "添加失败");
return;
}
} else {
diff --git a/vite.config.js b/vite.config.js
index 6bdfa39..8f40121 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,6 +1,7 @@
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
+
// https://vite.dev/config/
export default defineConfig({
plugins: [vue()],
@@ -8,5 +9,17 @@ export default defineConfig({
alias: {
'@': resolve(__dirname, 'src')
}
+ },
+ optimizeDeps: {
+ include: ['monaco-editor']
+ },
+ build: {
+ rollupOptions: {
+ output: {
+ manualChunks: {
+ 'monaco-editor': ['monaco-editor']
+ }
+ }
+ }
}
})
\ No newline at end of file
网络管理
端口列表
快照管理
数据卷列表
⚠️ 警告：删除虚拟机将永久删除所有数据，此操作不可恢复！
'
+ }).then(async () => {
+ const formData = new FormData();
+ const res = await deleteInstance(route.query.instance_id, formData);
+ if (res && res.data && res.data.code === 200) {
+ ElMessage.success('虚拟机已删除');
+ // 删除成功后返回虚拟机列表页面
+ setTimeout(() => {
+ router.push('/acs/nodes');
+ }, 2000);
+ } else {
+ ElMessage.error('删除失败: ' + (res.data.message || '未知错误'));
+ }
+ }).catch(() => {});
+ } catch (error) {
+ console.error('删除虚拟机出错:', error);
+ ElMessage.error('删除虚拟机出错');
+ }
+};
+
function statusMap(data) {
const statusMap = {
0: "未支付",
@@ -1432,7 +1564,8 @@ function statusMap(data) {
3: "关机",
4: "重装中",
5: "正在创建快照",
- 6: "正在恢复快照"
+ 6: "正在恢复快照",
+ 7: "已暂停"
};
return statusMap[data] || "未知状态";
}
@@ -1454,7 +1587,8 @@ function statusColor(data) {
3: "secondary", // 关机
4: "info", // 重装中
5: "primary", // 正在创建快照
- 6: "info" // 正在恢复快照
+ 6: "info", // 正在恢复快照
+ 7: "warning" // 已暂停
};
return statusMap[data] || "default"; // 默认颜色类名
}
@@ -1571,6 +1705,8 @@ const getStatusType = (state) => {
return 'success';
} else if (state == 4 || state == 5 || state == 6) {
return 'warning';
+ } else if (state == 7) {
+ return 'info'; // 暂停状态
} else {
return 'danger';
}
@@ -1593,6 +1729,8 @@ const getStatusText = (state) => {
return '创建快照中';
case 6:
return '恢复快照中';
+ case 7:
+ return '已暂停';
default:
return '未知状态';
}
diff --git a/src/views/acs/nodes/containDetail.vue b/src/views/acs/nodes/containDetail.vue
new file mode 100644
index 0000000..02b1eb1
--- /dev/null
+++ b/src/views/acs/nodes/containDetail.vue
@@ -0,0 +1,1860 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/acs/nodes/containFile.vue b/src/views/acs/nodes/containFile.vue
new file mode 100644
index 0000000..ea9b343
--- /dev/null
+++ b/src/views/acs/nodes/containFile.vue
@@ -0,0 +1,3053 @@
+
+
+
+
+
+
+
+
+ {{ getStatusText(containerInfo.state) }}
+
+
+ 容器详情
+
+ 返回
+ 刷新数据
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 容器ID
+ {{ containerInfo.container_id || '未知' }}
+
+
+ 用户ID
+ {{ containerInfo.user_id || '未知' }}
+
+
+ 价格
+ {{ containerInfo.pay || '0' }} 元
+
+
+
+
+
+
+
+
+
+ 服务器IP
+ {{ containerInfo.server_ip || '未知' }}
+
+
+ 创建时间
+ {{ containerInfo.created_at || '未知' }}
+
+
+ 到期时间
+ {{ containerInfo.become_time || '未知' }}
+
+
+ 所属套餐
+ {{ containerInfo.plan_name || '未知' }}
+
+
+
+
+
+
+
+
+
+
+
+ 内存限制
+ {{ containerInfo.memory_limit || '0' }} MB
+
+
+ CPU限制
+ {{ containerInfo.cpu_limit || '0' }} 核
+
+
+ 存储限制
+ {{ containerInfo.storage_limit || '0' }} GB
+
+
+ 带宽
+ {{ containerInfo.network_mode || 'bridge' }}
+
+
+
+
+
+
+
+
+ 容器镜像
+ {{ containerInfo.image || 'nginx:latest' }}
+
+
+ 容器IP
+ {{ containerInfo.container_ip || '未分配' }}
+
+
+
+ 状态
+
+ {{ getStatusText(containerInfo.state) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 删除
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 操作日志
+
+
+
+
+ 添加网络
+
+
+
+ 网络信息
+
+
+
+ 数据卷信息
+
+
+
+
+
+ {{ mirror.show_name }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ file }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/views/acs/nodes/containerConsole.vue b/src/views/acs/nodes/containerConsole.vue
new file mode 100644
index 0000000..6576a1f
--- /dev/null
+++ b/src/views/acs/nodes/containerConsole.vue
@@ -0,0 +1,152 @@
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/views/acs/nodes/server.vue b/src/views/acs/nodes/server.vue
index 384842c..d87c122 100644
--- a/src/views/acs/nodes/server.vue
+++ b/src/views/acs/nodes/server.vue
@@ -217,30 +217,36 @@
+
+
+
+
+
+
+
+
+
+
+ {{ containerId }}
+
+
+ 上传文件
+ 新建文件
+ 新建文件夹
+ 刷新
+ 返回
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ tab.title }}
+ ●
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ tab.title }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ item.name }}
+
+ {{ formatFileSize(item.size) }}
+ 文件夹
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ scope.row.type === 'directory' ? '-' : formatFileSize(scope.row.size) }}
+
+
+
+
+
+
+
+
+
+
+
+
+ 容器文件管理器
+高效管理您的容器文件，支持在线编辑和多种操作
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 快速操作
+
+
+
+
+
+
+
+ 新建文件
+ 创建新的文本文件
+
+
+
+
+
+
+ 新建文件夹
+ 创建新的目录
+
+
+
+
+
+ 上传文件
+ 从本地上传文件
+
+
+
+
+
+
+ -
+
- 点击左侧文件树中的文件进行编辑 +
- 支持 Ctrl+S 快捷键保存文件 +
- 右键文件可进行更多操作 +
- 支持拖拽上传文件 +
+
+
+
+
+
+
+
+
+
+ 将文件拖到此处，或点击选择
+
+
+
+ 支持多文件上传，单个文件大小不超过100MB
+
+
+
+
+ 开始上传 ({{ uploadFileList.length }} 个文件)
+
+
+ 清空列表
+
+
+
+
+
+
+ 上传进度
+
+
+
+ {{ file.name }}
+
+ {{
+ file.status === 'waiting' ? '等待中' :
+ file.status === 'uploading' ? '上传中' :
+ file.status === 'success' ? '成功' : '失败'
+ }}
+
+
+
+ 注意：文件名只能包含一个扩展名后缀（如：.txt、.js、.md等）
+
+
+
+
+
+
+
+ 当前目录
+
+
+
+
+
+
+ 覆盖已存在的文件
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 压缩文件: {{ decompressForm.zipName }}
+文件类型: {{ getArchiveType(decompressForm.zipName) }}
+ +
+ 提示：解压目录不能以 / 开头，如 home/user 或留空表示根目录
+
+
+
+ {{ scope.row.become_time }}
-