基于nodejs+vue城市郊野公园管理系统的设计与实现python-flask-django-php

现在还有许多人用纸质工具存储并管理信息,网络仅仅起到一般的辅助性作用。以我对人们常用软件的了解程度,大家仍然把传统的Office软件当成主要工具,城市郊野公园管理系统相比Office软件来说会更全面更专业[4]。本系统通过标签分类等方式,使管理人员对各项功能信息实现高效的管理,可以极大的提高管理人员的工作效率。

前端技术:nodejs+vue+elementui,

Express 框架于Node运行环境的Web框架,

语言 node.js

框架:Express

前端:Vue.js

数据库:mysql

数据库工具:Navicat

开发软件:VScode

视图层其实质就是vue页面,通过编写vue页面从而展示在浏览器中,编写完成的vue页面要能够和控制器类进行交互,从而使得用户在点击网页进行操作时能够正常。

代码结构讲解

1、 node_modules文件夹(有npn install产生)

这文件夹就是在创建完项目后,cd到项目目录执行npm install后生成的文件夹,下载了项目需要的依赖项。

2、package.json文件

此文件是项目的配置文件(可定义应用程序名,版本,依赖项等等)。node_modules文件夹下的依赖项是从哪里知道的呢?原因就是项目根目录下的这个package.json文件,执行npm install时会去找此文件中的dependencies,并安装指定的依赖项。

3、public文件夹(包含images、javascripts、stylesheets)

这个文件夹做过Web开发的应该一看就知道,为了存放图片、脚本、样式等文件的。

4、routes文件夹

用于存放路由文件。

5、views文件夹

存放视图。

2系统分析

2.1需求分析

需求分析做为手机软件整体规划环节和项目生命周期的关键一部分,应当是"实现什么东西"而不是"实现"[5]。根据开发者对调研分析关键点、作用、特性、稳定性的掌握,将用户的无形要求转换为有形的界定,以便确定系统的运行目标。

2.1.1 系统可行性分析

系统的可行性主要针对以下方面分析:

(1)经济可行性

经济发展的可行性分析要从开发商的经济发展能力和用户必须的成本费2个层面来剖析。为了更好地减少项目成本,

2.1.3 非功能需求分析

(1)系统的实用性

城市郊野公园管理系统的开发,要求做到足够的简洁、易用,能为用户提供快捷、便利的使用体验,减少系统的无用功能,以及用户使用上的多余操作[11]。

(2)系统的安全性

城市郊野公园管理系统纪录了至关重要的用户信息等信息,应当具备很高的安全性和经济价值。因此为了更好地保证用户的重要信息不被泄露、破坏和盗取,一定要保证系统的安全性。

(3)系统的稳定性

当一个系统的稳定性没法确保时,用户在应用系统时很容易发生数据操作不正确或网页页面回应不正确等。系统的稳定性对用户对系统的评价有较大的影响,是评价系统的一个主要指标值。因而,为了确保系统的稳定性,开发设计时要挑选稳定性高的操作系统、开发软件、数据库、服务器、以及其他工具。

此章主要是详细介绍城市郊野公园管理系统软件整体架构功能的设计与实现。

3.1 系统设计目标

城市郊野公园管理系统的开发采用模块化软件结构设计,通过模块划分,可以让整个系统开发设计变得更加简洁,结构清晰,让程序的可读性和维护性更高,也方便开发人员对开发期间的组织管理工作,模块化就是指叙述I/O、逻辑性功能、内部结构条件和环境因素的表述。一般系统的一个子模块只实行一个功能,模块中间应当有良好的结构分析。下一层模块在顶层模块的启用下进行功能,后边的模块被逐渐启用,互相配合程序流程的每个子功能。在设计时应保持模块独立化原则,所以一个软件应该由一组相互独立的子模块构成,并保证模块间接口开发简单。

3.2 系统结构图

由需求分析阶段结果和综合分析,实质上,城市郊野公园管理系统是一个开发难度比较高的系统,因为系统相对复杂,涉及功能多,且有一定的综合性,所以需要做到对现有软硬件的合理应用、系统软件层面做好科学合理的规划设计。构建一个完善的城市郊野公园管理系统软件,包含前台展示网页页面、处理程序、后台管理有关的MySQL数据库系统等。

因此,城市郊野公园管理系统按照功能由三部分构成的,三部份是用户、保洁人员和管理员。主要功能有园区信息、园区服务、招商信息、停车位信息等。系统软件用户、保洁人员与管理员的功能模块图如下图3-1所显示。

3.3 系统数据库设计

为了更好地便捷日后的信息维护保养和信息升级,提升系统软件数据信息浏览的高效率。设计方案一个健全的数据库是必需的。数据库设计方案系统对有较大的影响,好的设计可以做到缩短数据操作的所需时间,带来更大的流量,同时在进行开发时,数据库设计的越优秀,越合理,开发所需要编写的代码就越简洁,越能使数据的储存效率提高,让数据的一致性和完整性可以得到保证。

3.3.1 数据库概念设计

概念模型用于对信息世界进行建模,单独于指定的数据库管理系统。便于将现实世界中的实际事情抽象地构成数据库管理系统适用的数据库模型。大家趋向于先把现实世界抽象化成信息世界,再把信息世界变为机器世界[12]。换句话说,最先将现实世界中的目标抽象化为自主于特殊计算机软件和特殊数据库管理系统的信息构造,而是一个数据模型,随后在电子计算机上把该实体模型变换为数据库管理系统适用的数据库系统。实际上,数据模型是以现实世界到机器世界的正中间层级。

信息世界的基本要素包含实体和关联。

(1)实体(entity)

实体(entity) 客观存在并可相互区别的事物称为实体[13]。实体可以是实际的人、事或物,还可以是抽象化的概念或联络。

(2)联系(relationship)

我们可以把现实世界中相应的事情当作有关的实体,随后叙述现实世界中的信息。实体内部结构的特性连接造成实体中间的连接。实体间的连接可以有三种:一对一(1: 1),一对多(1: n),多对多(m: n)。信息世界用概念模型来进行建模,所以信息世界中共有的概念可以由概念模型准确的方便的表达出来[14]。表达概念的方法不仅一种,E-R图是最经常使用的一种。现实世界的概念模型可以用E-R图来叙述,称之为实体-关系模型,通称E-R

实体模型。
.3.2 数据库逻辑设计

在这一阶段需要做的是将主要的E-R图转化成一种逻辑结构,这类逻辑结构可以相匹配于您所采用的数据库智能管理系统的数据实体模型。

根据分析出的基本E-R 模型和之间联系,确定了数据库的逻辑结构。系统用部分表来说明。

表3-1:公告信息

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

title varchar 200 标题

introduction longtext 4294967295 简介

picture longtext 4294967295 图片

content longtext 4294967295 内容

表3-2:订票信息

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

dingpiaobianhao varchar 200 订票编号

yuanqumingcheng varchar 200 园区名称

quyu varchar 200 区域

chengrenjiage float 成人价格

shuliang1 int 数量

ertongjiage float 儿童价格

shuliang int 数量

zongjia float 总价

dingpiaoshijian date 订票时间

beizhu longtext 4294967295 备注

yonghuzhanghao varchar 200 用户账号

yonghuxingming varchar 200 用户姓名

ispay varchar 200 是否支付 未支付

表3-3:配置文件

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

name varchar 100 配置参数名称

value varchar 100 配置参数值

表3-4:预约信息

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

yuyuebianhao varchar 200 预约编号

yuanqumingcheng varchar 200 园区名称

cheweibianhao varchar 200 车位编号

cheweimingcheng varchar 200 车位名称

cheweiweizhi varchar 200 车位位置

yuyueshijian date 预约时间

yonghuzhanghao varchar 200 用户账号

yonghuxingming varchar 200 用户姓名

beizhu longtext 4294967295 备注

sfsh varchar 200 是否审核 待审核

shhf longtext 4294967295 审核回复

表3-5:关于我们

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

title varchar 200 标题

subtitle varchar 200 副标题

content longtext 4294967295 内容

picture1 longtext 4294967295 图片1

picture2 longtext 4294967295 图片2

picture3 longtext 4294967295 图片3

表3-6:用户表

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

username varchar 100 用户名

password varchar 100 密码

role varchar 100 角色 管理员

addtime timestamp 新增时间 CURRENT_TIMESTAMP

表3-7:token表

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

userid bigint 用户id

username varchar 100 用户名

tablename varchar 100 表名

role varchar 100 角色

token varchar 200 密码

addtime timestamp 新增时间 CURRENT_TIMESTAMP

expiratedtime timestamp 过期时间 CURRENT_TIMESTAMP

表3-8:停车位信息

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

yuanqumingcheng varchar 200 园区名称

cheweibianhao varchar 200 车位编号

cheweimingcheng varchar 200 车位名称

cheweitupian longtext 4294967295 车位图片

cheweiweizhi varchar 200 车位位置

cheweizhuangtai varchar 200 车位状态

cheweixiangqing longtext 4294967295 车位详情

表3-9:关于我们

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

title varchar 200 标题

subtitle varchar 200 副标题

content longtext 4294967295 内容

picture1 longtext 4294967295 图片1

picture2 longtext 4294967295 图片2

picture3 longtext 4294967295 图片3

表3-10:收藏表

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

userid bigint 用户id

refid bigint 商品id

tablename varchar 200 表名

name varchar 200 名称

picture longtext 4294967295 图片

type varchar 200 类型(1:收藏,21:赞,22:踩,31:竞拍参与,41:关注) 1

inteltype varchar 200 推荐类型

remark varchar 200 备注

表3-11:服务分类

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

fuwufenlei varchar 200 服务分类

表3-12:园区信息

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

yuanqumingcheng varchar 200 园区名称

fengmian longtext 4294967295 封面

quyu varchar 200 区域

fuzeren varchar 200 负责人

zixundianhua varchar 200 咨询电话

chengrenjiage float 成人价格

ertongjiage float 儿童价格

kaifangshijian varchar 200 开放时间

zhuyishixiang longtext 4294967295 注意事项

yuanquxiangqing longtext 4294967295 园区详情

clicktime datetime 最近点击时间

clicknum int 点击次数 0

表3-13:招商信息

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

yuanqumingcheng varchar 200 园区名称

biaoti varchar 200 标题

tupian longtext 4294967295 图片

fuzeren varchar 200 负责人

zhaoshangdianhua varchar 200 招商电话

zhaoshangduixiang varchar 200 招商对象

zhaoshangjieshao longtext 4294967295 招商介绍

表3-14:园区服务

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

yuanqumingcheng varchar 200 园区名称

fuwuxiangmu varchar 200 服务项目

fuwufenlei varchar 200 服务分类

fuwujiage float 服务价格

fuwufengmian longtext 4294967295 服务封面

renyuanzhanghao varchar 200 人员账号

renyuanxingming varchar 200 人员姓名

lianxifangshi varchar 200 联系方式

faburiqi date 发布日期

fuwujieshao longtext 4294967295 服务介绍

表3-15:保洁人员

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

renyuanzhanghao varchar 200 人员账号

mima varchar 200 密码

renyuanxingming varchar 200 人员姓名

xingbie varchar 200 性别

lianxifangshi varchar 200 联系方式

touxiang longtext 4294967295 头像

表3-16:用户

字段名称 类型 长度 字段说明 主键 默认值

id bigint 主键

主键

addtime timestamp 创建时间 CURRENT_TIMESTAMP

yonghuzhanghao varchar 200 用户账号

mima varchar 200 密码

yonghuxingming varchar 200 用户姓名

xingbie varchar 200 性别

lianxifangshi varchar 200 联系方式

touxiang longtext 4294967295 头像

4 系统实现

本章内容主要是对实现的模块进行说明,因为模块过多,仅对用户、保洁人员和管理员部分模块进行说明,结合图片介绍了模块的实现过程。

5 系统测试

系统测试的好坏直接影响到软件的生存期,一个健全的测试流程可以确保系统的生命期。此章关键详细介绍实际操作条件和检测[15]。

5.1 运行环境

5.1.1软件平台

(1)所用开发工具:Eclipse+MySQL数据库;

(2)服务器系统:Windows 10操作系统;

(3)客户端系统:Windows 10 操作系统。

5.1.2 硬件平台

城市郊野公园管理系统硬件环境需求并不是非常苛刻,服务器端和用户端都不需要太高的配置。目前主流的硬件配置足够满足运行条件。项目的体积不大,所需资源不多,推荐配置为,CPU达到1Ghz,内存达到2GB,磁盘空间达到500G,便可以流畅运行。

5.2 测试过程

5.2.1 界面测试

在开发期间对前台界面主要进行以下几方面的测试:

(1)网页页面的合理布局,及其背景色表明是不是恰当,感观是不是简约美观,是不是符合规定,实际操作是不是便捷;

(2)在不一样电脑浏览器上的展现是不是正常的、美观;

(3)放缩、挪动、更新对话框时表明是不是正常的;

(4)网页页面中的连接部位方式是不是有利于用户搜索和了解。

系统前台经过以上几方面的测试,显示正确,界面简洁美观,未出现问题;用户可以简单上手,测试结果达到了预期效果。

5.2.2 功能测试

程序主要针对以下几点功能测试:

(1)登陆测试:测试输入不正确的手机号和登陆密码,手机号和密码为空,输入恰当的手机号和登陆密码时,是不是能正常的进到系统软件;

(2)注册测试:测试在输入不完善的注册信息内容和注册用户信息时,系统软件能不能得出提醒;用户注册取得成功后能不能取得成功注册;

(3)用户信息改动测试:账号登录后,测试私人信息改动是不是取得成功;

5.3 测试结果分析

功能测试结果如表5-1所示:

表5-1 功能测试表

模块名称 测试用例 预期结果 实际结果 是否通过

登录 账号:123

密码:123 提示:请填写字段 与预期结果相同 通过

登录 账号:18846037785

密码:123 提示:请输入字段 与预期结果相同 通过

登录 账号:18846037785

密码:qq713159 登录成功 与预期结果相同 通过

注册 输入已注册成功用户 提示:账号已被注册,请重新输入 与预期结果相同 通过

个人信息修改 昵称:cc

QQ号:1222222 修改成功 与预期结果相同 通过

5.4 测试小结

该系统已经过严苛检测。通过单元测试、子系统检测和系统测试,系统并没有发生致命错误。网页页面表明正常的,控制模块功能正常的,控制模块内部结构融洽恰当。城市郊野公园管理系统恰当完成了预估功能,做到了预期目标。

总 结

系统选用nodejs语言开发,后台应用express框架,应用MySQL开展数据储存,功能控制模块的开发选用关键技术进行。对于城市郊野公园管理平台分散化、由来广泛的特性,用户管理、保洁人员管理、园区信息管理、服务分类管理、园区服务管理、招商信息管理、停车位信息等功能进行设计和完成。用户做为平台的关键客户,申请注册一个账户就可以在平台上查询信息,简单化了繁琐与复杂的过程。

该系统具备一定的实用性,程序流程开发获得了较好的实际效果,但因为开发时长比较有限,开发周期时间短,系统也有很多的下一步工作要进行,程序流程中有很多相同编码,不有利于日后的维护保养和移殖,必须除掉重复编码;与此同时数据分析表关联系数较为高,耦合性高,很有可能会减少实际操作数据库查询时的运行效率,必须中后期提升。因为时长缘故,这一系统的功能还没有很全方位,编码也必须持续提升。根据之后的改善,期待可以融合到系统中来做大量的功能,拓宽城市郊野公园管理系统的业务范围。

致 谢

本系统是在我的指导老师xx老师悉心指导下立完成的,论文的每次改动都离不开老师认真的指点,她在百忙之中给予了我最大的帮助和支持,无私地付出令我颇为感动。在校期间,导师渊博的知识、严谨的治学作风,宽厚的长者风范给我留下深刻的印象,使我受益终生。在此向我的导师表示衷心的感谢!

同时,还要感谢为我提供相关资料的老师、同学、朋友和有关单位。在此向他们表示诚挚的谢意!

随着毕业设计的完成,我真正了解软件的开发和设计,以前的理论知识巩固的全过程,同时也奠定了良好的基础我在今后的工作中。在这毕业设计制作的最后的这段时光里,我的内心有太多的话语想借此来表达。从开始选题到现在自己设计的平台成型这期间的磨砺,巩固了我在大学期间所学到的知识,并且通过不断的查阅资料来获取解决问题的方法,增强了我实际动手能力且培养了我独立解决问题的能力。当然也会遇到那种即使翻阅资料也无法解决的问题,再通过与老师和同学之间的沟通后也顺利的解决了。通过这次毕业设计锻炼你给我明白了作为一个当代大学生,我们需要的不仅仅是简单的编写代码能力,而是要对整个平台的整体把控与设计能力。我会在将来的工作之余不断进行学习,来对自我进行填充,以更热情的心态来面对明天的各种机遇和挑战。为我最热爱的母校争光,为自己翻开辉煌的新篇章。

最后,再一次感谢所有关心、帮助我的老师,同学和朋友!

相关推荐
向上的车轮8 分钟前
Django学习笔记二:数据库操作详解
数据库·django
985小水博一枚呀16 分钟前
【对于Python爬虫的理解】数据挖掘、信息聚合、价格监控、新闻爬取等,附代码。
爬虫·python·深度学习·数据挖掘
立秋678927 分钟前
Python的defaultdict详解
服务器·windows·python
萧鼎40 分钟前
Python第三方库选择与使用陷阱避免
开发语言·python
lxp1997411 小时前
php函数积累
开发语言·php
白拾1 小时前
使用Conda管理python环境的指南
开发语言·python·conda
是刃小木啦~1 小时前
三维模型点云化工具V1.0使用介绍:将三维模型进行点云化生成
python·软件工程·pyqt·工业软件
总裁余(余登武)1 小时前
算法竞赛(Python)-万变中的不变“随机算法”
开发语言·python·算法
程序员大金2 小时前
基于SpringBoot+Vue+MySQL的装修公司管理系统
vue.js·spring boot·mysql
一个闪现必杀技2 小时前
Python练习2
开发语言·python