<template>
|
<div class="flex_column">
|
<div>
|
<TableCard title="年度计划表">
|
<template v-slot:form>
|
<div class="items_center">
|
<span>编制人</span>
|
<el-input v-model="yearForm.organizationPerson" class="search" placeholder="请输入"
|
size="small"></el-input>
|
<el-button size="small" type="primary" @click="getYearPlanList">查询</el-button>
|
<el-button size="small" @click="clearYear">清空</el-button>
|
</div>
|
<UploadExcel @upload="getYearPlanList"></UploadExcel>
|
</template>
|
<template v-slot:table>
|
<ZTTable
|
ref="yearTable"
|
:column="yearColumnData"
|
:height="'calc(100vh - 38em)'"
|
:highlightCurrentRow="true"
|
:rowClick="rowClick"
|
:table-data="yearTableData"
|
:table-loading="yearLoading"
|
style="margin-top: 0.5em;
|
padding: 0 15px;"
|
>
|
</ZTTable>
|
<el-divider></el-divider>
|
<!-- 分页 -->
|
<div class="pagination">
|
<div></div>
|
<el-pagination :page-size="yearPage.pageSize" :page-sizes="[10, 20, 30, 40]"
|
:total="yearPage.total" layout="total, sizes, prev, pager, next, jumper"
|
@current-change="handleYearCurrent" @size-change="handleYearSizeChange">
|
</el-pagination>
|
</div>
|
</template>
|
</TableCard>
|
</div>
|
<div style="width: 100%; height: 0.5em; background-color: #f5f7fb;"></div>
|
<div>
|
<TableCard title="年度计划明细表">
|
<template v-slot:form>
|
<div class="items_center">
|
<span>监督日期</span>
|
<el-date-picker v-model="yearDetailForm.date" class="date_box" format="yyyy-MM-dd" placeholder="选择日期"
|
size="small" type="date" value-format="yyyy-MM-dd">
|
</el-date-picker>
|
<span>监督项目</span>
|
<el-input v-model="yearDetailForm.project" class="search" placeholder="请输入" size="small"></el-input>
|
<el-button size="small" type="primary" @click="getYearDetailPlanList">查询</el-button>
|
<el-button size="small" @click="clearDetail">清空</el-button>
|
</div>
|
<div>
|
<el-button v-if="isOperation" size="small" type="primary" @click="showDialog('add')">新增</el-button>
|
</div>
|
</template>
|
<template v-slot:table>
|
<ZTTable :column="yearDetailColumnData" :height="'calc(100vh - 38em)'" :table-data="yearDetailTableData"
|
:table-loading="yearDetailLoading" style="margin-top: 18px; padding: 0 15px;">
|
</ZTTable>
|
<el-divider></el-divider>
|
<!-- 分页 -->
|
<div class="pagination">
|
<div></div>
|
<el-pagination :page-size="yearDeatilPage.pageSize" :page-sizes="[10, 20, 30, 40]"
|
:total="yearDeatilPage.total" layout="total, sizes, prev, pager, next, jumper"
|
@current-change="handleYearDetailCurrent" @size-change="handleYearDetailSizeChange">
|
</el-pagination>
|
</div>
|
</template>
|
</TableCard>
|
</div>
|
<PlanAdd ref="planModal" :planId="planId" @submit="handleForm"></PlanAdd>
|
</div>
|
</template>
|
<script>
|
import TableCard from "../../../TableCard/index.vue"
|
import PlanAdd from "./Add.vue"
|
import ZTTable from '../../../ZTTable/index.vue'
|
import UploadExcel from "./UploadExcel.vue"
|
import { yearPlanListApi, yearDetailPlanListApi, delYearPlanApi, delYearPlanDetailApi, yearPlanDetailApprovalApi, exportSuperVisePlanApi} from "../../../../../assets/api/api"
|
|
export default {
|
components: {
|
TableCard,
|
PlanAdd,
|
ZTTable,
|
UploadExcel
|
},
|
data() {
|
return {
|
planId: undefined,
|
yearForm: {
|
organizationPerson: undefined,
|
},
|
yearTableData: [], // 年表
|
yearPage: {
|
curent: 1,
|
pageSize: 20,
|
total: 0
|
},
|
yearColumnData: [
|
{
|
label: '文件名称',
|
prop: 'fileName',
|
minWidth: '150px'
|
}, {
|
label: '编制人',
|
prop: 'organizationPerson',
|
minWidth: '100'
|
}, {
|
label: '编制日期',
|
prop: 'organizationDate',
|
minWidth: '160'
|
}, {
|
label: '批准人',
|
prop: 'approvalName',
|
minWidth: '100'
|
}, {
|
label: '批准日期',
|
prop: 'approvalDate',
|
minWidth: '160'
|
}, {
|
label: '审核人',
|
prop: 'examine'
|
}, {
|
dataType: 'tag',
|
label: '批准状态',
|
prop: 'approvalStatus',
|
minWidth: '130',
|
formatData: (params) => {
|
if (params == 1) {
|
return '批准'
|
} else {
|
return '不批准'
|
}
|
},
|
formatType: (params) => {
|
if (params == 1) {
|
return 'success'
|
} else {
|
return 'danger'
|
}
|
}
|
}, {
|
label: '创建日期',
|
prop: 'createTime',
|
minWidth: '160'
|
}, {
|
label: '创建人',
|
prop: 'createName',
|
minWidth: '100'
|
}, {
|
dataType: 'action',
|
minWidth: '160',
|
label: '操作',
|
fixed: 'right',
|
operation: [
|
{
|
name: '导出',
|
type: 'text',
|
clickFun: (row) => {
|
this.downLoadPost(row)
|
}
|
},
|
{
|
name: '批准',
|
type: 'text',
|
disabled: (row) => {
|
if (row.approvalStatus == 1) {
|
return true
|
} else {
|
return false
|
}
|
},
|
clickFun: (row) => {
|
this.approvalYearPlan(row)
|
}
|
},
|
{
|
name: '删除',
|
type: 'text',
|
color: '#f56c6c',
|
clickFun: (row) => {
|
this.delYearPlan(row.id)
|
}
|
}
|
]
|
}],
|
yearLoading: false,
|
yearDetailForm: {
|
date: undefined,
|
project: undefined
|
},
|
yearDetailTableData: [], // 年明细表
|
yearDeatilPage: {
|
curent: 1,
|
pageSize: 20,
|
total: 0
|
},
|
yearDetailColumnData: [
|
{
|
label: '监督日期',
|
prop: 'superviseDate'
|
}, {
|
label: '监督目的',
|
prop: 'superviseDes'
|
}, {
|
label: '被监督人员',
|
prop: 'supervisePerson'
|
}, {
|
label: '备注',
|
prop: 'remarks'
|
}, {
|
label: '培训日期',
|
prop: 'trainDate'
|
}, {
|
label: '创建',
|
prop: 'createBy'
|
}, {
|
dataType: 'action',
|
width: '180',
|
label: '操作',
|
operation: [
|
{
|
name: '编辑',
|
type: 'text',
|
clickFun: (row) => {
|
this.$refs.planModal.showDialog(row, true)
|
}
|
},
|
{
|
name: '删除',
|
type: 'text',
|
color: '#f56c6c',
|
clickFun: (row) => {
|
this.delYearPlanDetail(row.id)
|
}
|
}
|
]
|
}
|
],
|
yearDetailLoading: false,
|
isOperation: false,
|
}
|
},
|
mounted() {
|
this.getYearPlanList()
|
// this.getYearDetailPlanList()
|
},
|
methods: {
|
/**
|
* @desc 查询年度计划列表
|
*/
|
async getYearPlanList() {
|
this.yearLoading = true
|
const { code, data } = await this.$axios({
|
method: 'get',
|
url: yearPlanListApi,
|
params: {
|
current: this.yearPage.curent,
|
size: this.yearPage.pageSize,
|
organizationPerson: this.yearForm.organizationPerson
|
}
|
})
|
if (code == 200) {
|
this.yearTableData = data.records
|
this.yearPage.total = data.total
|
if (this.yearTableData.length > 0) {
|
this.rowClick(this.yearTableData[0])
|
}
|
}
|
this.yearLoading = false
|
},
|
// 年计划分页
|
handleYearCurrent(page) {
|
this.yearPage.curent = page
|
this.getYearPlanList()
|
},
|
handleYearSizeChange(size) {
|
this.yearPage.pageSize = size
|
this.getYearPlanList()
|
},
|
// 年度计划表格，点击行数据后刷新详情
|
rowClick(row) {
|
const now = new Date();
|
const currentYear = now.getFullYear();
|
if (row.createTime.slice(0,4) == currentYear) {
|
this.isOperation = true;
|
} else {
|
this.isOperation = false;
|
}
|
this.planId = row.id
|
this.getYearDetailPlanList()
|
},
|
// 新增|编辑完成后做什么
|
handleForm() {
|
this.getYearDetailPlanList()
|
},
|
// 清除年
|
clearYear() {
|
this.$refs.yearTable.setCurrent()
|
this.yearForm.organizationPerson = undefined
|
this.getYearPlanList()
|
},
|
// 清除明细
|
clearDetail() {
|
this.yearDetailForm.date = undefined
|
this.yearDetailForm.project = undefined
|
this.getYearDetailPlanList()
|
},
|
|
/**
|
* @desc 查询年度计划明细
|
*/
|
async getYearDetailPlanList() {
|
this.yearDetailLoading = true
|
const { code, data } = await this.$axios({
|
method: 'get',
|
url: yearDetailPlanListApi,
|
params: {
|
planId: this.planId,
|
current: this.yearDeatilPage.curent,
|
size: this.yearDeatilPage.pageSize,
|
date: this.yearDetailForm.date,
|
project: this.yearDetailForm.project
|
}
|
})
|
if (code == 200) {
|
this.yearDetailTableData = data.records
|
this.yearDeatilPage.total = data.total
|
}
|
this.yearDetailLoading = false
|
},
|
showDialog(operationType,row, type = false) {
|
if (operationType === 'add') {
|
if (!this.planId) {
|
this.$message.warning('请选择一条计划进行新增')
|
return
|
}
|
}
|
this.$refs.planModal.showDialog({planId:this.planId,...row}, type)
|
},
|
|
|
|
// 年明细计划分页
|
handleYearDetailCurrent(page) {
|
this.yearDeatilPage.curent = page
|
this.getYearDetailPlanList()
|
},
|
handleYearDetailSizeChange(size) {
|
this.yearDeatilPage.pageSize = size
|
this.getYearDetailPlanList()
|
},
|
// 删除年计划
|
delYearPlan(id) {
|
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(async () => {
|
const { code } = await this.$axios({
|
method: 'delete',
|
url: delYearPlanApi,
|
params: { id }
|
})
|
if (code == 200) {
|
this.$message.success('删除成功')
|
this.getYearPlanList()
|
this.getYearDetailPlanList()
|
} else {
|
this.$message.error('删除失败')
|
}
|
})
|
},
|
// 删除年计划明细
|
delYearPlanDetail(id) {
|
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(async () => {
|
const { code } = await this.$axios({
|
method: 'delete',
|
url: delYearPlanDetailApi,
|
params: { id }
|
})
|
if (code == 200) {
|
this.$message.success('删除成功')
|
this.getYearDetailPlanList()
|
} else {
|
this.$message.error('删除失败')
|
}
|
})
|
},
|
// 批准年度计划
|
approvalYearPlan(row) {
|
this.$confirm('确认批准该年度计划?', '提示', {
|
confirmButtonText: '批准',
|
cancelButtonText: '不批准',
|
type: 'info'
|
}).then(() => {
|
this.approvalYearPlanFun(1, row.id)
|
}).catch(action => {
|
this.approvalYearPlanFun(0, row.id)
|
})
|
},
|
// 年度计划表-下载
|
downLoadPost(row) {
|
this.$axios.get(exportSuperVisePlanApi + '?id=' + row.id,{responseType: "blob"}).then(res => {
|
this.outLoading = false
|
this.$message.success('导出成功')
|
const blob = new Blob([res],{ type: 'application/msword' });
|
const url = URL.createObjectURL(blob);
|
const link = document.createElement('a');
|
link.href = url;
|
link.download = row.fileName + '.docx';
|
link.click();
|
})
|
},
|
async approvalYearPlanFun(approvalStatus, rowId) {
|
const { code } = await this.$axios({
|
method: 'get',
|
url: yearPlanDetailApprovalApi,
|
params: {
|
id: rowId,
|
approvalStatus: approvalStatus
|
},
|
})
|
if (code == 200) {
|
this.$message.success('操作成功！')
|
this.getYearPlanList()
|
} else {
|
this.$message.error('操作成功！')
|
}
|
}
|
}
|
}
|
</script>
|
<style scoped>
|
.flex_column {
|
display: flex;
|
height: 80vh;
|
flex-direction: column;
|
overflow: auto;
|
justify-content: space-between;
|
}
|
|
.pagination {
|
display: flex;
|
justify-content: space-between
|
}
|
|
.items_center {
|
display: flex;
|
align-items: center;
|
}
|
|
.date_box {
|
margin: 0 5px;
|
}
|
|
.search {
|
width: 150px;
|
padding: 0 16px;
|
}
|
</style>
|
