# meiSee

**Repository Path**: taec0123/meiSee

## Basic Information

- **Project Name**: meiSee
- **Description**: 练习用elementUI针对湖南3家剧院的剧目管理系统搭建
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2020-05-19
- **Last Updated**: 2022-05-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# mei_see剧院管理系统

这个后台管理系统基于长沙三家已开剧院设计，包括湖南大剧院（装修中）、[长沙音乐厅](https://csyyt.polyt.cn/index/home)、[梅溪湖国际文化艺术中心](https://mxhdjy.polyt.cn/index/home)，设计而成，旨在更好的分享长沙地区演出信息，让用户分享自己的剧目评价以及每个剧院座位的对应视角图。

基于VUE搭建，使用VUE全家桶、[ElementUI](https://element.eleme.cn/#/zh-CN)、[echarts](https://echarts.apache.org/zh/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts)、[swiper](https://www.swiper.com.cn/)、better-scroll等插件，前后端分离，后台目前使用的是Json-server搭建的简单Mock数据后台，支持读写操作，详情可看[后端代码仓库](https://gitee.com/taec0123/mei-see_)

前台页面设计中...

## 主要页面模块

### welcome页面

分为4块显示、今天的演出、昨日新增用户数据和用户评论、最近10条用户评论、通过echarts显示本月的所有演出日历

### 剧场管理页面

此页面上下分为3块

#### 剧院基本显示区域

此处显示剧院基本信息栏，显示当前剧院名称、官网链接、联系方式

#### 座位图显示区域

此处采用`el-tabs`显示出同一剧院中不同演出厅的座位图信息。

这里的座位图是根据占位长宽来生成对应的方格图，根据数据是否为座位来显示，这里点击编辑时，表示当前座位图是可修改状态，此时座位图可以点击。

有两种操作方式：

1. 单击可以切换某一个座位是否是座位状态
2. 双击可以将某两个不是座位中间的全部作为标记为不是座位（若没有限定某两个座位中间区域，就是整行都设置为不是座位），方便快速编辑

点击完成后会向后端发送新的座位图数据，点击删除可以删除当前演出厅

点击`el-tabs`最后的加号会弹出添加演出厅对话框，需要输入对应的演出厅名称、长宽占比、座位数量

#### 近期演出剧目显示区域

这里会显示当前日期往后，此演出厅的最多10场演出，在这里点击编辑会弹出剧目编辑对话框，能够编辑简单数据，并且删除价格数据（但不能更改座位价格图，删除价位会清空对应座位价格图），点击删除回直接删除剧目

### 剧目管理页面

#### 搜索栏

支持多个关键词搜索，以空格分开，回车开始搜索，支持清空，清空后会重新请求正常数据

#### 添加剧目

点击搜索框后面的添加剧目按钮，会弹出添加剧目对话框

对话框内需要填写剧目名、演出日期、所属剧院和演出厅、剧目类型、以及价格分区（剧照上传功能开发中...）

这里演出地点是级联选择器，通过选择器的切换请求不同的价格数据，价格分区以逗号分隔不同价格（中英文逗号都自动转换成英文逗号），回车后会生成对应的价格颜色数据，单选不同的价格颜色，然后在下方的座位图中编辑价格图

也有两种操作方法：

1. 单击是给当前座位标记价格
2. 双击是给当前一整排座位标记价格（两个不是座位块中间的座位）

确定后就会向后台添加数据，但此时这个后台程序问题，服务器重启后这个添加的数据会消失

#### 剧目信息展示

这里根据分页器的操作，选择每页有多少条数据，只会请求部分数据，减少网络请求的数据。

会展示演出名、演出时间、是否演出、演出类型、价格区间、剧院、演出厅，这里的是否演出标签，是根据演出时间计算出来的。

点击详情会弹出对话框，显示整个剧目的完整信息，通过点击切换按钮可以切换是否可编辑状态

在可编辑状态中可以修改剧目的所有信息

1. 如果切换演出地点则会清空所有座位图信息
2. 演出时间可选择多个
3. 价格分区删除某一价格就会删除对应价格的所有座位图信息

座位图编辑和添加剧目操作逻辑一样

1. 单击是给当前座位标记价格
2. 双击是给当前一整排座位标记价格（两个不是座位块中间的座位）

点击确定后会向后台发送修改请求，并且重新刷新数据

这个页面点击删除按钮会直接删除对应剧目

### 用户管理页面

和剧目管理页面一样，这里也会根据分页器的数据来请求对应数量的用户数据，减少请求

此页面显示用户名、性别、评论数量、账户状态、生日信息

点击编辑按钮会显示洪湖信息详情对话框，对话框中根据不同的账号权限修改了按钮显示功能

1. admin超级管理员，拥有修改用户状态、修改评论状态、删除评论的权限，登录此账号的时候这3个按钮都会显示出来
2. 普通管理员，只拥有更改评论状态权限，其他两个按钮不显示

#### 用户信息详情对话框

##### 用户基本信息

在此对话框中会展示用户的所有信息，并且能够更改用户状态

##### 用户评论

这里通过`el-table`表格展现用户所有评论数据，并且支持下拉展开所有的信息，包括评价的剧目、评分、评论时间、评论内容以及评论图片，在表格收起的情况下使用`el-rate`可视化评分