{"version":3,"sources":["webpack:///./src/components/dashboards/revenue/top_5_clients.vue?032e","webpack:///src/components/dashboards/revenue/top_5_clients.vue","webpack:///./src/components/dashboards/revenue/top_5_clients.vue?ab2a","webpack:///./src/components/dashboards/revenue/top_5_clients.vue?570e","webpack:///../../../src/components/VBtn/index.ts","webpack:///./src/components/dashboards/revenue/top_5_clients.vue?2f9c"],"names":["render","_vm","this","_h","$createElement","_c","_self","VCard","staticStyle","attrs","VToolbar","staticClass","_v","VSpacer","VMenu","scopedSlots","_u","key","fn","ref","on","VBtn","_g","_b","VSelect","years","model","value","callback","$$v","selected_year","expression","chart_id","option","VDataTable","items","headers","item","_s","$n","total","staticRenderFns","component"],"mappings":"yOAUIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAGE,EAAA,KAAM,CAACC,YAAY,CAAC,gBAAgB,QAAQC,MAAM,CAAC,KAAO,KAAK,CAACJ,EAAGK,EAAA,KAAS,CAACD,MAAM,CAAC,KAAO,GAAG,MAAQ,KAAK,CAACJ,EAAG,OAAc,CAACM,YAAY,eAAe,CAACV,EAAIW,GAAG,qBAAqBP,EAAGQ,EAAA,MAASR,EAAGS,EAAA,KAAM,CAACL,MAAM,CAAC,WAAW,GAAG,KAAO,GAAG,QAAU,GAAG,kBAAiB,EAAK,0BAAyB,GAAOM,YAAYd,EAAIe,GAAG,CAAC,CAACC,IAAI,YAAYC,GAAG,SAASC,GAClc,IAAIC,EAAKD,EAAIC,GACTX,EAAQU,EAAIV,MAChB,MAAO,CAACJ,EAAGgB,EAAA,KAAKpB,EAAIqB,GAAGrB,EAAIsB,GAAG,CAACZ,YAAY,YAAYF,MAAM,CAAC,MAAQ,GAAG,KAAO,GAAG,MAAQ,GAAG,KAAO,KAAK,QAAQA,GAAM,GAAOW,GAAI,CAACf,EAAG,cAAc,CAACI,MAAM,CAAC,KAAO,YAAY,SAAS,CAACJ,EAAG,MAAM,CAACM,YAAY,gBAAgBH,YAAY,CAAC,QAAU,OAAO,WAAa,MAAM,MAAQ,QAAQ,eAAe,SAAS,CAACH,EAAG,MAAM,CAACM,YAAY,qCAAqC,CAACV,EAAIW,GAAG,oCAAoCP,EAAG,MAAM,CAACM,YAAY,QAAQ,CAACN,EAAGmB,EAAA,KAAQ,CAACf,MAAM,CAAC,MAAQ,GAAG,UAAY,GAAG,MAAQ,SAAS,MAAQR,EAAIwB,MAAM,SAAW,GAAG,eAAe,IAAIC,MAAM,CAACC,MAAO1B,EAAiB,cAAE2B,SAAS,SAAUC,GAAM5B,EAAI6B,cAAcD,GAAKE,WAAW,oBAAoB,QAAQ,GAAG1B,EAAG,OAAU,CAACM,YAAY,QAAQ,CAACN,EAAG,MAAM,CAACG,YAAY,CAAC,QAAU,OAAO,wBAAwB,kBAAkB,cAAc,YAAYH,EAAG,UAAU,CAACM,YAAY,QAAQF,MAAM,CAAC,WAAa,GAAG,GAAKR,EAAI+B,SAAS,OAAS/B,EAAIgC,UAAU5B,EAAG6B,EAAA,KAAW,CAAC1B,YAAY,CAAC,WAAa,0BAA0BC,MAAM,CAAC,MAAQ,GAAG,MAAQR,EAAIkC,MAAM,QAAUlC,EAAImC,QAAQ,sBAAsB,GAAG,eAAe,4CAA4CrB,YAAYd,EAAIe,GAAG,CAAC,CAACC,IAAI,aAAaC,GAAG,SAASC,GAChqC,IAAIkB,EAAOlB,EAAIkB,KACf,MAAO,CAACpC,EAAIW,GAAG,aAAaX,EAAIqC,GAAGrC,EAAIsC,GAAGF,EAAKG,QAAQ,gBAAgB,MAAK,MAAS,IAAI,IACrFC,EAAkB,G,oFC4DtB,gBACA,OACA,OACA,OACA,OACA,SAGA,OACA,YACA,cACA,6DAEA,OACA,OACA,cACA,SACA,uCACA,uCACA,QACA,yBACA,2BACA,2BACA,2BACA,2BACA,2BAEA,QACA,yBACA,MACA,SACA,OACA,SAEA,OACA,QACA,UACA,eAEA,OACA,eACA,aAEA,SACA,YACA,aACA,sBACA,IAGA,YACA,gBACA,cACA,MACA,MACA,YACA,YAEA,OACA,YACA,cAIA,WACA,SACA,UACA,oBAEA,QACA,oBACA,QACA,YACA,QACA,UACA,WACA,UACA,WACA,eAEA,WACA,gBAGA,SACA,eACA,8BAEA,WAEA,SACA,CACA,eACA,cACA,cAEA,CACA,cACA,cACA,cACA,cAKA,OACA,eACA,UACA,iBAEA,cAEA,uBACA,UACA,2DACA,OACA,OACA,4DACA,OACA,OACA,4DACA,OACA,QAEA,eAGA,SACA,WACA,oBACA,CACA,sBACA,WACA,gBACA,qBACA,qBACA,QACA,WACA,SAEA,WACA,mBACA,eAEA,UACA,OACA,QACA,cACA,wBAKA,YACA,cACA,qCACA,MACA,wBACA,kDAEA,SACA,kBACA,mDACA,8CACA,CACA,cACA,gBAGA,kCACA,kCACA,mDAKA,UACA,kBC7PqX,I,wBCQjXC,EAAY,eACd,EACA1C,EACAyC,GACA,EACA,KACA,WACA,MAIa,aAAAC,E,kECnBf,gBAGe,e,kCCHf","file":"js/chunk-73a95ecb.cedb83d9.js","sourcesContent":["import { VBtn } from 'vuetify/lib/components/VBtn';\nimport { VCard } from 'vuetify/lib/components/VCard';\nimport { VCardText } from 'vuetify/lib/components/VCard';\nimport { VDataTable } from 'vuetify/lib/components/VDataTable';\nimport { VMenu } from 'vuetify/lib/components/VMenu';\nimport { VSelect } from 'vuetify/lib/components/VSelect';\nimport { VSpacer } from 'vuetify/lib/components/VGrid';\nimport { VToolbar } from 'vuetify/lib/components/VToolbar';\nimport { VToolbarTitle } from 'vuetify/lib/components/VToolbar';\n\nvar render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c(VCard,{staticStyle:{\"border-radius\":\"1rem\"},attrs:{\"flat\":\"\"}},[_c(VToolbar,{attrs:{\"flat\":\"\",\"dense\":\"\"}},[_c(VToolbarTitle,{staticClass:\"chart_title\"},[_vm._v(\"Top 5 klijenata\")]),_c(VSpacer),_c(VMenu,{attrs:{\"offset-y\":\"\",\"left\":\"\",\"rounded\":\"\",\"close-on-click\":true,\"close-on-content-click\":false},scopedSlots:_vm._u([{key:\"activator\",fn:function(ref){\nvar on = ref.on;\nvar attrs = ref.attrs;\nreturn [_c(VBtn,_vm._g(_vm._b({staticClass:\"ma-0 pa-0\",attrs:{\"plain\":\"\",\"icon\":\"\",\"small\":\"\",\"dark\":\"\"}},'v-btn',attrs,false),on),[_c('sabira_icon',{attrs:{\"icon\":\"3dots\"}})],1)]}}])},[_c('div',{staticClass:\"pa-0 tertiary\",staticStyle:{\"display\":\"grid\",\"background\":\"999\",\"width\":\"10rem\",\"grid-row-gap\":\"0rem\"}},[_c('div',{staticClass:\"body-1 pa-2 secondary white--text\"},[_vm._v(\"\\n          Postavke\\n        \")]),_c('div',{staticClass:\"pa-2\"},[_c(VSelect,{attrs:{\"dense\":\"\",\"mandatory\":\"\",\"label\":\"Godina\",\"items\":_vm.years,\"outlined\":\"\",\"hide-details\":\"\"},model:{value:(_vm.selected_year),callback:function ($$v) {_vm.selected_year=$$v},expression:\"selected_year\"}})],1)])])],1),_c(VCardText,{staticClass:\"pt-0\"},[_c('div',{staticStyle:{\"display\":\"grid\",\"grid-template-columns\":\"1fr max-content\",\"align-items\":\"center\"}}),_c('v-chart',{staticClass:\"chart\",attrs:{\"autoresize\":\"\",\"id\":_vm.chart_id,\"option\":_vm.option}}),_c(VDataTable,{staticStyle:{\"background\":\"transparent !important\"},attrs:{\"dense\":\"\",\"items\":_vm.items,\"headers\":_vm.headers,\"hide-default-footer\":\"\",\"no-data-text\":\"Podaci ne postoje za odabranu kategoriju\"},scopedSlots:_vm._u([{key:\"item.total\",fn:function(ref){\nvar item = ref.item;\nreturn [_vm._v(\"\\n        \"+_vm._s(_vm.$n(item.total))+\"\\n      \")]}}],null,true)})],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <v-card flat style=\"border-radius: 1rem;\">\n    <v-toolbar flat dense>\n      <v-toolbar-title class=\"chart_title\">Top 5 klijenata</v-toolbar-title>\n      <v-spacer></v-spacer>\n      <v-menu\n        offset-y\n        left\n        rounded\n        :close-on-click=\"true\"\n        :close-on-content-click=\"false\"\n      >\n        <template v-slot:activator=\"{ on, attrs }\">\n          <v-btn\n            class=\"ma-0 pa-0\"\n            plain\n            icon\n            small\n            dark\n            v-bind=\"attrs\"\n            v-on=\"on\"\n          >\n            <sabira_icon icon=\"3dots\" />\n          </v-btn>\n        </template>\n        <div\n          class=\"pa-0 tertiary\"\n          style=\"display:grid;background:999;width: 10rem;grid-row-gap:0rem;\"\n        >\n          <div class=\"body-1 pa-2 secondary white--text\">\n            Postavke\n          </div>\n          <div class=\"pa-2\">\n            <v-select\n              dense\n              mandatory\n              label=\"Godina\"\n              :items=\"years\"\n              outlined\n              hide-details\n              v-model=\"selected_year\"\n            >\n            </v-select>\n          </div>\n        </div>\n      </v-menu>\n    </v-toolbar>\n    <v-card-text class=\"pt-0\">\n      <div\n        style=\"display:grid;grid-template-columns: 1fr max-content;align-items:center;\"\n      ></div>\n      <v-chart class=\"chart\" autoresize :id=\"chart_id\" :option=\"option\" />\n      <v-data-table\n        style=\"background: transparent !important;\"\n        dense\n        :items=\"items\"\n        :headers=\"headers\"\n        hide-default-footer\n        no-data-text=\"Podaci ne postoje za odabranu kategoriju\"\n      >\n        <template v-slot:[`item.total`]=\"{ item }\">\n          {{ $n(item.total) }}\n        </template>\n      </v-data-table>\n    </v-card-text>\n  </v-card>\n</template>\n<script>\n  import { use } from \"echarts/core\";\n  import { CanvasRenderer } from \"echarts/renderers\";\n  import { PieChart } from \"echarts/charts\";\n  import {\n    TitleComponent,\n    TooltipComponent,\n    LegendComponent,\n  } from \"echarts/components\";\n  use([\n    CanvasRenderer,\n    PieChart,\n    TitleComponent,\n    TooltipComponent,\n    LegendComponent,\n  ]);\n  import VChart from \"vue-echarts\";\n  export default {\n    components: {\n      VChart,\n      sabira_icon: () => import(\"@/components/sabira_icon\"),\n    },\n    data() {\n      return {\n        is_loading: false,\n        items: [],\n        chart_id: \"top_5_\" + new Date().getTime(),\n        selected_year: new Date().getFullYear(),\n        years: [\n          new Date().getFullYear(),\n          new Date().getFullYear() - 1,\n          new Date().getFullYear() - 2,\n          new Date().getFullYear() - 3,\n          new Date().getFullYear() - 4,\n          new Date().getFullYear() - 5,\n        ],\n        option: {\n          color: this.$chart_colors,\n          grid: {\n            bottom: 0,\n            left: 0,\n            right: 0,\n          },\n          title: {\n            show: false,\n            text: null,\n            left: \"center\",\n          },\n          label: {\n            alignTo: \"edge\",\n            formatter: (x) => {\n              return (\n                \"{name|\" +\n                x.data.name +\n                \"}\\n{value|\" +\n                this.$n(x.data.value) +\n                \"}\"\n              );\n            },\n            minMargin: 5,\n            edgeDistance: 10,\n            lineHeight: 18,\n            rich: {\n              name: {\n                fontSize: 14,\n                color: null,\n              },\n              value: {\n                fontSize: 14,\n                color: null,\n              },\n            },\n          },\n          labelLine: {\n            length: 5,\n            length2: 0,\n            maxSurfaceAngle: 40,\n          },\n          legend: {\n            orient: \"horizontal\",\n            show: true,\n            left: \"left\",\n            data: [],\n            bottom: 50,\n            textStyle: {\n              width: 120,\n              color: null,\n              fontSize: \"14\",\n            },\n            itemStyle: {\n              borderWidth: 0,\n            },\n          },\n          tooltip: {\n            trigger: \"item\",\n            formatter: \"{b} : {c} ({d}%)\",\n          },\n          series: [],\n        },\n        headers: [\n          {\n            text: \"Klijent\",\n            value: \"naziv\",\n            align: \"left\",\n          },\n          {\n            text: \"Promet\",\n            value: \"total\",\n            align: \"right\",\n            width: 100,\n          },\n        ],\n      };\n    },\n    watch: {\n      selected_year: {\n        handler() {\n          this.get_data();\n        },\n        immediate: false,\n      },\n      \"$vuetify.theme.dark\": {\n        handler() {\n          this.option.label.rich.name.color = this.$vuetify.theme.dark\n            ? \"#fff\"\n            : \"#333\";\n          this.option.label.rich.value.color = this.$vuetify.theme.dark\n            ? \"#fff\"\n            : \"#333\";\n          this.option.legend.textStyle.color = this.$vuetify.theme.dark\n            ? \"#fff\"\n            : \"#333\";\n        },\n        immediate: true,\n      },\n    },\n    methods: {\n      get_data() {\n        this.option.series = [\n          {\n            name: \"Top 5 klijenta\",\n            type: \"pie\",\n            radius: [40, 100],\n            center: [\"50%\", \"40%\"],\n            avoidLabelOverlap: true,\n            data: [],\n            labelLine: {\n              show: true,\n            },\n            itemStyle: {\n              borderColor: \"#fff\",\n              borderWidth: 2,\n            },\n            emphasis: {\n              label: {\n                show: true,\n                fontSize: \"10\",\n                fontWeight: \"normal\",\n              },\n            },\n          },\n        ];\n        this.$http({\n          method: \"POST\",\n          url: \"/reports/revenue/top_5_clients\",\n          data: {\n            year: this.selected_year,\n            account_id: this.$store.getters.user.account_id,\n          },\n        }).then((resp) => {\n          this.items = resp.data;\n          this.option.legend.data = this.items.map((x) => x.naziv);\n          this.option.series[0].data = this.items.map((x) => {\n            return {\n              value: x.total,\n              name: x.naziv,\n            };\n          });\n          this.option.tooltip.formatter = (params) => {\n            const { name, value, percent } = params;\n            return `${name} : ${this.$n(value)} (${this.$n(percent)}%)`;\n          };\n        });\n      },\n    },\n    mounted() {\n      this.get_data();\n    },\n  };\n</script>\n<style scoped>\n  .chart {\n    height: 27rem;\n  }\n  .select {\n    width: 86px;\n    font-size: 13px;\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!./top_5_clients.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!./top_5_clients.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./top_5_clients.vue?vue&type=template&id=71b834ea&scoped=true&\"\nimport script from \"./top_5_clients.vue?vue&type=script&lang=js&\"\nexport * from \"./top_5_clients.vue?vue&type=script&lang=js&\"\nimport style0 from \"./top_5_clients.vue?vue&type=style&index=0&id=71b834ea&scoped=true&lang=css&\"\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  \"71b834ea\",\n  null\n  \n)\n\nexport default component.exports","import VBtn from './VBtn'\n\nexport { VBtn }\nexport default VBtn\n","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./top_5_clients.vue?vue&type=style&index=0&id=71b834ea&scoped=true&lang=css&\""],"sourceRoot":""}