Files
JY1.0/src/views/WorkshopProcurement/DepartmentBuyerRequestFund/index.vue
2018-11-22 17:33:28 +08:00

432 lines
15 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<div class="app-container">
<el-card>
<span>开始时间:</span>
<el-date-picker
v-model="startDate"
size="small"
type="date"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="选择日期"/>
<span>结束时间:</span>
<el-date-picker
v-model="endDate"
size="small"
type="date"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="选择日期"/>
<span>合同号:</span>
<el-input v-model="contractNum" placeholder="合同号" size="small" style="width:180px" clearable/>
<span>采购员:</span>
<el-select v-model="personValue" placeholder="采购员" size="small" style="width: 100px" clearable>
<el-option
v-for="item in person"
:key="item.value"
:label="item.label"
:value="item.value"/>
</el-select>
<span>供应商:</span>
<el-input
v-model="supplierName"
placeholder="供应商"
size="small"
clearable
style="width:180px"/>
<el-button
type="success"
size="small"
icon="el-icon-search"
style="margin-left:10px"
@click="total1=0;pageCurrent1=1;pageSize1=10;searchTable1()">查询</el-button>
</el-card>
<el-card>
<el-table :data="tableData1" size="mini" border style="width: 100%">
<el-table-column label="请款" min-width="80" align="center">
<template slot-scope="scope">
<el-button
type="primary"
size="mini"
icon=""
@click="requestFund(scope.row)">请款</el-button>
</template>
</el-table-column>
<el-table-column label="采购合同编号" min-width="100" align="center">
<template slot-scope="scope">
{{ scope.row.采购合同编号 }}
</template>
</el-table-column>
<el-table-column label="采购合同名称" min-width="100" align="center">
<template slot-scope="scope">
{{ scope.row.采购合同名称 }}
</template>
</el-table-column>
<el-table-column label="规定到货时间" width="100" align="center">
<template slot-scope="scope">
{{ scope.row.规定到货时间.split(' ')[0] }}
</template>
</el-table-column>
<el-table-column label="供应商" min-width="150" align="center">
<template slot-scope="scope">
{{ scope.row.供应商名称 }}
</template>
</el-table-column>
<el-table-column label="总金额" width="70" align="center">
<template slot-scope="scope">
{{ scope.row.总金额 }}
</template>
</el-table-column>
<el-table-column label="付款方式" width="80" align="center">
<template slot-scope="scope">
{{ scope.row.付款方式内容 }}
</template>
</el-table-column>
<el-table-column label="欠款金额" min-width="70" align="center">
<template slot-scope="scope">
{{ scope.row.欠款金额 }}
</template>
</el-table-column>
<el-table-column label="采购员" width="70" align="center">
<template slot-scope="scope">
{{ scope.row.姓名 }}
</template>
</el-table-column>
<el-table-column label="本次请款金额" min-width="100" align="center">
<template slot-scope="scope">
<el-input v-model="scope.row.本次应请款" size="mini" style="width:70px"/>
</template>
</el-table-column>
<el-table-column label="请款付款情况" width="900" align="center">
<template slot-scope="scope">
<el-table :id="scope.$index" :data="tableData11[scope.$index]" size="mini" border style="width: 100%;">
<el-table-column label="取消请款" width="100" align="center">
<template slot-scope="scope">
<el-button
:disabled="scope.row.审核情况流水号!==3"
type="danger"
size="mini"
@click="cancelRequestFund(scope.row)">取消请款</el-button>
</template>
</el-table-column>
<el-table-column label="次数" min-width="60" align="center" type="index"/>
<el-table-column label="请款金额" width="70" align="center">
<template slot-scope="scope">
{{ scope.row.请款金额 }}
</template>
</el-table-column>
<el-table-column label="请款时间" width="90" align="center">
<template slot-scope="scope">
{{ scope.row.请款时间 ? scope.row.请款时间.split(' ')[0] : '' }}
</template>
</el-table-column>
<el-table-column label="审核情况" width="80" align="center">
<template slot-scope="scope">
{{ scope.row.审核情况内容 }}
</template>
</el-table-column>
<el-table-column label="未通过审核原因" width="110" align="center">
<template slot-scope="scope">
{{ scope.row.未通过审核原因 }}
</template>
</el-table-column>
<el-table-column label="审批情况" width="80" align="center">
<template slot-scope="scope">
{{ scope.row.审批情况内容 }}
</template>
</el-table-column>
<el-table-column label="未通过审批原因" width="110" align="center">
<template slot-scope="scope">
{{ scope.row.未通过审批原因 }}
</template>
</el-table-column>
<el-table-column label="付款情况" width="80" align="center">
<template slot-scope="scope">
{{ scope.row.付款情况内容 }}
</template>
</el-table-column>
<el-table-column label="未付款原因" width="110" align="center">
<template slot-scope="scope">
{{ scope.row.未付款原因 }}
</template>
</el-table-column>
</el-table>
</template>
</el-table-column>
</el-table>
<div class="block" style="margin-top: 10px;">
<el-pagination
:current-page="pageCurrent1"
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize1"
:total="total1"
style="display:inline-block;width:50%"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange1"
@current-change="handleCurrentChange1"/>
</div>
</el-card>
<el-card>
<span>请款时间区间:</span>
<el-date-picker
v-model="startRequestDate"
size="small"
type="date"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="开始日期"/>
<el-date-picker
v-model="endRequestDate"
size="small"
type="date"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
placeholder="结束日期"/>
<el-button
type="success"
size="small"
icon="el-icon-search"
style="margin-left:10px"
@click="searchRequestTable">查询</el-button>
<el-button
type="warning"
size="small"
icon="el-icon-download"
style="margin-left:10px"
>导出Excel</el-button>
</el-card>
<el-card>
<el-table v-loading="loading2" :data="tableData2" size="mini" border style="width: 100%;min-height:300px" height="300px">
<el-table-column label="采购合同编号" min-width="150" align="center">
<template slot-scope="scope">
{{ scope.row.采购合同编号 }}
</template>
</el-table-column>
<el-table-column label="采购合同名称" min-width="150" align="center">
<template slot-scope="scope">
{{ scope.row.采购合同名称 }}
</template>
</el-table-column>
<el-table-column label="规定到货时间" width="100" align="center">
<template slot-scope="scope">
{{ scope.row.规定到货时间.split(' ')[0] }}
</template>
</el-table-column>
<el-table-column label="供应商" min-width="250" align="center">
<template slot-scope="scope">
{{ scope.row.供应商名称 }}
</template>
</el-table-column>
<el-table-column label="总金额" min-width="80" align="center">
<template slot-scope="scope">
{{ scope.row.总金额 }}
</template>
</el-table-column>
<el-table-column label="付款方式" min-width="80" align="center">
<template slot-scope="scope">
{{ scope.row.付款方式内容 }}
</template>
</el-table-column>
<el-table-column label="欠款金额" min-width="80" align="center">
<template slot-scope="scope">
{{ scope.row.欠款金额 }}
</template>
</el-table-column>
<el-table-column label="采购员" width="70" align="center">
<template slot-scope="scope">
{{ scope.row.姓名 }}
</template>
</el-table-column>
<el-table-column label="请款金额" min-width="80" align="center">
<template slot-scope="scope">
{{ scope.row.请款金额 }}
</template>
</el-table-column>
<el-table-column label="请款时间" width="100" align="center">
<template slot-scope="scope">
{{ scope.row.请款时间.split(' ')[0] }}
</template>
</el-table-column>
</el-table>
</el-card>
</div>
</template>
<script>
import { searchTable1, requestFund, searchCondition, cancelRequestFund, searchRequestTable, initBuyer } from '@/api/WorkshopProcurement/DepartmentBuyerRequestFund'
import { mapGetters } from 'vuex'
export default {
data() {
return {
personValue: '',
person: [],
loading2: false,
tableData2: [],
tableData11: [],
total1: 0,
pageCurrent1: 1,
pageSize1: 10,
startDate: '',
endDate: '',
contractNum: '',
submitDisable: true,
form1: {},
supplierName: '',
tableData01: [],
tableData1: [],
check1: 0,
check2: 0,
check3: 0,
check4: 0,
startRequestDate: '',
endRequestDate: '',
checkRequest: 0
}
},
computed: {
...mapGetters([
'sidebar',
'avatar',
'name',
'id'
])
},
created() {
this.initBuyer()
},
methods: {
initBuyer() { // 初始化采购人员
initBuyer().then(response => {
for (let i = 0; i < response.data.length; i++) {
this.person.push({
text: response.data[i].姓名,
label: response.data[i].姓名,
value: response.data[i].人员编号
})
}
})
},
searchTable1() {
this.tableData1 = []
this.startDate && this.endDate ? this.check1 = 1 : this.check1 = 0
this.contractNum ? this.check2 = 1 : this.check2 = 0
this.personValue ? this.check3 = 1 : this.check3 = 0
this.supplierName ? this.check4 = 1 : this.check4 = 0
searchTable1(this.pageCurrent1, this.pageSize1, this.check1, this.startDate, this.endDate, this.check2, this.contractNum, this.check3, this.personValue, this.check4, this.supplierName).then(response => {
for (let j = 0; j < response.data.rows.length; j++) {
this.tableData11[j] = []
searchCondition(response.data.rows[j].采购合同流水号).then(response0 => {
if (response0.data.length === 0) {
this.tableData11[j].push(response0.data)
document.getElementById(j).setAttribute('style', 'display:none')
} else {
for (let i = 0; i < response0.data.length; i++) {
this.tableData11[j].push(response0.data[i])
}
}
})
}
this.tableData1 = response.data.rows
this.total1 = response.data.total
})
},
handleSizeChange1(val) {
this.pageCurrent1 = 1
this.pageSize1 = val
this.searchTable1()
},
handleCurrentChange1(val) {
this.pageCurrent1 = val
this.searchTable1()
},
requestFund(row) { // 请款
const day1 = new Date()
const day2 = day1.getFullYear() + '-' + (day1.getMonth() + 1) + '-' + day1.getDate()
requestFund(row.采购合同流水号, row.本次应请款, day2, this.id).then(response => {
if (response.data[0].result === '1') {
this.$message.success('请款成功')
this.searchTable1()
this.startRequestDate = ''
this.endRequestDate = ''
this.tableData2 = []
} else { this.$message.error('请款失败') }
})
},
cancelRequestFund(row) { // 取消请款
console.log(row)
this.$confirm('确认取消请款吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
if (parseInt(row.采购科请款流水号) !== 1) {
cancelRequestFund(row.采购科请款流水号).then(response => {
if (response.data[0].result === '1') {
this.$message.success('操作成功')
this.searchTable1()
this.startRequestDate = ''
this.endRequestDate = ''
this.tableData2 = []
} else { this.$message.error('操作失败') }
})
} else {
this.$message.error('财务已经付款')
}
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
})
})
},
searchRequestTable() { // 查询请款表
this.loading2 = true
if ((this.startRequestDate === '' || this.startRequestDate === null) && (this.endRequestDate === '' || this.endRequestDate === null)) {
this.checkRequest = 0
} else if (this.startRequestDate !== '' && this.startRequestDate !== null && this.endRequestDate !== '' && this.endRequestDate !== null) {
this.checkRequest = 1
} else {
this.$message.error('请款时间区间有误')
this.loading2 = false
return
}
searchRequestTable(this.checkRequest, this.startRequestDate, this.endRequestDate).then(response => {
for (let j = 0; j < response.data.length; j++) {
if (response.data[j].请款时间 !== null) {
response.data[j].请款时间 = response.data[j].请款时间.substring(0, response.data[j].请款时间.indexOf(' '))
}
}
this.tableData2 = response.data
this.loading2 = false
})
}
}
}
</script>
<style scoped>
.el-card{
margin-bottom: 15px;
}
.el-date-editor{
width:150px!important;
}
.el-select{
width:200px
}
.el-input{
width:200px
}
span{
margin: 10px 0 10px 10px;
}
.searchForm .el-form-item{
margin-bottom: 5px;
}
</style>