cbvirtua 1.0.115 → 1.0.122
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/package.json +1 -1
- package/sss.txt +2 -0
- package/v-track-master/v-track-master/.browserslistrc +3 -0
- package/v-track-master/v-track-master/.eslintignore +3 -0
- package/v-track-master/v-track-master/.eslintrc.js +15 -0
- package/v-track-master/v-track-master/.gitattributes +1 -0
- package/v-track-master/v-track-master/.github/FUNDING.yml +12 -0
- package/v-track-master/v-track-master/.github/workflows/node.js.yml +29 -0
- package/v-track-master/v-track-master/.travis.yml +22 -0
- package/v-track-master/v-track-master/.yarnrc +1 -0
- package/v-track-master/v-track-master/LICENSE +21 -0
- package/v-track-master/v-track-master/README.md +131 -0
- package/v-track-master/v-track-master/babel.config.js +25 -0
- package/v-track-master/v-track-master/build/rollup.config.base.js +14 -0
- package/v-track-master/v-track-master/build/rollup.config.browser.js +21 -0
- package/v-track-master/v-track-master/build/rollup.config.es.js +11 -0
- package/v-track-master/v-track-master/docs/.babelrc +5 -0
- package/v-track-master/v-track-master/docs/App.vue +61 -0
- package/v-track-master/v-track-master/docs/assets/app.scss +197 -0
- package/v-track-master/v-track-master/docs/assets/index.scss +10 -0
- package/v-track-master/v-track-master/docs/assets/mixins.scss +64 -0
- package/v-track-master/v-track-master/docs/assets/normalize.scss +349 -0
- package/v-track-master/v-track-master/docs/components/button.vue +15 -0
- package/v-track-master/v-track-master/docs/components/code-snippet.vue +72 -0
- package/v-track-master/v-track-master/docs/dist/css/app.2e14d2d6.css +4 -0
- package/v-track-master/v-track-master/docs/dist/css/chunk-vendors.c687a9b2.css +1 -0
- package/v-track-master/v-track-master/docs/dist/favicon.ico +0 -0
- package/v-track-master/v-track-master/docs/dist/fonts/element-icons.535877f5.woff +0 -0
- package/v-track-master/v-track-master/docs/dist/fonts/element-icons.732389de.ttf +0 -0
- package/v-track-master/v-track-master/docs/dist/js/app.efe84ade.js +2 -0
- package/v-track-master/v-track-master/docs/dist/js/app.efe84ade.js.map +1 -0
- package/v-track-master/v-track-master/docs/dist/js/chunk-vendors.c94e27ba.js +13 -0
- package/v-track-master/v-track-master/docs/dist/js/chunk-vendors.c94e27ba.js.map +1 -0
- package/v-track-master/v-track-master/docs/index.html +1 -0
- package/v-track-master/v-track-master/docs/main.js +78 -0
- package/v-track-master/v-track-master/docs/pages/block-show.vue +177 -0
- package/v-track-master/v-track-master/docs/pages/custom-events.vue +291 -0
- package/v-track-master/v-track-master/docs/pages/home.vue +269 -0
- package/v-track-master/v-track-master/docs/pages/started.vue +151 -0
- package/v-track-master/v-track-master/docs/pages/track-view.vue +234 -0
- package/v-track-master/v-track-master/docs/tracks/action.js +37 -0
- package/v-track-master/v-track-master/docs/tracks/events.js +140 -0
- package/v-track-master/v-track-master/docs/tracks/index.js +13 -0
- package/v-track-master/v-track-master/docs/utils/date.js +219 -0
- package/v-track-master/v-track-master/docs/utils/dom.js +26 -0
- package/v-track-master/v-track-master/jest.config.js +18 -0
- package/v-track-master/v-track-master/package.json +67 -0
- package/v-track-master/v-track-master/postcss.config.js +5 -0
- package/v-track-master/v-track-master/public/favicon.ico +0 -0
- package/v-track-master/v-track-master/public/index.html +18 -0
- package/v-track-master/v-track-master/src/hooks/index.js +217 -0
- package/v-track-master/v-track-master/src/index.js +79 -0
- package/v-track-master/v-track-master/src/utils/debug.js +13 -0
- package/v-track-master/v-track-master/src/utils/dom.js +73 -0
- package/v-track-master/v-track-master/src/utils/helper.js +122 -0
- package/v-track-master/v-track-master/src/utils/vis-monitor.js +183 -0
- package/v-track-master/v-track-master/tests/helper.js +37 -0
- package/v-track-master/v-track-master/tests/unit/.eslintrc.js +5 -0
- package/v-track-master/v-track-master/tests/unit/track-click-async.spec.js +52 -0
- package/v-track-master/v-track-master/tests/unit/track-click-delay.spec.js +46 -0
- package/v-track-master/v-track-master/tests/unit/track-click-native.spec.js +84 -0
- package/v-track-master/v-track-master/tests/unit/track-click-param.spec.js +55 -0
- package/v-track-master/v-track-master/tests/unit/track-click.spec.js +47 -0
- package/v-track-master/v-track-master/tests/unit/track-custom-event-async.spec.js +61 -0
- package/v-track-master/v-track-master/tests/unit/track-custom-event-delay.spec.js +59 -0
- package/v-track-master/v-track-master/tests/unit/track-custom-event-param.spec.js +68 -0
- package/v-track-master/v-track-master/tests/unit/track-custom-event.spec.js +55 -0
- package/v-track-master/v-track-master/tests/unit/track-show-custom-scroll-once.spec.js +62 -0
- package/v-track-master/v-track-master/tests/unit/track-show-custom-scroll.spec.js +62 -0
- package/v-track-master/v-track-master/tests/unit/track-show-once.spec.js +55 -0
- package/v-track-master/v-track-master/tests/unit/track-show-param.spec.js +51 -0
- package/v-track-master/v-track-master/tests/unit/track-show.spec.js +55 -0
- package/v-track-master/v-track-master/tests/unit/track-view-vif.spec.js +54 -0
- package/v-track-master/v-track-master/tests/unit/track-view-watch-delay.spec.js +63 -0
- package/v-track-master/v-track-master/tests/unit/track-view-watch.spec.js +61 -0
- package/v-track-master/v-track-master/tests/unit/track-view.spec.js +32 -0
- package/v-track-master/v-track-master/vue.config.js +45 -0
- package/v-track-master/v-track-master/yarn.lock +10186 -0
- package/vv.txt +10442 -0
|
@@ -0,0 +1,349 @@
|
|
|
1
|
+
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
|
2
|
+
|
|
3
|
+
/* Document
|
|
4
|
+
========================================================================== */
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* 1. Correct the line height in all browsers.
|
|
8
|
+
* 2. Prevent adjustments of font size after orientation changes in iOS.
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
html {
|
|
12
|
+
line-height: 1.15; /* 1 */
|
|
13
|
+
-webkit-text-size-adjust: 100%; /* 2 */
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
/* Sections
|
|
17
|
+
========================================================================== */
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* Remove the margin in all browsers.
|
|
21
|
+
*/
|
|
22
|
+
|
|
23
|
+
body {
|
|
24
|
+
margin: 0;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Render the `main` element consistently in IE.
|
|
29
|
+
*/
|
|
30
|
+
|
|
31
|
+
main {
|
|
32
|
+
display: block;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
/**
|
|
36
|
+
* Correct the font size and margin on `h1` elements within `section` and
|
|
37
|
+
* `article` contexts in Chrome, Firefox, and Safari.
|
|
38
|
+
*/
|
|
39
|
+
|
|
40
|
+
h1 {
|
|
41
|
+
font-size: 2em;
|
|
42
|
+
margin: 0.67em 0;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/* Grouping content
|
|
46
|
+
========================================================================== */
|
|
47
|
+
|
|
48
|
+
/**
|
|
49
|
+
* 1. Add the correct box sizing in Firefox.
|
|
50
|
+
* 2. Show the overflow in Edge and IE.
|
|
51
|
+
*/
|
|
52
|
+
|
|
53
|
+
hr {
|
|
54
|
+
box-sizing: content-box; /* 1 */
|
|
55
|
+
height: 0; /* 1 */
|
|
56
|
+
overflow: visible; /* 2 */
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
/**
|
|
60
|
+
* 1. Correct the inheritance and scaling of font size in all browsers.
|
|
61
|
+
* 2. Correct the odd `em` font sizing in all browsers.
|
|
62
|
+
*/
|
|
63
|
+
|
|
64
|
+
pre {
|
|
65
|
+
font-family: monospace, monospace; /* 1 */
|
|
66
|
+
font-size: 1em; /* 2 */
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
/* Text-level semantics
|
|
70
|
+
========================================================================== */
|
|
71
|
+
|
|
72
|
+
/**
|
|
73
|
+
* Remove the gray background on active links in IE 10.
|
|
74
|
+
*/
|
|
75
|
+
|
|
76
|
+
a {
|
|
77
|
+
background-color: transparent;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
/**
|
|
81
|
+
* 1. Remove the bottom border in Chrome 57-
|
|
82
|
+
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
|
83
|
+
*/
|
|
84
|
+
|
|
85
|
+
abbr[title] {
|
|
86
|
+
border-bottom: none; /* 1 */
|
|
87
|
+
text-decoration: underline; /* 2 */
|
|
88
|
+
text-decoration: underline dotted; /* 2 */
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Add the correct font weight in Chrome, Edge, and Safari.
|
|
93
|
+
*/
|
|
94
|
+
|
|
95
|
+
b,
|
|
96
|
+
strong {
|
|
97
|
+
font-weight: bolder;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
/**
|
|
101
|
+
* 1. Correct the inheritance and scaling of font size in all browsers.
|
|
102
|
+
* 2. Correct the odd `em` font sizing in all browsers.
|
|
103
|
+
*/
|
|
104
|
+
|
|
105
|
+
code,
|
|
106
|
+
kbd,
|
|
107
|
+
samp {
|
|
108
|
+
font-family: monospace, monospace; /* 1 */
|
|
109
|
+
font-size: 1em; /* 2 */
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
/**
|
|
113
|
+
* Add the correct font size in all browsers.
|
|
114
|
+
*/
|
|
115
|
+
|
|
116
|
+
small {
|
|
117
|
+
font-size: 80%;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* Prevent `sub` and `sup` elements from affecting the line height in
|
|
122
|
+
* all browsers.
|
|
123
|
+
*/
|
|
124
|
+
|
|
125
|
+
sub,
|
|
126
|
+
sup {
|
|
127
|
+
font-size: 75%;
|
|
128
|
+
line-height: 0;
|
|
129
|
+
position: relative;
|
|
130
|
+
vertical-align: baseline;
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
sub {
|
|
134
|
+
bottom: -0.25em;
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
sup {
|
|
138
|
+
top: -0.5em;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
/* Embedded content
|
|
142
|
+
========================================================================== */
|
|
143
|
+
|
|
144
|
+
/**
|
|
145
|
+
* Remove the border on images inside links in IE 10.
|
|
146
|
+
*/
|
|
147
|
+
|
|
148
|
+
img {
|
|
149
|
+
border-style: none;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
/* Forms
|
|
153
|
+
========================================================================== */
|
|
154
|
+
|
|
155
|
+
/**
|
|
156
|
+
* 1. Change the font styles in all browsers.
|
|
157
|
+
* 2. Remove the margin in Firefox and Safari.
|
|
158
|
+
*/
|
|
159
|
+
|
|
160
|
+
button,
|
|
161
|
+
input,
|
|
162
|
+
optgroup,
|
|
163
|
+
select,
|
|
164
|
+
textarea {
|
|
165
|
+
font-family: inherit; /* 1 */
|
|
166
|
+
font-size: 100%; /* 1 */
|
|
167
|
+
line-height: 1.15; /* 1 */
|
|
168
|
+
margin: 0; /* 2 */
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
/**
|
|
172
|
+
* Show the overflow in IE.
|
|
173
|
+
* 1. Show the overflow in Edge.
|
|
174
|
+
*/
|
|
175
|
+
|
|
176
|
+
button,
|
|
177
|
+
input { /* 1 */
|
|
178
|
+
overflow: visible;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
/**
|
|
182
|
+
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
|
183
|
+
* 1. Remove the inheritance of text transform in Firefox.
|
|
184
|
+
*/
|
|
185
|
+
|
|
186
|
+
button,
|
|
187
|
+
select { /* 1 */
|
|
188
|
+
text-transform: none;
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
/**
|
|
192
|
+
* Correct the inability to style clickable types in iOS and Safari.
|
|
193
|
+
*/
|
|
194
|
+
|
|
195
|
+
button,
|
|
196
|
+
[type="button"],
|
|
197
|
+
[type="reset"],
|
|
198
|
+
[type="submit"] {
|
|
199
|
+
-webkit-appearance: button;
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
/**
|
|
203
|
+
* Remove the inner border and padding in Firefox.
|
|
204
|
+
*/
|
|
205
|
+
|
|
206
|
+
button::-moz-focus-inner,
|
|
207
|
+
[type="button"]::-moz-focus-inner,
|
|
208
|
+
[type="reset"]::-moz-focus-inner,
|
|
209
|
+
[type="submit"]::-moz-focus-inner {
|
|
210
|
+
border-style: none;
|
|
211
|
+
padding: 0;
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
/**
|
|
215
|
+
* Restore the focus styles unset by the previous rule.
|
|
216
|
+
*/
|
|
217
|
+
|
|
218
|
+
button:-moz-focusring,
|
|
219
|
+
[type="button"]:-moz-focusring,
|
|
220
|
+
[type="reset"]:-moz-focusring,
|
|
221
|
+
[type="submit"]:-moz-focusring {
|
|
222
|
+
outline: 1px dotted ButtonText;
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
/**
|
|
226
|
+
* Correct the padding in Firefox.
|
|
227
|
+
*/
|
|
228
|
+
|
|
229
|
+
fieldset {
|
|
230
|
+
padding: 0.35em 0.75em 0.625em;
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
/**
|
|
234
|
+
* 1. Correct the text wrapping in Edge and IE.
|
|
235
|
+
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
|
236
|
+
* 3. Remove the padding so developers are not caught out when they zero out
|
|
237
|
+
* `fieldset` elements in all browsers.
|
|
238
|
+
*/
|
|
239
|
+
|
|
240
|
+
legend {
|
|
241
|
+
box-sizing: border-box; /* 1 */
|
|
242
|
+
color: inherit; /* 2 */
|
|
243
|
+
display: table; /* 1 */
|
|
244
|
+
max-width: 100%; /* 1 */
|
|
245
|
+
padding: 0; /* 3 */
|
|
246
|
+
white-space: normal; /* 1 */
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
/**
|
|
250
|
+
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
|
251
|
+
*/
|
|
252
|
+
|
|
253
|
+
progress {
|
|
254
|
+
vertical-align: baseline;
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
/**
|
|
258
|
+
* Remove the default vertical scrollbar in IE 10+.
|
|
259
|
+
*/
|
|
260
|
+
|
|
261
|
+
textarea {
|
|
262
|
+
overflow: auto;
|
|
263
|
+
}
|
|
264
|
+
|
|
265
|
+
/**
|
|
266
|
+
* 1. Add the correct box sizing in IE 10.
|
|
267
|
+
* 2. Remove the padding in IE 10.
|
|
268
|
+
*/
|
|
269
|
+
|
|
270
|
+
[type="checkbox"],
|
|
271
|
+
[type="radio"] {
|
|
272
|
+
box-sizing: border-box; /* 1 */
|
|
273
|
+
padding: 0; /* 2 */
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
/**
|
|
277
|
+
* Correct the cursor style of increment and decrement buttons in Chrome.
|
|
278
|
+
*/
|
|
279
|
+
|
|
280
|
+
[type="number"]::-webkit-inner-spin-button,
|
|
281
|
+
[type="number"]::-webkit-outer-spin-button {
|
|
282
|
+
height: auto;
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
/**
|
|
286
|
+
* 1. Correct the odd appearance in Chrome and Safari.
|
|
287
|
+
* 2. Correct the outline style in Safari.
|
|
288
|
+
*/
|
|
289
|
+
|
|
290
|
+
[type="search"] {
|
|
291
|
+
-webkit-appearance: textfield; /* 1 */
|
|
292
|
+
outline-offset: -2px; /* 2 */
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
/**
|
|
296
|
+
* Remove the inner padding in Chrome and Safari on macOS.
|
|
297
|
+
*/
|
|
298
|
+
|
|
299
|
+
[type="search"]::-webkit-search-decoration {
|
|
300
|
+
-webkit-appearance: none;
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
/**
|
|
304
|
+
* 1. Correct the inability to style clickable types in iOS and Safari.
|
|
305
|
+
* 2. Change font properties to `inherit` in Safari.
|
|
306
|
+
*/
|
|
307
|
+
|
|
308
|
+
::-webkit-file-upload-button {
|
|
309
|
+
-webkit-appearance: button; /* 1 */
|
|
310
|
+
font: inherit; /* 2 */
|
|
311
|
+
}
|
|
312
|
+
|
|
313
|
+
/* Interactive
|
|
314
|
+
========================================================================== */
|
|
315
|
+
|
|
316
|
+
/*
|
|
317
|
+
* Add the correct display in Edge, IE 10+, and Firefox.
|
|
318
|
+
*/
|
|
319
|
+
|
|
320
|
+
details {
|
|
321
|
+
display: block;
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
/*
|
|
325
|
+
* Add the correct display in all browsers.
|
|
326
|
+
*/
|
|
327
|
+
|
|
328
|
+
summary {
|
|
329
|
+
display: list-item;
|
|
330
|
+
}
|
|
331
|
+
|
|
332
|
+
/* Misc
|
|
333
|
+
========================================================================== */
|
|
334
|
+
|
|
335
|
+
/**
|
|
336
|
+
* Add the correct display in IE 10+.
|
|
337
|
+
*/
|
|
338
|
+
|
|
339
|
+
template {
|
|
340
|
+
display: none;
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
/**
|
|
344
|
+
* Add the correct display in IE 10.
|
|
345
|
+
*/
|
|
346
|
+
|
|
347
|
+
[hidden] {
|
|
348
|
+
display: none;
|
|
349
|
+
}
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="code-snippet">
|
|
3
|
+
<div class="language">{{ lang }}</div>
|
|
4
|
+
<div class="line-numbers">
|
|
5
|
+
<div class="line-number" v-for="n in lineCount" :key="n">{{ n }}</div>
|
|
6
|
+
</div>
|
|
7
|
+
<div class="render" v-html="result"></div>
|
|
8
|
+
</div>
|
|
9
|
+
</template>
|
|
10
|
+
|
|
11
|
+
<script>
|
|
12
|
+
import hljs from "highlight.js";
|
|
13
|
+
export default {
|
|
14
|
+
name: "code-snippet",
|
|
15
|
+
props: {
|
|
16
|
+
code: String,
|
|
17
|
+
lang: String
|
|
18
|
+
},
|
|
19
|
+
computed: {
|
|
20
|
+
result() {
|
|
21
|
+
const highlighted = hljs.highlight(this.lang, this.code.trim());
|
|
22
|
+
return highlighted.value;
|
|
23
|
+
},
|
|
24
|
+
lineCount() {
|
|
25
|
+
const str = this.result;
|
|
26
|
+
let length = 0;
|
|
27
|
+
for (var i = 0; i < str.length; ++i) {
|
|
28
|
+
if (str[i] === "\n") {
|
|
29
|
+
length++;
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
return length + 1;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
</script>
|
|
37
|
+
|
|
38
|
+
<style lang="scss">
|
|
39
|
+
.code-snippet {
|
|
40
|
+
@include h-box;
|
|
41
|
+
background: #2e3440;
|
|
42
|
+
border-radius: 3px;
|
|
43
|
+
font-family: "Roboto Mono", monospace;
|
|
44
|
+
font-size: 10pt;
|
|
45
|
+
overflow: auto;
|
|
46
|
+
position: relative;
|
|
47
|
+
.line-numbers,
|
|
48
|
+
.render {
|
|
49
|
+
color: #d8dee9;
|
|
50
|
+
padding: 20px;
|
|
51
|
+
padding-right: 0;
|
|
52
|
+
}
|
|
53
|
+
.line-numbers {
|
|
54
|
+
background: #2e3440;
|
|
55
|
+
color: $md-grey-400;
|
|
56
|
+
border-radius: 2px 0 0 2px;
|
|
57
|
+
line-height: 18px;
|
|
58
|
+
}
|
|
59
|
+
.render {
|
|
60
|
+
white-space: pre;
|
|
61
|
+
line-height: 18px;
|
|
62
|
+
}
|
|
63
|
+
.language {
|
|
64
|
+
position: absolute;
|
|
65
|
+
top: 0;
|
|
66
|
+
right: 0;
|
|
67
|
+
color: $md-grey-400;
|
|
68
|
+
padding: 4px 4px 6px 6px;
|
|
69
|
+
border-radius: 0 0 0 2px;
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
</style>
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
|
2
|
+
|
|
3
|
+
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
|
|
4
|
+
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}body{background:#fff;margin:0;font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}header{background:#40b883;padding:32px;padding-bottom:8px}header .description,header nav{text-align:center}header .description{color:#fff;margin-top:15px}section .section-content{margin:0 42px;padding:64px 0;-webkit-box-sizing:border-box;box-sizing:border-box}section .section-content.small{padding:32px 0}section .section-content.mini{padding:16px 0}section .section-content.large{padding:152px 0}section.nav{text-align:center;background:#40b883;padding:24px;padding-bottom:35px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}section.nav>*{-webkit-box-flex:1;-ms-flex:auto 0 0px;flex:auto 0 0}section.nav a{display:inline-block;padding:8px 16px;color:#fff;background:#62c99b;border-radius:3px}section.nav a:hover{background:#88d6b4}section.nav a:not(:last-child){margin-right:8px}.collapse .section-content{padding:12px 0 64px 0}h1{color:#fff;text-align:center;margin:0 0 32px}a{color:#40b883;text-decoration:none;cursor:pointer}a:hover{color:#62c99b}.command{background:#339268;color:#fff;font-family:monospace;max-width:500px;margin:20px auto;border-radius:2px;padding:12px 24px;-webkit-box-sizing:border-box;box-sizing:border-box}.command,.plus{text-align:center}.plus{color:#40b883;font-size:32px;margin:12px}.demo,.snippets{max-width:1200px;margin:auto}.snippet+.snippet{margin-top:20px}.snippet:last-child{margin-bottom:39px}.snippets{border-radius:0 0 3px 3px}.demo,.snippets{background:#f9f9f9}.demo{margin-top:42px;border-radius:3px 3px 0 0;overflow:hidden}.demo .section-content{text-align:center;max-width:560px;margin:auto}.demo.viewport{height:364px;overflow:auto}.demo.viewport .section-content.large{padding:375px 0}.footer{font-size:14px;text-align:center;background:#e7f7f0}.track-button{width:229px;height:39px;background:#40b883;border-radius:5px;color:#fff;line-height:39px;margin:auto;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.track-button:hover{background:#50c28f}.track-button:active{background:#39a576}.v-track-table .header,.v-track-table .row{display:-webkit-box;display:-ms-flexbox;display:flex}.v-track-table .header span,.v-track-table .header strong,.v-track-table .row span,.v-track-table .row strong{-webkit-box-flex:1;-ms-flex:1;flex:1;line-height:29px;border-bottom:1px solid #ebeef5}.v-track-table .row:hover{background:#fafafa;cursor:pointer}.notification__large{width:399px}.notification__large .el-notification__group{width:100%}.message-offset{top:88px}.section-content.collapse-wrapper{padding:20px;margin:20px auto;background:#fff;max-width:690px;text-align:left;-webkit-box-shadow:0 2px 4px rgba(232,237,250,.9);box-shadow:0 2px 4px rgba(232,237,250,.9)}.code-snippet{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;background:#2e3440;border-radius:3px;font-family:Roboto Mono,monospace;font-size:10pt;overflow:auto;position:relative}.code-snippet>*{-webkit-box-flex:1;-ms-flex:auto 0 0px;flex:auto 0 0}.code-snippet .line-numbers,.code-snippet .render{color:#d8dee9;padding:20px;padding-right:0}.code-snippet .line-numbers{background:#2e3440;color:#bdbdbd;border-radius:2px 0 0 2px;line-height:18px}.code-snippet .render{white-space:pre;line-height:18px}.code-snippet .language{position:absolute;top:0;right:0;color:#bdbdbd;padding:4px 4px 6px 6px;border-radius:0 0 0 2px}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.el-notification{display:-webkit-box;display:-ms-flexbox;display:flex;width:330px;padding:14px 26px 14px 13px;border-radius:8px;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #ebeef5;position:fixed;background-color:#fff;-webkit-box-shadow:0 2px 12px 0 rgba(0,0,0,.1);box-shadow:0 2px 12px 0 rgba(0,0,0,.1);-webkit-transition:opacity .3s,left .3s,right .3s,top .4s,bottom .3s,-webkit-transform .3s;transition:opacity .3s,left .3s,right .3s,top .4s,bottom .3s,-webkit-transform .3s;transition:opacity .3s,transform .3s,left .3s,right .3s,top .4s,bottom .3s;transition:opacity .3s,transform .3s,left .3s,right .3s,top .4s,bottom .3s,-webkit-transform .3s;overflow:hidden}.el-notification.right{right:16px}.el-notification.left{left:16px}.el-notification__group{margin-left:13px;margin-right:8px}.el-notification__title{font-weight:700;font-size:16px;color:#303133;margin:0}.el-notification__content{font-size:14px;line-height:21px;margin:6px 0 0;color:#606266;text-align:justify}.el-notification__content p{margin:0}.el-notification__icon{height:24px;width:24px;font-size:24px}.el-notification__closeBtn{position:absolute;top:18px;right:15px;cursor:pointer;color:#909399;font-size:16px}.el-notification__closeBtn:hover{color:#606266}.el-notification .el-icon-success{color:#67c23a}.el-notification .el-icon-error{color:#f56c6c}.el-notification .el-icon-info{color:#909399}.el-notification .el-icon-warning{color:#e6a23c}.el-notification-fade-enter.right{right:0;-webkit-transform:translateX(100%);transform:translateX(100%)}.el-notification-fade-enter.left{left:0;-webkit-transform:translateX(-100%);transform:translateX(-100%)}.el-notification-fade-leave-active{opacity:0}@font-face{font-family:element-icons;src:url(../fonts/element-icons.535877f5.woff) format("woff"),url(../fonts/element-icons.732389de.ttf) format("truetype");font-weight:400;font-style:normal}[class*=" el-icon-"],[class^=el-icon-]{font-family:element-icons!important;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;vertical-align:baseline;display:inline-block;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.el-icon-ice-cream-round:before{content:"\E6A0"}.el-icon-ice-cream-square:before{content:"\E6A3"}.el-icon-lollipop:before{content:"\E6A4"}.el-icon-potato-strips:before{content:"\E6A5"}.el-icon-milk-tea:before{content:"\E6A6"}.el-icon-ice-drink:before{content:"\E6A7"}.el-icon-ice-tea:before{content:"\E6A9"}.el-icon-coffee:before{content:"\E6AA"}.el-icon-orange:before{content:"\E6AB"}.el-icon-pear:before{content:"\E6AC"}.el-icon-apple:before{content:"\E6AD"}.el-icon-cherry:before{content:"\E6AE"}.el-icon-watermelon:before{content:"\E6AF"}.el-icon-grape:before{content:"\E6B0"}.el-icon-refrigerator:before{content:"\E6B1"}.el-icon-goblet-square-full:before{content:"\E6B2"}.el-icon-goblet-square:before{content:"\E6B3"}.el-icon-goblet-full:before{content:"\E6B4"}.el-icon-goblet:before{content:"\E6B5"}.el-icon-cold-drink:before{content:"\E6B6"}.el-icon-coffee-cup:before{content:"\E6B8"}.el-icon-water-cup:before{content:"\E6B9"}.el-icon-hot-water:before{content:"\E6BA"}.el-icon-ice-cream:before{content:"\E6BB"}.el-icon-dessert:before{content:"\E6BC"}.el-icon-sugar:before{content:"\E6BD"}.el-icon-tableware:before{content:"\E6BE"}.el-icon-burger:before{content:"\E6BF"}.el-icon-knife-fork:before{content:"\E6C1"}.el-icon-fork-spoon:before{content:"\E6C2"}.el-icon-chicken:before{content:"\E6C3"}.el-icon-food:before{content:"\E6C4"}.el-icon-dish-1:before{content:"\E6C5"}.el-icon-dish:before{content:"\E6C6"}.el-icon-moon-night:before{content:"\E6EE"}.el-icon-moon:before{content:"\E6F0"}.el-icon-cloudy-and-sunny:before{content:"\E6F1"}.el-icon-partly-cloudy:before{content:"\E6F2"}.el-icon-cloudy:before{content:"\E6F3"}.el-icon-sunny:before{content:"\E6F6"}.el-icon-sunset:before{content:"\E6F7"}.el-icon-sunrise-1:before{content:"\E6F8"}.el-icon-sunrise:before{content:"\E6F9"}.el-icon-heavy-rain:before{content:"\E6FA"}.el-icon-lightning:before{content:"\E6FB"}.el-icon-light-rain:before{content:"\E6FC"}.el-icon-wind-power:before{content:"\E6FD"}.el-icon-baseball:before{content:"\E712"}.el-icon-soccer:before{content:"\E713"}.el-icon-football:before{content:"\E715"}.el-icon-basketball:before{content:"\E716"}.el-icon-ship:before{content:"\E73F"}.el-icon-truck:before{content:"\E740"}.el-icon-bicycle:before{content:"\E741"}.el-icon-mobile-phone:before{content:"\E6D3"}.el-icon-service:before{content:"\E6D4"}.el-icon-key:before{content:"\E6E2"}.el-icon-unlock:before{content:"\E6E4"}.el-icon-lock:before{content:"\E6E5"}.el-icon-watch:before{content:"\E6FE"}.el-icon-watch-1:before{content:"\E6FF"}.el-icon-timer:before{content:"\E702"}.el-icon-alarm-clock:before{content:"\E703"}.el-icon-map-location:before{content:"\E704"}.el-icon-delete-location:before{content:"\E705"}.el-icon-add-location:before{content:"\E706"}.el-icon-location-information:before{content:"\E707"}.el-icon-location-outline:before{content:"\E708"}.el-icon-location:before{content:"\E79E"}.el-icon-place:before{content:"\E709"}.el-icon-discover:before{content:"\E70A"}.el-icon-first-aid-kit:before{content:"\E70B"}.el-icon-trophy-1:before{content:"\E70C"}.el-icon-trophy:before{content:"\E70D"}.el-icon-medal:before{content:"\E70E"}.el-icon-medal-1:before{content:"\E70F"}.el-icon-stopwatch:before{content:"\E710"}.el-icon-mic:before{content:"\E711"}.el-icon-copy-document:before{content:"\E718"}.el-icon-full-screen:before{content:"\E719"}.el-icon-switch-button:before{content:"\E71B"}.el-icon-aim:before{content:"\E71C"}.el-icon-crop:before{content:"\E71D"}.el-icon-odometer:before{content:"\E71E"}.el-icon-time:before{content:"\E71F"}.el-icon-bangzhu:before{content:"\E724"}.el-icon-close-notification:before{content:"\E726"}.el-icon-microphone:before{content:"\E727"}.el-icon-turn-off-microphone:before{content:"\E728"}.el-icon-position:before{content:"\E729"}.el-icon-postcard:before{content:"\E72A"}.el-icon-message:before{content:"\E72B"}.el-icon-chat-line-square:before{content:"\E72D"}.el-icon-chat-dot-square:before{content:"\E72E"}.el-icon-chat-dot-round:before{content:"\E72F"}.el-icon-chat-square:before{content:"\E730"}.el-icon-chat-line-round:before{content:"\E731"}.el-icon-chat-round:before{content:"\E732"}.el-icon-set-up:before{content:"\E733"}.el-icon-turn-off:before{content:"\E734"}.el-icon-open:before{content:"\E735"}.el-icon-connection:before{content:"\E736"}.el-icon-link:before{content:"\E737"}.el-icon-cpu:before{content:"\E738"}.el-icon-thumb:before{content:"\E739"}.el-icon-female:before{content:"\E73A"}.el-icon-male:before{content:"\E73B"}.el-icon-guide:before{content:"\E73C"}.el-icon-news:before{content:"\E73E"}.el-icon-price-tag:before{content:"\E744"}.el-icon-discount:before{content:"\E745"}.el-icon-wallet:before{content:"\E747"}.el-icon-coin:before{content:"\E748"}.el-icon-money:before{content:"\E749"}.el-icon-bank-card:before{content:"\E74A"}.el-icon-box:before{content:"\E74B"}.el-icon-present:before{content:"\E74C"}.el-icon-sell:before{content:"\E6D5"}.el-icon-sold-out:before{content:"\E6D6"}.el-icon-shopping-bag-2:before{content:"\E74D"}.el-icon-shopping-bag-1:before{content:"\E74E"}.el-icon-shopping-cart-2:before{content:"\E74F"}.el-icon-shopping-cart-1:before{content:"\E750"}.el-icon-shopping-cart-full:before{content:"\E751"}.el-icon-smoking:before{content:"\E752"}.el-icon-no-smoking:before{content:"\E753"}.el-icon-house:before{content:"\E754"}.el-icon-table-lamp:before{content:"\E755"}.el-icon-school:before{content:"\E756"}.el-icon-office-building:before{content:"\E757"}.el-icon-toilet-paper:before{content:"\E758"}.el-icon-notebook-2:before{content:"\E759"}.el-icon-notebook-1:before{content:"\E75A"}.el-icon-files:before{content:"\E75B"}.el-icon-collection:before{content:"\E75C"}.el-icon-receiving:before{content:"\E75D"}.el-icon-suitcase-1:before{content:"\E760"}.el-icon-suitcase:before{content:"\E761"}.el-icon-film:before{content:"\E763"}.el-icon-collection-tag:before{content:"\E765"}.el-icon-data-analysis:before{content:"\E766"}.el-icon-pie-chart:before{content:"\E767"}.el-icon-data-board:before{content:"\E768"}.el-icon-data-line:before{content:"\E76D"}.el-icon-reading:before{content:"\E769"}.el-icon-magic-stick:before{content:"\E76A"}.el-icon-coordinate:before{content:"\E76B"}.el-icon-mouse:before{content:"\E76C"}.el-icon-brush:before{content:"\E76E"}.el-icon-headset:before{content:"\E76F"}.el-icon-umbrella:before{content:"\E770"}.el-icon-scissors:before{content:"\E771"}.el-icon-mobile:before{content:"\E773"}.el-icon-attract:before{content:"\E774"}.el-icon-monitor:before{content:"\E775"}.el-icon-search:before{content:"\E778"}.el-icon-takeaway-box:before{content:"\E77A"}.el-icon-paperclip:before{content:"\E77D"}.el-icon-printer:before{content:"\E77E"}.el-icon-document-add:before{content:"\E782"}.el-icon-document:before{content:"\E785"}.el-icon-document-checked:before{content:"\E786"}.el-icon-document-copy:before{content:"\E787"}.el-icon-document-delete:before{content:"\E788"}.el-icon-document-remove:before{content:"\E789"}.el-icon-tickets:before{content:"\E78B"}.el-icon-folder-checked:before{content:"\E77F"}.el-icon-folder-delete:before{content:"\E780"}.el-icon-folder-remove:before{content:"\E781"}.el-icon-folder-add:before{content:"\E783"}.el-icon-folder-opened:before{content:"\E784"}.el-icon-folder:before{content:"\E78A"}.el-icon-edit-outline:before{content:"\E764"}.el-icon-edit:before{content:"\E78C"}.el-icon-date:before{content:"\E78E"}.el-icon-c-scale-to-original:before{content:"\E7C6"}.el-icon-view:before{content:"\E6CE"}.el-icon-loading:before{content:"\E6CF"}.el-icon-rank:before{content:"\E6D1"}.el-icon-sort-down:before{content:"\E7C4"}.el-icon-sort-up:before{content:"\E7C5"}.el-icon-sort:before{content:"\E6D2"}.el-icon-finished:before{content:"\E6CD"}.el-icon-refresh-left:before{content:"\E6C7"}.el-icon-refresh-right:before{content:"\E6C8"}.el-icon-refresh:before{content:"\E6D0"}.el-icon-video-play:before{content:"\E7C0"}.el-icon-video-pause:before{content:"\E7C1"}.el-icon-d-arrow-right:before{content:"\E6DC"}.el-icon-d-arrow-left:before{content:"\E6DD"}.el-icon-arrow-up:before{content:"\E6E1"}.el-icon-arrow-down:before{content:"\E6DF"}.el-icon-arrow-right:before{content:"\E6E0"}.el-icon-arrow-left:before{content:"\E6DE"}.el-icon-top-right:before{content:"\E6E7"}.el-icon-top-left:before{content:"\E6E8"}.el-icon-top:before{content:"\E6E6"}.el-icon-bottom:before{content:"\E6EB"}.el-icon-right:before{content:"\E6E9"}.el-icon-back:before{content:"\E6EA"}.el-icon-bottom-right:before{content:"\E6EC"}.el-icon-bottom-left:before{content:"\E6ED"}.el-icon-caret-top:before{content:"\E78F"}.el-icon-caret-bottom:before{content:"\E790"}.el-icon-caret-right:before{content:"\E791"}.el-icon-caret-left:before{content:"\E792"}.el-icon-d-caret:before{content:"\E79A"}.el-icon-share:before{content:"\E793"}.el-icon-menu:before{content:"\E798"}.el-icon-s-grid:before{content:"\E7A6"}.el-icon-s-check:before{content:"\E7A7"}.el-icon-s-data:before{content:"\E7A8"}.el-icon-s-opportunity:before{content:"\E7AA"}.el-icon-s-custom:before{content:"\E7AB"}.el-icon-s-claim:before{content:"\E7AD"}.el-icon-s-finance:before{content:"\E7AE"}.el-icon-s-comment:before{content:"\E7AF"}.el-icon-s-flag:before{content:"\E7B0"}.el-icon-s-marketing:before{content:"\E7B1"}.el-icon-s-shop:before{content:"\E7B4"}.el-icon-s-open:before{content:"\E7B5"}.el-icon-s-management:before{content:"\E7B6"}.el-icon-s-ticket:before{content:"\E7B7"}.el-icon-s-release:before{content:"\E7B8"}.el-icon-s-home:before{content:"\E7B9"}.el-icon-s-promotion:before{content:"\E7BA"}.el-icon-s-operation:before{content:"\E7BB"}.el-icon-s-unfold:before{content:"\E7BC"}.el-icon-s-fold:before{content:"\E7A9"}.el-icon-s-platform:before{content:"\E7BD"}.el-icon-s-order:before{content:"\E7BE"}.el-icon-s-cooperation:before{content:"\E7BF"}.el-icon-bell:before{content:"\E725"}.el-icon-message-solid:before{content:"\E799"}.el-icon-video-camera:before{content:"\E772"}.el-icon-video-camera-solid:before{content:"\E796"}.el-icon-camera:before{content:"\E779"}.el-icon-camera-solid:before{content:"\E79B"}.el-icon-download:before{content:"\E77C"}.el-icon-upload2:before{content:"\E77B"}.el-icon-upload:before{content:"\E7C3"}.el-icon-picture-outline-round:before{content:"\E75F"}.el-icon-picture-outline:before{content:"\E75E"}.el-icon-picture:before{content:"\E79F"}.el-icon-close:before{content:"\E6DB"}.el-icon-check:before{content:"\E6DA"}.el-icon-plus:before{content:"\E6D9"}.el-icon-minus:before{content:"\E6D8"}.el-icon-help:before{content:"\E73D"}.el-icon-s-help:before{content:"\E7B3"}.el-icon-circle-close:before{content:"\E78D"}.el-icon-circle-check:before{content:"\E720"}.el-icon-circle-plus-outline:before{content:"\E723"}.el-icon-remove-outline:before{content:"\E722"}.el-icon-zoom-out:before{content:"\E776"}.el-icon-zoom-in:before{content:"\E777"}.el-icon-error:before{content:"\E79D"}.el-icon-success:before{content:"\E79C"}.el-icon-circle-plus:before{content:"\E7A0"}.el-icon-remove:before{content:"\E7A2"}.el-icon-info:before{content:"\E7A1"}.el-icon-question:before{content:"\E7A4"}.el-icon-warning-outline:before{content:"\E6C9"}.el-icon-warning:before{content:"\E7A3"}.el-icon-goods:before{content:"\E7C2"}.el-icon-s-goods:before{content:"\E7B2"}.el-icon-star-off:before{content:"\E717"}.el-icon-star-on:before{content:"\E797"}.el-icon-more-outline:before{content:"\E6CC"}.el-icon-more:before{content:"\E794"}.el-icon-phone-outline:before{content:"\E6CB"}.el-icon-phone:before{content:"\E795"}.el-icon-user:before{content:"\E6E3"}.el-icon-user-solid:before{content:"\E7A5"}.el-icon-setting:before{content:"\E6CA"}.el-icon-s-tools:before{content:"\E7AC"}.el-icon-delete:before{content:"\E6D7"}.el-icon-delete-solid:before{content:"\E7C9"}.el-icon-eleme:before{content:"\E7C7"}.el-icon-platform-eleme:before{content:"\E7CA"}.el-icon-loading{-webkit-animation:rotating 2s linear infinite;animation:rotating 2s linear infinite}.el-icon--right{margin-left:5px}.el-icon--left{margin-right:5px}@-webkit-keyframes rotating{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotating{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.el-message__closeBtn:focus,.el-message__content:focus{outline-width:0}.el-message{min-width:380px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;border-width:1px;border-style:solid;border-color:#ebeef5;position:fixed;left:50%;top:20px;-webkit-transform:translateX(-50%);transform:translateX(-50%);background-color:#edf2fc;-webkit-transition:opacity .3s,top .4s,-webkit-transform .4s;transition:opacity .3s,top .4s,-webkit-transform .4s;transition:opacity .3s,transform .4s,top .4s;transition:opacity .3s,transform .4s,top .4s,-webkit-transform .4s;overflow:hidden;padding:15px 15px 15px 20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.el-message.is-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.el-message.is-closable .el-message__content{padding-right:16px}.el-message p{margin:0}.el-message--info .el-message__content{color:#909399}.el-message--success{background-color:#f0f9eb;border-color:#e1f3d8}.el-message--success .el-message__content{color:#67c23a}.el-message--warning{background-color:#fdf6ec;border-color:#faecd8}.el-message--warning .el-message__content{color:#e6a23c}.el-message--error{background-color:#fef0f0;border-color:#fde2e2}.el-message--error .el-message__content{color:#f56c6c}.el-message__icon{margin-right:10px}.el-message__content{padding:0;font-size:14px;line-height:1}.el-message__closeBtn{position:absolute;top:50%;right:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);cursor:pointer;color:#c0c4cc;font-size:16px}.el-message__closeBtn:hover{color:#909399}.el-message .el-icon-success{color:#67c23a}.el-message .el-icon-error{color:#f56c6c}.el-message .el-icon-info{color:#909399}.el-message .el-icon-warning{color:#e6a23c}.el-message-fade-enter,.el-message-fade-leave-active{opacity:0;-webkit-transform:translate(-50%,-100%);transform:translate(-50%,-100%)}.el-fade-in-enter,.el-fade-in-leave-active,.el-fade-in-linear-enter,.el-fade-in-linear-leave,.el-fade-in-linear-leave-active,.fade-in-linear-enter,.fade-in-linear-leave,.fade-in-linear-leave-active{opacity:0}.el-fade-in-linear-enter-active,.el-fade-in-linear-leave-active,.fade-in-linear-enter-active,.fade-in-linear-leave-active{-webkit-transition:opacity .2s linear;transition:opacity .2s linear}.el-fade-in-enter-active,.el-fade-in-leave-active,.el-zoom-in-center-enter-active,.el-zoom-in-center-leave-active{-webkit-transition:all .3s cubic-bezier(.55,0,.1,1);transition:all .3s cubic-bezier(.55,0,.1,1)}.el-zoom-in-center-enter,.el-zoom-in-center-leave-active{opacity:0;-webkit-transform:scaleX(0);transform:scaleX(0)}.el-zoom-in-top-enter-active,.el-zoom-in-top-leave-active{opacity:1;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);-webkit-transform-origin:center top;transform-origin:center top}.el-zoom-in-top-enter,.el-zoom-in-top-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.el-zoom-in-bottom-enter-active,.el-zoom-in-bottom-leave-active{opacity:1;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);-webkit-transform-origin:center bottom;transform-origin:center bottom}.el-zoom-in-bottom-enter,.el-zoom-in-bottom-leave-active{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0)}.el-zoom-in-left-enter-active,.el-zoom-in-left-leave-active{opacity:1;-webkit-transform:scale(1);transform:scale(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);-webkit-transform-origin:top left;transform-origin:top left}.el-zoom-in-left-enter,.el-zoom-in-left-leave-active{opacity:0;-webkit-transform:scale(.45);transform:scale(.45)}.collapse-transition{-webkit-transition:height .3s ease-in-out,padding-top .3s ease-in-out,padding-bottom .3s ease-in-out;transition:height .3s ease-in-out,padding-top .3s ease-in-out,padding-bottom .3s ease-in-out}.horizontal-collapse-transition{-webkit-transition:width .3s ease-in-out,padding-left .3s ease-in-out,padding-right .3s ease-in-out;transition:width .3s ease-in-out,padding-left .3s ease-in-out,padding-right .3s ease-in-out}.el-list-enter-active,.el-list-leave-active{-webkit-transition:all 1s;transition:all 1s}.el-list-enter,.el-list-leave-active{opacity:0;-webkit-transform:translateY(-30px);transform:translateY(-30px)}.el-opacity-transition{-webkit-transition:opacity .3s cubic-bezier(.55,0,.1,1);transition:opacity .3s cubic-bezier(.55,0,.1,1)}.el-collapse{border-top:1px solid #ebeef5;border-bottom:1px solid #ebeef5}.el-collapse-item.is-disabled .el-collapse-item__header{color:#bbb;cursor:not-allowed}.el-collapse-item__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:48px;line-height:48px;background-color:#fff;color:#303133;cursor:pointer;border-bottom:1px solid #ebeef5;font-size:13px;font-weight:500;-webkit-transition:border-bottom-color .3s;transition:border-bottom-color .3s;outline:0}.el-collapse-item__arrow{margin:0 8px 0 auto;-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;font-weight:300}.el-collapse-item__arrow.is-active{-webkit-transform:rotate(90deg);transform:rotate(90deg)}.el-collapse-item__header.focusing:focus:not(:hover){color:#409eff}.el-collapse-item__header.is-active{border-bottom-color:transparent}.el-collapse-item__wrap{will-change:height;background-color:#fff;overflow:hidden;-webkit-box-sizing:border-box;box-sizing:border-box;border-bottom:1px solid #ebeef5}.el-collapse-item__content{padding-bottom:25px;font-size:13px;color:#303133;line-height:1.769230769230769}.el-collapse-item:last-child{margin-bottom:-1px}.el-card{border-radius:4px;border:1px solid #ebeef5;background-color:#fff;overflow:hidden;color:#303133;-webkit-transition:.3s;transition:.3s}.el-card.is-always-shadow,.el-card.is-hover-shadow:focus,.el-card.is-hover-shadow:hover{-webkit-box-shadow:0 2px 12px 0 rgba(0,0,0,.1);box-shadow:0 2px 12px 0 rgba(0,0,0,.1)}.el-card__header{padding:18px 20px;border-bottom:1px solid #ebeef5;-webkit-box-sizing:border-box;box-sizing:border-box}.el-card__body{padding:20px}.el-alert{width:100%;padding:8px 16px;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:4px;position:relative;background-color:#fff;overflow:hidden;opacity:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .2s;transition:opacity .2s}.el-alert.is-light .el-alert__closebtn{color:#c0c4cc}.el-alert.is-dark .el-alert__closebtn,.el-alert.is-dark .el-alert__description{color:#fff}.el-alert.is-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.el-alert--success.is-light{background-color:#f0f9eb;color:#67c23a}.el-alert--success.is-light .el-alert__description{color:#67c23a}.el-alert--success.is-dark{background-color:#67c23a;color:#fff}.el-alert--info.is-light{background-color:#f4f4f5;color:#909399}.el-alert--info.is-dark{background-color:#909399;color:#fff}.el-alert--info .el-alert__description{color:#909399}.el-alert--warning.is-light{background-color:#fdf6ec;color:#e6a23c}.el-alert--warning.is-light .el-alert__description{color:#e6a23c}.el-alert--warning.is-dark{background-color:#e6a23c;color:#fff}.el-alert--error.is-light{background-color:#fef0f0;color:#f56c6c}.el-alert--error.is-light .el-alert__description{color:#f56c6c}.el-alert--error.is-dark{background-color:#f56c6c;color:#fff}.el-alert__content{display:table-cell;padding:0 8px}.el-alert__icon{font-size:16px;width:16px}.el-alert__icon.is-big{font-size:28px;width:28px}.el-alert__title{font-size:13px;line-height:18px}.el-alert__title.is-bold{font-weight:700}.el-alert .el-alert__description{font-size:12px;margin:5px 0 0}.el-alert__closebtn{font-size:12px;opacity:1;position:absolute;top:12px;right:15px;cursor:pointer}.el-alert__closebtn.is-customed{font-style:normal;font-size:13px;top:9px}.el-alert-fade-enter,.el-alert-fade-leave-active{opacity:0}
|
|
Binary file
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(function(t){function e(e){for(var a,i,c=e[0],o=e[1],l=e[2],p=0,v=[];p<c.length;p++)i=c[p],r[i]&&v.push(r[i][0]),r[i]=0;for(a in o)Object.prototype.hasOwnProperty.call(o,a)&&(t[a]=o[a]);u&&u(e);while(v.length)v.shift()();return s.push.apply(s,l||[]),n()}function n(){for(var t,e=0;e<s.length;e++){for(var n=s[e],a=!0,c=1;c<n.length;c++){var o=n[c];0!==r[o]&&(a=!1)}a&&(s.splice(e--,1),t=i(i.s=n[0]))}return t}var a={},r={app:0},s=[];function i(e){if(a[e])return a[e].exports;var n=a[e]={i:e,l:!1,exports:{}};return t[e].call(n.exports,n,n.exports,i),n.l=!0,n.exports}i.m=t,i.c=a,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},i.r=function(t){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"===typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var a in t)i.d(n,a,function(e){return t[e]}.bind(null,a));return n},i.n=function(t){var e=t&&t.__esModule?function(){return t["default"]}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="dist/";var c=window["webpackJsonp"]=window["webpackJsonp"]||[],o=c.push.bind(c);c.push=e,c=c.slice();for(var l=0;l<c.length;l++)e(c[l]);var u=o;s.push(["fc11","chunk-vendors"]),n()})({"7fbf":function(t,e,n){},abe9:function(t,e,n){"use strict";var a=n("ae88"),r=n.n(a);r.a},ae88:function(t,e,n){},d2d7:function(t,e,n){"use strict";var a=n("7fbf"),r=n.n(a);r.a},fc11:function(t,e,n){"use strict";n.r(e);n("46a1"),n("450d");var a=n("e5f2"),r=n.n(a),s=(n("0fb7"),n("f529")),i=n.n(s),c=(n("b0ee"),n("d180")),o=n.n(c),l=(n("a335"),n("c0bb")),u=n.n(l),p=(n("b8e0"),n("a4c4")),v=n.n(p),d=(n("915d"),n("e04d")),m=n.n(d),h=(n("cadf"),n("551c"),n("f751"),n("097d"),n("2b0e")),f=n("8c4f"),k=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{attrs:{id:"app"}},[t._m(0),t._v(" "),n("keep-alive",[t.$route.meta.keepAlive?n("router-view"):t._e()],1),t._v(" "),t.$route.meta.keepAlive?t._e():n("router-view"),t._v(" "),t._m(1)],1)},g=[function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("header",[n("h1",[t._v("v-track")]),t._v(" "),n("div",{staticClass:"command"},[t._v("yarn add v-track or npm add v-track --save")]),t._v(" "),n("nav",[n("a",{attrs:{href:"https://travis-ci.org/l-hammer/v-track"}},[n("img",{attrs:{alt:"Travis (.org) branch",src:"https://img.shields.io/travis/l-hammer/v-track/master.svg?logoColor=%23666666&style=flat-square"}})]),t._v(" "),n("a",{attrs:{href:"https://unpkg.com/v-track/dist/v-track.min.js"}},[n("img",{attrs:{src:"http://img.badgesize.io/https://unpkg.com/v-track/dist/v-track.min.js?compression=gzip&style=flat-square",alt:"Gzip Size"}})]),t._v(" "),n("a",{attrs:{href:"https://www.npmjs.com/package/v-track"}},[n("img",{attrs:{src:"https://img.shields.io/npm/v/v-track.svg?colorB=brightgreen&style=flat-square"}})]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/tree/master/tests/unit"}},[n("img",{attrs:{src:"https://img.shields.io/badge/tested_with-jest-99424f.svg?style=flat-square"}})]),t._v(" "),n("a",{attrs:{href:"javascript:void(0);",alt:"hit count"}},[n("img",{attrs:{src:"http://hits.dwyl.io/l-hammer/v-track.svg"}})]),t._v(" "),n("a",{attrs:{href:"javascript:void(0);",alt:"downloads"}},[n("img",{attrs:{src:"https://img.shields.io/npm/dt/v-track.svg?style=flat-square"}})]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track"}},[n("img",{attrs:{src:"https://img.shields.io/github/stars/l-hammer/v-track.svg?style=social&label=Star"}})])]),t._v(" "),n("div",{staticClass:"description"},[t._v("\n 🕹一个基于Vue指令实现的埋点插件~\n ")])])},function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("section",{staticClass:"footer"},[n("div",{staticClass:"section-content mini"},[t._v("\n Copyright © 2019-present LHammer\n ")])])}],y={},C=y,w=(n("abe9"),n("2877")),_=Object(w["a"])(C,k,g,!1,null,null,null),b=_.exports,S=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"page-home page"},[n("section",{staticClass:"nav"},[n("router-link",{attrs:{to:{name:"STARTED"}}},[t._v("\n 快速开始\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 事件行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"CUSTOM_EVENTS"}}},[t._v("\n 自定义事件埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"TRACK_VIEW"}}},[t._v("\n 页面行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"BLOCK_SHOW"}}},[t._v("\n 区域展现埋点\n ")]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/issues"}},[t._v("打开一个 issue")])],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个点击事件行为的埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("div",{directives:[{name:"track",rawName:"v-track:18015.click",value:t.handleClick,expression:"handleClick",arg:"18015",modifiers:{click:!0}}],staticClass:"track-button"},[t._v("\n click me\n ")])])],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackClickSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"通过增加 .native 修饰符,我们可以监听组件原生click事件行为的埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("Button",{directives:[{name:"track",rawName:"v-track:18015.click.native",value:t.handleNativeEvent,expression:"handleNativeEvent",arg:"18015",modifiers:{click:!0,native:!0}}]})],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackNativeClickSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这个一个带参数点击事件行为的埋点,默认最后一个参数为 event 事件对象",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("div",{directives:[{name:"track",rawName:"v-track:18016.click",value:{handleClickWithParam:t.handleClickWithParam,item:t.item},expression:"{ handleClickWithParam, item }",arg:"18016",modifiers:{click:!0}}],staticClass:"track-button"},[t._v("\n click me\n ")])])],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackClickWithParamSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackClickWithParamSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个发生在事件之后的埋点,默认先执行埋点再执行事件,如示例所示:index初始值为0,点击事件会将index加1,所以埋点获取到的index值应该为1,依次点击则累加",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("div",{directives:[{name:"track",rawName:"v-track:18017.click.delay",value:t.handleClickDelay,expression:"handleClickDelay",arg:"18017",modifiers:{click:!0,delay:!0}}],staticClass:"track-button"},[t._v("\n click me\n ")])])],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackClickDelaySnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackClickDelaySnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个有异步行为的事件埋点,如示例所示:rest 初始值为 null,点击事件会 fetch 为 success,所以埋点获取到的 rest 值应该为 success",closable:!1}}),n("el-alert",{attrs:{center:"",type:"warning",title:"备注:①修饰符 async 是基于 Vue 实例提供的 vm.$watch 方法,所以只有在返回结果 rest 发生变化时才会触发埋点;②当有多个参数时,.async 会把最后一个参数当做监听对象",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("div",{directives:[{name:"track",rawName:"v-track:18018.click.async",value:{handleClickAsync:t.handleClickAsync,rest:t.rest},expression:"{ handleClickAsync, rest }",arg:"18018",modifiers:{click:!0,async:!0}}],staticClass:"track-button"},[t._v("\n click me\n ")])])],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackClickAsyncSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackClickAsyncSnippet}})],1)])},E=[],O=n("795b"),T=n.n(O),$=(n("96cf"),n("3b8d")),j=n("f499"),x=n.n(j),V=n("0a0d"),P=n.n(V),N=(n("6b54"),function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"code-snippet"},[n("div",{staticClass:"language"},[t._v(t._s(t.lang))]),t._v(" "),n("div",{staticClass:"line-numbers"},t._l(t.lineCount,function(e){return n("div",{key:e,staticClass:"line-number"},[t._v(t._s(e))])}),0),t._v(" "),n("div",{staticClass:"render",domProps:{innerHTML:t._s(t.result)}})])}),M=[],A=n("1487"),W=n.n(A),H={name:"code-snippet",props:{code:String,lang:String},computed:{result:function(){var t=W.a.highlight(this.lang,this.code.trim());return t.value},lineCount:function(){for(var t=this.result,e=0,n=0;n<t.length;++n)"\n"===t[n]&&e++;return e+1}}},R=H,D=(n("d2d7"),Object(w["a"])(R,N,M,!1,null,null,null)),B=D.exports,U=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"track-button",on:{click:function(e){return t.$emit("custom-event",t.item,e)}}},[t._v("\n click me\n")])},I=[],L={computed:{item:function(){return{id:P()().toString(36)}}}},F=L,K=Object(w["a"])(F,U,I,!1,null,null,null),q=K.exports,G='\n<div class="track-button" v-track:18015.click="handleClick">click me</div>\n',z='\n<Button v-track:18015.click.native="handleNativeEvent"></Button>\n',Y='\n<div class="track-button" v-track:18016.click="{ handleClickWithParam, item }">click me</div>\n',J="\nexport default {\n data: () => ({\n item: {\n id: Date.now().toString(36)\n },\n })\n}\n",Q='\n<div class="track-button" v-track:18017.click.delay="handleClickDelay">click me</div>\n',X="\nexport default {\n data() {\n return {\n index: 0\n };\n },\n methods: {\n handleClickDelay() {\n this.index++;\n },\n }\n}\n",Z='\n<div class="track-button" v-track:18018.click.async="handleClickAsync">click me</div>\n',tt='\nexport default {\n data() {\n return {\n rest: null\n };\n },\n methods: {\n async handleClickAsync() {\n const response = await new Promise(resolve => {\n setTimeout(() => {\n resolve({ data: "success" });\n }, 300);\n });\n\n this.rest = response.data;\n }\n }\n}\n',et={name:"Home",components:{Button:q,CodeSnippet:B},data:function(){return{trackClickSnippet:G,trackNativeClickSnippet:z,trackClickWithParamSnippet:Y,jsTrackClickWithParamSnippet:J,trackClickDelaySnippet:Q,trackClickAsyncSnippet:Z,jsTrackClickDelaySnippet:X,jsTrackClickAsyncSnippet:tt,item:{id:P()().toString(36)},index:0,rest:null}},methods:{handleClick:function(){this.$message.success("事件执行成功")},handleNativeEvent:function(){this.$message.success("组件原生事件执行成功")},handleClickWithParam:function(t,e){var n=e.target;this.$message.success("事件执行成功,参数为".concat(x()(t),"--").concat(n))},handleClickDelay:function(){this.index++},handleClickAsync:function(){var t=Object($["a"])(regeneratorRuntime.mark(function t(){var e;return regeneratorRuntime.wrap(function(t){while(1)switch(t.prev=t.next){case 0:return t.next=2,new T.a(function(t){setTimeout(function(){t({data:"success"})},300)});case 2:e=t.sent,this.rest===e.data?this.$message.success("异步事件返回成功,但返回结果和上一次相等,埋点不会上报"):(this.rest=e.data,this.$message.success("异步事件返回成功"));case 4:case"end":return t.stop()}},t,this)}));function e(){return t.apply(this,arguments)}return e}()}},nt=et,at=Object(w["a"])(nt,S,E,!1,null,null,null),rt=at.exports,st=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"page-started page"},[n("section",{staticClass:"nav"},[n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 返回\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 事件行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"CUSTOM_EVENTS"}}},[t._v("\n 自定义事件埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"TRACK_VIEW"}}},[t._v("\n 页面行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"BLOCK_SHOW"}}},[t._v("\n 区域展现埋点\n ")]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/issues"}},[t._v("打开一个 issue")])],1),t._v(" "),t._m(0),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{code:t.installSnippet,lang:"shell"}}),t._v(" "),n("div",{staticClass:"plus"},[t._v("+")]),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{code:t.mainSnippet,lang:"js"}}),t._v(" "),n("div",{staticClass:"plus"},[t._v("+")]),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{code:t.eventsSnippet,lang:"js"}}),t._v(" "),n("div",{staticClass:"plus"},[t._v("+")]),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{code:t.componentSnippet,lang:"html"}})],1)])},it=[function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("section",{staticClass:"snippets"},[n("div",{staticClass:"section-content small"},[t._v("\n v-track通过\n "),n("a",{attrs:{href:"https://cn.vuejs.org/v2/guide/custom-directive.html"}},[t._v("Vue 自定义指令")]),t._v("的方式将埋点代码与业务代码完全解耦,完整示例可参考\n "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/tree/master"}},[t._v("GitHub")])])])}],ct="\n# YARN\n$ yarn add v-track\n\n# NPM\n$ npm install v-track --save\n",ot='\nimport Vue from "vue";\nimport VTrack from "v-track";\nimport trackEvents from "./track-events";\n\nVue.use(VTrack, {\n trackEvents, // 埋点事件对象\n trackEnable: {\n UVPV: true, // 是否开启UVPV统计,v0.8.3新增routeUpdate,即在当前路由参数发生改变时埋点,默认为false\n TONP: true // 是否开启页面停留时长统计,默认为false\n }\n})\n',lt='\nimport trackAction from "./action"; // 自定义埋点上报的方法\n\nexport default {\n /**\n * @name UVPV 固定名称不支持修改\n * @desc UV、PV埋点\n * @param {Object} context 当前上下文\n */\n UVPV(_) {\n trackAction("1");\n },\n /**\n * @name TONP 固定名称不支持修改\n * @desc 页面停留时间埋点(Time on Page)\n * @param {Object} context 当前上下文\n * @param {Timestamp} et 进入页面时间\n * @param {Timestamp} dt 离开页面时间\n */\n TONP(_, { et, dt }) {\n trackAction("2", {\n stt: dt - et\n });\n },\n /**\n * @param {Object} context 当前上下文\n * @param {Object} item 事件参数\n * @param {Object} event 事件对象\n */\n 18015(\n {\n $route: { name }\n },\n { id },\n { target }\n ) {\n trackAction("18015", {\n id,\n source_page: name,\n target\n });\n },\n};\n',ut='\n\x3c!-- 页面行为埋点(track-view为v-track全局注册的组件) --\x3e\n<track-view v-track:18015></track-view>\n<track-view v-track:18015.watch="{ result }"></track-view>\n<track-view v-track:18015.watch.delay="{ result }"></track-view>\n<track-view v-if="result" v-track:18015></track-view>\n\n\x3c!-- 事件行为埋点(DOM) --\x3e\n<div v-track:18015.click="handleClick"></div>\n<div v-track:18015.click="{ handleClick, item, index }"></div>\n<div v-track:18015.click.async="{ handleSearch, rest }"></div>\n<div v-track:18015.click.delay="handleClick"></div>\n\n\x3c!-- 事件行为埋点(组件) --\x3e\n<cmp v-track:18015.click="handleClick"></cmp>\n<cmp v-track:18015.[自定义事件名]="handleSearch"></cmp>\n<cmp v-track:18015.[自定义事件名].delay="handleSearch"></cmp>\n<cmp v-track:18015.[自定义事件名].async="{ handleSearch, rest }"></cmp>\n\n\x3c!-- 区域展现埋点(block 可以是 DOM 或者组件) --\x3e\n<block v-track:18015.show></block>\n<block v-track:18015.show.once></block>\n<block v-track:18015.show.custom="{ ref: \'scroll\' }"></block>\n<block v-track:18015.show.custom.once="{ ref: \'scroll\' }"></block>\n',pt={name:"Started",components:{CodeSnippet:B},data:function(){return{installSnippet:ct,mainSnippet:ot,eventsSnippet:lt,componentSnippet:ut}}},vt=pt,dt=Object(w["a"])(vt,st,it,!1,null,null,null),mt=dt.exports,ht=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"page-home page"},[n("section",{staticClass:"nav"},[n("router-link",{attrs:{to:{name:"STARTED"}}},[t._v("\n 快速开始\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 事件行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 返回\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"TRACK_VIEW"}}},[t._v("\n 页面行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"BLOCK_SHOW"}}},[t._v("\n 区域展现埋点\n ")]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/issues"}},[t._v("打开一个 issue")])],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个自定义事件行为埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("Button",{directives:[{name:"track",rawName:"v-track:18015.custom-event",value:t.handleCustomEvent,expression:"handleCustomEvent",arg:"18015",modifiers:{"custom-event":!0}}]})],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.ButtonComponentSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackCustomEventSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个有带参数的自定义事件埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("Button",{directives:[{name:"track",rawName:"v-track:18019.custom-event",value:t.handleCustomEventWithParam,expression:"handleCustomEventWithParam",arg:"18019",modifiers:{"custom-event":!0}}]})],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.ButtonComponentWithParamSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackCustomEventWithParamSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个发生在自定义事件之后的埋点,默认先执行埋点再执行自定义事件。如示例所示:activeName初始值为Feedback,自定义事件会更新该值,所以埋点获取到activeName的值应为当前激活面板的name",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content collapse-wrapper"},[n("el-collapse",{directives:[{name:"track",rawName:"v-track:18020.change.delay",value:t.handleChange,expression:"handleChange",arg:"18020",modifiers:{change:!0,delay:!0}}],attrs:{accordion:""},model:{value:t.activeName,callback:function(e){t.activeName=e},expression:"activeName"}},[n("el-collapse-item",{attrs:{title:"反馈 Feedback",name:"Feedback"}},[n("div",[t._v("\n 控制反馈:通过界面样式和交互动效让用户可以清晰的感知自己的操作;\n ")]),t._v(" "),n("div",[t._v("页面反馈:操作后,通过页面元素的变化清晰地展现当前状态。")])]),t._v(" "),n("el-collapse-item",{attrs:{title:"效率 Efficiency",name:"Efficiency"}},[n("div",[t._v("简化流程:设计简洁直观的操作流程;")]),t._v(" "),n("div",[t._v("\n 清晰明确:语言表达清晰且表意明确,让用户快速理解进而作出决策;\n ")]),t._v(" "),n("div",[t._v("\n 帮助用户识别:界面简单直白,让用户快速识别而非回忆,减少用户记忆负担。\n ")])]),t._v(" "),n("el-collapse-item",{attrs:{title:"可控 Controllability",name:"Controllability"}},[n("div",[t._v("\n 用户决策:根据场景可给予用户操作建议或安全提示,但不能代替用户进行决策;\n ")]),t._v(" "),n("div",[t._v("\n 结果可控:用户可以自由的进行操作,包括撤销、回退和终止当前操作等。\n ")])])],1)],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackCustomEventDelaySnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackCustomEventDelaySnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个有异步行为的自定义事件埋点。如示例所示:rest初始值为null,自定义事件会fetch为success,所以埋点获取到的rest值应该为success",closable:!1}}),n("el-alert",{attrs:{center:"",type:"warning",title:"备注:同普通DOM事件埋点一样,只有在 rest 发生变化时才会触发埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("Button",{directives:[{name:"track",rawName:"v-track:18021.custom-event.async",value:{fetchRest:t.fetchRest,rest:t.rest},expression:"{ fetchRest, rest }",arg:"18021",modifiers:{"custom-event":!0,async:!0}}]})],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackCustomEventAsyncSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackCustomEventAsyncSnippet}})],1)])},ft=[],kt='\n\x3c!-- button 组件 --\x3e\n<div class="track-button" @click="$emit(\'custom-event\')">\n click me\n</div>\n',gt='\n\x3c!-- button 组件 --\x3e\n<div class="track-button" @click="e => $emit(\'custom-event\', { id: Date.now().toString(36) }, e)">\n click me\n</div>\n',yt='\n<Button v-track:18015.custom-event="handleCustomEvent"></Button>\n',Ct='\n<Button v-track:18019.custom-event="handleCustomEventWithParam"></Button>\n',wt='\n<el-collapse\n accordion\n v-model="activeName"\n v-track:18020.change.delay="handleChange"\n>\n <el-collapse-item title="反馈" name="Feedback">...</el-collapse-item>\n <el-collapse-item title="效率" name="Efficiency">...</el-collapse-item>\n <el-collapse-item title="可控" name="Controllability">...</el-collapse-item>\n</el-collapse>\n',_t='\nexport default {\n data() {\n return {\n activeName: "Feedback",\n };\n },\n methods: {\n handleChange(val) {\n this.activeName = val;\n }\n }\n}\n',bt='\n<Button v-track:18021.custom-event.async="{ fetchRest, rest }"></Button>\n',St='\nexport default {\n data() {\n return {\n rest: null\n };\n },\n methods: {\n async fetchRest() {\n const response = await new Promise(resolve => {\n setTimeout(() => {\n resolve({ data: "success" });\n }, 300);\n });\n\n this.rest = response.data;\n }\n }\n}\n',Et={name:"CustomEvents",components:{Button:q,CodeSnippet:B},data:function(){return{ButtonComponentSnippet:kt,ButtonComponentWithParamSnippet:gt,trackCustomEventSnippet:yt,trackCustomEventWithParamSnippet:Ct,trackCustomEventDelaySnippet:wt,trackCustomEventAsyncSnippet:bt,jsTrackCustomEventDelaySnippet:_t,jsTrackCustomEventAsyncSnippet:St,item:{id:Math.random().toString(36).substr(2)},activeName:"Feedback",rest:null}},methods:{handleCustomEvent:function(){this.$message.success("自定义事件执行成功")},handleCustomEventWithParam:function(t,e){var n=e.target;this.$message.success("自定义事件执行成功,参数为".concat(x()(t),"--").concat(n))},handleChange:function(t){this.activeName=t},fetchRest:function(){var t=Object($["a"])(regeneratorRuntime.mark(function t(){var e;return regeneratorRuntime.wrap(function(t){while(1)switch(t.prev=t.next){case 0:return t.next=2,new T.a(function(t){setTimeout(function(){t({data:"success"})},300)});case 2:e=t.sent,this.rest===e.data?this.$message.success("异步事件返回成功,但返回结果和上一次相等,埋点不会上报"):(this.rest=e.data,this.$message.success("异步事件返回成功"));case 4:case"end":return t.stop()}},t,this)}));function e(){return t.apply(this,arguments)}return e}()}},Ot=Et,Tt=Object(w["a"])(Ot,ht,ft,!1,null,null,null),$t=Tt.exports,jt=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"page-home page"},[n("section",{staticClass:"nav"},[n("router-link",{attrs:{to:{name:"STARTED"}}},[t._v("\n 快速开始\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 事件行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"CUSTOM_EVENTS"}}},[t._v("\n 自定义事件埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 返回\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"BLOCK_SHOW"}}},[t._v("\n 区域展现埋点\n ")]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/issues"}},[t._v("打开一个 issue")])],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个页面初始化埋点",closable:!1}}),t._v(" "),n("el-alert",{attrs:{center:"",type:"warning",title:"备注:v-track指令可用于任何元素,此行为埋点建议绑定到页面的根元素或者v-track提供的track-view组件上",closable:!1}}),t._v(" "),n("div",{directives:[{name:"track",rawName:"v-track:18022",arg:"18022"}],staticClass:"section-content"})],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackViewComponentSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"配合 v-if 指令控制埋点上报次数,即 show 为真时,会再次触发埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[t.show?n("track-view",{directives:[{name:"track",rawName:"v-track:18023",arg:"18023"}]}):t._e(),t._v(" "),n("div",{staticClass:"track-button",on:{click:function(){return t.show=!t.show}}},[t._v("\n click me -> "+t._s(t.show)+"\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackViewComponentVIfSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackViewComponentVIfSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个监听页面行为的埋点,同事件行为埋点一样,只有当返回结果发生变化时才会上报埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("track-view",{directives:[{name:"track",rawName:"v-track:18025.watch",value:{rest1:t.rest1},expression:"{ rest1 }",arg:"18025",modifiers:{watch:!0}}]}),t._v(" "),n("div",{staticClass:"track-button",on:{click:function(e){return t.fetchRest(!1)}}},[t._v("\n click me\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackViewComponentWatchSnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackViewComponentWatchSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个监听页面行为并延时的埋点,不同于事件延时埋点,这里可通过delay设置具体的延长时间",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content"},[n("track-view",{directives:[{name:"track",rawName:"v-track:18026.watch.delay",value:{rest2:t.rest2,delay:2e3},expression:"{ rest2, delay: 2000 }",arg:"18026",modifiers:{watch:!0,delay:!0}}]}),t._v(" "),n("div",{staticClass:"track-button",on:{click:function(e){return t.fetchRest(!0)}}},[t._v("\n click me\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackViewComponentWatchDelaySnippet}}),t._v(" "),n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"js",code:t.jsTrackViewComponentWatchDelaySnippet}})],1)])},xt=[],Vt="\n<track-view v-track:18022></track-view>\n",Pt='\n<track-view v-track:18023 v-if="show"></track-view>\n<div class="track-button" @click="show = !show">click me -> {{ show }}</div>\n',Nt="\nexport default {\n data: () => ({ show: false })\n}\n",Mt='\n<track-view v-track:18015.watch="{ rest }" />\n<div class="track-button" @click="fetchRest">click me</div>\n',At='\nexport default {\n data: () => ({ rest: null }),\n methods: {\n async fetchRest() {\n const response = await new Promise(resolve => {\n setTimeout(() => {\n resolve({ data: "success" });\n }, 300);\n });\n \n this.rest = response.data;\n }\n },\n}\n',Wt='\n<track-view v-track:18025.watch.delay="{ rest, delay: 2000 }" />\n<div class="track-button" @click="fetchRest()">click me</div>\n',Ht='\nexport default {\n data: () => ({ rest: null }),\n methods: {\n async fetchRest() {\n const response = await new Promise(resolve => {\n setTimeout(() => {\n resolve({ data: "success" });\n }, 300);\n });\n \n this.rest = response.data;\n }\n },\n}\n',Rt={name:"TrackViews",components:{CodeSnippet:B},data:function(){return{trackViewComponentSnippet:Vt,trackViewComponentVIfSnippet:Pt,jsTrackViewComponentVIfSnippet:Nt,trackViewComponentWatchSnippet:Mt,jsTrackViewComponentWatchSnippet:At,trackViewComponentWatchDelaySnippet:Wt,jsTrackViewComponentWatchDelaySnippet:Ht,show:!1,rest1:null,rest2:null}},methods:{fetchRest:function(){var t=Object($["a"])(regeneratorRuntime.mark(function t(e){var n;return regeneratorRuntime.wrap(function(t){while(1)switch(t.prev=t.next){case 0:return t.next=2,new T.a(function(t){setTimeout(function(){t({data:"success"})},300)});case 2:n=t.sent,!e&&this.rest1===n.data||e&&this.rest2===n.data?this.$message.success("异步事件返回成功,但返回结果和上一次相等,埋点不会上报"):(this.$message.success("异步事件返回成功"),e?this.rest2=n.data:this.rest1=n.data);case 4:case"end":return t.stop()}},t,this)}));function e(e){return t.apply(this,arguments)}return e}()}},Dt=Rt,Bt=Object(w["a"])(Dt,jt,xt,!1,null,null,null),Ut=Bt.exports,It=function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{staticClass:"page-home page"},[n("section",{staticClass:"nav"},[n("router-link",{attrs:{to:{name:"STARTED"}}},[t._v("\n 快速开始\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 事件行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"CUSTOM_EVENTS"}}},[t._v("\n 自定义事件埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"TRACK_VIEW"}}},[t._v("\n 页面行为埋点\n ")]),t._v(" "),n("router-link",{attrs:{to:{name:"HOME"}}},[t._v("\n 返回\n ")]),t._v(" "),n("a",{attrs:{href:"https://github.com/l-hammer/v-track/issues"}},[t._v("打开一个 issue")])],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个只会上报一次的区域展现埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content large"},[n("el-card",{directives:[{name:"track",rawName:"v-track:18028.show.once",arg:"18028",modifiers:{show:!0,once:!0}}],attrs:{shadow:"always"}},[t._v("\n 我只想被曝光一次\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackViewComponentOnceSnippet}})],1),t._v(" "),n("section",{staticClass:"demo"},[n("el-alert",{attrs:{center:"",type:"info",title:"这是一个会连续上报的区域展现埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content large"},[n("el-card",{directives:[{name:"track",rawName:"v-track:18027.show",arg:"18027",modifiers:{show:!0}}],attrs:{shadow:"always"}},[t._v("\n 我想被曝光无数次\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.trackViewComponentSnippet}})],1),t._v(" "),n("section",{ref:"viewport1",staticClass:"demo viewport"},[n("el-alert",{attrs:{center:"",type:"info",title:"某个区域内元素曝光埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content large"},[n("el-card",{directives:[{name:"track",rawName:"v-track:18029.show",value:{viewport:"viewport1"},expression:"{ viewport: 'viewport1' }",arg:"18029",modifiers:{show:!0}}],attrs:{shadow:"always"}},[t._v("\n 我也想被曝光无数次\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.viewportTrackViewComponentSnippet1}})],1),t._v(" "),n("section",{ref:"viewport2",staticClass:"demo viewport"},[n("el-alert",{attrs:{center:"",type:"info",title:"某个区域内元素曝光超过一半则上报埋点",closable:!1}}),t._v(" "),n("div",{staticClass:"section-content large"},[n("el-card",{directives:[{name:"track",rawName:"v-track:18030.show",value:{viewport:"viewport2",percent:.5},expression:"{ viewport: 'viewport2', percent: 0.5 }",arg:"18030",modifiers:{show:!0}}],attrs:{shadow:"always"}},[t._v("\n 我也想被曝光无数次\n ")])],1)],1),t._v(" "),n("section",{staticClass:"snippets"},[n("CodeSnippet",{staticClass:"snippet",attrs:{lang:"html",code:t.viewportTrackViewComponentSnippet2}})],1)])},Lt=[],Ft='\n<el-card shadow="always" v-track:18027.show>我想被曝光无数次</el-card>\n',Kt='\n<el-card shadow="always" v-track:18027.show.once>我只想被曝光一次</el-card>\n',qt='\n<section ref="viewport">\n <el-card shadow="always" v-track:18029.show="{ viewport: \'viewport1\' }">我也想被曝光无数次</el-card>\n</section>\n',Gt='\n<section ref="viewport">\n <el-card shadow="always" v-track:18029.show="{ viewport: \'viewport2\', percent: 0.5 }">我也想被曝光无数次</el-card>\n</section>\n',zt={name:"BlockShow",components:{CodeSnippet:B},data:function(){return{trackViewComponentSnippet:Ft,trackViewComponentOnceSnippet:Kt,viewportTrackViewComponentSnippet1:qt,viewportTrackViewComponentSnippet2:Gt,show:!1,rest1:null,rest2:null}},methods:{fetchRest:function(){var t=Object($["a"])(regeneratorRuntime.mark(function t(e){var n;return regeneratorRuntime.wrap(function(t){while(1)switch(t.prev=t.next){case 0:return t.next=2,new T.a(function(t){setTimeout(function(){t({data:"success"})},300)});case 2:n=t.sent,!e&&this.rest1===n.data||e&&this.rest2===n.data?this.$message.success("异步事件返回成功,但返回结果和上一次相等,埋点不会上报"):(this.$message.success("异步事件返回成功"),e?this.rest2=n.data:this.rest1=n.data);case 4:case"end":return t.stop()}},t,this)}));function e(e){return t.apply(this,arguments)}return e}()}},Yt=zt,Jt=Object(w["a"])(Yt,It,Lt,!1,null,null,null),Qt=Jt.exports;function Xt(t){return Xt="function"===typeof Symbol&&"symbol"===typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"===typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},Xt(t)}function Zt(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function te(t,e){for(var n=0;n<e.length;n++){var a=e[n];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(t,a.key,a)}}function ee(t,e,n){return e&&te(t.prototype,e),n&&te(t,n),t}function ne(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function ae(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{},a=Object.keys(n);"function"===typeof Object.getOwnPropertySymbols&&(a=a.concat(Object.getOwnPropertySymbols(n).filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable}))),a.forEach(function(e){ne(t,e,n[e])})}return t}function re(t,e){if(null==t)return{};var n,a,r={},s=Object.keys(t);for(a=0;a<s.length;a++)n=s[a],e.indexOf(n)>=0||(r[n]=t[n]);return r}function se(t,e){if(null==t)return{};var n,a,r=re(t,e);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(t);for(a=0;a<s.length;a++)n=s[a],e.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(t,n)&&(r[n]=t[n])}return r}function ie(t,e){return le(t)||pe(t,e)||de()}function ce(t){return oe(t)||ue(t)||ve()}function oe(t){if(Array.isArray(t)){for(var e=0,n=new Array(t.length);e<t.length;e++)n[e]=t[e];return n}}function le(t){if(Array.isArray(t))return t}function ue(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}function pe(t,e){var n=[],a=!0,r=!1,s=void 0;try{for(var i,c=t[Symbol.iterator]();!(a=(i=c.next()).done);a=!0)if(n.push(i.value),e&&n.length===e)break}catch(o){r=!0,s=o}finally{try{a||null==c["return"]||c["return"]()}finally{if(r)throw s}}return n}function ve(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function de(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}var me=function(t){return"function"===typeof t||!1},he=function(t){return void 0===t||null===t},fe=function(t){return void 0!==t&&null!==t};function ke(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return[Object.values(t),Object.keys(t)]}function ge(t){var e,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:200;return function(){for(var a=this,r=arguments.length,s=new Array(r),i=0;i<r;i++)s[i]=arguments[i];clearTimeout(e),e=setTimeout(function(){return t.apply(a,s)},n)}}function ye(t,e){var n=Object.keys(t);return n.length===e.length&&e.every(function(t){return n.includes(t)})}function Ce(t,e){var n=Object.keys(t);return e.some(function(t){return n.includes(t)})}function we(t,e){return t.key===e.key&&t.tag===e.tag&&t.isComment===e.isComment&&fe(t.data)===fe(e.data)}function _e(t,e){if(!we(t,e))return!1;var n=e.children,a=t.children;if(he(t.text)&&fe(n)&&fe(a)){if(n.length!==a.length)return!1;for(var r=0;r<a.length;r++){var s=a[r];if(fe(s)&&fe(n[r]))return _e(s,n[r])}}else if(t.text!==e.text)return!1;return!0}var be=function(t){if(!me(t))throw new Error("The first parameter should be Function.")},Se=function(t){return t&&1===t.nodeType};function Ee(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function Oe(t,e){return!(!t||t.width<=0||t.height<=0)&&(t.bottom>0&&t.right>0&&t.top<window.innerHeight&&t.left<window.innerWidth&&!(t.left>e.right||t.top>e.bottom||t.right<e.left||t.bottom<e.top))}function Te(t){if(t===window.document)return!0;if(!t||!t.parentNode)return!1;var e=t.parentNode,n=Ee(t,"visibility"),a=Ee(t,"display");return"hidden"!==n&&"none"!==a&&(!e||Te(e))}var $e=function(){function t(e,n){var a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:window,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:1;if(Zt(this,t),!Se(e))throw new Error("not an element node");if(r>1&&r<=0)throw new Error("'percent' must be a number between 0 and 1");this.ele=e,this.ref=n,this.refWin=a,this.started=!1,this.percent=r,this.prevPerc=null,this.listeners={},this.removeScrollLisener=null,this.init()}return ee(t,[{key:"init",value:function(){var t=this;if(!this.started){var e=ge(this.visibilitychange.bind(this));e(),this.removeScrollLisener=function(e){return t.ref?t.ref.$on("scroll",e):(t.refWin.addEventListener("scroll",e,!0),function(){return t.refWin.removeEventListener("scroll",e,!0)})}(e),this.started=!0}}},{key:"viewport",value:function(){var t=this.refWin,e=Se(t)?t.getBoundingClientRect():t;return{top:Se(t)?e.top:0,right:e.right||e.innerWidth,bottom:e.bottom||e.innerHeight,left:e.left||0,height:t.innerHeight||t.offsetHeight,width:t.innerWidth||t.offsetWidth}}},{key:"$on",value:function(t,e){var n=this.listeners[t]||(this.listeners[t]=[]);return n.push(e),this}},{key:"$off",value:function(t,e){if(e){var n,a=this.listeners[t],r=a.length;while(r--)if(n=a[r],n===e||n.cbk===e){a.splice(r,1);break}return this}}},{key:"$once",value:function(t,e){var n=this,a=function a(){n.$off(t,a);for(var r=arguments.length,s=new Array(r),i=0;i<r;i++)s[i]=arguments[i];e.apply(n,s)};return a.cbk=e,this.$on(t,a),this}},{key:"$emit",value:function(t){for(var e=this,n=arguments.length,a=new Array(n>1?n-1:0),r=1;r<n;r++)a[r-1]=arguments[r];var s=this.listeners[t]||[];return s.forEach(function(t){return t.apply(e,a)}),this}},{key:"visibilitychange",value:function(){var t=this.ele.getBoundingClientRect(),e=this.viewport();if(!Oe(t,e)||!Te(this.ele))return this.prevPerc=0,0;var n=0,a=0,r=0;e.top<0&&(e.top=0),e.bottom>window.innerHeight&&(e.bottom=window.innerHeight),e.left<0&&(e.left=0),e.right>window.innerWidth&&(e.right=window.innerWidth),n=t.top>=e.top&&t.bottom>e.bottom?e.bottom-t.top:t.top<e.top&&t.bottom<=e.bottom?t.bottom-e.top:t.height,a=t.left>=e.left&&t.right>e.right?e.right-t.left:t.left<e.left&&t.right<=e.right?t.right-e.left:t.width,r=n*a/(t.height*t.width),this.prevPerc<this.percent&&r>=this.percent&&(this.$emit("fullyvisible"),this.prevPerc=r)}},{key:"destroy",value:function(){me(this.removeScrollLisener)&&this.removeScrollLisener()}}]),t}(),je=["async","delay","watch","show","once","custom"];function xe(t,e,n,a){var r=this,s=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};t.$unwatch=a.$watch(function(){return a[e]},function(e,a){e!==a&&(s.immediate||t.contains(r.target))&&n(),r.target=null})}function Ve(t,e,n,a,r,s){var i=this,c=e.value,o=e.arg,l=e.modifiers,u=e.rawName,p=n.context,v=n.componentInstance;if(!s[o])throw new Error("tracking event does not exist");var d=[],m=s[o].bind(null,p),h=function(e,n,a){return xe.call(i,t,e,n,p,a)},f=function(){for(var t=arguments.length,e=new Array(t),n=0;n<t;n++)e[n]=arguments[n];return ye.call(null,l,e)},k=function(){for(var t=arguments.length,e=new Array(t),n=0;n<t;n++)e[n]=arguments[n];return Ce.call(null,l,e)};if(Object.keys(l).length)if(f("watch")){var g=Object.keys(c).shift();h(g,m,{immediate:!0})}else if(f("delay"))t.$timer&&clearTimeout(t.$timer),t.$timer=setTimeout(function(){s[o](p)},c);else if(f("watch","delay")){var y=c.delay,C=se(c,["delay"]),w=ce(Object.keys(C)).pop();m=function(){t.$timer&&clearTimeout(t.$timer),t.$timer=setTimeout(function(){var t=Te(p.$el);t&&s[o](p)},y)},h(w,m,{immediate:!0})}else if(k("show")){var _,b=ke(c),S=ie(b,1),E=S[0],O=(_=s[o]).bind.apply(_,[null,p].concat(ce(E))),T=k("once"),$=k("custom");t.$visMonitor||setTimeout(function(){var e=new $e(t,$&&p.$refs[c.ref],c&&p.$refs[c.viewport],c&&c.percent);(T?e.$once:e.$on).call(e,"fullyvisible",O),t.$visMonitor=e},0)}else if(!v&&l.click||v&&k("native")){switch(Xt(c)){case"object":var j,x=ke(c),V=ie(x,2),P=V[0],N=V[1],M=P.shift(),A=ce(N).pop();be(M),m=(j=s[o]).bind.apply(j,[null,p].concat(ce(P))),d=[m,M.bind.apply(M,[null].concat(ce(P)))],l.delay&&d.reverse(),l.async&&h(A,d.shift());break;case"function":d=[m,c],l.delay&&d.reverse();break}t.$listener=function(t){i.target=t.target,d.forEach(function(e){return e(t)})},t.addEventListener("click",t.$listener)}else{if(!v||v.$el!==t)throw new Error("".concat(u," directive is not supported"));var W,H,R,D,B=Object.keys(l).filter(function(t){return!je.includes(t)}).pop();if("object"===Xt(c)){var U=ke(c),I=ie(U,2);W=I[0],H=I[1],R=W.shift(),D=ce(H).pop(),be(R)}if(t["$on_".concat(B)])return;v.$on(B,function(){var e,n;i.target=t;for(var a=arguments.length,r=new Array(a),u=0;u<a;u++)r[u]=arguments[u];m=(e=s[o]).bind.apply(e,[null,p].concat(r)),d=[m,(n=R||c).bind.apply(n,[null].concat(r))],l.delay&&d.reverse(),l.async&&h(D,d.shift()),d.forEach(function(t){return t()}),t["$on_".concat(B)]=!0})}else s[o](p,c)}function Pe(t){if(t.$listener){for(var e=arguments.length,n=new Array(e>1?e-1:0),a=1;a<e;a++)n[a-1]=arguments[a];_e(n[1],n[2])||(Ne.call(this,t),Ve.call.apply(Ve,[this,t].concat(n)))}}function Ne(t){t.$listener&&t.removeEventListener("click",t.$listener),t.$timer&&clearTimeout(t.$timer),t.$unwatch&&t.$unwatch(),t.$visMonitor&&t.$visMonitor.destroy()}var Me=function(){function t(){Zt(this,t),this.installed=!1}return ee(t,null,[{key:"install",value:function(t,e){var n=this,a=e.trackEvents,r=e.trackEnable,s=void 0===r?{}:r;s=ae({UVPV:!1,TONP:!1},s);var i=function(t,e){s.TONP&&a.TONP(t,{et:e,dt:Date.now()})};this.installed||(this.installed=!0,t.directive("track",{bind:function(){for(var t,e=arguments.length,r=new Array(e),s=0;s<e;s++)r[s]=arguments[s];return(t=Ve).call.apply(t,[n].concat(r,[a]))},componentUpdated:function(){for(var t,e=arguments.length,r=new Array(e),s=0;s<e;s++)r[s]=arguments[s];return(t=Pe).call.apply(t,[n].concat(r,[a]))},unbind:function(){for(var t,e=arguments.length,a=new Array(e),r=0;r<e;r++)a[r]=arguments[r];return(t=Ne).call.apply(t,[n].concat(a))}}),t.component("TrackView",{render:function(t){return t("span",{style:"display: none"})}}),t.mixin({data:function(){return{PAGE_ENTER_TIME:Date.now()}},created:function(){var t=this;window.onbeforeunload=function(){return i(t,t.PAGE_ENTER_TIME)}},beforeRouteEnter:function(t,e,n){n(function(t){s.UVPV&&a.UVPV(t)})},beforeRouteUpdate:function(t,e,n){var r=this;this.$watch("$route",function(){s.UVPV&&"routeUpdate"===s.UVPV&&a.UVPV(r)}),n()},beforeRouteLeave:function(t,e,n){i(this,this.PAGE_ENTER_TIME),n()}}))}}]),t}();ne(Me,"target",null);var Ae=Me,We=n("cebc"),He=(n("7f7f"),n("386d"),n("a481"),/\d\d?/),Re=/\d{4}/,De=/d{1,2}|M{1,2}|yy(?:yy)?|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g,Be={default:"yyyy-MM-dd HH:mm:ss",date:"yyyy-MM-dd",datetime:"yyyy-MM-dd HH:mm:ss",time:"HH:mm:ss",year:"yyyy",enDate:"M/d/yy",cnDate:"yyyy 年 MM 月 dd 日"},Ue=function(t,e){t=String(t),e=e||2;while(t.length<e)t="0".concat(t);return t},Ie={yyyy:function(t){return Ue(t.getFullYear(),4)},yy:function(t){return String(t.getFullYear()).substr(2)},M:function(t){return t.getMonth()+1},MM:function(t){return Ue(t.getMonth()+1)},d:function(t){return t.getDate()},dd:function(t){return Ue(t.getDate())},h:function(t){return t.getHours()%12||12},hh:function(t){return Ue(t.getHours()%12||12)},H:function(t){return t.getHours()},HH:function(t){return Ue(t.getHours())},m:function(t){return t.getMinutes()},mm:function(t){return Ue(t.getMinutes())},s:function(t){return t.getSeconds()},ss:function(t){return Ue(t.getSeconds())}},Le=function(t,e){if("number"===typeof t&&(t=new Date(t)),"[object Date]"!==Object.prototype.toString.call(t)||isNaN(t.getTime()))throw new Error("Invalid Date in date.format");return e=Be[e]||e||Be.default,e=e.replace(De,function(e){return e in Ie?Ie[e](t):e.slice(1,e.length-1)}),e},Fe={yyyy:[Re,function(t,e){t.year=e}],yy:[He,function(t,e){var n=new Date,a=+"".concat(n.getFullYear()).substr(0,2);t.year="".concat(e>68?a-1:a).concat(e)}],M:[He,function(t,e){t.month=e-1}],d:[He,function(t,e){t.day=e}],h:[He,function(t,e){t.hour=e}],m:[He,function(t,e){t.minute=e}],s:[He,function(t,e){t.second=e}]};Fe.MM=Fe.M,Fe.dd=Fe.d,Fe.hh=Fe.h,Fe.H=Fe.h,Fe.HH=Fe.h,Fe.mm=Fe.m,Fe.ss=Fe.s;var Ke=n("a4bb"),qe=n.n(Ke),Ge=function(t){var e=qe()(t).reduce(function(e,n){return e.push({key:n,val:t[n]}),e},[]),n=e.map(function(t){var e=t.key,n=t.val;return'\n <div class="row">\n <span>'.concat(e,"</span>\n <span>").concat(n,"</span>\n </div>\n ")}).join("");return'\n <section class="v-track-table">\n <div class="header">\n <strong>key</strong>\n <strong>value</strong>\n </div>\n '.concat(n,"\n </section>\n ")};function ze(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=Object(We["a"])({evt:t},e,{action_time:Le(P()())});"1"===t&&i()("统计UVPV埋点"),"2"===t&&i()({message:"统计页面停留时间埋点",customClass:"message-offset"}),r.a.success({title:"上报数据如下:",dangerouslyUseHTMLString:!0,message:Ge(n),customClass:"notification__large",position:"1"===t||"2"===t?"top-left":"top-right"})}var Ye={UVPV:function(){ze("1")},TONP:function(t,e){var n=e.et,a=e.dt;ze("2",{stt:"".concat((a-n)/1e3,"s")})},18015:function(t){var e=t.$route.name;ze("18015",{source_page:e})},18016:function(t,e,n){var a=t.$route.name,r=e.id,s=n.target;ze("18016",{id:r,source_page:a,target:s})},18017:function(t){var e=t.index,n=t.$route.name;ze("18017",{source_page:n,index:e})},18018:function(t){var e=t.rest,n=t.$route.name;ze("18018",{source_page:n,rest:e})},18019:function(t,e,n){var a=t.$route.name,r=e.id,s=n.target;ze("18019",{id:r,source_page:a,target:s})},18020:function(t){var e=t.activeName,n=t.$route.name;ze("18020",{source_page:n,active_name:e})},18021:function(t){var e=t.rest,n=t.$route.name;ze("18021",{source_page:n,rest:e})},18022:function(t){var e=t.$route.name;ze("18022",{source_page:e,description:"这是一个页面初始化埋点"})},18023:function(t){var e=t.$route.name;ze("18023",{source_page:e})},18025:function(t){var e=t.rest1,n=t.$route.name;ze("18025",{source_page:n,rest:e})},18026:function(t){var e=t.rest2,n=t.$route.name;ze("18026",{source_page:n,rest:e})},18027:function(t){var e=t.$route.name;ze("18027",{source_page:e,description:"我想被曝光无数次"})},18028:function(t){var e=t.$route.name;ze("18028",{source_page:e,description:"我只想被曝光一次"})},18029:function(t){var e=t.$route.name;ze("18029",{source_page:e,description:"我也想被曝光无数次"})},18030:function(t){var e=t.$route.name;ze("18030",{source_page:e,description:"我也想被曝光无数次"})}},Je=Object(We["a"])({},Ye);h["default"].use(f["a"]),h["default"].use(m.a),h["default"].use(v.a),h["default"].use(u.a),h["default"].use(o.a),h["default"].use(Ae,{trackEvents:Je,trackEnable:{UVPV:"routeUpdate",TONP:!0}}),h["default"].prototype.$message=i.a,h["default"].prototype.$notify=r.a;var Qe=new f["a"]({routes:[{path:"/",name:"HOME",component:rt},{path:"/started",name:"STARTED",component:mt},{path:"/custom-events",name:"CUSTOM_EVENTS",component:$t},{path:"/track-view",name:"TRACK_VIEW",component:Ut,meta:{keepAlive:!0}},{path:"/block-show",name:"BLOCK_SHOW",component:Qt},{path:"*",redirect:"/"}]});new h["default"]({el:"#app",router:Qe,render:function(t){return t(b)}})}});
|
|
2
|
+
//# sourceMappingURL=app.efe84ade.js.map
|