admingit/PropertyApp
1
0
Fork 0
mirror of https://gitee.com/java110/PropertyApp.git synced 2026-02-23 21:36:39 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

完成缴费明细

Browse Source
This commit is contained in:
wuxw 2023-09-10 13:17:18 +08:00
parent dbbae4074b
commit 985a097686
1 changed files with 229 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

376
pages/report/reportPayFeeDetail.vue
View File

@ -1,153 +1,235 @@
<template> <template>
<view> <view>
<view class="q-query flex justify-start flex-wrap"> <view class="q-query flex justify-start flex-wrap">
<view class="q-item"> <view class="q-item">
<input type="text" class="q-input" placeholder="输入房屋号" v-model="roomName"></input> <input type="text" class="q-input" placeholder="输入房屋号" v-model="roomName"></input>
</view> </view>
<view class="q-item"> <view class="q-item">
<input type="text" class="q-input" placeholder="输入开始时间" v-model="startTime" ></input> <view class=" arrow q-input">
</view> <picker mode="date" :value="startTime" class="" start="2020-09-01" end="2050-09-01"
<view class="q-item"> @change="startTimeChange">
<input type="text" class="q-input" placeholder="输入结束时间" v-model="endTime"></input> <view class="picker">
</view> {{startTime||'请选择'}}
<view class="q-item"> </view>
<input type="text" class="q-input" placeholder="费用项" v-model="endTime"></input> </picker>
</view> </view>
<view class="q-item"> </view>
<input type="text" class="q-input" placeholder="支付方式" v-model="endTime"></input> <view class="q-item">
</view> <view class=" arrow q-input">
<view class="q-item-btn"> <picker mode="date" :value="endTime" start="2020-09-01" end="2050-09-01"
<button class="cu-btn line-blue round q-input" @click="_loadFeeDetails">搜索</button> @change="endTimeChange">
</view> <view class="picker">
</view> {{endTime||'请选择'}}
<view class="margin-top flex justify-between padding-lr-sm"> </view>
<view><text>应收:</text><text>{{allReceivableAmount}}</text></view> </picker>
<view><text>实收:</text><text>{{allReceivedAmount}}</text></view> </view>
</view> </view>
<view class="q-item">
<view class="margin-top" v-if="feeDetails.length > 0"> <picker bindchange="PickerChange" :value="feeTypeIndex" :range-key="'name'" :range="feeTypeCds"
<view class="bg-white margin-bottom padding-sm margin-sm radius-sm" v-for="(item,index) in feeDetails" :key="index" > @change="feeTypeChange">
<view class="apply-title flex justify-between"> <view class="picker">
<view> {{feeTypeIndex==-1 ? "请选择" : feeTypeCds[feeTypeIndex].name}}
<text class="text-bold">{{item.objName}}/{{item.ownerName}}</text>
<text class="margin-left-sm">({{item.stateName}})</text>
</view> </view>
<view class="flex justify-start"> </picker>
<!-- <button class="cu-btn round sm line-black margin-left-sm" </view>
@tap="_toApplyDetail(item)">详情</button> --> <view class="q-item">
{{item.createTime}} <picker bindchange="PickerChange" :value="primeRateIndex" :range-key="'name'" :range="primeRates"
@change="primeRateChange">
<view class="picker">
{{primeRateIndex==-1 ? "请选择" : primeRates[primeRateIndex].name}}
</view> </view>
</view> </picker>
<view class="apply-content flex justify-start flex-wrap"> </view>
<view class="item"> <view class="q-item-btn">
<text>费用项:</text> <button class="cu-btn line-blue round q-input" @click="_loadFeeDetails">搜索</button>
<text>{{item.feeTypeCdName}}>{{item.feeName}}</text> </view>
</view> </view>
<view class="item"> <view class="margin-top flex justify-between padding-lr-sm">
<text>支付方式:</text> <view><text>应收:</text><text>{{allReceivableAmount}}</text></view>
<text>{{item.primeRate}}</text> <view><text>实收:</text><text>{{allReceivedAmount}}</text></view>
</view> </view>
<view class="item">
<text>时间段:</text> <view class="margin-top" v-if="feeDetails.length > 0">
<text>{{item.startTime}}~{{item.endTime}}</text> <view class="bg-white margin-bottom padding-sm margin-sm radius-sm" v-for="(item,index) in feeDetails"
</view> :key="index">
<view class="item"> <view class="apply-title flex justify-between">
<text>收银员:</text> <view>
<text>{{item.cashierName}}</text> <text class="text-bold">{{item.objName}}/{{item.ownerName}}</text>
</view> <text class="margin-left-sm">({{item.stateName}})</text>
<view class="item"> </view>
<text>应收金额:</text> <view class="flex justify-start">
<text>{{item.receivableAmount}}</text> <!-- <button class="cu-btn round sm line-black margin-left-sm"
</view> @tap="_toApplyDetail(item)">详情</button> -->
<view class="item"> {{item.createTime}}
<text>实收金额:</text> </view>
<text>{{item.receivedAmount}}</text> </view>
</view> <view class="apply-content flex justify-start flex-wrap">
<view class="item"> <view class="item">
<text>订单:</text> <text>费用项:</text>
<text>{{item.oId}}</text> <text>{{item.feeTypeCdName}}>{{item.feeName}}</text>
</view> </view>
<view class="item">
</view> <text>支付方式:</text>
</view> <text>{{item.primeRate}}</text>
</view> </view>
</view> <view class="item">
</template> <text>时间段:</text>
<text>{{item.startTime}}~{{item.endTime}}</text>
<script> </view>
import {queryPayFeeDetail} from '@/api/fee/feeDetail.js' ; <view class="item">
export default { <text>收银员:</text>
data() { <text>{{item.cashierName}}</text>
return { </view>
feeDetails:[], <view class="item">
roomName:'', <text>应收金额:</text>
startTime:'', <text>{{item.receivableAmount}}</text>
endTime:'', </view>
allReceivableAmount:'', <view class="item">
allReceivedAmount:'', <text>实收金额:</text>
<text>{{item.receivedAmount}}</text>
} </view>
}, <view class="item">
onLoad() { <text>订单:</text>
<text>{{item.oId}}</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import {
queryPayFeeDetail
} from '@/api/fee/feeDetail.js';
import {queryDictInfo} from '@/api/apply/apply.js';
export default {
data() {
return {
feeDetails: [],
roomName: '',
startTime: '',
endTime: '',
allReceivableAmount: '',
allReceivedAmount: '',
feeTypeCds: [],
feeTypeCd:'',
feeTypeIndex:'-1',
primeRates: [],
primeRate:'',
primeRateIndex:'-1'
}
},
onLoad() {
this._loadFeeDetails(); this._loadFeeDetails();
this._loadQuery();
},
methods: { },
methods: {
_loadFeeDetails:function(){
_loadFeeDetails: function() {
let _that = this;
queryPayFeeDetail(this, {
communityId: this.getCommunityId(),
feeTypeCd:this.feeTypeCd,
primeRate:this.primeRate,
roomName:this.roomName,
startTime:this.startTime,
endTime:this.endTime,
page: 1,
row: 100
}).then(_data => {
_that.feeDetails = _data.data;
_that.allReceivableAmount = _data.sumTotal.allReceivableAmount;
_that.allReceivedAmount = _data.sumTotal.allReceivedAmount;
})
},
startTimeChange: function(e) {
this.startTime = e.detail.value;
},
endTimeChange:function(e){
this.endTime = e.detail.value;
},
_loadQuery:function(){
let _that = this; let _that = this;
queryPayFeeDetail(this,{ queryDictInfo(this,{
communityId:this.getCommunityId(), 'name': "pay_fee_config",
page:1, 'type': "fee_type_cd",
row:100 }).then(_data=>{
}).then(_data =>{ _that.feeTypeCds = _data;
_that.feeDetails = _data.data; });
_that.allReceivableAmount = _data.sumTotal.allReceivableAmount; queryDictInfo(this,{
_that.allReceivedAmount = _data.sumTotal.allReceivedAmount; 'name': "pay_fee_detail",
'type': "prime_rate",
}).then(_data=>{
_that.primeRates = _data;
}) })
} },
feeTypeChange: function(e) {
} this.feeTypeIndex = e.target.value //取其下标
} let selected = this.feeTypeCds[this.feeTypeIndex] //获取选中的数组
</script> if(!selected){
return;
<style lang="scss"> }
.q-query { this.feeTypeCd = selected.statusCd; //选中的id
background-color: #FFF; },
padding:15upx; primeRateChange: function(e) {
this.primeRateIndex = e.target.value //取其下标
.q-item{ let selected = this.primeRates[this.primeRateIndex] //获取选中的数组
width: 30%; if(!selected){
margin-left: 15upx; return;
padding: 10upx 15upx; }
border-radius: 15upx; this.primeRate = selected.statusCd; //选中的id
background-color: #f1f1f1; },
.q-input{ }
height: 40upx; }
} </script>
margin-bottom: 15upx;
} <style lang="scss">
.q-item-btn{ .q-query {
width: 30%; background-color: #FFF;
margin-left: 15upx; padding: 15upx;
.q-input{
height: 60upx; .q-item {
} width: 30%;
} margin-left: 15upx;
} padding: 10upx 15upx;
.apply-title{ border-radius: 15upx;
height: 60upx; background-color: #f1f1f1;
line-height: 50upx;
border-bottom: 1upx solid #F1F1F1; .q-input {
} height: 40upx;
.apply-content{ }
.item{
width: 50%; margin-bottom: 15upx;
margin-top:20upx; }
}
} .q-item-btn {
.radius-sm{ width: 30%;
border-radius: 16upx; margin-left: 15upx;
}
.q-input {
height: 60upx;
}
}
}
.apply-title {
height: 60upx;
line-height: 50upx;
border-bottom: 1upx solid #F1F1F1;
}
.apply-content {
.item {
width: 50%;
margin-top: 20upx;
}
}
.radius-sm {
border-radius: 16upx;
}
</style> </style>