<template>
|
<div class="app-container">
|
<el-container>
|
<el-header v-show="projectInfoData && projectInfoData.projectName" class="header-title">项目名称：{{ projectInfoData.projectName }}</el-header>
|
<h4 v-show="projectInfoData && projectInfoData.projectCode" style="text-align: center">项目代码：{{ projectInfoData.projectCode }}</h4>
|
<el-main>
|
<el-card shadow="hover">
|
<el-row :gutter="20">
|
<div style="margin-bottom: 10px">
|
<el-link style="font-size: 20px; font-weight: bold;" @click="activeTab = 'month'">月度计划/</el-link>
|
<el-link style="font-size: 20px; font-weight: bold;" @click="activeTab ='season'">季度计划/</el-link>
|
<el-link style="font-size: 20px; font-weight: bold;" @click="activeTab = 'year'">年度计划</el-link>
|
</div>
|
<el-col :span="24" class="mb-4" style="margin-top: 20px" v-if="activeTab === 'month'">
|
<div v-for="(item, index) in monthProgress">
|
<div style="margin-bottom: 10px">
|
<span style="font-size: 18px;">{{ item.planTime }}{{ item.planTimeFlag === 0 ? '月度' : item.planTimeFlag === 1 ? '季度' : '年度' }}</span>
|
<el-table :data="item.planInfoList" 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="事项名称" align="center" />
|
<el-table-column prop="progressStatus" label="进度情况" align="center">
|
<template slot-scope="scope">
|
{{ scope.row.progressStatus === 0 ? '未完成' : scope.row.progressStatus === 1 ? '待审核' : scope.row.progressStatus === 2 ? '已驳回' : '已完成'}}
|
</template>
|
</el-table-column>
|
<el-table-column prop="startTime" label="计划开始时间" align="center" />
|
<el-table-column prop="endTime" label="计划完成时间" align="center" />
|
<el-table-column fixed="right" label="操作" align="center">
|
<template slot-scope="scope">
|
<el-button v-if="!projectInfoData.managerFlag" type="primary" size="small" :disabled="scope.row.progressStatus === 1 || scope.row.progressStatus === 3" @click="handleProgressReport(scope.row)">进度上报</el-button>
|
<el-button v-if="!projectInfoData.managerFlag" type="primary" size="small" @click="handleCheckProgress(scope.row)">查看</el-button>
|
<el-button v-if="projectInfoData.managerFlag" type="primary" size="small" @click="handleCheckProgress(scope.row)">审核</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="24" class="mb-4" style="margin-top: 20px" v-if="activeTab === 'season'" >
|
<div v-for="(item, index) in seasonProgress">
|
<div style="margin-bottom: 10px">
|
<span style="font-size: 18px;">{{ item.planTime }}{{ item.planTimeFlag === 0 ? '月度' : item.planTimeFlag === 1 ? '季度' : '年度' }}</span>
|
<el-table :data="item.planInfoList" 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="事项名称" align="center" />
|
<el-table-column prop="progressStatus" label="进度情况" align="center">
|
<template slot-scope="scope">
|
{{ scope.row.progressStatus === 0 ? '未完成' : scope.row.progressStatus === 1 ? '待审核' : scope.row.progressStatus === 2 ? '已驳回' : '已完成'}}
|
</template>
|
</el-table-column>
|
<el-table-column prop="startTime" label="计划开始时间" align="center" />
|
<el-table-column prop="endTime" label="计划完成时间" align="center" />
|
<el-table-column fixed="right" label="操作" align="center">
|
<template slot-scope="scope">
|
<el-button v-if="!projectInfoData.managerFlag" type="primary" size="small" :disabled="scope.row.progressStatus === 1 || scope.row.progressStatus === 3" @click="handleProgressReport(scope.row)">进度上报</el-button>
|
<el-button v-if="!projectInfoData.managerFlag" type="primary" size="small" @click="handleCheckProgress(scope.row)">查看</el-button>
|
<el-button v-if="projectInfoData.managerFlag" type="primary" size="small" @click="handleCheckProgress(scope.row)">审核</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</el-col>
|
<el-col :span="24" class="mb-4" style="margin-top: 20px" v-if="activeTab === 'year'">
|
<div v-for="(item, index) in yearProgress">
|
<div style="margin-bottom: 10px">
|
<span style="font-size: 18px;">{{ item.planTime }}{{ item.planTimeFlag === 0 ? '月度' : item.planTimeFlag === 1 ? '季度' : '年度' }}</span>
|
<el-table :data="item.planInfoList" 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="事项名称" align="center" />
|
<el-table-column prop="progressStatus" label="进度情况" align="center">
|
<template slot-scope="scope">
|
{{ scope.row.progressStatus === 0 ? '未完成' : scope.row.progressStatus === 1 ? '待审核' : scope.row.progressStatus === 2 ? '已驳回' : '已完成'}}
|
</template>
|
</el-table-column>
|
<el-table-column prop="startTime" label="计划开始时间" align="center" />
|
<el-table-column prop="endTime" label="计划完成时间" align="center" />
|
<el-table-column fixed="right" label="操作" align="center">
|
<template slot-scope="scope">
|
<el-button v-if="!projectInfoData.managerFlag" type="primary" size="small" :disabled="scope.row.progressStatus === 1 || scope.row.progressStatus === 3" @click="handleProgressReport(scope.row)">进度上报</el-button>
|
<el-button v-if="!projectInfoData.managerFlag" type="primary" size="small" @click="handleCheckProgress(scope.row)">查看</el-button>
|
<el-button v-if="projectInfoData.managerFlag" type="primary" size="small" @click="handleCheckProgress(scope.row)">审核</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</el-col>
|
<div style="margin-bottom: 10px">
|
<h1 style="font-size: 20px; font-weight: bold;">竣工报告</h1>
|
<div style="display: flex;margin-left: 20px;">
|
<file-upload v-model="projectProgressForm.completedReportFileList"
|
:fileType="projectProgressForm.accept"
|
:isShowTip="false"/>
|
</div>
|
</div>
|
<div style="margin-bottom: 10px">
|
<h1 style="font-size: 20px; font-weight: bold;">情况说明</h1>
|
<div style="display: flex;margin-left: 20px;">
|
<file-upload v-model="projectProgressForm.situationDescriptionFileList"
|
:fileType="projectProgressForm.accept"
|
:isShowTip="false"/>
|
</div>
|
</div>
|
<div style="display: flex; justify-content: center; align-items: center; margin-top: 20px;">
|
<el-button type="primary" @click="handleSave">保 存</el-button>
|
</div>
|
</el-row>
|
|
<el-dialog :title=" checkFlag ? '进度查看' : '进度上报' " :visible.sync="dialogFormVisible" custom-class="custom-dialog" :close-on-click-modal="false" @close="handleCancel">
|
<el-form :model="progressReportData">
|
<el-form-item label="报告期：" :label-width="formLabelWidth">
|
<el-input :value="progressReportData.planTime + (progressReportData.planTimeFlag === 0 ? '月度' : progressReportData.planTimeFlag === 1 ? '季度' : '年度')" readonly />
|
</el-form-item>
|
<el-form-item label="计划事项：" :label-width="formLabelWidth">
|
<el-input v-model="progressReportData.title" readonly />
|
</el-form-item>
|
<el-form-item label="计划时间：" :label-width="formLabelWidth">
|
<el-date-picker v-model="progressReportData.startTime" type="date" placeholder="选择日期" size="small" style="width: 130px" readonly/>
|
至
|
<el-date-picker v-model="progressReportData.endTime" type="date" placeholder="选择日期" size="small" style="width: 130px" readonly/>
|
</el-form-item>
|
<el-form-item label="实际完成时间：" :label-width="formLabelWidth">
|
<el-date-picker v-model="progressReportData.actualStartTime" type="date" placeholder="选择日期" size="small" style="width: 130px" :readonly="checkFlag && projectInfoData.managerFlag"/>
|
至
|
<el-date-picker v-model="progressReportData.actualEndTime" type="date" placeholder="选择日期" size="small" style="width: 130px" :readonly="checkFlag && projectInfoData.managerFlag"/>
|
</el-form-item>
|
<el-form-item label="进度情况：" :label-width="formLabelWidth">
|
<el-input type="textarea" v-model="progressReportData.progressStatus" placeholder="请输入" rows="3" :readonly="checkFlag && projectInfoData.managerFlag" />
|
</el-form-item>
|
<el-form-item label="工程进度附件：" :label-width="formLabelWidth">
|
<file-upload v-model="progressReportData.fileList"
|
:fileType="accept"
|
:isShowTip="false"/>
|
</el-form-item>
|
<el-form-item label="截止本报告完成投资：" :label-width="formLabelWidth">
|
<el-input v-model="progressReportData.actualInvest" type="number" :readonly="checkFlag && projectInfoData.managerFlag" />
|
</el-form-item>
|
<el-form-item label="上级审核：" :label-width="formLabelWidth">
|
<el-input v-if="!projectInfoData.managerFlag" :value="progressReportData.departmentExamine === 0 ? '同意' : progressReportData.departmentExamine === 1 ? '驳回' : '未审核'" readonly />
|
<el-select v-if="projectInfoData.managerFlag" v-model="progressReportData.departmentExamine" placeholder="请选择" size="small" clearable>
|
<el-option label="同意" :value="0"></el-option>
|
<el-option label="驳回" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="上级批复：" :label-width="formLabelWidth">
|
<el-input v-if="!projectInfoData.managerFlag" v-model="progressReportData.departmentApproval" readonly />
|
<el-input v-if="projectInfoData.managerFlag" v-model="progressReportData.departmentApproval" />
|
</el-form-item>
|
<el-form-item label="上级批复回复：" :label-width="formLabelWidth">
|
<el-input v-if="!projectInfoData.managerFlag" type="textarea" v-model="progressReportData.departmentApprovalReply" placeholder="请输入" rows="3" />
|
<el-input v-if="projectInfoData.managerFlag" type="textarea" v-model="progressReportData.departmentApprovalReply" placeholder="请输入" rows="3" :readonly="checkFlag" />
|
</el-form-item>
|
<el-form-item label="主管部门审核：" :label-width="formLabelWidth">
|
<el-input v-if="!projectInfoData.managerFlag" :value="progressReportData.manageExamine === 0 ? '同意' : progressReportData.manageExamine === 1 ? '驳回' : '未审核'" readonly />
|
<el-select v-if="projectInfoData.managerFlag" v-model="progressReportData.manageExamine" placeholder="请选择" size="small" clearable>
|
<el-option label="同意" :value="0"></el-option>
|
<el-option label="驳回" :value="1"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="主管部门审核批复：" :label-width="formLabelWidth">
|
<el-input v-if="!projectInfoData.managerFlag" v-model="progressReportData.manageApproval" readonly />
|
<el-input v-if="projectInfoData.managerFlag" v-model="progressReportData.manageApproval" />
|
</el-form-item>
|
<el-form-item label="主管部门批复回复：" :label-width="formLabelWidth">
|
<el-input v-if="!projectInfoData.managerFlag" type="textarea" v-model="progressReportData.manageApprovalReply" placeholder="请输入" rows="3" />
|
<el-input v-if="projectInfoData.managerFlag" type="textarea" v-model="progressReportData.manageApprovalReply" placeholder="请输入" rows="3" :readonly="checkFlag" />
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button type="primary" @click="handleRecordSubmit" v-if="!checkFlag && !projectInfoData.managerFlag">上 报</el-button>
|
<el-button type="primary" @click="handleRecordSubmit" v-if="projectInfoData.managerFlag">审 批</el-button>
|
<el-button @click="handleCancel">取 消</el-button>
|
</div>
|
</el-dialog>
|
</el-card>
|
</el-main>
|
</el-container>
|
</div>
|
</template>
|
|
<script>
|
import { getProgressInfoList, getProgressReport, recordSubmit, saveProjectProgressFileLists, getProjectProgressForm } from "@/api/projectManage/progress/index";
|
import progressRecord from "./progressRecord.vue";
|
|
export default {
|
name: "ProgressRecord",
|
computed: {
|
progressRecord() {
|
return progressRecord
|
}
|
},
|
data() {
|
return {
|
// 接收传递过来的项目计划数据
|
projectInfoData: {},
|
monthProgress: [],
|
seasonProgress: [],
|
yearProgress: [],
|
activeTab: "month", // 默认显示月度计划
|
|
dialogFormVisible: false,
|
// 查看显示
|
checkFlag: false,
|
progressReportData: {},
|
formLabelWidth: '150px',
|
|
// 竣工报告、情况说明附件
|
projectProgressForm: {
|
completedReportFileList: [],
|
situationDescriptionFileList: [],
|
projectReportId: null,
|
accept: ['pdf'],
|
},
|
|
// 进度上报附件类型
|
accept: ['pdf','jpg','mp4'],
|
}
|
},
|
methods: {
|
search() {
|
this.getProjectProgressForm(this.projectInfoData.id);
|
this.getProgressInfoList(this.projectInfoData.id);
|
},
|
// 获取传递过来的项目计划详情
|
getProjectInfoData() {
|
// 从查询参数中获取数据
|
this.projectInfoData = this.$route.query.data;
|
this.search();
|
},
|
getProjectProgressForm(id) {
|
getProjectProgressForm(id).then(res => {
|
this.projectProgressForm = res.data;
|
})
|
},
|
// 获取项目进度计划项
|
getProgressInfoList(id) {
|
getProgressInfoList(id).then(res => {
|
this.monthProgress = res.data.monthProgress;
|
this.seasonProgress = res.data.seasonProgress;
|
this.yearProgress = res.data.yearProgress;
|
})
|
},
|
// 进度上报
|
handleProgressReport(row) {
|
this.dialogFormVisible = true;
|
getProgressReport(row.id).then(res => {
|
this.progressReportData = res.data;
|
console.log(this.progressReportData)
|
})
|
},
|
// 上报提交
|
handleRecordSubmit() {
|
recordSubmit(this.progressReportData).then(res => {
|
this.dialogFormVisible = false;
|
this.$message.success('上报成功');
|
this.search();
|
})
|
},
|
// 查看进度
|
handleCheckProgress(row) {
|
this.dialogFormVisible = true;
|
this.checkFlag = true;
|
getProgressReport(row.id).then(res => {
|
this.progressReportData = res.data;
|
})
|
},
|
// 关闭弹窗
|
handleCancel() {
|
this.dialogFormVisible = false;
|
this.checkFlag = false;
|
},
|
// 保存
|
handleSave() {
|
this.projectProgressForm.projectReportId = this.projectInfoData.id;
|
// 判断文件不为空
|
saveProjectProgressFileLists(this.projectProgressForm).then(res => {
|
this.$message.success('保存成功');
|
this.search();
|
})
|
}
|
},
|
created() {
|
this.getProjectInfoData()
|
},
|
};
|
</script>
|
|
<style scoped>
|
.header-title {
|
font-size: 24px; /* 根据需要调整字体大小 */
|
text-align: center; /* 居中对齐 */
|
line-height: 64px; /* 如果需要与 header 高度对齐 */
|
}
|
|
.custom-dialog {
|
max-height: 70vh; /* 设置最大高度 */
|
overflow-y: auto; /* 允许垂直滚动 */
|
}
|
</style>
|
