jhprjv2/ruoyi-ui/src/views/project/surBuildNode/buildNodeDrawer.vue

103 lines
3.1 KiB
Vue
Raw Normal View History

2023-08-10 21:09:49 +08:00
<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>