豆约翰

本节学习目标 掌握element-plus表格el-table和el-table-column的用法。 新增文章数据类型 新增getArticles接口 修改AllArticles.vue 测试验证

本节学习目标 vue-router路由导航守卫原理及其在项目中的应用。 遗留问题 目前系统有一个问题，就是在用户未成功登录的情况下，用户可以访问后台主页。我们的系统需要实现鉴权功能，即在用户未成功登录

本节学习目标 通用登录功能开发 新增登录页面 src/views目录下新增login目录，login目录下新增index.vue 新增登录接口 新增登录路由 修改注册页面，实现已有账号？去登录跳转链接

本节学习目标 主要是掌握element-plus表单用法 新增个人信息修改页面 views目录下新增personal目录，personal目录下新增index.vue文件 新增updateUser接口

安装node.js 安装Code Runner扩展插件 安装ts-node 安装node.js 安装Code Runner扩展插件 安装ts-node

新增Hearder 新增 src/layout/components/PageHeader.vue 修改index.vue 修改user.ts 修改注册页面 之前删除style.css,导致注册页面样

删除style.css 删除style.css(和main.ts同级) 并且注释掉main.ts中对style.css的导入。 修改App.vue 添加样式设置高度100% 安装sass 修改Page

使用el-menu和el-sub-menu及el-menu-item导航 src/layout目录下新增components目录，components目录下新增PageSidebar.vue 代码基本

综述 一般后台管理系统的整体布局基本如下： 由于实现细节比较多，故计划分为4小节讲述。 页面子路由 el-menu 样式美化 hearder头部 本节为第一小节。 新增2个页面 views目录下新增a