DJ #19
|
|
@ -7,11 +7,11 @@
|
|||
<el-input v-model="filterText" style="width: 100%;" size="small"
|
||||
clearable placeholder="输入关键字进行过滤" prefix-icon="el-icon-search"/>
|
||||
</div>
|
||||
<!-- 部门 -->
|
||||
<!-- 部门 check-strictly-->
|
||||
<el-empty :image-size="100" description="似乎没有数据" v-show="deptList.length === 0"/>
|
||||
<el-scrollbar style="height:350px">
|
||||
<el-tree :data="deptList" ref="tree" :props="deptProps" empty-text="" node-key="deptId" default-expand-all
|
||||
:show-checkbox="showCheckbox" check-strictly highlight-current
|
||||
<el-tree :data="deptList" ref="tree" :props="deptProps" empty-text="" node-key="value" default-expand-all
|
||||
:show-checkbox="showCheckbox" highlight-current :check-strictly="multiple===false"
|
||||
@check-change="handleCheckChange" @node-click="(node,check)=>handle(node,check)"
|
||||
:filter-node-method="filterNode">
|
||||
<div class="custom-tree-node" slot-scope="{ node }" style="width: 100%">
|
||||
|
|
@ -20,7 +20,6 @@
|
|||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
|
||||
<div class="selected">
|
||||
<div class="count">
|
||||
<span>已选 {{ selectList.length }} 项</span>
|
||||
|
|
@ -102,7 +101,7 @@ export default {
|
|||
// const jsonb = jsona.replace(/"value"/g, '"deptId"') // 修改成你要的字段
|
||||
// const jsonc = jsonb.replace(/"label"/g, '"deptName"')
|
||||
this.deptList = res.data
|
||||
console.log("获取部门信息===========", this.deptList);
|
||||
// console.log("获取部门信息===========", this.deptList);
|
||||
});
|
||||
},
|
||||
//通过关键字过滤树节点
|
||||
|
|
@ -132,7 +131,9 @@ export default {
|
|||
}
|
||||
}
|
||||
if (checked) {
|
||||
if(data.children === undefined){
|
||||
this.selectList.push(data);
|
||||
}
|
||||
} else if (data === '1') {
|
||||
this.$refs.tree.setCheckedKeys([]);
|
||||
this.selectList = [];
|
||||
|
|
@ -147,10 +148,11 @@ export default {
|
|||
}
|
||||
if (checked) {
|
||||
this.$refs.tree.setCheckedNodes([data]);
|
||||
// this.$refs.tree.setCheckedKeys([]);
|
||||
this.selectList = [data];
|
||||
} else if (data === '1') {
|
||||
this.$refs.tree.setCheckedKeys([]);
|
||||
this.selectList = [];
|
||||
this.$refs.tree.setCheckedKeys([]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -164,6 +166,7 @@ export default {
|
|||
* @param check checked(checkbox选择框)是否选中
|
||||
*/
|
||||
handle(node, check) {
|
||||
if (check.isLeaf !== false) {
|
||||
if (this.multiple) {
|
||||
//不添加重复的数据到右边
|
||||
for (let i = 0; i < this.selectList.length; i++) {
|
||||
|
|
@ -178,6 +181,7 @@ export default {
|
|||
check.checked = true
|
||||
this.selectList = [node];
|
||||
}
|
||||
}
|
||||
this._value = this.selectList
|
||||
},
|
||||
//左侧无选择框时,右侧显示×
|
||||
|
|
@ -203,9 +207,10 @@ export default {
|
|||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(() => {
|
||||
this.handleCheckChange("1");
|
||||
if (!this.showCheckbox) {
|
||||
this.selectList = []
|
||||
}else {
|
||||
this.handleCheckChange("1");
|
||||
}
|
||||
});
|
||||
},
|
||||
|
|
@ -221,15 +226,15 @@ export default {
|
|||
<style lang="less" scoped>
|
||||
@containWidth: 278px;
|
||||
|
||||
/deep/ .el-tree-node {
|
||||
.is-leaf + .el-checkbox .el-checkbox__inner {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.el-checkbox .el-checkbox__inner {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
///deep/ .el-tree-node {
|
||||
// .is-leaf + .el-checkbox .el-checkbox__inner {
|
||||
// display: inline-block;
|
||||
// }
|
||||
//
|
||||
// .el-checkbox .el-checkbox__inner {
|
||||
// display: none;
|
||||
// }
|
||||
//}
|
||||
|
||||
/deep/ .el-dialog__body {
|
||||
padding: 10px 20px;
|
||||
|
|
|
|||
|
|
@ -10,12 +10,12 @@
|
|||
<org-picker type="dept" :multiple="multiple" ref="deptPicker" :v-model="select" :selected="_value" @ok="selected"/>
|
||||
<span class="placeholder"> {{placeholder}}</span>
|
||||
<div style="margin-top: 5px">
|
||||
<el-tag size="mini" style="margin: 5px" closable v-for="(dept, i) in _value" :key="i" @close="delDept(i)">{{dept.deptName}}</el-tag>
|
||||
<el-tag size="mini" style="margin: 5px" closable v-for="(dept, i) in _value" :key="i" @close="delDept(i)">{{dept.label}}</el-tag>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else-if="perm === 'R'">
|
||||
<div v-for="(dept, i) in _value" :key="i">
|
||||
{{dept.deptName}}
|
||||
{{dept.label}}
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue