history.html 7.5 KB
<!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" />
<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
<title>健康史</title>
<style type="text/css">
	.hispart1 ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
    .history_text,.history_text_sub{
        position: relative;
    }
    .history_text:before{
        content: '';
        display: block;
        width: 0.6rem;
        border-bottom:0.025rem solid #d8b25f;
        position: absolute;
        top: 1rem;
        -webkit-transform: translateY(-0.01rem);
        -moz-transform: translateY(-0.01rem);
        -ms-transform: translateY(-0.01rem);
        -o-transform: translateY(-0.01rem);
        transform: translateY(-0.01rem);
        left: 0;
        height: 0.01rem;
    }
    .history_text_sub:before{
        content: '';
        display: block;
        width: 0.6rem;
        border-bottom:0.025rem solid #b0b0af;
        position: absolute;
        top: 1rem;
        -webkit-transform: translateY(-0.01rem);
        -moz-transform: translateY(-0.01rem);
        -ms-transform: translateY(-0.01rem);
        -o-transform: translateY(-0.01rem);
        transform: translateY(-0.01rem);
        left: 0;
        height: 0.01rem;
    }
    .history_pic img {
        margin-top: 0.12rem;
        margin-left: 0.23rem;
        width: 1.85rem;
    }
    .history_item{
        width: 6.5rem;
        min-height: 1.6rem;
        background-color: #fff;
        border-radius: 0.2rem;
        list-style-type: none;
        font-size: 0.3rem;
        line-height: 1.6rem;
    }
    .history_pic_sub img {
        margin-top: 0.12rem;
        margin-left: 0.23rem;
        width: 1.85rem;
    }
</style>
</head>

<body>
<div style="background-color:#fff;">
<div class="perheader center">
	<div class="left hisback"><a href="#" onClick="javascript:history.back(-1);"><img src="images/care_03.jpg"/></a></div>
    <div class="bloodtext">健康史</div>
</div>
</div>

<div class="box">
    	<div class="hispart1">
        <ul class="history_wrap">
        	
            <li>
            <a href="family.html">
                <div class="history_pic"><img src="images/his_03 .jpg"/></div>
                <div class="inblock hist history_text">家族史</div>
                <div class="inblock noperfect">未完善</div>
                <div><img src="images/hislibt_03.jpg" class="hislibt"/></div>
            </a>
            </li>
            
            
            
            <li>
            <a href="#">
                <div class="hist2 left history_text_sub">疾病史</div>
                <div class="left"><img src="images/hisli_07.jpg"/></div>
                <div class="noperfect">已完善</div>
                <div><img src="images/hislibt_06.jpg" class="hislibt"/></div>
            </a>
            </li>
            
            
            
            <li>
            <a href="#">
                <div><img src="images/his_04.jpg"/></div>
                <div class="inblock hist"><span class="hisbory">过敏</span></div>
                <div class="inblock noperfect">未完善</div>
                <div><img src="images/hislibt_03.jpg" class="hislibt"/></div>
            </a>
            </li>
            
            
            
            <li>
            <a href="#">
                <div class="hist2 left"><span class="hisbory2">用药</span></div>
                <div class="left"><img src="images/hisli_13.jpg"/></div>
                <div class="noperfect">已完善</div>
                <div><img src="images/hislibt_06.jpg" class="hislibt"/></div>
            </a>
            </li>
            
            
            
            <li>
            <a href="#">
                <div><img src="images/his_05.jpg"/></div>
                <div class="inblock hist"><span class="hisbory">手术</span></div>
                <div class="inblock noperfect">未完善</div>
                <div><img src="images/hislibt_03.jpg" class="hislibt"/></div>
            </a>
            </li>
            
            
            
            <li>
            <a href="#">
                <div class="hist2 left"><span class="hisbory2">吸烟</span></div>
                <div class="left"><img src="images/his_06.jpg"/></div>
                <div class="noperfect">已完善</div>
                <div><img src="images/hislibt_06.jpg" class="hislibt"/></div>
            </a>
            </li>
            
            
            
            <li>
            <a href="#">
                <div><img src="images/his_07.jpg"/></div>
                <div class="inblock hist"><span class="hisbory">饮酒</span></div>
                <div class="inblock noperfect">未完善</div>
                <div><img src="images/hislibt_03.jpg" class="hislibt"/></div>
            </a>
            </li>
            
        </ul>
        </div>
</div>
<script type="text/javascript" src="js/common.js"/>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $.ajax({
            type:"POST",
            url: baseUrl + "user/index/question",
            dataType:"json",
            data:{
                DeviceType:"1",
                token:"1",
            },
            success:function (res) {
               var data = res.data;
               console.log(data)
               $('.history_wrap').html('')
               for( key in data ){
                   if((key%2)== 1){
                       // console.log(key)
                        $('.history_wrap').append(`<li class="history_item">
                                                    <a href="family.html">
                                                        <div class="history_pic"><img src="${data[key].img}"/></div>
                                                        <div class="inblock hist history_text">${data[key].name}</div>
                                                        <div class="inblock noperfect">未完善</div>
                                                        <div><img src="images/hislibt_03.jpg" class="hislibt"/></div>
                                                    </a>
                                                    </li>`)
                   }else {
                       // console.log(key)

                       $('.history_wrap').append(`<li class="history_item">
                                                        <a href="family.html">
                                                        <div class="hist2 left history_text_sub">${data[key].name}</div>
                                                        <div class="left history_pic_sub"><img src="${data[key].img}"/></div>
                                                        <div class="noperfect">已完善</div>
                                                        <div><img src="images/hislibt_06.jpg" class="hislibt"/></div>
                                                        </a>
                                                    </li>`)
                   }
               }
            }
        })
    })
</script>
</body>