<template>
|
<div class="app-container">
|
<el-container>
|
<el-header class="header-title">项目名称：{{ planInfoData.projectName }} ({{ planInfoData.planTime}} {{ planInfoData.planTimeFlag === 0 ? '月度计划' : planInfoData.planTimeFlag === 1 ? '季度计划' : '年度计划' }})</el-header>
|
<h4 style="text-align: center">项目代码：{{ planInfoData.projectCode }}</h4>
|
<el-main>
|
<el-card shadow="hover">
|
<el-row :gutter="20">
|
<el-col :span="24" class="mb-4">
|
<!--项目计划项-->
|
<el-table :data="tableData" border stripe style="width: 100%; margin-bottom: 20px">
|
<el-table-column prop="index" label="序号" width="50" align="center">
|
<template #default="scope">
|
{{ scope.$index + 1 }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="taskName" label="事项名称" width="500" align="center">
|
<template #default="scope">
|
<el-input type="textarea" v-model="scope.row.title" placeholder="请输入" rows="3" :readonly="scope.row.planStatus !== 1" />
|
</template>
|
</el-table-column>
|
<el-table-column prop="startTime" label="计划开始时间" width="160" align="center" >
|
<template #default="scope">
|
<el-date-picker
|
v-model="scope.row.startTime"
|
type="date"
|
placeholder="选择日期"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
size="medium"
|
style="width: 130px"
|
:readonly="projectInfoData.managerFlag"/>
|
</template>
|
</el-table-column>
|
<el-table-column prop="endTime" label="计划完成时间" width="160" align="center" >
|
<template #default="scope">
|
<el-date-picker
|
v-model="scope.row.endTime"
|
type="date"
|
placeholder="选择日期"
|
value-format="yyyy-MM-dd HH:mm:ss"
|
size="medium"
|
style="width: 130px"
|
:readonly="projectInfoData.managerFlag" />
|
</template>
|
</el-table-column>
|
<el-table-column :label="planInfoData.planTimeFlag === 0 ? '月度' : planInfoData.planTimeFlag === 1 ? '季度' : '年度' " align="center">
|
{{ planInfoData.planTime }}{{ planInfoData.planTimeFlag === 0 ? '月度' : planInfoData.planTimeFlag === 1 ? '季度' : '年度' }}
|
</el-table-column>
|
<el-table-column prop="planStatus" label="状态" width="100" align="center">
|
<template #default="scope">
|
{{ scope.row.planStatus === 1 ? '已驳回' : scope.row.planStatus === 2 ? '已通过' : '未审核' }}
|
</template>
|
</el-table-column>
|
<div v-if="!projectInfoData.managerFlag">
|
<el-table-column fixed="right" label="操作" align="center">
|
<template #default="scope">
|
<!-- 状态为未审核 -->
|
<div v-if="scope.row.planStatus === 0"></div>
|
<!-- 状态为已驳回 -->
|
<div v-if="scope.row.planStatus === 1">
|
<el-button
|
size="medium"
|
type="text"
|
icon="el-icon-upload2"
|
@click="handleResubmit(scope.row)">重新上报</el-button>
|
<el-button
|
size="medium"
|
type="text"
|
icon="el-icon-refresh-left"
|
@click="handleReset(scope.$index)">重置</el-button>
|
</div>
|
<!-- 状态为已通过 -->
|
<div v-if="scope.row.planStatus === 2">
|
<el-button
|
size="medium"
|
type="text"
|
icon="el-icon-edit"
|
@click="handleDelay(scope.$index)">延期</el-button>
|
</div>
|
</template>
|
</el-table-column>
|
</div>
|
</el-table>
|
<div style="display: flex; align-items: center;">
|
<h1 style="margin: 0;">
|
计划投资金额（万元）：
|
</h1>
|
<el-input
|
placeholder="请输入投资金额"
|
style="flex: 1"
|
v-model="actualInvest"
|
clearable
|
:type="number"
|
@input="handleInput"
|
readonly>
|
</el-input>
|
</div>
|
|
<!--上级批复-->
|
<div style="margin-bottom: 10px; margin-top: 40px;">
|
<span style="font-size: 20px; font-weight: bold;">上级批复</span>
|
</div>
|
<el-table :data="departmentApprovalData" border stripe style="width: 100%; margin-bottom: 20px">
|
<el-table-column prop="index" label="序号" width="50" align="center">
|
<template #default="scope">
|
{{ scope.$index + 1 }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="title" label="事项名称" width="200" align="center" />
|
<el-table-column prop="departmentExamine" label="上级审核" width="130" align="center">
|
<template #default="scope">
|
<div v-if="projectInfoData.managerFlag">
|
<el-select
|
v-model="scope.row.departmentExamine"
|
:disabled="scope.row.planStatus === 2 || scope.row.planStatus === 1"
|
placeholder="请选择"
|
size="medium"
|
clearable>
|
<el-option label="同意" :value="0"></el-option>
|
<el-option label="驳回" :value="1"></el-option>
|
</el-select>
|
</div>
|
<div v-if="!projectInfoData.managerFlag">
|
{{ scope.row.departmentExamine === 0 ? '同意' : scope.row.departmentExamine === 1 ? '驳回' : '未审核' }}
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column prop="departmentApproval" label="批复内容" width="160" align="center">
|
<template v-if="projectInfoData.managerFlag" #default="scope">
|
<el-input
|
type="textarea"
|
v-model="scope.row.departmentApproval"
|
:readonly="scope.row.planStatus === 2 || scope.row.planStatus === 1"
|
placeholder="请输入"
|
rows="3" />
|
</template>
|
</el-table-column>
|
<el-table-column prop="departmentApprovalReply" label="批复回复" width="160" align="center">
|
<template #default="scope" v-if="!projectInfoData.managerFlag">
|
<el-input
|
type="textarea"
|
v-model="scope.row.departmentApprovalReply"
|
:readonly="scope.row.planStatus === 0"
|
placeholder="请输入"
|
rows="3" />
|
</template>
|
</el-table-column>
|
<el-table-column prop="manageExamine" label="主管部门审核" width="130" align="center" >
|
<template #default="scope">
|
<div v-if="!projectInfoData.managerFlag">
|
{{ scope.row.manageExamine === 0 ? '同意' : scope.row.manageExamine === 1 ? '驳回' : '未审核' }}
|
</div>
|
<div v-if="projectInfoData.managerFlag">
|
<el-select
|
v-model="scope.row.manageExamine"
|
:disabled="scope.row.planStatus === 2 || scope.row.planStatus === 1"
|
placeholder="请选择"
|
size="medium"
|
clearable>
|
<el-option label="同意" :value="0"></el-option>
|
<el-option label="驳回" :value="1"></el-option>
|
</el-select>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column prop="manageApproval" label="批复内容" width="160" align="center">
|
<template v-if="projectInfoData.managerFlag" #default="scope">
|
<el-input
|
type="textarea"
|
v-model="scope.row.manageApproval"
|
:readonly="scope.row.planStatus === 2 || scope.row.planStatus === 1"
|
placeholder="请输入"
|
rows="3" />
|
</template>
|
</el-table-column>
|
<el-table-column prop="manageApprovalReply" label="批复回复" width="160" align="center">
|
<template #default="scope" v-if="!projectInfoData.managerFlag">
|
<el-input
|
type="textarea"
|
v-model="scope.row.manageApprovalReply"
|
:readonly="scope.row.planStatus === 0"
|
placeholder="请输入"
|
rows="3" />
|
</template>
|
</el-table-column>
|
<el-table-column prop="planStatus" label="状态" width="200" align="center" >
|
<template #default="scope">
|
{{ scope.row.planStatus === 1 ? '已驳回' : scope.row.planStatus === 2 ? '已通过' : '未审核' }}
|
</template>
|
</el-table-column>
|
<el-table-column fixed="right" label="操作" align="center" width="200">
|
<template #default="scope">
|
<div v-if="!projectInfoData.managerFlag">
|
<el-button
|
size="medium"
|
type="text"
|
icon="el-icon-reply"
|
@click="handleReply(scope.$index)"
|
:disabled="scope.row.planStatus === 0">回复</el-button>
|
<el-button
|
size="medium"
|
type="text"
|
icon="el-icon-refresh-left"
|
@click="handleReset(scope.$index)"
|
:disabled="scope.row.planStatus === 0">重置</el-button>
|
</div>
|
<div v-if="projectInfoData.managerFlag">
|
<el-button
|
size="medium"
|
type="text"
|
@click="handleExamine(scope.$index)"
|
v-if="scope.row.planStatus === 0">审核</el-button>
|
</div>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
|
<!--计划日志-->
|
<div style="margin-bottom: 10px; margin-top: 40px;">
|
<span style="font-size: 20px; font-weight: bold;">计划日志</span>
|
</div>
|
<el-table :data="planLogData" border stripe style="width: 100%; margin-bottom: 20px">
|
<el-table-column prop="index" label="序号" width="50" align="center">
|
<template #default="scope">
|
{{ scope.$index + 1 }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="title" label="事项名称" width="200" align="center" />
|
<el-table-column prop="departmentExamine" label="上级审核" width="100" align="center" >
|
<template #default="scope">
|
{{ scope.row.departmentExamine === 0 ? '同意' : scope.row.departmentExamine === 1 ? '驳回' : '未审核' }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="departmentApproval" label="批复内容" width="160" align="center" />
|
<el-table-column prop="departmentApprovalReply" label="批复回复" width="160" align="center" />
|
<el-table-column prop="manageExamine" label="主管部门审核" width="100" align="center" >
|
<template #default="scope">
|
{{ scope.row.manageExamine === 0 ? '同意' : scope.row.manageExamine === 1 ? '驳回' : '未审核' }}
|
</template>
|
</el-table-column>
|
<el-table-column prop="manageApproval" label="批复内容" width="160" align="center" />
|
<el-table-column prop="manageApprovalReply" label="批复回复" width="160" align="center" />
|
<el-table-column prop="gmtCreate" label="时间" align="center" />
|
</el-table>
|
</el-col>
|
</el-row>
|
</el-card>
|
</el-main>
|
</el-container>
|
</div>
|
</template>
|
|
<script>
|
import { getPlanInfoData, delayPlanInfo, getDepartmentApproval, getPlanLog, replyExamine, saveExamine, resubmitPlanInfo } from "@/api/projectPlan/index";
|
|
export default {
|
name: "planInfoCheck",
|
data() {
|
return {
|
loading: true,
|
// 接收传递过来的项目计划数据
|
planInfoData: {},
|
projectInfoData: {},
|
// 计划项数据
|
tableData: [
|
{
|
title: '',
|
startTime: '',
|
endTime: ''
|
},
|
],
|
// 上级批复数据
|
departmentApprovalData: [],
|
// 计划日志数据
|
planLogData: [],
|
// 投资金额
|
actualInvest: '',
|
// 新增参数
|
addData: {
|
projectPlanRecordId: '',
|
actualInvest: '',
|
addList: []
|
}
|
}
|
},
|
|
methods: {
|
// 页面加载
|
search() {
|
this.getPlanInfoData(this.planInfoData.id); // 获取项目计划项
|
this.getDepartmentApproval(this.planInfoData.id); // 获取上级批复
|
this.getPlanLog(this.planInfoData.id); // 获取计划日志
|
},
|
// 获取传递过来的项目计划详情
|
getPlanRecordData() {
|
// 从查询参数中获取数据
|
this.projectInfoData = JSON.parse(this.$route.query.projectInfoData)
|
this.planInfoData = JSON.parse(this.$route.query.data)
|
this.search();
|
},
|
// 获取项目计划项
|
getPlanInfoData(id) {
|
getPlanInfoData(id).then(response => {
|
this.actualInvest = response.data.actualInvest;
|
if (response.data.list.length === 0) {
|
this.tableData = [{title: '', startTime: '', endTime: ''}];
|
} else {
|
this.tableData = response.data.list;
|
}
|
});
|
},
|
// 用户重新上报计划项
|
handleResubmit(data) {
|
resubmitPlanInfo(data).then(response => {
|
this.$message.success('重新上报成功');
|
this.search()
|
});
|
},
|
// 延期
|
handleDelay(index) {
|
delayPlanInfo(this.tableData[index]).then(response => {
|
this.$message.success('延期成功');
|
this.search()
|
});
|
},
|
// 获取上级批复
|
getDepartmentApproval(projectPlanRecordId) {
|
getDepartmentApproval(projectPlanRecordId).then(response => {
|
this.departmentApprovalData = response.data;
|
});
|
},
|
// 回复审批
|
handleReply(index) {
|
replyExamine(this.departmentApprovalData[index]).then(response => {
|
this.$message.success('回复成功');
|
this.search()
|
});
|
},
|
// 保存审批
|
handleExamine(index) {
|
saveExamine(this.departmentApprovalData[index]).then(response => {
|
this.$message.success('审批成功');
|
this.search()
|
});
|
},
|
// 获取计划日志
|
getPlanLog(projectPlanRecordId) {
|
getPlanLog(projectPlanRecordId).then(response => {
|
this.planLogData = response.data;
|
});
|
},
|
// 重置当前行数据
|
handleReset(index) {
|
this.tableData[index].title = '';
|
this.tableData[index].startTime = '';
|
this.tableData[index].endTime = '';
|
},
|
},
|
created() {
|
this.getPlanRecordData();
|
},
|
};
|
</script>
|
|
<style scoped>
|
.header-title {
|
font-size: 24px; /* 根据需要调整字体大小 */
|
text-align: center; /* 居中对齐 */
|
line-height: 64px; /* 如果需要与 header 高度对齐 */
|
}
|
</style>
|
