<template>
|
<win-lg :title="setting.title" @close="close" :width="'800px'">
|
<el-tabs v-loading="loading" v-model="activeName" :before-leave="beforeLeave">
|
<el-tab-pane label="选择节点" name="first">
|
<div class="box">
|
<stageNode :tempProjectId="setting.stageId" ref="stageNode"></stageNode>
|
</div>
|
</el-tab-pane>
|
<el-tab-pane label="节点周期设置" name="second">
|
<div class="box">
|
<nodeCycle ref="nodeCycle"/>
|
</div>
|
</el-tab-pane>
|
<el-tab-pane label="预览" name="third">
|
<div class="box">
|
<preview ref="preview" :tempProjectStages="tempProjectStages"/>
|
</div>
|
</el-tab-pane>
|
</el-tabs>
|
<div slot="footer" align="center" class="dialog-footer">
|
<my-button name="取消" site="form" @click="close"/>
|
<template v-if="activeName === 'first'">
|
<my-button key="4" name="下一步" type="primary" site="form" @click="activeName = 'second'"/>
|
</template>
|
<my-button v-if="activeName === 'second'" key="1" name="上一步" type="primary" site="form" @click="activeName = 'first'"/>
|
<my-button v-if="activeName === 'second'" key="2" name="保存" site="form" @click="doSave" />
|
<my-button @click="activeName='third'" v-if="activeName === 'second'" key="3" name="预览" type="warning" site="form"/>
|
<my-button v-if="activeName === 'third'" name="返回" site="form" @click="activeName='second'"/>
|
</div>
|
</win-lg>
|
</template>
|
|
<script>
|
import winLg from '@/components/win/win-lg'
|
import myButton from '@/components/myButton/myButton'
|
import stageNode from "@/views/projectConfig/buildPlan/nodeChoose/stageNode";
|
import nodeCycle from "@/views/projectConfig/buildPlan/nodeChoose/nodeCycle";
|
import preview from "@/views/projectConfig/buildPlan/nodeChoose/preview";
|
import {updPStageNode} from '@/api/projectConfig/buildPlanNode'
|
export default {
|
name: 'nodeChoose',
|
components: {winLg, myButton,stageNode,nodeCycle,preview},
|
props: {
|
// setting 中须至少包含控制dialog显示或隐藏的属性,其余属性可拓展
|
// 将添加/修改的大量数据及逻辑从列表页面中分离出来,避免列表页面代码过多,审查困难
|
// 若此页面须回传数据至父页面,可在引用组件时添加事件,本页面使用this.$emit('事件名',参数1,参数2...)回传数据
|
setting: {
|
type: Object,
|
default: () => {
|
}
|
}
|
},
|
data() {
|
return {
|
loading: false,
|
activeName: 'first',
|
tempProjectStages: []
|
};
|
},
|
mounted() {
|
},
|
methods: {
|
doSave(){
|
console.log(this.$refs.nodeCycle.getSelectTree())
|
this.loading = true
|
updPStageNode({
|
tempProjectId:this.setting.stageId,
|
tempProjectStages:this.$refs.nodeCycle.getSelectTree()
|
}).then(res=>{
|
this.loading = false
|
this.$message.success('保存成功！')
|
this.close()
|
this.$emit('search')
|
}).catch(()=>{
|
this.loading = false
|
})
|
},
|
close() {
|
this.$emit('close')
|
},
|
beforeLeave(activeName, oldActiveName) {
|
let checked = this.$refs.stageNode.tree.some(item=>item.checked)
|
if(activeName==='second'&&checked){
|
this.$refs.stageNode.setNodeCycleData()
|
}
|
if(activeName==='third'&&checked){
|
this.$EventBus.$emit('clearData')
|
this.tempProjectStages = this.$refs.nodeCycle.getSelectTree()
|
}
|
if(activeName!=='first'&&!checked){
|
this.$modal.msgError('请先选择阶段节点')
|
this.activeName = oldActiveName
|
}
|
return checked
|
// return false
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.box {
|
height: calc(100vh - 450px);
|
overflow-y: auto;
|
}
|
</style>
|
