Merge pull request #5840 from Countly/anna/next

Cookiezaurs · web-flow · commit e108f1193215 · 2024-12-04T16:35:56.000+02:00
[core Added scrolling to omitted segment list if list is too long.   [views] UI for view omitting
diff --git a/frontend/express/public/javascripts/countly/vue/templates/selectx.html b/frontend/express/public/javascripts/countly/vue/templates/selectx.html
@@ -129,13 +129,15 @@
                     @change="handleValueChange"
                     v-model="innerValue">
                 </cly-checklistbox>
-                <div class="cly-vue-events-omitted-segments bu-ml-1" v-if="hasDisabledOptions && searchQuery == ''">
+                <div class="cly-vue-events-omitted-segments bu-ml-1"  style="height:150px;" v-if="hasDisabledOptions && searchQuery == ''">
                     <div class="cly-vue-events-omitted-segments__title">
                         {{disabledOptions.label}}
                     </div>
-                    <div class="cly-vue-events-omitted-segments__item" v-for="item in disabledOptions.options">
-                        {{item.label}}
-                    </div>
+                    <vue-scroll :ops='{bar: {background: "#A7AEB8",size: "6px",specifyBorderRadius: "3px",keepShow: true}}'>
+                        <div class="cly-vue-events-omitted-segments__item" v-for="item in disabledOptions.options">
+                            {{item.label}}
+                        </div>
+                    </vue-scroll>
                 </div>
             </el-tab-pane>
         </el-tabs>
diff --git a/plugins/views/api/api.js b/plugins/views/api/api.js
@@ -1313,7 +1313,7 @@ const escapedViewSegments = { "name": true, "segment": true, "height": true, "wi
                     if (res1 && res1.omit) {
                         res.omit = res1.omit;
                     }
-                    if (common.drillDb) {
+                    if (common.drillDb && !params.qstring.skip_domains) {
                         var collectionName = "drill_events" + crypto.createHash('sha1').update("[CLY]_action" + params.qstring.app_id).digest('hex');
                         common.drillDb.collection(collectionName).findOne({"_id": "meta_v2"}, {_id: 0, "sg.domain": 1}, function(err3, meta1) {
                             if (meta1 && meta1.sg && meta1.sg.domain.values) {
diff --git a/plugins/views/frontend/public/javascripts/countly.models.js b/plugins/views/frontend/public/javascripts/countly.models.js
@@ -24,6 +24,36 @@
     CountlyHelpers.createMetricModel(countlyViews, {name: "views"}, jQuery);
 
     countlyViews.service = {
+        fetchMetaData: function() {
+            return CV.$.ajax({
+                type: "GET",
+                url: countlyCommon.API_PARTS.data.r,
+                data: {
+                    "app_id": countlyCommon.ACTIVE_APP_ID,
+                    "method": "get_view_segments",
+                    "skip_domains": true
+                },
+                dataType: "json",
+                success: function(json) {
+                    if (json && json.segments) {
+                        for (var i = 0; i < json.segments.length; i++) {
+                            json.segments[i] = countlyCommon.decode(json.segments[i]);
+                        }
+                        _segments = json.segments;
+                        for (let segment in _segments) {
+                            _segments[segment].sort(Intl.Collator().compare);
+                        }
+                    }
+                    if (json && json.omit) {
+                        for (let index = 0; index < json.omit.length; index++) {
+                            json.omit[index] = countlyCommon.decode(json.omit[index]);
+                        }
+                        _omit = json.omit;
+                        _omit.sort(Intl.Collator().compare);
+                    }
+                }
+            });
+        },
         fetchData: function(context) {
             _segment = context.state.selectedSegment;
             _segmentVal = context.state.selectedSegmentValue;
@@ -59,8 +89,6 @@
                 data: data,
                 dataType: "json",
             }, {"disableAutoCatch": true});
-
-
         },
         updateViews: function(statusObj) {
             return CV.$.ajax({
@@ -85,6 +113,18 @@
                 },
                 dataType: "json"
             }, {"disableAutoCatch": true});
+        },
+        omitSegments: function(segments) {
+            return CV.$.ajax({
+                type: "POST",
+                url: countlyCommon.API_PARTS.data.w + "/views",
+                data: {
+                    app_id: countlyCommon.ACTIVE_APP_ID,
+                    "method": "omit_segments",
+                    "omit_list": segments
+                },
+                dataType: "json"
+            }, {"disableAutoCatch": true});
         }
     };
 
@@ -461,8 +501,17 @@
         };
 
         var ViewsActions = {
+            fetchMetaData: function(context) {
+                return countlyViews.service.fetchMetaData()
+                    .then(function() {
+                        context.commit('setSegments', _segments);
+                        context.commit('setOmittedSegments', _omit);
+                        context.dispatch('onFetchSuccess');
+                    }).catch(function(error) {
+                        context.dispatch('onFetchError', error);
+                    });
+            },
             fetchTotals: function(context) {
-
                 return countlyViews.service.fetchTotals()
                     .then(function(response) {
                         context.commit('setTotals', response || {});
@@ -520,6 +569,14 @@
                     context.dispatch('onUpdateError', error);
                 });
             },
+            omitSegments: function(context, data) {
+                context.dispatch('onUpdateError', "");
+                return countlyViews.service.omitSegments(data).then(function() {
+
+                }).catch(function(error) {
+                    context.dispatch('onUpdateError', error);
+                });
+            },
             onFetchInit: function(context) {
                 context.commit('setFetchInit');
             },
diff --git a/plugins/views/frontend/public/javascripts/countly.views.js b/plugins/views/frontend/public/javascripts/countly.views.js
@@ -19,9 +19,24 @@
                 deleteDialogText: "",
                 deleteDialogConfirmText: CV.i18n('views.yes-delete-view'),
                 showDeleteDialog: false,
+                availableSegments: ["platform"],
+                omitList: [],
+                segmentsLoaded: false,
             };
         },
         mounted: function() {
+            var self = this;
+            this.$store.dispatch('countlyViews/fetchMetaData').then(function() {
+                var segments = self.$store.state.countlyViews.segments || {};
+                self.availableSegments = [];
+                for (var key in segments) {
+                    self.availableSegments.push({value: key, label: key});
+                }
+                var omittedSegments = self.$store.getters['countlyViews/getOmittedSegments'];
+                self.omitList = omittedSegments || [];
+                self.segmentsLoaded = true;
+
+            });
         },
         methods: {
             handleSelectionChange: function(selectedRows) {
@@ -43,6 +58,22 @@
                     }
                 }
             },
+            omitSegments: function() {
+                var self = this;
+                CountlyHelpers.confirm(CV.i18n('views.omit-segments-confirm'), "red", function(result) {
+                    if (!result) {
+                        return true;
+                    }
+                    self.$store.dispatch("countlyViews/omitSegments", JSON.stringify(self.omitList)).then(function() {
+                        if (self.$store.getters["countlyViews/updateError"]) {
+                            CountlyHelpers.notify({type: "error", title: jQuery.i18n.map["common.error"], message: self.$store.getters["countlyViews/updateError"], sticky: false, clearAll: true});
+                        }
+                        else {
+                            CountlyHelpers.notify({type: "ok", title: jQuery.i18n.map["common.success"], message: jQuery.i18n.map["events.general.changes-saved"], sticky: false, clearAll: true});
+                        }
+                    });
+                });
+            },
             deleteManyViews: function() {
                 if (this.selectedViews.length > 0) {
                     if (this.selectedViews.length === 1) {
diff --git a/plugins/views/frontend/public/localization/views.properties b/plugins/views/frontend/public/localization/views.properties
@@ -66,6 +66,7 @@ internal-events.[CLY]_action = Action
 systemlogs.action.view_deleted = View Deleted
 systemlogs.action.view_segments_ommit_complete = View segment ommiting complete
 systemlogs.action.view_segments_ommit = View segment ommiting start
+views.omit-segments-confirm = Do you want to omit selected segments for all views in this app?
 views.max-views-limit = Maximum limit of unique views ({0}) has been reached. Limit can be adjusted on the Views configurations page.
 views.drill-drawer.title = Drill views
 views.drill-drawer.save-button = Go to Drill
diff --git a/plugins/views/frontend/public/templates/manageViews.html b/plugins/views/frontend/public/templates/manageViews.html
@@ -12,6 +12,27 @@
 				{{deleteDialogText}}
 			</template>
 		</cly-confirm-dialog>
+		<cly-section>
+			<div class="bu-p-4">
+					<div class="text-smallish font-weight-bold bu-mb-2" data-test-id="manage-views-omit-title" >{{i18n('data-manager.omit-segments')}}
+					<cly-tooltip-icon  data-test-id="manage-views-omit-tooltip" class="bu-is-flex-grow-1 bu-ml-2" :tooltip="i18n('data-manager.omit-segments.tooltip')"></cly-tooltip-icon>
+				</div>
+					<cly-select-x 
+						data-test-id="manage-views-omit-select"
+						mode="multi-check" 
+						value=omitList 
+						:collapseTags = "false"
+						:options="availableSegments" 
+						:show-search="true" 
+						:searchable="true" 
+						width="100%"
+						:placeholder="i18n('data-manager.omit-segments')"
+						 v-model="omitList"
+						  style="margin-top:2px; display:block;">
+					</cly-select-x>
+					<el-button class="bu-mt-2" v-if="canUserDelete" ref="omitSegmentsButton" type="success" @click="omitSegments" >{{i18n('common.save')}}</el-button>
+				</div>
+		</cly-section>
 		<cly-section>
 			<cly-datatable-n  :default-sort="{prop: 'view', order: 'ascending'}" :trackedFields="['display']" :data-source="remoteTableDataSource" ref="editViewsTable" @selection-change="handleSelectionChange" >
 				<template v-slot:header-left>

Original file line number	Diff line number	Diff line change
`@@ -1313,7 +1313,7 @@ const escapedViewSegments = { "name": true, "segment": true, "height": true, "wi`
`1313`	`1313`	`if (res1 && res1.omit) {`
`1314`	`1314`	`res.omit = res1.omit;`
`1315`	`1315`	`}`
`1316`		`- if (common.drillDb) {`
	`1316`	`+ if (common.drillDb && !params.qstring.skip_domains) {`
`1317`	`1317`	`var collectionName = "drill_events" + crypto.createHash('sha1').update("[CLY]_action" + params.qstring.app_id).digest('hex');`
`1318`	`1318`	`common.drillDb.collection(collectionName).findOne({"_id": "meta_v2"}, {_id: 0, "sg.domain": 1}, function(err3, meta1) {`
`1319`	`1319`	`if (meta1 && meta1.sg && meta1.sg.domain.values) {`