<template>
|
<GlobalWindow
|
title="房源详情"
|
:withFooter="false"
|
:visible.sync="visible"
|
:confirm-working="isWorking"
|
@close="close"
|
@confirm="confirm">
|
<div style="width: 100%; position: sticky; top: 0; left: 0; z-index: 999; background: #ffffff;">
|
<div class="home_title">
|
<div class="left">
|
<span class="mr10">房间名称</span>
|
<el-tag type="info">已租</el-tag>
|
</div>
|
</div>
|
<div class="tabs">
|
<div class="tab" :class="{ active: activeTabs === 0 }" @click="tabsClick(0)">房源信息</div>
|
<div class="tab" :class="{ active: activeTabs === 2 }" @click="tabsClick(2)">租客合同</div>
|
<div class="tab" :class="{ active: activeTabs === 3 }" @click="tabsClick(3)">工单记录</div>
|
<div class="tab" :class="{ active: activeTabs === 4 }" @click="tabsClick(4)">设备信息</div>
|
<div class="tab" :class="{ active: activeTabs === 5 }" @click="tabsClick(5)">资产信息</div>
|
</div>
|
</div>
|
<div class="main">
|
<div class="title">基础信息</div>
|
<div class="list" style="background: rgba(0,0,0,0); padding: 0;">
|
<div class="item">
|
<div class="la">费用类型</div>
|
<div class="val">{{returnText(info.costType)}}</div>
|
</div>
|
<div class="item">
|
<div class="la">计费周期</div>
|
<div class="val">{{info.startDate}} ~ {{info.endDate}}</div>
|
</div>
|
<div class="item">
|
<div class="la">账单金额(元)</div>
|
<div class="val">{{info.totleFee}}</div>
|
</div>
|
<div class="item">
|
<div class="la">账单编号</div>
|
<div class="val">{{info.code}}</div>
|
</div>
|
<div class="item">
|
<div class="la">合同编号</div>
|
<div class="val" style="color: #2080f7; cursor: pointer;" @click="handleDetail(info.contractId)">{{info.contractCode}}</div>
|
</div>
|
<div class="item">
|
<div class="la">创建时间</div>
|
<div class="val">{{info.createDate}}</div>
|
</div>
|
<div class="item">
|
<div class="la">付款方</div>
|
<div class="val">{{info.customerName}}</div>
|
</div>
|
<div class="item">
|
<div class="la">经办人</div>
|
<div class="val">{{info.realname}}</div>
|
</div>
|
<div class="item">
|
<div class="la">所属公司</div>
|
<div class="val">{{info.companyName}}</div>
|
</div>
|
<div class="item">
|
<div class="la">账单备注</div>
|
<div class="val">{{info.remark}}</div>
|
</div>
|
<div class="item"></div>
|
<div class="item"></div>
|
</div>
|
<div class="title">房源信息</div>
|
<div class="list" style="background: rgba(0,0,0,0); padding: 0;">
|
<el-table
|
:data="info.ywContractRoomList"
|
border
|
style="width: 100%">
|
<el-table-column
|
prop="projectName"
|
label="项目名称">
|
</el-table-column>
|
<el-table-column
|
prop="floorName"
|
label="楼宇名称">
|
</el-table-column>
|
<el-table-column
|
label="楼层/房号">
|
<template slot-scope="{row}">
|
{{row.buildingName}}/{{row.roomName}}
|
</template>
|
</el-table-column>
|
<el-table-column
|
label="面积">
|
<template slot-scope="{row}">
|
{{row.area}}㎡
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="title">收支流水</div>
|
<div class="list" style="background: rgba(0,0,0,0); padding: 0;">
|
<el-table
|
:data="info.ywContractRevenueList"
|
border
|
style="width: 100%">
|
<el-table-column
|
label="流水类型">
|
<template slot-scope="{row}">
|
<span v-if="row.revenueType === 0">收入</span>
|
<span v-if="row.revenueType === 1">支出</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="customerName"
|
label="对方单位名称">
|
</el-table-column>
|
<el-table-column
|
label="费用类型">
|
<template slot-scope="{row}">
|
<span v-if="row.payType === 0">现金</span>
|
<span v-if="row.payType === 1">网银转账</span>
|
<span v-if="row.payType === 2">POS机</span>
|
<span v-if="row.payType === 3">支付宝</span>
|
<span v-if="row.payType === 4">微信</span>
|
<span v-if="row.payType === 5">转账支票</span>
|
<span v-if="row.payType === 6">其他</span>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="actPayDate"
|
label="入账日期">
|
</el-table-column>
|
<el-table-column
|
prop="actReceivableFee"
|
label="发生额">
|
</el-table-column>
|
<el-table-column
|
prop="createDate"
|
label="创建时间">
|
</el-table-column>
|
<el-table-column
|
prop="remark"
|
label="备注">
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
import BaseOpera from '@/components/base/BaseOpera'
|
export default {
|
name: 'houseDetails',
|
components: {
|
GlobalWindow
|
},
|
extends: BaseOpera,
|
data() {
|
return {
|
activeTabs: 0
|
}
|
},
|
methods: {
|
tabsClick(val) {
|
this.activeTabs = val
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
|
</style>
|
