<template>
	<div class="container">
		<div class="searchBox" :style="{ height: localHeight + 'px', paddingTop: top + 'px' }">
			<div class="searchBox_add">
				<u-icon bold color="#000" size="40" name="arrow-left" @click="back"></u-icon>
			</div>
		</div>

		<div class="community">
			<div class="community_left">
				<image mode="aspectFill" src="http://192.168.0.172:5500/test.png" alt="" />
			</div>
			<div class="community_right" @click="changeShow">
				<div class="community_right_text">
					<div class="community_right_text1">世纪名城1号楼1单元101室</div>
					<div class="community_right_text2">衡水市上海公馆6A</div>
				</div>
				<div class="community_right_more" >
					<u-icon bold color="#999999" size="30" name="arrow-right" @click="back"></u-icon>
				</div>
			</div>
		</div>

		<div class="tabList">
			<div class="tabItem" :class="active == 0 ? 'active' : ''" @click="changeTab(0)">账单</div>
			<div class="line"></div>
			<div class="tabItem" :class="active == 1 ? 'active' : ''" @click="changeTab(1)">缴费记录</div>
		</div>

		<div class="homeMoney">
			<div class="homeMoney_box">
				<div class="homeMoney_box_left">
					<div class="homeMoney_box_left1">物业公积金</div>
					<div class="homeMoney_box_left2">可抵扣账户金额</div>
				</div>
				<div class="homeMoney_box_right">
					<div class="homeMoney_box_right1"><span>￥</span>9735.00</div>
					<div class="homeMoney_box_right2">
						查看详情
						<div style="margin-left: 12rpx;">
							<u-icon bold color="#894B11" size="30" name="arrow-right" @click="back"></u-icon>
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="payList">
			<div class="payItem" v-for="item in 3">
				<div class="payItem_tit">
					<div class="payItem_left">
						<checkbox value="1"></checkbox>
						<div style="margin-left: 24rpx;">2025年</div>
					</div>
					<div class="payItem_right">
						<span>￥</span>
						4900.00
						<p>未缴</p>

						<div style="margin-left: 40rpx;">
							<u-icon bold color="#894B11" size="30" name="arrow-down" @click="back"></u-icon>
							<u-icon bold color="#894B11" size="30" name="arrow-up" @click="back" v-if="false"></u-icon>
						</div>
					</div>
				</div>
				<div class="payItem_List" v-for="item in 3">
					<checkbox value="1"></checkbox>
					<div class="Item_time">2025年</div>
					<div class="Item_type">车位管理费</div>
					<div class="Item_money">￥4500.00</div>
					<div class="Item_status">未付款</div>
				</div>
			</div>
		</div>

		<div class="bottom">
			<div class="bottom_left">
				<span>合计</span>
				<p>￥</p>
				4900.00
			</div>
			<div class="bottom_right">
				立即支付
			</div>
		</div>

		<div class="boxshadow" v-if="show" @click="changeShow">
			<div class="boxshadowCon">
				<div class="boxshadowCon_Tit">
					选择房源
					<div class="cancel">取消</div>
				</div>
				<div class="lines"></div>
				<div class="communityList">
					<div class="communityItem" v-for="item in 8">
						<div class="communityItem_text">2323世纪名城1号楼1单元101室</div>
						<div class="communityItem_radio">
							<radio></radio>
						</div>
					</div>
				</div>
			</div>
		</div>

	</div>

</template>

<script>
import {
	request,
	picUrl,
	uniqueByField,
	menuButtonInfo,
	NavgateTo
} from '../../../utils';
import {
	apiArr
} from '../../../api/community';


export default {
	data() {
		return {
			top: "",
			localHeight: "",
			active: 0,
			show:false
		}
	},
	onLoad(options) {
		const meun = menuButtonInfo();
		this.top = meun.top;
		// this.top = meun.height + meun.top;
		this.localHeight = meun.height;
	},


	methods: {
		changeTab(index) {
			this.active = index;
		},
		back() {
			uni.navigateBack({
				delta: 1
			});
		},
		changeShow(){
			this.show = !this.show
		},

	},


}
</script>

<style>
@import url("./index.css");
</style>