<template>
	<view>
		<view class="title-back" :style="{height:`${uni.getStorageSync('moveHeight')+40}px`}">
			<view class="left-father" @click="uni.navigateBack();">
				<image class="back-img" src="https://www.focusnu.com/media/directive/index/left.png" />
			</view>
		</view>
		<view :style="{height:`${uni.getStorageSync('moveHeight') + 40}px`}"></view>
		<image  class="bacimg" src="https://www.focusnu.com/media/directive/bgyg.png" mode="aspectFill"></image>
		<view class="xmname">
			<image src="https://www.focusnu.com/media/directive/hts.png" mode="aspectFill" class="bgt"></image>
			<image src="https://www.focusnu.com/media/directive/sj.png" mode="aspectFill" class="ava"></image>
			<view class="name">李富贵</view>
			<view class="xbjs">
				女 &nbsp;&nbsp;|&nbsp; 80岁&nbsp; |&nbsp;  2025.01.01   
			</view>
		</view>
		
		<view class="listacre">
			<view class="top">
				<view class="left">
					<image src="https://www.focusnu.com/media/directive/dybb.png" mode="aspectFill"></image>
					2026.03.01-2026.03.31
				</view>
				<view class="rits">计费</view>
			</view>
			
		</view>
	</view>
</template>

<script setup lang="ts">
	 
</script>

<style lang="scss" scoped>
	.listacre{
		width: 703rpx;
		height: 349rpx;
		background: #FFFFFF;
		border-radius: 40rpx;
		position: relative;
		z-index: 2;
		padding: 33rpx;
		margin: 21rpx auto 0;
		.top{
			width: 100%;
			height: 80rpx;
			position: relative;
			background: yellow;
			justify-content: space-between;
			align-items: center;
			.rits{
				width: 106rpx;
				height: 45rpx;
				background: #EEFBF6;
				border-radius: 10rpx;
				border: 1px solid #D3F0E4;
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: 400;
				font-size: 24rpx;
				color: #01A763;
			}
			.left{
				font-weight: 400;
				font-size: 28rpx;
				color: #333333;
				image{
					width: 30rpx;
					height: 30rpx;
					margin-right: 16rpx;
				}
			}
		}
	}
	.xmname{
		width: 705rpx;
		height: 155rpx;
		margin: 20rpx auto 0;
		position: relative;
		z-index: 2;
		.xbjs{
			position: absolute;
			top: 95rpx;
			left: 143rpx;
			z-index: 2;
			font-weight: 400;
			font-size: 23rpx;
			color: #212327;
			display: flex;
			align-items: center;
		}
		.name{
			font-weight: bold;
			font-size: 36rpx;
			color: #333333;
			position: absolute;
			top: 47rpx;
			left: 143rpx;
			z-index: 2;
		}
		.ava{
			position: absolute;
			width: 95rpx;
			height: 95rpx;
			border-radius: 50%;
			top: 34rpx;
			left: 30rpx;
			z-index: 2;
		}
		.bgt{
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: 1;
		}
	}
.bacimg{
	width: 100%;
	height: 780rpx;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 0;
}
.title-back {
		background : rgba(255, 255, 255,0);
		width: 100%;
		height: 70rpx;
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		padding-bottom: 20rpx;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
	}

	.left-father {
		display: flex;
		align-items: center;
		z-index: 1;

		.back-img {
			width: 45rpx;
			height: 40rpx;
			margin-left: 40rpx;
			margin-right: 15rpx;
		}
	}

</style>
