Skip to content

Advancedpawn2020/cinema-web

Repository files navigation

cinema-web

vue element-ui license GitHub release

本项目是电影院会员管理系统的web端,是基于Vue + Element UI 的后台管理系统解决方案的一个应用。参考后台管理模板:vue-manage-system项目地址

项目截图

登录页面

Image text

系统首页

Image text

会员界面

Image text

会员卡界面

Image text

会员关怀

Image text

前言

本项目基于Web Management System模板开发。基于 vue.js,使用 vue-cli3 脚手架,引用 Element UI 组件库。

安装步骤

git clonegit@github.com:Advancedpawn2020/cinema-web.git      // 把前端项目下载到本地
cd cinema-web    // 打开命令行,进入项目目录
npm install         // 安装项目依赖,等待安装完成之后,安装失败可用 cnpm 或 yarn

// 开发环境,开启服务器,浏览器访问 http://localhost:8080,
npm run serve

// 生产环境,执行构建命令,生成的dist文件夹下文件复制到webapp下
npm run build

各文件夹作用

  • api:集合了所有页面的ajax的请求
  • assets:所有的css和img等静态资源
  • components:单文件组件
    • common:公共的组件,包括头、首页布局、事件路由器、侧边栏等
    • page:各可以跳转的单文件组件
  • config:全局配置文件
  • router:实例化前端路由,包含所有可以在路由中被跳转的地址
  • utils:axios的封装,供api文件夹使用
  • App.vue:其模板是被核心Vue挂载的,是整个单页面应用的根模板
  • main.js:核心Vue实例的位置,是脚手架中默认启动的入口,是整个应用的核心

其他注意事项

  • 针对于本项目的具体修改过程,可参考vue-manage-system项目地址
  • 使用本前端项目进行前后端分离开发时,需要解决跨域问题,在utils/request.js中将baseURL设置为/api,并在vue.config.js中设置/api所映射的路径, 以期使用node的代理服务器解决跨域问题(如使用默认设置,请将cinema后端项目的端口设置为8081,路径设置为/cinema)

License

MIT

About

电影院会员管理系统前端,使用SpringBoot+mybatis+vue.js实现了会员、会员卡、电影票、积分兑换、会员关怀等模块

Resources

License

Stars

Watchers

Forks

Packages

No packages published