aboutsummaryrefslogtreecommitdiffstats
path: root/moon_dashboard/moon/static/moon/policy/policy.html
blob: ba13bec291506ff64ffcaa75b72f5e7e1dc6af50 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
<div ng-controller="moon.policy.controller as ctrl">
  <div class="clearfix list-group">
    <div class="pull-right">
      <input type="search" class="form-control filter" placeholder="Filter" ng-model="filterText">
      <button type="button" class="btn btn-default" ng-click="ctrl.createPolicy()">
        <span class="fa fa-plus"></span>
        <translate>Create Policy</translate>
      </button>
    </div>
  </div>

  <div class="list-group">
    <div ng-repeat="policy in ctrl.model.policies | orderBy:'name' | filter:filterText" class="list-group-item" ng-init="toggle = {};toggle.showUnused = false">
      <h3 class="list-group-item-heading inline">{$ policy.name $}</h3>
      <div class="pull-right">
        <button type="button" class="fa fa-trash" title="{$ 'Remove Policy' | translate $}" ng-click="ctrl.removePolicy(policy)"></button>
        <button type="button" class="fa fa-edit" title="{$ 'Edit Policy' | translate $}" ng-click="ctrl.updatePolicy(policy)"></button>
      </div>
      <p class="list-group-item-text">{$ policy.description $}</p>
      <h4 class="list-group-item-text">
        <translate>Model: {$ policy.model ? policy.model.name : 'none' $}</translate>
      </h4>
      <h4 class="list-group-item-text">
        <translate>Genre:</translate>
        <translate>{$ policy.genre ? policy.genre : 'none' $}</translate>
      </h4>
      <div ng-if="policy.unusedSubjectData.length  
            || policy.unusedSubjectData.length
            || policy.unusedSubjectData.length" class="alert alert-dismissable alert-warning">
        <button type="button" class="close" data-dismiss="alert" ng-click="toggle.showUnused=false">×</button>
        <h4 translate>Warning!</h4>
        <p translate>
          Some data are unused, please check them and delete them if necessary.
          <a href="" ng-click="toggle.showUnused=true" ng-show="!toggle.showUnused" translate>Show unused data</a>
          <a href="" ng-click="toggle.showUnused=false" ng-show="toggle.showUnused" translate>Hide unused data</a>
        </p>
      </div>

      <div ng-if="toggle.showUnused" class="list-group-item-text overflow-hidden">
        <div class="list-group col-lg-3" ng-if="policy.unusedSubjectData.length">
          <h3 class="list-group-item active" translate>Unused Subject data</h3>
          <div ng-repeat="subject in policy.unusedSubjectData | orderBy:'name'" class="list-group-item">
            <h4 class="list-group-item-heading inline" title="{$ subject.description $}">{$ subject.name $}</h4>
            <button type="button" class="fa fa-trash pull-right" ng-click="ctrl.removeData('subject', policy, subject)" title="{$ 'Remove Subject data' | translate $}"></button>
          </div>
        </div>

        <div class="list-group col-lg-3" ng-if="policy.unusedObjectData.length">
          <h3 class="list-group-item active" translate>Unused Object data</h3>
          <div ng-repeat="object in policy.unusedObjectData | orderBy:'name'" class="list-group-item">
            <h4 class="list-group-item-heading inline" title="{$ object.description $}">{$ object.name $}</h4>
            <button type="button" class="fa fa-trash pull-right" ng-click="ctrl.removeData('object', policy, object)" title="{$ 'Remove Object data' | translate $}"></button>
          </div>
        </div>

        <div class="list-group col-lg-3" ng-if="policy.unusedActionData.length">
          <h3 class="list-group-item active" translate>Unused Action data</h3>
          <div ng-repeat="action in policy.unusedActionData | orderBy:'name'" class="list-group-item">
            <h4 class="list-group-item-heading inline" title="{$ action.description $}">{$ action.name $}</h4>
            <button type="button" class="fa fa-trash pull-right" ng-click="ctrl.removeData('action', policy, action)" title="{$ 'Remove Action data' | translate $}"></button>
          </div>
        </div>
        
      </div>


      <details class="list-group-item-text">
        <summary ng-click="ctrl.populatePolicy(policy)">
          <h4 class="inline" translate>Rules</h4>
          <button type="button" class="fa fa-plus " ng-click="ctrl.addRule(policy)" title="{$ 'Add Rule' | translate $}"></button>
        </summary>
        <div class="list-group">
          <p ng-if="!policy.rules" class="list-group-item-text" translate>Loading rules...</p>
          <div ng-if="policy.rules" ng-repeat="rule in policy.rules | orderBy:'name'" class="list-group-item">
            <div class="list-group-item-heading" ng-if="ctrl.selectedRule != rule">
              <div class="inline-block width-200">
                <b>
                  <translate>Metarule: </translate>
                </b> {$ rule.metaRule.name $}
              </div>
              <b>
                <translate>Rule: </translate>
              </b>
              <span ng-repeat="data in rule.subjectData">
                <span>{$ data.name $}{$ $last ? '' : ', ' $}</span>
              </span> |
              <span ng-repeat="data in rule.actionData">
                <span>{$ data.name $}{$ $last ? '' : ', ' $}</span>
              </span> |
              <span ng-repeat="data in rule.objectData">
                <span>{$ data.name $}{$ $last ? '' : ', ' $}</span>
              </span>
              <div class="pull-right">
                <button type="button" class="fa fa-trash pull-right" ng-click="ctrl.removeRuleFromPolicy(policy, rule)" title="{$ 'Remove Rule' | translate $}"></button>
                <button type="button" class="fa fa-eye pull-right" ng-click="ctrl.showRule(rule)" title="{$ 'Show Rule' | translate $}"></button>
              </div>
            </div>

            <div ng-if="ctrl.selectedRule == rule">
              <h3 class="list-group-item-heading inline">
                <translate>Metarule: </translate> {$ rule.metaRule.name $}</h3>
              <div class="pull-right">
                <button type="button" class="fa fa-trash pull-right" ng-click="ctrl.removeRuleFromPolicy(policy, rule)" title="{$ 'Remove Rule' | translate $}"></button>
                <button type="button" class="fa fa-eye-slash pull-right" ng-click="ctrl.hideRule()" title="{$ 'Hide Rule' | translate $}"></button>
              </div>
              <p class="list-group-item-text">
                <table class="table">
                  <thead>
                    <tr>
                      <th>
                        <span translate>Subjects</span>
                      </th>
                      <th>
                        <span translate>Objects</span>
                      </th>
                      <th>
                        <span translate>Actions</span>
                      </th>
                      <th>
                        <span translate>Instructions</span>
                      </th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <td>
                        <p ng-repeat="data in rule.subjectData">
                          <span ng-class="{'text-primary': ctrl.currentData.data == data}" title="{$ data.description $}">{$ data.name $}</span>
                          <button ng-if="ctrl.currentData.data != data" type="button" class="fa fa-exchange pull-right" ng-click="ctrl.assignData('subject', policy, data)"
                            title="{$ 'Assign to perimeters' | translate $}"></button>
                          <button ng-if="ctrl.currentData.data == data" type="button" class="fa fa-times pull-right" ng-click="ctrl.currentData = null"
                            title="{$ 'Close' | translate $}"></button>
                        </p>
                      </td>
                      <td>
                        <p ng-repeat="data in rule.objectData">
                          <span ng-class="{'text-primary': ctrl.currentData.data == data}" title="{$ data.description $}">{$ data.name $}</span>
                          <button ng-if="ctrl.currentData.data != data" type="button" class="fa fa-exchange pull-right" ng-click="ctrl.assignData('object', policy, data)"
                            title="{$ 'Assign to perimeters' | translate $}"></button>
                          <button ng-if="ctrl.currentData.data == data" type="button" class="fa fa-times pull-right" ng-click="ctrl.currentData = null"
                            title="{$ 'Close' | translate $}"></button>
                        </p>
                      </td>
                      <td>
                        <p ng-repeat="data in rule.actionData">
                          <span ng-class="{'text-primary': ctrl.currentData.data == data}" title="{$ data.description $}">{$ data.name $}</span>
                          <button ng-if="ctrl.currentData.data != data" type="button" class="fa fa-exchange pull-right" ng-click="ctrl.assignData('action', policy, data)"
                            title="{$ 'Assign to perimeters' | translate $}"></button>
                          <button ng-if="ctrl.currentData.data == data" type="button" class="fa fa-times pull-right" ng-click="ctrl.currentData = null"
                            title="{$ 'Close' | translate $}"></button>
                        </p>
                      </td>
                      <td>
                        <pre ng-bind="rule.instructions | json "></pre>
                      </td>
                    </tr>
                  </tbody>
                </table>
                <div ng-if="ctrl.currentData && ctrl.currentData.loading" class="row padding-10">
                  <h4 translate>Loading...</h4>
                </div>
                <div ng-if="ctrl.currentData && !ctrl.currentData.loading" class="row">
                  <div class="padding-10">
                    <h3>
                      <translate>Assign perimeters to</translate> {$ ctrl.currentData.data.name $}</h3>
                    <input type="search" class="form-control filter" placeholder="Filter" ng-model="filterPerimeter">
                    <button type="button" class="btn btn-default" ng-click="ctrl.createPerimeter(ctrl.currentData.type, policy)">
                      <span class="fa fa-plus"></span>
                      <translate>Create Perimeter</translate>
                    </button>
                  </div>
                  <div>
                    <div class="col-lg-4">
                      <h4 translate>All perimeters</h4>
                      <div class="w-100 height-200 scroll list-group border">
                        <button class="list-group-item" ng-repeat="perimeter in ctrl.currentData.allPerimeters | orderBy:'name' | filter:filterPerimeter"
                          title="{$ perimeter.description $}" ng-click="ctrl.addPerimeter(ctrl.currentData.type, policy, perimeter)">{$ perimeter.name $}</button>

                      </div>
                      <p translate class="mt-5">Click to add</p>
                    </div>

                    <div class="col-lg-4">
                      <h4 translate>Policy perimeters</h4>
                      <div class="w-100 height-200 scroll list-group border">
                        <div ng-click="ctrl.assign(ctrl.currentData.type, policy, perimeter, ctrl.currentData.data)" class="list-group-item" ng-repeat="perimeter in ctrl.currentData.perimeters | orderBy:'name' | filter:filterPerimeter">
                          <span title="{$ perimeter.description $}">
                            {$ perimeter.name $}
                          </span>
                          <button type="button" class="fa fa-trash pull-right" ng-click="$event.stopPropagation();ctrl.removePerimeterFromPolicy(ctrl.currentData.type, policy, perimeter)"
                            title="{$ 'Remove Perimeter' | translate $}"></button>
                        </div>

                      </div>
                      <p translate class="mt-5">Click to assign</p>
                    </div>
                    <div class="col-lg-4">
                      <h4 translate>Assigned perimeters</h4>
                      <div class="w-100 list-group border height-200 scroll">
                        <button class="list-group-item" ng-repeat="perimeter in ctrl.currentData.assignments | orderBy:'name' | filter:filterPerimeter"
                          title="{$ perimeter.description $}" ng-click="ctrl.unassign(ctrl.currentData.type, policy, perimeter, ctrl.currentData.data)">{$ perimeter.name $}</button>
                      </div>
                      <p translate class="mt-5">Click to unassign</p>
                    </div>
                  </div>
                </div>
              </p>
            </div>
          </div>
        </div>
      </details>
    </div>
  </div>
</div>