【Vue3 博物馆管理系统】定制上中下（顶部菜单、底部区域、中间主区域显示）三层结构首页

系列文章目录

第一章 定制上中下（顶部菜单、底部区域、中间主区域显示）三层结构首页
第二章 使用Vue3、Element-plus菜单组件构建菜单
[第三章 使用Vue3、Element-plus菜单组件构建轮播图]
[第四章 使用Vue3、Element-plus菜单组件构建组图文章]

文章目录

• 系列文章目录
• • @[TOC](文章目录)
• 1、系统设计
• • 1.1、前台用户
  • • 1.1.1、用户模块
    • 1.1.2、资讯模块
    • 1.1.3、藏品模块
• 2、本章节效果图
• • 2.1、拆解任务
• 3、动手开干
• • 3.1、Vue3项目的创建
  • • 3.1.1、创建museum空白目录
    • 3.1.2、使用idea打开
    • 3.1.3、创建Vue3项目
    • • 3.1.3.1、打开cmd命令，进入到上一步创建的目录；
      • 3.1.3.2、运行命令：vue create front
      • 3.1.3.3、选择 Vue3项目
      • 3.1.3.4、项目构建中
      • 3.1.3.5、构建成功
      • 3.1.3.6、按照提示启动项目
      • 3.1.3.7、在浏览器访问项目
  • 3.2、Vue3 路由应用
  • • 3.2.1、在Idea里打开museum项目，展开front工程
    • 3.2.2、为项目安装router
    • 3.2.3、在src下创建view、router目录
    • • 3.2.3.1、/view/Home.vue文件
      • 3.2.3.2、/router/index.js文件
      • 3.2.3.3、main.js加载路由
      • 3.2.3.4、App.vue 加载 router-view
      • 3.2.3.5、修改启动端口:80
    • 3.2.4、访问页面
  • 3.3、Element-plus 应用
  • • 3.3.1、为项目安装Element-plus
    • 3.3.2、Vue项目加载Element-plus
  • 3.4、Element-plus 的布局、在顶栏区域放置菜单、底栏容器放置站内导航\版权等信息
  • 3.5、执行npm run serve启动项目，可见到第一部分的效果图
• 总结

1、系统设计

Vue3 博物馆管理系统，从构建Vue3项目开始，打造一个博物馆系统。
分为2个系统：前台用户、后台管理

1.1、前台用户

包含模块：用户模块、资讯模块、藏品模块

1.1.1、用户模块

• 登录
  提供前台用户登录功能
• 注册
  提供前台用户注册功能
• 检查登录账号是否唯一
  检索用户库，是否存在相同账号

1.1.2、资讯模块

• 资讯列表
  咨询列表信息展示
• 资讯详情
  资讯详情数据展示，展示资讯标题、副标题、发布时间、来源、作者、资讯内容等信息

1.1.3、藏品模块

• 藏品分类信息查询
  藏品分类信息展示
• 藏品列表信息查询
  藏品列表信息展示，可根据分类信息过滤查询，可根据藏品标题