v-track/docs/dist/js/app.3056726d.js

一个基于Vue指令的埋点插件

(function(t){function e(e){for(var a,i,c=e[0],o=e[1],l=e[2],v=0,p=[];v<c.length;v++)i=c[v],r[i]&&p.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(p.length)p.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),v=(n("b8e0"),n("a4c4")),p=n.n(v),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,_=(n("abe9"),n("2877")),w=Object(_["a"])(C,k,g,!1,null,null,null),b=w.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(_["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(_["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(_["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',vt={name:"Started",components:{CodeSnippet:B},data:function(){return{installSnippet:ct,mainSnippet:ot,eventsSnippet:lt,componentSnippet:ut}}},pt=vt,dt=Object(_["a"])(pt,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',_t='\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',wt='\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:_t,trackCustomEventAsyncSnippet:bt,jsTrackCustomEventDelaySnippet:wt,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(_["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(_["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:"viewport",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:"viewport"},expression:"{ viewport: 'viewport' }",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.viewportTrackViewComponentSnippet}})],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: \'viewport\' }">我也想被曝光无数次</el-card>\n</section>\n',Gt={name:"BlockShow",components:{CodeSnippet:B},data:function(){return{trackViewComponentSnippet:Ft,trackViewComponentOnceSnippet:Kt,viewportTrackViewComponentSnippet:qt,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}()}},zt=Gt,Yt=Object(_["a"])(zt,It,Lt,!1,null,null,null),Jt=Yt.exports;function Qt(t){return Qt="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},Qt(t)}function Xt(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function Zt(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 te(t,e,n){return e&&Zt(t.prototype,e),n&&Zt(t,n),t}function ee(t,e,n){return e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function ne(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){ee(t,e,n[e])})}return t}function ae(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 re(t,e){if(null==t)return{};var n,a,r=ae(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 se(t,e){return oe(t)||ue(t,e)||pe()}function ie(t){return ce(t)||le(t)||ve()}function ce(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 oe(t){if(Array.isArray(t))return t}function le(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}function ue(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 pe(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}var de=function(t){return"function"===typeof t||!1},me=function(t){return void 0===t||null===t},he=function(t){return void 0!==t&&null!==t};function fe(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return[Object.values(t),Object.keys(t)]}function ke(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 ge(t,e){var n=Object.keys(t);return n.length===e.length&&e.every(function(t){return n.includes(t)})}function ye(t,e){var n=Object.keys(t);return e.some(function(t){return n.includes(t)})}function Ce(t,e){return t.key===e.key&&t.tag===e.tag&&t.isComment===e.isComment&&he(t.data)===he(e.data)}function _e(t,e){if(!Ce(t,e))return!1;var n=e.children,a=t.children;if(me(t.text)&&he(n)&&he(a)){if(n.length!==a.length)return!1;for(var r=0;r<a.length;r++){var s=a[r];if(he(s)&&he(n[r]))return _e(s,n[r])}}else if(t.text!==e.text)return!1;return!0}var we=function(t){if(!de(t))throw new Error("The first parameter should be Function.")},be=function(t){return t&&1===t.nodeType};function Se(t,e){return window.getComputedStyle(t).getPropertyValue(e)}function Ee(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 Oe(t){if(t===window.document)return!0;if(!t||!t.parentNode)return!1;var e=t.parentNode,n=Se(t,"visibility"),a=Se(t,"display");return"hidden"!==n&&"none"!==a&&(!e||Oe(e))}var Te=function(){function t(e,n){var a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:window;if(Xt(this,t),!be(e))throw new Error("not an element node");this.ele=e,this.ref=n,this.refWin=a,this.started=!1,this.prevPerc=null,this.listeners={},this.removeScrollLisener=null,this.init()}return te(t,[{key:"init",value:function(){var t=this;if(!this.started){var e=ke(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=be(t)?t.getBoundingClientRect():t;return{top:be(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(!Ee(t,e)||!Oe(this.ele))return this.prevPerc=0,0;var n=0,a=0,r=0;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),1!==this.prevPerc&&1===r&&(this.$emit("fullyvisible"),this.prevPerc=r)}},{key:"destroy",value:function(){de(this.removeScrollLisener)&&this.removeScrollLisener()}}]),t}(),$e=["async","delay","watch","show","once","custom"];function je(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 xe(t,e,n,a,r,s){var i=this,c=e.value,o=e.arg,l=e.modifiers,u=e.rawName,v=n.context,p=n.componentInstance;if(!s[o])throw new Error("tracking event does not exist");var d=[],m=s[o].bind(null,v),h=function(e,n,a){return je.call(i,t,e,n,v,a)},f=function(){for(var t=arguments.length,e=new Array(t),n=0;n<t;n++)e[n]=arguments[n];return ge.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 ye.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](v)},c);else if(f("watch","delay")){var y=c.delay,C=re(c,["delay"]),_=ie(Object.keys(C)).pop();m=function(){t.$timer&&clearTimeout(t.$timer),t.$timer=setTimeout(function(){var t=Oe(v.$el);t&&s[o](v)},y)},h(_,m,{immediate:!0})}else if(k("show")){var w,b=fe(c),S=se(b,1),E=S[0],O=(w=s[o]).bind.apply(w,[null,v].concat(ie(E))),T=k("once"),$=k("custom");t.$visMonitor||setTimeout(function(){var e=new Te(t,$&&v.$refs[c.ref],c&&v.$refs[c.viewport]);(T?e.$once:e.$on).call(e,"fullyvisible",O),t.$visMonitor=e},0)}else if(!p&&l.click||p&&k("native")){switch(Qt(c)){case"object":var j,x=fe(c),V=se(x,2),P=V[0],N=V[1],M=P.shift(),A=ie(N).pop();we(M),m=(j=s[o]).bind.apply(j,[null,v].concat(ie(P))),d=[m,M.bind.apply(M,[null].concat(ie(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(!p||p.$el!==t)throw new Error("".concat(u," directive is not supported"));var W,H,R,D,B=Object.keys(l).filter(function(t){return!$e.includes(t)}).pop();if("object"===Qt(c)){var U=fe(c),I=se(U,2);W=I[0],H=I[1],R=W.shift(),D=ie(H).pop(),we(R)}if(t["$on_".concat(B)])return;p.$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,v].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](v,c)}function Ve(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])||(Pe.call(this,t),xe.call.apply(xe,[this,t].concat(n)))}}function Pe(t){t.$listener&&t.removeEventListener("click",t.$listener),t.$timer&&clearTimeout(t.$timer),t.$unwatch&&t.$unwatch(),t.$visMonitor&&t.$visMonitor.destroy()}var Ne=function(){function t(){Xt(this,t),this.installed=!1}return te(t,null,[{key:"install",value:function(t,e){var n=this,a=e.trackEvents,r=e.trackEnable,s=void 0===r?{}:r;s=ne({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=xe).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=Ve).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=Pe).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}();ee(Ne,"target",null);var Me=Ne,Ae=n("cebc"),We=(n("7f7f"),n("386d"),n("a481"),/\d\d?/),He=/\d{4}/,Re=/d{1,2}|M{1,2}|yy(?:yy)?|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g,De={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 日"},Be=function(t,e){t=String(t),e=e||2;while(t.length<e)t="0".concat(t);return t},Ue={yyyy:function(t){return Be(t.getFullYear(),4)},yy:function(t){return String(t.getFullYear()).substr(2)},M:function(t){return t.getMonth()+1},MM:function(t){return Be(t.getMonth()+1)},d:function(t){return t.getDate()},dd:function(t){return Be(t.getDate())},h:function(t){return t.getHours()%12||12},hh:function(t){return Be(t.getHours()%12||12)},H:function(t){return t.getHours()},HH:function(t){return Be(t.getHours())},m:function(t){return t.getMinutes()},mm:function(t){return Be(t.getMinutes())},s:function(t){return t.getSeconds()},ss:function(t){return Be(t.getSeconds())}},Ie=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=De[e]||e||De.default,e=e.replace(Re,function(e){return e in Ue?Ue[e](t):e.slice(1,e.length-1)}),e},Le={yyyy:[He,function(t,e){t.year=e}],yy:[We,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:[We,function(t,e){t.month=e-1}],d:[We,function(t,e){t.day=e}],h:[We,function(t,e){t.hour=e}],m:[We,function(t,e){t.minute=e}],s:[We,function(t,e){t.second=e}]};Le.MM=Le.M,Le.dd=Le.d,Le.hh=Le.h,Le.H=Le.h,Le.HH=Le.h,Le.mm=Le.m,Le.ss=Le.s;var Fe=n("a4bb"),Ke=n.n(Fe),qe=function(t){var e=Ke()(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 Ge(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=Object(Ae["a"])({evt:t},e,{action_time:Ie(P()())});"1"===t&&i()("统计UVPV埋点"),"2"===t&&i()({message:"统计页面停留时间埋点",customClass:"message-offset"}),r.a.success({title:"上报数据如下：",dangerouslyUseHTMLString:!0,message:qe(n),customClass:"notification__large",position:"1"===t||"2"===t?"top-left":"top-right"})}var ze={UVPV:function(){Ge("1")},TONP:function(t,e){var n=e.et,a=e.dt;Ge("2",{stt:"".concat((a-n)/1e3,"s")})},18015:function(t){var e=t.$route.name;Ge("18015",{source_page:e})},18016:function(t,e,n){var a=t.$route.name,r=e.id,s=n.target;Ge("18016",{id:r,source_page:a,target:s})},18017:function(t){var e=t.index,n=t.$route.name;Ge("18017",{source_page:n,index:e})},18018:function(t){var e=t.rest,n=t.$route.name;Ge("18018",{source_page:n,rest:e})},18019:function(t,e,n){var a=t.$route.name,r=e.id,s=n.target;Ge("18019",{id:r,source_page:a,target:s})},18020:function(t){var e=t.activeName,n=t.$route.name;Ge("18020",{source_page:n,active_name:e})},18021:function(t){var e=t.rest,n=t.$route.name;Ge("18021",{source_page:n,rest:e})},18022:function(t){var e=t.$route.name;Ge("18022",{source_page:e,description:"这是一个页面初始化埋点"})},18023:function(t){var e=t.$route.name;Ge("18023",{source_page:e})},18025:function(t){var e=t.rest1,n=t.$route.name;Ge("18025",{source_page:n,rest:e})},18026:function(t){var e=t.rest2,n=t.$route.name;Ge("18026",{source_page:n,rest:e})},18027:function(t){var e=t.$route.name;Ge("18027",{source_page:e,description:"我想被曝光无数次"})},18028:function(t){var e=t.$route.name;Ge("18028",{source_page:e,description:"我只想被曝光一次"})},18029:function(t){var e=t.$route.name;Ge("18029",{source_page:e,description:"我也想被曝光无数次"})}},Ye=Object(Ae["a"])({},ze);h["default"].use(f["a"]),h["default"].use(m.a),h["default"].use(p.a),h["default"].use(u.a),h["default"].use(o.a),h["default"].use(Me,{trackEvents:Ye,trackEnable:{UVPV:"routeUpdate",TONP:!0}}),h["default"].prototype.$message=i.a,h["default"].prototype.$notify=r.a;var Je=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:Jt},{path:"*",redirect:"/"}]});new h["default"]({el:"#app",router:Je,render:function(t){return t(b)}})}});
//# sourceMappingURL=app.3056726d.js.map