<template>
|
<div class="app-container">
|
<!-- 搜索区域 -->
|
<div class="filter-container">
|
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
|
<el-form-item label="批次号">
|
<el-input v-model="queryParams.batchNumber" size="small" placeholder="请输入" clearable></el-input>
|
</el-form-item>
|
<el-form-item label="状态">
|
<el-select v-model="queryParams.status" placeholder="请选择" clearable>
|
<el-option label="待审核" value="0"></el-option>
|
<el-option label="已通过" value="1"></el-option>
|
<el-option label="已驳回" value="2"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" size="small" @click="handleQuery">查询</el-button>
|
<el-button type="primary" size="small" @click="handleReset">重置</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
|
<!-- 功能按钮区域 -->
|
<div class="button-container">
|
<el-button type="primary" size="small" v-permission="['placement-batch/add']" @click="handleImportAll">新增资金批次</el-button>
|
<el-button type="success" size="small" v-permission="['placement-batch/downLoad']" @click="handleExportTemplate">下载资金导入模版</el-button>
|
<el-button type="success" size="small" v-permission="['placement-batch/down']" @click="handleImportTemplate">下载购房信息表导入模版</el-button>
|
</div>
|
|
<!-- 表格区域 -->
|
<el-table v-loading="loading" :data="tableData" border style="width: 100%">
|
<el-table-column type="index" label="序号" width="50" align="center" />
|
<el-table-column prop="batchNumber" label="批次号" align="center" />
|
<el-table-column prop="householdsNum" label="申请总户数" align="center" />
|
<el-table-column prop="personNum" label="申请总人数" align="center" />
|
<el-table-column prop="totalAmount" width="120" label="补偿资金总额（万元）" align="center" />
|
<el-table-column prop="downPaymentAmount" label="25%首付款（万元）" align="center" />
|
<el-table-column prop="quarterPayAmount" label="每季度需支付款项（万元）" align="center" />
|
<el-table-column prop="subsidyAmount" label="过渡补贴（万元）" align="center" />
|
<el-table-column prop="businessArea" label="新建商品房（㎡）" align="center" />
|
<el-table-column prop="oldArea" label="二手住房（㎡）" align="center" />
|
<el-table-column prop="newArea" label="新建商业用房（㎡）" align="center" />
|
<el-table-column prop="parkingArea" label="新建停车位（个）" align="center" />
|
<el-table-column prop="status" label="状态" align="center">
|
<template slot-scope="scope">
|
<el-tag v-if="scope.row.status == '0'" type="warning">待审核</el-tag>
|
<el-tag v-if="scope.row.status == '1'" type="success">已通过</el-tag>
|
<el-tag v-if="scope.row.status == '2'" type="danger">已驳回</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" align="center" width="200">
|
<template slot-scope="scope">
|
<el-button size="mini" v-permission="['placement-batch/detail']" v-if="scope.row.status != '0'" type="text" @click="handleView(scope.row)">详情</el-button>
|
<el-button size="mini" v-permission="['placement-batch/view']" type="text" @click="handleViewDetail(scope.row)">查看</el-button>
|
<el-button size="mini" v-permission="['placement-batch/approval']" v-if="scope.row.status == '0'" type="text" @click="handleApproval(scope.row)">审核</el-button>
|
<el-button size="mini" v-permission="['placement-batch/del']" v-if="scope.row.status != '0'" type="text" @click="handleDelete(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<!-- 分页区域 -->
|
<div class="pagination-container">
|
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
:current-page="queryParams.pageNum" :page-sizes="[10, 20, 30, 40]" :page-size="queryParams.pageSize"
|
layout="total, sizes, prev, pager, next, jumper" :total="total">
|
</el-pagination>
|
</div>
|
|
<export-money-applay :batchNumber="null" :visible.sync="dialogVisible" @importPrice="importPrice" @close="dialogVisible = false" />
|
<approval-dialog :visible.sync="approvalDialogVisible" :type="type" @audit-submit="auditSubmit" :placementBatchId="placementBatchId" @close="approvalDialogVisible = false" />
|
</div>
|
</template>
|
|
<script>
|
import ExportMoneyApplay from './components/exportMoneyApplay.vue'
|
import ApprovalDialog from './components/ApprovalDialog.vue'
|
import { downLoad } from '@/utils'
|
import {
|
getPlacementBatchList,
|
deletePlacementBatch,
|
importPlacementBatch,
|
auditPlacementBatch
|
} from '@/api/placement-details'
|
|
export default {
|
name: 'PlacementBatch',
|
components: {
|
ExportMoneyApplay,
|
ApprovalDialog
|
},
|
data() {
|
return {
|
// 遮罩层
|
loading: false,
|
// 弹窗
|
dialogVisible: false,
|
// 审核弹窗
|
approvalDialogVisible: false,
|
// 总条数
|
total: 0,
|
// 表格数据
|
tableData: [],
|
// 安置批次id
|
placementBatchId: 0,
|
// 审核类型
|
type: 'audit',
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
batchNumber: undefined,
|
status: undefined
|
},
|
dialogVisible: false
|
}
|
},
|
created() {
|
this.getList()
|
},
|
methods: {
|
/** 查询列表 */
|
getList() {
|
this.loading = true
|
getPlacementBatchList(this.queryParams).then(res => {
|
this.tableData = res.data.records || []
|
this.total = res.data.total || 0
|
this.loading = false
|
|
})
|
},
|
/** 搜索按钮操作 */
|
handleQuery() {
|
this.queryParams.pageNum = 1
|
this.getList()
|
},
|
/** 重置按钮操作 */
|
handleReset() {
|
// TODO: 实现新增逻辑
|
this.queryParams = {
|
pageNum: 1,
|
pageSize: 10,
|
batchNumber: undefined,
|
status: undefined
|
}
|
this.getList()
|
},
|
|
/** 分页 */
|
handleSizeChange(size) {
|
this.queryParams.pageSize = size
|
this.getList()
|
},
|
/** 分页 */
|
handleCurrentChange(page) {
|
this.queryParams.pageNum = page
|
this.getList()
|
},
|
/** 导入资金批次 */
|
handleImportAll() {
|
// TODO: 实现导出逻辑
|
this.dialogVisible = true
|
},
|
/** 下载模板 */
|
handleExportTemplate() {
|
// TODO: 实现下载模板逻辑
|
downLoad('/placement-batch/download-template/3', '资金导入模版.xlsx')
|
},
|
/** 下载临时安置模板 */
|
handleImportTemplate() {
|
// TODO: 实现下载临时安置模板逻辑
|
downLoad('/placement-batch/download-template/4', '购房信息表导入模版.xlsx')
|
},
|
/** 导入资金批次 */
|
importPrice(form) {
|
let formData = new FormData()
|
formData.append('assetFile', form.assetFile)
|
formData.append('householdFile', form.householdFile)
|
formData.append('batchNumber', form.batchNumber)
|
importPlacementBatch(formData).then(res => {
|
if (res.code == 200) {
|
this.$message.success('导入成功')
|
this.dialogVisible = false
|
this.getList()
|
}
|
})
|
},
|
/** 查看详情按钮操作 */
|
handleView(row) {
|
// TODO: 实现查看详情逻辑
|
this.type = 'detail'
|
this.placementBatchId = row.id
|
this.approvalDialogVisible = true
|
},
|
/** 查看详情按钮操作 */
|
handleViewDetail(row) {
|
// TODO: 实现查看详情逻辑
|
this.$router.push(`/placement/batch/personnel?id=${row.id}`)
|
},
|
/** 审核按钮操作 */
|
handleApproval(row) {
|
// TODO: 实现编辑逻辑
|
this.type = 'audit'
|
this.placementBatchId = row.id
|
this.approvalDialogVisible = true
|
},
|
/** 审核提交 */
|
auditSubmit(data) {
|
// TODO: 实现审核提交逻辑
|
auditPlacementBatch(data).then(res => {
|
if (res.code == 200) {
|
this.$message.success('审核成功')
|
this.placementBatchId = 0
|
this.approvalDialogVisible = false
|
this.getList()
|
}
|
})
|
},
|
/** 删除按钮操作 */
|
handleDelete(row) {
|
// TODO: 实现删除逻辑
|
this.$confirm('确定删除该安置批次吗？', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
deletePlacementBatch({ id: row.id }).then(res => {
|
if (res.code == 200) {
|
this.$message.success('删除成功')
|
this.getList()
|
}
|
})
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.app-container {
|
padding: 20px;
|
}
|
|
.filter-container {
|
margin-bottom: 20px;
|
}
|
|
.button-container {
|
margin-bottom: 20px;
|
}
|
</style>
|
