| | |
| | | .window__body { |
| | | // width: 1100px; |
| | | // margin: 0 auto; |
| | | // background-color: #fff; |
| | | background-color: #fff; |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow-y: auto; |
| | | padding: 12px 16px; |
| | | padding: 0 16px 12px 16px; |
| | | // 标签 |
| | | // .el-form-item__label { |
| | | // float: none; |
| | |
| | | :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" v-if="info"> |
| | | <div class="left"> |
| | | <span class="mr10">单位名称:{{info.renterName}}</span> |
| | |
| | | <el-button plain type="danger" v-if="[0, 1, 2].includes(info.status)" @click="refund">退租</el-button> |
| | | </div> |
| | | <div class="remark" v-if="info">{{info.remark}}</div> |
| | | <div class="remark" v-if="info && info.status === 3">{{info.btRemark}}</div> |
| | | <div class="tabs"> |
| | | <div class="tab" :class="{ active: activeTabs === 0 }" @click="tabsClick(0)">合同信息</div> |
| | | <div class="tab" :class="{ active: activeTabs === 1 }" @click="tabsClick(1)">关联账单</div> |
| | | <div class="tab" :class="{ active: activeTabs === 2 }" @click="tabsClick(2)">操作记录</div> |
| | | </div> |
| | | </div> |
| | | <div class="main" v-if="activeTabs === 0 && info"> |
| | | <div class="title">基础信息</div> |
| | |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">合同租赁数</div> |
| | | <div class="val">{{ info.totalArea }}</div> |
| | | <div class="val">{{ info.totalArea }}㎡</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">所属公司</div> |
| | |
| | | <div class="list" style="background: #F7F7F7; padding: 15px 20px;" v-if="info.type === 2 || info.type === 0"> |
| | | <div class="item"> |
| | | <div class="la">押金金额</div> |
| | | <div class="val">{{ info.zlDeposit }}</div> |
| | | <div class="val">{{ info.zlDeposit }}元</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">付款方式</div> |
| | |
| | | <el-table :data="info.zlDetailList" stripe style="margin-bottom: 20px;" v-if="info.type === 2 || info.type === 0"> |
| | | <el-table-column prop="startDate" label="开始日期" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="endDate" label="结束日期" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="price" label="合同单价" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="advanceDays" label="付款提前天数" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column label="合同单价" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{row.price}} {{returnUnit(row.circleType)}} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="付款提前天数" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{row.advanceDays}}天 |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="title" v-if="info.type === 1 || info.type === 0">物业费条款</div> |
| | | <div class="list" style="background: #F7F7F7; padding: 15px 20px;" v-if="info.type === 1 || info.type === 0"> |
| | | <div class="item"> |
| | | <div class="la">押金金额</div> |
| | | <div class="val">{{ info.wyDeposit }}</div> |
| | | <div class="val">{{ info.wyDeposit }}元</div> |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">付款方式</div> |
| | |
| | | <el-table :data="info.wyDetailList" stripe style="margin-bottom: 20px;" v-if="info.type === 1 || info.type === 0"> |
| | | <el-table-column prop="startDate" label="开始日期" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="endDate" label="结束日期" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="price" label="合同单价" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="advanceDays" label="付款提前天数" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column label="合同单价" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{row.price}} {{returnUnit(row.circleType)}} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="付款提前天数" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{row.advanceDays}}天 |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="title">合同附件</div> |
| | | <div class="list"> |
| | | <el-table :data="info.fileList" stripe> |
| | | <el-table-column prop="name" label="附件名称" show-overflow-tooltip /> |
| | | <el-table-column label="附件名称" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | <u style="color: #0c6ce3; cursor: pointer;" @click="xiazai(row.fileurlFull)">{{row.name}}</u> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="userName" label="操作人" show-overflow-tooltip /> |
| | | <el-table-column prop="createDate" label="操作时间" show-overflow-tooltip /> |
| | | </el-table> |
| | |
| | | <el-table-column |
| | | :key="Date.now()" |
| | | prop="receivableFee" |
| | | label="应收金额"> |
| | | :label="`应${type === 0 ? '收' : '付'}金额`"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="actReceivableFee" |
| | | label="实收金额"> |
| | | :label="`实${type === 0 ? '收' : '付'}金额`"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | prop="needReceivableFee" |
| | | label="需收金额"> |
| | | :label="`需${type === 0 ? '收' : '付'}金额`"> |
| | | <template slot-scope="{row}"> |
| | | <template v-if="type === 0"> |
| | | <el-tag type="success" v-if="row.needReceivableFee > 0">收</el-tag> |
| | | <el-tag type="warning" v-else>付</el-tag> |
| | | <el-tag type="warning" v-else-if="row.needReceivableFee < 0">付</el-tag> |
| | | </template> |
| | | <template v-else> |
| | | <el-tag type="warning" v-if="row.needReceivableFee !== 0">付</el-tag> |
| | | </template> |
| | | <span style="margin-left: 10px;">{{Math.abs(row.needReceivableFee)}}</span> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | width="200" |
| | | label="计费周期"> |
| | | <template slot-scope="{row}"> |
| | | {{ row.startDate }} ~ {{ row.endDate }} |
| | |
| | | this.id = id |
| | | this.getData() |
| | | }, |
| | | xiazai (url) { |
| | | window.open(url) |
| | | }, |
| | | returnUnit (type) { |
| | | switch (type) { |
| | | case 0: |
| | | return '元/m²·天' |
| | | case 1: |
| | | return '元/m²·月' |
| | | case 2: |
| | | return '元/m²·年' |
| | | case 3: |
| | | return '元/天' |
| | | case 4: |
| | | return '元/月' |
| | | case 5: |
| | | return '元/年' |
| | | case 6: |
| | | return '元/场' |
| | | } |
| | | }, |
| | | getData () { |
| | | getById(this.id) |
| | | .then(res => { |
| | |
| | | capacity: this.pageSize, |
| | | page: this.page, |
| | | model: { |
| | | status: 0, |
| | | billType: this.type, |
| | | contractId: this.info.id |
| | | } |
| | |
| | | :default-expanded-keys="ids" |
| | | :default-checked-keys="ids" |
| | | :props="{ children: 'projectDataVOList', label: 'name' }"> |
| | | <span class="custom-tree-node" style="width: 100%; display: flex; align-items: center; justify-content: space-between;" slot-scope="{ node, data }"> |
| | | <span>{{ data.name }}</span> |
| | | <span style="color: #2080f7;" v-if="data.lv === 3"> |
| | | {{ data.area }}㎡ |
| | | </span> |
| | | </span> |
| | | </el-tree> |
| | | </div> |
| | | </div> |
| | |
| | | </el-table-column> |
| | | <el-table-column label="期数" align="center" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | <el-tag type="success">{{row.sortnum}}</el-tag> |
| | | <el-tag type="success" v-if="row.sortnum > 0">{{row.sortnum}}</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="区间" align="center" show-overflow-tooltip> |
| | |
| | | </el-table-column> |
| | | <el-table-column label="期数" align="center" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | <el-tag type="success">{{row.sortnum}}</el-tag> |
| | | <el-tag type="success" v-if="row.sortnum > 0">{{row.sortnum}}</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="区间" align="center" show-overflow-tooltip> |
| | |
| | | if (!num) { |
| | | return `${year}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`; |
| | | } else { |
| | | return `${year + 1}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day : day}`; |
| | | return `${year + 1}-${month < 10 ? '0' + month : month}-${day < 10 ? '0' + day - 1 : day - 1}`; |
| | | } |
| | | }, |
| | | clearData () { |
| | |
| | | label="账单编号"> |
| | | </el-table-column> |
| | | <el-table-column |
| | | width="100" |
| | | label="费用类型"> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.costType === 0">租赁费</span> |
| | |
| | | label="应收付金额/原始应收付"> |
| | | <template v-slot="{row}"> |
| | | <div style="display: flex; align-items: center;"> |
| | | <el-input v-model="row.receivableFee" @input="changeReceivableFee($event, row)" placeholder="请输入内容" style="width: 90px;"></el-input> |
| | | <el-input v-model="row.receivableFee" @input="changeReceivableFee($event, row)" placeholder="请输入内容" style="flex: 1;"></el-input> |
| | | <span style="margin: 0 10px;">/</span> |
| | | {{row.receivableFeeCopy}} |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | width="120" |
| | | prop="actReceivableFee" |
| | | label="实收/付金额"> |
| | | </el-table-column> |
| | |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="footer"> |
| | | 合计应收:<span>{{receivable.toFixed(2)}}</span>元, 合计应付:<span>{{meet.toFixed(2)}}</span>元 |
| | | 合计应收:<span>{{receivable}}</span>元, 合计应付:<span>{{meet}}</span>元 |
| | | </div> |
| | | </div> |
| | | <!-- 创建收款账单 --> |
| | |
| | | loading: false |
| | | } |
| | | }, |
| | | watch: { |
| | | // info: { |
| | | // deep: true, |
| | | // immediate: true, |
| | | // handler(news, olds) { |
| | | // const arr = [...this.info.terminateList, ...this.info.depositList] |
| | | // let total1 = 0 |
| | | // let total2 = 0 |
| | | // arr.forEach(item => { |
| | | // if (item.billType === 0) { |
| | | // total1 += Number(item.price) |
| | | // } else if (item.billType === 1) { |
| | | // total2 += Number(item.price) |
| | | // } |
| | | // }) |
| | | // this.receivable = total1 |
| | | // this.meet = total2 |
| | | // } |
| | | // } |
| | | }, |
| | | methods: { |
| | | open (title, info) { |
| | | this.title = title |
| | |
| | | this.$refs.form.resetFields() |
| | | }) |
| | | this.info.canBackRentBills.forEach(item => { |
| | | this.$set(item, 'receivableFeeCopy', item.receivableFee) |
| | | this.$set(item, 'receivableFee', item.needReceivableFee) |
| | | 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) |
| | | } |
| | | }) |
| | |
| | | total2 += Number(item.price) |
| | | } |
| | | }) |
| | | this.receivable = total1 |
| | | this.meet = total2 |
| | | this.receivable = total1.toFixed(2) |
| | | this.meet = total2.toFixed(2) |
| | | }, |
| | | getDay () { |
| | | const today = new Date(); |
| | |
| | | <el-table-column prop="zlFirstPrice" label="租赁单价" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | <div style="display: flex; align-items: center;"> |
| | | <span>{{row.zlFirstPrice}}</span> |
| | | <span v-if="row.zlFirstCircle === 0">元/m²·天</span> |
| | | <span v-if="row.zlFirstCircle === 1">元/m²·月</span> |
| | | <span v-if="row.zlFirstCircle === 2">元/天</span> |
| | | <span v-if="row.zlFirstCircle === 3">元/月</span> |
| | | <span v-if="row.zlFirstCircle === 4">元/年</span> |
| | | <span v-if="row.zlFirstCircle === 5">元/m²·年</span> |
| | | <span v-if="row.zlFirstCircle === 6">元/场</span> |
| | | <span>{{row.zlFirstPrice || row.wyFirstPrice}}</span> |
| | | <span>{{row.zlFirstCircleStr || row.wyFirstCircleStr}}</span> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="totleFee" label="账单金额" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="receivableFee" label="应收金额" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="actReceivableFee" label="实收金额" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="needReceivableFee" label="需收金额" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="receivableFee" :label="`应${billType === 0 ? '收' : '付'}金额`" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="actReceivableFee" :label="`实${billType === 0 ? '收' : '付'}金额`" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column :label="`需收/付金额`" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | {{Math.abs(row.needReceivableFee)}} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="费用类型" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.costType === 0">租赁费</span> |
| | |
| | | {{ row.startDate }} ~ {{ row.endDate }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="planPayDate" label="应收日期" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column prop="planPayDate" :label="`应${billType === 0 ? '收' : '付'}日期`" min-width="100" show-overflow-tooltip /> |
| | | <el-table-column label="账单来源" min-width="100" show-overflow-tooltip> |
| | | <template slot-scope="{row}"> |
| | | <span v-if="row.type === 0">合同账单</span> |
| | |
| | | { value: 0, label: '待收款' }, |
| | | { value: 1, label: '已结算' }, |
| | | { value: 2, label: '部分结清' }, |
| | | { value: 3, label: '待退款' }, |
| | | { value: 4, label: '待付款' } |
| | | { value: 3, label: '待付款' }, |
| | | { value: 4, label: '待退款' } |
| | | ] |
| | | }, |
| | | { |
| | |
| | | <template> |
| | | <GlobalWindow :title="'账单详情'" :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">付款方:{{info.customerName}}</span> |
| | | <el-tag type="success" v-if="info.status === 0">开启</el-tag> |
| | | <el-tag type="info" v-if="info.status === 1">关闭</el-tag> |
| | | </div> |
| | | <el-button plain type="primary" @click="$refs.flowingWater.open('创建收支流水', { |
| | | billType: info.billType, |
| | | <el-button plain type="primary" v-if="![1].includes(info.payStatus)" @click="$refs.flowingWater.open('创建收支流水', { |
| | | billType: returnBillType(), |
| | | billId: info.id, |
| | | costType: info.costType, |
| | | receivableFee: info.needReceivableFee, |
| | | receivableFee: Math.abs(info.needReceivableFee), |
| | | costTypeName: returnText(info.costType), |
| | | contractCode: info.contractCode, |
| | | contractId: info.contractId, |
| | |
| | | date: `${info.startDate} ~ ${info.endDate}`, |
| | | companyId: info.companyId, |
| | | companyName: info.companyName, |
| | | actReceivableFee: info.actReceivableFee |
| | | actReceivableFee: Math.abs(info.needReceivableFee), |
| | | needReceivableFeeCopy: info.needReceivableFee |
| | | })">新建收支流水</el-button> |
| | | </div> |
| | | <div class="line"></div> |
| | |
| | | <div class="val" style="margin-top: 10px;">{{info.actReceivableFee}}</div> |
| | | </div> |
| | | <div class="item" style="flex: 1;"> |
| | | <div class="la">需{{info.billType === 0 ? '收' : '付'}}金额(元)</div> |
| | | <div class="val" style="margin-top: 10px;">{{info.needReceivableFee}}</div> |
| | | <div class="la">需{{info.needReceivableFee > 0 ? '收' : '付'}}金额(元)</div> |
| | | <div class="val" style="margin-top: 10px;">{{Math.abs(info.needReceivableFee)}}</div> |
| | | </div> |
| | | <div class="item" style="flex: 1;"> |
| | | <div class="la">应{{info.billType === 0 ? '收' : '付'}}日期</div> |
| | |
| | | </div> |
| | | <div class="tabs"> |
| | | <div class="tab" :class="{ active: activeTabs == 0 }" @click="tabsClick(0)">基础信息</div> |
| | | <!-- <div class="tab" :class="{ active: activeTabs == 1 }" @click="tabsClick(1)">账单明细</div>--> |
| | | <div class="tab" :class="{ active: activeTabs == 2 }" @click="tabsClick(2)">收支流水</div> |
| | | </div> |
| | | </div> |
| | | <div class="main"> |
| | | <div class="title">基础信息</div> |
| | |
| | | </div> |
| | | <div class="item"> |
| | | <div class="la">合同编号</div> |
| | | <div class="val">{{info.contractCode}}</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> |
| | | <!-- 创建流水 --> |
| | | <FlowingWater ref="flowingWater" @success="getDetails" @refresh="Refresh" /> |
| | | <!-- 合同详情 --> |
| | | <ContractDetail ref="ContractDetailRef" /> |
| | | </GlobalWindow> |
| | | </template> |
| | | |
| | |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import BaseOpera from '@/components/base/BaseOpera' |
| | | import FlowingWater from './flowingWater' |
| | | import ContractDetail from '../../contract/components/contractDetail' |
| | | import { getYwContractBillById } from '@/api/contract' |
| | | export default { |
| | | components: { |
| | | GlobalWindow, |
| | | FlowingWater |
| | | FlowingWater, |
| | | ContractDetail |
| | | }, |
| | | extends: BaseOpera, |
| | | data() { |
| | |
| | | this.id = id |
| | | this.getDetails() |
| | | }, |
| | | handleDetail (id) { |
| | | this.$refs.ContractDetailRef.open('合同详情', id) |
| | | }, |
| | | getDetails () { |
| | | getYwContractBillById(this.id) |
| | | .then(res => { |
| | |
| | | this.visible = true |
| | | }) |
| | | }, |
| | | returnBillType () { |
| | | if (this.info.payStatus === 0) { |
| | | return 0 |
| | | } else if (this.info.payStatus === 2) { |
| | | return this.info.billType |
| | | } else if ([3,4].includes(this.info.payStatus)) { |
| | | return 1 |
| | | } |
| | | }, |
| | | Refresh () { |
| | | this.$emit('success') |
| | | }, |
| | |
| | | <template> |
| | | <GlobalWindow :title="title" :visible.sync="visible" :confirm-working="isWorking" @close="close" |
| | | <GlobalWindow :title="title" :withFooter="false" :visible.sync="visible" :confirm-working="isWorking" @close="close" |
| | | @confirm="confirm"> |
| | | <div class="home_title"> |
| | | <div class="left"> |
| | |
| | | <el-form-item label="计费周期" required> |
| | | <el-input v-model="form.date" disabled placeholder="请输入" v-trim /> |
| | | </el-form-item> |
| | | <el-form-item label="应收金额" required> |
| | | <el-form-item :label="`应${form.needReceivableFeeCopy > 0 ? '收' : '付'}金额`" required> |
| | | <el-input v-model="form.receivableFee" disabled placeholder="请输入" v-trim /> |
| | | </el-form-item> |
| | | <el-form-item label="实收金额" prop="actReceivableFee"> |
| | | <el-form-item :label="`实${form.needReceivableFeeCopy > 0 ? '收' : '付'}金额`" prop="actReceivableFee"> |
| | | <el-input v-model="form.actReceivableFee" placeholder="请输入" v-trim /> |
| | | </el-form-item> |
| | | <el-form-item label="入账日期" prop="actPayDate"> |
| | |
| | | remark: '', |
| | | accountId: '', |
| | | multifileList: [], |
| | | costTypeName: '' |
| | | costTypeName: '', |
| | | needReceivableFeeCopy: '' |
| | | }, |
| | | rules: { |
| | | receivableFee: [ |