160 lines
4.0 KiB
Vue
160 lines
4.0 KiB
Vue
<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> |