|
@@ -11,18 +11,21 @@
|
|
|
style="width:100%;backgroundColor:#fff;border-radius:3px;padding:10px 0px 0px 8px;box-sizing: border-box;border: 1px solid #EBEEF5;overflow:hidden;"
|
|
|
>
|
|
|
<!-- 树结构 -->
|
|
|
- <avue-tree
|
|
|
+ <el-tree
|
|
|
ref="trees"
|
|
|
:style="{width:'100%',height:heightss-20+'px','box-sizing': 'border-box',overflow:'hidden'}"
|
|
|
- :permission="getPermission"
|
|
|
:loading="loading"
|
|
|
- :option="option"
|
|
|
+ :load="treeLoad"
|
|
|
+ lazy
|
|
|
:data="data"
|
|
|
+ :props="defaultProps"
|
|
|
@node-click="nodeClick"
|
|
|
+ node-key="id"
|
|
|
+ :expand-on-click-node="false"
|
|
|
>
|
|
|
<span
|
|
|
- class="el-tree-node__label"
|
|
|
- slot-scope="{ data }"
|
|
|
+ class="custom-tree-node"
|
|
|
+ slot-scope="{ data ,node }"
|
|
|
@mouseover="mouseOver(data)"
|
|
|
@mouseleave="mouseLeave(data)"
|
|
|
style="box-sizing: border-box;width:100%;"
|
|
@@ -34,25 +37,25 @@
|
|
|
<span v-show="data.moreShow">
|
|
|
<i
|
|
|
class="el-icon-circle-plus-outline marleft10"
|
|
|
- @click.stop="addExcel(data)"
|
|
|
+ @click.stop="addExcel(data,node)"
|
|
|
v-if="data.fileType!=3"
|
|
|
></i>
|
|
|
<!-- 编辑 -->
|
|
|
<i
|
|
|
class="el-icon-edit marleft10"
|
|
|
- @click.stop="editExcel(data)"
|
|
|
+ @click.stop="editExcel(data,node)"
|
|
|
v-if="data.fileType!=1"
|
|
|
></i>
|
|
|
<!-- 删除 -->
|
|
|
<i
|
|
|
class="el-icon-delete marleft10"
|
|
|
- @click.stop="deleteExcelM(data)"
|
|
|
+ @click.stop="deleteExcelM(data,node)"
|
|
|
v-if="!data.hasChildren&&data.fileType!=1"
|
|
|
></i>
|
|
|
</span>
|
|
|
</div>
|
|
|
</span>
|
|
|
- </avue-tree>
|
|
|
+ </el-tree>
|
|
|
<div
|
|
|
style="border-left:8px solid rgba(255,255,255,0);z-index:999"
|
|
|
@mousedown="mousedown1()"
|
|
@@ -107,6 +110,7 @@
|
|
|
>下载EXCEL</el-link>
|
|
|
</div>
|
|
|
<div
|
|
|
+ :style="{width:'100%',height:heightss-13 +'px'}"
|
|
|
class="rightHeader"
|
|
|
v-show="from.checkd&&!from.fileUrl"
|
|
|
>
|
|
@@ -214,7 +218,6 @@
|
|
|
</div>
|
|
|
<div class="leftscroll">
|
|
|
<avue-tree
|
|
|
- :permission="getPermission"
|
|
|
:loading="loading"
|
|
|
:option="option2"
|
|
|
:data="wbsdata"
|
|
@@ -292,43 +295,20 @@ import { detailExcel, excelType, tabLazytree, getWbsTypeList, wbstree, selectByN
|
|
|
export default {
|
|
|
data () {
|
|
|
return {
|
|
|
+ treeNode: {},
|
|
|
//#region 鼠标
|
|
|
leftTRee: '',//左侧树ID
|
|
|
threessW: 400,
|
|
|
//#endregion
|
|
|
heightss: '',//
|
|
|
loading: false,//懒加载
|
|
|
- option: {
|
|
|
- filter: false,
|
|
|
- lazy: true,
|
|
|
- menu: false,
|
|
|
- treeLoad: (async (node, resolve) => {
|
|
|
- console.log(node);
|
|
|
- console.log(resolve);
|
|
|
- if (node.level !== 0) {
|
|
|
- if (node.data.hasChildren) {
|
|
|
- const { data: res } = await tabLazytree({ parentId: node.data.id, modeId: this.$route.params.id })
|
|
|
- console.log(res);
|
|
|
- if (res.code === 200) {
|
|
|
- //处理树节点是否有子节点的格式
|
|
|
- if (Array.isArray(res.data)) {
|
|
|
- res.data.forEach((val) => {
|
|
|
- if (!val.hasChildren) {
|
|
|
- val.leaf = true
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- return resolve(res.data)
|
|
|
- }
|
|
|
- } else {
|
|
|
- return resolve([])
|
|
|
- }
|
|
|
- } else {
|
|
|
- return resolve(await this.tabLazytree(0, this.$route.params.id))
|
|
|
- }
|
|
|
- }),
|
|
|
- },
|
|
|
data: [],//清表模板
|
|
|
+ defaultProps: {
|
|
|
+ children: "children",
|
|
|
+ isLeaf: function (data) {
|
|
|
+ return !data.hasChildren || (data.isExistForm == 1);
|
|
|
+ },
|
|
|
+ },
|
|
|
wbsdata: [],//wbs模板
|
|
|
//#region 右侧数据
|
|
|
from: {
|
|
@@ -402,13 +382,6 @@ export default {
|
|
|
const { data: res } = await tabLazytree({ parentId, modeId })
|
|
|
console.log(res);
|
|
|
if (res.code === 200) {
|
|
|
- if (Array.isArray(res.data)) {
|
|
|
- res.data.forEach((val) => {
|
|
|
- if (!val.hasChildren) {
|
|
|
- val.leaf = true
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
return res.data
|
|
|
}
|
|
|
},
|
|
@@ -488,7 +461,20 @@ export default {
|
|
|
const { data: res } = await Excelmodify(wbsExclTabParmVO)
|
|
|
console.log(res);
|
|
|
if (res.code === 200) {
|
|
|
- this.tabLazytree(wbsExclTabParmVO.parentId, this.$route.params.id)//获取清表树
|
|
|
+ let ids = ''
|
|
|
+ if (wbsExclTabParmVO.id) {
|
|
|
+ ids = this.treeNode.data.parentId
|
|
|
+ } else {
|
|
|
+ ids = wbsExclTabParmVO.parentId
|
|
|
+ }
|
|
|
+ let das = await this.tabLazytree(ids, this.$route.params.id)//获取清表树
|
|
|
+ if (wbsExclTabParmVO.id) {
|
|
|
+ console.log('编辑', this.treeNode.data.parentId, ids);
|
|
|
+ this.$refs.trees.updateKeyChildren(this.treeNode.data.parentId, das)
|
|
|
+ } else {
|
|
|
+ console.log('添加');
|
|
|
+ this.$refs.trees.updateKeyChildren(this.treeNode.data.id, das)
|
|
|
+ }
|
|
|
this.dialogTap = false
|
|
|
}
|
|
|
},
|
|
@@ -563,6 +549,17 @@ export default {
|
|
|
this.$set(data, 'moreShow', true)
|
|
|
}
|
|
|
},
|
|
|
+ async treeLoad (node, resolve) {
|
|
|
+ if (node.level !== 0) {
|
|
|
+ if (node.data.hasChildren) {
|
|
|
+ return resolve(await this.tabLazytree(node.data.id, this.$route.params.id))
|
|
|
+ } else {
|
|
|
+ return resolve([])
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ return resolve(await this.tabLazytree(0, this.$route.params.id))
|
|
|
+ }
|
|
|
+ },
|
|
|
nodeClick (data) {//外层树结构
|
|
|
if (data.hasChildren == false || data.fileType == 3) {
|
|
|
this.from.checkd = true
|
|
@@ -580,7 +577,8 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
- async editExcel (data) {//编辑
|
|
|
+ async editExcel (data, node) {//编辑
|
|
|
+ console.log(this.$refs.trees.getNode(data));
|
|
|
this.dialogTapType = '编辑'
|
|
|
console.log(data);
|
|
|
if (data.fileType != 3 && data.hasChildren) {
|
|
@@ -595,10 +593,11 @@ export default {
|
|
|
this.excelForm.id = res.data.id
|
|
|
this.excelForm.nodeName = res.data.name //清表名称
|
|
|
this.excelForm.tabType = res.data.tabType //清表类型
|
|
|
+ this.treeNode = node
|
|
|
this.dialogTap = true
|
|
|
}
|
|
|
},
|
|
|
- async addExcel (data) {//添加
|
|
|
+ async addExcel (data, node) {//添加
|
|
|
this.dialogTapType = '新增'
|
|
|
console.log(data);
|
|
|
if (data.fileType == 3) {
|
|
@@ -608,16 +607,19 @@ export default {
|
|
|
this.getWbsTypeList()//wbs模板名称
|
|
|
}
|
|
|
this.excelForm.parentId = data.id
|
|
|
+ this.treeNode = node
|
|
|
this.dialogTap = true
|
|
|
},
|
|
|
- deleteExcelM (data) {//删除
|
|
|
+ deleteExcelM (data, node) {//删除
|
|
|
+ console.log(node);
|
|
|
const _that = this
|
|
|
this.$confirm('确定将选择数据删除?', '', {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'error'
|
|
|
- }).then(() => {
|
|
|
- _that.deleteExcelshu(data.id)
|
|
|
+ }).then(async () => {
|
|
|
+ await _that.deleteExcelshu(data.id)
|
|
|
+ _that.$refs.trees.remove(node) //删除界面上的节点
|
|
|
}).catch(() => {
|
|
|
});
|
|
|
},
|
|
@@ -799,7 +801,7 @@ export default {
|
|
|
.rightHeader {
|
|
|
display: flex;
|
|
|
justify-content: flex-start;
|
|
|
- align-items: center;
|
|
|
+ align-items: top;
|
|
|
font-size: 14px;
|
|
|
background-color: #fff;
|
|
|
|