技术栈

支持以下技术栈
小程序端运行软件 微信开发者工具/hbuiderx
uni-app框架：使用Vue.js开发跨平台应用的前端框架，编写一套代码，可编译到Android、小程序等平台。
前端开发框架:vue.js
数据库 mysql 版本不限
后端语言框架支持：
1 java(SSM/springboot)-idea/eclipse
2.Nodejs+Vue.js -vscode
3.python(flask/django)–pycharm/vscode
4.php(thinkphp/laravel)-hbuilderx
数据库工具：Navicat/SQLyog等都可以

uniapp系统设计

1. 了解uni-app的特点
   2.掌握uni-app运行环境和开发环境的部署
   3.了解整个uni-app项目的开发流程
2. 熟悉uni-app的页面开发
   5.掌握uni-app的组件库和样式设计
   6.实现页面布局和样式设计
   7.数据处理和绑定
   8.网络请求和数据交互
   9.状态管理和全局数据
   10.导航和路由控制
   11.本地存储和缓存
   12.第三方插件和扩展
   13.多平台适配和界面优化
   14.多平台打包发布

具体实现截图

前端

微信开发工具主要是根据系统层提供的框架来进行开发，由于小程序并非在浏览器中运行的，因此在 web 中禁用了 Document、Window 之类的方法。 微信开发者工具与 HTML5 开发工具有相似之处，但在预览模式方面存在一定差异，该工具属于微信本身，故能够有效的实现同步本地文件、开发小程序以及调试等一系列流程。除此之外，该工具开发了一些标签语言和样式语言。在微信小程序用的开发过程中， 进一步的提供了原生АРР的组件，使得开发者的工作更为便捷

后端

后端：使用微信小程序原生技术栈 JavaScript 简称 JS，是计算机编程语言，常用于控制整个页面的逻辑，是基于 web 页面开发并且具有安全性的脚本语言，该语言的类型是动态且灵活的，仅仅需要浏览器 功能支持即可运转，故跨平台性和适用性都很高。JSON：全称 JavaScript Object Notation，可用于存储数据，配置系统全局或单页面。WXML：全称 WeiXin Markup Language，是微信小程序框架设计语言，用于展示 UI（User Interface 用户界面）模板；WXSS：全称基于JavaScript 的垃圾分类系统的设计与实现 4 WeiXin Style Sheets，用于规定 UI 样式，具有CSS（Cascading Style Sheets 层叠样式表） 的大部分特性，在其基础上扩展了尺寸单位和样式导入功能。WXS：全称 WeiXin Script， 封装后的 JS 一般内嵌于 WXML 页面，方便构建页面。

java类核心代码部分展示

@RestController
@RequestMapping("/yuangong")
public class YuangongController {
    @Autowired
    private YuangongService yuangongService;
	@Autowired
	private TokenService tokenService;
	
	/**
	 * 登录
	 */
	@IgnoreAuth
	@RequestMapping(value = "/login")
	public R login(String username, String password, String captcha, HttpServletRequest request) {
		YuangongEntity user = yuangongService.selectOne(new EntityWrapper<YuangongEntity>().eq("yuangonggonghao", username));
		if(user==null || !user.getMima().equals(password)) {
			return R.error("账号或密码不正确");
		}
		
		String token = tokenService.generateToken(user.getId(), username,"yuangong",  "员工" );
		return R.ok().put("token", token);
	}
	
	/**
     * 注册
     */
	@IgnoreAuth
    @RequestMapping("/register")
    public R register(@RequestBody YuangongEntity yuangong){
    	//ValidatorUtils.validateEntity(yuangong);
    	YuangongEntity user = yuangongService.selectOne(new EntityWrapper<YuangongEntity>().eq("yuangonggonghao", yuangong.getYuangonggonghao()));
		if(user!=null) {
			return R.error("注册用户已存在");
		}
		Long uId = new Date().getTime();
		yuangong.setId(uId);
        yuangongService.insert(yuangong);
        return R.ok();
    }

	/**
	 * 退出
	 */
	@RequestMapping("/logout")
	public R logout(HttpServletRequest request) {
		request.getSession().invalidate();
		return R.ok("退出成功");
	}
	
	/**
     * 获取用户的session用户信息
     */
    @RequestMapping("/session")
    public R getCurrUser(HttpServletRequest request){
    	Long id = (Long)request.getSession().getAttribute("userId");
        YuangongEntity user = yuangongService.selectById(id);
        return R.ok().put("data", user);
    }
        /**
     * 密码重置
     */
    @IgnoreAuth
	@RequestMapping(value = "/resetPass")
    public R resetPass(String username, HttpServletRequest request){
    	YuangongEntity user = yuangongService.selectOne(new EntityWrapper<YuangongEntity>().eq("yuangonggonghao", username));
    	if(user==null) {
    		return R.error("账号不存在");
    	}
        user.setMima("123456");
        yuangongService.updateById(user);
        return R.ok("密码已重置为：123456");
    }

可行性论证

程序调试主要有三大功能区：模拟器、调试工具和小程序操作区
微信开发者工作是微信官方提供的针对微信小程序的开发工具，集中了开发，调试，预览，上传等功能。微信团队发布了微信小程序开发者工具、微信小程序开发文档和微信小程序设计指南，全新的开发者工具，集成了开发调试、代码编辑及程序发布等功能，帮助开发者简单和高效地开发微信小程序。启动工具时，开发者需要使用已在后台绑定成功的微信号扫描二维码登录，后续所有的操作都会基于这个微信的帐号。

技术可行性

本系统客户端基于“uniapp”框架开发，采用WXML、WXSS、JS以及微信提供的丰富的客户端API组件，来实现客户端界面和功能。服务端依靠微信小程序云开发技术，根据微信提供的丰富的服务端API接口完成前后端数据的交互。实现客户端和服务端数据的请求和数据处理等关键部分。前端使用微信开发者工具设计wxml，对应小程序的基本组件和页面，通过微信官方的控件属性或者自设属性填充wxss，然后根据业务流程确定各页面逻辑js。数据库使用mysql，开发者数据库管理工具使用Navicat for MySQL同时也给我提供了一次实际模拟锻炼的机会，使我在设计一套完整的软件系统的步骤、方法、及思路上有了一个全新的认识和体会，能够使我更深入的了解软件设计和开发，整合自己以前所学的知识。。
。

系统测试

系统测试主要是为了避免用户在使用时发生问题，增强用户体验感，为了不影响用户的使用，我们需要从多角度、多思路去考虑系统可能遇到的问题，通过不同的模拟场景来发现缺陷并解决问题。在测试的过程中也可以了解到该系统的质量情况，系统功能是否健全，系统逻辑是否顺畅。一个合格的系统测试过程完成后将大大提升系统质量和使用感。测试的目标是验证系统是否符合需求规格说明书的定义，并找出与需求规格说明书不符合或与之冲突的内容。测试过程中一定站在用户的角度考虑问题，避免一些不切实际的场景，浪费测试时间，从而可能会引起问题导致预期结果与实际结果不符。

实现思路

pages 主要页面， 其中pages文件夹中 index文件中可布局底部的tab页面，通过v-if判断显示不同的tab页
colorui 使用了color-ui样式，个人认为样式非常好看，非常感谢！
static目录： 存放静态文件
App.vue： 页面入口文件
main.js: 项目入口文件
manifest.json: 存放App信息
pages.json: 页面信息
uni.scss: 全局样式
（1）通过查阅相关的书籍搜集材料，进行需求调查。
（2）写需求分析文档，确定系统的主要模块。
（3）画出ER图，流程图等图示以用来明确模块之间的关系
（4）根据需求分析，建立数据库文档，设计表和字段。
（5）进行系统的界面设计。
（6）通过python+java+node.js+php语言和MySQL数据库实现本系统。
图书馆，导师的咨询以及论文网站文献的查阅，网络的查找等。通过相关技术论坛咨询。其中用到的技术为业界比较认可的互联网技术，可以提供更多的技术支持。

系统实现

系统实现阶段包括前台界面的UI设计和后台功能模块代码设计。要求系统界面简洁直观、系统操作流畅，后台代码采用三层架构（界面表示层、业务逻辑层、数据访问层）编写。
系统测试阶段包括界面测试和功能测试。使用系统，验证系统界面是否简洁，页面不同功能的衔接是否灵活，正确。根据实际流程，在设计的系统上进行模拟测试，查看功能是都基本满足工作的需要。从而进一步修改完善系统，提高系统的实用性和稳定性

源码获取

文章最下方名片联系我即可~
✌💗大家点赞、收藏、关注、评论啦 、查看✌💗
👇🏻获取联系方式👇🏻