| | |
| | | <el-date-picker |
| | | v-model="form.btDate" |
| | | type="date" |
| | | :picker-options="pickerOptions" |
| | | @change="changeBtDate" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择"> |
| | |
| | | <el-table-column prop="projectName" label="项目名称" show-overflow-tooltip /> |
| | | <el-table-column label="房源名称" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{row.buildingName}}/{{row.code}} |
| | | {{row.buildingName}}/{{row.roomNum}} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="租赁面积(㎡)" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{row.area}}㎡ |
| | | {{row.rentArea}}㎡ |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | <div class="title"> |
| | | <span>退租信息</span> |
| | | <span>账单结算</span> |
| | | <div style="display: flex; align-items: center;"> |
| | | <el-button type="primary" @click="addZD">添加收款</el-button> |
| | | <el-button type="primary" @click="addFK">添加付款</el-button> |
| | |
| | | <el-table-column |
| | | width="100" |
| | | label="费用类型"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.costType === 0">租赁费</span> |
| | | <span v-if="row.costType === 1">物业费</span> |
| | | <span v-if="row.costType === 4">水电费</span> |
| | | <span v-if="row.costType === 5">杂项费</span> |
| | | <span v-if="row.costType === 6">其他</span> |
| | | <template slot-scope="scope"> |
| | | <div style="display: flex; align-items: center;"> |
| | | <span v-if="scope.row.costType === 0">租赁费</span> |
| | | <span v-if="scope.row.costType === 1">物业费</span> |
| | | <span v-if="scope.row.costType === 4">水电费</span> |
| | | <span v-if="scope.row.costType === 5">杂项费</span> |
| | | <span v-if="scope.row.costType === 6">其他</span> |
| | | <i class="el-icon-delete" |
| | | style="color: red; margin-left: 10px; font-size: 18px; cursor: pointer;" |
| | | @click="deleRow(scope.$index)" |
| | | v-if="scope.row.isDele"> |
| | | </i> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | |
| | | <div style="display: flex; align-items: center;"> |
| | | <el-tag type="success" v-if="row.billType === 0">收</el-tag> |
| | | <el-tag type="warning" v-if="row.billType === 1">付</el-tag> |
| | | <span style="margin-left: 10px;">{{row.price}}</span> |
| | | <span style="margin-left: 10px;">{{Math.abs(row.price)}}</span> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | {{row.startDate}} ~ {{row.endDate}} |
| | | </template> |
| | | </el-table-column> |
| | | <!-- prop="receivableFee"--> |
| | | <el-table-column |
| | | prop="receivableFee" |
| | | label="应收金额"> |
| | | <template slot-scope="{row}"> |
| | | 0 |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="actReceivableFee" |
| | |
| | | import AddCollectionBill from './addCollectionBill' |
| | | import AddPaymentBill from './addPaymentBill' |
| | | import { getUserList } from '@/api/system/user' |
| | | import { backRent, getCanBackBill } from '@/api/contract' |
| | | import { backRent, getCanBackBill, findForBills } from '@/api/contract' |
| | | import { mapState } from 'vuex' |
| | | export default { |
| | | name: "terminateLease", |
| | |
| | | }, |
| | | |
| | | list: [], |
| | | |
| | | pickerOptions: {}, |
| | | agentList: [], |
| | | |
| | | receivable: '', |
| | |
| | | open (title, info) { |
| | | this.title = title |
| | | this.info = info |
| | | this.pickerOptions = { |
| | | disabledDate(time) { |
| | | // 如果没有后面的 -8.64e7 就是不可以选择今天的 |
| | | const beginDate = new Date(info.startDate).getTime() - 8.64e7 |
| | | const endDate = new Date(info.endDate).getTime() |
| | | return beginDate > time.getTime() || endDate < time.getTime() |
| | | } |
| | | } |
| | | this.form.id = info.id |
| | | this.form.btSignDate = this.getDay() |
| | | console.log(this.userInfo) |
| | | this.form.btUserId = this.userInfo.id |
| | | this.$nextTick(() => { |
| | | this.$refs.form.resetFields() |
| | | }) |
| | | this.info.canBackRentBills.forEach(item => { |
| | | if ([2,3,7].includes(item.costType)) { |
| | | this.$set(item, 'billType', 1) |
| | | this.$set(item, 'price', item.actReceivableFee) |
| | | } else { |
| | | this.$set(item, 'receivableFeeCopy', item.receivableFee) |
| | | this.$set(item, 'receivableFee', item.needReceivableFee) |
| | | this.$set(item, 'price', item.needReceivableFee) |
| | | } |
| | | }) |
| | | this.info.terminateList = this.info.canBackRentBills.filter(item => { |
| | | if ([0,1,4,5,6].includes(item.costType)) { |
| | | item.billTypeCopy = JSON.parse(JSON.stringify(item.billType)) |
| | | return item |
| | | } |
| | | }) |
| | | this.info.depositList = this.info.canBackRentBills.filter(item => { |
| | | if ([2,3,7].includes(item.costType)) { |
| | | item.billTypeCopy = JSON.parse(JSON.stringify(item.billType)) |
| | | return item |
| | | } |
| | | }) |
| | | this.info.terminateList = [] |
| | | this.info.depositList = [] |
| | | this.form.btDate = this.getDay() |
| | | this.countData() |
| | | this.getUser() |
| | | this.changeBtDate(this.form.btDate) |
| | | this.visible = true |
| | | }, |
| | | deleRow(index) { |
| | | this.info.terminateList.splice(index, 1) |
| | | this.countData() |
| | | }, |
| | | getDayTime () { |
| | | const today = new Date(); |
| | | const year = today.getFullYear(); |
| | | const month = today.getMonth() + 1; |
| | | const day = today.getDate(); |
| | | return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`; |
| | | }, |
| | | countData () { |
| | | const arr = [...this.info.terminateList, ...this.info.depositList] |
| | |
| | | let total2 = 0 |
| | | arr.forEach(item => { |
| | | if (item.billType === 0) { |
| | | total1 += Number(item.price) |
| | | total1 += Math.abs(Number(item.price)) |
| | | } else if (item.billType === 1) { |
| | | total2 += Number(item.price) |
| | | total2 += Math.abs(Number(item.price)) |
| | | } |
| | | }) |
| | | this.receivable = total1.toFixed(2) |
| | |
| | | getDay () { |
| | | const today = new Date(); |
| | | const year = today.getFullYear(); |
| | | const month = today.getMonth() + 1; // 月份是从 0 开始的,因此需要加 1 |
| | | const month = today.getMonth() + 1; |
| | | const day = today.getDate(); |
| | | return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`; |
| | | }, |
| | |
| | | billTypeCopy: 1 |
| | | }, { startDate: this.info.startDate, endDate: this.form.btDate }) |
| | | }, |
| | | changeBtDate (planPayDateEnd) { |
| | | changeBtDate (btDate) { |
| | | this.loading = true |
| | | getCanBackBill({ |
| | | contractId: this.info.id, |
| | | planPayDateEnd |
| | | findForBills({ |
| | | id: this.info.id, |
| | | btDate |
| | | }).then(res => { |
| | | res.forEach(item => { |
| | | this.$set(item, 'receivableFeeCopy', item.receivableFee) |
| | | this.$set(item, 'receivableFee', item.needReceivableFee) |
| | | this.$set(item, 'price', item.needReceivableFee) |
| | | res.canBackRentBills.forEach(item => { |
| | | if ([2,3,7].includes(item.costType)) { |
| | | this.$set(item, 'billType', 1) |
| | | this.$set(item, 'price', item.actReceivableFee) |
| | | } else { |
| | | this.$set(item, 'receivableFeeCopy', item.receivableFee) |
| | | this.$set(item, 'receivableFee', item.needReceivableFee) |
| | | this.$set(item, 'price', (item.needReceivableFee - item.actReceivableFee).toFixed(2)) |
| | | } |
| | | }) |
| | | this.info.terminateList = res.filter(item => { |
| | | this.info.terminateList = res.canBackRentBills.filter(item => { |
| | | if ([0,1,4,5,6].includes(item.costType)) { |
| | | item.billTypeCopy = JSON.parse(JSON.stringify(item.billType)) |
| | | if (Number(item.price) < 0) { |
| | | item.billType = 1 |
| | | } |
| | | return item |
| | | } |
| | | }) |
| | | this.info.depositList = res.canBackRentBills.filter(item => { |
| | | if ([2,3,7].includes(item.costType)) { |
| | | item.billTypeCopy = JSON.parse(JSON.stringify(item.billType)) |
| | | return item |
| | | } |
| | |
| | | }) |
| | | }, |
| | | getObjS (obj) { |
| | | obj.startDate = obj.startDate.substring(0, 10) |
| | | obj.endDate = obj.endDate.substring(0, 10) |
| | | obj.isDele = true |
| | | this.info.terminateList.push(obj) |
| | | // this.info.terminateList.forEach(item => { |
| | | // item.receivableFee = Number(item.receivableFee) + 1 |
| | | // item.receivableFee = Number(item.receivableFee) - 1 |
| | | // }) |
| | | this.countData() |
| | | }, |
| | | confirm () { |
| | |
| | | flex-direction: column; |
| | | border-bottom: 1px solid #ececec; |
| | | margin-bottom: 15px; |
| | | position: sticky; |
| | | top: 0; |
| | | left: 0; |
| | | z-index: 999; |
| | | background: #ffffff; |
| | | span { |
| | | color: black; |
| | | font-size: 16px; |