@ajaxjs/ui 1.2.3 → 1.2.5
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/README.md +16 -0
- package/dist/api-helper2/api-helper.d.ts +194 -0
- package/dist/api-helper2/api-helper.vue +144 -0
- package/dist/api-helper2/bookmark.vue +168 -0
- package/dist/api-helper2/common/arg.vue +46 -0
- package/dist/api-helper2/common/http-method.vue +53 -0
- package/dist/api-helper2/document/document-render.vue +189 -0
- package/dist/api-helper2/document/document.vue +130 -0
- package/dist/api-helper2/document/perview.vue +0 -0
- package/dist/api-helper2/env.vue +140 -0
- package/dist/api-helper2/history.vue +116 -0
- package/dist/api-helper2/main.vue +70 -0
- package/dist/api-helper2/request-body.vue +68 -0
- package/dist/api-helper2/table.vue +116 -0
- package/dist/data-source/data-source.d.ts +14 -0
- package/dist/data-source/data-source.js +96 -95
- package/dist/data-source/data-source.js.map +1 -0
- package/dist/data-source/data-source.less +46 -0
- package/dist/data-source/data-source.ts +95 -0
- package/dist/data-source/data-source.vue +59 -0
- package/dist/iView-ext/tips.vue +14 -0
- package/dist/index.d.ts +1 -3
- package/dist/index.js +2 -39
- package/dist/index.js.map +1 -1
- package/dist/index.ts +2 -45
- package/package.json +2 -3
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<RadioGroup v-model="requestType" type="button" size="small">
|
|
4
|
+
<Radio label="Form"></Radio>
|
|
5
|
+
<Radio label="FormData"></Radio>
|
|
6
|
+
<Radio label="JSON"></Radio>
|
|
7
|
+
<Radio label="Raw"></Radio>
|
|
8
|
+
</RadioGroup>
|
|
9
|
+
|
|
10
|
+
<span v-if="requestType == 'JSON'" class="jsonRootType">JSON 根类型
|
|
11
|
+
<RadioGroup v-model="json.rootType" size="small">
|
|
12
|
+
<Radio label="Object" size="small"></Radio>
|
|
13
|
+
<Radio label="Array"></Radio>
|
|
14
|
+
</RadioGroup>
|
|
15
|
+
</span>
|
|
16
|
+
|
|
17
|
+
<div style="margin-top: 20px">
|
|
18
|
+
<section v-if="requestType == 'Form'">
|
|
19
|
+
<Table mode="SIMPLE" />
|
|
20
|
+
|
|
21
|
+
</section>
|
|
22
|
+
<section v-if="requestType == 'JSON'">
|
|
23
|
+
<Table mode="SCHEME" />
|
|
24
|
+
|
|
25
|
+
</section>
|
|
26
|
+
|
|
27
|
+
<section v-if="requestType == 'Raw'">
|
|
28
|
+
<div style="width:500px;margin:10px 0;">
|
|
29
|
+
ContentType
|
|
30
|
+
<Select v-model="raw.contentType" style="width:200px;" size="small" transfer>
|
|
31
|
+
<Option value="application/json">application/json</Option>
|
|
32
|
+
<Option value="application/x-www-form-urlencoded">application/x-www-form-urlencoded</Option>
|
|
33
|
+
<Option value="multipart/form-data">multipart/form-data</Option>
|
|
34
|
+
<Option value="text/plain">text/plain</Option>
|
|
35
|
+
<Option value="text/plain">text/xml</Option>
|
|
36
|
+
</Select>
|
|
37
|
+
</div>
|
|
38
|
+
<Input type="textarea" :rows="4" />
|
|
39
|
+
</section>
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
</template>
|
|
43
|
+
|
|
44
|
+
<script lang="ts">
|
|
45
|
+
import Table from "./table.vue";
|
|
46
|
+
|
|
47
|
+
export default {
|
|
48
|
+
components: { Table },
|
|
49
|
+
data() {
|
|
50
|
+
return {
|
|
51
|
+
requestType: "JSON",
|
|
52
|
+
json: {
|
|
53
|
+
rootType: "Object",
|
|
54
|
+
},
|
|
55
|
+
raw: {
|
|
56
|
+
contentType: "application/json",
|
|
57
|
+
},
|
|
58
|
+
};
|
|
59
|
+
},
|
|
60
|
+
};
|
|
61
|
+
</script>
|
|
62
|
+
|
|
63
|
+
<style lang="less" scoped>
|
|
64
|
+
.jsonRootType {
|
|
65
|
+
font-size: 9pt;
|
|
66
|
+
padding-left: 20px;
|
|
67
|
+
}
|
|
68
|
+
</style>
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="table" :class="mode">
|
|
3
|
+
<header>
|
|
4
|
+
<ul>
|
|
5
|
+
<li class="check"><input type="checkbox" /></li>
|
|
6
|
+
<li class="name">参数变量名</li>
|
|
7
|
+
<li class="type">类型</li>
|
|
8
|
+
<li class="value">参数值</li>
|
|
9
|
+
<li class="default">值示例</li>
|
|
10
|
+
<li class="required">必填</li>
|
|
11
|
+
<li class="comment">说明</li>
|
|
12
|
+
<li class="action">操作</li>
|
|
13
|
+
</ul>
|
|
14
|
+
</header>
|
|
15
|
+
|
|
16
|
+
<ul class="tableBody">
|
|
17
|
+
<li>
|
|
18
|
+
<div class="row check">
|
|
19
|
+
<input type="checkbox" />
|
|
20
|
+
</div>
|
|
21
|
+
<div class="row name">
|
|
22
|
+
<Input value="dfgg" size="small" />
|
|
23
|
+
</div>
|
|
24
|
+
<div class="row type">
|
|
25
|
+
<Select size="small" transfer>
|
|
26
|
+
<Option value="string">string</Option>
|
|
27
|
+
<Option value="number">number</Option>
|
|
28
|
+
<Option value="boolean">boolean</Option>
|
|
29
|
+
<Option value="object">object</Option>
|
|
30
|
+
<Option value="array">array</Option>
|
|
31
|
+
<Option value="null">null</Option>
|
|
32
|
+
</Select>
|
|
33
|
+
</div>
|
|
34
|
+
<div class="row value">
|
|
35
|
+
<Input value="dfgg" size="small" />
|
|
36
|
+
</div>
|
|
37
|
+
|
|
38
|
+
<div class="row comment">
|
|
39
|
+
<Input value="dfgg" size="small" />
|
|
40
|
+
</div>
|
|
41
|
+
<div class="row action"></div>
|
|
42
|
+
</li>
|
|
43
|
+
</ul>
|
|
44
|
+
</div>
|
|
45
|
+
</template>
|
|
46
|
+
|
|
47
|
+
<script lang="ts">
|
|
48
|
+
import "./api-helper";
|
|
49
|
+
|
|
50
|
+
export default {
|
|
51
|
+
props: {
|
|
52
|
+
mode: String,
|
|
53
|
+
},
|
|
54
|
+
data() {
|
|
55
|
+
return {
|
|
56
|
+
// mode: "SCHEME",
|
|
57
|
+
} as API_HELPER_TABLE;
|
|
58
|
+
},
|
|
59
|
+
};
|
|
60
|
+
</script>
|
|
61
|
+
|
|
62
|
+
<style lang="less" scoped>
|
|
63
|
+
.table {
|
|
64
|
+
width: 100%;
|
|
65
|
+
|
|
66
|
+
.check {
|
|
67
|
+
width: 50px;
|
|
68
|
+
}
|
|
69
|
+
.name {
|
|
70
|
+
width: 200px;
|
|
71
|
+
}
|
|
72
|
+
.type {
|
|
73
|
+
width: 100px;
|
|
74
|
+
}
|
|
75
|
+
.value {
|
|
76
|
+
width: 200px;
|
|
77
|
+
}
|
|
78
|
+
.comment {
|
|
79
|
+
width: 300px;
|
|
80
|
+
}
|
|
81
|
+
.action {
|
|
82
|
+
width: 100px;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.row {
|
|
86
|
+
display: inline-block;
|
|
87
|
+
padding: 0 4px;
|
|
88
|
+
box-sizing: border-box;
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.SCHEME {
|
|
93
|
+
.default,
|
|
94
|
+
.required {
|
|
95
|
+
display: none;
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
header {
|
|
100
|
+
background-color: #f8f8f9;
|
|
101
|
+
li {
|
|
102
|
+
// text-align: center;
|
|
103
|
+
padding: 6px 14px;
|
|
104
|
+
display: inline-block;
|
|
105
|
+
font-weight: bold;
|
|
106
|
+
box-sizing: border-box;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.tableBody {
|
|
111
|
+
li {
|
|
112
|
+
padding: 10px;
|
|
113
|
+
box-sizing: border-box;
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
</style>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
data(): {};
|
|
3
|
+
mounted(): void;
|
|
4
|
+
methods: {
|
|
5
|
+
active(item: any): void;
|
|
6
|
+
getList(cb: any): void;
|
|
7
|
+
add(): void;
|
|
8
|
+
create(): void;
|
|
9
|
+
update(): void;
|
|
10
|
+
del(id: any, name: any): void;
|
|
11
|
+
test(): void;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
export default _default;
|
|
@@ -1,96 +1,97 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const xhr_1 = require("@ajaxjs/util/dist/util/xhr");
|
|
1
4
|
const DBType = { 'MY_SQL': 'MySQL', 'ORACLE': 'Oracle', 'SQL_SERVER': 'Sql Server', 'SPARK': 'Spark', 'SQLITE': 'SQLite', DB2: 'DB2' };
|
|
2
|
-
|
|
3
|
-
DATASOURCE_API = window.API_ROOT ? API_ROOT + '/data_service/datasource' : '../../data_service/datasource';
|
|
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
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
});
|
|
96
|
-
|
|
5
|
+
// @ts-ignore
|
|
6
|
+
const DATASOURCE_API = window.API_ROOT ? API_ROOT + '/data_service/datasource' : '../../data_service/datasource';
|
|
7
|
+
// @ts-ignore
|
|
8
|
+
const DATA_SERVICE_API = window.API_ROOT ? API_ROOT + '/data_service/admin' : '../../data_service/admin';
|
|
9
|
+
exports.default = {
|
|
10
|
+
data() {
|
|
11
|
+
return {
|
|
12
|
+
isCreate: true,
|
|
13
|
+
datasources: [
|
|
14
|
+
{
|
|
15
|
+
id: 1,
|
|
16
|
+
name: '加载中……'
|
|
17
|
+
}
|
|
18
|
+
],
|
|
19
|
+
activedItem: null,
|
|
20
|
+
editing: {},
|
|
21
|
+
form: {
|
|
22
|
+
data: {},
|
|
23
|
+
rules: {
|
|
24
|
+
name: [
|
|
25
|
+
{ required: true, message: '数据源名称不能为空', trigger: 'blur' }
|
|
26
|
+
],
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
DBType: DBType
|
|
30
|
+
};
|
|
31
|
+
},
|
|
32
|
+
mounted() {
|
|
33
|
+
this.getList();
|
|
34
|
+
},
|
|
35
|
+
methods: {
|
|
36
|
+
active(item) {
|
|
37
|
+
this.activedItem = item.id;
|
|
38
|
+
this.form.data = item;
|
|
39
|
+
},
|
|
40
|
+
getList(cb) {
|
|
41
|
+
// @ts-ignore
|
|
42
|
+
(0, xhr_1.xhr_get)(`${window.config.dsApiRoot}/datasource`, (j) => {
|
|
43
|
+
this.datasources = j.data;
|
|
44
|
+
}, { start: 0, limit: 99 });
|
|
45
|
+
},
|
|
46
|
+
add() {
|
|
47
|
+
this.activedItem = null;
|
|
48
|
+
this.form.data = {
|
|
49
|
+
name: ''
|
|
50
|
+
};
|
|
51
|
+
},
|
|
52
|
+
create() {
|
|
53
|
+
this.$refs.editForm.validate((valid) => {
|
|
54
|
+
if (valid) {
|
|
55
|
+
(0, xhr_1.xhr_post)(DATASOURCE_API, this.form.data, j => {
|
|
56
|
+
if (j.status === 1) {
|
|
57
|
+
let newlyId = j.data;
|
|
58
|
+
this.getList(() => this.activedItem = newlyId);
|
|
59
|
+
this.$Message.success('创建数据源成功');
|
|
60
|
+
this.form.data.id = newlyId;
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
else
|
|
65
|
+
this.$Message.error('表单验证不通过');
|
|
66
|
+
});
|
|
67
|
+
},
|
|
68
|
+
update() {
|
|
69
|
+
let entity = Object.assign({}, this.form.data);
|
|
70
|
+
(0, xhr_1.xhr_put)(DATASOURCE_API, entity, j => {
|
|
71
|
+
if (j.status === 1) {
|
|
72
|
+
this.$Message.success('修改数据源成功');
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
},
|
|
76
|
+
del(id, name) {
|
|
77
|
+
this.$Modal.confirm({
|
|
78
|
+
title: '删除数据源',
|
|
79
|
+
content: `是否删除数据源 #${name}?`,
|
|
80
|
+
onOk: () => {
|
|
81
|
+
(0, xhr_1.xhr_del)(DATASOURCE_API + id, j => {
|
|
82
|
+
this.$Message.success('删除数据源成功');
|
|
83
|
+
this.getList(() => this.add());
|
|
84
|
+
});
|
|
85
|
+
}
|
|
86
|
+
});
|
|
87
|
+
},
|
|
88
|
+
test() {
|
|
89
|
+
// @ts-ignore
|
|
90
|
+
(0, xhr_1.xhr_get)(`${window.config.dsApiRoot}/datasource/test/` + this.activedItem, (j) => {
|
|
91
|
+
if (j.status)
|
|
92
|
+
this.$Modal.success({ title: '连接数据源成功' });
|
|
93
|
+
});
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
//# sourceMappingURL=data-source.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data-source.js","sourceRoot":"","sources":["../../src/data-source/data-source.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
.datasource {
|
|
2
|
+
.left {
|
|
3
|
+
float: left;
|
|
4
|
+
width: 28%;
|
|
5
|
+
height: 300px;
|
|
6
|
+
border-right: 1px solid #f5f5f5;
|
|
7
|
+
|
|
8
|
+
ul {
|
|
9
|
+
margin: 0 2%;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
li {
|
|
13
|
+
border-bottom: 1px solid #eaeaea;
|
|
14
|
+
padding: 5px 8px;
|
|
15
|
+
cursor: pointer;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
li:hover {
|
|
19
|
+
border-bottom-color: lightgray;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
li.actived {
|
|
23
|
+
font-weight: bold;
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.right {
|
|
28
|
+
float: right;
|
|
29
|
+
width: 70%;
|
|
30
|
+
padding-left: 10px;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.add {
|
|
34
|
+
display: block;
|
|
35
|
+
padding: 5px 10px;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.del-icon {
|
|
39
|
+
float: right;
|
|
40
|
+
margin-top: 3px
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.del-icon:hover {
|
|
44
|
+
color: brown;
|
|
45
|
+
}
|
|
46
|
+
}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { xhr_get, xhr_post, xhr_put, xhr_del } from '@ajaxjs/util/dist/util/xhr';
|
|
2
|
+
|
|
3
|
+
const DBType = { 'MY_SQL': 'MySQL', 'ORACLE': 'Oracle', 'SQL_SERVER': 'Sql Server', 'SPARK': 'Spark', 'SQLITE': 'SQLite', DB2: 'DB2' };
|
|
4
|
+
// @ts-ignore
|
|
5
|
+
const DATASOURCE_API = window.API_ROOT ? API_ROOT + '/data_service/datasource' : '../../data_service/datasource';
|
|
6
|
+
// @ts-ignore
|
|
7
|
+
const DATA_SERVICE_API = window.API_ROOT ? API_ROOT + '/data_service/admin' : '../../data_service/admin';
|
|
8
|
+
|
|
9
|
+
export default {
|
|
10
|
+
data(): {} {
|
|
11
|
+
return {
|
|
12
|
+
isCreate: true,
|
|
13
|
+
datasources: [
|
|
14
|
+
{
|
|
15
|
+
id: 1,
|
|
16
|
+
name: '加载中……'
|
|
17
|
+
}
|
|
18
|
+
],
|
|
19
|
+
activedItem: null,
|
|
20
|
+
editing: {},
|
|
21
|
+
form: {
|
|
22
|
+
data: {},
|
|
23
|
+
rules: {
|
|
24
|
+
name: [
|
|
25
|
+
{ required: true, message: '数据源名称不能为空', trigger: 'blur' }
|
|
26
|
+
],
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
DBType: DBType
|
|
30
|
+
};
|
|
31
|
+
},
|
|
32
|
+
mounted(): void {
|
|
33
|
+
this.getList();
|
|
34
|
+
},
|
|
35
|
+
methods: {
|
|
36
|
+
active(item): void {
|
|
37
|
+
this.activedItem = item.id;
|
|
38
|
+
this.form.data = item;
|
|
39
|
+
},
|
|
40
|
+
getList(cb): void {
|
|
41
|
+
// @ts-ignore
|
|
42
|
+
xhr_get(`${window.config.dsApiRoot}/datasource`, (j: RepsonseResult) => {
|
|
43
|
+
this.datasources = j.data;
|
|
44
|
+
}, { start: 0, limit: 99 });
|
|
45
|
+
},
|
|
46
|
+
add(): void {
|
|
47
|
+
this.activedItem = null;
|
|
48
|
+
this.form.data = {
|
|
49
|
+
name: ''
|
|
50
|
+
};
|
|
51
|
+
},
|
|
52
|
+
create(): void {
|
|
53
|
+
this.$refs.editForm.validate((valid) => {
|
|
54
|
+
if (valid) {
|
|
55
|
+
xhr_post(DATASOURCE_API, this.form.data, j => {
|
|
56
|
+
if (j.status === 1) {
|
|
57
|
+
let newlyId = j.data;
|
|
58
|
+
this.getList(() => this.activedItem = newlyId);
|
|
59
|
+
this.$Message.success('创建数据源成功');
|
|
60
|
+
this.form.data.id = newlyId;
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
} else
|
|
64
|
+
this.$Message.error('表单验证不通过');
|
|
65
|
+
});
|
|
66
|
+
},
|
|
67
|
+
update(): void {
|
|
68
|
+
let entity = Object.assign({}, this.form.data);
|
|
69
|
+
xhr_put(DATASOURCE_API, entity, j => {
|
|
70
|
+
if (j.status === 1) {
|
|
71
|
+
this.$Message.success('修改数据源成功');
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
},
|
|
75
|
+
del(id, name): void {
|
|
76
|
+
this.$Modal.confirm({
|
|
77
|
+
title: '删除数据源',
|
|
78
|
+
content: `是否删除数据源 #${name}?`,
|
|
79
|
+
onOk: () => {
|
|
80
|
+
xhr_del(DATASOURCE_API + id, j => {
|
|
81
|
+
this.$Message.success('删除数据源成功');
|
|
82
|
+
this.getList(() => this.add());
|
|
83
|
+
});
|
|
84
|
+
}
|
|
85
|
+
});
|
|
86
|
+
},
|
|
87
|
+
test(): void {
|
|
88
|
+
// @ts-ignore
|
|
89
|
+
xhr_get(`${window.config.dsApiRoot}/datasource/test/` + this.activedItem, (j: RepsonseResult) => {
|
|
90
|
+
if (j.status)
|
|
91
|
+
this.$Modal.success({ title: '连接数据源成功' });
|
|
92
|
+
});
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
};
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="datasource" style="overflow: hidden">
|
|
3
|
+
<div class="left">
|
|
4
|
+
<ul>
|
|
5
|
+
<li v-for="datasource in datasources" :key="datasource.id" @click="active(datasource)" :class="{ actived: activedItem == datasource.id }">
|
|
6
|
+
<span>
|
|
7
|
+
<Icon type="md-trash" class="del-icon" title="删除此数据源" @click="del(datasource.id, datasource.name)" />
|
|
8
|
+
</span>
|
|
9
|
+
{{datasource.name}}
|
|
10
|
+
</li>
|
|
11
|
+
</ul>
|
|
12
|
+
<a class="add" @click="add">+ 新建……</a>
|
|
13
|
+
</div>
|
|
14
|
+
<div class="right">
|
|
15
|
+
<i-Form ref="editForm" :model="form.data" :rules="form.rules" :label-width="120" style="margin-right:100px">
|
|
16
|
+
<form-item label="数据源名称" prop="name">
|
|
17
|
+
<i-Input v-model="form.data.name" placeholder="数据源名称" />
|
|
18
|
+
</form-item>
|
|
19
|
+
<form-item label="数据源编码" prop="urlDir">
|
|
20
|
+
<i-Input v-model="form.data.urlDir" placeholder="数据源编码全局唯一不重复" />
|
|
21
|
+
</form-item>
|
|
22
|
+
<form-item label="数据库类型" prop="type">
|
|
23
|
+
<i-Select v-model="form.data.type">
|
|
24
|
+
<i-Option v-for="(value, key) in DBType" :value="key" :key="key">{{ value }}</i-Option>
|
|
25
|
+
</i-Select>
|
|
26
|
+
</form-item>
|
|
27
|
+
<form-item label="连接地址" prop="url">
|
|
28
|
+
<i-Input v-model="form.data.url" maxlength="200" show-word-limit type="textarea" :rows="4" placeholder="数据库连接 URL,注意无须携带用户名和密码,且不需要 URL 转义" />
|
|
29
|
+
</form-item>
|
|
30
|
+
<form-item label="登录用户" prop="username">
|
|
31
|
+
<i-Input v-model="form.data.username" placeholder="请输入数据库用户账号" />
|
|
32
|
+
</form-item>
|
|
33
|
+
<form-item label="登录密码" prop="password">
|
|
34
|
+
<i-Input v-model="form.data.password" type="password" password placeholder="请输入账号密码" />
|
|
35
|
+
</form-item>
|
|
36
|
+
<form-item label="是否跨库" prop="crossDb">
|
|
37
|
+
<i-switch v-model="form.data.crossDb" />
|
|
38
|
+
</form-item>
|
|
39
|
+
</i-Form>
|
|
40
|
+
|
|
41
|
+
<div align="center">
|
|
42
|
+
<i-Button v-if="!activedItem" icon="md-checkmark" @click="create">保存新建</i-Button>
|
|
43
|
+
<i-Button v-if="activedItem" @click="update">保存</i-Button>
|
|
44
|
+
<i-Button v-if="activedItem" @click="test">测试连接</i-Button>
|
|
45
|
+
<i-Button v-if="activedItem" @click="$emit('change_datasource', form.data)">切换</i-Button>
|
|
46
|
+
</div>
|
|
47
|
+
<!-- <i-Input v-model="editing.name" ref="inputName">
|
|
48
|
+
<span slot="prepend">环境名称</span>
|
|
49
|
+
</i-Input>
|
|
50
|
+
<br />
|
|
51
|
+
<i-Input v-model="editing.urlPrefix">
|
|
52
|
+
<span slot="prepend">URL前缀</span>
|
|
53
|
+
</i-Input> -->
|
|
54
|
+
</div>
|
|
55
|
+
</div>
|
|
56
|
+
</template>
|
|
57
|
+
|
|
58
|
+
<script lang="ts" src="./data-source.ts"></script>
|
|
59
|
+
<style lang="less" scoped src="./data-source.less"></style>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<i style="cursor: pointer;" class="ivu-icon ivu-icon-ios-help-circle-outline" :title="text"></i>
|
|
3
|
+
</template>
|
|
4
|
+
|
|
5
|
+
<script>
|
|
6
|
+
/**
|
|
7
|
+
* 帮助图标
|
|
8
|
+
*/
|
|
9
|
+
export default {
|
|
10
|
+
props: {
|
|
11
|
+
text: { type: String, required: true },
|
|
12
|
+
},
|
|
13
|
+
};
|
|
14
|
+
</script>
|
package/dist/index.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ import iViewListCommon from './iView-ext/fast-iview-table/fast-iview-table.vue';
|
|
|
3
3
|
* 暴露各个组件
|
|
4
4
|
*/
|
|
5
5
|
declare const _default: {
|
|
6
|
+
ApiHelper: import("vue").VueConstructor<iViewListCommon<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => iViewListCommon<Record<string, any>, Record<string, any>, never, never, any>>>;
|
|
6
7
|
ApiSelector: import("vue").VueConstructor<iViewListCommon<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => iViewListCommon<Record<string, any>, Record<string, any>, never, never, any>>>;
|
|
7
8
|
Fast_iViewTable: {
|
|
8
9
|
afterDelete(cb?: Function): Function;
|
|
@@ -20,9 +21,6 @@ declare const _default: {
|
|
|
20
21
|
render(h: Function, params: any): any;
|
|
21
22
|
};
|
|
22
23
|
tags: {
|
|
23
|
-
/**
|
|
24
|
-
* API 统一前缀
|
|
25
|
-
*/
|
|
26
24
|
title: string;
|
|
27
25
|
minWidth: number;
|
|
28
26
|
key: string;
|