| | |
| | | <div class="zd_list"> |
| | | <div class="zd_list_row"> |
| | | <span>待收款账单数</span> |
| | | <span>2</span> |
| | | <span>{{info.inAmount || 0}}</span> |
| | | </div> |
| | | <div class="zd_list_row"> |
| | | <span>待收款金额</span> |
| | | <span>¥247.00</span> |
| | | <span>¥{{info.inFee || 0}}</span> |
| | | </div> |
| | | <div class="zd_list_row"> |
| | | <span>待付款账单数</span> |
| | | <span>3</span> |
| | | <span>{{info.payAmount || 0}}</span> |
| | | </div> |
| | | <div class="zd_list_row"> |
| | | <span>待付款金额</span> |
| | | <span>¥247.00</span> |
| | | <span>¥{{info.payFee || 0}}</span> |
| | | </div> |
| | | </div> |
| | | <div class="zd_content"> |
| | |
| | | <span>账单</span> |
| | | </div> |
| | | <el-table |
| | | :data="tableData" |
| | | :data="info.ywContractBillList" |
| | | border |
| | | style="width: 100%"> |
| | | <el-table-column |
| | | prop="date" |
| | | label="账单编号"> |
| | | <template slot-scope="{row}"> |
| | | <el-button type="text" @click="handleDetail(row.id)">{{row.code}}</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="name" |
| | | label="费用类型"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.costType === 0">租赁费</span> |
| | | <span v-if="row.costType === 1">物业费</span> |
| | | <span v-if="row.costType === 2">租赁押金</span> |
| | | <span v-if="row.costType === 3">物业押金</span> |
| | | <span v-if="row.costType === 4">水电费</span> |
| | | <span v-if="row.costType === 5">杂项费</span> |
| | | <span v-if="row.costType === 6">其他</span> |
| | | <span v-if="row.costType === 7">保证金</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="计费周期"> |
| | | <template slot-scope="{row}"> |
| | | {{row.startDate}}~{{row.endDate}} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | prop="receivableFee" |
| | | label="应收付金额/原始应收付"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | prop="actReceivableFee" |
| | | label="实收/付金额"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | label="需收/付金额"> |
| | | <template slot-scope="{row}"> |
| | | <div style="display: flex; align-items: center;"> |
| | | <el-tag type="success" v-if="row.needReceivableFee > 0">收</el-tag> |
| | | <el-tag type="warning" v-if="row.needReceivableFee < 0">付</el-tag> |
| | | <span>{{Math.abs(row.needReceivableFee)}}</span> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="address" |
| | | prop="planPayDate" |
| | | label="应收/付日期"> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | <!-- 账单详情 --> |
| | | <Detail ref="DetailRef" /> |
| | | </GlobalWindow> |
| | | </template> |
| | | |
| | | <script> |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import BaseOpera from '@/components/base/BaseOpera' |
| | | import { getWaitDealList } from '@/api/ywContractBill' |
| | | import Detail from '../../finance/components/bullDetail.vue' |
| | | export default { |
| | | name: 'pendingBills', |
| | | components: { |
| | | GlobalWindow |
| | | GlobalWindow, |
| | | Detail |
| | | }, |
| | | extends: BaseOpera, |
| | | data () { |
| | | return { |
| | | tableData: [] |
| | | info: [] |
| | | } |
| | | }, |
| | | methods: { |
| | | |
| | | open (title, contractId) { |
| | | this.title = title |
| | | getWaitDealList(contractId) |
| | | .then(res => { |
| | | this.info = res |
| | | this.visible = true |
| | | }) |
| | | }, |
| | | handleDetail (id) { |
| | | this.$refs.DetailRef.open('账单详情', id) |
| | | } |
| | | } |
| | | } |
| | | </script> |