1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
| <template>
| <div>
| <el-radio-group v-model="radio">
| <el-radio :label="3">所有用户可访问</el-radio>
| <el-radio :label="6">指定用户可访问</el-radio>
| <el-radio :label="9">指定机构可访问</el-radio>
| </el-radio-group>
| <el-transfer v-if="radio === 6" filterable :props="userProps" filter-placeholder="请输入用户名" v-model="valueUser"
| :titles="['未选用户', '已选用户']" :data="dataUser">
| </el-transfer>
|
| <div v-else-if="radio === 9">
| <el-input placeholder="输入关键字进行过滤" v-model="filterText">
| </el-input>
| <el-tree :data="dataDept" show-checkbox default-expand-all node-key="deptId" ref="deptTree"
| :filter-node-method="filterNode" style="height:250px;overflow-y: auto;" highlight-current :props="defaultProps">
| </el-tree>
| </div>
| </div>
| </template>
| <script>
| import { listUser } from "@/api/system/user";
| import { listDept } from "@/api/system/dept";
| export default {
| name: "shareElementItem",
| data() {
| return {
| valueUser: [],
| dataUser: [],
| valueDept: [],
| dataDept: [],
| userProps: {
| key: 'userId',
| label: 'nickName'
| },
| filterText: '',
|
| radio: 3,
|
| dataDept: [],
| defaultProps: {
| children: 'children',
| label: 'deptName',
| }
| };
| },
| methods: {
| getData() {
| listUser({ pageNum: 1, pageSize: 9999 }).then((res) => {
| if (res.code == 200) {
| this.dataUser = res.rows
| }
| })
| listDept({ pageNum: 1, pageSize: 9999 }).then(res => {
| if (res.code == 200) {
| this.dataDept = this.handleTree(res.data, "deptId");
| }
| });
| },
| filterNode(value, data) {
| if (!value) return true;
| return data.deptName.indexOf(value) !== -1;
| }
| },
| watch: {
| filterText(val) {
| this.$refs.deptTree.filter(val);
| }
| },
| mounted() {
| this.getData()
| },
| };
| </script>
|
| <style scoped lang="less">
| /deep/.el-transfer-panel__filter .el-input__inner {
| color: #5c6d96 !important;
| }
| </style>
|
|
