|
|
|
@ -0,0 +1,139 @@
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
<div class="option-bth">
|
|
|
|
|
|
|
|
<el-button plain size="small" type="primary" @click="addRentRecord()">新增租赁记录</el-button>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<el-table :data="rentRecords" style="width: 100%">
|
|
|
|
|
|
|
|
<el-table-column prop="rentBeginTime" label="绑定时间" width="150"></el-table-column>
|
|
|
|
|
|
|
|
<el-table-column prop="rentEndTime" label="解绑时间" width="150"></el-table-column>
|
|
|
|
|
|
|
|
<el-table-column prop="depositAmount" label="押金金额" width="120">
|
|
|
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
|
|
|
{{ scope.row.depositAmount || 0 }} 元
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column prop="rentAmount" label="月租金" width="120">
|
|
|
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
|
|
|
{{ scope.row.rentAmount || 0 }} 元
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column prop="authScope" label="授权范围" width="150"></el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="状态" width="100">
|
|
|
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
|
|
|
<dict-tag :options="dict.type.record_status" :value="scope.row.status"/>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
<el-table-column prop="remark" label="备注" width="150"></el-table-column>
|
|
|
|
|
|
|
|
<el-table-column label="操作" width="180" fixed="right">
|
|
|
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
|
|
|
<el-button type="text" size="small" @click="editRentRecord(scope.row.id)">{{ '修改' }}</el-button>
|
|
|
|
|
|
|
|
<el-button type="text" size="small" @click="deleteRentRecord(scope.row.id, scope.$index)">{{
|
|
|
|
|
|
|
|
'删除'
|
|
|
|
|
|
|
|
}}
|
|
|
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
</el-table-column>
|
|
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 租赁记录弹窗 -->
|
|
|
|
|
|
|
|
<rent-record-add-and-update ref="rentRecordAddOrUpdate" :tenantId="ownerId" @refreshDataList="getRentRecords"
|
|
|
|
|
|
|
|
@saveRentRecord="saveRentRecord"></rent-record-add-and-update>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
import * as rentRecordApi from '@/api/pmtenanthouse.js'
|
|
|
|
|
|
|
|
import RentRecordAddAndUpdate from '../../pmowner/rent-record-add-and-update.vue'
|
|
|
|
|
|
|
|
import DictTag from '@/components/DictTag'
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
|
|
|
components: {RentRecordAddAndUpdate, DictTag},
|
|
|
|
|
|
|
|
props: {
|
|
|
|
|
|
|
|
ownerId: {
|
|
|
|
|
|
|
|
type: String,
|
|
|
|
|
|
|
|
default: ''
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
dicts: ['record_status'],
|
|
|
|
|
|
|
|
data() {
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
rentRecords: [],
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
watch: {
|
|
|
|
|
|
|
|
ownerId(newVal) {
|
|
|
|
|
|
|
|
this.getRentRecords()
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
mounted() {
|
|
|
|
|
|
|
|
this.getRentRecords()
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 获取租赁记录列表
|
|
|
|
|
|
|
|
getRentRecords() {
|
|
|
|
|
|
|
|
if (!this.ownerId) return
|
|
|
|
|
|
|
|
rentRecordApi.pmtenanthouseListApi({rentId: this.ownerId, page: 1, limit: 9999}).then(res => {
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
|
|
|
this.rentRecords = Array.isArray(res) ? res : (res.list || [])
|
|
|
|
|
|
|
|
} catch (error) {
|
|
|
|
|
|
|
|
this.rentRecords = []
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
|
|
|
this.rentRecords = []
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 新增租赁记录
|
|
|
|
|
|
|
|
addRentRecord() {
|
|
|
|
|
|
|
|
if (this.$refs.rentRecordAddOrUpdate) {
|
|
|
|
|
|
|
|
this.$refs.rentRecordAddOrUpdate.init(0, this.ownerId)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 编辑租赁记录
|
|
|
|
|
|
|
|
editRentRecord(id) {
|
|
|
|
|
|
|
|
if (this.$refs.rentRecordAddOrUpdate) {
|
|
|
|
|
|
|
|
this.$refs.rentRecordAddOrUpdate.init(id, this.ownerId)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 删除租赁记录
|
|
|
|
|
|
|
|
deleteRentRecord(id, index) {
|
|
|
|
|
|
|
|
this.$confirm('确定要删除这条租赁记录吗?', '提示', {
|
|
|
|
|
|
|
|
confirmButtonText: '确定',
|
|
|
|
|
|
|
|
cancelButtonText: '取消',
|
|
|
|
|
|
|
|
type: 'warning'
|
|
|
|
|
|
|
|
}).then(() => {
|
|
|
|
|
|
|
|
if (id) {
|
|
|
|
|
|
|
|
rentRecordApi.pmtenanthouseDeleteApi([id]).then(() => {
|
|
|
|
|
|
|
|
this.$message.success('删除成功')
|
|
|
|
|
|
|
|
this.rentRecords.splice(index, 1)
|
|
|
|
|
|
|
|
}).catch(() => {
|
|
|
|
|
|
|
|
this.$message.error('删除失败')
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.rentRecords.splice(index, 1)
|
|
|
|
|
|
|
|
this.$message.success('删除成功')
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}).catch(() => {
|
|
|
|
|
|
|
|
this.$message.info('已取消删除')
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
// 保存租赁记录(从租赁记录弹窗接收)
|
|
|
|
|
|
|
|
saveRentRecord(recordData) {
|
|
|
|
|
|
|
|
if (!recordData) return
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const existingIndex = this.rentRecords.findIndex(record => record.id === recordData.id)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (existingIndex !== -1) {
|
|
|
|
|
|
|
|
this.rentRecords.splice(existingIndex, 1, recordData)
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
this.rentRecords.push(recordData)
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
|
|
|
.option-bth {
|
|
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|