<!--
|
* @Descripttion:
|
* @version:
|
* @Author: Pengjiantian
|
* @Date: 2019-08-26 15:08:09
|
* @LastEditors : PengJianTian
|
* @LastEditTime : 2019-12-25 14:14:52
|
-->
|
<template>
|
<div class="projectAbout" style="min-wdith:1054px">
|
<el-container style="min-width:auto">
|
<el-container class="projectContainer">
|
<el-aside class="projectSidebar" width="159px" style="height:100vh">
|
<el-menu :default-active="$route.path">
|
<el-menu-item-group>
|
<el-menu-item>
|
<router-link :to="goBack">
|
<el-button
|
round
|
size="mini"
|
@click="returnList"
|
class="returnList"
|
style="font-size:12px"
|
>
|
<i class="el-icon-back"></i>
|
返回列表
|
</el-button>
|
</router-link>
|
</el-menu-item>
|
</el-menu-item-group>
|
<el-menu-item
|
:index="'/area/projectManagement/add/' + item.tabName"
|
v-for="(item, index) in menu"
|
:disabled="!item.isClick"
|
:key="index"
|
@click="handleSwith(item.tabName, index)"
|
>
|
<span slot="title">{{item.tabNameDes}}</span>
|
</el-menu-item>
|
</el-menu>
|
</el-aside>
|
<el-container class="projectContent">
|
<el-main style="padding:0px 30px 100px;">
|
<router-view
|
ref="addPage"
|
@nextJumpPage="nextJumpPage"
|
@handleNextPage="handleNextPage"
|
@commitSaveBefore="commitSaveBefore"
|
@nextPage="nextPage"
|
id="area"
|
:nextChange="nextChange"
|
@notNext="notNext"
|
></router-view>
|
</el-main>
|
</el-container>
|
<el-footer id="project" style="height:100px;margin-left:160px">
|
<el-row :gutter="20" type="flex" justify="space-around">
|
<!-- 根据阶段号来区分显示上一页/上一步 -->
|
<el-col
|
:span="8"
|
v-if="detailsParams.menuPhaseNo || detailsParams.likeMenuPhaseNo || detailsParams.opertion==='02'"
|
style="margin-right:100px"
|
>
|
<el-button
|
class="blankBtn submitBtn"
|
size="mini"
|
v-if="noneSave"
|
@click="handleSave"
|
>保存</el-button>
|
<el-button
|
class="blankBtn submitBtn"
|
size="mini"
|
v-if="prevPageBtn"
|
@click="handlePrevPage"
|
>上一页</el-button>
|
<el-button
|
class="blueBtn submitBtn"
|
size="mini"
|
type="primary"
|
v-if="nextPageBtn && modifyProject"
|
@click="handleNextPage"
|
>下一页</el-button>
|
<!-- <el-button size="mini" type="primary" v-if="tabName===isSubmit" @click="handleFlowSubmit" :loading='btnLoading'>提交 </el-button> -->
|
<el-button
|
class="blueBtn submitBtn"
|
size="mini"
|
type="primary"
|
v-if="tabName===isSubmit && detailsParams.opertion === '01'"
|
@click="handleFlowSubmit"
|
v-loading="btnLoading"
|
>提交</el-button>
|
</el-col>
|
<el-col :span="8" v-else style="margin-right:100px">
|
<el-button
|
class="blankBtn submitBtn"
|
size="mini"
|
v-if="noneSave"
|
@click="handleSaveDraft"
|
>保存草稿</el-button>
|
<!-- applyStageTwoPage控制申请阶段 历史审批意见和历史流转记录的按钮显示 -->
|
<!-- {{!$route.path.includes('projectDeclarationInfo')}} -->
|
<template v-if="applyStageTwoPage">
|
<el-button
|
class="blankBtn submitBtn"
|
size="mini"
|
v-if="prevPageBtn"
|
@click="handlePrevPage"
|
>上一步</el-button>
|
<!-- {{nextPageBtn}} -->
|
<el-button
|
class="blueBtn submitBtn"
|
size="mini"
|
type="primary"
|
v-if="nextPageBtn&&!$route.path.includes('projectImageInfos')"
|
@click="handleChildSumbit"
|
>下一步</el-button>
|
<!-- {{!$route.path.includes('projectFinancingInformation')}} -->
|
</template>
|
<template v-else>
|
<el-button
|
class="blankBtn submitBtn"
|
size="mini"
|
v-if="prevPageBtn"
|
@click="handlePrevPage"
|
>上一页</el-button>
|
<el-button
|
class="blueBtn submitBtn"
|
size="mini"
|
type="primary"
|
v-if="nextPageBtn"
|
@click="handleNextPage"
|
>下一页</el-button>
|
</template>
|
<!-- <el-button size="mini" type="primary" v-if="tabName===isSubmit" @click="handleFlowSubmit" :loading='btnLoading'>提交 </el-button> -->
|
<el-button
|
class="blueBtn submitBtn"
|
size="mini"
|
type="primary"
|
v-if="(tabName===isSubmit && detailsParams.opertion === '01') || prevStep "
|
@click="handleFlowSubmit"
|
v-loading="btnLoading"
|
>提交</el-button>
|
</el-col>
|
<!-- 测试用 -->
|
<!-- <el-button class="blueBtn submitBtn" size="mini" type="primary" @click="handleFlowSubmit" v-loading='btnLoading'>提交 </el-button> -->
|
</el-row>
|
</el-footer>
|
</el-container>
|
<el-dialog :visible.sync="commitDialogVisible" width="20%" center :before-close="handleClose">
|
<div class="messageCheck">
|
<i class="el-icon-success checkSuccess"></i>
|
<div class="tip">提交成功</div>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="enterMessages">确 定</el-button>
|
</span>
|
</el-dialog>
|
</el-container>
|
</div>
|
</template>
|
|
<script>
|
import '../area/projectManagement/style/messagesBox.styl'
|
import { queryTabAttrs, projectFlowSubmit } from '@/api/area'
|
import { mapState } from 'vuex'
|
import { returnTaskPool } from '../comprehensiveTransaction/serve/public'
|
export default {
|
data: function() {
|
return {
|
btnLoading: false,
|
menu: [],
|
swithMenu: [],
|
nextPageBtn: false,
|
prevPageBtn: false,
|
flowSubmitBtn: false,
|
currentIndex: 0,
|
tabName: 'projectBasicInformation',
|
menuPhaseNo: '',
|
type: '',
|
goBack: '/area/projectManagement/index',
|
commitDialogVisible: false,
|
commitBefore: '',
|
nextChange: true, // 上/下一步不需要对数据保存提示 上/下一页需要对数据进行保存提示
|
prevStep: false,
|
currentTempIndex: null // 临时存放currentIndex
|
}
|
},
|
created() {
|
this.initMenu()
|
},
|
computed: {
|
isSubmit() {
|
if (!this._.isEmpty(this.menu)) {
|
let tabName = this._.find(this.menu, { checkSubmit: true }).tabName
|
return tabName
|
} else {
|
return ''
|
}
|
// return ''
|
},
|
// 修改时申报信息页存在下一页按钮的控制
|
modifyProject() {
|
if (
|
this.$route.path.includes('projectDeclarationInfo') &&
|
this.detailsParams.opertion === '02'
|
) {
|
return false
|
} else {
|
return true
|
}
|
},
|
...mapState({
|
detailsParams: state => state.risk.detailsParams
|
}),
|
// 历史审批意见,流程流转记录,项目评分,无保存草稿按钮控制
|
noneSave() {
|
if (
|
this.$route.path.includes('projectHistoricalApproval') ||
|
this.$route.path.includes('projectHistoricalFlow') ||
|
this.$route.path.includes('EvaluateData')
|
) {
|
return false
|
} else {
|
return true
|
}
|
},
|
// 申请阶段历史审批意见和流程流转记录按钮显示 上/下一页
|
applyStageTwoPage() {
|
if (
|
this.$route.path.includes('projectHistoricalApproval') ||
|
this.$route.path.includes('projectHistoricalFlow')
|
) {
|
return false
|
} else {
|
return true
|
}
|
}
|
},
|
methods: {
|
// 初始化
|
initMenu() {
|
this.type = this.$route.query.type
|
const { menuPhaseNo } = this.$route.query
|
if (this.type === 'check') {
|
this.goBack = '/area/' + this.type + '/index'
|
}
|
if (!this._.isEmpty(this.detailsParams.menuPhaseNo)) {
|
this.goBack =
|
'/area/check/index?menuPhaseNo=' + this.detailsParams.menuPhaseNo
|
}
|
let params = {
|
isManage: true,
|
modify: true,
|
dataType: this.detailsParams.dataType,
|
objectType: this.detailsParams.objectType,
|
projectFlag: this.detailsParams.projectFlag,
|
projectType: this.detailsParams.projectType,
|
serialno: this.detailsParams.objectNo,
|
menuPhaseNo
|
}
|
queryTabAttrs(params).then(res => {
|
this.menu = res.result
|
this.showFooterBtn(this.currentIndex)
|
})
|
},
|
// 菜单切换
|
handleSwith(value, index) {
|
this.tabName = value
|
this.currentIndex = index
|
this.showFooterBtn(this.currentIndex)
|
this.$router.push({ path: '/area/projectManagement/add/' + value })
|
// this.initMenu()
|
},
|
// 下一页
|
handleNextPage() {
|
if (this.detailsParams.phaseNo==='0060' && this.$route.path.includes('projectFinancingInformation') && this.$route.path.includes('/add')) {
|
this.$refs['addPage'].submitForm()
|
} else {
|
this.nextChange = true
|
this.tabName = this.menu[this.currentIndex + 1].tabName
|
this.currentTempIndex = this.currentIndex
|
this.currentIndex += 1
|
// console.log(this.currentTempIndex,'下一页')
|
// if (this.detailsParams.phaseNo === '0030' && this.detailsParams.projectType === '3') {
|
// if (this.$route.path.includes('projectFinancingInformation')&& this.$route.path.includes('/add') ) {
|
// // this.handleChildSumbit()
|
// this.$refs['addPage'].submitForm()
|
// }
|
this.handleRouter(this.tabName)
|
this.showFooterBtn(this.currentIndex)
|
}
|
// this.initMenu()
|
},
|
nextPage() {
|
this.nextChange = true
|
this.tabName = this.menu[this.currentIndex + 1].tabName
|
this.currentTempIndex = this.currentIndex
|
this.currentIndex += 1
|
this.handleRouter(this.tabName)
|
this.showFooterBtn(this.currentIndex)
|
},
|
// 上一页
|
handlePrevPage(index) {
|
// 0 上一步 1 上一页
|
// index === 0 ? this.nextChange = false : this.nextChange = true
|
// console.log(this.nextChange)
|
this.prevStep = false
|
this.nextChange = true
|
this.tabName = this.menu[this.currentIndex - 1].tabName
|
// console.log(this.tabName)
|
this.currentTempIndex = this.currentIndex
|
this.currentIndex -= 1
|
this.handleRouter(this.tabName)
|
this.showFooterBtn(this.currentIndex)
|
// this.initMenu()
|
},
|
// 路由跳转
|
handleRouter(value) {
|
this.$router.push({ path: '/area/projectManagement/add/' + value })
|
},
|
// 子页面保存
|
handleSave() {
|
this.$refs['addPage'].handleSave()
|
},
|
// 保存草稿
|
handleSaveDraft() {
|
this.$refs['addPage'].handleSaveDraft()
|
},
|
// 子页面提交
|
handleChildSumbit() {
|
this.nextChange = false
|
this.$refs['addPage'].submitForm()
|
},
|
// 底部按钮
|
showFooterBtn(index) {
|
if (this.tabName === 'projectDeclarationInfo') {
|
this.prevPageBtn = true
|
this.nextPageBtn = true // 申报信息和审批意见页签交换处理
|
if (this.detailsParams.projectDeclarationInfo === '01') {
|
this.nextPageBtn = false // 处理无审批意见时,申报信息下一步按钮的显示控制
|
}
|
if (
|
this.detailsParams.applyMsg === '01' &&
|
this.$route.path.includes('projectDeclarationInfo')
|
) {
|
this.nextPageBtn = false // 新增时申报信息无下一步
|
}
|
} else {
|
this.prevPageBtn = Boolean(this.menu[index - 1])
|
this.nextPageBtn = Boolean(this.menu[index + 1])
|
}
|
if (this.tabName === 'projectApprovalOpinion') {
|
this.prevPageBtn = true
|
this.nextPageBtn = false
|
}
|
this.menu[index].isClick = true
|
},
|
handleFlowSubmit() {
|
this.nextChange = false
|
this.btnLoading = true
|
let saveOpinion = true // 区别是否提示保存信息,点击保存提示,点击提交不提示
|
this.$refs['addPage'].handleSave(saveOpinion)
|
},
|
// 确定
|
enterMessages() {
|
this.nextChange = false
|
this.commitDialogVisible = false
|
if (!this.commitDialogVisible) {
|
if (!this._.isEmpty(this.detailsParams.menuPhaseNo)) {
|
this.$router.push({
|
path:
|
'/area/check/index?menuPhaseNo=' + this.detailsParams.menuPhaseNo
|
})
|
} else {
|
this.$router.push({ path: '/area/projectManagement/index' })
|
}
|
}
|
},
|
// 提交前调用保存方法分发的事件
|
commitSaveBefore(result) {
|
this.commitBefore = result
|
// 流程提交
|
let params = {
|
objectType: this.detailsParams.objectType,
|
objectNo: this.detailsParams.objectNo
|
}
|
if (this.commitBefore) {
|
projectFlowSubmit(params).then(res => {
|
if (res.code === '00') {
|
this.btnLoading = false
|
// this.$message.success('提交成功！')
|
this.commitDialogVisible = true // 路由跳转方法移到enterMessages方法
|
// if (!this._.isEmpty(this.detailsParams.menuPhaseNo)) {
|
// this.$router.push({ path: '/area/check/index?menuPhaseNo=' + this.detailsParams.menuPhaseNo })
|
// } else {
|
// this.$router.push({ path: '/' })
|
// }
|
}
|
this.btnLoading = false
|
})
|
} else {
|
this.btnLoading = false
|
}
|
},
|
// 提交弹框点击空白处触发
|
handleClose(done) {
|
this.enterMessages()
|
// this.$router.push({ path: '/area/projectManagement/index' })
|
},
|
// 返回列表
|
returnList() {
|
this.nextChange = true
|
// this.$router.push({path:'/area/projectManagement/index'})
|
},
|
// 取消跳转
|
notNext() {
|
// 上一步/页
|
if (this.currentTempIndex > this.currentIndex) {
|
this.currentIndex += 1
|
this.tabName = this.menu[this.currentIndex + 1].tabName
|
} else {
|
// 下一步/页
|
this.currentIndex -= 1
|
this.tabName = this.menu[this.currentIndex - 1].tabName
|
}
|
if (this.currentIndex === 0) {
|
this.prevPageBtn = false
|
}
|
if (this.$route.path.includes('projectDeclarationInfo')) {
|
this.prevStep = true
|
}
|
},
|
// 确认跳转
|
nextJumpPage() {
|
this.prevStep = false
|
}
|
}
|
}
|
</script>
|
|
<style lang="stylus" scoped>
|
@import '../area/style/area.styl';
|
|
.projectAbout {
|
min-width: 1054px;
|
}
|
|
.el-aside {
|
height: 100%;
|
}
|
|
.el-menu {
|
border-right: none;
|
}
|
|
#project.el-footer {
|
position: fixed;
|
width: 100%;
|
bottom: 0;
|
background-color: white;
|
padding-top: 20px;
|
z-index: 1000;
|
|
& >>> .el-loading-spinner {
|
top: 80%;
|
|
// margin-top calc(50% -30px)
|
.circular {
|
width: 25px;
|
height: 25px;
|
}
|
}
|
}
|
|
.messageCheck {
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
}
|
|
.checkSuccess {
|
font-size: 80px;
|
color: rgb(82, 196, 26);
|
}
|
|
.tip {
|
margin-top: 10px;
|
font-size: 20px;
|
}
|
|
.returnList.el-button {
|
background: rgba(238, 238, 238, 1);
|
width: 83px;
|
height: 24px;
|
border: none;
|
|
>>> span {
|
position: relative;
|
left: -18px;
|
top: -2px;
|
|
.el-icon-back {
|
position: relative;
|
left: 6px;
|
top: -1px;
|
margin-right: 0px;
|
font-size: 14px;
|
font-weight: bold;
|
}
|
}
|
}
|
|
.projectContainer {
|
.projectSidebar {
|
position: fixed;
|
left: 0;
|
top: 0;
|
z-index: 1000;
|
background-color: #fff;
|
}
|
|
.projectContent {
|
margin-left: 160px;
|
// width calc(100% - 160px)
|
min-height: 100vh;
|
}
|
|
>>>.el-footer {
|
.el-col-8 {
|
display: flex;
|
justify-content: center;
|
|
.submitBtn {
|
min-width: 120px;
|
width: 120px;
|
height: 30px;
|
padding: 0;
|
|
span {
|
font-size: 14px;
|
height: 20px;
|
font-weight: 400;
|
line-height: 20px;
|
}
|
}
|
|
.blankBtn {
|
margin-left: 40px;
|
border-radius: 4px;
|
border: 1px solid rgba(204, 204, 204, 1);
|
color: rgba(85, 85, 85, 1);
|
|
&:nth-child(1) {
|
margin-left: 0;
|
}
|
}
|
|
.blueBtn {
|
margin-left: 40px;
|
background-color: rgba(0, 129, 240, 1);
|
border-radius: 4px;
|
color: rgba(255, 255, 255, 1);
|
|
& > .el-loading-mask {
|
background-color: rgba(255, 255, 255, 0);
|
}
|
}
|
}
|
}
|
}
|
</style>
|
