路由更新

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

@@ -0,0 +1,65 @@
+<template>
+  <div class="column-management">
+    <div class="action-bar">
+      <el-button type="primary" @click="showCreateDialog">+ 新增栏目</el-button>
+    </div>
+
+    <el-table :data="columns" style="width: 100%" row-key="id" :tree-props="{children: 'children'}">
+      <el-table-column prop="name" label="栏目名称" min-width="200" />
+      <el-table-column prop="code" label="栏目编码" width="150" />
+      <el-table-column prop="sort" label="排序" width="80" />
+      <el-table-column prop="status" label="状态" width="100">
+        <template #default="{ row }">
+          <el-tag :type="row.status ? 'success' : 'info'">
+            {{ row.status ? '启用' : '禁用' }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="200" fixed="right">
+        <template #default="{ row }">
+          <el-button size="small" @click="editColumn(row)">编辑</el-button>
+          <el-button size="small" type="danger" @click="deleteColumn(row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted } from 'vue';
+import { ElButton, ElTable, ElTableColumn, ElTag, ElMessage } from 'element-plus';
+
+const columns = ref<any[]>([]);
+
+onMounted(() => {
+  loadColumns();
+});
+
+function loadColumns() {
+  // TODO: 加载栏目数据
+}
+
+function showCreateDialog() {
+  // TODO: 显示创建栏目对话框
+}
+
+function editColumn(row: any) {
+  // TODO: 编辑栏目
+}
+
+function deleteColumn(row: any) {
+  // TODO: 删除栏目
+  ElMessage.success('删除成功');
+}
+</script>
+
+<style lang="scss" scoped>
+.column-management {
+  padding: 20px;
+}
+
+.action-bar {
+  margin-bottom: 20px;
+}
+</style>
+