# 上大技科2班1组课程设计

**Repository Path**: bit128/xxform

## Basic Information

- **Project Name**: 上大技科2班1组课程设计
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-03-12
- **Last Updated**: 2024-04-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

*最后修订时间: 2024年03月23日*


#### 人员分工
| 姓名 | 分工 | 工作方向描述 |
| ---- | ---- | ---- |
| 胡黎明 | 前端 | 页面功能设计与制定，包含哪些页面，每个页面功能。 |
| 方石专 | 数据 | 根据需求，合理分析、设计表模型，说明设计思路。 |
| 陆玉玲 | 需求 | 描述整个系统所包含的功能、使用场景、使用方式方法。 |
| 许天泽 | 测试 | 功能测试，根据需求测试各项功能是否正常，提交bug记录与优化建议。 |
| 裴超 | 测试 | 压力测试、安全测试、邀请使用体验、收集市场反馈，提交优化建议。 |
| 洪波 | 后端 | 略 |

#### 项目简介

xx在线问卷调研系统是用于制作问卷和收集问卷数据的web系统。用户可以基于该系统制作需要的问卷，生成页面链接，发送给目标用户。目标用户填写问卷后，可以收集数据并展示在系统中。

#### 技术指标

- 服务端使用基于java(v11)语言的SpringBoot(v2.7.18)框架。
- 数据库使用MariaDB(v11.2.2)，兼容Mysql。
- 前端使用基于vue2的js库，和基于pure的css库。
- 运行系统环境兼容Windows7以上、OS X 10.7.5以上、Linux内核3.10以上操作系统。
- 运行硬件至少需要双核处理器，2GB运存。

项目地址： [Vincent · H/上大技科2班1组课程设计 (gitee.com)](https://gitee.com/bit128/xxform)

Vue2框架文档：[介绍 — Vue.js (vuejs.org)](https://v2.cn.vuejs.org/v2/guide/)
Pure Css 文档：[Pure | Pure中文站 | Purecss学习网](https://purecss.cn/)
前端基础教程系列：
	1. html [HTML 教程 | 菜鸟教程 (runoob.com)](https://www.runoob.com/html/html-tutorial.html)
	2. css [CSS 教程 | 菜鸟教程 (runoob.com)](https://www.runoob.com/css/css-tutorial.html)
	3. javascript [JavaScript 教程 | 菜鸟教程 (runoob.com)](https://www.runoob.com/js/js-tutorial.html)

> Java 11 部署步骤：
> 	1. 下载java11.zip包，解压到磁盘上，例如 D:\\xxx\\java-11
> 	2. 找到java.exe所在的bin目录并复制，例如 D:\\xxx\\java-11\\bin
> 	3. 找到 此电脑 - 属性 - 高级系统设置 - 环境变量 - 系统变量 - Path
> 	4. 将bin目录加入到Path中。
> 	5. 打开控制台，输入： java --version 回车。
> 	6. 显示版本号，视为部署成功。

> MariaDB11 部署步骤
> 	1. 通过安装包安装，过程中勾选启用root账号，并为root账号设置相同密码。
> 	2. 勾选使用utf-8作为默认字符编码。
> 	3. 打开控制台，输入： mysql --version 回车。
> 	4. 显示版本号，视为部署成功。

###### MariaDB11 常用命令
```sql
#链接登录数据库
mysql -uroot -p

#创建数据库
create database table_name;

#切换数据库
use table_name;

#导入数据库脚本（.sql文件）
source D:\xxx\table_name.sql
```


#### 需求分析

1. 登录登出和注册功能。创建、编辑问卷、查阅问卷数据等功能，需要用户登录系统操作。没有账号的用户，需要注册成为正式用户。注册时，需要保持账号唯一性，可以使用手机号、邮箱注册。需要存储账号、密码、用户昵称、联系方式、备注等字段。
2. 正式用户创建问卷表单功能。表单需要记录主题、创建时间、修改时间、所属人、状态、浏览数、提交数等字段。
3. 可以管理、查看已创建的问卷列表。
4. 问卷可以编辑题目、选项、选项类型。
5. 问卷每个题目包含1~8选项，选项类型有：填空、单选、多选。方式有：必选题、可选题。
6. 问卷有：准备、上线、完成、停用等状态。准备中的问卷允许自由编辑，上线后的文件会生成分享链接以及操作页面，目标用户可以打开、填写提交问卷。完成状态的问卷不可再提交。

#### 数据建模

###### 用户表结构

本系统支持用户注册登录功能，设计 #user 表用于存储用户信息。用户注册时，需要设置账号和密码，账号支持手机号或者邮箱地址，所以 account作为存储账号字段，被设计为可变字符型64个字符长度。为了是提升密码的安全性，#user 表模块使用了MD5算法对密码进行非可逆加密处理，MD5处理过的内容长度固定为32个字符，所以password字段设计为固定字符型32个字符长度。

为了统计某一时段的用户注册量，我们设计了 createTime 字段，用于存储用户注册时的时间戳。通过查询某时段范围的时间戳，可以实现注册量的统计。

为了检测用户的使用情况，还设计了loginTime 和 ip字段，用于记录用户最后的登录时间和登录IP地址。

系统中的用户身份可能是有多种的，例如冻结用户、普通用户、vip用户、管理员等，status 字段被设计用来标记用户的身份。

| 字段名 | 类型 | 说明 | 备注 |
| ---- | ---- | ---- | ---- |
| id | int | 主键 | 自增 |
| name | varchar(16) | 姓名 |  |
| account | varchar(64) | 账号 | 手机号或者邮箱 |
| password | char(32) | 密码 | md5哈希值 |
| createTime | int | 注册时间 |  |
| loginTime | int | 最后登录时间 |  |
| ip | char(15) | 登录IP地址 |  |
| status | tinyint | 身份状态 |  |

```sql
create table user (
id int not null primary key,
name varchar(16) not null,
account varchar(64) not null,
password char(32) not null,
createTime int unsigned not null,
loginTime int unsigned not null,
ip char(15) not null,
status tinyint not null
);
```

###### 问卷主表结构

问卷主表 #paper 有一个外键 uid 用来关联 #user 表，如此可以知道该问卷的隶属用户（谁创建的）。title字段被设计为可变字符型，最大支持64个字符长度，所以问卷的标题长度不能超过64个字。考虑到在一些使用场景中，更好地诠释问卷调查的目的，我们还设计了note字段，最多可以书写500字的内容描述，方便展示在问卷UI上。

为了统计问卷的浏览量和填写提交量，分别设计了views和submits字段，用于记录这两项指标。在被调查人打开当前问卷页面的时候，views 将累加记录。被调查人填写、成功提交问卷后，submits将累加记录。问卷的创建人在后台可以很方便地查看各个问卷的浏览量和提交量。

除此以外，我们还设计了createTime以记录问卷的创建时间，updateTime用于记录问卷的最后一次修改时间。

status字段用来标记当前问卷所处的状态。例如“准备阶段”的问卷，是对外不公开的。"上线阶段"的问卷对外是公开的，可以填写提交的。"完成阶段"的问卷已经结束调查，进入数据汇总分析阶段，是不可以再填写提交的了。

| 字段名 | 类型 | 说明 | 备注 |
| ---- | ---- | ---- | ---- |
| id | int | 主键 | 自增 |
| title | varchar(64) | 主题 |  |
| views | int | 浏览量 |  |
| submits | int | 提交量 |  |
| createTime | int unsigned | 创建时间 |  |
| updateTime | int unsigned | 修改时间 |  |
| note | varchar(512) | 备注 |  |
| status | tinyint | 状态 |  |
| uid | int | 创建人 |  |
```sql
create table paper (
id int unsigned not null auto_increment primary key,
title varchar(64) not null,
views int not null,
submits int not null,
createTime int unsigned not null,
updateTime int unsigned not null,
note varchar(512) not null,
status tinyint not null,
uid int not null
);
```

###### 问卷题目表

设计 #subject 表用于记录问卷包含的题目。因为一个问卷 #paper 对应着多个 #subject 问卷题目。所以 #subject 表设计了一个外键 pid 用于标识所隶属的问卷。另外，uid外键用于标识这些题目所属的创建者 #user 。之所以设计uid这个外键，是出于删除操作时的安全性。用户只能删除所属的题目 #subject 。

题目的标题subtitle被设计为可变字符型，最大支持64个字符长度，所以题目长度不能超过64个字。

options字段用于存储题目的选项值，每一个选项使用换行符分割，全部的选项内容不能超过500个字长度。type字段用于标识当前选项的类型，如单选题、多选题或者填空题。当type类型为填空题时，options可空，否则options需要填写至少一个选项。

一些场景中，题目的选项是非必填项，所以checked字段被设计用来标识当前题目选项是否是可选项。

| 字段名 | 类型 | 说明 | 备注 |
| ---- | ---- | ---- | ---- |
| id | int | 主键 | 自增 |
| pid | int | 问卷主表ID | 外键 |
| subtitle | varchar(64) | 题目名称 |  |
| options | varchar(512) | 选项值 |  |
| type | tinyint | 类型 | 1: 单选 2: 多选 3: 填空 |
| checked | tinyint | 检查方式 | 0: 不检查 1: 检查（必填项） |
| uid | int | 创建者ID |  |
```sql
create table subject (
id int unsigned not null auto_increment primary key,
pid int not null,
subtitle varchar(64) not null,
options varchar(512) not null,
type tinyint not null,
checked tinyint not null,
uid char(13) not null
);
```

###### 答卷主表

被一位被调查者提交的每一份答卷，都包含一个答卷主表 #answer ，用来记录答卷摘要信息。考虑到到被调查者不一定是注册用户，并且为了使用方便，我们也不强制被调查者需要先注册才能使用。我们在 #answer 主表中设计了name和phone字段，用来临时记录被调查者的姓名和联系方式。当然被调查者如果是注册用户的话，uid外键字段会保存用户的ID。

此外，pid外键用于关联具体的问卷ID，用来标识该答卷是隶属哪个问卷的。createTime字段记录了提交的时间戳。方便管理者按照时间统计答卷。

考虑到后期可能有统计分析答卷的需求，我们还设计了status字段用于保存答卷 #answer 的各种状态，例如 未审核、已审核、公示中 等等。

| 字段名     | 类型        | 说明           | 备注 |
| ---------- | ----------- | -------------- | ---- |
| id         | int         | 主键           | 自增 |
| pid        | int         | 问卷主表ID     | 外键 |
| name       | varchar(16) | 填表人姓名     |      |
| phone      | varchar(32) | 填表人联系方式 |      |
| createTime | int         | 创建时间       |      |
| status     | tinyint     | 状态           |      |
| uid           | int            | 提交人ID               | 可选     |
```sql
create table answer (
id int unsigned not null auto_increment primary key,
pid int not null,
name varchar(16) not null,
phone varchar(32) not null,
createTime int unsigned not null,
status tinyint not null,
uid int not null
);
```

###### 答卷题目表

被调查人具体提交的答卷的内容，是保存在答卷题目表 #answer_item 中。一个问卷包含多个题目，所谓一个问卷的答卷包含多个题目的答案。所以 #answer 与 #answer_item 是一对多的关系。aid外键被设计用来标记所隶属的答卷 #answer 使用。

sid外键用于标识所关联的问卷题目 #subject 使用，保存的题目编号与问卷题目是一一对应的。

content字段用于保存没到题目的具体内容，该字段被设计为可变字符型，最大支持64个字符长度，所以答案内容不能超过64个字。

| 字段名 | 类型 | 说明 | 备注 |
| ---- | ---- | ---- | ---- |
| id | int | 主键 | 自增 |
| aid | int | 答案主表ID | 外键 |
| sid | int | 题号 | 外键 |
| content | varchar(64) | 答案 |  |
```sql
create table answer_item (
id int unsigned not null auto_increment primary key,
aid int not null,
content varchar(64) not null,
sort int not null
);
```


#### 网页（前端）实现

######  登录、注册页面

页面元素包括：账号输入框、密码输入框、登录按钮、注册按钮。

登录API:
POST /user/login.do
DATA {"account": string, "password": string}

注册API:
POST /user/register.do
DATA {"account": string, "password": string}

###### 问卷列表

页面元素包括：搜索栏、新建文件按钮、问卷列表（编号、问卷主题、浏览量提交量、时间、状态、编辑），问卷编辑面板。

问卷编辑API:
POST /paper/save.do
DATA {"paper": object}

获取问卷详情API:
GET /paper/get.do/{id}

获取问卷列表API:
POST /paper/getList.do
DATA {"offset": int, "limit": int, keyword: string, status: int}

删除问卷API:
POST /paper/delete.do
DATA: {"id", long}

###### 问卷题目

页面元素包括：问卷摘要、题目列表（序号、题目、类型、选项、检查、操作）、添加题目按钮、题目编辑面板。

编辑题目API：
POST /subject/save.do
DATA {"subject": object}

获取题目详情API：
GET /subject/get.do/{id}

获取题目列表API:
POST /subject/getList.do
DATA: {"offset": int, "limit": int, "pid": long}

删除题目API：
POST /subject/delete.do
DATA: {"id", long}

###### 答卷

页面元素包括：问卷摘要、答卷列表（用户信息、答卷摘要信息、时间、操作）。

获取答卷列表API：
POST /answer/getList.do
DATA {"offset": int, "limit": int, pid: long}

标记答卷状态API:
POST /answer/setStatus.do
DATA {"id": long, "status": int, "uid": long}

###### 问卷调查表

页面元素包括：用户信息填写区域（包含已有账号的登录跳转）、问卷题目展示区域、作答区域、提交按钮。

获取问卷详情API:
GET /paper/get.do/{id}

获取题目详情API：
GET /subject/get.do/{id}

提交问卷API:
POST /answer/submit.do
DATA {"answer": object, "answer_item": list}

#### 系统（后端）实现

- beans
- mappers
- services
- controllers


#### 功能测试（偏技术）


#### 体验测试（偏体验）