wkjp-list-page 1.0.40 → 1.0.42
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 +37 -0
- package/package.json +1 -1
- package/src/components/CommonListPage.vue +2573 -2526
package/README.md
CHANGED
|
@@ -258,6 +258,42 @@ deviceListTransformList(list) {
|
|
|
258
258
|
| `selection-change` | 表格多选变化。 |
|
|
259
259
|
| `fetched` | 每次 `api` 成功，参数 `{ list, total, page, pageSize, raw }`。 |
|
|
260
260
|
| `columns-change` | **仅开启列配置**：弹窗确定后，当前列配置数组。 |
|
|
261
|
+
| `track` | **埋点事件**：用户点击「展开查询 / 收起查询 / 配置字段」时触发，参数 `{ action, pageKey, timestamp }`；组件已内置百度统计上报，此事件用于额外接入，详见 §2.15。 |
|
|
262
|
+
|
|
263
|
+
---
|
|
264
|
+
|
|
265
|
+
## 2.15 监测「展开查询 / 收起查询 / 配置字段」的点击次数（埋点）
|
|
266
|
+
|
|
267
|
+
**情况：** 想统计用户对搜索折叠、表头设置这几个操作的使用频率。
|
|
268
|
+
**说明：** 组件 **内置了百度统计上报**，并在以下三个动作发生时同时 **`$emit('track', payload)`**，无需消费方手写上报逻辑。
|
|
269
|
+
|
|
270
|
+
| 动作 | `action` 值 | 百度统计「事件操作」 | 触发时机 |
|
|
271
|
+
|------|------------|----------------------|----------|
|
|
272
|
+
| 展开查询 | `expand-search` | 展开查询 | 点击「展开查询」 |
|
|
273
|
+
| 收起查询 | `fold-search` | 收起查询 | 点击「收起查询」 |
|
|
274
|
+
| 配置字段 | `column-config` | 配置字段 | 打开表头设置面板（关闭不计） |
|
|
275
|
+
|
|
276
|
+
**前置条件（零配置）：** 页面已引入百度统计代码（`hm.js`，全站一次，通常放 `index.html` 的 `<head>`），组件会自动 `window._hmt.push(['_trackEvent', '列表页', 动作名, trackPageKey])` 上报。未引入 `hm.js` 时静默跳过，不报错。可选传 **`track-page-key`** 作为事件标签区分列表页。
|
|
277
|
+
|
|
278
|
+
```vue
|
|
279
|
+
<common-list-page track-page-key="设备列表" ... />
|
|
280
|
+
```
|
|
281
|
+
|
|
282
|
+
**看数据：** 百度统计后台 → **行为分析 → 事件分析**，事件类别选「列表页」，按「事件操作」即可看到三个动作各自的触发次数（事件数据通常 **次日** 才出现）。
|
|
283
|
+
|
|
284
|
+
**额外接其它埋点（可选）：** 仍可监听 `@track`，与内置上报并存：
|
|
285
|
+
|
|
286
|
+
```vue
|
|
287
|
+
<common-list-page @track="onListTrack" ... />
|
|
288
|
+
```
|
|
289
|
+
|
|
290
|
+
```js
|
|
291
|
+
onListTrack({ action, pageKey, timestamp }) {
|
|
292
|
+
// 例如再推一份到其它 SDK；百度统计已由组件内部自动上报
|
|
293
|
+
}
|
|
294
|
+
```
|
|
295
|
+
|
|
296
|
+
`payload` 字段：`action`（动作类型，见上表）、`pageKey`（即 `track-page-key`，未传为空串）、`timestamp`（`Date.now()` 毫秒时间戳）。
|
|
261
297
|
|
|
262
298
|
---
|
|
263
299
|
|
|
@@ -301,6 +337,7 @@ deviceListTransformList(list) {
|
|
|
301
337
|
| `collapseSearch` | （未传） | 未传时 **`searchOption.length > searchVisibleMax`** 自动折叠；`true` / `false` 强制开/关。 |
|
|
302
338
|
| `searchVisibleMax` | `null` | 折叠时默认展示条数，**未传按 6**；查询项 **超过** 该值时出现「展开查询」；显式传 ≤0 则不折叠。 |
|
|
303
339
|
| `expandSearchText` / `foldSearchText` | 展开查询 / 收起 | 折叠按钮文案。 |
|
|
340
|
+
| `trackPageKey` | `""` | 埋点页面/业务标识，随 `track` 事件上报以区分列表页（见 §2.15）。 |
|
|
304
341
|
| `columnOverflowTooltipChars` | `20` | 自动列宽：内容超过该字符数时按该字数定宽并 `show-overflow-tooltip`。 |
|
|
305
342
|
| `columnAutoWidthCharPx` | `14` | 自动列宽每字符折算像素。 |
|
|
306
343
|
| `columnAutoWidthPadding` | `24` | 自动列宽额外内边距像素。 |
|