diff --git a/src/assets/admin/css/home.css b/src/assets/admin/css/home.css index 7ccdea1..59701e3 100644 --- a/src/assets/admin/css/home.css +++ b/src/assets/admin/css/home.css @@ -111,3 +111,15 @@ li { flex: 1; overflow-y: auto; } + +/* 重写 ElementPlus 默认样式 */ +/* 表格 */ +.el-table { + margin-top: 7px; + width: 1000px; +} + +/* 面包屑 */ +.el-breadcrumb { + margin-bottom: 7px; +} diff --git a/src/views/admin/administrator/list.vue b/src/views/admin/administrator/list.vue index 54d6d9c..f26cdcc 100644 --- a/src/views/admin/administrator/list.vue +++ b/src/views/admin/administrator/list.vue @@ -1,18 +1,28 @@ <template> - <div> - 管理员列表 + <el-table :data="data.list" border> + <el-table-column prop="id" label="ID" width="60" /> + <el-table-column prop="name" label="名称" /> + <el-table-column prop="email" label="邮箱" /> + <el-table-column prop="remark" label="备注" /> - </div> + <el-table-column label="操作" width="150"> + <template #default="scope"> + <el-button size="small" type="primary">编辑</el-button> + <el-button size="small">删除</el-button> + </template> + </el-table-column> + </el-table> </template> -<script> -export default { - setup() { +<script setup> +import { reactive } from "vue"; + const data = reactive({ + list:[ + {id: '1', name: '李龙龙', email:'lilonglong@koteladt.com', remark:'lll'}, + {id: '2', name: '张三', email:'zhangsan@koteladt.com', remark:'zs'}, + ] + }) - - return {} - } -} </script> <style lang="scss" scoped>