|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
|
<head>
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
|
<link rel="stylesheet" type="text/css" href="css/base.css" />
|
|
|
<link rel="stylesheet" type="text/css" href="css/style.css" />
|
|
|
<link rel="stylesheet" type="text/css" href="css/progress.css" />
|
|
|
<link rel="stylesheet" type="text/css" href="css/font-awesome.css"/>
|
|
|
<link rel="stylesheet" type="text/css" href="css/modern-accordion.css">
|
|
|
<link rel="stylesheet" type="text/css" href="css/health.css">
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
|
|
<link rel="stylesheet" type="text/css" href="css/base.css"/>
|
|
|
<link rel="stylesheet" type="text/css" href="css/style.css"/>
|
|
|
<link rel="stylesheet" type="text/css" href="css/progress.css"/>
|
|
|
<link rel="stylesheet" type="text/css" href="css/font-awesome.css"/>
|
|
|
<link rel="stylesheet" type="text/css" href="css/modern-accordion.css">
|
|
|
<link rel="stylesheet" type="text/css" href="css/health.css">
|
|
|
<script type="text/javascript" src="js/base.js"></script>
|
|
|
<script src="js/modern-accordion.js"></script>
|
|
|
<style>
|
|
|
<script src="js/modern-accordion.js"></script>
|
|
|
<style>
|
|
|
.rotate {
|
|
|
|
|
|
@-webkit-keyframes load {
|
|
|
transform-origin: center center;
|
|
|
/ / 旋转中心要是正中间 才行 transform: rotate(90 deg);
|
|
|
|
|
|
-webkit-transform: rotate(90deg);
|
|
|
|
|
|
-moz-transform: rotate(90deg);
|
|
|
|
|
|
-ms-transform: rotate(90deg);
|
|
|
|
|
|
-o-transform: rotate(90deg);
|
|
|
|
|
|
transition: transform 0.2s;
|
|
|
/ / 过度时间 可调 -moz-transition: -moz-transform 0.2 s;
|
|
|
|
|
|
-moz-transition: -moz-transform 0.2s;
|
|
|
|
|
|
-o-transition: -o-transform 0.2s;
|
|
|
|
|
|
-ms-transition: -ms-transform 0.2s;
|
|
|
|
|
|
}
|
|
|
|
|
|
.rotate1 {
|
|
|
|
|
|
transform-origin: center center;
|
|
|
|
|
|
transform: rotate(0deg);
|
|
|
/ / 返回原点 -webkit-transform: rotate(0 deg);
|
|
|
|
|
|
-moz-transform: rotate(deg);
|
|
|
|
|
|
-ms-transform: rotate(0deg);
|
|
|
|
|
|
-o-transform: rotate(0deg);
|
|
|
|
|
|
transition: transform 0.2s;
|
|
|
|
|
|
-moz-transition: -moz-transform 0.2s;
|
|
|
|
|
|
-moz-transition: -moz-transform 0.2s;
|
|
|
|
|
|
-o-transition: -o-transform 0.2s;
|
|
|
|
|
|
-ms-transition: -ms-transform 0.2s;
|
|
|
|
|
|
}
|
|
|
|
|
|
@-webkit-keyframes load {
|
|
|
0% {
|
|
|
stroke-dashoffset: 0;
|
|
|
}
|
|
|
}
|
|
|
@keyframes load {
|
|
|
}
|
|
|
|
|
|
@keyframes load {
|
|
|
0% {
|
|
|
stroke-dashoffset: 0;
|
|
|
}
|
|
|
}
|
|
|
.mdn-accordion .accordion-title::before{
|
|
|
}
|
|
|
|
|
|
.mdn-accordion .accordion-title::before {
|
|
|
display: none;
|
|
|
}
|
|
|
.accordion-title {
|
|
|
}
|
|
|
|
|
|
.accordion-title {
|
|
|
width: 7.5rem;
|
|
|
}
|
|
|
.progress {
|
|
|
}
|
|
|
|
|
|
.progress {
|
|
|
position: relative;
|
|
|
display: inline-block;
|
|
|
padding: 0;
|
|
|
text-align: center;
|
|
|
left: -1.1rem;
|
|
|
top: 0.25rem;
|
|
|
}
|
|
|
.progress > li {
|
|
|
top: 0.25rem;
|
|
|
}
|
|
|
|
|
|
.progress > li {
|
|
|
display: inline-block;
|
|
|
position: relative;
|
|
|
text-align: center;
|
...
|
...
|
@@ -45,15 +99,17 @@ top: 0.25rem; |
|
|
font-family: Lato;
|
|
|
font-weight: 100;
|
|
|
|
|
|
}
|
|
|
.progress > li:before {
|
|
|
}
|
|
|
|
|
|
.progress > li:before {
|
|
|
content: attr(data-name);
|
|
|
position: absolute;
|
|
|
width: 100%;
|
|
|
bottom: -2rem;
|
|
|
font-weight: 400;
|
|
|
}
|
|
|
.progress > li:after {
|
|
|
}
|
|
|
|
|
|
.progress > li:after {
|
|
|
content: attr(data-percent);
|
|
|
position: absolute;
|
|
|
width: 100%;
|
...
|
...
|
@@ -61,19 +117,22 @@ top: 0.25rem; |
|
|
left: 0;
|
|
|
font-size: 2rem;
|
|
|
text-align: center;
|
|
|
}
|
|
|
.progress svg {
|
|
|
}
|
|
|
|
|
|
.progress svg {
|
|
|
width: 2.5rem;
|
|
|
height: 3.1rem;
|
|
|
}
|
|
|
.progress svg:nth-child(2) {
|
|
|
height: 3.1rem;
|
|
|
}
|
|
|
|
|
|
.progress svg:nth-child(2) {
|
|
|
position: absolute;
|
|
|
left: 0;
|
|
|
top: 0;
|
|
|
-webkit-transform: rotate(-90deg);
|
|
|
transform: rotate(-90deg);
|
|
|
}
|
|
|
.progress svg:nth-child(2) path {
|
|
|
}
|
|
|
|
|
|
.progress svg:nth-child(2) path {
|
|
|
fill: none;
|
|
|
stroke-width: 13;
|
|
|
stroke-dasharray: 629;
|
...
|
...
|
@@ -81,16 +140,19 @@ height: 3.1rem; |
|
|
opacity: .9;
|
|
|
-webkit-animation: load 10s;
|
|
|
animation: load 10s;
|
|
|
}
|
|
|
#target{
|
|
|
width:0.58rem
|
|
|
}
|
|
|
.mdn-accordion .accordion-title, .mdn-accordion a{
|
|
|
|
|
|
#target {
|
|
|
width: 0.58rem
|
|
|
}
|
|
|
|
|
|
.mdn-accordion .accordion-title, .mdn-accordion a {
|
|
|
padding: 0;
|
|
|
display: block;
|
|
|
width: 7.5rem;
|
|
|
}
|
|
|
.mdn-accordion .accordion-title::before{
|
|
|
|
|
|
.mdn-accordion .accordion-title::before {
|
|
|
top: 50%;
|
|
|
transform: translateY(-0.13rem);
|
|
|
right: 0.15rem;
|
...
|
...
|
@@ -98,7 +160,8 @@ height: 3.1rem; |
|
|
height: 0.26rem;
|
|
|
transform: translateY(-0.13rem);
|
|
|
}
|
|
|
.textleft{
|
|
|
|
|
|
.textleft {
|
|
|
height: 0.66rem;
|
|
|
position: relative;
|
|
|
line-height: 0.3rem;
|
...
|
...
|
@@ -108,57 +171,58 @@ height: 3.1rem; |
|
|
width: 7.5rem;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
.textright{
|
|
|
|
|
|
.textright {
|
|
|
display: inline-block;
|
|
|
height: 0.3rem;
|
|
|
position: absolute;
|
|
|
}
|
|
|
</style>
|
|
|
</style>
|
|
|
|
|
|
|
|
|
<title>健康档案</title>
|
|
|
<title>健康档案</title>
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
|
|
|
<svg width="0" height="0">
|
|
|
<defs>
|
|
|
<lineargradient id="cl1" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="1">
|
|
|
<defs>
|
|
|
<lineargradient id="cl1" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="1">
|
|
|
<stop stop-color="#618099"></stop>
|
|
|
<stop offset="100%" stop-color="#8e6677"></stop>
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl2" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="0" y2="1">
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl2" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="0" y2="1">
|
|
|
<stop stop-color="#8e6677"></stop>
|
|
|
<stop offset="100%" stop-color="#9b5e67"></stop>
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl3" gradientUnits="objectBoundingBox" x1="1" y1="0" x2="0" y2="1">
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl3" gradientUnits="objectBoundingBox" x1="1" y1="0" x2="0" y2="1">
|
|
|
<stop stop-color="#9b5e67"></stop>
|
|
|
<stop offset="100%" stop-color="#9c787a"></stop>
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl4" gradientUnits="objectBoundingBox" x1="1" y1="1" x2="0" y2="0">
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl4" gradientUnits="objectBoundingBox" x1="1" y1="1" x2="0" y2="0">
|
|
|
<stop stop-color="#9c787a"></stop>
|
|
|
<stop offset="100%" stop-color="#817a94"></stop>
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl5" gradientUnits="objectBoundingBox" x1="0" y1="1" x2="0" y2="0">
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl5" gradientUnits="objectBoundingBox" x1="0" y1="1" x2="0" y2="0">
|
|
|
<stop stop-color="#817a94"></stop>
|
|
|
<stop offset="100%" stop-color="#498a98"></stop>
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl6" gradientUnits="objectBoundingBox" x1="0" y1="1" x2="1" y2="0">
|
|
|
</lineargradient>
|
|
|
<lineargradient id="cl6" gradientUnits="objectBoundingBox" x1="0" y1="1" x2="1" y2="0">
|
|
|
<stop stop-color="#498a98"></stop>
|
|
|
<stop offset="100%" stop-color="#618099"></stop>
|
|
|
</lineargradient>
|
|
|
</defs>
|
|
|
</lineargradient>
|
|
|
</defs>
|
|
|
</svg>
|
|
|
<div class="heheader center">
|
|
|
<div class="left back"><a href="#" onClick="javascript:history.back(-1);"><img src="images/hetop_03.jpg"/></a></div>
|
|
|
<div class="shetitle">健康档案</div>
|
|
|
<div class="right heshare">
|
|
|
<div class="c-dropdown js-dropdown">
|
|
|
<span class="c-button c-button--dropdown "><img src="images/her_03.jpg" id ="target"/></span>
|
|
|
<span class="c-button c-button--dropdown "><img src="images/her_03.jpg" id="target"/></span>
|
|
|
<ul class="c-dropdown__list">
|
|
|
<li class="c-dropdown__item" data-dropdown-value="angular"><a href="#">完善健康档案</a></li>
|
|
|
<li class="c-dropdown__item" data-dropdown-value="backbone"><a href="#">添加亲友档案</a></li>
|
|
|
<li class="c-dropdown__item" data-dropdown-value="ember"><a href="亲友健康档案.html">查看亲友档案</a></li>
|
|
|
<li class="c-dropdown__item qinyou" data-dropdown-value="ember"><a href="亲友健康档案.html.html">查看亲友档案</a></li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
</div>
|
...
|
...
|
@@ -173,7 +237,7 @@ height: 3.1rem; |
|
|
<p id="integrity">资料完整度63%</p>
|
|
|
</div>
|
|
|
<!-- Container -->
|
|
|
<ul class="progress">
|
|
|
<ul class="progress">
|
|
|
<li>
|
|
|
<svg viewBox="-10 -10 220 220">
|
|
|
<g fill="none" stroke-width="12" transform="translate(100,100)">
|
...
|
...
|
@@ -186,11 +250,12 @@ height: 3.1rem; |
|
|
</g>
|
|
|
</svg>
|
|
|
<svg viewBox="-10 -10 220 220">
|
|
|
<path d="M200,100 C200,44.771525 155.228475,0 100,0 C44.771525,0 0,44.771525 0,100 C0,155.228475 44.771525,200 100,200 C155.228475,200 200,155.228475 200,100 Z" stroke-dashoffset="415"></path>
|
|
|
<path d="M200,100 C200,44.771525 155.228475,0 100,0 C44.771525,0 0,44.771525 0,100 C0,155.228475 44.771525,200 100,200 C155.228475,200 200,155.228475 200,100 Z"
|
|
|
stroke-dashoffset="415"></path>
|
|
|
</svg>
|
|
|
</li>
|
|
|
</ul>
|
|
|
<!-- Defining Angle Gradient Colors -->
|
|
|
</ul>
|
|
|
<!-- Defining Angle Gradient Colors -->
|
|
|
<!--<div class="progress-radial progress-63">
|
|
|
<b>
|
|
|
<div class="data">
|
...
|
...
|
@@ -201,15 +266,18 @@ height: 3.1rem; |
|
|
</b>
|
|
|
</div>-->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="capart1">
|
|
|
<div class="perfect">
|
|
|
<ul>
|
|
|
<li><a href="peridata.html"><img src="images/heli_03.png"/>个人资料<span class="right"><span id="info">未完善</span> <img src="images/hego.png"/></span></a></li>
|
|
|
<li><a href="history.html"><img src="images/heli_06.png"/>健康史<span class="right"><span id="history">未完善</span> <img src="images/hego.png"/></span></a></li>
|
|
|
<li><a href="data.html"><img src="images/heli_08.png"/>健康数据<span class="right"><span id="h_data">未完善</span> <img src="images/hego.png"/></span></a></li>
|
|
|
<li><a href="peridata.html"><img src="images/heli_03.png"/>个人资料<span class="right"><span
|
|
|
id="info">未完善</span> <img src="images/hego.png"/></span></a></li>
|
|
|
<li><a href="history.html"><img src="images/heli_06.png"/>健康史<span class="right"><span
|
|
|
id="history">未完善</span> <img src="images/hego.png"/></span></a></li>
|
|
|
<li><a href="data.html"><img src="images/heli_08.png"/>健康数据<span class="right"><span id="h_data">未完善</span> <img
|
|
|
src="images/hego.png"/></span></a></li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
|
...
|
...
|
@@ -218,14 +286,17 @@ height: 3.1rem; |
|
|
<input class="accordion-toggle" type="checkbox" name="accordion-panel-1" id="accordion-panel-1">
|
|
|
<label class="accordion-title shu" for="accordion-panel-1">
|
|
|
|
|
|
<div class="textleft hefe" style="width: 7.5rem;padding: 0 0.12rem 0 0.35rem;"><div>
|
|
|
<div class="textleft hefe" style="width: 7.5rem;padding: 0 0.12rem 0 0.35rem;">
|
|
|
<div>
|
|
|
<img src="images/he_03.jpg"/>全生命周期健康记录
|
|
|
</div>
|
|
|
<div><span class="right"><span id="life_record">3分报告</span> <img src="images/hego.png"/></span></div>
|
|
|
<div><span class="right"><span id="life_record">3分报告</span> <img src="images/hego.png"
|
|
|
class="hego_active"/></span></div>
|
|
|
</div>
|
|
|
</label>
|
|
|
<ul>
|
|
|
<li><div class="time">2016-07-18<span class="yuan"><img src="images/yuan_03.png"/></span></div>
|
|
|
<li>
|
|
|
<div class="time">2016-07-18<span class="yuan"><img src="images/yuan_03.png"/></span></div>
|
|
|
<div class="hecontent right">
|
|
|
<div class="triangle-left"></div>
|
|
|
<div class="recordti">[ 病历 ]</div>
|
...
|
...
|
@@ -233,7 +304,8 @@ height: 3.1rem; |
|
|
</div>
|
|
|
</li>
|
|
|
|
|
|
<li><div class="time">2016-07-18<span class="yuan"><img src="images/yuan_03.png"/></span></div>
|
|
|
<li>
|
|
|
<div class="time">2016-07-18<span class="yuan"><img src="images/yuan_03.png"/></span></div>
|
|
|
<div class="hecontent right">
|
|
|
<div class="triangle-left"></div>
|
|
|
<div class="recordti">[ 护理报告 ] 老年健康定期巡护</div>
|
...
|
...
|
@@ -241,7 +313,8 @@ height: 3.1rem; |
|
|
</div>
|
|
|
</li>
|
|
|
|
|
|
<li><div class="time">2016-07-18<span class="yuan"><img src="images/yuan_03.png"/></span></div>
|
|
|
<li>
|
|
|
<div class="time">2016-07-18<span class="yuan"><img src="images/yuan_03.png"/></span></div>
|
|
|
<div class="hecontent right">
|
|
|
<div class="triangle-left"></div>
|
|
|
<div class="recordti">[体检报告 ] 三高疾病基因风险评估</div>
|
...
|
...
|
@@ -260,35 +333,56 @@ height: 3.1rem; |
|
|
<script type="text/javascript">
|
|
|
$(document).ready(function () {
|
|
|
record()
|
|
|
|
|
|
})
|
|
|
$('.textleft').click(function () {
|
|
|
if ($('.hego_active').hasClass("rotate")) { //点击箭头旋转180度
|
|
|
|
|
|
$('.hego_active').removeClass("rotate");
|
|
|
|
|
|
$('.hego_active').addClass("rotate1");
|
|
|
|
|
|
} else {
|
|
|
|
|
|
$('.hego_active').removeClass("rotate1"); //再次点击箭头回来
|
|
|
|
|
|
$('.hego_active').addClass("rotate");
|
|
|
|
|
|
}
|
|
|
})
|
|
|
//跳页
|
|
|
$('.qinyou').click(function () {
|
|
|
window.location.href='qinyou.html';
|
|
|
})
|
|
|
|
|
|
function record() {
|
|
|
$.ajax({
|
|
|
type:"POST",
|
|
|
url: baseUrl+"user/index/record",
|
|
|
dataType:"json",
|
|
|
data:{
|
|
|
DeviceType:"1",
|
|
|
token:"1",
|
|
|
type: "POST",
|
|
|
url: baseUrl + "user/index/record",
|
|
|
dataType: "json",
|
|
|
headers: {
|
|
|
"XX-Device-Type": "1",
|
|
|
"XX-Token": "1",
|
|
|
},
|
|
|
success:function (res) {
|
|
|
success: function (res) {
|
|
|
console.log(res)
|
|
|
var data = res.data
|
|
|
if (data.personal == 1){
|
|
|
if (data.personal == 1) {
|
|
|
$('#info').html('已完善')
|
|
|
} else {
|
|
|
$('#info').html('未完善')
|
|
|
}
|
|
|
if (data.history == 1){
|
|
|
if (data.history == 1) {
|
|
|
$('#history').html('已完善')
|
|
|
} else {
|
|
|
$('#history').html('未完善')
|
|
|
}
|
|
|
if (data.h_data == 1){
|
|
|
if (data.h_data == 1) {
|
|
|
$('#h_data').html('已完善')
|
|
|
} else {
|
|
|
$('#h_data').html('未完善')
|
|
|
}
|
|
|
$('#life_record').html(data.life_record+'分报告')
|
|
|
$('#life_record').html(data.life_record + '分报告')
|
|
|
}
|
|
|
})
|
|
|
}
|
...
|
...
|
|