Ericsson · gyorb · Sep 9, 2020 · Aug 12, 2020 · Aug 14, 2020 · Aug 17, 2020
@@ -23,7 +23,8 @@ const METADATA = merge(common.METADATA, {
 module.exports = merge(common, {
   mode: 'development',
   output: {
-    filename: '[name].[hash].js'
+    filename: '[name].[hash].js',
+    publicPath: "/"
   },
   devtool: 'inline-source-map',
   devServer: {

@@ -13,7 +13,8 @@ module.exports = merge(common, {
   mode: 'production',
   output: {
     path: helpers.root('dist'),
-    filename: '[name].[contenthash].js'
+    filename: '[name].[contenthash].js',
+    publicPath: "/"
   },
   plugins: [
     new DefinePlugin({

@@ -66,7 +66,7 @@
         }"
         :class="item.active.includes($route.name) &&
           'v-btn--active router-link-active'"
-        exact
+        :exact="item.exact"
         text
       >
         <v-icon left>
@@ -127,20 +127,23 @@ export default {
           icon: "mdi-briefcase-outline",
           route: "products",
           active: [ "products" ],
+          exact: true,
           hide: [ "products", "login", "404" ]
         },
         {
           name: "Runs",
           icon: "mdi-run-fast",
           route: "runs",
           active: [ "runs", "main_runs" ],
+          exact: true,
           hide: [ "products", "login", "404" ]
         },
         {
           name: "Reports",
           icon: "mdi-clipboard-text-multiple-outline",
           route: "reports",
           active: [ "reports" ],
+          exact: true,
           query: defaultReportFilterValues,
           hide: [ "products", "login", "404" ]
         },
@@ -149,13 +152,15 @@ export default {
           icon: "mdi-history",
           route: "run-history",
           active: [ "run-history" ],
+          exact: true,
           hide: [ "products", "login", "404" ]
         },
         {
           name: "Statistics",
           icon: "mdi-chart-line",
           route: "statistics",
           active: [ "statistics" ],
+          exact: false,
           query: defaultStatisticsFilterValues,
           hide: [ "products", "login", "404" ]
         }

@@ -31,36 +31,17 @@
       </template>
 
       <template v-slot:title="{ item }">
-        <v-tooltip
-          right
-          color="white"
-        >
-          <template v-slot:activator="{ on, attrs }">
+        <source-component-tooltip :value="item.value">
+          <template v-slot="{ on }">
             <v-list-item-title
               class="mr-1 filter-item-title"
               :title="item.title"
-              v-bind="attrs"
               v-on="on"
             >
               {{ item.title }}
             </v-list-item-title>
           </template>
-
-          <v-card
-            v-if="item.value"
-            class="mx-auto"
-            outlined
-          >
-            <v-list-item
-              v-for="value in item.value.split('\n')"
-              :key="value"
-              :class="[ value[0] === '+' ? 'include' : 'exclude' ]"
-              dense
-            >
-              {{ value }}
-            </v-list-item>
-          </v-card>
-        </v-tooltip>
+        </source-component-tooltip>
       </template>
     </select-option>
   </manage-source-component-dialog>
@@ -70,7 +51,8 @@
 import { ccService, handleThriftError } from "@cc-api";
 
 import {
-  ManageSourceComponentDialog
+  ManageSourceComponentDialog,
+  SourceComponentTooltip
 } from "@/components/Report/SourceComponent";
 
 import SelectOption from "./SelectOption/SelectOption";
@@ -80,7 +62,8 @@ export default {
   name: "SourceComponentFilter",
   components: {
     ManageSourceComponentDialog,
-    SelectOption
+    SelectOption,
+    SourceComponentTooltip
   },
   mixins: [ BaseSelectOptionFilterMixin ],
 
@@ -138,23 +121,3 @@ export default {
   }
 };
 </script>
-
-<style lang="scss" scoped>
-.v-tooltip__content {
-  padding: 0px;
-
-  .v-list-item {
-    min-height: auto;
-  }
-
-  .theme--light.v-list-item {
-    &.include {
-      color: green !important;
-    }
-
-    &.exclude {
-      color: red !important;
-    }
-  }
-}
-</style>
@@ -103,9 +103,10 @@
                   @update:url="updateUrl"
                 />
 
-                <v-divider />
+                <v-divider v-if="showDiffType" />
 
                 <compared-to-diff-type-filter
+                  v-if="showDiffType"
                   ref="filters"
                   :namespace="namespace"
                   @update:url="updateUrl"
@@ -346,6 +347,7 @@ export default {
     showCompareTo: { type: Boolean, default: true },
     showReviewStatus: { type: Boolean, default: true },
     showRemoveFilteredReports: { type: Boolean, default: true },
+    showDiffType: { type: Boolean, default: true },
     reportCount: { type: Number, required: true }
   },
 

@@ -0,0 +1,54 @@
+<template>
+  <v-tooltip
+    right
+    color="white"
+  >
+    <template v-slot:activator="{ on }">
+      <slot :on="on" />
+    </template>
+
+    <v-card
+      v-if="value"
+      class="mx-auto"
+      outlined
+    >
+      <v-list-item
+        v-for="v in value.split('\n')"
+        :key="v"
+        :class="[ v[0] === '+' ? 'include' : 'exclude' ]"
+        dense
+      >
+        {{ v }}
+      </v-list-item>
+    </v-card>
+  </v-tooltip>
+</template>
+
+<script>
+export default {
+  name: "SourceComponentTooltip",
+  props: {
+    value: { type: String, required: true }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.v-tooltip__content {
+  padding: 0px;
+
+  .v-list-item {
+    min-height: auto;
+  }
+
+  .theme--light.v-list-item {
+    &.include {
+      color: green !important;
+    }
+
+    &.exclude {
+      color: red !important;
+    }
+  }
+}
+</style>
@@ -2,10 +2,12 @@ import EditSourceComponentDialog from "./EditSourceComponentDialog";
 import ListSourceComponents from "./ListSourceComponents";
 import ManageSourceComponentDialog from "./ManageSourceComponentDialog";
 import RemoveSourceComponentDialog from "./RemoveSourceComponentDialog";
+import SourceComponentTooltip from "./SourceComponentTooltip";
 
 export {
   EditSourceComponentDialog,
   ListSourceComponents,
   ManageSourceComponentDialog,
-  RemoveSourceComponentDialog
+  RemoveSourceComponentDialog,
+  SourceComponentTooltip
 };
@@ -0,0 +1,128 @@
+<script>
+import { mapState } from "vuex";
+import { CompareData, DiffType, ReportFilter } from "@cc/report-server-types";
+
+export default {
+  name: "BaseStatistics",
+  props: {
+    bus: { type: Object, required: true }
+  },
+
+  data() {
+    return {
+      statistics: []
+    };
+  },
+
+  computed: {
+    ...mapState({
+      runIds(state, getters) {
+        return getters[`${this.namespace}/getRunIds`];
+      },
+      reportFilter(state, getters) {
+        return getters[`${this.namespace}/getReportFilter`];
+      },
+      cmpData(state, getters) {
+        return getters[`${this.namespace}/getCmpData`];
+      }
+    })
+  },
+
+  activated() {
+    this.bus.$on("refresh", this.fetchStatistics);
+  },
+
+  deactivated() {
+    this.bus.$off("refresh", this.fetchStatistics);
+  },
+
+  mounted() {
+    // The fetchStatistics function which initalizes this component is called
+    // dynamically by the parent component. If Hot Module Replacement is
+    // enabled and this component will be replaced then this initialization
+    // will not be made. For this reason on component replacement we will save
+    // the data and we will initalize the new component with this data.
+    if (process.env.NODE_ENV !== "production") {
+      if (module.hot) {
+        if (module.hot.data) {
+          this.statistics = module.hot.data.statistics;
+        }
+
+        module.hot.dispose(data => data["statistics"] = this.statistics);
+      }
+    }
+  },
+
+  methods: {
+    fetchStatistics() {},
+
+    /**
+     * If compare data is set this function will get the number of new and
+     * resolved bugs and update the statistics.
+     */
+    async fetchDifference(name) {
+      if (!this.cmpData) return;
+
+      const fieldToUpdate = [ "reports", "unreviewed", "confirmed",
+        "falsePositive", "intentional" ];
+
+      const q1 = this.getNewReports().then(newReports => {
+        this.statistics.forEach(s => {
+          const row = newReports.find(n => n[name] === s[name]);
+          if (row)
+            fieldToUpdate.forEach(f => s[f].new = row[f].count);
+        });
+      });
+
+      const q2 = this.getResolvedReports().then(resolvedReports => {
+        this.statistics.forEach(s => {
+          const row = resolvedReports.find(n => n[name] === s[name]);
+          if (row)
+            fieldToUpdate.forEach(f => s[f].resolved = row[f].count);
+        });
+      });
+
+      return Promise.all([ q1, q2 ]);
+    },
+
+    getStatistics(/* runIds, reportFilter, cmpData */) {},
+
+    getNewReports() {
+      const runIds = this.runIds;
+      const reportFilter = this.reportFilter;
+      const cmpData = new CompareData(this.cmpData);
+      cmpData.diffType = DiffType.NEW;
+
+      return this.getStatistics(runIds, reportFilter, cmpData);
+    },
+
+    getResolvedReports() {
+      const runIds = this.runIds;
+      const reportFilter = this.reportFilter;
+      const cmpData = new CompareData(this.cmpData);
+      cmpData.diffType = DiffType.RESOLVED;
+
+      return this.getStatistics(runIds, reportFilter, cmpData);
+    },
+
+    getStatisticsFilters() {
+      let runIds = this.runIds;
+      let reportFilter = this.reportFilter;
+      const cmpData = null;
+
+      // If compare data is set, get statistics for the compared to data.
+      if (this.cmpData) {
+        runIds = this.cmpData.runIds;
+        reportFilter = new ReportFilter(this.reportFilter);
+        reportFilter.runTag = this.cmpData.runTag;
+      }
+
+      return {
+        runIds,
+        reportFilter,
+        cmpData
+      };
+    }
+  }
+};
+</script>