ap-dev 1.1.19 → 1.1.23
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/menus.js +6 -0
- package/dev/ApiPanel/modules/ApiBusiness.vue +44 -0
- package/dev/ApiPanel/modules/ApiEcharts.vue +100 -0
- package/dev/ApiPanel/modules/ApiGrid.vue +8 -2
- package/dev/ApiPanel/tabs/ApiBusinessEmail.vue +146 -0
- package/dev/ApiPanel/tabs/ApiFormSearchTree.vue +12 -1
- package/package.json +1 -1
package/dev/ApiPanel/menus.js
CHANGED
|
@@ -15,6 +15,9 @@ const menus = [
|
|
|
15
15
|
}, {
|
|
16
16
|
id: 'ApiFs',
|
|
17
17
|
label: '1.3 文件服务'
|
|
18
|
+
}, {
|
|
19
|
+
id: 'ApiBusiness',
|
|
20
|
+
label: '1.4 业务规范'
|
|
18
21
|
}]
|
|
19
22
|
}, {
|
|
20
23
|
id: 'ApiDefault',
|
|
@@ -35,6 +38,9 @@ const menus = [
|
|
|
35
38
|
}, {
|
|
36
39
|
id: 'ApiForm',
|
|
37
40
|
label: '2.5 表单相关组件'
|
|
41
|
+
}, {
|
|
42
|
+
id: 'ApiEcharts',
|
|
43
|
+
label: '2.6 图表组件'
|
|
38
44
|
}]
|
|
39
45
|
}, {
|
|
40
46
|
id: 'ApiDefault',
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<el-tabs v-model="activeName" tabPosition="left" class="api-tabs">
|
|
3
|
+
<template v-for="(item,index) in opts">
|
|
4
|
+
<el-tab-pane :label="item.label" :name="'tab' + index" class="api-tab">
|
|
5
|
+
<component :is="item.component"></component>
|
|
6
|
+
</el-tab-pane>
|
|
7
|
+
</template>
|
|
8
|
+
</el-tabs>
|
|
9
|
+
</template>
|
|
10
|
+
|
|
11
|
+
<script>
|
|
12
|
+
import ApiBusinessEmail from './../tabs/ApiBusinessEmail'
|
|
13
|
+
|
|
14
|
+
export default {
|
|
15
|
+
name: "ApiBusiness",
|
|
16
|
+
components: {
|
|
17
|
+
ApiBusinessEmail,
|
|
18
|
+
},
|
|
19
|
+
data() {
|
|
20
|
+
|
|
21
|
+
let opts = [{
|
|
22
|
+
label: "邮件推送",
|
|
23
|
+
component: "ApiBusinessEmail"
|
|
24
|
+
}
|
|
25
|
+
];
|
|
26
|
+
return {
|
|
27
|
+
activeName: 'tab0',
|
|
28
|
+
opts: opts
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
</script>
|
|
33
|
+
|
|
34
|
+
<style scoped>
|
|
35
|
+
.api-tabs {
|
|
36
|
+
display: flex;
|
|
37
|
+
height: 100%;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.api-tabs /deep/ .el-tabs__content {
|
|
41
|
+
flex: 1;
|
|
42
|
+
overflow: scroll;
|
|
43
|
+
}
|
|
44
|
+
</style>
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<api-tittle-1>图表组件</api-tittle-1>
|
|
4
|
+
<api-tittle-2>一、使用方法</api-tittle-2>
|
|
5
|
+
<api-content>
|
|
6
|
+
<api-code>{{ js1 }}</api-code>
|
|
7
|
+
|
|
8
|
+
<br>echarts官方文档：
|
|
9
|
+
<el-link type="primary">https://echarts.apache.org/zh/option.html#title</el-link>
|
|
10
|
+
</api-content>
|
|
11
|
+
<api-tittle-2>二、参数说明</api-tittle-2>
|
|
12
|
+
<api-table :data="methodData" :columns="methodCols"/>
|
|
13
|
+
</div>
|
|
14
|
+
</template>
|
|
15
|
+
|
|
16
|
+
<script>
|
|
17
|
+
import {ApiCode, ApiContent, ApiTable, ApiTittle1, ApiTittle2} from './../components'
|
|
18
|
+
|
|
19
|
+
export default {
|
|
20
|
+
name: 'ApiEcharts',
|
|
21
|
+
components: {
|
|
22
|
+
ApiTable, ApiCode, ApiTittle1, ApiContent, ApiTittle2
|
|
23
|
+
},
|
|
24
|
+
data() {
|
|
25
|
+
const methodCols = [
|
|
26
|
+
{ label: '名称', prop: 'name', width: '180px' },
|
|
27
|
+
{ label: '类型', prop: 'type', width: '100px' },
|
|
28
|
+
{ label: '默认值', prop: 'default', width: '80px' },
|
|
29
|
+
{ label: '描述', prop: 'memo', minWidth: '100px' },
|
|
30
|
+
{ label: '示例代码', prop: 'code', minWidth: '100px' }]
|
|
31
|
+
const methodData = [
|
|
32
|
+
{
|
|
33
|
+
name: 'id',
|
|
34
|
+
type: '字符串',
|
|
35
|
+
default: '时间戳',
|
|
36
|
+
memo: 'echarts渲染dom对应的id',
|
|
37
|
+
code: `<div class="api-code">id: "myId"</div>`
|
|
38
|
+
}, {
|
|
39
|
+
name: 'color',
|
|
40
|
+
type: '字符串',
|
|
41
|
+
default: '无',
|
|
42
|
+
memo: '图表的内置配色库<br>可选值：light、dark',
|
|
43
|
+
code: `<div class="api-code">color: "light"</div>`
|
|
44
|
+
}, {
|
|
45
|
+
name: '其他',
|
|
46
|
+
type: '',
|
|
47
|
+
default: '',
|
|
48
|
+
memo: '同echarts官方属性',
|
|
49
|
+
code: `<div class="api-code">let opts = {
|
|
50
|
+
// 自定义id
|
|
51
|
+
id: "myId",
|
|
52
|
+
// 配色
|
|
53
|
+
color: "light",
|
|
54
|
+
// ---------- echarts 官方属性示例 start ----------
|
|
55
|
+
xAxis: {
|
|
56
|
+
type: 'category',
|
|
57
|
+
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
|
|
58
|
+
},
|
|
59
|
+
yAxis: {
|
|
60
|
+
type: 'value'
|
|
61
|
+
},
|
|
62
|
+
series: [
|
|
63
|
+
{
|
|
64
|
+
data: [150, 230, 224, 218, 135, 147, 260],
|
|
65
|
+
type: 'line'
|
|
66
|
+
}
|
|
67
|
+
]
|
|
68
|
+
// ---------- echarts 官方属性示例 end ----------
|
|
69
|
+
};</div>`
|
|
70
|
+
}
|
|
71
|
+
]
|
|
72
|
+
|
|
73
|
+
let js1 = `// 1、定义组件
|
|
74
|
+
<div style="width: 500px;height: 400px;">
|
|
75
|
+
<ap-chart ref="barChart" :options.sync="opts"></ap-chart>
|
|
76
|
+
</div>
|
|
77
|
+
// 2、导入组件
|
|
78
|
+
import ApChart from 'ap-frame/frame/components/ApChart'
|
|
79
|
+
// 3、定义参数
|
|
80
|
+
data() {
|
|
81
|
+
return {
|
|
82
|
+
opts: {
|
|
83
|
+
id: "myId",
|
|
84
|
+
color: "light",
|
|
85
|
+
...
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
}`
|
|
89
|
+
return {
|
|
90
|
+
methodData,
|
|
91
|
+
methodCols,
|
|
92
|
+
js1
|
|
93
|
+
}
|
|
94
|
+
},
|
|
95
|
+
methods: {}
|
|
96
|
+
}
|
|
97
|
+
</script>
|
|
98
|
+
|
|
99
|
+
<style scoped>
|
|
100
|
+
</style>
|
|
@@ -568,7 +568,13 @@ cellClassName: (param) => {
|
|
|
568
568
|
default: '',
|
|
569
569
|
memo: '显示的标题',
|
|
570
570
|
code: '<span class="api-code">label: "名称"，</span>'
|
|
571
|
-
},
|
|
571
|
+
},{
|
|
572
|
+
name: 'help',
|
|
573
|
+
type: '字符串',
|
|
574
|
+
default: '',
|
|
575
|
+
memo: '提示信息',
|
|
576
|
+
code: `<span class="api-code">help: "这是提示信息" <br> help: "<div style='color:red'>这是标题提示</div>", </span>`
|
|
577
|
+
}, {
|
|
572
578
|
name: 'prop',
|
|
573
579
|
type: '字符串',
|
|
574
580
|
default: '',
|
|
@@ -1483,7 +1489,7 @@ searchPickerParamsMain: (row, col, selectedNode) => {
|
|
|
1483
1489
|
|
|
1484
1490
|
// 列属性
|
|
1485
1491
|
const columnsRowSpan = 1
|
|
1486
|
-
const colCommonRowSpan =
|
|
1492
|
+
const colCommonRowSpan = 11
|
|
1487
1493
|
const colCommonStyleRowSpan = 6
|
|
1488
1494
|
const colCommonRenderRowSpan = 7
|
|
1489
1495
|
const inputRowSpan = 1
|
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<api-tittle-1>邮件推送规范：</api-tittle-1>
|
|
4
|
+
<api-tittle-2>一、邮件标题</api-tittle-2>
|
|
5
|
+
<api-content>
|
|
6
|
+
格式：[系统]-标题-公司名-日期<br>
|
|
7
|
+
1、日期格式：yyyymmdd，日期间不要加"-"。<br>
|
|
8
|
+
2、区间日期格式："yyyymmdd至yyyymmdd"。<br>
|
|
9
|
+
3、公司名：根据业务情况，可加可不加。<br><br>
|
|
10
|
+
<div class="api-memo">
|
|
11
|
+
示例1：[MES]-生产日报表-20220201<br>
|
|
12
|
+
示例2：[MES]-生产日报表-20220201至20220207<br>
|
|
13
|
+
示例3：[中台]-CTW报表-**公司-20220222<br>
|
|
14
|
+
</div>
|
|
15
|
+
</api-content>
|
|
16
|
+
<api-tittle-2>二、邮件内容规范：效果如下</api-tittle-2>
|
|
17
|
+
<api-content>
|
|
18
|
+
<div style="border: 1px solid rgba(128,128,128,0.42);padding: 10px;margin: 10px;width: 500px;">
|
|
19
|
+
<div style='font-family:微软雅黑;font-size:16px;'>
|
|
20
|
+
<div>亲爱的双驰人：</div>
|
|
21
|
+
<div style='margin-left:20px;'>您好，**系统为您推送******，请您关注!</div>
|
|
22
|
+
<div style='margin-left:20px;'>
|
|
23
|
+
<div style='font-weight: bold;'>报表标题</div>
|
|
24
|
+
<table border='1' style='border-collapse: collapse;'>
|
|
25
|
+
<tr style='background-color:#9BC2E6;'>
|
|
26
|
+
<th colspan='4' width='400'>一级标题</th>
|
|
27
|
+
</tr>
|
|
28
|
+
<tr style='background-color:#BDD7EE;'>
|
|
29
|
+
<th colspan='2' width='200'>二级标题</th>
|
|
30
|
+
<th colspan='2' width='200'>二级标题</th>
|
|
31
|
+
</tr>
|
|
32
|
+
<tr style='background-color:#DDEBF7'>
|
|
33
|
+
<th width='100'>标题</th>
|
|
34
|
+
<th width='100'>标题</th>
|
|
35
|
+
<th width='150'>标题</th>
|
|
36
|
+
<th width='50'>标题</th>
|
|
37
|
+
</tr>
|
|
38
|
+
<tr>
|
|
39
|
+
<td>内容</td>
|
|
40
|
+
<td>内容</td>
|
|
41
|
+
<td>内容</td>
|
|
42
|
+
<td>内容</td>
|
|
43
|
+
</tr>
|
|
44
|
+
<tr>
|
|
45
|
+
<td style='color:#00B050'>绿色文字</td>
|
|
46
|
+
<td style='color:#FF0000;'>红色文字</td>
|
|
47
|
+
<td style='color:#FFC000'>黄色文字</td>
|
|
48
|
+
<td>内容</td>
|
|
49
|
+
</tr>
|
|
50
|
+
<tr>
|
|
51
|
+
<td style='background-color:#A9D08E'>绿底文字</td>
|
|
52
|
+
<td style='background-color:#F4B084'>红底文字</td>
|
|
53
|
+
<td style='background-color:#FFD966'>黄底文字</td>
|
|
54
|
+
<td>内容</td>
|
|
55
|
+
</tr>
|
|
56
|
+
<tr style='background-color:#D9D9D9'>
|
|
57
|
+
<td>合计</td>
|
|
58
|
+
<td>内容</td>
|
|
59
|
+
<td>内容</td>
|
|
60
|
+
<td>内容</td>
|
|
61
|
+
</tr>
|
|
62
|
+
</table>
|
|
63
|
+
</div>
|
|
64
|
+
<div><br>温馨提醒：该邮件为系统自动推送邮件，请勿直接回复！</div>
|
|
65
|
+
</div>
|
|
66
|
+
</div>
|
|
67
|
+
1、字体：微软雅黑、大小16px<br>
|
|
68
|
+
2、固定前缀：<span style="color: #c7254e;">亲爱的双驰人： 您好，**系统为您推送******，请您关注!</span><br>
|
|
69
|
+
3、固定后缀：<span style="color: #c7254e;">温馨提醒：该邮件为系统自动推送邮件，请勿直接回复！</span><br>
|
|
70
|
+
4、标题格式： <span style='font-weight: bold;'>标题加粗</span><br>
|
|
71
|
+
5、表格标题：参考效果。只有一层标题时，使用"一级标题"的配色。<br>
|
|
72
|
+
6、底纹：<span style='background-color:#A9D08E'>绿色 #A9D08E</span> <span style='background-color:#F4B084'>红色 #F4B084</span> <span style='background-color:#FFD966'>黄色 #FFD966</span> <span style='background-color:#D9D9D9'>灰色 #D9D9D9</span><br>
|
|
73
|
+
7、字体颜色：<span style='color:#00B050'>绿色 #00B050</span> <span style='color:#FF0000'>红色 #FF0000</span> <span style='color:#FFC000'>黄色 #FFC000</span><br>
|
|
74
|
+
<br>
|
|
75
|
+
<api-code>{{ js1 }}</api-code>
|
|
76
|
+
</api-content>
|
|
77
|
+
</div>
|
|
78
|
+
</template>
|
|
79
|
+
|
|
80
|
+
<script>
|
|
81
|
+
import {ApiCode, ApiContent, ApiTable, ApiTittle1, ApiTittle2} from './../components'
|
|
82
|
+
|
|
83
|
+
export default {
|
|
84
|
+
name: 'ApiNameVue',
|
|
85
|
+
components: {
|
|
86
|
+
ApiTable, ApiCode, ApiTittle1, ApiContent, ApiTittle2
|
|
87
|
+
},
|
|
88
|
+
data() {
|
|
89
|
+
const js1 = `// 邮件内容：java标准代码
|
|
90
|
+
String prefix = "<div style='font-family:微软雅黑;font-size:16px;'>" +
|
|
91
|
+
"<div>亲爱的双驰人：</div>" +
|
|
92
|
+
"<div style='margin-left:20px;'>您好，**系统为您推送******，请您关注!</div>";
|
|
93
|
+
String content = "<div style='margin-left:20px;'>" +
|
|
94
|
+
"<div style='font-weight: bold;'>报表标题</div>" +
|
|
95
|
+
"<table border='1' style='border-collapse: collapse;'>" +
|
|
96
|
+
" <tr style='background-color:#9BC2E6;'>" +
|
|
97
|
+
" <th colspan='4' width='400'>一级标题</th>" +
|
|
98
|
+
" </tr>" +
|
|
99
|
+
" <tr style='background-color:#BDD7EE;'>" +
|
|
100
|
+
" <th colspan='2' width='200'>二级标题</th>" +
|
|
101
|
+
" <th colspan='2' width='200'>二级标题</th>" +
|
|
102
|
+
" </tr>" +
|
|
103
|
+
" <tr style='background-color:#DDEBF7'>" +
|
|
104
|
+
" <th width='100'>标题</th>" +
|
|
105
|
+
" <th width='100'>标题</th>" +
|
|
106
|
+
" <th width='150'>标题</th>" +
|
|
107
|
+
" <th width='50'>标题</th>" +
|
|
108
|
+
" </tr>" +
|
|
109
|
+
" <tr>" +
|
|
110
|
+
" <td>内容</td>" +
|
|
111
|
+
" <td>内容</td>" +
|
|
112
|
+
" <td>内容</td>" +
|
|
113
|
+
" <td>内容</td>" +
|
|
114
|
+
" </tr>" +
|
|
115
|
+
" <tr>" +
|
|
116
|
+
" <td style='color:#00B050'>绿色文字</td>" +
|
|
117
|
+
" <td style='color:#FF0000;'>红色文字</td>" +
|
|
118
|
+
" <td style='color:#FFC000'>黄色文字</td>" +
|
|
119
|
+
" <td>内容</td>" +
|
|
120
|
+
" </tr>" +
|
|
121
|
+
" <tr>" +
|
|
122
|
+
" <td style='background-color:#A9D08E'>绿底文字</td>" +
|
|
123
|
+
" <td style='background-color:#F4B084'>红底文字</td>" +
|
|
124
|
+
" <td style='background-color:#FFD966'>黄底文字</td>" +
|
|
125
|
+
" <td>内容</td>" +
|
|
126
|
+
" </tr>" +
|
|
127
|
+
" <tr style='background-color:#D9D9D9'>" +
|
|
128
|
+
" <td>合计</td>" +
|
|
129
|
+
" <td>内容</td>" +
|
|
130
|
+
" <td>内容</td>" +
|
|
131
|
+
" <td>内容</td>" +
|
|
132
|
+
" </tr>" +
|
|
133
|
+
"</table>" +
|
|
134
|
+
"</div>";
|
|
135
|
+
String suffix = "<div><br>温馨提醒：该邮件为系统自动推送邮件，请勿直接回复！</div></div>";
|
|
136
|
+
String contentHtml = prefix + content + suffix;`
|
|
137
|
+
|
|
138
|
+
|
|
139
|
+
return {js1}
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
</script>
|
|
143
|
+
|
|
144
|
+
<style scoped>
|
|
145
|
+
|
|
146
|
+
</style>
|
|
@@ -83,6 +83,17 @@ export default {
|
|
|
83
83
|
memo: '数据请求method。get或post',
|
|
84
84
|
code: `<div class="api-code"></div>`
|
|
85
85
|
}, {
|
|
86
|
+
name: 'searchTreeParams',
|
|
87
|
+
type: '对象/方法',
|
|
88
|
+
default: '',
|
|
89
|
+
memo: '数据请求参数。<br>注：1、参数动态时需要使用方法，参数固定可直接定义对象',
|
|
90
|
+
code: `<div class="api-code">1、固定参数：定义对象
|
|
91
|
+
searchTreeParams: { type: 123}
|
|
92
|
+
2、动态参数：使用箭头函数
|
|
93
|
+
searchTreeParams: () => {
|
|
94
|
+
return { type: this.typeId}
|
|
95
|
+
}</div>`
|
|
96
|
+
}, {
|
|
86
97
|
name: 'searchTreeSelectMultiple',
|
|
87
98
|
type: '布尔',
|
|
88
99
|
default: 'false',
|
|
@@ -159,4 +170,4 @@ options:{
|
|
|
159
170
|
</script>
|
|
160
171
|
|
|
161
172
|
<style scoped>
|
|
162
|
-
</style>
|
|
173
|
+
</style>
|