ap-dev 1.1.37 → 1.1.38
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.
- package/dev/ApiPanel/tabs/ApiFormSearchTree.vue +149 -149
- package/package.json +1 -1
|
@@ -1,158 +1,158 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
<div style="height: 100%">
|
|
3
|
+
<h3>表单-树查询：ap-search-tree</h3>
|
|
4
|
+
<api-tittle-2>一、示例:</api-tittle-2>
|
|
5
|
+
<div style="width: 200px">
|
|
6
|
+
<ap-search-tree :options.sync="options" />
|
|
7
|
+
</div>
|
|
8
|
+
<api-code>{{ js1 }}</api-code>
|
|
9
|
+
<api-tittle-2>二、参数说明:</api-tittle-2>
|
|
10
|
+
<api-table :data="methodData" :columns="methodCols" />
|
|
7
11
|
</div>
|
|
8
|
-
<api-code>{{ js1 }}</api-code>
|
|
9
|
-
<api-tittle-2>二、参数说明:</api-tittle-2>
|
|
10
|
-
<api-table :data="methodData" :columns="methodCols" />
|
|
11
|
-
</div>
|
|
12
12
|
</template>
|
|
13
13
|
|
|
14
14
|
<script>
|
|
15
15
|
import { ApiCode, ApiContent, ApiTable, ApiTittle1, ApiTittle2 } from './../components'
|
|
16
16
|
|
|
17
17
|
export default {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
18
|
+
name: 'ApiFormSearchTree',
|
|
19
|
+
components: {
|
|
20
|
+
ApiTable, ApiCode, ApiTittle1, ApiContent, ApiTittle2
|
|
21
|
+
},
|
|
22
|
+
data() {
|
|
23
|
+
const methodCols = [
|
|
24
|
+
{ label: '名称', prop: 'name', width: '180px' },
|
|
25
|
+
{ label: '类型', prop: 'type', width: '100px' },
|
|
26
|
+
{ label: '默认值', prop: 'default', width: '80px' },
|
|
27
|
+
{ label: '描述', prop: 'memo', minWidth: '100px' },
|
|
28
|
+
{ label: '示例代码', prop: 'code', minWidth: '100px' }]
|
|
29
|
+
const methodData = [
|
|
30
|
+
{
|
|
31
|
+
name: 'searchTreeText',
|
|
32
|
+
type: '字符串',
|
|
33
|
+
default: '',
|
|
34
|
+
memo: `表单显示值`,
|
|
35
|
+
code: `<div class="api-code"></div>`
|
|
36
|
+
}, {
|
|
37
|
+
name: 'searchTreeValue',
|
|
38
|
+
type: '字符串/数组',
|
|
39
|
+
default: '',
|
|
40
|
+
memo: `dialog树的选择值(打开后会自动选择)<br>
|
|
41
41
|
<span class="api-memo">注：多选时，可以使用","拼接的字符串。</span>`,
|
|
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
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
42
|
+
code: `<div class="api-code"></div>`
|
|
43
|
+
}, {
|
|
44
|
+
name: 'searchTreeInitText',
|
|
45
|
+
type: '布尔',
|
|
46
|
+
default: 'false',
|
|
47
|
+
memo: `是否自动初始化searchTreeText的值`,
|
|
48
|
+
code: `<div class="api-code"></div>`
|
|
49
|
+
}, {
|
|
50
|
+
name: 'searchTreeTitle',
|
|
51
|
+
type: '字符串',
|
|
52
|
+
default: '查找',
|
|
53
|
+
memo: '弹出框标题',
|
|
54
|
+
code: `<div class="api-code">searchTreeTitle:"请选择"</div>`
|
|
55
|
+
}, {
|
|
56
|
+
name: 'searchTreeWidth',
|
|
57
|
+
type: '字符串',
|
|
58
|
+
default: '400px',
|
|
59
|
+
memo: '弹出框宽度。百分比或者px。',
|
|
60
|
+
code: `<div class="api-code"></div>`
|
|
61
|
+
}, {
|
|
62
|
+
name: 'searchTreeHeight',
|
|
63
|
+
type: '字符串',
|
|
64
|
+
default: '400px',
|
|
65
|
+
memo: '树容器的高度。百分比或者px。',
|
|
66
|
+
code: `<div class="api-code"></div>`
|
|
67
|
+
}, {
|
|
68
|
+
name: 'searchTreeKey',
|
|
69
|
+
type: '对象',
|
|
70
|
+
default: '见描述',
|
|
71
|
+
memo: '默认：{idKey:"fdId",parentKey:"fdParentId", labelKey:"fdName"}<br>结果集映射关系。labelKey：显示内容。',
|
|
72
|
+
code: `<div class="api-code"></div>`
|
|
73
|
+
}, {
|
|
74
|
+
name: '插槽',
|
|
75
|
+
type: '插槽',
|
|
76
|
+
default: '空',
|
|
77
|
+
memo: '1、未定义插槽时，默认显示【searchTreeKey.labelKey】<br>2、自定义插槽时，以插槽为准',
|
|
78
|
+
code: `<div class="api-code">< ap-search-tree :options.sync="option">
|
|
79
|
+
< span slot="tree" slot-scope="scope">{{ scope.data.fdName }}</span>
|
|
80
|
+
< /ap-search-tree></div>`
|
|
81
|
+
}, {
|
|
82
|
+
name: 'searchTreeUrl',
|
|
83
|
+
type: '字符串',
|
|
84
|
+
default: '',
|
|
85
|
+
memo: '数据请求路径。返回response.data',
|
|
86
|
+
code: `<div class="api-code"></div>`
|
|
87
|
+
}, {
|
|
88
|
+
name: 'searchTreeMethod',
|
|
89
|
+
type: '字符串',
|
|
90
|
+
default: 'post',
|
|
91
|
+
memo: '数据请求method。get或post',
|
|
92
|
+
code: `<div class="api-code"></div>`
|
|
93
|
+
}, {
|
|
94
|
+
name: 'searchTreeParams',
|
|
95
|
+
type: '对象/方法',
|
|
96
|
+
default: '',
|
|
97
|
+
memo: '数据请求参数。<br>注：1、参数动态时需要使用方法，参数固定可直接定义对象',
|
|
98
|
+
code: `<div class="api-code">1、固定参数：定义对象
|
|
99
99
|
searchTreeParams: { type: 123}
|
|
100
100
|
2、动态参数：使用箭头函数
|
|
101
101
|
searchTreeParams: () => {
|
|
102
102
|
return { type: this.typeId}
|
|
103
103
|
}</div>`
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
104
|
+
}, {
|
|
105
|
+
name: 'searchTreeSelectMultiple',
|
|
106
|
+
type: '布尔',
|
|
107
|
+
default: 'false',
|
|
108
|
+
memo: '是否多选。默认单选。',
|
|
109
|
+
code: `<div class="api-code"></div>`
|
|
110
|
+
}, {
|
|
111
|
+
name: 'searchTreeCheckStrictly',
|
|
112
|
+
type: '布尔',
|
|
113
|
+
default: 'true',
|
|
114
|
+
memo: '是否严格的遵循父子不互相关联的做法',
|
|
115
|
+
code: `<div class="api-code"></div>`
|
|
116
|
+
}, {
|
|
117
|
+
name: 'searchTreeExpandAll',
|
|
118
|
+
type: '布尔',
|
|
119
|
+
default: 'true',
|
|
120
|
+
memo: '是否默认树结构展开',
|
|
121
|
+
code: `<div class="api-code"></div>`
|
|
122
|
+
}, {
|
|
123
|
+
name: 'searchTreeDisabled',
|
|
124
|
+
type: '布尔',
|
|
125
|
+
default: 'false',
|
|
126
|
+
memo: '是否禁用',
|
|
127
|
+
code: `<div class="api-code"></div>`
|
|
128
|
+
}, {
|
|
129
|
+
name: 'searchTreeClear',
|
|
130
|
+
type: '方法',
|
|
131
|
+
default: '',
|
|
132
|
+
memo: '点击清空回调。返回true关闭dialog。',
|
|
133
|
+
code: `<div class="api-code"></div>`
|
|
134
|
+
}, {
|
|
135
|
+
name: 'searchTreeConfirm',
|
|
136
|
+
type: '方法',
|
|
137
|
+
default: '',
|
|
138
|
+
memo: '点击确定回调。参数：selectedRows。返回true关闭dialog。',
|
|
139
|
+
code: `<div class="api-code"></div>`
|
|
140
|
+
},{
|
|
141
|
+
name: 'filterNodeMethod',
|
|
142
|
+
type: '方法',
|
|
143
|
+
default: '',
|
|
144
|
+
memo: `自定义节点过滤方法<br>
|
|
145
145
|
<span class="api-memo">注：默认使用【searchTreeKey.labelKey】参数过滤</span>`,
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
146
|
+
code: `<div class="api-code">filterNodeMethod: (value, data) => {
|
|
147
|
+
if (!value) return true;
|
|
148
|
+
if(data["fdCode"] != null && data["fdCode"].indexOf(value) !== -1) {
|
|
149
|
+
return true;
|
|
150
|
+
}
|
|
151
|
+
return false;
|
|
152
|
+
}</div>`
|
|
153
|
+
}
|
|
154
|
+
]
|
|
155
|
+
const js1 = `// 1、定义树查询：
|
|
156
156
|
<el-form :model="form" :rules="rules" ref="formRef" label-width="100px">
|
|
157
157
|
<el-form-item label="attr" prop="attr">
|
|
158
158
|
<ap-search-tree :options.sync="options"></ap-search-tree>
|
|
@@ -178,15 +178,15 @@ options:{
|
|
|
178
178
|
return true;
|
|
179
179
|
},
|
|
180
180
|
}`
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
181
|
+
const options = {}
|
|
182
|
+
return {
|
|
183
|
+
methodData,
|
|
184
|
+
methodCols,
|
|
185
|
+
js1,
|
|
186
|
+
options
|
|
187
|
+
}
|
|
188
|
+
},
|
|
189
|
+
methods: {}
|
|
190
190
|
}
|
|
191
191
|
</script>
|
|
192
192
|
|