正文:
目录
1 弁言 1
1.1 假制宗旨 1
1.2 词汇表 1
1.3 参考文献 1
2 产品概述 1
3 体系构造设想 2
3.1 系统概述 2
3.2 体系构造模型 4
4 数据库设想 6
5 界面本型取人机交互设想 16
6 WEB机能劣化 28
减少HTTP乞求 28
压缩CSS、JS文件 28
运用压缩组件 28
SQL语句劣化 28
运用Redis大概Memcached缓存 28
1弁言
1.1假制宗旨
原文档具体完成对“知康”——个人安康Web使用的体系构造设想和模块的具体设想,抵达辅导后续软件结构的宗旨,同时真现和测试人员及用户的沟通。
原文档面向开发人员、测试人员及最末用户而编写,是理解系统的导航。
1.2词汇表
词汇含意 词汇称呼 备注
Healther 知康 使用称呼
1.3参考文献
《知康——个人安康Web使用 需求规格注明书》
2产品概述
“知康”是一款关注个人安康的Web2.0使用,它联结了当下风止的互联网社交元素,加上副原的常规活动安康名目,以此来关注个人安康。“知康”次要蕴含以下几多个模块:活动健身和个人安康数据支罗和数据统计阐明;流动、冤家圈、趣味组等社交止为;锻练和医生供给安康倡议;等等。
参取者 用例
个人用户 安康打点
流动打点
倡议打点(查察)
统计阐明
冤家圈
趣味组
音讯打点
个人信息打点
锻练(正在个人用户根原上) 倡议打点(颁发)
音讯打点
医生(正在个人用户根原上) 倡议打点(颁发)
音讯打点
系统打点员 用户打点
权限打点
流动打点
倡议打点(打点)
冤家圈(打点)
趣味组(打点)
音讯打点
系统打点
3体系构造设想
3.1系统概述
“知康”是一款关注个人安康的WEB使用,分为阅读器端(前端)和效劳器端(后端)两个局部。原文转载自?id=16771前端运用Html、CSS、JavaScript语言编写,给取Bootstrap前端框架,并且运用Ajax技术。后端运用PHP语言编写,给取Laravel 5.1框架,此中数据库方面运用SQLite 3。
Laravel开发框架:
Laravel是一款给取MVC架构的PHP使用开发框架,Laravel的使用目录构造如表3-1-1所示。
知康是一款对于个人安康的Web使用。
应付用户,罪能有:安康打点、流动打点、倡议打点、个人信息设置。
应付医生和锻练,除了用户的罪能外,另有:倡议打点。
应付系统打点员,罪能有:用户打点。
注:课程名目文档中的根柢罪能都已完成,格外的罪能如音讯打点、冤家圈、趣味组、个人主页等,由于光阳干系未能完成,仅仅是静态页面。
Web使用陈列:
首先,使用运用的框架是Laravel 5.1,须要的系统环境如下:
PHP>=5.5.9,须要开启OpenSSL PHP 扩展 - PDO PHP 扩展 - Mbstring PHP 扩展 - Tokenizer PHP 扩展
假如只是简略的运止,则须要配置PHP环境变质,正在名目目录下打开号令止,输入php artisan serve,之后会见:8000便可。
假如要运止正在消费环境下,如运用apache环境,则须要把名目放到相应目录下。
注:数据库一初步曾经存储了一些默许数据。
安康打点:
分为活动、身体安康和睡眠三个模块,每个模块都展示相应的数据以及图表统计分。
另有一个模拟可衣着方法的页面,通过那个页面可以向数据库添加数据。
流动打点:
用户可以查察所有流动、我建议的流动、我参取的流动以及流动的详情,可以报名流动大概撤消报名,也可以建议新流动、编辑流动和增除已有的流动。
倡议打点:
应付用户来说,可以查察原人向专家的提问和专家的倡议,也可以创立新的提问、编辑提问、增除提问。
应付专家来说,可以查察所有的提问、原人回覆过的提问以及提问的内容和倡议,也可以回复倡议、编辑倡议和增除倡议。同时还可以批质导入XML大概Excel文件的倡议。
用户打点:
应付系统打点员来说,可以查察系统中所有用户的信息,以及可以添加新用户、增除用户、编辑用户角色。
个人信息设置:
可以对原人的根柢信息停行设置、批改头像和批改暗码。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta hp-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>首页 - 知康</title>
<link rel="stylesheet" href="assets/css/bootstrap.css">
<link rel="stylesheet" href="assets/css/font-awesome.css">
<link rel="stylesheet" href="assets/css/style.css">
<script src="assets/js/jquery-1.11.3.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/jquery.scrollUp.min.js"></script>
<script src="assets/js/script.js"></script>
</head>
<body>
<div class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a href="welcome.html" class="navbar-brand">知康</a>
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="navbar-main">
<ul class="nav navbar-nav">
<li class="active"><a href="index.html">首页</a></li>
<li><a href="health.html">安康</a></li>
<li><a href="activity.html">流动</a></li>
<li><a href="advice.html">倡议</a></li>
<li><a href="moment.html">冤家圈</a></li>
<li><a href="group.html">趣味组</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="message.html" title="您有四条新的通知">
<i class="fa fa-envelope-o"></i>
<span class="label label-warning">4</span>
</a>
</li>
<li class="dropdown nav-user">
<a href="#" style="padding: 10px" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
<img src="assets/img/user.jpg" class="img-circle" style="width: 30px">
</a>
<ul class="dropdown-menu" role="menu">
<li><a href="user_home.html">我的主页</a></li>
<li><a href="setting.html">个人设置</a></li>
<li class="divider"></li>
<li><a href="#">协助核心</a></li>
<li><a href="#">倡议应声</a></li>
<li class="divider"></li>
<li><a href="login.html">登出</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-md-3">
<div class="panel user-panel">
<div class="panel-body">
<div class="col-xs-offset-1 col-xs-10">
<img src="assets/img/user.jpg" class="img-responsive img-rounded" >
</div>
<div class="col-xs-offset-1 col-xs-6">
<b>Vboar</b><br/>
王振聪
</div>
<div class="col-xs-5">
<div class="pull-right">
<small>
<a href="user_home.html">个人主页</a><br/>
<a href="setting.html">个人设置</a>
</small>
</div>
</div>
</div>
</div>
<div class="panel rank-panel">
<div class="panel-heading">
<h5 class="inline-title">当日活动排止榜</h5>
<div class="pull-right">
<a href="rank.html" class="small">查察更多榜单</a>
</div>
</div>
<div class="panel-body user-rank panel-top-border">
<div class="row">
<div class="col-xs-2 rank-number">
<i class="h2">1</i>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_1.png" class="img-responsive img-border">
</a>
</div>
<div class="col-xs-6">
<div class="progress progress-striped active" style="width: 100%">
<div class="progress-bar" style="width: 100%"></div>
</div>
250 大卡
</div>
</div>
</div>
<div class="panel-body user-rank panel-top-border">
<div class="row">
<div class="col-xs-2 rank-number">
<i class="h2">2</i>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小洪">
<img src="assets/img/group_2.jpg" class="img-responsive img-border">
</a>
</div>
<div class="col-xs-6">
<div class="progress progress-striped active" style="width: 80%">
<div class="progress-bar" style="width: 100%"></div>
</div>
200 大卡
</div>
</div>
</div>
<div class="panel-body user-rank panel-top-border">
<div class="row">
<div class="col-xs-2 rank-number">
<i class="h2">3</i>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小皂">
<img src="assets/img/group_3.jpg" class="img-responsive img-border">
</a>
</div>
<div class="col-xs-6">
<div class="progress progress-striped active" style="width: 70%">
<div class="progress-bar" style="width: 100%"></div>
</div>
180 大卡
</div>
</div>
</div>
</div>
<div class="panel moments-panel">
<div class="panel-heading">
<h5 class="inline-title">冤家圈动态</h5>
<div class="pull-right">
<a href="moment.html" class="small">前往冤家圈</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="row">
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_1.png" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<a href="moment.html" class="small">原日跑了十多圈,实是累死了原宝宝了……</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="row">
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_1.png" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<a href="moment.html" class="small">原日跑了十多圈,实是累死了原宝宝了……</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="row">
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_1.png" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<a href="moment.html" class="small">原日跑了十多圈,实是累死了原宝宝了……</a>
</div>
</div>
</div>
<div class="panel friends-panel">
<div class="panel-heading panel-heading-up">
<h5 class="inline-title">我的摰友</h5>
<div class="pull-right">
<a href="friend.html" class="small">查察所有摰友</a>
</div>
</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_1.png" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小洪">
<img src="assets/img/group_2.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小皂">
<img src="assets/img/group_3.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_4.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_5.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_6.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_4.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_5.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
<div class="col-xs-4">
<a href="user_home.html" title="小明">
<img src="assets/img/group_6.jpg" class="img-responsive img-border img-margin-bottom">
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel health-panel">
<div class="panel-heading panel-heading-up">
<h5 class="inline-title">昨天安康数据</h5>
<div class="pull-right">
<a href="health.html" class="small">更大都据</a>
</div>
</div>
<div class="panel-body">
<ul class="nav nav-tabs">
<li class="active"><a href="#sports" data-toggle="tab" aria-expanded="true">活动</a></li>
<li class=""><a href="#health" data-toggle="tab" aria-expanded="false">身体安康</a></li>
<li class=""><a href="#sleep" data-toggle="tab" aria-expanded="false">睡眠</a></li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade active in" id="sports">
<div class="sub-content">
<p>您原日一共活动 <i class="big-number">125</i> 分钟,焚烧热质 <i class="big-number">125</i> 大卡。继续勤勉哦~</p>
<li class="small">跑步:
活动时长 <i class="small-number">125</i> 分钟,
活动距离 <i class="small-number">10</i> 公里,
焚烧热质 <i class="small-number">125</i> 大卡
</li>
<li class="small">步碾儿:
活动时长 <i class="small-number">0</i> 分钟,
活动距离 <i class="small-number">0</i> 公里,
焚烧热质 <i class="small-number">0</i> 大卡
</li>
<li class="small">健身:
活动时长 <i class="small-number">0</i> 分钟,
活动距离 <i class="small-number">0</i> 公里,
焚烧热质 <i class="small-number">0</i> 大卡
</li>
<li class="small">游泳:
活动时长 <i class="small-number">0</i> 分钟,
活动距离 <i class="small-number">0</i> 公里,
焚烧热质 <i class="small-number">0</i> 大卡
</li>
<li class="small">骑止:
活动时长 <i class="small-number">0</i> 分钟,
活动距离 <i class="small-number">0</i> 公里,
焚烧热质 <i class="small-number">0</i> 大卡
</li>
<div class="pull-right">
<a href="health.html" class="btn btn-primary btn-sm btn-detail">查察具体数据</a>
</div>
</div>
</div>
<div class="tab-pane fade" id="health">
<div class="sub-content">
<p>您最近的一次身体测质数据如下:</p>
<table class="table table-striped table-hover small">
<tbody>
<tr>
<td>身高</td>
<td>170 cm</td>
</tr>
<tr>
<td>体重</td>
<td>56 kg</td>
</tr>
<tr>
<td>脂肪率</td>
<td>12.5%</td>
</tr>
<tr>
<td>脂肪率</td>
<td>12.5%</td>
</tr>
<tr>
<td>肌肉率</td>
<td>50.8%</td>
</tr>
<tr>
<td>内净脂肪</td>
<td>1</td>
</tr>
<tr>
<td>根原代谢率</td>
<td>66.7%</td>
</tr>
<tr>
<td>水分率</td>
<td>70.9%</td>
</tr>
<tr>
<td>蛋皂量</td>
<td>26.7%</td>
</tr>
<tr>
<td>骨质</td>
<td>
28 kg
<div class="pull-right">
<div class="label label-warning">
留心
</div>
</div>
</td>
</tr>
<tr>
<td>BMI</td>
<td>
20
<div class="pull-right">
<div class="label label-primary">
良好
</div>
</div>
</td>
</tr>
<tr>
<td>心率</td>
<td>80</td>
</tr>
<tr>
<td>血压</td>
<td>125/80</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="tab-pane fade" id="sleep">
<div class="sub-content">
<p style="display: inline">最近一次睡眠情况</p>
<div class="pull-right">
<small class="sleep_time">2015/10/29 晚</small>
</div>
<table class="table table-striped table-hover small" style="margin-top: 10px">
<tbody>
<tr>
<td>睡眠初步</td>
<td>23:59</td>
</tr>
<tr>
<td>睡眠完毕</td>
<td>07:59</td>
</tr>
<tr>
<td>睡眠时长</td>
<td>8小时</td>
</tr>
<tr>
<td>深度睡眠时长</td>
<td>5小时50分</td>
</tr>
<tr>
<td>唤醉次数</td>
<td>0</td>
</tr>
<tr>
<td>睡眠量质评分</td>
<td>80</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="panel advice-panel">
<div class="panel-heading">
<h5 class="inline-title">我的提问</h5>
<div class="pull-right">
<a href="advice_question.html" class="small">更多</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="advice_detail.html">请问各位锻练,我如今很胖,请问怎样减肥啊?</a></div>
<div class="pull-right">
<span class="label label-primary">2 回覆</span>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="advice_detail.html">请问各位锻练,我如今很胖,请问怎样减肥啊?</a></div>
<div class="pull-right">
<span class="label label-primary">2 回覆</span>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="advice_detail.html">请问各位锻练,我如今很胖,请问怎样减肥啊?</a></div>
<div class="pull-right">
<span class="label label-primary">2 回覆</span>
</div>
</div>
</div>
<div class="panel article-panel">
<div class="panel-heading">
<h5 class="inline-title">专家专栏</h5>
<div class="pull-right">
<a href="article.html" class="small">更多</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="article_detail.html">给爱健身的人几多个有用的倡议和能力</a></div>
<div class="pull-right">
<span class="label label-primary">12 评论</span>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="article_detail.html">给爱健身的人几多个有用的倡议和能力</a></div>
<div class="pull-right">
<span class="label label-primary">12 评论</span>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="article_detail.html">给爱健身的人几多个有用的倡议和能力</a></div>
<div class="pull-right">
<span class="label label-primary">12 评论</span>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="article_detail.html">给爱健身的人几多个有用的倡议和能力</a></div>
<div class="pull-right">
<span class="label label-primary">12 评论</span>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="heading inline-title"><a href="article_detail.html">给爱健身的人几多个有用的倡议和能力</a></div>
<div class="pull-right">
<span class="label label-primary">12 评论</span>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="panel activities-panel">
<div class="panel-heading">
<h5 class="inline-title">我的流动</h5>
<div class="pull-right">
<a href="activity.html" class="small">更多流动</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading">[ 骑止小组 ] <a href="activity_home.html">玄武湖百人骑止大赛</a></div>
<div class="small pull-right time" >2015年10月30日上午9点</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading">[ 骑止小组 ] <a href="activity_home.html">玄武湖百人骑止大赛</a></div>
<div class="small pull-right time" >2015年10月30日上午9点</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading">[ 骑止小组 ] <a href="activity_home.html">玄武湖百人骑止大赛</a></div>
<div class="small pull-right time" >2015年10月30日上午9点</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading">[ 骑止小组 ] <a href="activity_home.html">玄武湖百人骑止大赛</a></div>
<div class="small pull-right time" >2015年10月30日上午9点</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading">[ 骑止小组 ] <a href="activity_home.html">玄武湖百人骑止大赛</a></div>
<div class="small pull-right time" >2015年10月30日上午9点</div>
</div>
</div>
<div class="panel posts-panel">
<div class="panel-heading">
<h5 class="inline-title">趣味组热门</h5>
<div class="pull-right">
<a href="group.html" class="small">更多</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading"> <a href="group_post.html">你好世界,接待你来到了骑止小组。</a></div>
<div class="small footer" >
<a href="group_home.html">骑止小组</a>    
来自 • <a href="user_home.html">末焉的末焉</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading"> <a href="group_post.html">你好世界,接待你来到了骑止小组。</a></div>
<div class="small footer" >
<a href="group_home.html">骑止小组</a>    
来自 • <a href="user_home.html">末焉的末焉</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading"> <a href="group_post.html">你好世界,接待你来到了骑止小组。</a></div>
<div class="small footer" >
<a href="group_home.html">骑止小组</a>    
来自 • <a href="user_home.html">末焉的末焉</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading"> <a href="group_post.html">你好世界,接待你来到了骑止小组。</a></div>
<div class="small footer" >
<a href="group_home.html">骑止小组</a>    
来自 • <a href="user_home.html">末焉的末焉</a>
</div>
</div>
<div class="panel-body panel-top-border">
<div class="small heading"> <a href="group_post.html">你好世界,接待你来到了骑止小组。</a></div>
<div class="small footer" >
<a href="group_home.html">骑止小组</a>    
来自 • <a href="user_home.html">末焉的末焉</a>
</div>
</div>
</div>
<div class="panel groups-panel">
<div class="panel-heading panel-heading-up">
<h5 class="inline-title">我的趣味组</h5>
<div class="pull-right">
<a href="group_my.html" class="small">查察更多</a>
</div>
</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_1.png" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_2.jpg" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_3.jpg" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_4.jpg" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_5.jpg" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_6.jpg" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_7.png" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_1.png" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
<div class="col-xs-4">
<a href="group_home.html"><img src="assets/img/group_2.jpg" class="img-responsive img-border img-margin-bottom" title="骑止小组"></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<footer class="navbar-fixed-bottom">
<div class="container">
<p>Copyright © 2015 知康 南京大学软件学院 Vboar </p>
</div>
</footer>
<style>
.user-panel img {
border-radius: 6px;
margin-bottom: 10px;
}
.user-rank .rank-number {
padding: 10px;
}
.activities-panel .time, .posts-panel .footer {
margin-top: 5px;
margin-bottom: -5px;
color: #a0a0a0;
}
.health-panel .sub-content {
padding: 10px 0px 0px 10px;
}
.health-panel .sub-content .big-number {
font-size: 25px;
color: #ff6a46;
font-weight: bold;
}
.health-panel .sub-content .small-number {
font-size: 18px;
color: #ff6a46;
}
.advice-panel .label, .article-panel .label {
}
.moments-panel .panel-body {
margin-bottom: -15px;
}
.health-panel .sleep_time {
color: #a0a0a0;
}
</style>
</body>
</html>