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.
@@ -1,139 +1,179 @@
1
- <!--仅用于绕过 eslint-loader 校验的错误信息:Parsing error: Invalid character-->
2
- <!--??以目前现象看,文档首字符不为 "<" 会报错??-->
3
- ## canvas海报(CanvasPoster)
4
- 说明:canvas绘制海报。支持文本自动换行、自定义字体、圆角矩形、圆角图片等。
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
- CanvasPoster
19
+ CanvasPoster
16
20
  }
17
- }
21
+ };
18
22
  ```
19
23
 
20
- ## 示例
21
- ``` html
24
+ ---
25
+
26
+ ### 示例(example)
27
+
28
+ ```html
22
29
  <template>
23
- <CanvasPoster :poster-data="posterData"></CanvasPoster>
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
- data () {
37
+ components: { CanvasPoster },
38
+ data() {
28
39
  return {
29
40
  posterData: [
30
41
  {
31
42
  type: 'image',
32
- url: 'https://media.winbaoxian.com/autoUpload/planbook/712d0f9ecd593a33029b5ea1b6ab419f2e014e5029e1a-MTGQfr_fw658_7f99c5bc34a5ef5.jpeg',
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/autoUpload/planbook/712d0f9ecd593a33029b5ea1b6ab419f2e014e5029e1a-MTGQfr_fw658_7f99c5bc34a5ef5.jpeg',
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
- type: 'image',
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/autoUpload/planbook/QR_code_845accfa76b4bd0.jpeg',
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
- ## Attribute
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
@@ -50,6 +50,6 @@ export {
50
50
  }
51
51
 
52
52
  export default {
53
- version: '3.2.0-1',
53
+ version: '3.2.0-2',
54
54
  install
55
55
  }
@@ -1,151 +1,207 @@
1
- <!--仅用于绕过 eslint-loader 校验的错误信息:Parsing error: Invalid character-->
2
- <!--??以目前现象看,文档首字符不为 "<" 会报错??-->
3
1
  ## 试算业务组件(InsureCalculate)
4
2
 
5
- ## Import
6
- ```js
7
- import { InsureCalculate } from 'bxs-tools-ui';
8
- ```
9
- 或
10
- ```js
11
- import Vue from 'vue'
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
- ## Example
20
+ ---
21
+
22
+ ### 示例(example)
23
+
16
24
  ```html
17
- <!-- template -->
18
- <insure-calculate />
19
- ```
20
- ```js
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
- InsureCalculate
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
- ## Attention
29
- - 组件使用过程中,关于A/C端用户 `userUuid` 的问题,组件内容使用了计划书获取用户信息的接口(`//app.winbaoxian.cn/planBook/common/currentUser`),会主动带上用户信息进行请求,因此兼容了C端使用的情况;
30
- - 方法使用过程中,考虑到使用场景复杂性,没有获取用户信息,因此C端在使用方法时【必须】给用户信息,具体参考 `urlParams` 对象;
31
-
32
- ## Attribute
33
- | 参数| 说明 | 类型 | 默认值 | 版本 |
34
- | --- | --- | --- | --- | --- |
35
- |calculateData|试算组件原始数据,详见下表|Object|{}|-|
36
- |productId|试算产品ID|String|例如:102163,100559|-|
37
- |isDev|可选,运行环境模式,默认根据`window.location.port`的值来判断当前环境是否为开发环境,用户可使用手动设置组件的属性`isDev`来覆盖默认的判定,默认false|Boolean|true,false|-|
38
- |planParams|初始化对象,详见下表|Object|-|-|
39
- |isShowDuty|是否展示试算责任|Boolean|false|-|
40
- |showHeader|是否展示顶部标题|Boolean|false|-|
41
- |title|顶部标题,showHeader为true的时候才有效|String|''|-|
42
- |showFooter|是否展示底部按钮|Boolean|false|-|
43
- |appid|tob环境变量,必传,判断是否tob环境,处理对应逻辑|String|''|-|
44
- |openId|tob环境变量,选传,如果没有获取到uuid且用户传了openId,openId的值会赋给uuid|String|''|-|
45
-
46
-
47
-
48
- ## planParams 对象
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
- | confirm | 获取当前组件试算因子的数据,返回格式如下 | 当前分值 |
95
- | closeInsureCalculate | 当showHeader为true时,点击关闭按钮触发该事件 | 当前分值 |
96
- | sureInsureCalculate | 当showFooter为true时,点击确定按钮触发该事件 | 当前分值 |
97
-
98
- ## confirm事件返回对象
99
- | 参数| 说明 | 类型 | 默认值 |
100
- | --- | --- | --- | --- |
101
- |t_version|当前事件触发的时间戳|Number|-|
102
- |data|calculateData对象|Object|-|
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
- | insureCalculate | insureCalculate方法执行条件如下 | -- |
108
- | checkInsureCalculate | checkInsureCalculate方法执行条件如下 | -- |
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
- |30D|30天|String|
117
- |12M|12个月|String|
118
- |1Y|趸交或者1年交|String|
119
- |20Y|20年|String|
120
- |70A|至70周岁|String|
121
- |100O|终生|String|
122
-
123
- ## insureCalculate 方法
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
- |urlParams|第一位入参:作为api的拼接参数|参考 urlParams 对象|
127
- |postParams|第二位入参:作为api的试算参数|参考 postParams对象|
128
- |planParams|第三位入参:计划书参数,作为设定postParams的current_data对象的默认值传入,函数内部建立映射机制,如果增加或者修改,联系开发人员|参考 planParams对象|
129
- |返回值|出参:Promise对象,包含{code, data};code为200表示请求正常,其他值对应请求错误;data包含{widgets,total_premium,terms,product_id,current_data},对应calculateData对象。|-|
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
- ## checkInsureCalculate 方法
132
- | 期间| 说明 | 类型 |
161
+
162
+ #### urlParams 对象
163
+
164
+ | 参数 | 说明 | 类型 |
133
165
  | --- | --- | --- |
134
- |urlParams|第一位入参:作为api的拼接参数|参考 urlParams 对象|
135
- |postParams|第二位入参:作为api的试算参数|参考 postParams对象|
136
- |planParams|第三位入参:计划书参数,作为设定postParams的current_data对象的默认值传入,函数内部建立映射机制,如果增加或者修改,联系开发人员|参考 planParams对象|
137
- |返回值|出参:Promise对象,包含{code, data};code为200表示试算成功,其他值对应试算失败|-|
166
+ | `uuid` | C 端必传,用户 uuid | String |
167
+ | `appid` | ToB 必传,作为 url 中 `appId` 字段传递 | String |
168
+ | `openId` | ToB 选传,未获取到 `uuid` 时作为 `userUuid` 传递 | String |
169
+
138
170
 
139
- ## postParams 对象
140
- | 期间| 说明 | 类型 |
171
+ #### postParams 对象
172
+
173
+ | 参数 | 说明 | 类型 |
141
174
  | --- | --- | --- |
142
- |product_id|产品id|'101768'|
143
- |current_data|当前试算因子对象,默认值为null|参考 current_data对象|
144
- |scenario|默认值,固定值`h5Widget`,服务端区分试算来源为H5,可不传,已兼容|h5Widget|
175
+ | `product_id` | 产品 ID | String |
176
+ | `current_data` | 当前试算因子对象,默认 `null` | Object |
177
+ | `scenario` | 固定值 `'h5Widget'`,可不传(已兼容) | String |
178
+
179
+
180
+ #### 时间单位说明
145
181
 
146
- ## urlParams 对象
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
- |uuid|c端必传用户uuid|-|
150
- |appid|tob环境变量,必传,url上作为appId字段的值传递|String|
151
- |openId|tob环境变量,选传,在没有获取到uuid的情况下,作为userUuid字段的值进行传递|String|
197
+ | `closeInsureCalculate` | `showHeader` 为 `true` 时,点击关闭按钮触发 | — |
198
+ | `sureInsureCalculate` | `showFooter` 为 `true` 时,点击确定按钮触发 | — |
199
+
200
+ ---
201
+
202
+ ### Slot
203
+
204
+ | 插槽名 | 说明 |
205
+ | --- | --- |
206
+ | `header` | 自定义顶部内容,`showHeader` 为 `true` 时生效;不传则展示默认标题栏(含标题文字和关闭按钮) |
207
+ | `footer` | 自定义底部内容,`showFooter` 为 `true` 时生效;不传则展示默认确定按钮 |