centaline-data-driven 1.3.85 → 1.3.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,243 +1,246 @@
1
1
  <template>
2
- <div class='mytree'>
3
- <el-tree :data="treeData"
4
- class="tree-line"
5
- :props="defaultProps"
6
- :load="loadNode"
7
- :indent="0"
8
- :expand-on-click-node="false"
9
- @node-click="handleNodeClick"
10
- lazy
11
- ref="Tree">
12
- </el-tree>
2
+ <div class='mytree' style="overflow:auto">
3
+ <el-tree :data="treeData" class="tree-line" :props="defaultProps" :load="loadNode" :indent="0"
4
+ :expand-on-click-node="false" @node-click="handleNodeClick" lazy ref="Tree">
5
+ </el-tree>
13
6
  </div>
14
7
  </template>
15
8
 
16
9
  <script>
17
- import dynamicElement from '../../mixins/dynamicElement'
18
- import dynamicTreeScreen from '../../dynamicSearchList/src/dynamicSearchScreen.vue';
19
- export default {
20
- name: 'ct-tree',
21
- mixins: [dynamicElement],
22
- components: {
23
- 'ct-searchtreescreen': dynamicTreeScreen
10
+ import dynamicElement from '../../mixins/dynamicElement'
11
+ import dynamicTreeScreen from '../../dynamicSearchList/src/dynamicSearchScreen.vue';
12
+ export default {
13
+ name: 'ct-tree',
14
+ mixins: [dynamicElement],
15
+ components: {
16
+ 'ct-searchtreescreen': dynamicTreeScreen
17
+ },
18
+ props: {
19
+ vmodel: Object,
20
+ api: String
21
+ },
22
+ data() {
23
+ return {
24
+ treeNode: {},
25
+ treeResolve: function () { },
26
+ LastClickNode: {},
27
+ para: {},
28
+ filterText: '',
29
+ treeData: [], // 树节点
30
+ defaultProps: {
31
+ label: 'name',
32
+ key: 'Key',
33
+ children: 'children',
34
+ isLeaf: "isLeaf",
35
+ id: 'code'
36
+ },
37
+ };
38
+ },
39
+ methods: {
40
+ search(m) {
41
+ this.treeNode.childNodes = [];
42
+ this.searchComplate(m, undefined, this.treeResolve);
43
+ },
44
+ loadNode(node, resolve) { // 加载 树数据
45
+ let self = this;
46
+ if (node.level === 0) {
47
+ self.treeNode = node;
48
+ self.treeResolve = resolve;
49
+ return self.loadtreeData(resolve);
50
+ }
51
+ if (node.level >= 1) {
52
+ return self.getChildByList(node.data.code, resolve, node.data);
53
+ }
24
54
  },
25
- props: {
26
- vmodel: Object,
27
- api: String
55
+ loadtreeData(resolve) { // 获取loadtreeData 就是父节点数据,getChildByList就是异步获取子节点数据
56
+ this.searchComplate(undefined, undefined, resolve);
28
57
  },
29
- data() {
30
- return {
31
- treeNode: {},
32
- treeResolve: function () { },
33
- LastClickNode: {},
34
- para: {},
35
- filterText: '',
36
- treeData: [], // 树节点
37
- defaultProps: {
38
- label: 'name',
39
- key: 'Key',
40
- children: 'children',
41
- isLeaf: "isLeaf",
42
- id: 'code'
43
- },
58
+ getChildByList(_parentID, resolve,) { // 获取子节点请求
59
+ var fields = this.model.searchData("code", _parentID, 9, 3);
60
+ var model = {
61
+ "searchData": fields
44
62
  };
63
+ this.searchComplate(model, undefined, resolve);
45
64
  },
46
- methods: {
47
- search(m) {
48
- this.treeNode.childNodes = [];
49
- this.searchComplate(m, undefined, this.treeResolve);
50
- },
51
- loadNode(node, resolve) { // 加载 树数据
52
- let self = this;
53
- if (node.level === 0) {
54
- self.treeNode = node;
55
- self.treeResolve = resolve;
56
- return self.loadtreeData(resolve);
57
- }
58
- if (node.level >= 1) {
59
- return self.getChildByList(node.data.code, resolve, node.data);
65
+ load(data, resolve) {
66
+ var self = this;
67
+ self.model = data;
68
+ var treeResolve = resolve || self.treeResolve;
69
+ treeResolve(data.modeltree);
70
+ self.LastResolve = treeResolve;
71
+
72
+
73
+ },
74
+ searchComplate(m, defaultSearch, resolve) {
75
+ var self = this;
76
+ this.$nextTick(function () {
77
+ if (typeof self.api !== 'undefined') {
78
+ self.loaderObj.Tree(self.api, self.load, m, defaultSearch, resolve);
60
79
  }
61
- },
62
- loadtreeData(resolve) { // 获取loadtreeData 就是父节点数据,getChildByList就是异步获取子节点数据
63
- this.searchComplate(undefined, undefined, resolve);
64
- },
65
- getChildByList(_parentID, resolve,) { // 获取子节点请求
66
- var fields = this.model.searchData("code", _parentID, 9, 3);
67
- var model = {
68
- "searchData": fields
69
- };
70
- this.searchComplate(model, undefined, resolve);
71
- },
72
- load(data, resolve) {
73
- var self = this;
74
- self.model = data;
75
- var treeResolve = resolve || self.treeResolve;
76
- treeResolve(data.modeltree);
77
- self.LastResolve = treeResolve;
78
- },
79
- searchComplate(m, defaultSearch, resolve) {
80
- var self = this;
81
- this.$nextTick(function () {
82
- if (typeof self.api !== 'undefined') {
83
- self.loaderObj.Tree(self.api, self.load, m, defaultSearch, resolve);
84
- }
80
+ });
81
+ },
82
+ handleNodeClick(data) {
83
+ var self = this;
84
+ if (self.LastClickNode != data) {
85
+ self.LastClickNode = data;
86
+ var rowRouter = self.model.rowSelectRouter;
87
+ var SearchData = {};
88
+ rowRouter.submitFormField.forEach(v => {
89
+ SearchData[v] = data[v];
90
+ })
91
+ this.model.getCurrentRowApiData(rowRouter.action, SearchData, function (rowdata) {
92
+ var newdata = self.$common.deepClone(data);
93
+ newdata.rowRouter = rowdata
94
+ self.$emit('loaded', newdata);
85
95
  });
86
- },
87
- handleNodeClick(data) {
88
- var self = this;
89
- if (self.LastClickNode != data) {
90
- self.LastClickNode = data;
91
- var rowRouter = self.model.rowSelectRouter;
92
- var SearchData = {};
93
- rowRouter.submitFormField.forEach(v => {
94
- SearchData[v] = data[v];
95
- })
96
- this.model.getCurrentRowApiData(rowRouter.action, SearchData, function (rowdata) {
97
- var newdata = self.$common.deepClone(data);
98
- newdata.rowRouter = rowdata
99
- self.$emit('loaded', newdata);
100
- });
101
96
 
97
+ }
98
+ this.$nextTick(function () {
99
+ if (document.querySelector('.is-select') != null) {
100
+ document.querySelector('.is-select').classList.remove("is-select");
102
101
  }
103
- this.$nextTick(function () {
104
- if (document.querySelector('.is-select') != null) {
105
- document.querySelector('.is-select').classList.remove("is-select");
106
- }
107
- document.querySelector('.is-current .el-tree-node__label').classList.add("is-select");
108
- })
102
+ document.querySelector('.is-current .el-tree-node__label').classList.add("is-select");
103
+ })
109
104
 
110
- }
111
- },
112
- created() {
113
- this.model = this.vmodel;
114
105
  }
106
+ },
107
+ created() {
108
+ this.model = this.vmodel;
115
109
  }
110
+ }
116
111
  </script>
117
112
  <style lang="scss">
118
-
119
- .mytree .is-select {
120
- color: #409eff !important
121
- }
122
- .tree-line:first-child div{
123
- overflow: hidden;
124
- }
125
- .el-tree-node {
126
- position: relative;
127
- padding-left: 16px;
128
- }
129
-
130
- .el-tree-node__children {
131
- padding-left: 16px;
132
- }
133
- .el-tree-node__content {
134
- padding-left: 0px !important;
135
- padding-right:2px !important;
136
- }
137
- /* 竖线 */
138
- .el-tree-node::before {
139
- content: "";
140
- height: 100%;
141
- width: 1px;
142
- position: absolute;
143
- left: 27px;
144
- top: -1px;
145
- border-width: 1px;
146
- border-left: 1px dashed #52627C;
147
- }
148
-
149
- .tree-line .el-tree-node:before:last-child{
150
- top: -35px;
151
- }
152
- .el-tree-node__children .el-tree-node::before {
153
- content: "";
154
- height: 100%;
155
- width: 1px;
156
- position: absolute;
157
- left: 27px;
158
- top: -2px;
159
- border-width: 1px;
160
- border-left: 1px dashed #52627C;
161
- }
162
- /* 当前最后一个接点的竖线高度 */
163
- .el-tree-node:last-child::before {
164
- height: 15px; /*可以自己调整 */
165
- }
166
-
167
- /* 横线 */
168
- .el-tree-node::after {
169
- content: "";
170
- width: 12px;
171
- height: 20px;
172
- position: absolute;
173
- left: 27px;
174
- top: 12px;
175
- right:2px;
176
- border-width: 1px;
177
- border-top: 1px dashed #52627C;
178
- }
179
-
180
- .el-tree:first-child .el-tree-node:before {
181
- // height: 46px; /*可以自己调整 */
182
- }
183
-
184
- .el-tree-node__expand-icon {
185
- font-size: 16px;
186
- }
187
- /* 去掉顶层虚线 */
188
- .tree > .el-tree-node:first-child::after {
189
- border-top: none;
190
- }
191
-
192
- .el-tree > .el-tree-node:first-child:before {
193
- // border-left: none;
194
- }
195
-
196
- .tree > .is-leaf {
197
- color: transparent;
198
- }
199
-
200
- .el-tree .el-tree-node__expand-icon.expanded {
201
- -webkit-transform: rotate(0deg);
202
- transform: rotate(0deg);
203
- }
204
-
205
- .el-tree .el-tree-node__expand-icon.expanded {
206
- -webkit-transform: rotate(0deg);
207
- transform: rotate(0deg);
208
- }
209
-
210
-
211
- .el-tree .el-icon-caret-right:before {
212
- background: url("../../../assets/node-collapse.png") no-repeat;
213
- content: '';
214
- display: block;
215
- width: 12px;
216
- height: 12px;
217
- font-size: 12px;
218
- background-size: 10px;
219
- }
220
- /*
113
+ .mytree .is-select {
114
+ color: #409eff !important
115
+ }
116
+
117
+ .tree-line:first-child div {
118
+ overflow: hidden;
119
+ }
120
+
121
+ .el-tree-node {
122
+ position: relative;
123
+ padding-left: 16px;
124
+ }
125
+
126
+ .el-tree-node__children {
127
+ padding-left: 16px;
128
+ }
129
+
130
+ .el-tree-node__content {
131
+ padding-left: 0px !important;
132
+ padding-right: 2px !important;
133
+ }
134
+
135
+ /* 竖线 */
136
+ .el-tree-node::before {
137
+ content: "";
138
+ height: 100%;
139
+ width: 1px;
140
+ position: absolute;
141
+ left: 27px;
142
+ top: -1px;
143
+ border-width: 1px;
144
+ border-left: 1px dashed #52627C;
145
+ }
146
+
147
+ .tree-line .el-tree-node:before:last-child {
148
+ top: -35px;
149
+ }
150
+
151
+ .el-tree-node__children .el-tree-node::before {
152
+ content: "";
153
+ height: 100%;
154
+ width: 1px;
155
+ position: absolute;
156
+ left: 27px;
157
+ top: -2px;
158
+ border-width: 1px;
159
+ border-left: 1px dashed #52627C;
160
+ }
161
+
162
+ /* 当前最后一个接点的竖线高度 */
163
+ .el-tree-node:last-child::before {
164
+ height: 15px;
165
+ /*可以自己调整 */
166
+ }
167
+
168
+ /* 横线 */
169
+ .el-tree-node::after {
170
+ content: "";
171
+ width: 12px;
172
+ height: 20px;
173
+ position: absolute;
174
+ left: 27px;
175
+ top: 12px;
176
+ right: 2px;
177
+ border-width: 1px;
178
+ border-top: 1px dashed #52627C;
179
+ }
180
+
181
+ .el-tree:first-child .el-tree-node:before {
182
+ // height: 46px; /*可以自己调整 */
183
+ }
184
+
185
+ .el-tree-node__expand-icon {
186
+ font-size: 16px;
187
+ }
188
+
189
+ /* 去掉顶层虚线 */
190
+ .tree>.el-tree-node:first-child::after {
191
+ border-top: none;
192
+ }
193
+
194
+ .el-tree>.el-tree-node:first-child:before {
195
+ // border-left: none;
196
+ }
197
+
198
+ .tree>.is-leaf {
199
+ color: transparent;
200
+ }
201
+
202
+ .el-tree .el-tree-node__expand-icon.expanded {
203
+ -webkit-transform: rotate(0deg);
204
+ transform: rotate(0deg);
205
+ }
206
+
207
+ .el-tree .el-tree-node__expand-icon.expanded {
208
+ -webkit-transform: rotate(0deg);
209
+ transform: rotate(0deg);
210
+ }
211
+
212
+
213
+ .el-tree .el-icon-caret-right:before {
214
+ background: url("../../../assets/node-collapse.png") no-repeat;
215
+ content: '';
216
+ display: block;
217
+ width: 12px;
218
+ height: 12px;
219
+ font-size: 12px;
220
+ background-size: 10px;
221
+ }
222
+
223
+ /*
221
224
  //有子节点 且已展开*/
222
- .el-tree .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
223
- background: url("../../../assets/node-expand.png") no-repeat;
224
- content: '';
225
- display: block;
226
- width: 12px;
227
- height: 12px;
228
- font-size: 12px;
229
- background-size: 10px;
230
- }
231
-
232
- /* //没有子节点*/
233
- .el-tree .el-tree-node__expand-icon.is-leaf::before {
234
- background: transparent no-repeat 0 3px;
235
- content: '';
236
- display: block;
237
- width: 12px;
238
- height: 12px;
239
- font-size: 12px;
240
- background-size: 10px;
241
- }
225
+ .el-tree .el-tree-node__expand-icon.expanded.el-icon-caret-right:before {
226
+ background: url("../../../assets/node-expand.png") no-repeat;
227
+ content: '';
228
+ display: block;
229
+ width: 12px;
230
+ height: 12px;
231
+ font-size: 12px;
232
+ background-size: 10px;
233
+ }
234
+
235
+ /* //没有子节点*/
236
+ .el-tree .el-tree-node__expand-icon.is-leaf::before {
237
+ background: transparent no-repeat 0 3px;
238
+ content: '';
239
+ display: block;
240
+ width: 12px;
241
+ height: 12px;
242
+ font-size: 12px;
243
+ background-size: 10px;
244
+ }
242
245
  </style>
243
246
 
@@ -1,8 +1,10 @@
1
1
  <template>
2
2
  <div id="app-Tree" style="height:100%;">
3
- <el-container style="height: calc(100vh - 98px);border: 1px solid #eee">
4
- <el-aside :width="leftWidth?leftWidth+'px':'15%'" style="background-color:white;border-radius: 6px;">
5
- <ct-searchtree :flagsearch="true" :searchConditionApi="searchConditionApi" :searchDataApi="searchDataApi" @loaded="loaded"></ct-searchtree>
3
+ <el-container style="height: calc(100vh - 98px);border: 1px solid #eee" ref="tree_left">
4
+ <el-aside :width="leftWidth?leftWidth+'px':'15%'"
5
+ style="background-color:white;border-radius: 6px;overflow-y:hidden">
6
+ <ct-searchtree :flagsearch="true" :searchConditionApi="searchConditionApi" :searchDataApi="searchDataApi" :searchtreeHeight="searchtreeHeight"
7
+ @loaded="loaded"></ct-searchtree>
6
8
  </el-aside>
7
9
  <el-main v-if="isShowMain">
8
10
 
@@ -15,7 +17,8 @@
15
17
  </template>
16
18
  <template v-else>
17
19
  <div style="height: calc(100vh - 100px);">
18
- <ct-searchlist :searchConditionApi="searchTableConditionApi" :searchDataApi="searchTableDataApi" :api-param="apiParam"></ct-searchlist>
20
+ <ct-searchlist :searchConditionApi="searchTableConditionApi" :searchDataApi="searchTableDataApi"
21
+ :api-param="apiParam"></ct-searchlist>
19
22
  </div>
20
23
  </template>
21
24
 
@@ -25,84 +28,89 @@
25
28
  </template>
26
29
 
27
30
  <script>
28
- import dynamicElement from '../../mixins/dynamicElement'
29
- import dynamicSearchTree from './dynamicSearchTree.vue';
30
- import dynamicSearchList from '../../dynamicSearchList/src/dynamicSearchList.vue';
31
- import dynamicForm from '../../dynamicForm/src/dynamicForm';
32
- export default {
33
- name: 'ct-treelist',
34
- mixins: [dynamicElement],
35
- components: {
36
- 'ct-searchtree': dynamicSearchTree,
37
- 'ct-form': dynamicForm,
38
- },
39
- props: {
40
- vmodel: Object,
41
- searchConditionApi: String,
42
- searchDataApi: String,
43
- leftWidth: Number,
44
- },
45
- data() {
46
- return {
47
- searchTableConditionApi: "",
48
- searchTableDataApi: "",
49
- formApi: "",
50
- width: 0,
51
- height: 0,
52
- isShowMain: false,
53
- pageType: 'list',
54
- apiParam: {}
55
- };
56
- },
57
- methods: {
58
- loaded(data) {
59
- var self = this;
60
- self.isShowMain = false;
61
- self.pageType = "list";
62
- if (data && data.rowRouter && (JSON.stringify(data.rowRouter) != "{}")) {
63
- self.formApi = data.rowRouter.getLayout;
64
- self.pageType = data.rowRouter.pageType != undefined ? data.rowRouter.pageType : "list";
65
- self.width = parseFloat(data.rowRouter.width != undefined ? data.rowRouter.width : "0");
66
- self.height = parseFloat(data.rowRouter.height != undefined ? data.rowRouter.height : "0");
67
- self.searchTableConditionApi = data.rowRouter.getLayoutOfSearch;
68
- self.searchTableDataApi = data.rowRouter.getList;
69
- var defaultPara = self.$common.deepClone(data);
70
- delete defaultPara.rowRouter;
71
- delete defaultPara.getLayoutOfSearch;
72
- delete defaultPara.getList;
73
- delete defaultPara.getLayout;
74
- delete defaultPara.width;
75
- delete defaultPara.height;
31
+ import dynamicElement from '../../mixins/dynamicElement'
32
+ import dynamicSearchTree from './dynamicSearchTree.vue';
33
+ import dynamicSearchList from '../../dynamicSearchList/src/dynamicSearchList.vue';
34
+ import dynamicForm from '../../dynamicForm/src/dynamicForm';
35
+ export default {
36
+ name: 'ct-treelist',
37
+ mixins: [dynamicElement],
38
+ components: {
39
+ 'ct-searchtree': dynamicSearchTree,
40
+ 'ct-form': dynamicForm,
41
+ },
42
+ props: {
43
+ vmodel: Object,
44
+ searchConditionApi: String,
45
+ searchDataApi: String,
46
+ leftWidth: Number,
47
+ },
48
+ data() {
49
+ return {
50
+ searchTableConditionApi: "",
51
+ searchTableDataApi: "",
52
+ formApi: "",
53
+ width: 0,
54
+ height: 0,
55
+ isShowMain: false,
56
+ pageType: 'list',
57
+ apiParam: {},
58
+ searchtreeHeight:0
59
+ };
60
+ },
61
+ methods: {
62
+ loaded(data) {
63
+ var self = this;
64
+ self.isShowMain = false;
65
+ self.pageType = "list";
66
+ if (data && data.rowRouter && (JSON.stringify(data.rowRouter) != "{}")) {
67
+ self.formApi = data.rowRouter.getLayout;
68
+ self.pageType = data.rowRouter.pageType != undefined ? data.rowRouter.pageType : "list";
69
+ self.width = parseFloat(data.rowRouter.width != undefined ? data.rowRouter.width : "0");
70
+ self.height = parseFloat(data.rowRouter.height != undefined ? data.rowRouter.height : "0");
71
+ self.searchTableConditionApi = data.rowRouter.getLayoutOfSearch;
72
+ self.searchTableDataApi = data.rowRouter.getList;
73
+ var defaultPara = self.$common.deepClone(data);
74
+ delete defaultPara.rowRouter;
75
+ delete defaultPara.getLayoutOfSearch;
76
+ delete defaultPara.getList;
77
+ delete defaultPara.getLayout;
78
+ delete defaultPara.width;
79
+ delete defaultPara.height;
76
80
 
77
- self.apiParam = defaultPara;
78
- self.$nextTick(() => {
79
- if (self.searchTableConditionApi || self.searchTableDataApi || self.formApi) {
80
- self.isShowMain = true;
81
- }
82
-
83
- });
84
- }
85
- },
81
+ self.apiParam = defaultPara;
82
+ self.$nextTick(() => {
83
+ if (self.searchTableConditionApi || self.searchTableDataApi || self.formApi) {
84
+ self.isShowMain = true;
85
+ }
86
86
 
87
+ });
88
+ }
87
89
  },
88
- created() {
89
- this.model = this.vmodel;
90
- }
90
+
91
+ },
92
+ created() {
93
+ this.model = this.vmodel;
94
+ this.$nextTick(() => {
95
+ this.searchtreeHeight = this.$refs.tree_left.$el.offsetHeight;
96
+ })
91
97
  }
98
+ }
92
99
 
93
100
  </script>
94
101
  <style lang="scss">
95
- #app-Tree .el-main {
96
- padding: 0 0px 0px 10px;
97
- }
102
+ #app-Tree .el-main {
103
+ padding: 0 0px 0px 10px;
104
+ }
98
105
 
99
- #app-Tree .el-main .ct-table-content {
100
- padding: 0;
101
- }
106
+ #app-Tree .el-main .ct-table-content {
107
+ padding: 0;
108
+ }
102
109
 
103
- #app-Tree .el-main ct-form{border: 1px solid #cfcece;
104
- -webkit-box-shadow: #cfcece 0px 7px 9px 0px!important;
105
- border-radius: 6px !important;
106
- margin-top: 14px;}
107
-
110
+ #app-Tree .el-main ct-form {
111
+ border: 1px solid #cfcece;
112
+ -webkit-box-shadow: #cfcece 0px 7px 9px 0px !important;
113
+ border-radius: 6px !important;
114
+ margin-top: 14px;
115
+ }
108
116
  </style>
@@ -884,6 +884,9 @@ const SearchTable = function (data, callBack, searchModel, flagSearch, defaultSe
884
884
  get sideBarWidth() {
885
885
  return source.content.sideBarWidth || 360;
886
886
  },
887
+ get selectedRowBackColor() {
888
+ return source.content.selectedRowBackColor;
889
+ },
887
890
  };
888
891
  if (rtn.template) {
889
892
  var tempLoader = template.loader(rtn.template).default;