bxs-tools-ui 3.2.0-1 → 3.2.0-2
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/es/add-and-take/index.js +13 -3
- package/es/adjust-baoe/index.js +2 -1
- package/es/index.js +48 -23
- package/es/insure-calculate/index.js +1 -0
- package/es/person-info/index.js +19 -14
- package/es/product-info/index.js +20 -15
- package/es/share-sheet/index.js +16 -4
- package/es/utils/index.js +47 -22
- package/lib/add-and-take/index.js +13 -3
- package/lib/adjust-baoe/index.js +2 -1
- package/lib/index.js +48 -23
- package/lib/insure-calculate/index.js +1 -0
- package/lib/person-info/index.js +19 -14
- package/lib/product-info/index.js +20 -15
- package/lib/share-sheet/index.js +16 -4
- package/lib/utils/index.js +47 -22
- package/package.json +1 -4
- package/packages/add-and-take/readme.md +162 -256
- package/packages/adjust-baoe/readme.md +118 -83
- package/packages/business-card/readme.md +91 -28
- package/packages/bxs-utils/planbook/common.ts +40 -18
- package/packages/bxs-utils/planbook/person.ts +1 -1
- package/packages/bxs-utils/planbook/product.ts +6 -3
- package/packages/bxs-utils/readme.md +407 -425
- package/packages/canvas-poster/readme.md +123 -83
- package/packages/index.ts +1 -1
- package/packages/insure-calculate/readme.md +185 -129
- package/packages/person-info/readme.md +149 -134
- package/packages/planbook-input/readme.md +143 -84
- package/packages/product-info/readme.md +130 -69
|
@@ -1,139 +1,179 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
## Canvas 海报(CanvasPoster)
|
|
2
|
+
|
|
3
|
+
基于 Canvas 绘制海报的组件,支持图片、文本、矩形三种绘制元素,并提供文本自动换行、自定义字体、圆角矩形、圆角图片等能力。
|
|
4
|
+
|
|
5
|
+
**支持的绘制元素类型**:
|
|
6
|
+
|
|
7
|
+
1. `image`:图片(支持圆角、自定义宽高、跨域加载)
|
|
8
|
+
2. `text`:文本(支持自动换行、自定义字体、颜色、对齐方式)
|
|
9
|
+
3. `rect`:矩形(支持圆角、透明度)
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
10
13
|
### 模块引用(import)
|
|
14
|
+
|
|
11
15
|
```javascript
|
|
12
|
-
import CanvasPoster from 'bxs-tools-ui';
|
|
16
|
+
import { CanvasPoster } from 'bxs-tools-ui';
|
|
13
17
|
export default {
|
|
14
18
|
components: {
|
|
15
|
-
|
|
19
|
+
CanvasPoster
|
|
16
20
|
}
|
|
17
|
-
}
|
|
21
|
+
};
|
|
18
22
|
```
|
|
19
23
|
|
|
20
|
-
|
|
21
|
-
|
|
24
|
+
---
|
|
25
|
+
|
|
26
|
+
### 示例(example)
|
|
27
|
+
|
|
28
|
+
```html
|
|
22
29
|
<template>
|
|
23
|
-
<CanvasPoster :poster-data="posterData"
|
|
30
|
+
<CanvasPoster :poster-data="posterData" />
|
|
24
31
|
</template>
|
|
25
32
|
|
|
33
|
+
<script>
|
|
34
|
+
import { CanvasPoster } from 'bxs-tools-ui';
|
|
35
|
+
|
|
26
36
|
export default {
|
|
27
|
-
|
|
37
|
+
components: { CanvasPoster },
|
|
38
|
+
data() {
|
|
28
39
|
return {
|
|
29
40
|
posterData: [
|
|
30
41
|
{
|
|
31
42
|
type: 'image',
|
|
32
|
-
url: 'https://media.winbaoxian.com/
|
|
43
|
+
url: 'https://media.winbaoxian.com/xxx.jpeg',
|
|
33
44
|
width: window.innerWidth,
|
|
34
45
|
height: window.innerHeight
|
|
35
|
-
},
|
|
46
|
+
},
|
|
47
|
+
{
|
|
36
48
|
type: 'image',
|
|
37
|
-
url: 'https://media.winbaoxian.com/
|
|
49
|
+
url: 'https://media.winbaoxian.com/avatar.jpeg',
|
|
38
50
|
point: [200, 250],
|
|
39
51
|
width: 100,
|
|
40
52
|
height: 100,
|
|
41
53
|
radius: 50
|
|
42
|
-
},
|
|
43
|
-
|
|
44
|
-
url: 'https://media.winbaoxian.com/autoUpload/planbook/712d0f9ecd593a33029b5ea1b6ab419f2e014e5029e1a-MTGQfr_fw658_7f99c5bc34a5ef5.jpeg',
|
|
45
|
-
point: [250, 300],
|
|
46
|
-
width: 100,
|
|
47
|
-
height: 100
|
|
48
|
-
},{
|
|
54
|
+
},
|
|
55
|
+
{
|
|
49
56
|
type: 'text',
|
|
50
|
-
tx: '
|
|
57
|
+
tx: '单行标题文本',
|
|
51
58
|
textAlign: 'center',
|
|
52
|
-
point: [window.innerWidth / 2, 20]
|
|
53
|
-
},
|
|
59
|
+
point: [window.innerWidth / 2, 20]
|
|
60
|
+
},
|
|
61
|
+
{
|
|
54
62
|
type: 'text',
|
|
55
|
-
tx: '
|
|
63
|
+
tx: '支持自动换行的长文本内容,超出宽度后会自动折行显示。',
|
|
56
64
|
color: '#fff',
|
|
57
65
|
fontWeight: 'bold',
|
|
58
66
|
fontSize: 18,
|
|
59
67
|
fontFamily: 'Times',
|
|
60
|
-
// textAlign: 'center',
|
|
61
68
|
lineHeight: 36,
|
|
62
69
|
autoLine: true,
|
|
63
70
|
right: 50,
|
|
64
|
-
point: [50, 60]
|
|
65
|
-
},
|
|
71
|
+
point: [50, 60]
|
|
72
|
+
},
|
|
73
|
+
{
|
|
66
74
|
type: 'rect',
|
|
67
75
|
color: '#267a9a',
|
|
68
76
|
point: [50, window.innerHeight - 250],
|
|
69
77
|
width: window.innerWidth * 0.4,
|
|
70
78
|
height: 100,
|
|
71
79
|
radius: 20
|
|
72
|
-
},
|
|
80
|
+
},
|
|
81
|
+
{
|
|
73
82
|
type: 'rect',
|
|
74
83
|
color: 'rgba(255, 255, 0, 0.5)',
|
|
75
84
|
point: [0, window.innerHeight - 130],
|
|
76
85
|
width: window.innerWidth,
|
|
77
86
|
height: 130
|
|
78
|
-
},
|
|
87
|
+
},
|
|
88
|
+
{
|
|
79
89
|
type: 'image',
|
|
80
|
-
url: 'https://media.winbaoxian.com/
|
|
90
|
+
url: 'https://media.winbaoxian.com/QR_code.jpeg',
|
|
81
91
|
point: [window.innerWidth - 115, window.innerHeight - 115],
|
|
82
92
|
width: 100,
|
|
83
93
|
height: 100,
|
|
84
94
|
radius: 5
|
|
85
95
|
}
|
|
86
96
|
]
|
|
87
|
-
}
|
|
97
|
+
};
|
|
88
98
|
}
|
|
89
|
-
}
|
|
99
|
+
};
|
|
100
|
+
</script>
|
|
90
101
|
```
|
|
91
102
|
|
|
103
|
+
---
|
|
104
|
+
|
|
105
|
+
### Attributes
|
|
106
|
+
|
|
107
|
+
#### 根级 props
|
|
108
|
+
|
|
109
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
110
|
+
| --- | --- | --- | --- |
|
|
111
|
+
| `poster-data` | 必传,海报绘制元素数组 | Array | `[]` |
|
|
112
|
+
| `canvas-width` | 可选,Canvas 画布宽度 | Number | `window.innerWidth` |
|
|
113
|
+
| `canvas-height` | 可选,Canvas 画布高度 | Number | `window.innerHeight` |
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
#### 绘制元素:image(图片)
|
|
117
|
+
|
|
118
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
119
|
+
| --- | --- | --- | --- |
|
|
120
|
+
| `type` | 必传,固定值 `'image'` | String | — |
|
|
121
|
+
| `url` | 必传,图片地址 | String | — |
|
|
122
|
+
| `crossOrigin` | 允许跨源加载,可解除 `getImageData` / `toBlob` / `toDataURL` 限制 | String | — |
|
|
123
|
+
| `point` | 绘制起点坐标 `[x, y]` | Array | `[0, 0]` |
|
|
124
|
+
| `width` | 图片宽度 | Number | 图片自身宽度 |
|
|
125
|
+
| `height` | 图片高度 | Number | 图片自身高度 |
|
|
126
|
+
| `radius` | 圆角半径 | Number | — |
|
|
127
|
+
|
|
128
|
+
|
|
129
|
+
#### 绘制元素:text(文本)
|
|
130
|
+
|
|
131
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
132
|
+
| --- | --- | --- | --- |
|
|
133
|
+
| `type` | 必传,固定值 `'text'` | String | — |
|
|
134
|
+
| `tx` | 必传,绘制的文本内容 | String | — |
|
|
135
|
+
| `color` | 字体颜色 | String | `'#333'` |
|
|
136
|
+
| `fontWeight` | 字体加粗(如 `'bold'`) | String | — |
|
|
137
|
+
| `fontSize` | 字体大小(px) | Number | `12` |
|
|
138
|
+
| `fontFamily` | 字体族 | String | `'Arial'` |
|
|
139
|
+
| `textAlign` | 文本对齐方式 | String | `'start'` |
|
|
140
|
+
| `point` | 绘制起点坐标 `[x, y]` | Array | `[0, 0]` |
|
|
141
|
+
| `autoLine` | 是否自动换行 | Boolean | `false` |
|
|
142
|
+
| `right` | 文本与右边界的距离,仅 `autoLine` 为 `true` 时有效 | Number | `0` |
|
|
143
|
+
| `lineHeight` | 行距,仅 `autoLine` 为 `true` 时有效 | Number | 与 `fontSize` 相同 |
|
|
144
|
+
|
|
145
|
+
|
|
146
|
+
#### 绘制元素:rect(矩形)
|
|
147
|
+
|
|
148
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
149
|
+
| --- | --- | --- | --- |
|
|
150
|
+
| `type` | 必传,固定值 `'rect'` | String | — |
|
|
151
|
+
| `color` | 必传,填充颜色,支持 `rgba` | String | — |
|
|
152
|
+
| `point` | 绘制起点坐标 `[x, y]` | Array | `[0, 0]` |
|
|
153
|
+
| `width` | 矩形宽度 | Number | `window.innerWidth` |
|
|
154
|
+
| `height` | 矩形高度 | Number | `window.innerHeight` |
|
|
155
|
+
| `radius` | 圆角半径 | Number | — |
|
|
156
|
+
|
|
157
|
+
---
|
|
158
|
+
|
|
159
|
+
### Methods
|
|
160
|
+
|
|
161
|
+
| 方法名 | 说明 | 参数 |
|
|
162
|
+
| --- | --- | --- |
|
|
163
|
+
| `drawPoster` | 按 `posterData` 顺序依次绘制所有元素(`mounted` 时自动调用一次);**`posterData` 变更后不会自动重绘**,需通过 `$refs` 手动调用此方法或重新挂载组件 | — |
|
|
164
|
+
|
|
165
|
+
> **注意**:组件 canvas 的 `id` 固定为 `canvasPoster`,同一页面中存在多个实例时会发生 DOM id 冲突,请避免同时渲染多个实例。
|
|
166
|
+
|
|
167
|
+
---
|
|
168
|
+
|
|
169
|
+
### Events
|
|
170
|
+
|
|
171
|
+
-
|
|
92
172
|
|
|
93
|
-
|
|
94
|
-
| 参数| 说明 | 类型 | 默认值 |
|
|
95
|
-
| --- | --- | --- | --- |
|
|
96
|
-
| canvas-width | canvas画布的宽度 | number | 文档显示区的宽度 (window.innerWidth) |
|
|
97
|
-
| canvas-height | canvas画布的高度 | number | 文档显示区的高度 (window.innerHeight) |
|
|
98
|
-
| poster-data | 海报的数据 | Array | 以数组形式传参,每个子元素是json对象,不同类型的绘制元素结构不一样。下方三种绘制元素的数据结构 |
|
|
99
|
-
|
|
100
|
-
以下参数中,type是元素的类型:image(图片)、text(文本)、rect(矩形)
|
|
101
|
-
###
|
|
102
|
-
|
|
103
|
-
### 绘制:图片
|
|
104
|
-
| 参数| 说明 | 类型 | 默认值 | 版本 |
|
|
105
|
-
| --- | --- | --- | --- | --- |
|
|
106
|
-
| type | 必传, 图片传'image' | string | - | - |
|
|
107
|
-
| url | 必传, 图片地址 | string | - | - |
|
|
108
|
-
| crossOrigin | 可选, 允许跨源加载图片,避免 canvas 对非同源图片的限制,比如:getImageData()、toBlob()、toDataURL() 等方法的使用。 | string | - | 1.1.0-9 |
|
|
109
|
-
| point | 可选,绘图的起点,x轴、y轴坐标 | array | [0, 0] | - |
|
|
110
|
-
| width | 可选,图片的宽度 | number | 图片自身宽度 | - |
|
|
111
|
-
| height | 可选,图片的高度 | number | 图片自身高度 | - |
|
|
112
|
-
| radius | 可选,图片的圆色值 | number | - | - |
|
|
113
|
-
|
|
114
|
-
### 绘制:文本
|
|
115
|
-
| 参数| 说明 | 类型 | 默认值 |
|
|
116
|
-
| --- | --- | --- | --- |
|
|
117
|
-
| type | 必传, 文本传'text' | string | - |
|
|
118
|
-
| tx | 必传, 要绘制的文本 | string | - |
|
|
119
|
-
| color | 可选,字体颜色 | string | #333 |
|
|
120
|
-
| fontWeight | 选择,字体加粗 | string | - |
|
|
121
|
-
| fontSize | 可选,字体大小 | number | 12 |
|
|
122
|
-
| fontFamily | 可选,字体 | string | Arial |
|
|
123
|
-
| textAlign | 可选,文本对齐方式 | string | start |
|
|
124
|
-
| point | 可选,绘图的起点,x轴、y轴坐标 | array | [0, 0] |
|
|
125
|
-
| autoLine | 可选, 自动换行 | boolean | false |
|
|
126
|
-
| right | 可选, 文本与右边界的距离。只对自动换行的有效 | number | 0 |
|
|
127
|
-
| lineHeight | 可选, 行距。只对自动换行的有效 | number | 默认与fontSize同 |
|
|
128
|
-
|
|
129
|
-
### 绘制:矩形
|
|
130
|
-
| 参数| 说明 | 类型 | 默认值 |
|
|
131
|
-
| --- | --- | --- | --- |
|
|
132
|
-
| type | 必传,矩形传'rect' | string | - |
|
|
133
|
-
| color | 必传,字体颜色。设置透明度可使用rgba(0,0,0,0.5) | string | - |
|
|
134
|
-
| width | 可选,矩形的宽度 | number | 文档显示区的宽度(window.innerWidth) |
|
|
135
|
-
| height | 可选,矩形的高度 | number | 文档显示区的高度(window.innerHeight) |
|
|
136
|
-
| point | 可选,绘图的起点,x轴、y轴坐标 | array | [0, 0] |
|
|
137
|
-
| radius | 可选,图片的圆色值 | number | - |
|
|
173
|
+
---
|
|
138
174
|
|
|
175
|
+
### Slot
|
|
139
176
|
|
|
177
|
+
| 插槽名 | 说明 |
|
|
178
|
+
| --- | --- |
|
|
179
|
+
| `default` | 位于 `<canvas>` 标签内部,作为浏览器不支持 Canvas 时的降级内容 |
|
package/packages/index.ts
CHANGED
|
@@ -1,151 +1,207 @@
|
|
|
1
|
-
<!--仅用于绕过 eslint-loader 校验的错误信息:Parsing error: Invalid character-->
|
|
2
|
-
<!--??以目前现象看,文档首字符不为 "<" 会报错??-->
|
|
3
1
|
## 试算业务组件(InsureCalculate)
|
|
4
2
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
import
|
|
3
|
+
保险产品试算组件,基于服务端下发的试算因子(`widgets` / `current_data`)动态渲染表单,并支持重新计算保费。可作为**组件**嵌入页面使用,也可直接调用**方法**(`insureCalculate` / `checkInsureCalculate`)完成纯数据试算。
|
|
4
|
+
|
|
5
|
+
> **注意**:组件模式内部会自动请求用户信息接口,兼容 C 端场景;方法模式不含用户信息逻辑,C 端调用时必须在 `urlParams` 中传入 `uuid`。
|
|
6
|
+
|
|
7
|
+
---
|
|
8
|
+
|
|
9
|
+
### 模块引用(import)
|
|
10
|
+
|
|
11
|
+
```javascript
|
|
12
12
|
import { InsureCalculate } from 'bxs-tools-ui';
|
|
13
|
+
export default {
|
|
14
|
+
components: {
|
|
15
|
+
InsureCalculate
|
|
16
|
+
}
|
|
17
|
+
};
|
|
13
18
|
```
|
|
14
19
|
|
|
15
|
-
|
|
20
|
+
---
|
|
21
|
+
|
|
22
|
+
### 示例(example)
|
|
23
|
+
|
|
16
24
|
```html
|
|
17
|
-
|
|
18
|
-
<
|
|
19
|
-
|
|
20
|
-
|
|
25
|
+
<template>
|
|
26
|
+
<InsureCalculate
|
|
27
|
+
ref="insureCalculate"
|
|
28
|
+
:calculate-data="calculateData"
|
|
29
|
+
:product-id="productId"
|
|
30
|
+
:plan-params="planParams"
|
|
31
|
+
:is-show-duty="true"
|
|
32
|
+
:show-header="true"
|
|
33
|
+
title="试算"
|
|
34
|
+
:show-footer="true"
|
|
35
|
+
@closeInsureCalculate="onClose"
|
|
36
|
+
@sureInsureCalculate="onSure"
|
|
37
|
+
>
|
|
38
|
+
<template #header>
|
|
39
|
+
<!-- 自定义顶部内容(可选) -->
|
|
40
|
+
</template>
|
|
41
|
+
<template #footer>
|
|
42
|
+
<!-- 自定义底部内容(可选) -->
|
|
43
|
+
</template>
|
|
44
|
+
</InsureCalculate>
|
|
45
|
+
</template>
|
|
46
|
+
|
|
47
|
+
<script>
|
|
48
|
+
import { InsureCalculate } from 'bxs-tools-ui';
|
|
49
|
+
|
|
21
50
|
export default {
|
|
22
|
-
components: {
|
|
23
|
-
|
|
51
|
+
components: { InsureCalculate },
|
|
52
|
+
data() {
|
|
53
|
+
return {
|
|
54
|
+
productId: '102163',
|
|
55
|
+
calculateData: {},
|
|
56
|
+
planParams: {
|
|
57
|
+
detail_age: '30周岁',
|
|
58
|
+
detail_sex: '1'
|
|
59
|
+
}
|
|
60
|
+
};
|
|
61
|
+
},
|
|
62
|
+
methods: {
|
|
63
|
+
// 主动获取当前试算数据(调用组件 confirm 方法)
|
|
64
|
+
getCalculateData() {
|
|
65
|
+
this.$refs.insureCalculate.confirm().then(({ t_version, code, data }) => {
|
|
66
|
+
console.log(t_version, data);
|
|
67
|
+
});
|
|
68
|
+
},
|
|
69
|
+
onClose() {},
|
|
70
|
+
onSure() {}
|
|
24
71
|
}
|
|
25
|
-
}
|
|
72
|
+
};
|
|
73
|
+
</script>
|
|
26
74
|
```
|
|
27
75
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
|
34
|
-
|
|
|
35
|
-
|
|
|
36
|
-
|
|
|
37
|
-
|
|
|
38
|
-
|
|
|
39
|
-
|
|
|
40
|
-
|
|
|
41
|
-
|
|
|
42
|
-
|
|
|
43
|
-
|
|
|
44
|
-
|
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
|
51
|
-
|detail_age|被保人年龄|String, 例:50周岁 或 1990-06-17,没有限制不传值|-|
|
|
52
|
-
|detail_sex|被保人性别|String, 例:'1':男,'2':女,没有限制不传值|-|
|
|
53
|
-
|detail_relation|投被保人关系|String | undefined,
|
|
54
|
-
非本人:'-1';
|
|
55
|
-
指定人:本人:'1','14-丈夫','15-妻子','16-儿子','17-女儿','18-父亲','19-母亲';
|
|
56
|
-
不限制:'' | undefined | null|-|
|
|
57
|
-
|detail_applicant_age|投保人年龄|String, 例:50周岁 或 1990-06-17,没有限制不传值|-|
|
|
58
|
-
|detail_applicant_sex|投保人性别|String, 例:'1':男,'2':女,没有限制不传值|-|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
## calculateData 对象
|
|
62
|
-
| 参数| 说明 | 类型 | 默认值 |
|
|
63
|
-
| --- | --- | --- | --- |
|
|
64
|
-
|widgets|页面渲染数据,详见下表|Array|-|
|
|
65
|
-
|current_data|当前选项映射值,详见下表|Object|-|
|
|
66
|
-
|total_premium|保留字段,试算保费|Number|-|
|
|
67
|
-
|product_id|保留字段,当前试算产品ID|String|-|
|
|
68
|
-
|risk_premiums|保留字段,试算附加险相关信息|Array|-|
|
|
69
|
-
|terms|保留字段,险种说明|Array|-|
|
|
70
|
-
|
|
71
|
-
## widgets 对象
|
|
72
|
-
| 参数| 说明 | 类型 | 默认值 |
|
|
73
|
-
| --- | --- | --- | --- |
|
|
74
|
-
|cal_key|试算因子是否重新计算保费相关,1代表该因子与保费相关,0代表该因子与保费无关|Number|-|
|
|
75
|
-
|hidden|试算因子是否隐藏展示该试算因子,服务端控制,0代表展示该因子,1代表隐藏该因子|Number|-|
|
|
76
|
-
|key|作为试算因子参数opts的取值key,与关键字opts联合使用,即opts[key]进行取值|Number|-|
|
|
77
|
-
|label|试算因子名称|String|-|
|
|
78
|
-
|opts|试算因子的取值范围,与关键字key联合使用|String|-|
|
|
79
|
-
|riskCode|试算因子的险种code|String|-|
|
|
80
|
-
|type|试算因子映射的前端组件|String|-|
|
|
81
|
-
|
|
82
|
-
## current_data 对象
|
|
83
|
-
| 参数| 说明 | 类型 | 默认值 |
|
|
84
|
-
| --- | --- | --- | --- |
|
|
85
|
-
|k|试算因子的java名称,对应widgets对象中的key|String|-|
|
|
86
|
-
|risk|试算因子的险种code,对应widgets对象中的riskCode|String|-|
|
|
87
|
-
|v|试算因子当前项对应的值,对应widgets对象中opts中的某个值|String|-|
|
|
88
|
-
|age|保留字段,calendar组件特有属性,对应当前年龄数值|Number|-|
|
|
89
|
-
|sv|保留字段,calendar组件特有属性,对应可选年龄范围|String|-|
|
|
90
|
-
|
|
91
|
-
## Event
|
|
92
|
-
| 事件名称 | 说明 | 参数 |
|
|
76
|
+
---
|
|
77
|
+
|
|
78
|
+
### Attributes
|
|
79
|
+
|
|
80
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
81
|
+
| --- | --- | --- | --- |
|
|
82
|
+
| `calculateData` | 必传,试算组件原始数据 | Object | `{}` |
|
|
83
|
+
| `productId` | 必传,试算产品 ID | String / Number | — |
|
|
84
|
+
| `uuid` | 可选,C 端用户 uuid;传入后跳过内部自动获取用户信息接口 | String | — |
|
|
85
|
+
| `planParams` | 必传,初始化参数,见 PlanParams 对象 | Object | — |
|
|
86
|
+
| `lsTime` | 可选,本地缓存时长(分钟) | Number | `10` |
|
|
87
|
+
| `isDev` | 可选,是否为开发环境;默认根据 `window.location.port` 自动判断,可手动覆盖 | Boolean | — |
|
|
88
|
+
| `isShowDuty` | 可选,是否展示试算责任 | Boolean | `false` |
|
|
89
|
+
| `showHeader` | 可选,是否展示顶部标题栏 | Boolean | `false` |
|
|
90
|
+
| `title` | 可选,顶部标题,`showHeader` 为 `true` 时有效 | String | `''` |
|
|
91
|
+
| `showFooter` | 可选,是否展示底部确定按钮 | Boolean | `false` |
|
|
92
|
+
| `appid` | 可选,ToB 环境变量,用于判断是否为 ToB 环境 | String | `''` |
|
|
93
|
+
| `openId` | 可选,ToB 环境变量;未获取到 `uuid` 时用于替代 `userUuid` | String | `''` |
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
#### calculateData 对象
|
|
97
|
+
|
|
98
|
+
| 参数 | 说明 | 类型 |
|
|
93
99
|
| --- | --- | --- |
|
|
94
|
-
|
|
|
95
|
-
|
|
|
96
|
-
|
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
| 方法名称 | 说明 | 参数 |
|
|
100
|
+
| `widgets` | 页面渲染数据,见 widgets 对象 | Array |
|
|
101
|
+
| `current_data` | 当前选项映射值,元素见 current_data 对象 | Array |
|
|
102
|
+
| `total_premium` | 试算保费(保留字段) | Number |
|
|
103
|
+
| `product_id` | 当前试算产品 ID(保留字段) | String |
|
|
104
|
+
| `risk_premiums` | 试算附加险相关信息(保留字段) | Array |
|
|
105
|
+
| `terms` | 险种说明(保留字段) | Array |
|
|
106
|
+
|
|
107
|
+
|
|
108
|
+
#### widgets 对象(单项)
|
|
109
|
+
|
|
110
|
+
| 参数 | 说明 | 类型 |
|
|
106
111
|
| --- | --- | --- |
|
|
107
|
-
|
|
|
108
|
-
|
|
|
112
|
+
| `cal_key` | 是否与保费相关;`1` 相关,`0` 不相关 | Number |
|
|
113
|
+
| `hidden` | 是否隐藏;`0` 展示,`1` 隐藏 | Number |
|
|
114
|
+
| `key` | 取值 key,与 `opts` 联合使用:`opts[key]` | Number |
|
|
115
|
+
| `label` | 试算因子名称 | String |
|
|
116
|
+
| `opts` | 试算因子取值范围,以 `key` 为索引的对象,取当前值用 `opts[key]` | Object |
|
|
117
|
+
| `riskCode` | 险种 code | String |
|
|
118
|
+
| `type` | 映射的前端组件类型 | String |
|
|
109
119
|
|
|
110
|
-
## Slot
|
|
111
|
-
无
|
|
112
120
|
|
|
113
|
-
|
|
114
|
-
|
|
121
|
+
#### current_data 对象(单项)
|
|
122
|
+
|
|
123
|
+
| 参数 | 说明 | 类型 |
|
|
124
|
+
| --- | --- | --- |
|
|
125
|
+
| `k` | 试算因子 Java 名称,对应 `widgets.key` | String |
|
|
126
|
+
| `risk` | 险种 code,对应 `widgets.riskCode` | String |
|
|
127
|
+
| `v` | 当前选项值,对应 `widgets.opts` 中的某个值 | String |
|
|
128
|
+
| `age` | calendar 组件特有,当前年龄数值(保留字段) | Number |
|
|
129
|
+
| `sv` | calendar 组件特有,可选年龄范围(保留字段) | String |
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
#### PlanParams 对象
|
|
133
|
+
|
|
134
|
+
| 参数 | 说明 | 类型 |
|
|
115
135
|
| --- | --- | --- |
|
|
116
|
-
|
|
|
117
|
-
|
|
|
118
|
-
|
|
|
119
|
-
|
|
|
120
|
-
|
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
136
|
+
| `detail_age` | 被保人年龄,如 `'50周岁'` 或 `'1990-06-17'`;无限制不传 | String |
|
|
137
|
+
| `detail_sex` | 被保人性别,`'1'` 男 / `'2'` 女;无限制不传 | String |
|
|
138
|
+
| `detail_relation` | 投被保人关系;非本人:`'-1'`;本人:`'1'`;其他关系见备注;不限制:`''` / `undefined` / `null` | String |
|
|
139
|
+
| `detail_applicant_age` | 投保人年龄,格式同 `detail_age`;无限制不传 | String |
|
|
140
|
+
| `detail_applicant_sex` | 投保人性别,格式同 `detail_sex`;无限制不传 | String |
|
|
141
|
+
|
|
142
|
+
> `detail_relation` 其他关系值:`'14'` 丈夫 / `'15'` 妻子 / `'16'` 儿子 / `'17'` 女儿 / `'18'` 父亲 / `'19'` 母亲
|
|
143
|
+
|
|
144
|
+
---
|
|
145
|
+
|
|
146
|
+
### Methods
|
|
147
|
+
|
|
148
|
+
#### 组件实例方法(通过 `$refs` 调用)
|
|
149
|
+
|
|
150
|
+
| 方法名 | 说明 | 出参 |
|
|
125
151
|
| --- | --- | --- |
|
|
126
|
-
|
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
152
|
+
| `confirm` | 主动获取当前试算数据,不触发试算请求 | Promise `{ t_version, code: 200, data }`;`data` 含 `widgets / total_premium / terms / product_id / current_data / risk_premiums` |
|
|
153
|
+
|
|
154
|
+
#### 工具函数(从 `bxs-utils` 导入,非组件实例方法)
|
|
155
|
+
|
|
156
|
+
| 方法名 | 说明 | 入参 | 出参 |
|
|
157
|
+
| --- | --- | --- | --- |
|
|
158
|
+
| `insureCalculate` | 执行试算,返回完整的试算数据 | `urlParams`, `postParams`, `planParams` | Promise `{ code, data }`;`code === 200` 表示成功;`data` 含 `widgets / total_premium / terms / product_id / current_data` |
|
|
159
|
+
| `checkInsureCalculate` | 校验试算是否成功 | `urlParams`, `postParams`, `planParams` | Promise `{ code, data }`;`code === 200` 表示试算成功 |
|
|
130
160
|
|
|
131
|
-
|
|
132
|
-
|
|
161
|
+
|
|
162
|
+
#### urlParams 对象
|
|
163
|
+
|
|
164
|
+
| 参数 | 说明 | 类型 |
|
|
133
165
|
| --- | --- | --- |
|
|
134
|
-
|
|
|
135
|
-
|
|
|
136
|
-
|
|
|
137
|
-
|
|
166
|
+
| `uuid` | C 端必传,用户 uuid | String |
|
|
167
|
+
| `appid` | ToB 必传,作为 url 中 `appId` 字段传递 | String |
|
|
168
|
+
| `openId` | ToB 选传,未获取到 `uuid` 时作为 `userUuid` 传递 | String |
|
|
169
|
+
|
|
138
170
|
|
|
139
|
-
|
|
140
|
-
|
|
171
|
+
#### postParams 对象
|
|
172
|
+
|
|
173
|
+
| 参数 | 说明 | 类型 |
|
|
141
174
|
| --- | --- | --- |
|
|
142
|
-
|product_id
|
|
143
|
-
|current_data
|
|
144
|
-
|scenario
|
|
175
|
+
| `product_id` | 产品 ID | String |
|
|
176
|
+
| `current_data` | 当前试算因子对象,默认 `null` | Object |
|
|
177
|
+
| `scenario` | 固定值 `'h5Widget'`,可不传(已兼容) | String |
|
|
178
|
+
|
|
179
|
+
|
|
180
|
+
#### 时间单位说明
|
|
145
181
|
|
|
146
|
-
|
|
147
|
-
|
|
|
182
|
+
| 值 | 含义 |
|
|
183
|
+
| --- | --- |
|
|
184
|
+
| `30D` | 30 天 |
|
|
185
|
+
| `12M` | 12 个月 |
|
|
186
|
+
| `1Y` | 趸交或 1 年交 |
|
|
187
|
+
| `20Y` | 20 年 |
|
|
188
|
+
| `70A` | 至 70 周岁 |
|
|
189
|
+
| `100O` | 终生 |
|
|
190
|
+
|
|
191
|
+
---
|
|
192
|
+
|
|
193
|
+
### Events
|
|
194
|
+
|
|
195
|
+
| 事件名 | 说明 | 回调参数 |
|
|
148
196
|
| --- | --- | --- |
|
|
149
|
-
|
|
|
150
|
-
|
|
|
151
|
-
|
|
197
|
+
| `closeInsureCalculate` | `showHeader` 为 `true` 时,点击关闭按钮触发 | — |
|
|
198
|
+
| `sureInsureCalculate` | `showFooter` 为 `true` 时,点击确定按钮触发 | — |
|
|
199
|
+
|
|
200
|
+
---
|
|
201
|
+
|
|
202
|
+
### Slot
|
|
203
|
+
|
|
204
|
+
| 插槽名 | 说明 |
|
|
205
|
+
| --- | --- |
|
|
206
|
+
| `header` | 自定义顶部内容,`showHeader` 为 `true` 时生效;不传则展示默认标题栏(含标题文字和关闭按钮) |
|
|
207
|
+
| `footer` | 自定义底部内容,`showFooter` 为 `true` 时生效;不传则展示默认确定按钮 |
|