From 19b405357f7004c9a95ad3cef12f73ccda7b0190 Mon Sep 17 00:00:00 2001 From: kwey Date: Wed, 25 Jun 2025 10:28:43 +0800 Subject: [PATCH 1/3] 2025/6/25-10:30 --- vite/src/views/Admin.vue | 458 ++++++++++++++++++++++++++++++++------- 1 file changed, 379 insertions(+), 79 deletions(-) diff --git a/vite/src/views/Admin.vue b/vite/src/views/Admin.vue index 17c64b219..84249825c 100644 --- a/vite/src/views/Admin.vue +++ b/vite/src/views/Admin.vue @@ -38,13 +38,7 @@ {{ item.label }} -
-

系统

-
- - - {{ item.label }} - + @@ -114,20 +108,29 @@
- - -
-
+
@@ -140,7 +143,6 @@ - @@ -160,9 +162,162 @@
{{ app.id }} {{ app.type }}
+ + +
+
+
+

批量授权

+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ + + + + + + + + + + + + + + + + + + + + +
+ + 申请编号申请类型申请人申请时间状态
+ + {{ app.id }}{{ app.type }}{{ app.applicant }}{{ app.time }} + + {{ app.status }} + +
+
+ + +
+ +
+
+
+
+ + +
+
+
+

授权信息管理

+
+
+ + +
+ +
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
授权ID授权类型用户/组授权时间到期时间状态操作
{{ item.id }}{{ item.type }}{{ item.user }}{{ item.authTime }}{{ item.expiryTime }} + + {{ item.status }} + + + + +
+
+ + +
+
+ 显示 1 到 10 条，共 42 条记录 +
+
+ + + + + ... + + +
+
+
+
-
+
显示 1 到 10 条，共 24 条记录
@@ -370,6 +525,12 @@ export default { setup() { const sidebarVisible = ref(false); const currentSection = ref('授权功能'); + const activeTab = ref('review'); + const modalVisible = ref(false); + const modalTitle = ref(''); + const modalContent = ref(''); + + // 授权申请数据 const authApplications = ref([ { id: 'ManageAuth001-20250612', type: '学生自建数据库授权', applicant: '张三 (S2023001)', time: '2025-06-12 10:30', status: '待审核', statusClass: 'bg-yellow-100 text-yellow-800', purpose: '用于课程设计《电子商务数据分析》' }, { id: 'ManageAuth001-20250611', type: '教师自建数据库', applicant: '李四 (T2018005)', time: '2025-06-11 14:15', status: '待审核', statusClass: 'bg-yellow-100 text-yellow-800', purpose: '用于科研项目《机器学习数据预处理》' }, @@ -377,30 +538,37 @@ export default { { id: 'ManageAuth001-20250609', type: '学生自建数据库授权', applicant: '赵六 (S2023032)', time: '2025-06-09 16:20', status: '审核中', statusClass: 'bg-blue-100 text-blue-800', purpose: '课程作业《数据库应用》实践' }, { id: 'ManageAuth001-20250608', type: '公共数据库查看', applicant: '钱七 (T2020012)', time: '2025-06-08 11:05', status: '已通过', statusClass: 'bg-green-100 text-green-800', purpose: '教学需要，查看学生实验数据' } ]); - const modalVisible = ref(false); - const modalTitle = ref(''); - const modalContent = ref(''); - + + // 批量授权相关数据 + const filterAuthType = ref(''); // 筛选申请类型 + const filterAuthStatus = ref(''); // 筛选申请状态 + const selectedAuthApplications = ref([]); // 选中的授权申请ID + const filteredAuthApplications = ref([...authApplications.value]); // 筛选后的授权申请 + + // 授权信息管理相关数据 + const searchKeyword = ref(''); + const authInfo = ref([ + { id: 'AUTH-20250601', type: '数据库访问', user: '张三 (S2023001)', authTime: '2025-06-01', expiryTime: '2025-12-31', status: '有效', statusClass: 'bg-green-100 text-green-800' }, + { id: 'AUTH-20250515', type: '服务器管理', user: '李四 (T2018005)', authTime: '2025-05-15', expiryTime: '2025-11-15', status: '有效', statusClass: 'bg-green-100 text-green-800' }, + { id: 'AUTH-20250420', type: '数据备份', user: '教师组', authTime: '2025-04-20', expiryTime: '2025-10-20', status: '已过期', statusClass: 'bg-red-100 text-red-800' } + ]); + const filteredAuthInfo = ref(authInfo.value); + + // 导航菜单 const mainNav = [ - { id: '授权功能', label: '授权功能', icon: 'fa-key' }, + { id: '授权功能', label: '授权功能', icon: 'fa-user-lock' }, { id: '服务器查询管理', label: '服务器查询管理', icon: 'fa-server' }, - { id: '教学数据库管理', label: '教学数据库管理', icon: 'fa-graduation-cap' } + { id: '教学数据库管理', label: '教学数据库管理', icon: 'fa-database' } ]; - - const systemNav = [ - { label: '系统设置', icon: 'fa-cog' }, - { label: '帮助中心', icon: 'fa-question-circle' } - ]; - + + // 切换侧边栏 const toggleSidebar = () => { sidebarVisible.value = !sidebarVisible.value; }; - - // 修复后的导航切换方法 + + // 导航到指定部分 const navigateToSection = (sectionId) => { currentSection.value = sectionId; - - // 平滑滚动到对应部分 setTimeout(() => { const targetElement = document.getElementById(sectionId); if (targetElement) { @@ -408,7 +576,13 @@ export default { } }, 100); }; - + + // 切换选项卡 + const switchTab = (tab) => { + activeTab.value = tab; + }; + + // 打开模态框 const openModal = (appId) => { const app = authApplications.value.find(a => a.id === appId); if (app) { @@ -442,33 +616,151 @@ export default {
`; modalVisible.value = true; + + // 将申请ID存储到模态标题的dataset中，方便审核操作时获取 + const modalTitleElement = document.querySelector('#modalTitle'); + if (modalTitleElement) { + modalTitleElement.dataset.appId = appId; + } } }; - + + // 关闭模态框 const closeModal = () => { modalVisible.value = false; + + // 清空模态框内容 + modalTitle.value = ''; + modalContent.value = ''; + + // 重置模态标题中的dataset + const modalTitleElement = document.querySelector('#modalTitle'); + if (modalTitleElement) { + modalTitleElement.dataset.appId = ''; + } }; - + + // 拒绝申请 const rejectApplication = () => { - modalVisible.value = false; + closeModal(); alert('申请已拒绝'); }; - + + // 批准申请 const approveApplication = () => { modalVisible.value = false; - alert('申请已同意'); + + // 获取当前审核的申请ID + const modalTitleElement = document.querySelector('#modalTitle'); + if (modalTitleElement && modalTitleElement.dataset.appId) { + const appId = modalTitleElement.dataset.appId; + const app = authApplications.value.find(a => a.id === appId); + + if (app) { + // 更新授权状态 + app.status = '已通过'; + app.statusClass = 'bg-green-100 text-green-800'; + + // 添加到授权信息列表 + authInfo.value.push({ + id: `AUTH-${new Date().getTime()}`, + type: app.type, + user: app.applicant.split(' ')[0], + authTime: new Date().toLocaleDateString(), + expiryTime: new Date(new Date().setMonth(new Date().getMonth() + 6)).toLocaleDateString(), + status: '有效', + statusClass: 'bg-green-100 text-green-800' + }); + + // 更新筛选后的授权申请列表 + const filteredAppIndex = filteredAuthApplications.value.findIndex(a => a.id === appId); + if (filteredAppIndex !== -1) { + filteredAuthApplications.value[filteredAppIndex].status = '已通过'; + filteredAuthApplications.value[filteredAppIndex].statusClass = 'bg-green-100 text-green-800'; + } + + alert('申请审核已通过'); + } + } }; - - const handleSystemNavClick = (item) => { - console.log(`点击了 ${item.label}`); - // 这里可以添加实际的导航逻辑或其他操作 - if (item.label === '系统设置') { - // 跳转到系统设置页面或执行相关操作 - } else if (item.label === '帮助中心') { - // 跳转到帮助中心页面或显示帮助模态框 + + // 筛选授权申请 + const applyFilters = () => { + filteredAuthApplications.value = authApplications.value.filter(app => { + const typeMatch = filterAuthType.value ? app.type === filterAuthType.value : true; + const statusMatch = filterAuthStatus.value ? app.status === filterAuthStatus.value : true; + return typeMatch && statusMatch; + }); + }; + + // 切换全选状态 + const toggleSelectAll = (event) => { + if (event.target.checked) { + filteredAuthApplications.value.forEach(app => { + if (!selectedAuthApplications.value.includes(app.id)) { + selectedAuthApplications.value.push(app.id); + } + }); + } else { + filteredAuthApplications.value.forEach(app => { + const index = selectedAuthApplications.value.indexOf(app.id); + if (index !== -1) { + selectedAuthApplications.value.splice(index, 1); + } + }); } }; - + + // 执行批量授权 + const executeBatchAuthorization = () => { + if (selectedAuthApplications.value.length === 0) { + alert('请至少选择一个授权申请'); + return; + } + + selectedAuthApplications.value.forEach(appId => { + const app = authApplications.value.find(a => a.id === appId); + if (app) { + // 更新授权状态 + app.status = '已通过'; + app.statusClass = 'bg-green-100 text-green-800'; + + // 添加到授权信息列表 + authInfo.value.push({ + id: `AUTH-${new Date().getTime()}`, + type: app.type, + user: app.applicant.split(' ')[0], + authTime: new Date().toLocaleDateString(), + expiryTime: new Date(new Date().setMonth(new Date().getMonth() + 6)).toLocaleDateString(), + status: '有效', + statusClass: 'bg-green-100 text-green-800' + }); + } + }); + + // 清空选中状态并重新筛选 + selectedAuthApplications.value = []; + applyFilters(); + + alert(`已成功批量授权 ${selectedAuthApplications.value.length} 个申请`); + }; + + // 筛选授权信息 + const filterAuthInfo = () => { + filteredAuthInfo.value = authInfo.value.filter(item => { + return Object.values(item).some(value => { + return String(value).toLowerCase().includes(searchKeyword.value.toLowerCase()); + }); + }); + }; + + // 删除授权信息 + const deleteAuthInfo = (index) => { + authInfo.value.splice(index, 1); + filterAuthInfo(); + }; + + // 处理清理操作 const handleCleanup = () => { const term = document.getElementById('cleanTerm').value; const course = document.getElementById('cleanCourse').value; @@ -480,55 +772,31 @@ export default { } if (confirm(`确定要删除 ${course} 课程在 ${term} 学期中超过 ${size}GB 的自建数据库吗？此操作不可撤销。`)) { - // 执行清理操作的逻辑 console.log(`执行清理: 学期=${term}, 课程=${course}, 阈值=${size}GB`); alert(`已成功清理 ${course} 课程在 ${term} 学期中超过 ${size}GB 的自建数据库`); } }; - + + // 组件挂载时初始化图表和数据 onMounted(() => { const serverCtx = document.getElementById('serverChart').getContext('2d'); new Chart(serverCtx, { type: 'bar', data: { labels: ['服务器A', '服务器B', '服务器C', '服务器D', '服务器E'], - datasets: [{ + datasets: [ { label: 'CPU使用率 (%)', data: [65, 59, 80, 81, 56], - backgroundColor: [ - 'rgba(22, 93, 255, 0.7)', - 'rgba(22, 93, 255, 0.7)', - 'rgba(22, 93, 255, 0.7)', - 'rgba(22, 93, 255, 0.7)', - 'rgba(22, 93, 255, 0.7)' - ], - borderColor: [ - 'rgba(22, 93, 255, 1)', - 'rgba(22, 93, 255, 1)', - 'rgba(22, 93, 255, 1)', - 'rgba(22, 93, 255, 1)', - 'rgba(22, 93, 255, 1)' - ], + backgroundColor: 'rgba(22, 93, 255, 0.7)', + borderColor: 'rgba(22, 93, 255, 1)', borderWidth: 1 }, { label: '内存使用率 (%)', data: [28, 48, 40, 19, 66], - backgroundColor: [ - 'rgba(0, 180, 42, 0.7)', - 'rgba(0, 180, 42, 0.7)', - 'rgba(0, 180, 42, 0.7)', - 'rgba(0, 180, 42, 0.7)', - 'rgba(0, 180, 42, 0.7)' - ], - borderColor: [ - 'rgba(0, 180, 42, 1)', - 'rgba(0, 180, 42, 1)', - 'rgba(0, 180, 42, 1)', - 'rgba(0, 180, 42, 1)', - 'rgba(0, 180, 42, 1)' - ], + backgroundColor: 'rgba(0, 180, 42, 0.7)', + borderColor: 'rgba(0, 180, 42, 1)', borderWidth: 1 - }] + } ] }, options: { responsive: true, @@ -617,19 +885,31 @@ export default { return { sidebarVisible, currentSection, - authApplications, + activeTab, modalVisible, modalTitle, modalContent, + authApplications, + filterAuthType, + filterAuthStatus, + selectedAuthApplications, + filteredAuthApplications, + searchKeyword, + authInfo, + filteredAuthInfo, mainNav, - systemNav, toggleSidebar, navigateToSection, + switchTab, openModal, closeModal, rejectApplication, approveApplication, - handleSystemNavClick, + applyFilters, + toggleSelectAll, + executeBatchAuthorization, + filterAuthInfo, + deleteAuthInfo, handleCleanup }; } @@ -785,6 +1065,26 @@ body { border-color: rgba(255, 125, 0, 0.2); } +.form-checkbox { + -webkit-appearance: none; + appearance: none; + height: 1rem; + width: 1rem; + border: 1px solid #d1d5db; + border-radius: 0.25rem; + background-color: white; + transition: all 0.2s ease; +} + +.form-checkbox:checked { + background-color: #165dff; + border-color: #165dff; + background-image: url("data:image/svg+xml,%3i class='fa fa-check'/%3e"); + background-repeat: no-repeat; + background-position: center center; + background-size: contain; +} + .whitespace-nowrap { white-space: nowrap; } -- Gitee From bc38a04075b5bc9f4a90bd5cb419b2f58930f0b6 Mon Sep 17 00:00:00 2001 From: kwey Date: Wed, 25 Jun 2025 10:35:30 +0800 Subject: [PATCH 2/3] 2025/6/25-10:30 --- vite/index.html | 2 +- vite/src/views/Admin.vue | 2 -- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/vite/index.html b/vite/index.html index 0a0c5ce2e..ebb6e5e99 100644 --- a/vite/index.html +++ b/vite/index.html @@ -5,7 +5,7 @@ %VITE_APP_TITLE% - +
diff --git a/vite/src/views/Admin.vue b/vite/src/views/Admin.vue index 84249825c..31c0154d3 100644 --- a/vite/src/views/Admin.vue +++ b/vite/src/views/Admin.vue @@ -37,8 +37,6 @@ {{ item.label }} - -
-- Gitee From 0f999bd42fbc915c5ed95821a64206e8d50a3238 Mon Sep 17 00:00:00 2001 From: kwey Date: Wed, 25 Jun 2025 11:11:46 +0800 Subject: [PATCH 3/3] 2025/6/25-11:10 --- vite/src/views/Teacher.vue | 1275 +++++++++++++++++++++++++++--------- 1 file changed, 972 insertions(+), 303 deletions(-) diff --git a/vite/src/views/Teacher.vue b/vite/src/views/Teacher.vue index ac32bf56d..bdd59fbac 100644 --- a/vite/src/views/Teacher.vue +++ b/vite/src/views/Teacher.vue @@ -46,11 +46,11 @@

我的申请

- + 申请记录 - + 授权记录 @@ -73,6 +73,18 @@
+
+
+
+

课程关联数据库

+

4

+

教学使用

+
+
+ +
+
+
@@ -97,18 +109,6 @@
-
-
-
-

课程关联数据库

-

4

-

教学使用

-
-
- -
-
-
@@ -123,96 +123,169 @@
- -
- -
-

选择数据库表

-
-
- - + +
+ +
+

选择数据库表

+
+
+ + +
+
+ + +
-
- - + + +
+ + + + + + + + + + + + + + + + + +
+ + 表名表描述字段数量
+ + {{ table.name }}{{ table.description }}{{ table.columns }}
- -
- - - - - - - - - - - - - - - - - - -
- - 表名表描述字段数量
- - {{ table.name }}{{ table.description }}{{ table.columns }}
+ +
+

填写申请理由

+
+
+ + +
+
+ + +
+
-
- -
-

填写申请理由

-
-
- - -
-
- - -
+ +
+
- -
- + +
+
+

申请状态列表

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
申请编号申请类型申请时间处理状态处理时间操作
DBView20250620001公共数据库表查看2025-06-20 09:30 + + 审核中 + + -- + +
DBView20250618002公共数据库表查看2025-06-18 14:15 + + 已通过 + + 2025-06-19 10:20 + +
DBView20250615003公共数据库表查看2025-06-15 11:45 + + 已拒绝 + + 2025-06-16 16:30 + +
+
+
@@ -230,66 +303,124 @@
- -
- -
- - - - - - - - - - - - - - - - - - - - - - -
申请编号学生姓名数据库名称申请时间状态操作
{{ app.id }}{{ app.student }}{{ app.dbName }}{{ app.time }} - - {{ app.status }} - - - -
-
+ +
+ +
+ + + + + + + + + + + + + + + + + + + + + +
申请编号学生姓名数据库名称申请时间状态操作
{{ app.id }}{{ app.student }}{{ app.dbName }}{{ app.time }} + + {{ app.status }} + + + +
+
- -
-
- 显示 1 到 5 条，共 12 条记录 + +
+
+ 显示 1 到 5 条，共 12 条记录 +
+
+ + + + ... + + +
-
- - - - ... - - +
+ + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
授权编号学生姓名数据库名称授权时间授权期限状态
DBAuth20250620001张三 (S2023001)电商数据分析2025-06-20 15:452025-06-20 至 2025-12-20 + + 已授权 + +
DBAuth20250618002王五 (S2023032)数据库课程作业2025-06-18 11:302025-06-18 至 2025-09-18 + + 已授权 + +
DBAuth20250615003李四 (S2023015)机器学习实验2025-06-15 09:202025-06-15 至 2026-06-15 + + 已过期 + +
@@ -308,64 +439,455 @@
- -
- -
-
- - + +
+ +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+ + +
+
+
+ + +
+ +
+
+ + +
+
+

申请状态列表

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
申请编号数据库名称申请时间处理状态处理时间操作
DBCreate20250620001机器学习研究库2025-06-20 10:15 + + 审核中 + + -- + +
DBCreate20250615002教学案例库2025-06-15 14:30 + + 已通过 + + 2025-06-16 16:45 + +
DBCreate20250610003科研实验数据库2025-06-10 09:20 + + 已拒绝 + + 2025-06-12 11:30 + +
+
-
- - +
+
+
+ + + +
+
+
+

我的申请记录

+

查看所有数据库相关的申请记录和状态

+
+ +
+
+
+
+ + +
+
+ +
+
+ +
+
+ +
-
- - + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
申请编号申请类型申请时间处理状态处理时间操作
DBView20250620001公共数据库表查看2025-06-20 09:30 + + 审核中 + + -- + +
DBCreate20250620001自建数据库申请2025-06-20 10:15 + + 审核中 + + -- + +
DBView20250618002公共数据库表查看2025-06-18 14:15 + + 已通过 + + 2025-06-19 10:20 + +
DBCreate20250615002自建数据库申请2025-06-15 14:30 + + 已通过 + + 2025-06-16 16:45 + +
DBView20250615003公共数据库表查看2025-06-15 11:45 + + 已拒绝 + + 2025-06-16 16:30 + +
-
- - +
+ + +
+
+ 显示 1 到 5 条，共 12 条记录
-
- - +
+ + + + +
-
-
- - +
+
+
+
+ + +
+
+
+

我的授权记录

+

查看所有已授权的数据库访问记录

+
+ +
+
+
+
+ + +
+
+ +
+
+ +
+
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
授权编号数据库名称授权时间授权期限状态操作
DBAuth20250620001电商数据分析2025-06-20 15:452025-06-20 至 2025-12-20 + + 已授权 + + + +
DBAuth20250618002数据库课程作业2025-06-18 11:302025-06-18 至 2025-09-18 + + 已授权 + + + +
DBAuth20250615003机器学习实验2025-06-15 09:202025-06-15 至 2026-06-15 + + 已过期 + + + +
DBAuth20250610004教学案例库2025-06-10 14:252025-06-10 至 2026-06-10 + + 已授权 + + + +
DBAuth20250605005科研实验数据库2025-06-05 11:102025-06-05 至 2025-12-05 + + 已撤销 + + + +
+
- -
- + +
+
+ 显示 1 到 5 条，共 15 条记录 +
+
+ + + + + +
@@ -424,10 +946,46 @@

申请时间

{{ currentStdAuthApp?.time }}

+
+

申请理由

+
+ 用于课程《数据库原理》的实验作业，需要访问数据库进行SQL查询练习和数据分析。 +
+

审核意见

+
+

授权期限

+ +
+
+

授权权限

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
@@ -435,205 +993,316 @@ 拒绝
+ + +
- \ No newline at end of file -- Gitee