103 lines
3.1 KiB
Vue
103 lines
3.1 KiB
Vue
|
<template>
|
||
|
<div class="project-build-node-drawer" v-if="isOpen">
|
||
|
<el-drawer v-if="isOpen" :visible.sync="isOpen" direction="rtl" size="60%" style="padding-left: 20px;">
|
||
|
<template slot="title">
|
||
|
<div>{{ title + ' 【计划节点】' }}</div>
|
||
|
<right-toolbar @queryTable="loadData" :search="false">
|
||
|
</right-toolbar>
|
||
|
</template>
|
||
|
<el-tabs v-model="activeName" >
|
||
|
<el-tab-pane :label="''+it.nodeText" :name="''+it.id" :key="idx" v-for="(it,idx) in nodes" >
|
||
|
<node-item :item="it" :showLabel="false" style="border-bottom: solid 1px #ccc;"></node-item>
|
||
|
<div v-for="(it2,idx) in it.children" :key="idx" class="lvl-2">
|
||
|
<node-item :item="it2"></node-item>
|
||
|
<div v-for="(it3,idx) in it2.children" :key="idx" v-if="it2.children.length>0" style="padding-left: 40px;" class="lvl-3">
|
||
|
<node-item :item="it3"></node-item>
|
||
|
</div>
|
||
|
</div>
|
||
|
</el-tab-pane>
|
||
|
</el-tabs>
|
||
|
</el-drawer>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import {listByProject} from '@/api/project/build_node_data.js'
|
||
|
import NodeItem from './nodeItem.vue'
|
||
|
export default {
|
||
|
name: 'RuoyiUiBuildNodeDrawer',
|
||
|
components:{
|
||
|
NodeItem
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
isOpen:false,
|
||
|
prj: null,
|
||
|
nodes:[],
|
||
|
activeName:''
|
||
|
};
|
||
|
},
|
||
|
|
||
|
mounted() {
|
||
|
|
||
|
},
|
||
|
|
||
|
methods: {
|
||
|
|
||
|
loadData(init){
|
||
|
listByProject(this.prj.id).then(d=>{
|
||
|
let tmps=(d.data||[]).map(it=>{
|
||
|
it.lvl=it.baseBuildNode.nodeLvl;
|
||
|
it.parentLvl=it.lvl.substring(0,it.lvl.length-2);
|
||
|
it.nodeText=it.baseBuildNode.nodeText;
|
||
|
it.file=this.$tryToJson(it.files,[]);
|
||
|
return it;
|
||
|
});
|
||
|
let objs=tmps.filter(d=>d.parentLvl.length==0);
|
||
|
objs.forEach(it=>{
|
||
|
it.children=tmps.filter(item=>item.parentLvl==it.lvl)
|
||
|
it.children.forEach(item=>{
|
||
|
item.children=tmps.filter(item3=>item3.parentLvl==item.lvl);
|
||
|
});
|
||
|
})
|
||
|
this.nodes=objs;
|
||
|
if(init){
|
||
|
this.activeName=objs.length>0?objs[0].id+'':'';
|
||
|
}
|
||
|
});
|
||
|
},
|
||
|
show(prj) {
|
||
|
this.prj = prj;
|
||
|
this.title = prj.projectName;
|
||
|
this.isOpen = true;
|
||
|
this.loadData(true);
|
||
|
}
|
||
|
},
|
||
|
};
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss" scoped>
|
||
|
.project-build-node-drawer{
|
||
|
::v-deep .el-drawer{
|
||
|
min-width: 1600px;
|
||
|
}
|
||
|
::v-deep .el-drawer__header{
|
||
|
margin-bottom: 0px;
|
||
|
}
|
||
|
::v-deep .el-drawer__body{
|
||
|
padding:0px 24px;
|
||
|
.el-form {
|
||
|
overflow: hidden;
|
||
|
.el-form-item{
|
||
|
margin-bottom: 15px !important;
|
||
|
}
|
||
|
}
|
||
|
.lvl-3{
|
||
|
.lbl-title{
|
||
|
font-size: 12px;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</style>
|