路由更新

schoolNewsWeb/src/views/admin/manage/content/BannerManagementView.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="banner-management">
+    <div class="action-bar">
+      <el-button type="primary" @click="showCreateDialog">+ 新增Banner</el-button>
+    </div>
+
+    <el-table :data="banners" style="width: 100%">
+      <el-table-column label="预览" width="200">
+        <template #default="{ row }">
+          <img :src="row.image" class="banner-preview" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="title" label="标题" min-width="150" />
+      <el-table-column prop="linkUrl" label="链接地址" min-width="200" />
+      <el-table-column prop="sort" label="排序" width="80" />
+      <el-table-column prop="status" label="状态" width="100">
+        <template #default="{ row }">
+          <el-switch 
+            v-model="row.status" 
+            @change="toggleStatus(row)"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="180" fixed="right">
+        <template #default="{ row }">
+          <el-button size="small" @click="editBanner(row)">编辑</el-button>
+          <el-button size="small" type="danger" @click="deleteBanner(row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { ElButton, ElTable, ElTableColumn, ElSwitch, ElMessage } from 'element-plus';
+
+const banners = ref<any[]>([]);
+
+onMounted(() => {
+  loadBanners();
+});
+
+function loadBanners() {
+  // TODO: 加载Banner数据
+}
+
+function showCreateDialog() {
+  // TODO: 显示创建Banner对话框
+}
+
+function editBanner(row: any) {
+  // TODO: 编辑Banner
+}
+
+function deleteBanner(row: any) {
+  // TODO: 删除Banner
+  ElMessage.success('删除成功');
+}
+
+function toggleStatus(row: any) {
+  // TODO: 切换Banner状态
+}
+</script>
+
+<style lang="scss" scoped>
+.banner-management {
+  padding: 20px;
+}
+
+.action-bar {
+  margin-bottom: 20px;
+}
+
+.banner-preview {
+  width: 100%;
+  height: 80px;
+  object-fit: cover;
+  border-radius: 4px;
+}
+</style>
+