diff --git a/web/html/addPeople.html b/web/html/addPeople.html
index 7379cf7..e31a07e 100644
--- a/web/html/addPeople.html
+++ b/web/html/addPeople.html
@@ -8,6 +8,7 @@
     <link rel="icon" type="image/png" sizes="16x16" href="css/icons/favicon.png">
     <link rel="stylesheet" href="css/addPeople_style.css">
     <script src="js/addPeople.js"></script>
+    <script src="../jquery/dist/jquery.min.js"></script>
 </head>
 <body>
     <div class="box1">
@@ -21,26 +22,26 @@
     <div class="register_1" id="register_1" style="display: block">
         <h3>老人注册</h3>
         <form>
-            <input type="text" placeholder="账号"><br>
-            <input type="password" placeholder="密码"><br>
+            <input type="text" placeholder="账号" id="pAccount"><br>
+            <input type="password" placeholder="密码" id="pPassword"><br>
             <input type="button" value="next" id="next" onclick="changeDiv()">
         </form>
     </div>
     <div class="register_2" id="register_2" style="display: none">
         <h3>老人注册</h3>
-        <form action="firstPage.html">
-            <input type="text" placeholder="姓名"><br>
-            <input type="text" placeholder="身份证号"><br>
-            <div class="gender">
-                <input type="radio" value="mele">
+        <form >
+            <input type="text" placeholder="姓名" id="name"><br>
+            <input type="text" placeholder="身份证号" id="cardId"><br>
+            <div class="gender" id="gender">
+                <input type="radio" name="gender" value="mele">
                 <span>男</span>
-                <input type="radio" value="female">
+                <input type="radio" name="gender" value="female">
                 <span>女</span><br>
             </div>
             <span id="birthday">生日：</span>
             <input type="date" id="date"><br>
-            <input type="text" placeholder="入住房间"><br>
-            <input type="submit" value="OK" id="submit">
+            <input type="text" placeholder="房间号" id="roomId"><br>
+            <input type="button" value="OK" id="submit" onclick="over()">
         </form>
     </div>
 </body>
diff --git a/web/html/css/addPeople_style.css b/web/html/css/addPeople_style.css
index bc31ef3..7c32206 100644
--- a/web/html/css/addPeople_style.css
+++ b/web/html/css/addPeople_style.css
@@ -97,7 +97,7 @@ body {
     width: 220px;
     height: 35px;
     position: relative;
-    top: 10px;
+    top: 40px;
     left: 90px;
     text-align: center;
     border-radius: 25px;
@@ -117,13 +117,13 @@ body {
 .register_2 form .gender span {
     position: relative;
     left: -10px;
-    top: 10px;
+    top: 40px;
     color: gray;
 }
 .register_2 form span#birthday {
     color: gray;
     position: relative;
-    top: 10px;
+    top: 40px;
     left: 110px;
 }
 .register_2 form input#date {
@@ -139,7 +139,7 @@ body {
     background-color: rgb(255, 115, 0);
     color: white;
     position: relative;
-    top: 100px;
+    top: 118px;
     left: 340px;
 }
 .register_2 form input#submit:hover {
diff --git a/web/html/css/deletePeople_style.css b/web/html/css/deletePeople_style.css
index 282f487..38da74e 100644
--- a/web/html/css/deletePeople_style.css
+++ b/web/html/css/deletePeople_style.css
@@ -76,5 +76,4 @@ body {
 }
 .delete form input#submit:active {
     background-color: rgba(255, 115, 0, 0.3);
-    /* js写一个弹出确认框 显示老人名字和身份证号 */
 }
\ No newline at end of file
diff --git a/web/html/css/firstPage_style.css b/web/html/css/firstPage_style.css
index 20c5b77..23d0402 100644
--- a/web/html/css/firstPage_style.css
+++ b/web/html/css/firstPage_style.css
@@ -77,29 +77,30 @@ ul {
 .box2 {
     width: auto;
     height: auto;
-    /* background-color: yellow; */
     margin: 0 0 0 190px;
 }
 .box2 table tr td {
-    padding: 150px 50px 90px 0;
+    padding: 40px 50px 50px 0;
 }
 .box2 table tr td a {
-    color: papayawhip;
-    text-decoration-line: none;
-    font-size: 14px;
-    background-image: url("icons/房间.png");
+    background-image: url("icons/老人2.png");
     background-repeat: no-repeat;
     padding: 100px 90px 20px 100px;
     background-position: 70px 35px;
     background-size: 40%;
     margin: 0 0 0 5px;
-    /* background-color: yellow; */
 }
 .box2 table tr td a:hover {
-    background-image: url("icons/房间light.png");
+    background-image: url("icons/老人2light.png");
 }
 .box2 table tr td.last {
-    padding: 150px 0 90px 0;
+    padding: 40px 0 50px 0;
+}
+.box2 table tr td span {
+    color: rgba(255, 239, 213);
+    font-size: 14px;
+    padding: 0;
+    margin: 0 0 0 90px;
 }
 
 /* 纵向导航栏 */
@@ -115,13 +116,11 @@ ul {
 }
 .guide li#delete {
     margin: 60px 0;
-    /* background-color: yellow; */
 }
 .guide li a {
     text-decoration-line: none;
     color: white;
     padding: 16px 76px 20px 50px;
-    /* background-color: yellow; */
 }
 .guide li a:hover {
     background-color: rgba(248, 148, 66, 0.7);
diff --git a/web/html/css/icons/老人2.png b/web/html/css/icons/老人2.png
new file mode 100644
index 0000000..89eb1c4
Binary files /dev/null and b/web/html/css/icons/老人2.png differ
diff --git a/web/html/css/icons/老人2light.png b/web/html/css/icons/老人2light.png
new file mode 100644
index 0000000..c0039fa
Binary files /dev/null and b/web/html/css/icons/老人2light.png differ
diff --git a/web/html/css/images/哭.png b/web/html/css/images/哭.png
new file mode 100644
index 0000000..0a7bbfb
Binary files /dev/null and b/web/html/css/images/哭.png differ
diff --git a/web/html/css/views_style.css b/web/html/css/views_style.css
index ce785f1..a854913 100644
--- a/web/html/css/views_style.css
+++ b/web/html/css/views_style.css
@@ -81,16 +81,51 @@ ul {
     position: absolute;
     top: 170px;
     left: 140px;
+    text-align: justify;
 }
-.info h2 {
-    padding: 0 0 0 20px;
-    color: rgb(255, 206, 166);
+.info button {
+    width: 50px;
+    height: 30px;
+    border-style: none;
+    border-radius: 2px;
+    color: white;
+    background-color: rgb(255, 183, 124);
+    outline: none;
+    position: absolute;
+    top: 30px;
+    left: 360px;
+}
+.info button:hover {
+    transform: translate(0,-1px);
+    -ms-transform: translate(0,-1px);
+    -webkit-transform: translate(0,-1px);
+    -o-transform: translate(0,-1px);
+    -moz-transform: translate(0,-1px);
+    box-shadow: 3px 3px 3px rgba(139, 139, 139, 0.8);
+}
+.info button:active {
+    background-color: rgba(255, 183, 124, 0.781);
+}
+.info h3 {
+    padding: 0 0 25px 0 ;
+    margin: 0;
 }
 .info span {
     position: relative;
     left: 20px;
-    padding: 10px 0 10px 0;
-    /* background-color: yellow; */
+    padding: 10px 70px 10px 0;
+}
+.info span#idCard {
+    margin-left: -15px; 
+}
+.info span#roomName {
+    margin-left: -15px; 
+}
+.info table {
+    margin-left:13px; 
+}
+.info td {
+    padding: 2px 5px 2px 5px;
 }
 
 /* 房间实况 */
@@ -124,7 +159,7 @@ ul {
     background-color: rgba(255, 255, 255, 0.5);
     position: absolute;
     top: 580px;
-    left: 640px;
+    left: 660px;
 }
 
 /* 心率 */
@@ -137,6 +172,16 @@ ul {
     left: 140px;
 }
 
+/* 血压 */
+.blood {
+    width: 450px;
+    height: 350px;
+    background-color: rgba(255, 255, 255, 0.5);
+    position: absolute;
+    top: 980px;
+    left: 660px;
+}
+
 /* 行动轨迹 */
 .track {
     width: 1150px;
@@ -144,5 +189,14 @@ ul {
     background-color: rgba(255, 255, 255, 0.5);
     position: absolute;
     top: 1380px;
-    left: 40px;
+    left: 55px;
+}
+
+
+/* 无数据替换样式 */
+.noData {
+    background-image: url("images/哭.png");
+    opacity: 0.5;
+    background-size: cover;
+    background-repeat: no-repeat;
 }
\ No newline at end of file
diff --git a/web/html/deletePeople.html b/web/html/deletePeople.html
index 944a912..dacf318 100644
--- a/web/html/deletePeople.html
+++ b/web/html/deletePeople.html
@@ -7,6 +7,8 @@
     <title>Old People Home - 老人注销</title>
     <link rel="icon" type="image/png" sizes="16x16" href="css/icons/favicon.png">
     <link rel="stylesheet" href="css/deletePeople_style.css">
+    <script src="js/deletePeople.js"></script>
+    <script src="../jquery/dist/jquery.min.js"></script>
 </head>
 <body>
     <div class="box1">
@@ -19,9 +21,9 @@
     </div>
     <div class="delete">
         <h2>注销老人</h2>
-        <form action="firstPage.html">
-            <input type="text" placeholder="请输入要注销的老人的ID"><br>
-            <input type="submit" value="OK" id="submit">
+        <form>
+            <input type="text" placeholder="请输入要注销的老人的ID" id="pId"><br>
+            <input type="button" value="OK" id="submit" onclick="deleteData()">
         </form>
     </div>
 </body>
diff --git a/web/html/firstPage.html b/web/html/firstPage.html
index d16ce2c..e975096 100644
--- a/web/html/firstPage.html
+++ b/web/html/firstPage.html
@@ -7,6 +7,9 @@
     <title>Old People Home</title>
     <link rel="icon" type="image/png" sizes="16x16" href="css/icons/favicon.png">
     <link rel="stylesheet" href="css/firstPage_style.css">
+    <script src="../jquery/dist/jquery.min.js"></script>
+    <script src="js/firstPage.js"></script>
+    
 </head>
 <body>
     <div class="box1">
@@ -27,40 +30,40 @@
             </li>
         </ul>
     </div>
-    <!-- js写一个空房间显示 -->
     <div class="box2">
         <table>
             <tr>
-                <td><a href="views.html">001</a></td>
-                <td><a href="#">002</a></td>
-                <td><a href="#">003</a></td>
-                <td class="last"><a href="#">004</a></td>
+                <td><a id="1" style="display: none" onclick="info1()" ></a><span id="s1"></span><div id="div1"></div></td>
+                <td><a id="2" style="display:  none" onclick="info2()"></a><span id="s2"></span><div id="div2"></div></td>
+                <td><a id="3" style="display:  none" onclick="info3()"></a><span id="s3"></span><div id="div3"></div></td>
+                <td class="last"><a id="4" style="display:  none" onclick="info4()"></a><span id="s4"></span><div id="div4"></div></td>
             </tr>
             <tr>
-                <td><a href="#">005</a></td>
-                <td><a href="#">006</a></td>
-                <td><a href="#">007</a></td>
-                <td class="last"><a href="#">008</a></td>
+                <td><a id="5" style="display:  none" onclick="info5()"></a><span id="s5"></span><div id="div5"></div></td>
+                <td><a id="6" style="display:  none" onclick="info6()"></a><span id="s6"></span><div id="div6"></div></td>
+                <td><a id="7" style="display:  none" onclick="info7()"></a><span id="s7"></span><div id="div7"></div></td>
+                <td class="last"><a id="8" style="display:  none" onclick="info8()"></a><span id="s8"></span><div id="div8"></div></td>
             </tr>
             <tr>
-                <td><a href="#">009</a></td>
-                <td><a href="#">010</a></td>
-                <td><a href="#">011</a></td>
-                <td class="last"><a href="#">012</a></td>
+                <td><a id="9" style="display:  none" onclick="info9()"></a><span id="s9"></span><div id="div9"></div></td>
+                <td><a id="10" style="display:  none" onclick="info10()"></a><span id="s10"></span><div id="div10"></div></td>
+                <td><a id="11" style="display:  none" onclick="info11()"></a><span id="s11"></span><div id="div11"></div></td>
+                <td class="last"><a id="12" style="display:  none" onclick="info12()"></a><span id="s12"></span><div id="div12"></div></td>
             </tr>
             <tr>
-                <td><a href="#">013</a></td>
-                <td><a href="#">014</a></td>
-                <td><a href="#">015</a></td>
-                <td class="last"><a href="#">016</a></td>
+                <td><a id="13" style="display:  none" onclick="info13()"></a><span id="s13"></span><div id="div13"></div></td>
+                <td><a id="14" style="display:  none" onclick="info14()"></a><span id="s14"></span><div id="div14"></div></td>
+                <td><a id="15" style="display:  none" onclick="info15()"></a><span id="s15"></span><div id="div15"></div></td>
+                <td class="last"><a id="16" style="display:  none" onclick="info16()"></a><span id="s16"></span><div id="div16"></div></td>
             </tr>
             <tr>
-                <td><a href="#">017</a></td>
-                <td><a href="#">018</a></td>
-                <td><a href="#">019</a></td>
-                <td class="last"><a href="#">020</a></td>
+                <td><a id="17" style="display:  none" onclick="info17()"></a><span id="s17"></span><div id="div17"></div></td>
+                <td><a id="18" style="display:  none" onclick="info18()"></a><span id="s18"></span><div id="div18"></div></td>
+                <td><a id="19" style="display:  none" onclick="info19()"></a><span id="s19"></span><div id="div19"></div></td>
+                <td class="last"><a id="20" style="display:  none" onclick="info20()"></a><span id="s20"></span><div id="div20"></div></td>
             </tr>
         </table>
+        <script src="js/firstPage.js"></script>
     </div>
     <div class="guide">
         <ul>
diff --git a/web/html/js/addPeople.js b/web/html/js/addPeople.js
index 9bb3f30..9664166 100644
--- a/web/html/js/addPeople.js
+++ b/web/html/js/addPeople.js
@@ -1,13 +1,35 @@
 function changeDiv() {
-  register_1 = document.getElementById("register_1")
-  register_2 = document.getElementById("register_2")
-  if(register_1.style.display == "block"&&register_2.style.display == "none"){
-    register_1.style.display = "none"
-    register_2.style.display = "block"
-    console.log(register_1.style.display)
-    }
-    else if(register_1.style.display == "none"&&register_2.style.display == "block") {
-      register_1.style.display = "block"
-      register_2.style.display = "none"
-    }
+        register_1 = document.getElementById("register_1");
+        register_2 = document.getElementById("register_2");
+        if(register_1.style.display == "block"&&register_2.style.display == "none"){
+          register_1.style.display = "none";
+          register_2.style.display = "block";
+          }
+        }
+
+function over(){        
+    $.ajax({
+        type: "POST",
+        url: "http://39.105.65.209:8080/parent/add",
+        data: {
+            parentAccount: $("#pAccount").val(),
+            parentPassword: $('#pPassword').val(),
+            parentName: $('#name').val(),
+            parentLongId: $('#cardId').val(),
+            parentSex: $('input:radio:checked').val(),
+            parentBirth: $('#date').val(),
+            parentRoomId: $('#roomId').val()
+        },
+        success: function(data){
+          alert('桥豆麻袋！')
+          window.location.href="firstPage.html";
+        },
+        error:function(){
+            alert('请求失败，请重试')
+            if(register_1.style.display == "none"&&register_2.style.display == "block"){
+              register_1.style.display = "block";
+              register_2.style.display = "none";
+              }
+        }
+    }); 
 }
\ No newline at end of file
diff --git a/web/html/js/deletePeople.js b/web/html/js/deletePeople.js
new file mode 100644
index 0000000..7b5298e
--- /dev/null
+++ b/web/html/js/deletePeople.js
@@ -0,0 +1,18 @@
+function deleteData(){
+    if(confirm('确定要注销ID为'+$('#pId').val()+'的老人吗？')){
+        $.ajax({
+            url: 'http://39.105.65.209:8080/parent/delete/'+$('#pId').val(),
+            type: 'delete',
+            success: function(data){
+                alert('删除成功');
+                window.location.href="firstPage.html";
+            },
+            error: function(){
+                alert('请求失败，请重试')
+            }
+        })
+    }
+    else{
+
+    }
+}
\ No newline at end of file
diff --git a/web/html/js/firstPage.js b/web/html/js/firstPage.js
new file mode 100644
index 0000000..00accb0
--- /dev/null
+++ b/web/html/js/firstPage.js
@@ -0,0 +1,90 @@
+count = [
+    document.getElementById('1'),
+    document.getElementById('2'),
+    document.getElementById('3'),
+    document.getElementById('4'),
+    document.getElementById('5'),
+    document.getElementById('6'),
+    document.getElementById('7'),
+    document.getElementById('8'),
+    document.getElementById('9'),
+    document.getElementById('10')]
+arrays = [
+    document.getElementById('s1'),
+    document.getElementById('s2'),
+    document.getElementById('s3'),
+    document.getElementById('s4'),
+    document.getElementById('s5'),
+    document.getElementById('s6'),
+    document.getElementById('s7'),
+    document.getElementById('s8'),
+    document.getElementById('s9'),
+    document.getElementById('s10')
+]
+infos = [
+    document.getElementById('div1'),
+    document.getElementById('div2'),
+    document.getElementById('div3'),
+    document.getElementById('div4'),
+    document.getElementById('div5'),
+    document.getElementById('div6'),
+    document.getElementById('div7'),
+    document.getElementById('div8'),
+    document.getElementById('div9'),
+    document.getElementById('div10')
+]
+$.ajax({
+    url:'http://39.105.65.209:8080/parent/list',
+    type:'get',
+    success:function (data) {
+        $.each(data,function(i,n){
+            count[i].style.display = "block";
+            $(arrays[i]).html(n.parentName);
+            $(infos[i]).html(n.parentId).hide();
+        });
+    },
+    error: function(){
+        alert('error')
+    }    
+});
+
+function info1(){
+    location.replace('views.html?parentId='+$('#div1').text());
+    // alert($('#div1').text());
+}
+function info2(){
+    location.replace('views.html?parentId='+$('#div2').text());
+    // alert($('#div2').text());
+}
+function info3(){
+    location.replace('views.html?parentId='+$('#div3').text());
+    // alert($('#div3').text());
+}
+function info4(){
+    location.replace('views.html?parentId='+$('#div4').text());
+    // alert($('#div4').text());
+}
+function info5(){
+    location.replace('views.html?parentId='+$('#div5').text());
+    // alert($('#div5').text());
+}
+function info6(){
+    location.replace('views.html?parentId='+$('#div6').text());
+    // alert($('#div6').text());
+}
+function info7(){
+    location.replace('views.html?parentId='+$('#div7').text());
+    // alert($('#div7').text());
+}
+function info8(){
+    location.replace('views.html?parentId='+$('#div8').text());
+    // alert($('#div8').text());
+}
+function info9(){
+    location.replace('views.html?parentId='+$('#div9').text());
+    // alert($('#div9').text());
+}
+function info10(){
+    location.replace('views.html?parentId='+$('#div10').text());
+    // alert($('#div10').text());
+}
\ No newline at end of file
diff --git a/web/html/js/login.js b/web/html/js/login.js
index 7fbf980..5376578 100644
--- a/web/html/js/login.js
+++ b/web/html/js/login.js
@@ -1,21 +1,23 @@
 function login(){
+    
+    var account1 = $("#account").val()
+    var password2 =  $('#password').val()
+   
     $.ajax({
-        url:'http://39.105.65.209:8080/admin/login',
-        type:'POST',
-        data:[{"account": "root"},{"password": "root"}],
-        success:function (data) {
-            // if(data){
-            //     var jsonArray =typeof data=='string' ?JSON.parse(data):data;
-            // }
-            // console.log(jsonArray);
-            // $.each(jsonArray, function(i, n){
-                
-            //      console.log(jsonArray[i])
-            // });
-           
-            // $('body').html(jsonArray[0]);
-            if(account=='root'&&password=='root')
-            $.open('html/firstPage.html');
+        type: "POST",
+        url: "http://39.105.65.209:8080/admin/login",
+        data: {
+            account: account1,
+            password: password2
+        },
+        success: function(datas){
+             
+            if(datas!=null){
+                window.location.href="html/firstPage.html";
+            }
+        },
+        error:function(){
+            alert('请求失败，请重试')            
         }
-    });
+    }); 
 }
\ No newline at end of file
diff --git a/web/html/js/views.js b/web/html/js/views.js
index 1e09d5a..f35d4c3 100644
--- a/web/html/js/views.js
+++ b/web/html/js/views.js
@@ -1,138 +1,519 @@
-// 步数折线图
-var dom = document.getElementById("walk");
-var myChart = echarts.init(dom);
-var app = {};
-option = null;
-option = {
-    title: {
-        text: '本周步数'
-        },
-        // hover效果
-    tooltip: {
-        trigger: 'axis'
-        },
-    xAxis: {
-        type: 'category',
-        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
-    },
-    yAxis: {
-        type: 'value'
-    },
-    series: [{
-        data: [1820, 2932, 1901, 3934, 3290, 1330, 2320],
-        type: 'line'
-    }]
-};
-;
-if (option && typeof option === "object") {
-    myChart.setOption(option, true);
+// 解析firstPage传过来的参数
+
+                                    //search获得地址中的参数，内容为'?itemId=12'
+var paras = location.search;			
+                                    //match是字符串中符合的字段一个一个取出来，result中的值为['login=xx','table=admin']
+var result = paras.match(/[^\?&]*=[^&]*/g); 	
+                                    //让paras变成没有内容的json对象
+paras = {};					
+for(i in result){
+                                    //split()将一个字符串分解成一个数组,两次遍历result中的值分别为['itemId','xx']
+	var temp = result[i].split('=');	
+	paras[temp[0]] = temp[1];
 }
+                                    //根据参数名"itemId"，获取参数值
+var parentId1 = paras.parentId;     
+console.log(parentId1);
 
-// 睡眠饼状图
-var dom = document.getElementById("sleep");
-var myChart = echarts.init(dom);
-var app = {};
-option = null;
-app.title = '环形图';
 
-option = {
-    title: {
-        text: '睡眠情况'
-    },
-    // hover效果
-    tooltip: {
-        trigger: 'item',
-        formatter: "{a} <br/>{b}: {c} ({d}%)"
-    },
-    legend: {
-        orient: 'vertical',
-        x: 'right',
-        data:['深睡眠','浅睡眠','清醒']
-    },
-    series: [
-        {
-            name:'睡眠情况',
-            type:'pie',
-            radius: ['50%', '70%'],
-            avoidLabelOverlap: false,
-            label: {
-                normal: {
-                    show: false,
-                    position: 'center'
-                },
-                emphasis: {
-                    show: true,
-                    textStyle: {
-                        fontSize: '30',
-                        fontWeight: 'bold'
+setInterval(disp,1);
+function disp(){
+
+    $.ajax({
+        url:'http://39.105.65.209:8080/parent/get/'+parentId1,
+        type:'get',
+        success:function (data) {
+            $("#pName").html(data.parentName)
+            $('#idCard').html(data.parentLongId)
+            $('#roomName').html(data.parentRoom)
+            $('#pGender').html(data.parentSex)
+            $('#pBirth').html(data.parentBirth)
+            $('#pAccount').html(data.parentAccount)
+            $('#pPassword').html(data.parentPassword)
+            $('#pPhone').html(data.parentPhone)
+            $('#pHeight').html(data.parentHeight)
+            $('#pWeight').html(data.parentWeight)
+
+            $.ajax({
+                url: 'http://39.105.65.209:8080/child_parent/parent/'+parentId1,
+                type: 'get',
+                success: function(data2){
+                    $.each(data2,function(i,n){
+                        $('#cName').html(n.childName)
+                        $('#cGender').html(n.childSex)
+                        $('#cPhone').html(n.childPhone)
+                    })
+                    
+                    
+                    // 步数折线图初始化
+                    var walkTime = [];
+                    var walkCount = [];
+                    var cc = 0;
+                    // 睡眠饼状图初始化
+                    var date = new Date(); 
+                    var year = date.getFullYear();
+                    var month = date.getMonth()+1;
+                    var day = date.getDate();
+                    var hour = date.getHours();
+                    var minute = date.getMinutes();
+                    var second = date.getSeconds();
+                    var timetime = hour+':'+minute+':'+second;
+                    if(parseFloat(minute)>10){
+                        var pastMinute = parseFloat(minute)-10;
+                    }else{
+                        var pastMinute = 60-10+parseFloat(minute)
                     }
+                    var pastTime = hour+':'+pastMinute+':'+second;
+                    
+                    // console.log(timetime)
+                    if (month >= 1 && month <= 9) {
+                        month = "0" + month;
+                    }
+                    if (day >= 0 && day <= 9) {
+                        day = "0" + day;
+                    }
+                    var today = year+'-'+month+'-'+day;
+                    var lightSleep = [];
+                    var deepSleep = [];
+                    var awakeSleep = [];
+                    var dd = 0;
+                    // 心率折线图初始化
+                    var heartTime = [];
+                    var heartData = [];
+                    var ee = 0;
+
+                    // 房间实况图初始化
+                    var roomTemp = [];
+                    var roomWet = [];
+                    var roomIn = [];
+                    var roomTime = [];
+                    var ff = 0;
+
+                    // 血压折线图初始化
+                    var bloodTime = [];
+                    var bloodRate1 = [];
+                    var bloodRate2 = [];
+                    var bloodOxy = [];
+                    var gg = 0;
+
+                    // 轨迹图初始化
+                    var inTimex = [];
+                    var inTimey = [];
+                    var hh = 0;
+                    var names = [];
+                    var inTime = [];
+                    
+
+                    
+
+                        // console.log('刷刷刷')
+                        // console.log(heartData)
+                        
+                        // 步数折线图
+                        $.ajax({
+                            url: 'http://39.105.65.209:8080/motion/get/'+parentId1,
+                            type: 'get',
+                            success: function(count){
+                                $.each(count, function(i){
+                                    cc++
+                                    if(cc <= count.length ){
+                                        if (count[i].motionDate == today){
+                                            var dom = document.getElementById("walk");
+                                            var myChart = echarts.init(dom);
+                                            option = null;
+                                            // newData = newData + count[i].motionCount
+                                            walkTime.push(count[i].motionTime)                                      
+                                            walkCount.push(count[i].motionCount)
+                                            option = {
+                                                title: {
+                                                    text: '今日步数'
+                                                    },
+                                                    // hover效果
+                                                tooltip: {
+                                                    trigger: 'axis'
+                                                    },
+                                                xAxis: {
+                                                    type: 'category',
+                                                    data: walkTime
+                                                },
+                                                yAxis: {
+                                                    type: 'value'
+                                                },
+                                                series: {
+                                                    data: walkCount,
+                                                    type: 'line'
+                                                }
+                                            };
+
+                                            // console.log(count[i].motionDate)
+                                            ;
+                                            if (option && typeof option === "object") {
+                                                myChart.setOption(option, true);
+                                            }
+                                        }
+                                       
+                                        
+                                    }
+                                    else {
+                                        return;
+                                    }
+                                    
+                                })
+                                
+                            }
+                            
+                        })
+                        
+
+                        // 睡眠饼状图
+                        $.ajax({
+                            url: 'http://39.105.65.209:8080/sleep/get/'+parentId1,
+                            type: 'get',
+                            success: function(sleep){
+                                $.each(sleep, function(i){
+                                    dd++
+                                    if(dd <= sleep.length){
+                                        // console.log(sleep[i].date)
+                                        if(sleep[i].date == today){
+
+                                            var dom = document.getElementById("sleep");
+                                            var myChart = echarts.init(dom);
+                                            var app = {};
+                                            option = null;
+                                            app.title = '环形图';
+
+
+                                            lightSleep = parseFloat(sleep[i].lightTime) 
+                                            deepSleep = parseFloat(sleep[i].deepTime) 
+                                            awakeSleep = parseFloat(sleep[i].awakeTime) 
+                                            
+
+                                            // console.log(lightSleep)
+                                            // console.log(deepSleep)
+                                            // console.log(awakeSleep)
+                                            // console.log(typeof(lightSleep))
+
+                                            option = {
+                                                title: {
+                                                    text: '睡眠情况'
+                                                },
+                                                // hover效果
+                                                tooltip: {
+                                                    trigger: 'item',
+                                                    formatter: "{a} <br/>{b}: {c} ({d}%)"
+                                                },
+                                                legend: {
+                                                    orient: 'vertical',
+                                                    x: 'right',
+                                                    data:['深睡眠','浅睡眠','清醒']
+                                                },
+                                                series: [
+                                                    {
+                                                        name:'睡眠情况',
+                                                        type:'pie',
+                                                        radius: ['50%', '70%'],
+                                                        avoidLabelOverlap: false,
+                                                        label: {
+                                                            normal: {
+                                                                show: false,
+                                                                position: 'center'
+                                                            },
+                                                            emphasis: {
+                                                                show: true,
+                                                                textStyle: {
+                                                                    fontSize: '30',
+                                                                    fontWeight: 'bold'
+                                                                }
+                                                            }
+                                                        },
+                                                        labelLine: {
+                                                            normal: {
+                                                                show: false
+                                                            }
+                                                        },
+                                                        data: [
+                                                            {value: deepSleep, name: '深睡眠'},
+                                                            {value: lightSleep, name: '浅睡眠'},
+                                                            {value: awakeSleep, name: '清醒'}
+                                                        ]
+                                                    }
+                                                ]
+                                            };
+                                            ;
+                                            if (option && typeof option === "object") {
+                                                myChart.setOption(option, true);
+                                            }
+                                        }
+                                        
+                                    }
+                                })
+                            
+                            }
+                        })
+
+                        // 心率折线图
+                        $.ajax({
+                            url: 'http://39.105.65.209:8080/heartrate/get/'+parentId1,
+                            type: 'get',
+                            success: function(heart){
+                                $.each(heart, function(i){
+                                    ee++
+                                    if(ee <= heart.length){
+                                       s = heart[i].time;
+                                       newS = s.split(" ");
+                                        if(newS[0] == today){
+                                            // console.log('aaaaaaaaaaaaa')
+                                            var dom = document.getElementById("heart");
+                                            var myChart = echarts.init(dom);
+                                            var app = {};
+                                            option = null;
+                                            heartTime.push(newS[1])
+                                            heartData.push(heart[i].rate)
+                                            // console.log(newS[1])
+                                            // console.log(heart[i].rate)
+                                            option = {
+                                                title: {
+                                                    text: '心率折线图'
+                                                    },
+                                                    // hover效果
+                                                tooltip: {
+                                                    trigger: 'axis'
+                                                    },
+                                                xAxis: {
+                                                    type: 'category',
+                                                    data: heartTime
+                                                },
+                                                yAxis: {
+                                                    type: 'value'
+                                                },
+                                                series: [{
+                                                    data: heartData,
+                                                    type: 'line'
+                                                }]
+                                            };
+                                            ;
+                                            if (option && typeof option === "object") {
+                                                myChart.setOption(option, true);
+                                            }
+                                        }
+                                        
+                                    }
+                                    
+                                })
+                              
+                            }
+                        })
+
+
+                        // 房间实时状态折线图
+                        $.ajax({
+                            url: 'http://39.105.65.209:8080/rstate/get/1?start='+today+' '+pastTime+'&end='+today+' '+timetime,
+                            type: 'get',
+                            success: function(roomS){
+                                $.each(roomS, function(i){
+                                    // console.log('aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa')
+
+                                    ff++
+                                    if(ff <= roomS.length){
+                                        str = roomS[i].time;
+                                       newStr = str.split(" ");
+                                    //    console.log(newStr[1])
+                                       if(newStr[0] == today){
+                                            var dom = document.getElementById("roomState");
+                                            var myChart = echarts.init(dom);
+                                            var app = {};
+                                            roomTime.push(newStr[1])
+                                            roomTemp.push(parseFloat(roomS[i].temperature) )
+                                            roomWet.push(parseFloat(roomS[i].humidity) )
+                                            roomIn.push(parseFloat(roomS[i].isin) )
+
+                                            // console.log(newStr[1])
+                                            option = null;
+                                            option = {
+                                                title: {
+                                                    text: '房间实况'
+                                                },
+                                                tooltip: {
+                                                    trigger: 'axis'
+                                                },
+                                                legend: {
+                                                    data:['温度','湿度','是否有人']
+                                                },
+                                                xAxis: {
+                                                    type: 'category',
+                                                    boundaryGap: false,
+                                                    data: roomTime
+                                                },
+                                                yAxis: {
+                                                    type: 'value'
+                                                },
+                                                series: [
+                                                    {
+                                                        name:'温度',
+                                                        type:'line',
+                                                        data: roomTemp
+                                                    },
+                                                    {
+                                                        name:'湿度',
+                                                        type:'line',
+                                                        data: roomWet
+                                                    },
+                                                    {
+                                                        name:'是否有人',
+                                                        type:'line',
+                                                        data: roomIn
+                                                    }
+                                                ]
+                                            };
+                                            ;
+                                            if (option && typeof option === "object") {
+                                                myChart.setOption(option, true);
+                                            }
+                                       }
+                                    }
+                                })
+                            }
+                        })
+                        
+
+                        // 血压折线图
+                        $.ajax({
+                            url: 'http://39.105.65.209:8080/heartrate/get/'+parentId1,
+                            type: 'get',
+                            success: function(bloodData){
+                                $.each(bloodData, function(i){
+                                    gg++
+                                    if(gg <= bloodData.length){
+                                        strb = bloodData[i].time;
+                                       newStrb = strb.split(" ");
+                                    //    console.log(newStr[1])
+                                       if(newStrb[0] == today){
+                                            var dom = document.getElementById("blood");
+                                            var myChart = echarts.init(dom);
+                                            var app = {};
+                                            bloodTime.push(newStrb[1])
+                                            bloodRate1.push(parseFloat(bloodData[i].rate1) )
+                                            bloodRate2.push(parseFloat(bloodData[i].rate2) )
+                                            bloodOxy.push(parseFloat(bloodData[i].oxy) )
+
+                                            // console.log(newStr[1])
+                                            option = null;
+                                            option = {
+                                                title: {
+                                                    text: '今日血压'
+                                                },
+                                                tooltip: {
+                                                    trigger: 'axis'
+                                                },
+                                                legend: {
+                                                    data:['收缩压','舒张压','血液含氧量']
+                                                },
+                                                xAxis: {
+                                                    type: 'category',
+                                                    boundaryGap: false,
+                                                    data: bloodTime
+                                                },
+                                                yAxis: {
+                                                    type: 'value'
+                                                },
+                                                series: [
+                                                    {
+                                                        name:'收缩压',
+                                                        type:'line',
+                                                        data: bloodRate1
+                                                    },
+                                                    {
+                                                        name:'舒张压',
+                                                        type:'line',
+                                                        data: bloodRate2
+                                                    },
+                                                    {
+                                                        name:'血液含氧量',
+                                                        type:'line',
+                                                        data: bloodOxy
+                                                    }
+                                                ]
+                                            };
+                                            ;
+                                            if (option && typeof option === "object") {
+                                                myChart.setOption(option, true);
+                                            }
+                                       }
+                                    }
+                                })
+                            }
+                        })
+                    
+                    
+                        // 轨迹图
+
+                        $.ajax({
+                        url: 'http://39.105.65.209:8080/location/get/'+parentId1,
+                        type: 'get',
+                        success: function(trackData){
+                            $.each(trackData, function(i){
+                                hh++
+                                names = hh
+                                //  console.log(names)
+                                if(hh <= trackData.length){
+                                    
+                                            strt = trackData[i].time;
+                                            newStrt = strt.split(" ");
+                                            if(newStrt[0] == today){
+                                                var map = new BMap.Map("track");          // 创建地图实例  
+                                                var point = new BMap.Point(112.44183, 38.01419);  // 创建点坐标  
+                                                map.centerAndZoom(point, 15);                 // 初始化地图，设置中心点坐标和地图级别  
+
+                                                trackData[i].longitude
+                                                var polyline = new BMap.Polyline([
+                                            new BMap.Point(parseFloat(trackData[i].longitude) , parseFloat( trackData[i].latitude)),
+                                            // new BMap.Point(112.452, 38.014)
+                                            ],
+                                        {strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5}
+                                        );
+                                                var polyline = new BMap.Polyline([
+                                                    new BMap.Point(112.444, 38.0116),
+                                                    new BMap.Point(112.455, 38.0107),
+                                                    new BMap.Point(112.455, 38.0107),
+                                                    new BMap.Point(112.455, 38.0107),
+                                                    new BMap.Point(112.452,38.0128),
+                                                    new BMap.Point(112.444, 38.0116)
+                                                    ],
+                                                    
+                                                    {strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5}
+                                                    );
+                                                map.addOverlay(polyline);
+                                                map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
+                                       
+                                    }
+                                }
+                            })
+                        }
+                    })    
+                            
+                        
+                  
+
+                    
                 }
-            },
-            labelLine: {
-                normal: {
-                    show: false
-                }
-            },
-            data:[
-                {value:5, name:'深睡眠'},
-                {value:3, name:'浅睡眠'},
-                {value:1, name:'清醒'},
-            ]
+            });    
+        },
+        error: function(){
+            alert('遇到错误了啊喂')
         }
-    ]
-};
-;
-if (option && typeof option === "object") {
-    myChart.setOption(option, true);
+    });
 }
 
-// 心率折线图
-var dom = document.getElementById("heart");
-var myChart = echarts.init(dom);
-var app = {};
-option = null;
-option = {
-    title: {
-        text: '心率折线图'
-        },
-        // hover效果
-    tooltip: {
-        trigger: 'axis'
-        },
-    xAxis: {
-        type: 'category',
-        data: ['06:00', '07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00', '24:00', '01:00', '02:00', '03:00', '04:00', '05:00']
-    },
-    yAxis: {
-        type: 'value'
-    },
-    series: [{
-        data: [76, 56, 68, 79, 67, 76, 57, 68, 86, 68, 78, 76, 58, 97, 57, 76, 78, 87, 67, 77, 58, 95, 59, 86],
-        type: 'line'
-    }]
-};
-;
-if (option && typeof option === "object") {
-    myChart.setOption(option, true);
-}
 
-// 行动轨迹
-var map = new BMap.Map("track");          // 创建地图实例  
-var point = new BMap.Point(112.44183, 38.01419);  // 创建点坐标  
-map.centerAndZoom(point, 15);                 // 初始化地图，设置中心点坐标和地图级别  
-map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
-
-var geolocation = new BMap.Geolocation();
-// 开启SDK辅助定位
-geolocation.enableSDKLocation();
-geolocation.getCurrentPosition(function(r){
-	if(this.getStatus() == BMAP_STATUS_SUCCESS){
-		var mk = new BMap.Marker(r.point);
-		map.addOverlay(mk);
-		map.panTo(r.point);
-		alert('您的位置：'+r.point.lng+','+r.point.lat);
-	}
-	else {
-		alert('failed'+this.getStatus());
-	}        
-});
\ No newline at end of file
+// 修改资料卡
+function modify(){
+    // $('<input>').replaceAll("#pNme")
+    // alert('修改修改')
+    // $.ajax({
+    //     url: 'http://39.105.65.209:8080/parent/update/'+parentId1,
+    //     type: 'post',
+    //     data: {
+    //         // parentName: $("#pName").val()
+    //     },
+    // })
+}
\ No newline at end of file
diff --git a/web/html/views.html b/web/html/views.html
index fef668e..a9d25fb 100644
--- a/web/html/views.html
+++ b/web/html/views.html
@@ -7,8 +7,9 @@
     <title>Old People Home - 查看</title>
     <link rel="icon" type="image/png" sizes="16x16" href="css/icons/favicon.png">
     <link rel="stylesheet" href="css/views_style.css">
+    <script src="../jquery/dist/jquery.min.js"></script>
 </head>
-<body>
+<body onload="disp()">
     <div class="box1">
         <span class="upper">O</span>
         <span class="lower">ld</span>
@@ -27,34 +28,40 @@
             </li>
         </ul>
     </div>
-    <div class="info">
-        <h2>老人资料卡</h2>
-        <span>身份证号码</span><br>
-        <span>姓名</span><br>
-        <span>性别</span><br>
-        <span>生日</span><br>
-        <span>账号</span><br>
-        <span>电话</span><br>
-        <span>亲属</span>
+    <div class="info" >
+        <h3>老人资料卡</h3>
+        <!-- <button id="modify" onclick="modify()">修改</button> -->
+        <span>姓名:</span><span class="text" id="pName"></span><br>
+        <span>身份证:</span><span class="text" id="idCard"></span><br>
+        <span>房间号:</span><span class="text" id="roomName"></span><br>
+        <span>性别:</span><span class="text" id="pGender"></span><br>
+        <span>生日:</span><span class="text" id="pBirth"></span><br>
+        <span>账号:</span><span class="text" id="pAccount"></span><br>
+        <span>密码:</span><span class="text" id="pPassword"></span><br>
+        <span>电话:</span><span class="text" id="pPhone"></span><br>
+        <span>身高:</span><span class="text" id="pHeight"></span><br>
+        <span>体重:</span><span class="text" id="pWeight"></span><br>
+        <span>亲属:</span>
         <table>
             <tr>
-                <td>姓名</td>
-                <td>关系</td>
-                <td>联系电话</td>
+                <td>姓名</td></span>
+                <td>性别</td></span>
+                <td>联系电话</td></span>
+            </tr>
+            <tr>
+                <td id="cName"></td>
+                <td id="cGender"></td>
+                <td id="cPhone"></td>
             </tr>
         </table>
     </div>
-    <div class="room">
-        <h2>房间实况</h2>
-        <span>温度</span><br>
-        <span>湿度</span><br>
-        <span>是否有人</span><br>
-        <span>时间</span>
-    </div>
+    
+    <div class="room" id="roomState"></div>
     <div class="walk" id="walk"></div>
     <div class="sleep" id="sleep"></div>
     <div class="heart" id="heart"></div>
     <div class="track" id="track"></div>
+    <div class="blood" id="blood"></div>
     <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
     <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
     <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
diff --git a/web/login.html b/web/login.html
index ca56467..7772b20 100644
--- a/web/login.html
+++ b/web/login.html
@@ -16,10 +16,10 @@
         <div>
             <p id="title_1">管理员登录</p>
             <div>
-                <form id="name" >
-                    <input type="text" name="account" placeholder="用户名" autofocus required="required"><br><br><br>
-                    <input type="password" name="password" placeholder="密码" required="required"><br><br><br>
-                    <input type="submit" id="submit" value="OK" onclick="login()">
+                <form id="name" method="POST">
+                    <input id="account" type="text" name="account" placeholder="用户名" autofocus required="required"><br><br><br>
+                    <input id="password" type="password" name="password" placeholder="密码" required="required"><br><br><br>
+                    <input type="button" id="submit" value="OK" onclick="login()">
                 </form>
             </div>
         </div>

001	002	003	004
005	006	007	008
009	010	011	012
013	014	015	016
017	018	019	020