{"version":3,"sources":["webpack:///./src/views/home/components/campaign-insights.vue?82e5","webpack:///src/views/home/components/campaign-insights.vue","webpack:///./src/views/home/components/campaign-insights.vue?5501","webpack:///./src/views/home/components/campaign-insights.vue","webpack:///./src/views/home/components/campaign-insights.vue?0b75","webpack:///./src/helpers/chartTooltip.js","webpack:///./src/views/home/components/admin-overview.vue?9c1f","webpack:///src/views/home/components/admin-overview.vue","webpack:///./src/views/home/components/admin-overview.vue?ab19","webpack:///./src/views/home/components/admin-overview.vue","webpack:///./src/views/home/components/empty-state.vue?d408","webpack:///src/views/home/components/empty-state.vue","webpack:///./src/views/home/components/empty-state.vue?a0d3","webpack:///./src/views/home/components/empty-state.vue","webpack:///./src/views/home/components/empty-state.vue?15e9","webpack:///./src/views/home/components/admin-overview.vue?7858","webpack:///./src/views/home/components/home-page-map.vue?f48b","webpack:///./src/views/home/index.vue?3d59","webpack:///src/views/home/index.vue","webpack:///./src/views/home/index.vue?3720","webpack:///./src/views/home/index.vue","webpack:///./src/views/home/index.vue?93ab","webpack:///./src/views/home/components/home-page-map.vue?295e","webpack:///src/views/home/components/home-page-map.vue","webpack:///./src/views/home/components/home-page-map.vue?98a8","webpack:///./src/views/home/components/home-page-map.vue","webpack:///./src/views/home/components/device-chart.vue?757f","webpack:///src/views/home/components/device-chart.vue","webpack:///./src/views/home/components/device-chart.vue?6f2b","webpack:///./src/views/home/components/device-chart.vue","webpack:///./src/views/home/components/device-chart.vue?2d68"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","_v","ref","attrs","options","series","staticRenderFns","watch","$nextTick","computed","eventName","filterQuery","hasOwnProperty","action_type","label","data","on","chart","id","xaxis","type","yaxis","labels","formatter","self","$options","filters","addComma","value","tooltip","y","stroke","curve","legend","show","position","fontSize","fontWeight","fontFamily","showForSingleSeries","showForZeroSeries","itemMargin","horizontal","vertical","props","component","getTooltip","index","indexOf","seriesIndex","_e","_f","cards","fund","total","daily_cap","available_balance","consumption","accounts","active","inactive","verified","unverified","pending","campaigns","live","paused","completed","premium","ads","accepted","rejected","hold","under_review","from_date","$moment","subtract","format","to_date","methods","formatTime","time","accountHasCampaigns","Boolean","default","$can","getAnalytics","_m","_l","filter","key","refInFor","text","color","isFilterSelected","updateActiveFilter","mapWidth","mapHeight","geoInsights","scopedSlots","_u","fn","proxy","deviceChartKey","deviceChartData","displayColumn","staticStyle","selectedFilter","fromDate","endDate","components","Overview","CampaignInsights","AdminOverview","deviceChart","HomePageMap","ChartErrorMessage","defaultChartData","swap","arr","firstIndex","secondIndex","temp","updateDeviceChart","viewColumn","clearDeviceChart","setSelectedFilter","disableAllFiltersExcept","updateMap","$refs","clearMap","width","height","_t","Number","Array","filterValue","clearFilters","chartOptions","chartData","length","isEmptyChart","style","chartColors","device_type","chartIcons","_s","formatName","percentage","required","String","renderChart","mounted","name","charAt","toUpperCase","slice","reduce","i","colors","push","emptyChart","initData","dataLabels","enabled","states","hover","custom","w","globals"],"mappings":"8MAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,gBAAgB,CAACF,EAAG,MAAM,CAACE,YAAY,wBAAwB,CAACN,EAAIO,GAAG,uBAAuBH,EAAG,aAAa,CAACI,IAAI,gBAAgBC,MAAM,CAAC,KAAO,OAAO,QAAUT,EAAIU,QAAQ,OAASV,EAAIW,OAAO,OAAS,YAAY,IACzUC,EAAkB,G,YCWtB,GACEC,MAAO,CACLF,OADJ,WACA,WACMV,KAAKa,WAAU,WACb,IAAR,IACQ,EAAR,mDACQ,EAAR,8CACQ,EAAR,2CACQ,EAAR,mDACQ,EAAR,gDACQ,EAAR,iDACQ,EAAR,gDAIEC,SAAU,CACRC,UADJ,WAEM,OAAIf,KAAKgB,YAAYC,eAAe,eAC3BjB,KAAKgB,YAAYE,YAAYC,MAE7B,gBAIbC,KAxBF,WAyBI,IAAJ,OACI,MAAO,CACLC,IAAI,EACJZ,QAAS,CACPa,MAAO,CACLC,GAAI,oBAENC,MAAO,CACLC,KAAM,YAERC,MAAO,CACLC,OAAQ,CACNC,UADZ,SACA,GACc,OAAOC,EAAKC,SAASC,QAAQC,SAASC,MAI5CC,QAAS,CACPC,EAAG,CACDP,UADZ,SACA,KACc,OAAO,OAArB,OAAqB,CAArB,QAIQQ,OAAQ,CACNC,MAAO,UAETC,OAAQ,CACNC,MAAM,EACNC,SAAU,MACVC,SAAU,OACVC,WAAY,SACZC,WAAY,UACZC,qBAAqB,EACrBC,mBAAmB,EACnBC,WAAY,CACVC,WAAY,EACZC,SAAU,QAMpBC,MAAO,CAAC,SAAU,gBChFqW,I,wBCQrXC,EAAY,eACd,EACApD,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAuC,E,6CCnBf,W,6DCAA,kDAEaC,EAAa,SAAClB,EAAOmB,GAChC,OAA8C,IAA1C,CAAC,EAAG,EAAG,GAAGC,QAAQD,EAAME,aAEnBtB,eAASC,EAAO,MACsB,IAApC,CAAC,GAAGoB,QAAQD,EAAME,aAEpBtB,eAASC,EAAO,KAGhBD,eAASC,K,2CCXpB,IAAInC,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,qBAAqB,CAACF,EAAG,MAAM,CAACE,YAAY,kCAAkC,CAACF,EAAG,MAAM,CAACE,YAAY,sCAAsC,CAACN,EAAIO,GAAG,cAAcH,EAAG,MAAM,CAACE,YAAY,iCAAiC,CAAgFN,EAAIwD,MAAM,KAAKpD,EAAG,MAAM,CAACE,YAAY,+CAA+C,CAACF,EAAG,MAAM,CAACE,YAAY,iDAAiD,CAACN,EAAIO,GAAG,wBAAwBH,EAAG,yBAAyB,CAACE,YAAY,oCAAoCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAmBA,EAAI0D,MAAMC,KAAKC,MAAM,KAAK,SAAW,aAAa,GAAK,+BAA+B,KAAO,0BAA0B,gBAAkB,UAAU,MAAQ,UAAU,KAAO,iBAAiBxD,EAAG,yBAAyB,CAACE,YAAY,mDAAmDG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAmBA,EAAI0D,MAAMC,KAAKE,UAAU,KAAK,SAAW,YAAY,KAAO,mBAAmB,gBAAkB,UAAU,MAAQ,aAAazD,EAAG,yBAAyB,CAACE,YAAY,+BAA+BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAmBA,EAAI0D,MAAMC,KAAKG,kBAAkB,KAAK,SAAW,oBAAoB,GAAK,sCAAsC,KAAO,oBAAoB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,iBAAiB1D,EAAG,yBAAyB,CAACE,YAAY,+BAA+BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAmBA,EAAI0D,MAAMC,KAAKI,YAAY,KAAK,SAAW,cAAc,KAAO,gBAAgB,gBAAkB,UAAU,MAAQ,cAAc,GAAG3D,EAAG,MAAM,CAACE,YAAY,gEAAgE,CAACF,EAAG,MAAM,CAACE,YAAY,iDAAiD,CAACN,EAAIO,GAAG,4BAA4BH,EAAG,yBAAyB,CAACE,YAAY,4CAA4CG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMM,SAASJ,OAAS,GAAI,SAAW,eAAe,GAAK,iCAAiC,KAAO,iBAAiB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,eAAexD,EAAG,yBAAyB,CAACE,YAAY,4CAA4CG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMM,SAASC,QAAU,GAAI,SAAW,kBAAkB,GAAK,oCAAoC,KAAO,iBAAiB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,wBAAwB7D,EAAG,yBAAyB,CAACE,YAAY,+CAA+CG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMM,SAASE,UAAY,GAAI,SAAW,oBAAoB,GAAK,sCAAsC,KAAO,iBAAiB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,wBAAwB9D,EAAG,yBAAyB,CAACE,YAAY,uCAAuCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMM,SAASG,UAAY,GAAI,SAAW,oBAAoB,GAAK,sCAAsC,KAAO,aAAa,gBAAkB,UAAU,MAAQ,UAAU,KAAO,0BAA0B/D,EAAG,yBAAyB,CAACE,YAAY,uCAAuCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMM,SAASI,YAAc,GAAI,SAAW,sBAAsB,GAAK,wCAAwC,KAAO,iBAAiB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,0BAA0BhE,EAAG,yBAAyB,CAACE,YAAY,uCAAuCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMM,SAASK,SAAW,GAAI,SAAW,mBAAmB,GAAK,qCAAqC,KAAO,kBAAkB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,2BAA2B,GAAGjE,EAAG,MAAM,CAACE,YAAY,+CAA+C,CAACF,EAAG,MAAM,CAACE,YAAY,iDAAiD,CAACN,EAAIO,GAAG,6BAA6BH,EAAG,yBAAyB,CAACE,YAAY,oCAAoCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMY,UAAUV,OAAS,GAAI,SAAW,gBAAgB,GAAK,kCAAkC,KAAO,eAAe,gBAAkB,UAAU,MAAQ,UAAU,KAAO,sBAAsBxD,EAAG,yBAAyB,CAACE,YAAY,oCAAoCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMY,UAAUC,MAAQ,GAAI,SAAW,iBAAiB,GAAK,mCAAmC,KAAO,iBAAiB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,2CAA2CnE,EAAG,yBAAyB,CAACE,YAAY,+BAA+BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMY,UAAUE,QAAU,GAAI,SAAW,mBAAmB,GAAK,qCAAqC,KAAO,gBAAgB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,6CAA6CpE,EAAG,yBAAyB,CAACE,YAAY,+BAA+BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMY,UAAUG,WAAa,GAAI,SAAW,YAAY,GAAK,8BAA8B,KAAO,aAAa,gBAAkB,UAAU,MAAQ,UAAU,KAAO,gDAAgDrE,EAAG,yBAAyB,CAACE,YAAY,oCAAoCG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMY,UAAUI,SAAW,GAAI,SAAW,oBAAoB,GAAK,8BAA8B,KAAO,kBAAkB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,mCAAmC,GAAGtE,EAAG,MAAM,CAACE,YAAY,+CAA+C,CAACF,EAAG,MAAM,CAACE,YAAY,iDAAiD,CAACN,EAAIO,GAAG,uBAAuBH,EAAG,yBAAyB,CAACE,YAAY,4BAA4BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMiB,IAAIf,OAAS,GAAI,SAAW,YAAY,GAAK,8BAA8B,KAAO,eAAe,gBAAkB,UAAU,MAAQ,UAAU,KAAO,sBAAsBxD,EAAG,yBAAyB,CAACE,YAAY,4BAA4BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMiB,IAAIC,UAAY,GAAI,SAAW,WAAW,GAAK,6BAA6B,KAAO,eAAe,gBAAkB,UAAU,MAAQ,UAAU,KAAO,yCAAyCxE,EAAG,yBAAyB,CAACE,YAAY,uBAAuBG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMiB,IAAIE,UAAY,GAAI,SAAW,WAAW,GAAK,6BAA6B,KAAO,iBAAiB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,yCAAyCzE,EAAG,yBAAyB,CAACE,YAAY,uBAAuBG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMiB,IAAIG,MAAQ,GAAI,SAAW,OAAO,GAAK,yBAAyB,KAAO,gBAAgB,gBAAkB,UAAU,MAAQ,UAAU,KAAO,qCAAqC1E,EAAG,yBAAyB,CAACE,YAAY,+BAA+BG,MAAM,CAAC,MAAQT,EAAIyD,GAAG,WAAPzD,CAAoBA,EAAI0D,MAAMiB,IAAII,cAAgB,GAAI,SAAW,eAAe,GAAK,iCAAiC,gBAAkB,UAAU,MAAQ,UAAU,KAAO,kBAAkB,KAAO,8CAA8C,MACxqOnE,EAAkB,G,wBCmStB,GACES,KADF,WAEI,MAAO,CACLqC,MAAO,CACLC,KAAM,GACNK,SAAU,GACVM,UAAW,GACXK,IAAK,CACHf,MAAO,IAGX3C,YAAa,CACX+D,UAAW/E,KAAKgF,UAAUC,SAAS,EAAG,OAAOC,OAAO,cACpDC,QAASnF,KAAKgF,UAAUE,OAAO,iBAMrCE,QAAS,CACP,YADJ,oLACA,EADA,+BACA,CACA,8DACA,6CAHA,SAMA,6CANA,gBAMA,EANA,EAMA,KACA,YACA,sBARA,wGAaI,cAbJ,oEAaA,GAbA,iGAcA,kBACA,uCACA,qCAhBA,yGAoBIC,WApBJ,SAoBA,GACM,OAAOrF,KAAKgF,QAAQM,GAAMJ,OAAO,gBAIrC,QA5CF,2JA6CA,+BA7CA,gCA8CA,mBA9CA,yGCpSsX,I,wBCQlXhC,EAAY,eACd,EACApD,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAuC,E,kDCnBf,IAAIpD,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAQF,EAAuB,oBAAEI,EAAG,MAAM,CAACE,YAAY,+BAA+B,CAACF,EAAG,OAAO,CAACE,YAAY,iDAAiDF,EAAG,OAAO,CAACJ,EAAIO,GAAG,2EAA2EH,EAAG,MAAM,CAACE,YAAY,+BAA+B,CAACF,EAAG,OAAO,CAACE,YAAY,gDAAgDF,EAAG,OAAO,CAACJ,EAAIO,GAAG,iDACheK,EAAkB,GCmBtB,GACEsC,MAAO,CACLsC,oBAAqB,CACnB9D,KAAM+D,QACNC,SAAS,KCxBoW,I,wBCQ/WvC,EAAY,eACd,EACApD,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAuC,E,6CCnBf,W,sFCAA,W,kCCAA,W,2CCAA,IAAIpD,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAAEJ,EAAI2F,KAAK,sBAAuBvF,EAAG,MAAM,CAACA,EAAG,MAAM,CAACE,YAAY,QAAQ,CAACF,EAAG,WAAW,CAACK,MAAM,CAAC,MAAQT,EAAI0D,OAAOpC,GAAG,CAAC,OAAStB,EAAI4F,gBAAgBxF,EAAG,mBAAmB,CAACK,MAAM,CAAC,OAAST,EAAIuB,MAAM,YAAcvB,EAAIiB,gBAAgB,GAAGb,EAAG,MAAM,CAACE,YAAY,QAAQ,CAACF,EAAG,MAAM,CAACE,YAAY,+BAA+B,CAACN,EAAI6F,GAAG,GAAGzF,EAAG,MAAM,CAACE,YAAY,4BAA4B,CAACF,EAAG,MAAM,CAACE,YAAY,wBAAwB,CAACF,EAAG,MAAM,CAACE,YAAY,kCAAkCN,EAAI8F,GAAI9F,EAAW,SAAE,SAAS+F,GAAQ,OAAO3F,EAAG,qBAAqB,CAAC4F,IAAID,EAAO7D,MAAM1B,IAAIuF,EAAO7D,MAAM+D,UAAS,EAAK3F,YAAY,mCAAmCG,MAAM,CAAC,KAAOsF,EAAOG,KAAK,MAAQH,EAAOI,MAAM,MAAQJ,EAAO7D,MAAM,WAAalC,EAAIoG,iBAAiBL,EAAO7D,QAAQZ,GAAG,CAAC,QAAUtB,EAAIqG,yBAAwB,KAAKjG,EAAG,MAAM,CAACE,YAAY,gCAAgC,CAACF,EAAG,cAAc,CAACI,IAAI,MAAMC,MAAM,CAAC,GAAK,MAAM,QAAUT,EAAIgC,QAAQ,MAAQhC,EAAIsG,SAAS,OAAStG,EAAIuG,UAAU,YAAcvG,EAAIwG,aAAaC,YAAYzG,EAAI0G,GAAG,CAAC,CAACV,IAAI,wBAAwBW,GAAG,WAAW,MAAO,CAACvG,EAAG,oBAAoB,CAACK,MAAM,CAAC,oBAAsBT,EAAIwF,yBAAyBoB,OAAM,IAAO,MAAK,EAAM,eAAe,GAAGxG,EAAG,MAAM,CAACE,YAAY,gCAAgC,CAACN,EAAI6F,GAAG,GAAGzF,EAAG,cAAc,CAAC4F,IAAIhG,EAAI6G,eAAerG,IAAI,eAAeC,MAAM,CAAC,UAAYT,EAAI8G,gBAAgB,oBAAsB9G,EAAIwF,oBAAoB,cAAgBxF,EAAI+G,kBAAkB,WAAW/G,EAAIwD,KAAMxD,EAAI2F,KAAK,qBAAsBvF,EAAG,MAAM,CAACA,EAAG,kBAAkB,GAAGJ,EAAIwD,QAC7mD5C,EAAkB,CAAC,WAAa,IAAIZ,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,uBAAuB,CAACF,EAAG,KAAK,CAACJ,EAAIO,GAAG,iBAAiBH,EAAG,OAAO,CAACJ,EAAIO,GAAG,iEAAiE,WAAa,IAAIP,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,qBAAqB,CAACF,EAAG,OAAO,CAACE,YAAY,qBAAqB0G,YAAY,CAAC,MAAQ,YAAY,CAAChH,EAAIO,GAAG,kBAAkBH,EAAG,KAAK,CAACE,YAAY,gCAAgC,CAACN,EAAIO,GAAG,wDAAwDH,EAAG,IAAI,CAACJ,EAAIO,GAAG,iBAAiBP,EAAIO,GAAG,mB,0IC0E9oB,GACEc,KADF,WAEI,MAAO,CAEL4F,eAAgB,cAGhBX,SAAU,EACVC,UAAW,EACXC,YAAa,GAGbO,cAAe,cACfF,eAAgB,cAChBnD,MAAO,GACPzC,YAAa,GACbM,MAAO,GACP2F,SAAU,KACVC,QAAS,KACTL,gBAAiB,GACjBtB,qBAAN,IAGE4B,WAAY,CACVC,SAAJ,aACIC,iBAAJ,aACIC,cAAJ,aACIC,YAAJ,aACIC,YAAJ,aACIC,kBAAJ,cAEE,QA/BF,kKAgCA,kCAEA,+CACA,2BAEA,2BACA,mCACA,yDACA,6BACA,IAzCA,wGA8CErC,QAAS,CACP,sBADJ,+KAEA,qDACA,QACA,sBAJA,uBAEA,EAFA,EAEA,KAFA,oBAOA,sBAPA,mGASI,aATJ,gMASA,EATA,+BASA,GAEA,mBAEA,6BAEA,0BAfA,SAiBA,uCAjBA,OAiBA,EAjBA,OAmBA,kCACA,2BACA,4BAGA,iBACA,+CAEA,yCAEA,6CAEA,+CAEA,aAEA,mDAEA,sCAGA,wCAEA,yBAGA,sCAEA,oDAEA,yFAEA,GACA,UAGA,aACA,qCAEA,aACA,aACA,wCACA,OACA,YACA,gBAEA,OAjEA,wGAqEIsC,iBArEJ,SAqEA,GACM,MAAO,CACb,CACQ,KAAR,cACQ,KAAR,IAEA,CACQ,KAAR,SACQ,KAAR,IAEA,CACQ,KAAR,MACQ,KAAR,IAEA,CACQ,KAAR,WACQ,KAAR,IAEA,CACQ,KAAR,cACQ,KAAR,IAEA,CACQ,KAAR,QACQ,KAAR,IAEA,CACQ,KAAR,EACQ,KAAR,IAEA,CACQ,KAAR,MACQ,KAAR,MAIIC,KAzGJ,SAyGA,OACM,IAAN,OAGM,OAFAC,EAAIC,GAAcD,EAAIE,GACtBF,EAAIE,GAAeC,EACZH,GAET,mBA/GJ,kLA+GA,EA/GA,+BA+GA,GACA,uBACA,sBACA,4BAlHA,SAmHA,+CAnHA,OAmHA,EAnHA,OAoHA,iBACA,6BACA,qCAtHA,wGAyHII,kBAzHJ,SAyHA,GACMhI,KAAK8G,cAAgBmB,EACrBjI,KAAK4G,eAAiBqB,GAExBC,iBA7HJ,WA8HMlI,KAAK8G,cAAgB,KACrB9G,KAAK4G,eAAiB,QAIxBR,mBAnIJ,YAmIA,yBACUpC,IACFhE,KAAKmI,kBAAkBlG,GACvBjC,KAAKoI,wBAAwBnG,GAC7BjC,KAAKqI,UAAUpG,GACfjC,KAAKgI,kBAAkB/F,KAI3BkG,kBA5IJ,SA4IA,GACMnI,KAAKgH,eAAiBlB,GAIxBK,iBAjJJ,SAiJA,GACM,OAAOnG,KAAKgH,iBAAmBlB,GAIjCsC,wBAtJJ,SAsJA,cACMpI,KAAK+B,QAAQ+D,QAAO,SAA1B,8CACQ,EAAR,gCAIIuC,UA5JJ,SA4JA,GACMrI,KAAKsI,MAAM,OAAOD,UAAUvC,IAG9ByC,SAhKJ,WAiKMvI,KAAKsI,MAAM,OAAOC,YAGpB,mBApKJ,oLAoKA,EApKA,+BAoKA,GApKA,SAqKA,kDArKA,gBAqKA,EArKA,EAqKA,KACA,YACA,4BAvKA,yGA8KEzH,SAAU,CAERiB,QAFJ,WAGM,MAAO,CACb,CACQ,MAAR,UACQ,KAAR,cACQ,MAAR,eAEA,CACQ,MAAR,UACQ,KAAR,SACQ,MAAR,UAEA,CACQ,MAAR,UACQ,KAAR,QACQ,MAAR,aCxT8V,I,wBCQ1VmB,EAAY,eACd,EACApD,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAuC,E,6CCnBf,W,2FCAA,IAAIpD,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,gBAAgB,CAACF,EAAG,uBAAuB,CAACI,IAAI,MAAMC,MAAM,CAAC,MAAQT,EAAIyI,MAAM,OAASzI,EAAI0I,OAAO,YAAc1I,EAAIwG,YAAY,QAAUxG,EAAIgC,SAASyE,YAAYzG,EAAI0G,GAAG,CAAC,CAACV,IAAI,wBAAwBW,GAAG,WAAW,MAAO,CAAC3G,EAAI2I,GAAG,2BAA2B/B,OAAM,IAAO,MAAK,MAAS,IAC9YhG,EAAkB,GCgBtB,G,oBAAA,CACEsC,MAAO,CACLuF,MAAO,CACL/G,KAAMkH,QAERF,OAAJ,CACMhH,KAAMkH,OACNlD,QAAS,KAEX1D,QAAS,CACPN,KAAMmH,OAERrC,YAAa,CACX9E,KAAMmH,QAIVxD,QAAS,CAEPgD,wBAFJ,SAEA,cACMpI,KAAK+B,QAAQ+D,QAAO,SAA1B,8CACQ,EAAR,gCAIIuC,UARJ,SAQA,GACMrI,KAAKsI,MAAM,OAAOH,kBAAkBU,IAGtCN,SAZJ,WAaMvI,KAAKsI,MAAM,OAAOQ,mBC/C6V,I,wBCQjX5F,EAAY,eACd,EACApD,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAuC,E,kDCnBf,IAAIpD,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACE,YAAY,gBAAgB,CAACF,EAAG,aAAa,CAACI,IAAI,cAAcF,YAAY,OAAOG,MAAM,CAAC,KAAO,QAAQ,QAAUT,EAAIgJ,aAAa,OAAShJ,EAAIW,UAAUP,EAAG,MAAM,CAACE,YAAY,mBAAmB,GAAEN,EAAIiJ,UAAUC,OAAS,IAA4B,QAAtBjJ,KAAK8G,eAA4B9G,KAAK8G,eAAmB/G,EAAImJ,aAAwlB/I,EAAG,MAAMJ,EAAI8F,GAAI9F,EAAY,UAAE,SAASkC,EAAMmB,GAAO,OAAOjD,EAAG,OAAO,CAAC4F,IAAI3C,EAAM/C,YAAY,yBAAyB,CAACF,EAAG,UAAU,CAACE,YAAY,OAAO8I,MAAM,CAAEjD,MAAMnG,EAAIqJ,YAAYnH,EAAMoH,cAAe7I,MAAM,CAAC,KAAOT,EAAIuJ,WAAWrH,EAAMoH,aAAa,YAAY,aAAalJ,EAAG,OAAO,CAAC4G,YAAY,CAAC,SAAW,WAAW,OAAS,QAAQ,CAAC5G,EAAG,OAAO,CAAC4G,YAAY,CAAC,MAAQ,UAAU,QAAU,QAAQ,CAAChH,EAAIO,GAAGP,EAAIwJ,GAAGxJ,EAAIyJ,WAAWvH,EAAMoH,iBAAiBlJ,EAAG,OAAO,CAACE,YAAY,yBAAyB,CAACN,EAAIO,GAAGP,EAAIwJ,GAAGtH,EAAMwH,YAAY,UAAU,MAAK,GAA/mCtJ,EAAG,MAAMJ,EAAI8F,GAAI9F,EAAa,WAAE,SAASkC,EAAMmB,GAAO,OAAOjD,EAAG,OAAO,CAAC4F,IAAI3C,EAAM/C,YAAY,yBAAyB,CAACF,EAAG,UAAU,CAACE,YAAY,OAAO8I,MAAM,CAAEjD,MAAMnG,EAAIqJ,YAAYnH,EAAMoH,cAAe7I,MAAM,CAAC,KAAOT,EAAIuJ,WAAWrH,EAAMoH,aAAa,YAAY,aAAalJ,EAAG,OAAO,CAAC4G,YAAY,CAAC,SAAW,WAAW,OAAS,QAAQ,CAAC5G,EAAG,OAAO,CAAC4G,YAAY,CAAC,MAAQ,UAAU,QAAU,QAAQ,CAAChH,EAAIO,GAAGP,EAAIwJ,GAAGxJ,EAAIyJ,WAAWvH,EAAMoH,iBAAiBlJ,EAAG,OAAO,CAACE,YAAY,yBAAyB,CAACN,EAAIO,GAAGP,EAAIwJ,GAAwB,QAArBtH,EAAMwH,WAAuB,EAAIxH,EAAMwH,YAAY,UAAU,MAAK,MAA8iB,IACzgD9I,EAAkB,G,wBCmBtB,GACEsC,MAAO,CACL+F,UAAW,CACTvH,KAAMmH,MACNc,UAAU,GAEZ5C,cAAJ,CACMrF,KAAMkI,OACND,UAAU,GAEZnE,oBAAqB,CACnB9D,KAAM+D,QACNC,SAAS,IAGb7E,MAAO,CACLoI,UADJ,WAEMhJ,KAAK4J,eAEP9C,cAJJ,WAKM9G,KAAK4J,gBAGTC,QAvBF,WAwBI7J,KAAK4J,eAEPxE,QAAS,CACPoE,WADJ,SACA,GACM,MAAgB,QAATM,EAAiB,MAAQA,EAAKC,OAAO,GAAGC,cAAgBF,EAAKG,MAAM,IAE5E,WAJJ,+JAKA,4CACA,oBACA,2BACA,2EACA,sBAEA,qBACA,mBACA,mBACA,mBACA,WACA,SACA,OADA,WAEA,uOAEA,oCAFA,iDAEA,EAFA,sCAGA,EAHA,6CAlBA,wGA4BIL,YA5BJ,WA4BA,WACM5J,KAAKkJ,cAAe,EACpB,IAAN,KACA,KACA,KACA,IAEM,GAA8B,IAA1BlJ,KAAKgJ,UAAUC,QAAiBjJ,KAAK8G,eAA/C,4BAAM,CAIAnD,EAAQ3D,KAAKgJ,UAAUkB,QAAO,SAApC,sCACM,IAAK,IAAX,iCAGQ,GAFAlK,KAAKgJ,UAAUmB,GAAGV,YAAc,KAAxC,mDACQW,EAAOC,KAAKrK,KAAKoJ,YAAYpJ,KAAKgJ,UAAUmB,GAAGd,cACV,QAAjCrJ,KAAKgJ,UAAUmB,GAAGV,WAEpB,YADAzJ,KAAKsK,aAGP3I,EAAO0I,KAAKrK,KAAKgJ,UAAUmB,GAAGd,aAC9B3I,EAAO2J,KAAKrK,KAAKgJ,UAAUmB,GAAGnK,KAAK8G,gBAErC9G,KAAK+I,aAAe,CAClBpH,OAAR,EACQyI,OAAR,EACQ1J,OAAR,QAjBQV,KAAKsK,eAqBXlJ,KAnFF,WAoFI,IAAJ,iBACI,MAAO,CACL8H,cAAc,EACdqB,SAAN,CACA,CACQ,YAAR,UACQ,YAAR,EACQ,OAAR,EACQ,MAAR,EACQ,WAAR,GAEA,CACQ,YAAR,MACQ,YAAR,EACQ,OAAR,EACQ,MAAR,EACQ,WAAR,GAEA,CACQ,YAAR,UACQ,YAAR,EACQ,OAAR,EACQ,MAAR,EACQ,WAAR,IAGMnB,YAAN,CACQ,QAAR,UACQ,IAAR,UACQ,QAAR,WAEME,WAAN,CACQ,QAAR,kBACQ,IAAR,mBACQ,QAAR,oBAEM5I,OAAQ,GACRqI,aAAc,CACZzH,MAAO,CACLG,KAAM,QACN+G,MAAV,KAEQlG,OAAQ,CACNC,MAAM,EACNC,SAAU,UAEZgI,WAAY,CACVC,SAAS,GAEX9I,OAAQ,GACRyI,OAAR,GACQM,OAAQ,CACNC,MAAO,CACL7E,OAAQ,CACNrE,KAAM,UAIZS,QAAS,CACP0I,OADV,YAYY,IAXZ,0BACA,GACc,QAAd,UACc,IAAd,UACc,QAAd,WAEA,GACc,QAAd,kBACc,IAAd,mBACc,QAAd,oBAEA,mBACc,GAAI5B,EAAUmB,GAAGd,cAAgBwB,EAAEC,QAAQnJ,OAAO2B,GAChD,MAAO,kJAAvB,OAEA,oBAFA,sCAEA,oBAFA,YAEA,4CAFA,4GAGA,kGAHA,8EAIA,gBAJA,qNASA,4BATA,qOAYA,6BAZA,4KAeA,kCAfA,qEChLoX,I,wBCQhXJ,EAAY,eACd,EACApD,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAAuC,E,2CCnBf,W","file":"js/chunk-3faa4a84.13930c6a.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"px-5 md:px-8\"},[_c('div',{staticClass:\"title mb-10 md:title\"},[_vm._v(\"Campaign Insights\")]),_c('ApexCharts',{ref:\"campaignChart\",attrs:{\"type\":\"line\",\"options\":_vm.options,\"series\":_vm.series,\"height\":\"500px\"}})],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"px-5 md:px-8\">\n    <div class=\"title mb-10 md:title\">Campaign Insights</div>\n    <!-- Chart  -->\n    <ApexCharts ref=\"campaignChart\" type=\"line\" :options=\"options\" :series=\"series\" height=\"500px\"></ApexCharts>\n  </div>\n</template>\n\n<script>\n\nimport {getTooltip} from '@/helpers/chartTooltip.js'\n\nexport default {\n  watch: {\n    series () {\n      this.$nextTick(() => {\n        const self = this\n        this.$refs['campaignChart'].toggleSeries('Impressions')\n        this.$refs['campaignChart'].toggleSeries('Clicks')\n        this.$refs['campaignChart'].toggleSeries('CTR')\n        this.$refs['campaignChart'].toggleSeries('Video Views')\n        this.$refs['campaignChart'].toggleSeries('Avg. CPC')\n        this.$refs['campaignChart'].toggleSeries(self.eventName)\n        this.$refs['campaignChart'].toggleSeries('CPA')\n      })\n    }\n  },\n  computed: {\n    eventName () {\n      if (this.filterQuery.hasOwnProperty('action_type')) {\n        return this.filterQuery.action_type.label\n      } else {\n        return 'Conversions'\n      }\n    }\n  },\n  data () {\n    const self = this // this is only to reference the vue into ApexChart\n    return {\n      on: true,\n      options: {\n        chart: {\n          id: 'vuechart-example'\n        },\n        xaxis: {\n          type: 'category'\n        },\n        yaxis: {\n          labels: {\n            formatter (value) {\n              return self.$options.filters.addComma(value)\n            }\n          }\n        },\n        tooltip: {\n          y: {\n            formatter (value, index) {\n              return getTooltip(value, index)\n            }\n          }\n        },\n        stroke: {\n          curve: 'smooth'\n        },\n        legend: {\n          show: true,\n          position: 'top',\n          fontSize: '14px',\n          fontWeight: 'normal',\n          fontFamily: 'Poppins',\n          showForSingleSeries: true,\n          showForZeroSeries: true,\n          itemMargin: {\n            horizontal: 5,\n            vertical: 10\n          }\n        }\n      }\n    }\n  },\n  props: ['series', 'filterQuery']\n}\n</script>\n\n\n<style lang=\"scss\" scoped>\n.title {\n  font-style: normal;\n  font-weight: 500;\n  font-size: 18px;\n  line-height: 27px;\n  letter-spacing: 0.1px;\n  color: #2c2c2c;\n}\n\n.sub-title {\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 21px;\n  letter-spacing: 0.1px;\n  color: rgba(44, 44, 44, 0.7);\n}\n\n/deep/ .apexcharts-toolbar {\n  display: none;\n}\n\n/deep/ .apexcharts-legend-series {\n  width: calc(50% - 20px);\n}\n\n/deep/ .apexcharts-legend {\n  justify-content: space-between !important;\n}\n\n@media (min-width: 768px) {\n  .md\\:title {\n    font-style: normal;\n    font-weight: 500;\n    font-size: 24px;\n    line-height: 36px;\n    letter-spacing: 0.1px;\n    color: #2c2c2c;\n  }\n\n  .md\\:sub-title {\n    font-style: normal;\n    font-weight: normal;\n    font-size: 14px;\n    line-height: 21px;\n    letter-spacing: 0.1px;\n    color: rgba(44, 44, 44, 0.7);\n  }\n\n  /deep/ .apexcharts-legend-series {\n    width: auto;\n  }\n}\n\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./campaign-insights.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./campaign-insights.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./campaign-insights.vue?vue&type=template&id=0a04c5d2&scoped=true&\"\nimport script from \"./campaign-insights.vue?vue&type=script&lang=js&\"\nexport * from \"./campaign-insights.vue?vue&type=script&lang=js&\"\nimport style0 from \"./campaign-insights.vue?vue&type=style&index=0&id=0a04c5d2&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"0a04c5d2\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./campaign-insights.vue?vue&type=style&index=0&id=0a04c5d2&lang=scss&scoped=true&\"","import addComma from '@/filters/addComma'\n\nexport const getTooltip = (value, index) => {\n  if ([7, 5, 3].indexOf(index.seriesIndex) !== -1) {\n    // 7 >> CPA 6 >> Spent 3 >> AVG. CPC\n    return addComma(value, '$')\n  } else if ([2].indexOf(index.seriesIndex) !== -1) {\n    // 2 >> CTR\n    return addComma(value, '%')\n  } else {\n    // Rest\n    return addComma(value)\n  }\n}","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"px-5 py-8 lg:px-8\"},[_c('div',{staticClass:\"flex flex-wrap lg:flex-no-wrap\"},[_c('div',{staticClass:\"title w-full mb-8 lg:mb-8 lg:title\"},[_vm._v(\"Overview\")]),_c('div',{staticClass:\"w-full mb-4 lg:mb-5 lg:filter\"},[(false)?_c('speakol-date-range-picker',{on:{\"date-change\":_vm.setDateFilter}}):_vm._e()],1)]),_c('div',{staticClass:\"flex flex-wrap justify-between card lg:card\"},[_c('div',{staticClass:\"flex justify-start w-full title mb-8 lg:title\"},[_vm._v(\"\\n      Fund\\n    \")]),_c('speakol-analytics-card',{staticClass:\"sub-card mb-6 lg:mb-0 lg:sub-card\",attrs:{\"title\":_vm._f(\"addComma\")(_vm.cards.fund.total,'$'),\"subTitle\":\"Total Fund\",\"id\":\"home-admin-total-fund-button\",\"icon\":\"speakol-fund-accounting\",\"backgroundColor\":\"#DFF2FA\",\"color\":\"#0092D7\",\"link\":\"/admin/fund\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:mb-0 lg:sub-card daily-cap-card\",attrs:{\"title\":_vm._f(\"addComma\")(_vm.cards.fund.daily_cap,'$'),\"subTitle\":\"Daily Cap\",\"icon\":\"speakol-calendar\",\"backgroundColor\":\"#E4F7E9\",\"color\":\"#21BA45\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")(_vm.cards.fund.available_balance,'$'),\"subTitle\":\"Available Balance\",\"id\":\"home-admin-available-balance-button\",\"icon\":\"speakol-us-dollar\",\"backgroundColor\":\"#FDF5E1\",\"color\":\"#F2AF03\",\"link\":\"/admin/fund\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")(_vm.cards.fund.consumption,'$'),\"subTitle\":\"Consumption\",\"icon\":\"speakol-money\",\"backgroundColor\":\"#FBE5E5\",\"color\":\"#DB2828\"}})],1),_c('div',{staticClass:\"flex flex-wrap card justify-between lg:justify-start lg:card\"},[_c('div',{staticClass:\"flex justify-start w-full title mb-8 lg:title\"},[_vm._v(\"\\n      Accounts\\n    \")]),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:mb-4 lg:sub-card lg:mr-4\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.accounts.total || 0)),\"subTitle\":\"All Accounts\",\"id\":\"home-admin-all-accounts-button\",\"icon\":\"speakol-people\",\"backgroundColor\":\"#DFF2FA\",\"color\":\"#0092D7\",\"link\":\"/accounts\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:mb-4 lg:mr-4 lg:sub-card\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.accounts.active || 0)),\"subTitle\":\"Active Accounts\",\"id\":\"home-admin-active-accounts-button\",\"icon\":\"speakol-active\",\"backgroundColor\":\"#E4F7E9\",\"color\":\"#21BA45\",\"link\":\"/accounts?active=1\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0 lg:mr-4 lg:mb-4\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.accounts.inactive || 0)),\"subTitle\":\"Inactive Accounts\",\"id\":\"home-admin-inactive-accounts-button\",\"icon\":\"speakol-active\",\"backgroundColor\":\"#FBE5E5\",\"color\":\"#DB2828\",\"link\":\"/accounts?active=0\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mr-4 lg:mb-4\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.accounts.verified || 0)),\"subTitle\":\"Verified Accounts\",\"id\":\"home-admin-verified-accounts-button\",\"icon\":\"speakol-ok\",\"backgroundColor\":\"#F3EAFB\",\"color\":\"#9B51E0\",\"link\":\"/accounts?verified=1\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mr-4 lg:mb-4\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.accounts.unverified || 0)),\"subTitle\":\"Unverified Accounts\",\"id\":\"home-admin-unverified-accounts-button\",\"icon\":\"speakol-cancel\",\"backgroundColor\":\"#FBE5E5\",\"color\":\"#DB2828\",\"link\":\"/accounts?verified=3\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mr-4 lg:mb-4\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.accounts.pending || 0)),\"subTitle\":\"Pending Accounts\",\"id\":\"home-admin-pending-accounts-button\",\"icon\":\"speakol-warning\",\"backgroundColor\":\"#FDF5E1\",\"color\":\"#F2AF03\",\"link\":\"/accounts?verified=2\"}})],1),_c('div',{staticClass:\"flex flex-wrap justify-between card lg:card\"},[_c('div',{staticClass:\"flex justify-start w-full title mb-8 lg:title\"},[_vm._v(\"\\n      Campaigns\\n    \")]),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.campaigns.total || 0)),\"subTitle\":\"All Campaigns\",\"id\":\"home-admin-all-campaigns-button\",\"icon\":\"speakol-horn\",\"backgroundColor\":\"#DFF2FA\",\"color\":\"#0092D7\",\"link\":\"/campaigns/admin\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.campaigns.live || 0)),\"subTitle\":\"Live Campaigns\",\"id\":\"home-admin-live-campaigns-button\",\"icon\":\"speakol-active\",\"backgroundColor\":\"#E4F7E9\",\"color\":\"#21BA45\",\"link\":\"/campaigns/admin?campaign-status=live\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.campaigns.paused || 0)),\"subTitle\":\"Paused Campaigns\",\"id\":\"home-admin-paused-campaigns-button\",\"icon\":\"speakol-pause\",\"backgroundColor\":\"#FDF5E1\",\"color\":\"#F2AF03\",\"link\":\"/campaigns/admin?campaign-status=paused\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.campaigns.completed || 0)),\"subTitle\":\"Completed\",\"id\":\"home-admin-completed-button\",\"icon\":\"speakol-ok\",\"backgroundColor\":\"#F3EAFB\",\"color\":\"#9B51E0\",\"link\":\"/campaigns/admin?campaign-status=completed\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0 mt-5\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.campaigns.premium || 0)),\"subTitle\":\"Premium Campaigns\",\"id\":\"home-admin-completed-button\",\"icon\":\"speakol-premium\",\"backgroundColor\":\"#FDF5E1\",\"color\":\"#FFBB07\",\"link\":\"/campaigns/admin?tag=premium\"}})],1),_c('div',{staticClass:\"flex flex-wrap justify-between card lg:card\"},[_c('div',{staticClass:\"flex justify-start w-full title mb-8 lg:title\"},[_vm._v(\"\\n      Ads\\n    \")]),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:sub-card\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.ads.total || 0)),\"subTitle\":\"Total Ads\",\"id\":\"home-admin-total-ads-button\",\"icon\":\"speakol-horn\",\"backgroundColor\":\"#DFF2FA\",\"color\":\"#0092D7\",\"link\":\"/campaigns/admin\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card mb-4 lg:sub-card\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.ads.accepted || 0)),\"subTitle\":\"Accepted\",\"id\":\"home-admin-accepted-button\",\"icon\":\"speakol-save\",\"backgroundColor\":\"#E4F7E9\",\"color\":\"#21BA45\",\"link\":\"/campaigns/admin?ad-status=accepted\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.ads.rejected || 0)),\"subTitle\":\"Rejected\",\"id\":\"home-admin-rejected-button\",\"icon\":\"speakol-cancel\",\"backgroundColor\":\"#FBE5E5\",\"color\":\"#DB2828\",\"link\":\"/campaigns/admin?ad-status=rejected\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.ads.hold || 0)),\"subTitle\":\"Hold\",\"id\":\"home-admin-hold-button\",\"icon\":\"speakol-pause\",\"backgroundColor\":\"#FDF5E1\",\"color\":\"#F2AF03\",\"link\":\"/campaigns/admin?ad-status=hold\"}}),_c('speakol-analytics-card',{staticClass:\"sub-card lg:sub-card lg:mb-0\",attrs:{\"title\":_vm._f(\"addComma\")((_vm.cards.ads.under_review || 0)),\"subTitle\":\"Under Review\",\"id\":\"home-admin-under-review-button\",\"backgroundColor\":\"#FDF5E1\",\"color\":\"#F2AF03\",\"icon\":\"speakol-warning\",\"link\":\"/campaigns/admin?ad-status=under_review\"}})],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"px-5 py-8 lg:px-8\">\n\n    <div class=\"flex flex-wrap lg:flex-no-wrap\">\n      <div class=\"title w-full mb-8 lg:mb-8 lg:title\">Overview</div>\n      <div class=\"w-full mb-4 lg:mb-5 lg:filter\">\n        <speakol-date-range-picker v-if=\"false\"\n                                   v-on:date-change=\"setDateFilter\"\n        >\n        </speakol-date-range-picker>\n      </div>\n    </div>\n    <!-- Fund Card -->\n    <div class=\"flex flex-wrap justify-between card lg:card\">\n\n      <div class=\"flex justify-start w-full title mb-8 lg:title\">\n        Fund\n      </div>\n\n\n      <speakol-analytics-card\n        :title=\"cards.fund.total | addComma('$')\"\n        subTitle=\"Total Fund\"\n        id=\"home-admin-total-fund-button\"\n        icon=\"speakol-fund-accounting\"\n        backgroundColor=\"#DFF2FA\"\n        color=\"#0092D7\"\n        class=\"sub-card mb-6 lg:mb-0 lg:sub-card\"\n        link=\"/admin/fund\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"cards.fund.daily_cap | addComma('$')\"\n        subTitle=\"Daily Cap\"\n        icon=\"speakol-calendar\"\n        backgroundColor=\"#E4F7E9\"\n        color=\"#21BA45\"\n        class=\"sub-card mb-4 lg:mb-0 lg:sub-card daily-cap-card\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"cards.fund.available_balance | addComma('$')\"\n        subTitle=\"Available Balance\"\n        id=\"home-admin-available-balance-button\"\n        icon=\"speakol-us-dollar\"\n        backgroundColor=\"#FDF5E1\"\n        color=\"#F2AF03\"\n        class=\"sub-card lg:sub-card lg:mb-0\"\n        link=\"/admin/fund\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"cards.fund.consumption | addComma('$')\"\n        subTitle=\"Consumption\"\n        icon=\"speakol-money\"\n        backgroundColor=\"#FBE5E5\"\n        color=\"#DB2828\"\n        class=\"sub-card lg:sub-card lg:mb-0\"\n      >\n      </speakol-analytics-card>\n\n    </div>\n\n    <!-- Accounts Card -->\n    <div class=\"flex flex-wrap card justify-between lg:justify-start lg:card\">\n\n      <div class=\"flex justify-start w-full title mb-8 lg:title\">\n        Accounts\n      </div>\n\n\n      <speakol-analytics-card\n        :title=\"(cards.accounts.total || 0) | addComma\"\n        subTitle=\"All Accounts\"\n        id=\"home-admin-all-accounts-button\"\n        icon=\"speakol-people\"\n        backgroundColor=\"#DFF2FA\"\n        color=\"#0092D7\"\n        class=\"sub-card mb-4 lg:mb-4 lg:sub-card lg:mr-4\"\n        link=\"/accounts\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.accounts.active || 0) | addComma\"\n        subTitle=\"Active Accounts\"\n        id=\"home-admin-active-accounts-button\"\n        icon=\"speakol-active\"\n        backgroundColor=\"#E4F7E9\"\n        color=\"#21BA45\"\n        class=\"sub-card mb-4 lg:mb-4 lg:mr-4 lg:sub-card\"\n        link=\"/accounts?active=1\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.accounts.inactive || 0) | addComma\"\n        subTitle=\"Inactive Accounts\"\n        id=\"home-admin-inactive-accounts-button\"\n        icon=\"speakol-active\"\n        backgroundColor=\"#FBE5E5\"\n        color=\"#DB2828\"\n        class=\"sub-card lg:sub-card lg:mb-0 lg:mr-4 lg:mb-4\"\n        link=\"/accounts?active=0\"\n      >\n      </speakol-analytics-card>\n\n       <speakol-analytics-card\n        :title=\"(cards.accounts.verified || 0) | addComma\"\n        subTitle=\"Verified Accounts\"\n        id=\"home-admin-verified-accounts-button\"\n        icon=\"speakol-ok\"\n        backgroundColor=\"#F3EAFB\"\n        color=\"#9B51E0\"\n        class=\"sub-card lg:sub-card lg:mr-4 lg:mb-4\"\n        link=\"/accounts?verified=1\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.accounts.unverified || 0) | addComma\"\n        subTitle=\"Unverified Accounts\"\n        id=\"home-admin-unverified-accounts-button\"\n        icon=\"speakol-cancel\"\n        backgroundColor=\"#FBE5E5\"\n        color=\"#DB2828\"\n        class=\"sub-card lg:sub-card lg:mr-4 lg:mb-4\"\n        link=\"/accounts?verified=3\"\n      >\n      </speakol-analytics-card>\n\n       <speakol-analytics-card\n        :title=\"(cards.accounts.pending || 0) | addComma\"\n        subTitle=\"Pending Accounts\"\n        id=\"home-admin-pending-accounts-button\"\n        icon=\"speakol-warning\"\n        backgroundColor=\"#FDF5E1\"\n        color=\"#F2AF03\"\n        class=\"sub-card lg:sub-card lg:mr-4 lg:mb-4\"\n        link=\"/accounts?verified=2\"\n      >\n      </speakol-analytics-card>\n\n    </div>\n\n    <!-- Campaigns Card -->\n    <div class=\"flex flex-wrap justify-between card lg:card\">\n\n      <div class=\"flex justify-start w-full title mb-8 lg:title\">\n        Campaigns\n      </div>\n\n\n      <speakol-analytics-card\n        :title=\"(cards.campaigns.total || 0) | addComma\"\n        subTitle=\"All Campaigns\"\n        id=\"home-admin-all-campaigns-button\"\n        icon=\"speakol-horn\"\n        backgroundColor=\"#DFF2FA\"\n        color=\"#0092D7\"\n        class=\"sub-card mb-4 lg:sub-card lg:mb-0\"\n        link=\"/campaigns/admin\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.campaigns.live || 0) | addComma\"\n        subTitle=\"Live Campaigns\"\n        id=\"home-admin-live-campaigns-button\"\n        icon=\"speakol-active\"\n        backgroundColor=\"#E4F7E9\"\n        color=\"#21BA45\"\n        class=\"sub-card mb-4 lg:sub-card lg:mb-0\"\n        link=\"/campaigns/admin?campaign-status=live\">\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.campaigns.paused || 0) | addComma\"\n        subTitle=\"Paused Campaigns\"\n        id=\"home-admin-paused-campaigns-button\"\n        icon=\"speakol-pause\"\n        backgroundColor=\"#FDF5E1\"\n        color=\"#F2AF03\"\n        class=\"sub-card lg:sub-card lg:mb-0\"\n        link=\"/campaigns/admin?campaign-status=paused\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.campaigns.completed || 0) | addComma\"\n        subTitle=\"Completed\"\n        id=\"home-admin-completed-button\"\n        icon=\"speakol-ok\"\n        backgroundColor=\"#F3EAFB\"\n        color=\"#9B51E0\"\n        class=\"sub-card lg:sub-card lg:mb-0\"\n        link=\"/campaigns/admin?campaign-status=completed\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.campaigns.premium || 0) | addComma\"\n        subTitle=\"Premium Campaigns\"\n        id=\"home-admin-completed-button\"\n        icon=\"speakol-premium\"\n        backgroundColor=\"#FDF5E1\"\n        color=\"#FFBB07\"\n        class=\"sub-card lg:sub-card lg:mb-0 mt-5\"\n        link=\"/campaigns/admin?tag=premium\"\n      >\n      </speakol-analytics-card>\n\n    </div>\n\n    <!-- Ads Card -->\n    <div class=\"flex flex-wrap justify-between card lg:card\">\n\n      <div class=\"flex justify-start w-full title mb-8 lg:title\">\n        Ads\n      </div>\n\n\n      <speakol-analytics-card\n        :title=\"(cards.ads.total || 0) | addComma\"\n        subTitle=\"Total Ads\"\n        id=\"home-admin-total-ads-button\"\n        icon=\"speakol-horn\"\n        backgroundColor=\"#DFF2FA\"\n        color=\"#0092D7\"\n        class=\"sub-card mb-4 lg:sub-card\"\n        link=\"/campaigns/admin\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.ads.accepted || 0) | addComma\"\n        subTitle=\"Accepted\"\n        id=\"home-admin-accepted-button\"\n        icon=\"speakol-save\"\n        backgroundColor=\"#E4F7E9\"\n        color=\"#21BA45\"\n        class=\"sub-card mb-4 lg:sub-card\"\n        link=\"/campaigns/admin?ad-status=accepted\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.ads.rejected || 0) | addComma\"\n        subTitle=\"Rejected\"\n        id=\"home-admin-rejected-button\"\n        icon=\"speakol-cancel\"\n        backgroundColor=\"#FBE5E5\"\n        color=\"#DB2828\"\n        class=\"sub-card lg:sub-card\"\n        link=\"/campaigns/admin?ad-status=rejected\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.ads.hold || 0) | addComma\"\n        subTitle=\"Hold\"\n        id=\"home-admin-hold-button\"\n        icon=\"speakol-pause\"\n        backgroundColor=\"#FDF5E1\"\n        color=\"#F2AF03\"\n        class=\"sub-card lg:sub-card\"\n        link=\"/campaigns/admin?ad-status=hold\"\n      >\n      </speakol-analytics-card>\n\n      <speakol-analytics-card\n        :title=\"(cards.ads.under_review || 0) | addComma\"\n        subTitle=\"Under Review\"\n        id=\"home-admin-under-review-button\"\n        backgroundColor=\"#FDF5E1\"\n        color=\"#F2AF03\"\n        icon=\"speakol-warning\"\n        class=\"sub-card lg:sub-card lg:mb-0\"\n        link=\"/campaigns/admin?ad-status=under_review\"\n      >\n      </speakol-analytics-card>\n\n    </div>\n\n  </div>\n</template>\n\n<script>\n\nexport default {\n  data () {\n    return {\n      cards: {\n        fund: {},\n        accounts: {},\n        campaigns: {},\n        ads: {\n          total: 3\n        }\n      },\n      filterQuery: {\n        from_date: this.$moment().subtract(7, 'day').format('YYYY-MM-DD'),\n        to_date: this.$moment().format('YYYY-MM-DD')\n      }\n    }\n  },\n\n\n  methods: {\n    async getInsights (filterQuery = {\n      from_date: this.$moment().startOf('year').format('YYYY-MM-DD'),\n      to_date: this.$moment().format('YYYY-MM-DD')\n    }) {\n\n      const {data: response} = await window.axios.post('/analytics/admin/home', filterQuery)\n      if (response.success) {\n        this.cards = response.payload\n      }\n\n    },\n\n    async setDateFilter (dateFilter) {\n      await this.getInsights({\n        from_date: this.formatTime(dateFilter.startDate),\n        to_date: this.formatTime(dateFilter.endDate)\n      })\n    },\n\n    formatTime (time) {\n      return this.$moment(time).format('YYYY-MM-DD')\n    }\n  },\n\n  async mounted () {\n    if (this.$can('speakol_dashboard')) {\n      await this.getInsights()\n    }\n  }\n}\n\n</script>\n\n<style lang=\"scss\" scoped>\n\n.card {\n  background: #fff;\n  border-radius: 20px;\n  padding-top: 30px;\n  padding-bottom: 30px;\n  padding-right: 18px;\n  padding-left: 18px;\n  margin-bottom: 16px;\n}\n\n.sub-card {\n  @apply w-full;\n}\n\n.title {\n  font-style: normal;\n  font-weight: 500;\n  font-size: 18px;\n  line-height: 27px;\n  letter-spacing: 0.1px;\n  color: #2c2c2c;\n}\n\nfilter-btn {\n  background: #0092d7;\n  border-radius: 3px;\n}\n\n@media (min-width: 1024px) {\n  .lg\\:title {\n    font-style: normal;\n    font-weight: 500;\n    font-size: 24px;\n    line-height: 36px;\n    letter-spacing: 0.1px;\n    color: #2c2c2c;\n  }\n\n  .lg\\:card {\n    padding-right: 30px;\n    padding-left: 30px;\n    margin-bottom: 30px;\n  }\n\n  .lg\\:input {\n    width: 280px !important;\n    height: 40px !important;\n  }\n\n  .lg\\:btn {\n    width: 135px !important;\n    height: 40px !important;\n  }\n\n  .lg\\:sub-card {\n    width: calc(25% - 16px);\n  }\n\n  .lg\\:filter {\n    width: 290px !important;\n  }\n}\n\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./admin-overview.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./admin-overview.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./admin-overview.vue?vue&type=template&id=b1fdd02a&scoped=true&\"\nimport script from \"./admin-overview.vue?vue&type=script&lang=js&\"\nexport * from \"./admin-overview.vue?vue&type=script&lang=js&\"\nimport style0 from \"./admin-overview.vue?vue&type=style&index=0&id=b1fdd02a&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"b1fdd02a\",\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.accountHasCampaigns)?_c('div',{staticClass:\"flex items-center error-div\"},[_c('span',{staticClass:\"speakol icon-size speakol-calendar icon-span\"}),_c('span',[_vm._v(\"\\n    There is no data showing for the date you have specified.\\n  \")])]):_c('div',{staticClass:\"flex items-center error-div\"},[_c('span',{staticClass:\"speakol icon-size speakol-no-horn icon-span\"}),_c('span',[_vm._v(\"\\n    You do not have any campaigns.\\n  \")])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n\n  <div class=\"flex items-center error-div\" v-if=\"accountHasCampaigns\">\n    <span class=\"speakol icon-size speakol-calendar icon-span\"></span>\n    <span>\n      There is no data showing for the date you have specified.\n    </span>\n  </div>\n\n  <div class=\"flex items-center error-div\" v-else>\n    <span class=\"speakol icon-size speakol-no-horn icon-span\"></span>\n    <span>\n      You do not have any campaigns.\n    </span>\n  </div>\n\n</template>\n\n<script>\n\nexport default {\n  props: {\n    accountHasCampaigns: {\n      type: Boolean,\n      default: true\n    }\n  }\n}\n\n</script>\n\n<style lang=\"scss\" scoped>\n.error-div {\n  background-color: white;\n  color: #2c2c2c;\n}\n\n.icon-span {\n  font-size: 25px;\n  background-color: white;\n  margin: 8px;\n}\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./empty-state.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./empty-state.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./empty-state.vue?vue&type=template&id=a0d7847e&scoped=true&\"\nimport script from \"./empty-state.vue?vue&type=script&lang=js&\"\nexport * from \"./empty-state.vue?vue&type=script&lang=js&\"\nimport style0 from \"./empty-state.vue?vue&type=style&index=0&id=a0d7847e&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"a0d7847e\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./empty-state.vue?vue&type=style&index=0&id=a0d7847e&lang=scss&scoped=true&\"","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./admin-overview.vue?vue&type=style&index=0&id=b1fdd02a&lang=scss&scoped=true&\"","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./home-page-map.vue?vue&type=style&index=0&id=259e9d0d&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.$can('personal_dashboard'))?_c('div',[_c('div',{staticClass:\"card\"},[_c('Overview',{attrs:{\"cards\":_vm.cards},on:{\"filter\":_vm.getAnalytics}}),_c('CampaignInsights',{attrs:{\"series\":_vm.chart,\"filterQuery\":_vm.filterQuery}})],1),_c('div',{staticClass:\"card\"},[_c('div',{staticClass:\"card px-5 py-8 lg:px-8 mt-6\"},[_vm._m(0),_c('div',{staticClass:\"flex chart-map flex-wrap\"},[_c('div',{staticClass:\"w-full mb-2 md:mb-10\"},[_c('div',{staticClass:\"w-full md:w-1/2 flex flex-wrap\"},_vm._l((_vm.filters),function(filter){return _c('SpeakolChartFilter',{key:filter.value,ref:filter.value,refInFor:true,staticClass:\"w-34 mr-10 mb-8 md:mr-24 md:mb-0\",attrs:{\"text\":filter.text,\"color\":filter.color,\"value\":filter.value,\"clickable\":!_vm.isFilterSelected(filter.value)},on:{\"toggled\":_vm.updateActiveFilter}})}),1)]),_c('div',{staticClass:\"w-full md:w-1/2 mb-8 md:mb:0\"},[_c('HomePageMap',{ref:\"map\",attrs:{\"id\":\"map\",\"filters\":_vm.filters,\"width\":_vm.mapWidth,\"height\":_vm.mapHeight,\"geoInsights\":_vm.geoInsights},scopedSlots:_vm._u([{key:\"empty-country-tooltip\",fn:function(){return [_c('ChartErrorMessage',{attrs:{\"accountHasCampaigns\":_vm.accountHasCampaigns}})]},proxy:true}],null,false,2599393043)})],1),_c('div',{staticClass:\"device-split md:w-1/2 w-full\"},[_vm._m(1),_c('deviceChart',{key:_vm.deviceChartKey,ref:\"device-chart\",attrs:{\"chartData\":_vm.deviceChartData,\"accountHasCampaigns\":_vm.accountHasCampaigns,\"displayColumn\":_vm.displayColumn}})],1)])])])]):_vm._e(),(_vm.$can('speakol_dashboard'))?_c('div',[_c('AdminOverview')],1):_vm._e()])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"md:flex chart-title\"},[_c('h3',[_vm._v(\"Performance\")]),_c('span',[_vm._v(\"The metrics will be reflected on the two sections below.\")])])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"device-split-desc\"},[_c('span',{staticClass:\"device-chart-title\",staticStyle:{\"color\":\"#2c2c2c\"}},[_vm._v(\"Device Split\")]),_c('h6',{staticClass:\"mt-3 mb-47 device-chart-desc\"},[_vm._v(\"This new feature provides information starting from \"),_c('b',[_vm._v(\"Jan 5, 2021\")]),_vm._v(\" onwards.\")])])}]\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <div v-if=\"$can('personal_dashboard')\">\n      <div class=\"card\">\n        <Overview v-on:filter=\"getAnalytics\" :cards=\"cards\"></Overview>\n        <CampaignInsights :series=\"chart\" :filterQuery=\"filterQuery\"></CampaignInsights>\n      </div>\n      <div class=\"card\">\n        <div class=\"card px-5 py-8 lg:px-8 mt-6\">\n          <div class=\"md:flex chart-title\">\n            <h3>Performance</h3>\n            <span>The metrics will be reflected on the two sections below.</span>\n          </div>\n\n          <div class=\"flex chart-map flex-wrap\">\n            <!-- filters Group -->\n            <div class=\"w-full mb-2 md:mb-10\">\n              <div class=\"w-full md:w-1/2 flex flex-wrap\">\n                <SpeakolChartFilter\n                  v-for=\"filter in filters\"\n                  :text=\"filter.text\"\n                  class=\"w-34 mr-10 mb-8 md:mr-24 md:mb-0\"\n                  :color=\"filter.color\"\n                  :ref=\"filter.value\"\n                  :value=\"filter.value\"\n                  :key=\"filter.value\"\n                  :clickable=\"!isFilterSelected(filter.value)\"\n                  v-on:toggled=\"updateActiveFilter\"/>\n              </div>\n            </div>\n\n            <!-- Map -->\n            <div class=\"w-full md:w-1/2 mb-8 md:mb:0\">\n              <HomePageMap\n                id=\"map\"\n                ref=\"map\"\n                :filters=\"filters\"\n                :width=\"mapWidth\"\n                :height=\"mapHeight\"\n                :geoInsights=\"geoInsights\"\n              >\n                <template v-slot:empty-country-tooltip>\n\n                  <ChartErrorMessage :accountHasCampaigns=\"accountHasCampaigns\"></ChartErrorMessage>\n\n                </template>\n              </HomePageMap>\n            </div>\n\n            <div class=\"device-split md:w-1/2 w-full\">\n              <div class=\"device-split-desc\">\n                <span class=\"device-chart-title\" style=\"color: #2c2c2c;\">Device Split</span>\n                <h6 class=\"mt-3 mb-47 device-chart-desc\">This new feature provides information starting from <b>Jan 5, 2021</b> onwards.</h6>\n              </div>\n                <deviceChart ref=\"device-chart\" :chartData=\"deviceChartData\" :key=\"deviceChartKey\" :accountHasCampaigns=\"accountHasCampaigns\"  :displayColumn=\"displayColumn\"/>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div v-if=\"$can('speakol_dashboard')\">\n      <AdminOverview></AdminOverview>\n    </div>\n  </div>\n</template>\n\n<script>\nimport Overview from './components/overview'\nimport AdminOverview from './components/admin-overview'\nimport CampaignInsights from './components/campaign-insights'\nimport deviceChart from './components/device-chart'\nimport HomePageMap from './components/home-page-map'\nimport ChartErrorMessage from './components/empty-state'\nimport {get} from 'lodash'\n\nexport default {\n  data () {\n    return {\n      // Selected Filter\n      selectedFilter: 'impressions',\n\n      // map //\n      mapWidth: 0,\n      mapHeight: 0,\n      geoInsights: [],\n\n      // device and other options //\n      displayColumn: 'impressions',\n      deviceChartKey: 'impressions',\n      cards: {},\n      filterQuery: {},\n      chart: [],\n      fromDate: null,\n      endDate: null,\n      deviceChartData: [],\n      accountHasCampaigns : true\n    }\n  },\n  components: {\n    Overview,\n    CampaignInsights,\n    AdminOverview,\n    deviceChart,\n    HomePageMap,\n    ChartErrorMessage\n  },\n  async mounted () {\n    if (this.$can('personal_dashboard')) {\n\n      this.isAccountHasCampaigns().then((accountHasCampaigns) => {\n        this.accountHasCampaigns = accountHasCampaigns\n      })\n      this.$nextTick(() => {\n        this.$refs['impressions'][0].toggle()\n        this.mapWidth = document.getElementById('map').offsetWidth - 40\n        this.mapHeight = this.mapWidth / 1.7\n      }, 0)\n    }\n\n  },\n\n  methods: {\n    async isAccountHasCampaigns () {\n      const {data: response} = await window.axios.get('/campaigns/account-has-campaigns', {\n        params: {\n          include_children: 1\n        }\n      })\n      return response.success ? response.payload : false\n    },\n    async getAnalytics (filterQuery = {}) {\n\n      this.filterQuery = filterQuery\n\n      this.fromDate = filterQuery['from-date']\n\n      this.endDate = filterQuery['to-date']\n\n      const response = await window.axios.post('/analytics/home', filterQuery)\n\n      if (this.$can('personal_dashboard')) {\n        this.getDeviceAnalytics(filterQuery)\n        this.getMapGeoAnalytics(filterQuery)\n      }\n\n      if (response.data.success) {\n        this.cards = get(response, 'data.cards', {})\n\n        const actionTypeId = filterQuery.action_type ? filterQuery.action_type.id : 'total'\n\n        const actionTypeLabel = filterQuery.action_type ? filterQuery.action_type.label : 'Events'\n\n        this.cards.cpa = this.cards[`${actionTypeId}_cpa`]\n\n        if (actionTypeId === 'total') {\n\n          this.cards.events_numbers = this.cards.total_actions\n\n          this.cards.event_name = 'Conversions'\n\n        } else {\n          this.cards.events_numbers = this.cards[actionTypeId]\n\n          this.cards.event_name = actionTypeLabel\n        }\n\n        const payload = get(response, 'data.chart', [])\n\n        const chart = payload.filter(i => i.type === 'primary')\n\n        const eventItem = payload.filter(i => i.type === 'event').find(i => i.name === actionTypeLabel)\n\n        if (eventItem) {\n          chart.push(eventItem)\n        }\n\n        if (payload.length === 0) {\n          this.chart = this.defaultChartData(actionTypeLabel)\n        } else {\n          const lastIndex = chart.length - 1\n          const secondLastIndex = chart.length - 2\n          this.chart = this.swap(chart.map(i => {\n            return {\n              data: i.data,\n              name: i.name\n            }\n          }), secondLastIndex, lastIndex)\n        }\n      }\n    },\n    defaultChartData (actionTypeLabel) {\n      return [\n        {\n          name: 'Impressions',\n          data: []\n        },\n        {\n          name: 'Clicks',\n          data: []\n        },\n        {\n          name: 'CTR',\n          data: []\n        },\n        {\n          name: 'Avg. CPC',\n          data: []\n        },\n        {\n          name: 'Video Views',\n          data: []\n        },\n        {\n          name: 'Spent',\n          data: []\n        },\n        {\n          name: actionTypeLabel,\n          data: []\n        },\n        {\n          name: 'CPA',\n          data: []\n        }\n      ]\n    },\n    swap (arr, firstIndex, secondIndex) {\n      const temp = arr[firstIndex]\n      arr[firstIndex] = arr[secondIndex]\n      arr[secondIndex] = temp\n      return arr\n    },\n    async getDeviceAnalytics (filterQuery = {}) {\n      this.deviceChartKey = ''\n      filterQuery['type'] = 'campaigns'\n      filterQuery['ids'] = filterQuery['campaigns-ids']\n      const response = await window.axios.post('/analytics/device-chart', filterQuery)\n      if (response.data.success) {\n        this.deviceChartKey = 'loaded'\n        this.deviceChartData = response.data.payload\n      }\n    },\n    updateDeviceChart (viewColumn) {\n      this.displayColumn = viewColumn\n      this.deviceChartKey = viewColumn\n    },\n    clearDeviceChart () { // clear device chart\n      this.displayColumn = null\n      this.deviceChartKey = 'null'\n    },\n\n    // Map & filters //\n    updateActiveFilter ({ value, active }) {\n      if (active) {\n        this.setSelectedFilter(value)\n        this.disableAllFiltersExcept(value)\n        this.updateMap(value)\n        this.updateDeviceChart(value)\n      }\n    },\n\n    setSelectedFilter (filter) {\n      this.selectedFilter = filter\n    },\n\n\n    isFilterSelected (filter) {\n      return this.selectedFilter === filter\n    },\n\n\n    disableAllFiltersExcept (filterValue) {\n      this.filters.filter(filterItem => filterItem.value !== filterValue).forEach((filterItem) => {\n        this.$refs[filterItem.value][0].disable()\n      })\n    },\n\n    updateMap (filter) {\n      this.$refs['map'].updateMap(filter)\n    },\n\n    clearMap () {\n      this.$refs['map'].clearMap()\n    },\n\n    async getMapGeoAnalytics (query = {}) {\n      const { data } = await window.axios.post('/analytics/countries-chart', query)\n      if (data.success) {\n        this.geoInsights = data.payload\n      }\n\n    }\n\n  },\n\n  computed: {\n\n    filters () {\n      return [\n        {\n          color: '#0092D7',\n          text: 'Impressions',\n          value: 'impressions'\n        },\n        {\n          color: '#00336E',\n          text: 'Clicks',\n          value: 'clicks'\n        },\n        {\n          color: '#6EC8BA',\n          text: 'Spent',\n          value: 'spent'\n        }\n      ]\n    }\n\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.card {\n  background: #fff;\n}\n\n.device-chart-title {\n  font-family: Poppins;\n  font-style: normal;\n  font-weight: 500;\n  font-size: 18px;\n  line-height: 27px;\n  letter-spacing: 0.1px;\n  color: \"#2c2c2c \";\n}\n\n.device-chart-desc {\n  font-family: Poppins;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px !important;\n  line-height: 24px;\n  color: #0092d7;\n}\n\n.performance-selection {\n  margin: 60px;;\n}\n\n.chart-title {\n  margin-bottom: 30px;\n\n  h3 {\n    font-weight: 500;\n    font-size: 24px;\n    color: #2c2c2c;\n  }\n\n  span {\n    font-weight: normal;\n    font-size: 14px;\n    color: rgba(44, 44, 44, 0.7);\n    position: relative;\n    top: 5px;\n    margin-left: 20px;\n  }\n}\n\n.device-split {\n  border-left: 1px solid #e3e3e3;\n\n  .device-split-desc {\n    margin-left: 30px;\n  }\n\n  h5 {\n    font-weight: 500;\n    font-size: 14px;\n    color: rgba(44, 44, 44, 0.56);\n    margin-bottom: 10px;\n  }\n\n  h6 {\n    color: #0092d7;\n    font-weight: normal;\n    font-size: 12px;\n    margin-bottom: 30px;\n  }\n}\n\n@media (max-width: 576px) {\n  .map-title {\n    font-style: normal;\n    font-weight: 500;\n    font-size: 16px;\n    line-height: 24px;\n    letter-spacing: 0.1px;\n    color: #2c2c2c;\n  }\n\n  .device-split {\n    border-left: none;\n  }\n\n  .device-split-desc {\n    margin-left: 0 !important;\n  }\n\n  .device-split {\n    h5 {\n      margin-top: 20px;\n    }\n  }\n\n  .chart-title {\n    span {\n      margin-left: 0;\n    }\n  }\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./index.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./index.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./index.vue?vue&type=template&id=70c285bb&scoped=true&\"\nimport script from \"./index.vue?vue&type=script&lang=js&\"\nexport * from \"./index.vue?vue&type=script&lang=js&\"\nimport style0 from \"./index.vue?vue&type=style&index=0&id=70c285bb&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"70c285bb\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./index.vue?vue&type=style&index=0&id=70c285bb&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"card md:pr-6\"},[_c('SpeakolChoroplethMap',{ref:\"map\",attrs:{\"width\":_vm.width,\"height\":_vm.height,\"geoInsights\":_vm.geoInsights,\"filters\":_vm.filters},scopedSlots:_vm._u([{key:\"empty-country-tooltip\",fn:function(){return [_vm._t(\"empty-country-tooltip\")]},proxy:true}],null,true)})],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"card md:pr-6\">\n    <SpeakolChoroplethMap\n      :width=\"width\"\n      :height=\"height\"\n      :geoInsights=\"geoInsights\"\n      :filters=\"filters\"\n      ref=\"map\">\n        <template v-slot:empty-country-tooltip>\n          <slot name=\"empty-country-tooltip\"></slot>\n        </template>\n    </SpeakolChoroplethMap>\n  </div>\n\n</template>\n\n<script>\nexport default {\n  props: {\n    width: {\n      type: Number\n    },\n    height : {\n      type: Number,\n      default: 450\n    },\n    filters: {\n      type: Array\n    },\n    geoInsights: {\n      type: Array\n    }\n  },\n\n  methods: {\n\n    disableAllFiltersExcept (filterValue) {\n      this.filters.filter(filterItem => filterItem.value !== filterValue).forEach((filterItem) => {\n        this.$refs[filterItem.value][0].disable()\n      })\n    },\n\n    updateMap (filterValue) {\n      this.$refs['map'].setSelectedFilter(filterValue)\n    },\n\n    clearMap () {\n      this.$refs['map'].clearFilters()\n    }\n\n\n  }\n\n}\n</script>\n\n\n<style lang=\"scss\" scoped>\n.card {\n  background-color: #fff;\n}\n\n.title {\n  font-style: normal;\n  font-weight: 500;\n  font-size: 18px;\n  line-height: 27px;\n  letter-spacing: 0.1px;\n  color: #2c2c2c;\n}\n\n.description {\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 21px;\n  letter-spacing: 0.1px;\n  color: rgba(44, 44, 44, 0.7);\n}\n\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./home-page-map.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./home-page-map.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./home-page-map.vue?vue&type=template&id=259e9d0d&scoped=true&\"\nimport script from \"./home-page-map.vue?vue&type=script&lang=js&\"\nexport * from \"./home-page-map.vue?vue&type=script&lang=js&\"\nimport style0 from \"./home-page-map.vue?vue&type=style&index=0&id=259e9d0d&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"259e9d0d\",\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"device-chart\"},[_c('ApexCharts',{ref:\"deviceChart\",staticClass:\"mb-6\",attrs:{\"type\":\"donut\",\"options\":_vm.chartOptions,\"series\":_vm.series}}),_c('div',{staticClass:\"devices-numbers\"},[(_vm.chartData.length > 0 && (this.displayColumn != 'null' || !this.displayColumn) && !_vm.isEmptyChart)?_c('div',_vm._l((_vm.chartData),function(value,index){return _c('span',{key:index,staticClass:\"m-6 chart-device-span\"},[_c('vs-icon',{staticClass:\"mr-2\",style:({color:_vm.chartColors[value.device_type]}),attrs:{\"icon\":_vm.chartIcons[value.device_type],\"icon-pack\":\"speakol\"}}),_c('span',{staticStyle:{\"position\":\"relative\",\"bottom\":\"4px\"}},[_c('span',{staticStyle:{\"color\":\"#2c2c2c\",\"opacity\":\"56%\"}},[_vm._v(_vm._s(_vm.formatName(value.device_type)))]),_c('span',{staticClass:\"chart-percentage ml-2\"},[_vm._v(_vm._s(value.percentage === 'NaN' ? 0 : value.percentage)+\"%\")])])],1)}),0):_c('div',_vm._l((_vm.initData),function(value,index){return _c('span',{key:index,staticClass:\"m-6 chart-device-span\"},[_c('vs-icon',{staticClass:\"mr-2\",style:({color:_vm.chartColors[value.device_type]}),attrs:{\"icon\":_vm.chartIcons[value.device_type],\"icon-pack\":\"speakol\"}}),_c('span',{staticStyle:{\"position\":\"relative\",\"bottom\":\"4px\"}},[_c('span',{staticStyle:{\"color\":\"#2c2c2c\",\"opacity\":\"56%\"}},[_vm._v(_vm._s(_vm.formatName(value.device_type)))]),_c('span',{staticClass:\"chart-percentage ml-2\"},[_vm._v(_vm._s(value.percentage)+\"%\")])])],1)}),0)])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"device-chart\">\n        <ApexCharts ref=\"deviceChart\" type=\"donut\" :options=\"chartOptions\" class=\"mb-6\" :series=\"series\"></ApexCharts>\n        <div class=\"devices-numbers\">\n        <div v-if=\"chartData.length > 0 && (this.displayColumn != 'null' || !this.displayColumn) && !isEmptyChart\">\n          <span class=\"m-6 chart-device-span\" :key=\"index\" v-for=\"(value, index) in chartData\">\n            <vs-icon :icon=\"chartIcons[value.device_type]\" v-bind:style=\"{color:chartColors[value.device_type]}\"  icon-pack=\"speakol\" class=\"mr-2\"></vs-icon>\n            <span style=\"position: relative; bottom: 4px;\"><span style=\"color: #2c2c2c; opacity: 56%;\">{{formatName(value.device_type)}}</span> <span class=\"chart-percentage ml-2\">{{value.percentage === 'NaN' ? 0 : value.percentage}}%</span></span>\n          </span>\n        </div>\n        <div v-else>\n        <span class=\"m-6 chart-device-span\" :key=\"index\"   v-for=\"(value, index) in initData\">\n          <vs-icon :icon=\"chartIcons[value.device_type]\" v-bind:style=\"{color:chartColors[value.device_type]}\"  icon-pack=\"speakol\" class=\"mr-2\"></vs-icon>\n          <span style=\"position: relative; bottom: 4px;\"><span style=\"color: #2c2c2c; opacity: 56%;\">{{formatName(value.device_type)}}</span> <span class=\"chart-percentage ml-2\">{{value.percentage}}%</span></span>\n        </span>\n        </div>\n        </div>\n  </div>\n</template>\n<script>\nexport default {\n  props: {\n    chartData: {\n      type: Array,\n      required: true\n    },\n    displayColumn:{\n      type: String,\n      required: false\n    },\n    accountHasCampaigns: {\n      type: Boolean,\n      default: true\n    }\n  },\n  watch: {\n    chartData () {\n      this.renderChart()\n    },\n    displayColumn () {\n      this.renderChart()\n    }\n  },\n  mounted () {\n    this.renderChart()\n  },\n  methods: {\n    formatName (name) {\n      return name === 'ios' ? 'iOS' : name.charAt(0).toUpperCase() + name.slice(1)\n    },\n    async emptyChart () {\n      let errorMessage = this.$t('You do not have any campaigns.')\n      let errorIcon = 'speakol-no-horn'\n      if (this.accountHasCampaigns) {\n        errorMessage = this.$t('There is no data showing for<br> the date you have specified.')\n        errorIcon = 'speakol-calendar'\n      }\n      this.isEmptyChart = true\n      this.chartOptions = {\n        labels: ['no-data'],\n        colors : ['#F1F1F1'],\n        series : [1],\n        tooltip: {\n          custom () {\n            return `\n              <div style=\"background-color:white;padding:20px 20px 20px 55px;color:#2C2C2C;position:relative;\">\n                <span style=\"font-size:25px;background-color:white;margin:8px;position:absolute;top:${errorIcon === 'speakol-no-horn' ? '10px' : '20px'};left:10px;\" class=\"speakol icon-size ${errorIcon}\"></span>\n                ${errorMessage}\n              </div>\n              `\n          }}\n      }\n\n    },\n    renderChart () {\n      this.isEmptyChart = false\n      const labels = []\n      const colors = []\n      const series = []\n      let total = 0\n\n      if (this.chartData.length === 0 || !this.displayColumn  || this.displayColumn === 'null') {\n        this.emptyChart()\n        return\n      }\n      total = this.chartData.reduce((total, obj) => obj[this.displayColumn] + total, 0)\n      for (let i = 0; i < this.chartData.length; i++) {\n        this.chartData[i].percentage = ((this.chartData[i][this.displayColumn] / total) * 100).toFixed(2)\n        colors.push(this.chartColors[this.chartData[i].device_type])\n        if (this.chartData[i].percentage === 'NaN') {\n          this.emptyChart()\n          return\n        }\n        labels.push(this.chartData[i].device_type)\n        series.push(this.chartData[i][this.displayColumn])\n      }\n      this.chartOptions = {\n        labels,\n        colors,\n        series\n      }\n    }\n  },\n  data () {\n    const chartData = this.chartData\n    return {\n      isEmptyChart: false,\n      initData : [\n        {\n          'device_type' : 'desktop',\n          'impressions' : 0,\n          'clicks' : 0,\n          'spent' : 0,\n          'percentage' : 0\n        },\n        {\n          'device_type' : 'ios',\n          'impressions' : 0,\n          'clicks' : 0,\n          'spent' : 0,\n          'percentage' : 0\n        },\n        {\n          'device_type' : 'android',\n          'impressions' : 0,\n          'clicks' : 0,\n          'spent' : 0,\n          'percentage' : 0\n        }\n      ],\n      chartColors : {\n        'desktop' : '#0092D7',\n        'ios' : '#6ec8ba',\n        'android' : '#00336e'\n      },\n      chartIcons : {\n        'desktop' : 'speakol-desktop',\n        'ios' : 'speakol-mobile-2',\n        'android' : 'speakol-mobile-3'\n      },\n      series: [],\n      chartOptions: {\n        chart: {\n          type: 'donut',\n          width:100\n        },\n        legend: {\n          show: false,\n          position: 'bottom'\n        },\n        dataLabels: {\n          enabled: false\n        },\n        labels: [],\n        colors:[],\n        states: {\n          hover: {\n            filter: {\n              type: 'none'\n            }\n          }\n        },\n        tooltip: {\n          custom ({seriesIndex, w}) {\n            const chartColors = {\n              'desktop' : '#0092D7',\n              'ios' : '#6ec8ba',\n              'android' : '#00336e'\n            }\n            const chartIcons = {\n              'desktop' : 'speakol-desktop',\n              'ios' : 'speakol-mobile-2',\n              'android' : 'speakol-mobile-3'\n            }\n            for (let i = 0; i < chartData.length; i++) {\n              if (chartData[i].device_type === w.globals.labels[seriesIndex]) {\n                return `\n                  <div style=\"padding: 16px 20px 20px 16px;\">\n                  <span style=\"position:relative;top:6px;font-size:25px;color:${chartColors[chartData[i].device_type]}\" class=\"speakol icon-size ${chartIcons[chartData[i].device_type]} ${chartData[i].device_type === 'desktop' ? 'test-icon' : ''}\"></span>\n                  <span class=\"popup-titles\" style=\"margin-right:8px;font-size:14px;\">${chartData[i].device_type === 'ios' ? 'iOS' : chartData[i].device_type.charAt(0).toUpperCase() + chartData[i].device_type.slice(1)}</span>\n                  <span class=\"popup-percentage\" style=\"\">${chartData[i].percentage}%</span>\n                  <br>\n                  <br>\n                  <div style=\"\">\n                  <span class=\"popup-titles\">Spent</span><br>\n                  <span class=\"popup-numbers\">$${chartData[i].spent.toLocaleString()}</span> <br>\n                  <span style=\"\" class=\"\" style=\"margin-top:16px;margin-bottom:16px;\"> <br>\n                  <span class=\"popup-titles\"> Clicks</span><br>\n                  <span class=\"popup-numbers\">${chartData[i].clicks.toLocaleString()}</span> <br>\n                  </span> <br>\n                  <span class=\"popup-titles\">Impressions</span><br>\n                  <span class=\"popup-numbers\">${chartData[i].impressions.toLocaleString()}</span>\n                  </div>\n                  </div>`\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n}\n</script>\n<style lang=\"scss\" scoped>\n.device-chart::v-deep {\n  .test-icon {\n    margin-right: 10px;\n  }\n\n  .icon-size {\n    width: 20.5px;\n    height: 20.5px;\n  }\n\n  .apexcharts-tooltip {\n    box-shadow: 0 4px 50px 10px rgba(0, 0, 0, 0.1);\n    background: #fff;\n  }\n\n  .devices-numbers {\n    text-align: center;\n  }\n\n  .popup-titles {\n    font-family: Poppins;\n    font-style: normal;\n    font-weight: normal;\n    font-size: 14px;\n    line-height: 21px;\n    letter-spacing: 0.1px;\n    color: rgba(44, 44, 44, 0.56);\n  }\n\n  .popup-numbers {\n    font-family: Poppins;\n    font-style: normal;\n    font-weight: 500;\n    font-size: 16px;\n    line-height: 24px;\n    letter-spacing: 0.1px;\n    color: #2c2c2c;\n  }\n\n  .popup-percentage {\n    font-family: Poppins;\n    font-style: normal;\n    font-weight: 500;\n    font-size: 14px;\n    line-height: 21px;\n    letter-spacing: 0.1px;\n    color: #2c2c2c;\n  }\n\n  .chart-percentage {\n    font-family: Poppins;\n    font-style: normal;\n    font-weight: 500;\n    font-size: 14px;\n    line-height: 21px;\n    letter-spacing: 0.1px;\n    color: #2c2c2c;\n  }\n\n  @media (max-width: 768px) {\n    .chart-device-span {\n      display: block;\n      position: relative;\n      right: 20px;\n      text-align: left;\n    }\n  }\n\n  @media (max-width: 1440px) {\n    .chart-device-span {\n      margin: 6px;\n    }\n  }\n}\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./device-chart.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./device-chart.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./device-chart.vue?vue&type=template&id=68494ab1&scoped=true&\"\nimport script from \"./device-chart.vue?vue&type=script&lang=js&\"\nexport * from \"./device-chart.vue?vue&type=script&lang=js&\"\nimport style0 from \"./device-chart.vue?vue&type=style&index=0&id=68494ab1&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"68494ab1\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./device-chart.vue?vue&type=style&index=0&id=68494ab1&lang=scss&scoped=true&\""],"sourceRoot":""}