文章使用技术Spring Boot+MyBatisPlus+MySQL+Redis+Layui
流浪猫狗救助协会，成立于2008年，是一个致力于流浪猫狗救助、领养、文明宣传的非盈利性社会团体我们自成立以来，遵照市农业局、民政局的指导思想，在遵守宪法、法律、法规和国家政策的前提下，尊重生命、保护动物、维护动物的生存权利，保障它们的健康与福利，减少杀戮、虐待、残害、遗弃动物的行为，并通过教育引导正确科学对待伴侣动物的观念，达到人与动物和谐共处的愿景。
网页实现截图：
前端
网站首页 ：
关于我们：
领养中心：
领养流程：
活动分享：
团队展示：
后台（管理员界面）：
人员管理：
活动管理：
主要源码结构：
主代码结构
主要源码展示：
index.html
<!DOCTYPEhtml><htmllang="en"xmlns:th="http://www.thymeleaf.org"><head><title>Home</title><!--MetatagKeywords--><metaname="viewport"content="width=device-width,initial-scale=1"><metacharset="UTF-8"/><metaname="keywords"content=""/><!--//MetatagKeywords--><!--cssfiles--><linkrel="stylesheet"th:href="@{/bootstrap/css/bootstrap.min.css}"type="text/css"media="all"><!--Bootstrap-Core-CSS--><linkrel="stylesheet"th:href="@{/css/font-awesome.css}"type="text/css"media="all"><!--Font-Awesome-Icons-CSS--><linkrel="stylesheet"th:href="@{/css/owl.carousel.css}"type="text/css"media="all"/><!--Owl-Carousel-CSS--><linkrel="stylesheet"th:href="@{/css/style.css}"type="text/css"media="all"/><!--layui--><linkth:href="@{/admin/assets/layui/css/layui.css}"rel="stylesheet"type="text/css"media="all"/><!--Style-CSS--><!--//cssfiles--><!--webfonts--><linkhref="http://fonts.googleapis.com/css?family=Molle:400i&subset=latin-ext"rel="stylesheet"><linkhref="http://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,400i,700,700i,900,900i&subset=latin-ext"rel="stylesheet"><linkhref="http://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=latin-ext"rel="stylesheet"><scriptth:inline="javascript">varcontext=/*[[@{/}]]*/'';varctxPath=[[${#httpServletRequest.getContextPath()}]];//varctx='[[@{/}]]';functionchangeCode(){$("#checkCodeImg").attr({"src":ctxPath+"/user/getCode?w="+Math.random()})}</script></head><script>functionuserLogin(){varusername=$("#new_loginName").val();varpassword=$("#new_loginPwd").val();varcode=$("#login_code").val();$.post("/user/login?username="+username+"&password="+password+"&code="+code,function(data){if(data=="success"){location.href="/index";}elseif(data=="error"){alert("账户或密码错误，请重试!");$("#new_loginName").val("");$("#new_loginPwd").val("");$("#login_code").val("");}elseif(data=="codeError"){alert("验证码错误，请重新输入！");$("#login_code").val("");}else{alert("网络问题，请稍后重试！");$("#new_loginName").val("");$("#new_loginPwd").val("");$("#login_code").val("");}})}</script><body><divclass="layui-layoutlayui-layout-admin"><!--顶部topbar--><divth:replace="html/topbar::topbar"></div><!--首页轮播图--><divclass="w3l-main"id="home1"><divclass="container"><!--header--><divclass="header"><divclass="logo"><h1><ath:href="@{index}"><imgclass="logo-imgcenter-block"th:src="@{../images/logo.png}"alt=""/>流浪猫狗救助</a></h1></div><divclass="clearfix"></div></div><!--//header--></div><!--Slider--><divclass="slider"><divclass="callbacks_container"><ulclass="rslides"id="slider"><li><divclass="slider-img-w3layoutsone"><divclass="w3l-overlay"><divclass="container"><divclass="banner-text-info"><h3>我们随时<span>欢迎</span>你们来<span>咨询</span>！</h3><p>全面的猫狗护理指南，让您的流浪猫狗感受到您的爱</p></div></div></div></div></li><li><divclass="slider-img-w3layoutstwo"><divclass="w3l-overlay"><divclass="container"><divclass="banner-text-info"><h3>你可以展示你的<span>爱</span>向你<span>的流浪猫狗</span>!</h3><p>全面的猫狗护理指南，让您的流浪猫狗感受到您的爱</p></div></div></div></div></li><li><divclass="slider-img-w3layoutsthree"><divclass="w3l-overlay"><divclass="container"><divclass="banner-text-info"><h3>猫狗是你的<span>朋友</span>！ 猫狗是你的<span>家人</span>!</h3><p>全面的猫狗护理指南，让您的流浪猫狗感受到您的爱</p></div></div></div></div></li><li><divclass="slider-img-w3layoutsfour"><divclass="w3l-overlay"><divclass="container"><divclass="banner-text-info"><h3>猫狗如此<span>可爱</span>你们怎么可能<span>不爱</span>它们!</h3><p>全面的猫狗护理指南，让您的流浪猫狗感受到您的爱</p></div></div></div></div></li></ul></div><divclass="clearfix"></div></div><!--//Slider--></div><!--底部footer--><sectionth:replace="html/footer::footer"></section><!--个人资料--><formid="window"class="layui-form"th:action="@{/user/findPersonInfo}"th:object="${session.user}"style="margin:5%;display:none;"method="post"><divclass="layui-form-item"><labelclass="layui-form-label">用户名</label><divclass="layui-input-block"><inputtype="text"name="username"th:value="*{username}"requiredreadonlylay-verify="required"placeholder="冷潇"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">姓名</label><divclass="layui-input-block"><inputtype="text"name="realname"th:value="*{realname}"requiredlay-verify="required"placeholder="冷潇"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">性别</label><divclass="layui-input-block"><inputtype="radio"name="sex"th:checked="*{sex=='1'}?true:false"value="1"title="男"><inputtype="radio"name="sex"th:checked="*{sex=='0'}?true:false"value="0"title="女"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">年龄</label><divclass="layui-input-block"><inputtype="text"name="age"th:value="*{age}"requiredlay-verify="required"placeholder="23"autocomplete="off"class="layui-input"></div><!--<divclass="layui-form-midlayui-word-aux">辅助文字</div>--></div><divclass="layui-form-item"><labelclass="layui-form-label">电话号码</label><divclass="layui-input-block"><inputtype="text"name="telephone"th:value="*{telephone}"requiredlay-verify="required"placeholder="15997855562"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">领养动物</label><!--<labelclass="layui-form-label">是否领养</label>--><divclass="layui-input-block"><spanth:text="${session.pname}">无</span></div></div><divclass="layui-form-item"><labelclass="layui-form-label">邮箱</label><divclass="layui-input-block"><inputtype="text"name="email"th:value="*{email}"requiredlay-verify="required"placeholder="123@qq.com"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">地址</label><divclass="layui-input-block"><inputtype="text"name="address"th:value="*{address}"requiredlay-verify="required"placeholder="河南郑州"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><divclass="layui-input-block"><buttonclass="layui-btn"lay-submitlay-filter="formDemo">立即提交</button> <buttontype="reset"class="layui-btnlayui-btn-primary">重置</button></div></div><inputtype="hidden"name="id"th:value="*{id}"><inputtype="hidden"name="navId"th:value="index"><divclass="layui-form-item"><pstyle="color:red">[[${error}]]</p></div></form><!--修改密码--><formid="modifyPwd"class="layui-form"th:action="@{/user/modifyPwd}"th:object="${session.user}"style="margin:5%;display:none;"method="post"><divclass="layui-form-item"><labelclass="layui-form-label">用户名</label><divclass="layui-input-block"><inputtype="text"name="username"th:value="*{username}"requiredreadonlylay-verify="required"placeholder="冷潇"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">新密码</label><divclass="layui-input-block"><inputtype="text"id="pwd1"name="password"requiredlay-verify="required|pass"placeholder="请输入新密码"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><labelclass="layui-form-label">确认密码</label><divclass="layui-input-block"><inputtype="text"id="pwd2"name="password1"requiredlay-verify="required|pwd"placeholder="请确认新密码"autocomplete="off"class="layui-input"></div></div><divclass="layui-form-item"><divclass="layui-input-block"><buttonclass="layui-btn"lay-submitlay-filter="formDemo">立即提交</button> <buttontype="reset"class="layui-btnlayui-btn-primary">重置</button></div></div><inputtype="hidden"name="id"th:value="*{id}"><inputtype="hidden"name="navId"th:value="index"><divclass="layui-form-item"><pstyle="color:red">[[${error}]]</p></div></form></div><!--js非得用2.0版本得jQuery--><scriptth:src="@{/js/jquery-2.2.3.min.js}"></script><scriptth:src="@{/bootstrap/js/bootstrap.min.js}"></script><!--Necessary-JavaScript-File-For-Bootstrap--><!--layui--><scriptth:src="@{/admin/assets/layui/layui.all.js}"></script><scriptth:src="@{/admin/assets/layui/layui.js}"></script><scriptth:src="@{/admin/assets/layui/lay/modules/layer.js}"></script><!--//js--><!--BannerSlider--><scriptth:src="@{/js/responsiveslides.min.js}"></script><script>$(function(){$("#slider").responsiveSlides({auto:true,pager:true,nav:true,speed:1000,namespace:"callbacks",before:function(){$('.events').append("<li>beforeeventfired.</li>");},after:function(){$('.events').append("<li>aftereventfired.</li>");}});});</script><!--//BannerSlider--><!--layui弹窗--><scripttype="text/javascript">//个人信息弹窗layui.use(['layer','form'],function(){varlayer=layui.layer;varform=layui.form;var$=layui.$;varid=$("#id").val();varrealname=$("#realname").val();varsex=$("#sex").val();varage=$("#age").val();vartelephone=$("#telephone").val();varstate=$("#state").val();varemail=$("#email").val();varaddress=$("#address").val();$('#info').on('click',function(){//页面层layer.open({type:1//Page层类型,area:["550px","600px"],skin:'layui-layer-molv',closeBtn:1//是否显示关闭按钮,anim:0//动画类型,icon:1//icon,moveType:0//拖拽模式，0或者1,title:['个人信息','font-size:18px']//,btn:['提交','取消'],btnAlign:'c'//按钮居中,shade:0.4//遮罩层透明度,content:$('#window'),//success:function(layero,index){//form.render();//动态渲染//form.verify();//form.on('submit(formDemo)',function(data){//$.ajax({//url:"user/findPersonInfo",////dataType:"json",//返回格式为json//async:true,//data:{id:id,realname:realname,sex:sex,age:age,telephone:telephone,//state:state,email:email,address:address},//参数值//type:"post",//请求方式//success:function(req){////请求成功时处理//console.log(req);//if(req=="success"){//layer.msg('修改成功',{icon:6});////layer.close(index);//关闭弹窗//setTimeout(ChangeTime,10000);//functionChangeTime(){//location.href="/index";//}//}else{//layer.msg('修改失败'+req.msg,{icon:5});//}//},//error:function(){////请求出错处理////console.log("00000")//layer.msg('修改失败',{icon:5});//}//});//});//},//yes:function(index,layero){//////layero.find('.layui-btn').click();//这一句就是点击确认按钮触发form的隐藏提交//}});});//密码====================================//密码校验form.verify({pass:function(value){if(!newRegExp("^[\\S]{6,12}$").test(value)){return'密码必须6到12位，且不能出现空格';}}});$('#Pwd').on('click',function(){//页面层layer.open({type:1//Page层类型,area:["450px","350px"],skin:'layui-layer-molv',closeBtn:1//是否显示关闭按钮,anim:0//动画类型,icon:1//icon,moveType:0//拖拽模式，0或者1,title:['修改密码','font-size:18px'],btnAlign:'c'//按钮居中,shade:0.4//遮罩层透明度,content:$('#modifyPwd'),});});//确认两次密码是否一致form.verify({pwd:function(){varpsw1=$("#pwd1").val();varpsw2=$("#pwd2").val();varmessage='';if(psw1!=psw2){message="两次密码不一致";}//需要注意需要将返回信息写在ajax方法外if(message!=='')returnmessage;}});});</script></body></html>备注：部分作品来自于网络收集、侵权立删