care.html 6.8 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" />
	<link rel="stylesheet" href="css/weui.css">
	<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/common.js"></script>
	<title>专业护理</title>
</head>
<style type="text/css">
	.cali1 ul li {
		width: 31%;
		overflow: hidden;
	}

	.item_list {
		display: flex;
		flex-wrap: wrap;
	}

	.style_list img {
		width: 0.87rem;
		margin-left: 0.1rem;
		margin-right: 0.1rem;
	}

	.style_list {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		padding: 0.1rem 0;
	}

	.style_item {
		height: 1.5rem;
		display: flex;
		align-items: center;
		width: 3.68rem;
		box-sizing: border-box;
		padding: 0.24rem 0;
		border-bottom: 1px solid #EBEBEB;
		padding-left: 0.16rem;
	}

	.style_item:nth-child(odd) {
		border-right: 1px solid #EBEBEB;
	}

	.catitle {
		line-height: 0.3rem;
		margin-bottom: 0.08rem;
	}

	.cadesc {
		width: 2.3rem;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}

	.cali ul li {
		margin-left: 0.49rem
	}

	.cali ul li:nth-child(4n) {
		margin-left: 0;
	}

	.cali ul li:first-child {
		margin-left: 0;
	}
</style>

<body>
	<div class="header center">
		<div class="left back">
			<a href="#" onClick="javascript:history.back(-1);">
				<img src="images/care_03.jpg" />
			</a>
		</div>
		<div class="headertext">专业护理</div>
		<div class="banner">
			<img src="images/care_06.jpg" />
		</div>
	</div>
	<!--capart1-->
	<div class="capart1">
		<div class="box">
			<P class="parttitle">
				<span class="c1">专业</span>
				<span class="c2">护理</span>
				<span class="c3">| &nbsp;优质上门护理服务推荐</span>
			</P>
			<div class="camg cali1">
				<ul class="center">
					<!-- <li>
						<a href="home.html">
							<img src="images/camg_03.jpg" />
						</a>
					</li> -->
					<!-- <li>
						<a href="home.html">
							<p class="tx">居家照护</p>
							<p>
								<span class="camo">270</span>元起</p>
							<img src="images/camg_03.jpg" />
						</a>
					</li> -->
					<!-- <li>
						<a href="#">
							<p class="tx">住院照护</p>
							<p>
								<span class="camo">300</span>元起</p>
							<img src="images/camg_05.jpg" />
						</a>
					</li>
					<li>
						<a href="#">
							<p class="tx">陪诊</p>
							<p>
								<span class="camo">210</span>元起</p>
							<img src="images/camg_07.jpg" />
						</a>
					</li> -->
				</ul>
			</div>
		</div>
	</div>
	<!--capart2-->
	<div class="capart2">
		<div class="style_list">
			<div class="style_item">
				<img src="images/cali_03.jpg" class="left" />
				<div class="left">
					<P class="catitle">上门打针</P>
					<P class="cadesc">提供皮下及肌肉注射</P>
				</div>
			</div>
			<!-- <div class="style_item">
				<img src="images/cali_09.jpg" class="left" />
				<div class="left">
					<P class="catitle">上门打针</P>
					<P class="cadesc">提供皮下及肌肉注射</P>
				</div>
			</div>
			<div class="style_item">
				<img src="images/cali_05.jpg" class="left" />
				<div class="left">
					<P class="catitle">上门打针</P>
					<P class="cadesc">提供皮下及肌肉注射</P>
				</div>
			</div>
			<div class="style_item">
				<img src="images/cali_03.jpg" class="left" />
				<div class="left">
					<P class="catitle">上门打针</P>
					<P class="cadesc">提供皮下及肌肉注射</P>
				</div>
			</div>
			<div class="style_item">
				<img src="images/cali_09.jpg" class="left" />
				<div class="left">
					<P class="catitle">上门打针</P>
					<P class="cadesc">提供皮下及肌肉注射</P>
				</div>
			</div>
			<div class="style_item">
				<img src="images/cali_05.jpg" class="left" />
				<div class="left">
					<P class="catitle">上门打针</P>
					<P class="cadesc">提供皮下及肌肉注射</P>
				</div>
			</div> -->
		</div>

	</div>
	<!--capart3-->
	<div class="capart3">
		<div class="box">
			<P class="parttitle" style="display: flex;align-items: baseline;">
				<span class="c1">相关</span>
				<span class="c2">服务</span>
				<span class="c3">| &nbsp;更多优质服务推介</span>
			</P>
			<div class="camg cali relatedService">
				<ul class="center" style="display: flex;justify-content: flex-start;flex-wrap: wrap;">
					<li>
						<a href="#">
							<img src="images/caserver_03.jpg" />
							<p class="tx">老年痴呆护理</p>
							<p>
								<span class="camo">596</span></p>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/caserver_05.jpg" />
							<p class="tx">癌症护理</p>
							<p>
								<span class="camo">596</span></p>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/caserver_07.jpg" />
							<p class="tx">帕金森护理</p>
							<p>
								<span class="camo">596</span></p>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/caserver_07.jpg" />
							<p class="tx">帕金森护理</p>
							<p>
								<span class="camo">596</span></p>
						</a>
					</li>
				</ul>
			</div>
		</div>
	</div>
	<script src="js/jquery-3.3.1.min.js"></script>
	<script src="js/weui.js"></script>
	<script>
		$(function () {
			let loading = weui.loading("加载中")

			sendAjax('post', 'portal/Goods/getCatInfo', {
				cid: 1
			}, function (res) {
				if (res.code == 1) {
					loading.hide();
					var data = res.data
					console.log(data)
					$(".headertext").html(data.name)
					$(".banner").find("img").attr("src",data.img)
					// 专业护理
					let html = '';
					for(let n in data.introduce){
						html += `<li><a href="home.html"><img src="${data.introduce[n].img}" /></a></li>`	
					}
					$(".cali1 .center").html(html)
					// 相关服务
					let htmlTwo = "";
					for (let n in data.related_service) {
						htmlTwo += `<li><a href="home.html"><img src="${data.related_service[n].img}" /></a></li>`
					}
					$(".relatedService .center").html(htmlTwo)
					// 上门打针列表 专业护理下
					let htmlThree = "";
					for (let n in data.goods) {
						htmlThree += `<div class="style_item"><img src="${data.goods[0].icon}" class="left" /><div class="left"><P class="catitle">"${data.goods[0].post_title}"</P><P class="cadesc">"${data.goods[0].other_title}"</P></div></div>`
					}
					$(".capart2 .style_list").html(htmlThree)
				} else if (res.code == 0) {
					let loading = weui.loading(res.msg)
					setTimeout(function () {
						loading.hide();
					}, 1500);
				}

			});
		})

	</script>
</body>