Skip to content

csbr-daop / fe-data-trusted-space

Go to a project
Toggle navigation
Toggle navigation pinning
6f90b49e by lxs
Options

新增数据源管理

1 parent 93c44ebe
Inline Side-by-side
Showing 3 changed files with 1432 additions and 2 deletions
src/api/modules/queryService.ts
...@@ -27,8 +27,7 @@ export const refreshToken = (params) => { ...@@ -27,8 +27,7 @@ export const refreshToken = (params) => {
27 27
28 export const getSystemMenu = (params) => { 28 export const getSystemMenu = (params) => {
29 return request({ 29 return request({
30 url: `${ 30 url: `${import.meta.env.VITE_APP_AUTH_URL
31 import.meta.env.VITE_APP_AUTH_URL
32 }/product-menu-permission/tenant/get-product-menu?tenantGuid=${params.tenantGuid}&platformSystemGuid=32774fcfdf5e43e8b866660374d8bced`, 31 }/product-menu-permission/tenant/get-product-menu?tenantGuid=${params.tenantGuid}&platformSystemGuid=32774fcfdf5e43e8b866660374d8bced`,
33 method: "get", 32 method: "get",
34 }); 33 });
...@@ -210,3 +209,62 @@ export const exportDictionary = (params) => request({ ...@@ -210,3 +209,62 @@ export const exportDictionary = (params) => request({
210 data: params, 209 data: params,
211 responseType: 'blob' 210 responseType: 'blob'
212 }) 211 })
212
213 /**
214 * 数据源管理
215 **/
216 // 分页查询
217 export const getDataSourceList = (params) => request({
218 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/list`,
219 method: "post",
220 data: params,
221 });
222
223 // 获取数据源列表
224 export const getDataSource = (params) => request({
225 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/get-source-list`,
226 method: "post",
227 data: params,
228 });
229 // 新增
230 export const addDataSource = (params) => request({
231 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/save`,
232 method: "post",
233 data: params,
234 });
235 // 删除
236 export const deleteDataSource = (params) => request({
237 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/delete`,
238 method: "delete",
239 data: params,
240 });
241 // 修改
242 export const updateDataSource = (params) => request({
243 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/update`,
244 method: "put",
245 data: params,
246 });
247 // 查看数据源详情
248 export const getDataSourceDetail = (params) => request({
249 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/detail/${params}`,
250 method: "get",
251 });
252 // 连通检测
253 export const checkDataSourceConnect = (params) => request({
254 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/check-connect`,
255 method: "post",
256 params,
257 });
258 // 连接测试
259 export const checkDataSourceConnectTest = (params) => request({
260 url: `${import.meta.env.VITE_APP_DATA_SOURCE_URL}/data-source/check-connect-test`,
261 method: "post",
262 data: params,
263 });
264
265 // 获取所有参数列表
266 export const getAllFlowData = (params) => request({
267 url: `${import.meta.env.VITE_APP_CONFIG_URL}/dict/data/get-by-dictType`,
268 method: 'get',
269 params
270 })
......
src/router/modules/dataInventory.ts
...@@ -282,6 +282,27 @@ const routes: RouteRecordRaw[] = [ ...@@ -282,6 +282,27 @@ const routes: RouteRecordRaw[] = [
282 }, 282 },
283 ], 283 ],
284 }, 284 },
285 {
286 path: '/data-inventory/data-source',
287 component: Layout,
288 meta: {
289 title: '数据源管理',
290 icon: 'sidebar-videos',
291 },
292 children: [
293 {
294 path: '',
295 name: 'dataSource',
296 component: () => import('@/views/data_inventory/dataSource.vue'),
297 meta: {
298 title: '数据源管理',
299 sidebar: false,
300 breadcrumb: false,
301 cache: true
302 },
303 },
304 ],
305 },
285 ] 306 ]
286 307
287 export default routes 308 export default routes
......
src/views/data_inventory/dataSource.vue 0 → 100644
1 <route lang="yaml">
2 name: dataSource
3 </route>
4
5 <script lang="ts" setup name="dataSource">
6 import { ref, onMounted } from "vue";
7 import { ElMessage, ElMessageBox } from "element-plus";
8 import TableTools from "@/components/Tools/table_tools.vue";
9
10 import {
11 addDataSource,
12 getDataSourceList,
13 deleteDataSource,
14 updateDataSource,
15 getDataSourceDetail,
16 checkDataSourceConnect,
17 checkDataSourceConnectTest,
18 getAllFlowData
19 } from "@/api/modules/queryService";
20
21 const { proxy } = getCurrentInstance() as any;
22
23 const searchItemList = ref([
24 {
25 type: "select",
26 label: "",
27 field: "systemLayer",
28 default: "",
29 placeholder: "系统分层",
30 options: [
31 { label: "业务系统", value: "业务系统" },
32 { label: "数据中心", value: "数据中心" },
33 ],
34 clearable: true,
35 },
36 {
37 type: "select",
38 label: "",
39 field: "databaseType",
40 default: "",
41 placeholder: "库类型",
42 options: [
43 { label: "mysql", value: "mysql" },
44 { label: "doris", value: "doris" },
45 { label: "oracle", value: "oracle" },
46 ],
47 clearable: true,
48 },
49 {
50 type: "select",
51 label: "",
52 field: "connectStatus",
53 default: "",
54 placeholder: "连通状态",
55 options: [
56 { label: "已连通", value: "1" },
57 { label: "连通失败", value: "2" },
58 ],
59 clearable: true,
60 },
61 {
62 type: "input",
63 label: "",
64 field: "databaseNameZh",
65 default: "",
66 placeholder: "数据源名称",
67 clearable: true,
68 },
69 {
70 type: "input",
71 label: "",
72 field: "databaseNameEn",
73 default: "",
74 placeholder: "数据库名",
75 clearable: true,
76 },
77 ]);
78
79 const currTableData: any = ref<Object>({});
80 const page = ref({
81 limit: 50,
82 curr: 1,
83 sizes: [
84 { label: "10", value: 10 },
85 { label: "50", value: 50 },
86 { label: "100", value: 100 },
87 { label: "150", value: 150 },
88 { label: "200", value: 200 },
89 ],
90 systemLayer: '',
91 databaseType: '',
92 connectStatus: '',
93 databaseNameZh: '',
94 databaseNameEn: ''
95 });
96 const selectRowData = ref([]);
97 const tableInfo = ref({
98 id: "data-source-table",
99 multiple: true,
100 fields: [
101 { label: "序号", type: "index", width: 56, align: "center" },
102 { label: "数据源名称", field: "databaseNameZh", width: 120 },
103 { label: "系统分层", field: "systemLayer", width: 96 },
104 { label: "库类型", field: "databaseType", width: 96 },
105 { label: "数据库名", field: "databaseNameEn", width: 200 },
106 {
107 label: "连通状态",
108 field: "connectStatus",
109 type: "tag",
110 width: 96,
111 align: "center",
112 },
113 { label: "连通时间", field: "lastCheckTime", width: 172 },
114 { label: "操作人", field: "updateUserName", width: 140 },
115 { label: "更新时间", field: "updateTime", width: 172 },
116 ],
117 data: [],
118 page: {
119 type: "normal",
120 rows: 0,
121 ...page.value,
122 },
123 actionInfo: {
124 label: "操作",
125 type: "btn",
126 width: 160,
127 btns: [
128 { label: "编辑", value: "edit" },
129 { label: "连通测试", value: "test" },
130 { label: "删除", value: "delete" },
131 ],
132 },
133 loading: false,
134 });
135
136 const tabActiveName = ref("1");
137 const tabsInfo: any = ref({
138 type: "tabs",
139 title: "",
140 style: {
141 padding: "0 24px",
142 },
143 tabsInfo: {
144 activeName: "",
145 tabs: [
146 { label: "常规", name: "常规" },
147 // { label: "SSL", name: "SSL" }, //未支持，先隐藏掉
148 // { label: "SSH", name: "SSH" },
149 // { label: "HTTP", name: "HTTP" },
150 ],
151 },
152 });
153 const formItems: any = ref([]);
154 const formRules: any = ref({});
155 const flowList: any = ref([])
156 const formInfo: any = ref({
157 type: "form",
158 title: "",
159 style: {
160 padding: "0 24px",
161 overflow: 'hidden auto'
162 },
163 formInfo: {
164 id: "add-source-form",
165 items: formItems.value,
166 rules: formRules.value,
167 },
168 });
169 const contents: any = ref({
170 normal: {
171 items: [
172 {
173 label: "数据源名称",
174 type: "input",
175 placeholder: "请输入",
176 field: "databaseNameZh",
177 default: "",
178 clearable: true,
179 required: true,
180 },
181 {
182 label: "系统分层",
183 type: "select",
184 placeholder: "请选择",
185 field: "systemLayer",
186 default: "",
187 options: [
188 {
189 label: "业务系统",
190 value: "业务系统",
191 },
192 {
193 label: "数据中心",
194 value: "数据中心",
195 },
196 ],
197 clearable: true,
198 required: true,
199 },
200 {
201 label: "库类型",
202 type: "select",
203 placeholder: "请选择",
204 field: "databaseType",
205 default: "",
206 options: [
207 { label: "mysql", value: "mysql" },
208 { label: "doris", value: "doris" },
209 { label: "oracle", value: "oracle" },
210 ],
211 clearable: true,
212 required: true,
213 },
214 {
215 label: "业务系统",
216 type: "select",
217 placeholder: "请选择",
218 field: "bizSystem",
219 default: "",
220 options: [],
221 clearable: true,
222 required: true,
223 },
224 {
225 label: "集群信息",
226 type: "textarea-group",
227 placeholder: "请输入",
228 field: "jqxx",
229 default: "",
230 tooltipContent:
231 "格式：doris-fe-zs.doris:8030,doris-fe-zs.doris:8090 多个地址用英文半角逗号分隔",
232 children: [
233 {
234 label: "feLoadUrl",
235 type: "textarea",
236 placeholder: "请输入",
237 field: "feLoadUrl",
238 default: "",
239 clearable: true,
240 required: true,
241 block: true,
242 },
243 {
244 label: "beLoadUrl",
245 type: "textarea",
246 placeholder: "请输入",
247 field: "beLoadUrl",
248 default: "",
249 clearable: true,
250 required: true,
251 block: true,
252 },
253 {
254 label: "dorisJdbcUrl",
255 type: "textarea",
256 placeholder: "请输入",
257 field: "dorisJdbcUrl",
258 default: "",
259 clearable: true,
260 required: true,
261 block: true,
262 },
263 ],
264 block: true,
265 visible: false,
266 },
267 {
268 label: "服务器",
269 type: "input",
270 placeholder: "请输入",
271 field: "host",
272 default: "",
273 clearable: true,
274 required: true,
275 },
276 {
277 label: "端口",
278 type: "input",
279 placeholder: "请输入",
280 field: "port",
281 default: "",
282 clearable: true,
283 required: true,
284 },
285 {
286 label: "用户名",
287 type: "input",
288 placeholder: "请输入",
289 field: "logonUser",
290 default: "",
291 clearable: true,
292 required: true,
293 autocompleteSetting: {
294 autocomplete: "off",
295 readonly: true,
296 },
297 },
298 {
299 label: "密码",
300 type: "password",
301 placeholder: "请输入",
302 field: "password",
303 default: "",
304 clearable: true,
305 required: true,
306 autocompleteSetting: {
307 autocomplete: "off",
308 readonly: true,
309 },
310 },
311 {
312 label: "数据库名",
313 type: "input",
314 placeholder: "请输入",
315 field: "databaseNameEn",
316 default: "",
317 clearable: true,
318 required: true,
319 },
320 {
321 label: "连接属性",
322 type: "textarea-tips",
323 placeholder: "请输入",
324 field: "linkage",
325 default: "",
326 tips: {
327 type: "table",
328 size: 400,
329 placement: "right",
330 offset: 12,
331 tableInfo: {
332 id: "",
333 fields: [
334 { label: "数据库", field: "jsmc", width: 120 },
335 { label: "连接属性", field: "sx", width: 200 },
336 ],
337 data: [
338 {
339 jsmc: "MYSQL8.0",
340 sx: "列出支持的连接属性,并给出解释和范例,多个属性用;分割",
341 cjsj: "2022-12-12 08:12:12",
342 },
343 {
344 jsmc: "MYSQL8.0",
345 sx: "服务器的时区:serverTimezone=Asia/Shanghai;",
346 cjsj: "2022-12-12 08:12:12",
347 },
348 {
349 jsmc: "MYSQL8.0",
350 sx: "useUnicode=utf8;",
351 cjsj: "2022-12-12 08:12:12",
352 },
353 {
354 jsmc: "MYSQL8.0",
355 sx: "characterEncoding=utf8;",
356 cjsj: "2022-12-12 08:12:12",
357 },
358 {
359 jsmc: "MYSQL8.0",
360 sx: "useSSL=false",
361 cjsj: "2022-12-12 08:12:12",
362 },
363 ],
364 showPage: false,
365 tableTool: [],
366 actionInfo: {
367 show: false,
368 },
369 btn: {
370 label: "",
371 value: "QuestionFilled",
372 },
373 },
374 },
375 clearable: true,
376 required: false,
377 block: true,
378 },
379 ],
380 rules: {
381 databaseNameZh: [
382 {
383 validator: (rule: any, value: any, callback: any) => {
384 if (value === "") {
385 callback(new Error("请填写数据源名称"));
386 } else {
387 if (
388 dialogInfo.value.type == "edit" &&
389 value == currTableData.value.databaseNameZh
390 ) {
391 callback();
392 return;
393 }
394 callback();
395 // let params: any = {
396 // dataPermissionName: value,
397 // };
398 // if (dialogInfo.value.type == 'edit') {
399 // params.guid = currTableData.value.guid
400 // }
401 // checkPermissionDict(params)
402 // .then((res: any) => {
403 // if (res.code == proxy.$passCode) {
404 // if (res.data) {
405 // callback(new Error("该名称已存在,请填写其他名称"));
406 // } else {
407 // callback();
408 // }
409 // } else {
410 // callback(new Error(res.msg));
411 // }
412 // })
413 // .catch((xhr) => {
414 // callback(new Error(xhr.msg));
415 // });
416 }
417 },
418 trigger: "blur",
419 },
420 ],
421 bizSystem: [{
422 required: true,
423 message: "请选择业务系统",
424 trigger: "change",
425 }],
426 systemLayer: [
427 {
428 required: true,
429 message: "请选择系统分层",
430 trigger: "change",
431 },
432 ],
433 databaseType: [
434 {
435 required: true,
436 message: "请选择库类型",
437 trigger: "change",
438 },
439 ],
440 host: [
441 {
442 required: true,
443 message: "请填写服务器ip地址",
444 trigger: "blur",
445 },
446 ],
447 port: [
448 {
449 required: true,
450 message: "请填写端口号",
451 trigger: "blur",
452 },
453 ],
454 logonUser: [
455 {
456 required: true,
457 message: "请填写用户名",
458 trigger: "blur",
459 },
460 ],
461 password: [
462 {
463 required: true,
464 message: "请填写密码",
465 trigger: "blur",
466 },
467 ],
468 databaseNameEn: [
469 {
470 required: true,
471 message: "请填写数据库名",
472 trigger: "blur",
473 },
474 ],
475 feLoadUrl: [
476 {
477 validator: (rule: any, value: any, callback: any) => {
478 if (value === "") {
479 callback(new Error("请填写feLoadUrl"));
480 } else {
481 if (
482 dialogInfo.value.type == "edit" &&
483 value == currTableData.value.feLoadUrl
484 ) {
485 callback();
486 return;
487 }
488 callback();
489 }
490 },
491 trigger: "blur",
492 },
493 ],
494 beLoadUrl: [
495 {
496 validator: (rule: any, value: any, callback: any) => {
497 if (value === "") {
498 callback(new Error("请填写beLoadUrl"));
499 } else {
500 if (
501 dialogInfo.value.type == "edit" &&
502 value == currTableData.value.beLoadUrl
503 ) {
504 callback();
505 return;
506 }
507 callback();
508 }
509 },
510 trigger: "blur",
511 },
512 ],
513 dorisJdbcUrl: [
514 {
515 validator: (rule: any, value: any, callback: any) => {
516 if (value === "") {
517 callback(new Error("请填写dorisJdbcUrl"));
518 } else {
519 if (
520 dialogInfo.value.type == "edit" &&
521 value == currTableData.value.dorisJdbcUrl
522 ) {
523 callback();
524 return;
525 }
526 callback();
527 }
528 },
529 trigger: "blur",
530 },
531 ],
532 },
533 },
534 ssl: {
535 items: [
536 {
537 label: "",
538 type: "checkbox",
539 col: "margin_b_0",
540 placeholder: "使用SSL",
541 field: "useSsl",
542 required: false,
543 block: true,
544 },
545 {
546 label: "",
547 type: "checkbox-panel",
548 placeholder: "使用验证",
549 field: "yz",
550 children: [
551 {
552 label: "客户端秘钥",
553 type: "file-upload",
554 placeholder: "选择文件上传",
555 field: "khdmy",
556 disabled: true,
557 required: true,
558 block: true,
559 },
560 {
561 label: "客户端证书",
562 type: "file-upload",
563 placeholder: "选择文件上传",
564 field: "khdzs",
565 disabled: true,
566 required: true,
567 block: true,
568 },
569 {
570 label: "CA证书",
571 type: "file-upload",
572 placeholder: "选择文件上传",
573 field: "cazs",
574 disabled: true,
575 required: true,
576 block: true,
577 },
578 {
579 label: "指定密码检索表",
580 type: "append-empty",
581 placeholder: "请输入",
582 field: "khdzs",
583 disabled: true,
584 required: true,
585 block: true,
586 },
587 ],
588 required: false,
589 block: true,
590 },
591 ],
592 rules: {},
593 },
594 ssh: {
595 items: [
596 {
597 label: "",
598 type: "checkbox-panel",
599 placeholder: "使用SSH",
600 field: "yz",
601 children: [
602 {
603 label: "主机名或IP地址",
604 type: "input",
605 placeholder: "请输入",
606 field: "khdmy",
607 required: false,
608 disabled: true,
609 },
610 {
611 label: "端口",
612 type: "input",
613 placeholder: "请输入",
614 field: "khdzs",
615 required: false,
616 disabled: true,
617 },
618 {
619 label: "用户名",
620 type: "input",
621 placeholder: "请输入",
622 field: "cazs",
623 required: false,
624 disabled: true,
625 },
626 {
627 label: "验证方法",
628 type: "select",
629 placeholder: "请选择",
630 field: "yzfs",
631 options: [
632 { label: "密码", value: "pwd" },
633 { label: "手机号", value: "tel" },
634 ],
635 required: false,
636 disabled: true,
637 },
638 {
639 label: "密码",
640 type: "input",
641 placeholder: "请输入",
642 field: "pwd",
643 required: false,
644 disabled: true,
645 },
646 {
647 label: "",
648 type: "checkbox",
649 placeholder: "保存密码",
650 field: "savePwd",
651 required: false,
652 },
653 ],
654 required: false,
655 block: true,
656 },
657 ],
658 rules: {},
659 },
660 http: {
661 items: [
662 {
663 label: "",
664 type: "checkbox-input",
665 placeholder: "使用HTTP通道",
666 field: "tddz",
667 children: [
668 {
669 label: "",
670 type: "input",
671 placeholder: "通道地址",
672 field: "khdmy",
673 required: false,
674 disabled: true,
675 },
676 ],
677 block: true,
678 },
679 {
680 label: "",
681 type: "tabs-panel-card",
682 placeholder: "用base64编码传出查询",
683 field: "basebm",
684 tabsInfo: {
685 type: "card",
686 activeName: "yz",
687 col: "border",
688 tabs: [
689 {
690 label: "验证",
691 name: "yz",
692 pane: {
693 type: "form",
694 title: "",
695 formInfo: {
696 id: "",
697 items: [
698 {
699 label: "",
700 type: "checkbox-panel",
701 col: "margin_b_0 border_none col_3",
702 placeholder: "使用密码验证",
703 field: "mmyz",
704 children: [
705 {
706 label: "",
707 type: "input",
708 placeholder: "用户名",
709 field: "cazs",
710 required: false,
711 disabled: true,
712 },
713 {
714 label: "",
715 type: "input",
716 placeholder: "密码",
717 field: "pwd",
718 required: false,
719 disabled: true,
720 },
721 {
722 label: "",
723 type: "checkbox",
724 placeholder: "保存密码",
725 field: "savePwd",
726 required: false,
727 },
728 ],
729 required: false,
730 block: true,
731 },
732 {
733 label: "",
734 type: "checkbox-panel",
735 col: "border_none",
736 placeholder: "使用证书验证",
737 field: "zsyz",
738 children: [
739 {
740 label: "客户端秘钥",
741 type: "file-upload",
742 placeholder: "选择文件上传",
743 field: "khdmy",
744 disabled: true,
745 required: true,
746 block: true,
747 },
748 {
749 label: "客户端证书",
750 type: "file-upload",
751 placeholder: "选择文件上传",
752 field: "khdzs",
753 disabled: true,
754 required: true,
755 block: true,
756 },
757 {
758 label: "CA证书",
759 type: "file-upload",
760 placeholder: "选择文件上传",
761 field: "cazs",
762 disabled: true,
763 required: true,
764 block: true,
765 },
766 {
767 label: "密码短语",
768 type: "append-empty",
769 placeholder: "请输入",
770 field: "khdzs",
771 disabled: true,
772 required: true,
773 block: true,
774 },
775 ],
776 required: false,
777 block: true,
778 },
779 ],
780 },
781 },
782 },
783 {
784 label: "代理服务器",
785 name: "dl",
786 pane: {
787 type: "form",
788 title: "",
789 formInfo: {
790 id: "",
791 items: [
792 {
793 label: "",
794 type: "checkbox-panel",
795 col: "border_none",
796 placeholder: "使用代理服务器",
797 field: "yz",
798 children: [
799 {
800 label: "主机名或IP地址",
801 type: "input",
802 placeholder: "请输入",
803 field: "khdmy",
804 required: false,
805 disabled: true,
806 },
807 {
808 label: "端口",
809 type: "input",
810 placeholder: "请输入",
811 field: "khdzs",
812 required: false,
813 disabled: true,
814 },
815 {
816 label: "用户名",
817 type: "input",
818 placeholder: "请输入",
819 field: "cazs",
820 required: false,
821 disabled: true,
822 },
823 {
824 label: "验证方法",
825 type: "select",
826 placeholder: "请选择",
827 field: "yzfs",
828 options: [
829 { label: "密码", value: "pwd" },
830 { label: "手机号", value: "tel" },
831 ],
832 required: false,
833 disabled: true,
834 },
835 {
836 label: "密码",
837 type: "input",
838 placeholder: "请输入",
839 field: "pwd",
840 required: false,
841 disabled: true,
842 },
843 {
844 label: "",
845 type: "checkbox",
846 placeholder: "保存密码",
847 field: "savePwd",
848 required: false,
849 },
850 ],
851 required: false,
852 block: true,
853 },
854 ],
855 },
856 },
857 },
858 ],
859 },
860 children: [
861 {
862 label: "主机名或IP地址",
863 type: "input",
864 placeholder: "请输入",
865 field: "khdmy",
866 required: false,
867 },
868 {
869 label: "端口",
870 type: "input",
871 placeholder: "请输入",
872 field: "khdzs",
873 required: false,
874 },
875 {
876 label: "用户名",
877 type: "input",
878 placeholder: "请输入",
879 field: "cazs",
880 required: false,
881 },
882 {
883 label: "验证方法",
884 type: "select",
885 placeholder: "请选择",
886 field: "yzfs",
887 default: "pwd",
888 options: [
889 { label: "密码", value: "pwd" },
890 { label: "手机号", value: "tel" },
891 ],
892 required: false,
893 },
894 {
895 label: "密码",
896 type: "input",
897 placeholder: "请输入",
898 field: "pwd",
899 required: false,
900 },
901 {
902 label: "",
903 type: "checkbox",
904 placeholder: "保存密码",
905 field: "savePwd",
906 required: false,
907 },
908 ],
909 required: false,
910 block: true,
911 },
912 ],
913 rules: {},
914 },
915 });
916
917 const dialogRef = ref();
918 const dialogInfo = ref({
919 visible: false,
920 size: 700,
921 direction: "column",
922 height: '440px',
923 header: {
924 title: "",
925 },
926 type: "",
927 readonly: false,
928 contents: [],
929 footer: {
930 btns: [
931 { type: "default", label: "取消", value: "cancel" },
932 { type: "primary", label: "确定", value: "submit" },
933 ],
934 textBtns: [{ type: "primary", label: "连通测试", value: "connect" }],
935 },
936 });
937
938 const setFormItems = (name, info: any = null) => {
939 let contentFormInfo: any = {};
940 if (name == "常规") {
941 tabActiveName.value = "1";
942 contentFormInfo = contents.value["normal"];
943 } else if (name == "SSL") {
944 tabActiveName.value = "2";
945 contentFormInfo = contents.value["ssl"];
946 } else if (name == "SSH") {
947 tabActiveName.value = "3";
948 contentFormInfo = contents.value["ssh"];
949 } else if (name == "HTTP") {
950 tabActiveName.value = "4";
951 contentFormInfo = contents.value["http"];
952 }
953
954 tabsInfo.value.tabsInfo.activeName = name;
955 formItems.value = contentFormInfo.items;
956 formRules.value = contentFormInfo.rules;
957
958 if (info !== null) {
959 const type = dialogInfo.value.type;
960 formItems.value.map((item) => {
961 if (
962 item.field == "host" ||
963 item.field == "port" ||
964 item.field == "logonUser" ||
965 item.field == "password"
966 ) {
967 if (type == "edit" || type == "detail") {
968 item.default = info?.[item.field] ?? "";
969 } else {
970 item.default = info[item.field] ?? "";
971 }
972 if (item.field == "logonUser" || item.field == "password") {
973 item.autocompleteSetting.readonly = true;
974 }
975 } else if (item.field == "jqxx") {
976 item.visible = info.databaseType == "doris";
977 item.children.map((child) => {
978 if (type == 'edit' || type == 'detail') {
979 child.default = info?.[child.field] ?? "";
980 } else {
981 child.default = info[child.field] ?? "";
982 }
983 });
984 } else if (item.field == 'bizSystem') {
985 item.visible = info.systemLayer == '业务系统';
986 item.default = info[item.field] || "";
987 }
988 else {
989 item.default = info[item.field] || "";
990 }
991 });
992 } else {
993 formItems.value.map((item) => {
994 if (item.field == "logonUser" || item.field == "password") {
995 item.autocompleteSetting.readonly = true;
996 }
997 });
998 }
999
1000 formInfo.value.formInfo.items = formItems.value;
1001 formInfo.value.formInfo.rules = formRules.value;
1002
1003 const content: any = [tabsInfo.value, formInfo.value];
1004 dialogInfo.value.contents = content;
1005 };
1006
1007 const getFirstPageData = () => {
1008 page.value.curr = 1;
1009 getTableData();
1010 };
1011 onMounted(() => {
1012 getAllFlowData({ dictType: "业务系统" }).then((res) => {
1013 flowList.value = res.data
1014 contents.value.normal.items[3].options = flowList.value
1015 })
1016 })
1017 const toSearch = (val: any, clear: boolean = false) => {
1018 if (clear) {
1019 searchItemList.value.map((item) => (item.default = ""));
1020 page.value.systemLayer = "";
1021 page.value.databaseType = "";
1022 page.value.connectStatus = "";
1023 page.value.databaseNameZh = "";
1024 page.value.databaseNameEn = "";
1025 } else {
1026 page.value.systemLayer = val.systemLayer;
1027 page.value.databaseType = val.databaseType;
1028 page.value.connectStatus = val.connectStatus;
1029 page.value.databaseNameZh = val.databaseNameZh;
1030 page.value.databaseNameEn = val.databaseNameEn;
1031 }
1032 getTableData();
1033 };
1034
1035 const getTableData = () => {
1036 tableInfo.value.loading = true;
1037 getDataSourceList({
1038 pageIndex: page.value.curr,
1039 pageSize: page.value.limit,
1040 systemLayer: page.value.systemLayer,
1041 databaseType: page.value.databaseType,
1042 connectStatus: page.value.connectStatus,
1043 databaseNameZh: page.value.databaseNameZh,
1044 databaseNameEn: page.value.databaseNameEn
1045 })
1046 .then((res: any) => {
1047 if (res.code == proxy.$passCode) {
1048 const data = res.data || {};
1049 tableInfo.value.data = data.records || [];
1050 tableInfo.value.page.limit = data.pageSize;
1051 tableInfo.value.page.curr = data.pageIndex;
1052 tableInfo.value.page.rows = data.totalRows;
1053 } else {
1054 ElMessage({
1055 type: "error",
1056 message: res.msg,
1057 });
1058 }
1059 tableInfo.value.loading = false;
1060 })
1061 .catch((xhr) => {
1062 tableInfo.value.loading = false;
1063 });
1064 };
1065
1066 const tableSelectionChange = (val) => {
1067 selectRowData.value = val.map((item) => item.guid);
1068 };
1069
1070 const tablePageChange = (info) => {
1071 page.value.curr = Number(info.curr);
1072 page.value.limit = Number(info.limit);
1073 getTableData();
1074 };
1075
1076 const tabChange = (tabName) => {
1077 // TODO.等添加了tab切换之后再保留旧值.
1078 setFormItems(tabName);
1079 };
1080
1081 /** 表单修改时的原始值 */
1082 const originValue: any = ref({});
1083
1084 const formSelectChange = (val, row, info) => {
1085 console.log(row, info)
1086 if (row.field == "databaseType" || row.field == 'systemLayer') {
1087 if (tabsInfo.value.tabsInfo.activeName == "常规") {
1088 let newInfo = originValue.value = Object.assign(originValue.value, info);
1089 setFormItems("常规", newInfo);
1090 }
1091 }
1092 };
1093
1094 const tableBtnClick = (scope, btn) => {
1095 const type = btn.value;
1096 const row = scope.row;
1097 currTableData.value = row;
1098 if (type == "edit") {
1099 dialogInfo.value.type = type;
1100 dialogInfo.value.header.title = "编辑数据源";
1101 const guid = row.guid;
1102 getDataSourceDetail(guid).then((res: any) => {
1103 if (res.code == proxy.$passCode && res.data) {
1104 const data = res.data;
1105 currTableData.value = data;
1106 setDetailInfo();
1107 } else {
1108 ElMessage({
1109 type: "error",
1110 message: res.msg,
1111 });
1112 }
1113 });
1114 } else if (type == "test") {
1115 checkConnect({});
1116 } else if (type == "delete") {
1117 open("此操作将永久删除, 是否继续?", "warning");
1118 }
1119 };
1120
1121 const open = (msg, type, isBatch = false) => {
1122 ElMessageBox.confirm(msg, "提示", {
1123 confirmButtonText: "确定",
1124 cancelButtonText: "取消",
1125 type: type,
1126 }).then(() => {
1127 let guids = [currTableData.value.guid];
1128 if (isBatch) {
1129 guids = selectRowData.value;
1130 }
1131 deleteDataSource(guids).then((res: any) => {
1132 if (res.code == proxy.$passCode) {
1133 getTableData();
1134 ElMessage({
1135 type: "success",
1136 message: "删除成功",
1137 });
1138 } else {
1139 ElMessage({
1140 type: "error",
1141 message: res.msg,
1142 });
1143 }
1144 });
1145 });
1146 };
1147
1148 const setDetailInfo = async () => {
1149 let info = Object.assign({}, currTableData.value, currTableData.value.dataConfigure || {});
1150 let newInfo = originValue.value = Object.assign(originValue.value, info);
1151 setFormItems("常规", newInfo);
1152 dialogInfo.value.visible = true;
1153 };
1154
1155 const checkConnect = (val) => {
1156 let params = { guid: currTableData.value.guid };
1157 checkDataSourceConnect(params).then((res: any) => {
1158 if (res.code == proxy.$passCode && res.data && res.data == "1") {
1159 getTableData();
1160 ElMessage({
1161 type: "success",
1162 message: "连通成功",
1163 });
1164 } else {
1165 getTableData();
1166 ElMessage({
1167 type: "error",
1168 message: "连通失败",
1169 });
1170 }
1171 });
1172 };
1173
1174 const loadDialog = async () => {
1175 dialogInfo.value.type = "add";
1176 dialogInfo.value.header.title = "添加数据源";
1177 originValue.value = {};
1178 setFormItems("常规", {});
1179 dialogInfo.value.visible = true;
1180 };
1181
1182 const batching = (type) => {
1183 if (type == "delete") {
1184 if (selectRowData.value.length == 0) {
1185 ElMessage({
1186 type: "error",
1187 message: "请选择需要删除的数据",
1188 });
1189 return;
1190 }
1191 open("此操作将永久删除, 是否继续?", "warning", true);
1192 }
1193 };
1194
1195 const dialogBtnClick = (btn, info) => {
1196 if (btn.value == "submit") {
1197 // dialogInfo.value.footer.btns.map((item: any) => item.disabled = true)
1198 const params = { ...info };
1199 delete params.host;
1200 delete params.port;
1201 delete params.logonUser;
1202 delete params.password;
1203 delete params.feLoadUrl;
1204 delete params.beLoadUrl;
1205 delete params.dorisJdbcUrl;
1206 params.dataConnectionContract = tabActiveName.value;
1207 if (dialogInfo.value.type == "add") {
1208 params.dataConfigureAddDTO = {
1209 host: info.host,
1210 port: info.port,
1211 logonUser: info.logonUser,
1212 password: info.password,
1213 feLoadUrl: info.feLoadUrl,
1214 beLoadUrl: info.beLoadUrl,
1215 dorisJdbcUrl: info.dorisJdbcUrl
1216 };
1217 addDataSource(params)
1218 .then((res: any) => {
1219 if (res.code == proxy.$passCode) {
1220 getFirstPageData();
1221 ElMessage({
1222 type: "success",
1223 message: "添加数据源成功",
1224 });
1225 dialogInfo.value.visible = false;
1226 } else {
1227 ElMessage({
1228 type: "error",
1229 message: res.msg,
1230 });
1231 // dialogInfo.value.footer.btns.map((item: any) => delete item.disabled)
1232 }
1233 })
1234 .catch(() => {
1235 // dialogInfo.value.footer.btns.map((item: any) => delete item.disabled)
1236 });
1237 } else {
1238 params.dataConfigureUpdateDTO = {
1239 guid: currTableData.value.dataConfigure.guid,
1240 host: info.host,
1241 port: info.port,
1242 logonUser: info.logonUser,
1243 password:
1244 info.password == "******"
1245 ? currTableData.value.dataConfigure.password
1246 : info.password,
1247 feLoadUrl: info.feLoadUrl,
1248 beLoadUrl: info.beLoadUrl,
1249 dorisJdbcUrl: info.dorisJdbcUrl
1250 };
1251 params.guid = currTableData.value.guid;
1252 updateDataSource(params)
1253 .then((res: any) => {
1254 if (res.code == proxy.$passCode) {
1255 getTableData();
1256 ElMessage({
1257 type: "success",
1258 message: "修改数据源成功",
1259 });
1260 dialogInfo.value.visible = false;
1261 } else {
1262 ElMessage({
1263 type: "error",
1264 message: res.msg,
1265 });
1266 }
1267 // dialogInfo.value.footer.btns.map((item: any) => delete item.disabled)
1268 })
1269 .catch(() => {
1270 // dialogInfo.value.footer.btns.map((item: any) => delete item.disabled)
1271 });
1272 }
1273 } else if (btn.value == "connect") {
1274 const params = {
1275 databaseType: info.databaseType,
1276 databaseNameEn: info.databaseNameEn,
1277 host: info.host,
1278 port: info.port,
1279 logonUser: info.logonUser,
1280 password: info.password,
1281 linkage: info.linkage,
1282 };
1283 checkDataSourceConnectTest(params).then((res: any) => {
1284 if (res.code == proxy.$passCode) {
1285 if (res.data && res.data == "1") {
1286 ElMessage({
1287 type: "success",
1288 message: "连通成功",
1289 });
1290 } else {
1291 ElMessage({
1292 type: "error",
1293 message: "连通失败",
1294 });
1295 }
1296 } else {
1297 ElMessage({
1298 type: "error",
1299 message: res.msg,
1300 });
1301 }
1302 });
1303 } else if (btn.value == "cancel") {
1304 // dialogInfo.value.footer.btns.map((item: any) => delete item.disabled)
1305 nextTick(() => {
1306 dialogInfo.value.visible = false;
1307 });
1308 }
1309 };
1310 </script>
1311
1312 <template>
1313 <div class="container_wrap">
1314 <div class="table_tool_wrap has_search">
1315 <TableTools :searchItems="searchItemList" :searchId="'data-source-search'" @search="toSearch" />
1316 <div class="tools_btns">
1317 <el-button type="primary" @click="loadDialog" v-preReClick>新建</el-button>
1318 <el-button @click="batching('delete')" v-preReClick>批量删除</el-button>
1319 </div>
1320 </div>
1321 <div class="table_panel_wrap">
1322 <Table :tableInfo="tableInfo" @tableBtnClick="tableBtnClick" @tablePageChange="tablePageChange"
1323 @tableSelectionChange="tableSelectionChange" />
1324 </div>
1325
1326 <Dialog ref="dialogRef" :dialogInfo="dialogInfo" @btnClick="dialogBtnClick" @tableBtnClick="tableBtnClick"
1327 @selectChange="formSelectChange" @tabChange="tabChange" />
1328 </div>
1329 </template>
1330
1331 <style lang="scss" scoped>
1332 .container_wrap {
1333 overflow: hidden auto;
1334 }
1335
1336 .table_tool_wrap {
1337 width: 100%;
1338 height: 84px !important;
1339 padding: 0 8px;
1340
1341 .tools_btns {
1342 padding: 8px 0 0;
1343 }
1344 }
1345
1346 .table_panel_wrap {
1347 width: 100%;
1348 height: calc(100% - 84px);
1349 padding: 8px 8px 0;
1350 }
1351 </style>
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!