RANGER-3228 : Improvement in audit filter feature.
diff --git a/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js b/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
index 3bc933f..cc18902 100644
--- a/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
+++ b/security-admin/src/main/webapp/scripts/modules/globalize/message/en.js
@@ -397,8 +397,10 @@
                 nifiResource                :'NiFi Resource Identifier.',
                 securityZone				:'Security Zone',
                 zoneCreate					:'Create Zone',
-                zoneEdit					:'Zone Edit'
-                        },
+                zoneEdit					:'Zone Edit',
+                bucket                      :'Name of the S3 bucket.',
+                auditFilter                 :'Audit Filter'
+            },
 			msg : {
 				deletePolicyValidationMsg : 'Policy does not have any settings for the specific resource. Policy will be deleted. Press [Ok] to continue. Press [Cancel] to edit the policy.',
 				areYouSureWantToDelete	  : 'Are you sure want to delete ?',
diff --git a/security-admin/src/main/webapp/scripts/views/service/AuditFilterConfig.js b/security-admin/src/main/webapp/scripts/views/service/AuditFilterConfig.js
index f5e01f2..a190275 100644
--- a/security-admin/src/main/webapp/scripts/views/service/AuditFilterConfig.js
+++ b/security-admin/src/main/webapp/scripts/views/service/AuditFilterConfig.js
@@ -84,7 +84,11 @@
             });
             this.setupFormForEditMode();
             this.evIsAudited();
-            this.renderPermissions();
+            if(XAUtil.isTagBasedDef(this.rangerServiceDefModel)){
+                this.renderPermsForTagBasedService();
+            } else {
+                this.renderPermissions();
+            }
             this.ui.selectUsers.select2(XAUtil.getUsersGroupsList("users", this, '250px', "auditFilter"));
             this.ui.selectGroups.select2(XAUtil.getUsersGroupsList("groups", this, '250px', "auditFilter"));
             this.ui.selectRoles.select2(XAUtil.getUsersGroupsList("roles", this, '250px', "auditFilter"));
@@ -228,20 +232,86 @@
             });
         },
 
+        renderPermsForTagBasedService :function() {
+            var that = this;
+            this.permsIds = [];
+            if (this.model && this.model.get('accessTypes')) {
+                this.permsIds = this.model.get('accessTypes');
+            }
+            this.ui.addPerms.attr('data-type','tagchecklist')
+            this.ui.addPerms.attr('title','Components Permissions')
+            this.perms =  _.map(this.accessTypes,function(m){return {text : m.label, value : m.name}});
+            var select2optn = { width :'600px' };
+            //create x-editable for permissions
+            this.ui.addPerms.editable({
+                emptytext : 'Add Permissions',
+                source: this.perms,
+                value : this.permsIds,
+                select2option : select2optn,
+                placement : 'top',
+                showbuttons : 'bottom',
+                display: function(values,srcData) {
+                    if(_.contains(values,"on")) values = _.without(values,"on");
+                    if(_.isNull(values) || _.isEmpty(values)){
+                        $(this).empty();
+                        that.model.unset('accessTypes');
+                        that.ui.addPermissionsSpan.find('i').attr('class', 'fa-fw fa fa-plus');
+                        that.ui.addPermissionsSpan.attr('title','add');
+                        return;
+                    }
+                    //To remove selectall options
+                    values = _.uniq(values);
+                    if(values.indexOf("selectall") >= 0){
+                        values.splice(values.indexOf("selectall"), 1)
+                    }
+                    var permTypeArr = [];
+                    var valArr = _.map(values, function(id){
+                        if(!_.isUndefined(id)){
+                            var obj = _.findWhere(srcData,{'value' : id});
+                            permTypeArr.push({permType : obj.value});
+                            return "<span class='badge badge-info'>" + id.substr(0,id.indexOf(":")).toUpperCase() + "</span>";
+                        }
+                    });
+                    // Save form data to model
+                    that.model.set('accessTypes', values);
+                    $(this).html(_.uniq(valArr).join(" "));
+                    that.ui.addPermissionsSpan.find('i').attr('class', 'fa-fw fa fa-pencil');
+                    that.ui.addPermissionsSpan.attr('title','edit');
+                },
+            }).on('hidden',function(e){
+                    // $(e.currentTarget).parent().find('.tag-condition-popover').remove()
+                    $('.popover').parent().remove()
+            }).on('click', function(e) {
+                e.stopPropagation();
+                if($('.popover')){
+                    $('.tag-condition-popover').remove()
+                }
+                //Sticky popup
+                var pop = $('.popover')
+                pop.wrap('<div class="tag-fixed-popover-wrapper"></div>');
+                pop.addClass('tag-fixed-popover');
+                pop.find('.arrow').removeClass('arrow')
+            });
+            that.ui.addPermissionsSpan.click(function(e) {
+                e.stopPropagation();
+                if($('.popover')){
+                    $('.tag-condition-popover').remove()
+                }
+                that.$('a[data-js="permissions"]').editable('toggle');
+                var pop = $('.popover')
+                pop.wrap('<div class="tag-fixed-popover-wrapper"></div>');
+                pop.addClass('tag-fixed-popover');
+                pop.find('.arrow').removeClass('arrow')
+            });
+        },
+
         eGetResources :function () {
             var model = null;
             if (!_.isUndefined(this.model.get('resources'))) {
-                this.model.set('policyType', 0);
-                this.model.set('id', 'resource' + this.model.collection.length);
                 model = $.extend(true, {}, this.model);
-                // model = _.clone(resourceModel)
-                // _.each(model.get('resources'), function(val, key, obj) {
-                //     obj[key] = {
-                //         'values': val
-                //     };
-                // });
+                model.set('policyType', 0);
+                model.set('id', 'resource' + this.model.collection.length);
             }
-            // this.rangerServiceDefModel.get('resources')[0].lookupSupported = false
             if (_.isEmpty(this.serviceName)) {
                 this.rangerServiceDefModel.get('resources').map( function(m){
                     m.lookupSupported = false;
@@ -329,6 +399,7 @@
             if(this.model && !_.isUndefined(this.model.get('resources')))  {
                 this.model.unset('resources');
             }
+            this.ui.addResources.find('i').attr('class', 'fa-fw fa fa-plus');
         },
 
         evSelectUserGroupRole : function (e) {
@@ -337,6 +408,10 @@
         evDelete : function(){
             var that = this;
             this.collection.remove(this.model);
+            if (this.collection.length == 0) {
+                var $data = '<tr><td class="emptySet text-muted" colspan="9">No Audit Filter Data Found !!</td></tr>'
+                $(".auditFilterData").html($data)
+            }
         },
         selectOparations : function() {
             var that = this;
@@ -344,7 +419,7 @@
             this.ui.oparations.select2({
                 multiple: true,
                 closeOnSelect : true,
-                placeholder : 'Select Action',
+                placeholder : 'Type Action Name',
                 allowClear: true,
                 width : '200px',
                 tokenSeparators: [","],
diff --git a/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js b/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js
index 0c637ab..c8a47a4 100644
--- a/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js
+++ b/security-admin/src/main/webapp/scripts/views/service/RangerServiceViewDetail.js
@@ -35,12 +35,25 @@
 
                 template: RangerServiceViewDetailTmpl,
                 templateHelpers: function() {
-                    var that = this, tagDetails = [];
+                    var that = this, tagDetails = []; this.isExcludes = "", this.isRecursive = "";
                     if(this.rangerService.get('tagService') && !_.isEmpty(this.rangerService.get('tagService'))) {
                         tagDetails = this.rangerSeviceList.find(function(m) {
                             return m.get('name') == that.rangerService.get('tagService')
                         })
                     }
+                    _.filter(this.auditFilters, function(model, modVal) {
+                        model.isAudited = model.isAudited ? 'Yes' : 'No'
+                        _.filter(model.resources, function(key){
+                            var $toggleBtn =''
+                            if(!_.isUndefined(key.isExcludes)) {
+                                key.isExcludes = key.isExcludes ? XAEnums.ExcludeStatus.STATUS_EXCLUDE.label : XAEnums.ExcludeStatus.STATUS_INCLUDE.label;
+                            }
+                            if (!_.isUndefined(key.isRecursive)) {
+                                key.isRecursive = key.isRecursive ? XAEnums.RecursiveStatus.STATUS_RECURSIVE.label : XAEnums.RecursiveStatus.STATUS_NONRECURSIVE.label;
+                            }
+                            key.values = key.values.join(', ')
+                        })
+                    })
                     return {
                        configsList : this.conf,
                        customConfigs : this.customConfigs,
@@ -49,7 +62,8 @@
                        isEnabled   : this.rangerService.get('isEnabled'),
                        tagService  : (!_.isEmpty(tagDetails)) ? tagDetails.get('displayName') : false,
                        displayName : this.rangerService.get('displayName'),
-                   }
+                       auditFilters : this.auditFilters,
+                    }
                 },
 
                 /**
@@ -75,10 +89,12 @@
                         customConfigs = _.omit(customConfigs , m.name);
                     })
                     this.conf = configs;
-                    if(_.isEmpty(customConfigs)){
-                        this.customConfigs = false
-                    }else{
-                        this.customConfigs = customConfigs;
+                    this.auditFilters = (_.isEmpty(customConfigs) && _.isUndefined(customConfigs['ranger.plugin.audit.filters'])) ?
+                        false : customConfigs['ranger.plugin.audit.filters'];
+                    this.customConfigs = _.isEmpty(_.omit(customConfigs, 'ranger.plugin.audit.filters')) ?
+                        false : _.omit(customConfigs, 'ranger.plugin.audit.filters');
+                    if(this.auditFilters){
+                        this.auditFilters = JSON.parse((this.auditFilters).replace(/'/g, '"'));
                     }
                 },
                 /** on close */
diff --git a/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js b/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js
index 668fa79..983f65b 100644
--- a/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js
+++ b/security-admin/src/main/webapp/scripts/views/service/ServiceForm.js
@@ -129,6 +129,20 @@
 						that.auditFilterColl.add(new Backbone.Model(model));
 					})
 				}
+			} else {
+				var configs = this.rangerServiceDefModel.get('configs');
+				var auditFilterCollValueIndex = _.findIndex(configs,function(m){
+					return m.name == 'ranger.plugin.audit.filters'
+				})
+				if(auditFilterCollValueIndex != -1) {
+					var auditFilterCollValue = configs[auditFilterCollValueIndex];
+					configs.splice(auditFilterCollValueIndex, 1);
+					auditFilterCollValue = JSON.parse((auditFilterCollValue.defaultValue).replace(/'/g, '"'));
+					console.log(auditFilterCollValue);
+					auditFilterCollValue.forEach(function(model) {
+						that.auditFilterColl.add(new Backbone.Model(model));
+					})
+				}
 			}
 		},
 		setupForm : function() {
diff --git a/security-admin/src/main/webapp/templates/service/AuditFilterList_tmpl.html b/security-admin/src/main/webapp/templates/service/AuditFilterList_tmpl.html
index 268917a..dc36490 100644
--- a/security-admin/src/main/webapp/templates/service/AuditFilterList_tmpl.html
+++ b/security-admin/src/main/webapp/templates/service/AuditFilterList_tmpl.html
@@ -32,7 +32,7 @@
                         <th></th>
                     </tr>
                 </thead>
-                <tbody class="js-formInput permissionItemSortable">
+                <tbody class="js-formInput permissionItemSortable auditFilterData">
                     {{#if emptyAuditFilterCol}}
                         <td class="emptySet text-muted" colspan="9">No Audit Filter Data Found !!</td>
                     {{/if}}
diff --git a/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html b/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html
index af86930..8303180 100644
--- a/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html
+++ b/security-admin/src/main/webapp/templates/service/RangerServiceViewDetail_tmpl.html
@@ -125,4 +125,105 @@
             {{/if}}
         </tbody>
     </table>
+</div>
+<div id="auditFilters">
+    <p class="formHeader">
+        {{tt 'h.auditFilter'}}  :
+    </p>
+    <div class="table-responsive">
+        <table class="table table-permission table-condensed table-read-only">
+            <thead>
+                <tr>
+                    <th>Is Audited</th>
+                    <th>Access Result</th>
+                    <th>Resources</th>
+                    <th>Operations</th>
+                    <th>Permissions</th>
+                    <th>Users</th>
+                    <th>Groups</th>
+                    <th>Roles</th>
+                </tr>
+            </thead>
+            <tbody>
+                {{#each auditFilters}}
+                    <tr>
+                        <td>
+                            {{#if this.isAudited}}
+                                <span class="badge badge-info">{{this.isAudited}}</span>
+                            {{else}}
+                                --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.accessResult}}
+                                <span class="badge badge-info">{{this.accessResult}}</span>
+                            {{else}}
+                                --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.resources}}
+                            <div class="resource-list min-width-150">
+                                <div class="resourceGrp ui-sortable-handle">
+                                    {{#each this.resources}}
+                                        <div class="resourcesFilter"><div><b>{{@key}}</b>:{{this.values}}</div>
+                                            {{#if this.isExcludes}}<span class="badge badge-dark pull-right">{{this.isExcludes}}</span> {{/if}}{{#if this.isRecursive}}<span class="badge badge-dark pull-right">{{this.isRecursive}}</span>{{/if}}
+                                        </div>
+                                    {{/each}}
+                                </div>
+                            </div>
+                            {{else}}
+                              --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.actions}}
+                              {{#each this.actions}}
+                               <span class="badge badge-info">{{this}}</span>
+                              {{/each}}
+                            {{else}}
+                              --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.accessTypes}}
+                              {{#each this.accessTypes}}
+                               <span class="badge badge-info">{{this}}</span>
+                              {{/each}}
+                            {{else}}
+                              --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.users}}
+                              {{#each this.users}}
+                               <span class="badge badge-info">{{this}}</span>
+                              {{/each}}
+                            {{else}}
+                              --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.groups}}
+                              {{#each this.groups}}
+                               <span class="badge badge-info">{{this}}</span>
+                              {{/each}}
+                            {{else}}
+                                 --
+                            {{/if}}
+                        </td>
+                        <td>
+                            {{#if this.roles}}
+                              {{#each this.roles}}
+                               <span class="badge badge-info">{{this}}</span>
+                              {{/each}}
+                            {{else}}
+                                 --
+                            {{/if}}
+                        </td>
+                    </tr>
+                {{/each}}
+            </tbody>
+        </table>
+    </div>
 </div>
\ No newline at end of file