config.html 22.7 KB
Newer Older
1 2 3 4 5 6
<!DOCTYPE html>
<html data-ng-app="application">

<head>
    <meta charset="UTF-8">
    <title>apollo</title>
L
lepdou 已提交
7 8 9 10
    <link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="vendor/angular/angular-toastr-1.4.1.min.css">
    <link rel="stylesheet" type="text/css" media='all' href="vendor/angular/loading-bar.min.css">
    <link rel="stylesheet" type="text/css" href="styles/common-style.css">
11 12 13 14
</head>

<body>

L
lepdou 已提交
15
<div ng-include="'views/common/nav.html'"></div>
L
lepdou 已提交
16

L
lepdou 已提交
17
<div class="container-fluid apollo-container">
L
lepdou 已提交
18
    <div class="app" ng-controller="AppConfigController as appConfig">
L
lepdou 已提交
19

L
lepdou 已提交
20 21
        <!--配置信息-->
        <div id="config-info">
L
lepdou 已提交
22

L
lepdou 已提交
23 24 25
            <!--具体配置信息-->
            <div class="row config-info-container">
                <!--tag导航-->
26
                <div class="col-md-3">
L
lepdou 已提交
27
                    <div id="treeview"></div>
28 29 30
                    <!--app info-->
                    <section class="panel">
                        <header class="panel-heading">
L
lepdou 已提交
31
                            <img src="img/info.png" class="i-25-20"/> 应用信息
L
lepdou 已提交
32 33 34
                            <span class="tools pull-right">
                                <a href="javascript:;" class="icon-chevron-down"></a>
                            </span>
35 36 37 38 39 40
                        </header>
                        <div class="panel-body">
                            <table class="project-info">
                                <tbody>
                                <tr>
                                    <th>应用ID:</th>
L
lepdou 已提交
41
                                    <td>{{appBaseInfo.appId}}</td>
42 43 44
                                </tr>
                                <tr>
                                    <th>应用名:</th>
L
lepdou 已提交
45
                                    <td>{{appBaseInfo.name}}</td>
46 47 48
                                </tr>
                                <tr>
                                    <th>Owner:</th>
L
lepdou 已提交
49
                                    <td>{{appBaseInfo.ownerName}}</td>
50 51 52
                                </tr>
                                <tr>
                                    <th>Owner Email:</th>
L
lepdou 已提交
53 54 55 56 57 58 59 60 61
                                    <td>{{appBaseInfo.ownerEmail}}</td>
                                </tr>
                                <tr ng-show="missEnvs.length > 0">
                                    <th>缺失的环境:</th>
                                    <td>
                                        <font ng-repeat="env in missEnvs">
                                            {{env}}
                                        </font>
                                    </td>
62 63 64
                                </tr>
                                </tbody>
                            </table>
L
lepdou 已提交
65

66 67
                        </div>
                    </section>
L
lepdou 已提交
68 69
                    <a class="list-group-item" data-toggle="modal" data-target="#createEnvModal"
                       ng-show="missEnvs.length > 0">
L
lepdou 已提交
70
                        <div class="row">
L
lepdou 已提交
71
                            <div class="col-md-2"><img src="img/plus.png" class="i-20"></div>
L
lepdou 已提交
72
                            <div class="col-md-7 hidden-xs">
L
lepdou 已提交
73
                                <p class="btn-title">添加环境</p>
L
lepdou 已提交
74 75 76
                            </div>
                        </div>
                    </a>
L
lepdou 已提交
77
                    <!--<a class="list-group-item" target="_blank" href="/views/config.html?#/appid={{app.appId}}">-->
78 79 80 81 82 83 84 85
                        <!--<div class="row">-->
                            <!--<div class="col-md-2"><img src="../img/plus.png" class="i-20"></div>-->
                            <!--<div class="col-md-7 hidden-xs">-->
                                <!--<p class="apps-description">添加集群</p>-->
                            <!--</div>-->

                        <!--</div>-->
                    <!--</a>-->
L
lepdou 已提交
86
                    <a class="list-group-item" href="namespace.html?#/appid={{pageContext.appId}}&type=link">
L
lepdou 已提交
87 88 89 90 91 92 93
                        <div class="row">
                            <div class="col-md-2"><img src="img/plus.png" class="i-20"></div>
                            <div class="col-md-7 hidden-xs">
                                <p class="btn-title">添加Namespace</p>
                            </div>
                        </div>
                    </a>
L
lepdou 已提交
94
                    </section>
95
                </div>
L
lepdou 已提交
96

97
                <div class="col-md-9 config-item-container">
L
lepdou 已提交
98 99 100 101
                    <div ng-repeat="namespace in namespaces">
                        <div class="panel">
                            <header class="panel-heading">
                                <div class="row">
L
lepdou 已提交
102
                                    <div class="col-md-4">
L
lepdou 已提交
103 104 105 106
                                        <b>{{namespace.namespace.namespaceName}}</b>
                                                <span class="label label-info" ng-show="namespace.itemModifiedCnt > 0">有修改,可发布
                                                <span class="badge">{{namespace.itemModifiedCnt}}</span></span>
                                    </div>
L
lepdou 已提交
107
                                    <div class="col-md-7">
L
lepdou 已提交
108 109
                                        <div class="btn-toolbar" role="toolbar" aria-label="...">
                                            <div class="btn-group" role="group" aria-label="...">
L
lepdou 已提交
110 111 112 113
                                                <button type="button" data-toggle="modal" data-target="#releaseModal"
                                                        class="btn btn-default btn-sm J_tableview_btn"
                                                        ng-disabled="namespace.isTextEditing"
                                                        ng-click="prepareReleaseNamespace(namespace)">发布
L
lepdou 已提交
114
                                                </button>
115 116 117 118 119 120 121
                                                <!--<button type="button"-->
                                                        <!--class="btn btn-default btn-sm J_tableview_btn">回滚-->
                                                <!--</button>-->
                                                <!--<button type="button"-->
                                                        <!--class="btn btn-default btn-sm J_historyview_btn">-->
                                                    <!--查看历史版本-->
                                                <!--</button>-->
L
lepdou 已提交
122 123 124
                                            </div>
                                            <div class="btn-group" role="group" aria-label="...">
                                                <div class="btn-group" role="group">
125 126 127
                                                    <!--<button type="button"-->
                                                            <!--class="btn btn-default btn-sm J_tableview_btn">授权-->
                                                    <!--</button>-->
L
lepdou 已提交
128
                                                    <a type="button" target="_blank"
L
lepdou 已提交
129
                                                       href="config/sync.html?#/appid={{pageContext.appId}}&env={{pageContext.env}}&clusterName={{pageContext.clusterName}}&namespaceName={{namespace.namespace.namespaceName}}"
L
lepdou 已提交
130 131
                                                       class="btn btn-default btn-sm J_tableview_btn">同步
                                                    </a>
L
lepdou 已提交
132 133
                                                </div>
                                            </div>
L
lepdou 已提交
134 135
                                            <div class="btn-group" role="group" aria-label="...">
                                                <button type="button"
L
lepdou 已提交
136
                                                        class="btn btn-default btn-sm J_tableview_btn"
L
lepdou 已提交
137
                                                        ng-click="switchView(namespace, 'text')">文本
L
lepdou 已提交
138 139
                                                </button>
                                                <button type="button"
L
lepdou 已提交
140 141
                                                        class="btn btn-default btn-sm J_tableview_btn"
                                                        ng-click="switchView(namespace, 'table')">表格
L
lepdou 已提交
142
                                                </button>
143 144 145 146 147
                                                <!--<button type="button"-->
                                                        <!--class="btn btn-default btn-sm J_historyview_btn"-->
                                                        <!--ng-click="switchView(namespace, 'history')">-->
                                                    <!--更改日志-->
                                                <!--</button>-->
L
lepdou 已提交
148
                                            </div>
L
lepdou 已提交
149
                                        </div>
L
lepdou 已提交
150
                                    </div>
L
lepdou 已提交
151

L
lepdou 已提交
152
                                    <div class="col-md-1 text-right">
L
lepdou 已提交
153 154 155 156 157
                                        <a data-toggle="tooltip" data-placement="top" title="取消修改"
                                           ng-show="namespace.isTextEditing" ng-click="toggleTextEditStatus(namespace)">
                                            <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                                        </a>
                                        <a data-toggle="tooltip" data-placement="top" title="修改配置"
L
fix  
lepdou 已提交
158
                                           ng-show="!namespace.isTextEditing && namespace.viewType == 'text'"
L
lepdou 已提交
159
                                           ng-click="toggleTextEditStatus(namespace)">
L
lepdou 已提交
160 161
                                            <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
                                        </a>
L
lepdou 已提交
162 163 164 165 166
                                        &nbsp;
                                        <a data-toggle="modal" data-target="#commitModal"
                                           ng-show="namespace.isTextEditing" ng-click="saveDraft(namespace)">
                                            <span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
                                        </a>
L
lepdou 已提交
167 168
                                    </div>
                                </div>
L
lepdou 已提交
169
                            </header>
L
lepdou 已提交
170

171
                            <!--text view-->
L
lepdou 已提交
172
                            <textarea class="form-control" rows="{{namespace.itemCnt}}"
L
lepdou 已提交
173
                                      ng-show="namespace.viewType == 'text'"
L
bugfix  
lepdou 已提交
174
                                      ng-disabled="!namespace.isTextEditing" ng-model="namespace.text">
L
lepdou 已提交
175 176
{{namespace.text}}
                                </textarea>
L
lepdou 已提交
177

178
                            <!--table view-->
L
lepdou 已提交
179
                            <div class="namespace-view-table">
L
lepdou 已提交
180
                                <table class="table table-bordered table-striped text-center table-hover"
L
lepdou 已提交
181
                                       ng-show="namespace.viewType == 'table'">
L
lepdou 已提交
182 183
                                    <thead>
                                    <tr>
L
lepdou 已提交
184
                                        <th>
L
lepdou 已提交
185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200
                                            Key
                                        </th>
                                        <th>
                                            value
                                        </th>
                                        <th>
                                            备注
                                        </th>
                                        <th>
                                            最后修改人
                                        </th>
                                        <th>
                                            最后修改时间
                                        </th>
                                    </tr>
                                    </thead>
201
                                    <tbody>
L
lepdou 已提交
202

203 204 205 206
                                    <tr title="点击查看" data-toggle="modal" data-target="#oldValueModal"
                                        ng-repeat="config in namespace.items" ng-class="{warning:config.modified}"
                                        ng-if="config.item.key"
                                        ng-click="watchItem(config.item.key, config.item.value, config.oldValue)">
207
                                        <td width="25%">
208 209
                                            {{config.item.key | limitTo: 20}} {{config.item.key.length > 20 ? '...' :
                                            ''}}
L
lepdou 已提交
210
                                        </td>
211
                                        <td width="30%">
212 213
                                            {{config.item.value | limitTo: 20}} {{config.item.value.length > 20 ? '...'
                                            : ''}}
L
lepdou 已提交
214
                                        </td>
215
                                        <td width="20%">
216 217
                                            {{config.item.comment | limitTo: 20}} {{config.item.comment.length > 20 ?
                                            '...' : ''}}
L
lepdou 已提交
218
                                        </td>
219
                                        <td width="10%">
L
lepdou 已提交
220
                                            {{config.item.lastModifiedBy}}
L
lepdou 已提交
221
                                        </td>
222
                                        <td width="15%">
L
lepdou 已提交
223
                                            {{config.item.lastModifiedTime | date: 'yyyy-MM-dd HH:mm:ss'}}
L
lepdou 已提交
224 225 226 227 228 229
                                        </td>

                                    </tr>
                                    </tbody>
                                </table>
                            </div>
L
lepdou 已提交
230

L
lepdou 已提交
231
                            <!--历史修改视图-->
L
lepdou 已提交
232
                            <div class="J_historyview history-view"
L
lepdou 已提交
233
                                 ng-show="namespace.viewType == 'history'">
L
lepdou 已提交
234 235 236
                                <div class="row">
                                    <div class="col-md-11 col-md-offset-1 list" style="">
                                        <div class="media">
L
lepdou 已提交
237
                                            <img src="img/history.png"/>
L
lepdou 已提交
238 239 240 241 242 243 244 245 246 247 248 249

                                            <div class="row">
                                                <div class="col-md-10"><h5 class="media-heading">2016-02-23
                                                    12:23
                                                    王玉</h5>

                                                    <p>
                                                        修改comment
                                                    </p></div>
                                                <div class="col-md-2 text-right">
                                                    <button class="btn btn-default" type="submit">查看修改内容
                                                    </button>
L
lepdou 已提交
250 251
                                                </div>
                                            </div>
L
lepdou 已提交
252 253 254
                                            <hr>
                                        </div>
                                        <div class="media">
L
lepdou 已提交
255
                                            <img src="img/history.png"/>
L
lepdou 已提交
256 257 258 259 260 261 262 263 264 265 266 267

                                            <div class="row">
                                                <div class="col-md-10"><h5 class="media-heading">2016-02-23
                                                    12:23
                                                    王玉</h5>

                                                    <p>
                                                        修改comment
                                                    </p></div>
                                                <div class="col-md-2 text-right">
                                                    <button class="btn btn-default" type="submit">查看修改内容
                                                    </button>
L
lepdou 已提交
268 269 270 271 272 273 274 275 276 277 278 279
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                </div>

280 281
            </div>

L
lepdou 已提交
282
        </div>
L
lepdou 已提交
283

L
lepdou 已提交
284
        <!-- view old value Modal -->
L
lepdou 已提交
285 286
        <div class="modal fade" id="oldValueModal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
L
lepdou 已提交
287 288 289 290
                <div class="modal-content">
                    <div class="modal-header panel-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span></button>
L
lepdou 已提交
291
                        <h4 class="modal-title">{{watch.key}}</h4>
L
lepdou 已提交
292
                    </div>
L
lepdou 已提交
293 294 295 296
                    <div class="modal-body" style="word-wrap: break-word;">
                        {{watch.value}}
                        <div ng-show="watch.oldValue">
                            <hr>
L
lepdou 已提交
297
                            <b>已发布的值:</b>{{watch.oldValue}}
L
lepdou 已提交
298
                        </div>
L
lepdou 已提交
299 300 301 302 303 304 305
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
L
lepdou 已提交
306

L
lepdou 已提交
307
        <!-- commit modify config modal-->
L
lepdou 已提交
308
        <div class="modal fade" id="commitModal" tabindex="-1" role="dialog">
L
lepdou 已提交
309 310 311 312 313
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header panel-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span></button>
L
lepdou 已提交
314
                        <h4 class="modal-title">Commit changes</h4>
L
lepdou 已提交
315 316
                    </div>
                    <div class="modal-body">
L
lepdou 已提交
317
                        <textarea rows="4" class="form-control" style="width:570px;" placeholder="Add an optional extended description..."
318
                                  ng-model="commitComment"></textarea>
L
lepdou 已提交
319 320
                    </div>
                    <div class="modal-footer">
L
lepdou 已提交
321
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
322 323 324
                        <button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="commitChange()">
                            提交
                        </button>
L
lepdou 已提交
325 326 327 328 329
                    </div>
                </div>
            </div>
        </div>

L
lepdou 已提交
330 331
        <!--create release modal-->
        <div class="modal fade" id="releaseModal" tabindex="-1" role="dialog">
L
lepdou 已提交
332 333 334 335 336
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header panel-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span></button>
L
lepdou 已提交
337
                        <h4 class="modal-title">发布</h4>
L
lepdou 已提交
338 339
                    </div>
                    <div class="modal-body">
340 341
                        <input type="text" class="form-control" placeholder="input release title"
                               ng-model="releaseTitle" required="required">
L
lepdou 已提交
342
                        <textarea rows="4" class="form-control" style="margin-top: 15px;" ng-model="releaseComment"
L
lepdou 已提交
343
                                  placeholder="Add an optional extended description..."></textarea>
L
lepdou 已提交
344 345
                    </div>
                    <div class="modal-footer">
L
lepdou 已提交
346
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
L
lepdou 已提交
347
                        <button type="submit" class="btn btn-primary" data-dismiss="modal" ng-click="release()">提交
348
                        </button>
L
lepdou 已提交
349 350 351 352
                    </div>
                </div>
            </div>
        </div>
L
lepdou 已提交
353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382

        <!--create env modal-->
        <div class="modal fade" id="createEnvModal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header panel-primary">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span></button>
                        <h4 class="modal-title">添加环境</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label>请选择环境:</label>
                            <div class="checkbox" ng-repeat="env in missEnvs">
                                <label>
                                    <input type="checkbox" name="selectedEnvs[]" value="{{env}}"
                                           ng-checked="selectedEnvs.indexOf(env) > -1" ng-click="toggleSelection(env)">{{env}}
                                </label>
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" data-dismiss="modal" ng-click="createEnvs()">添加
                        </button>
                    </div>
                </div>
            </div>
        </div>
L
lepdou 已提交
383

384
    </div>
L
lepdou 已提交
385 386
</div>

L
lepdou 已提交
387

L
lepdou 已提交
388
<div ng-include="'views/common/footer.html'"></div>
389

L
lepdou 已提交
390

L
lepdou 已提交
391
<!-- jquery.js -->
L
lepdou 已提交
392
<script src="vendor/jquery.js" type="text/javascript"></script>
L
lepdou 已提交
393 394

<!--lodash.js-->
L
lepdou 已提交
395
<script src="vendor/lodash.min.js" type="text/javascript"></script>
L
lepdou 已提交
396

397
<!--nicescroll-->
L
lepdou 已提交
398
<script src="vendor/jquery.nicescroll.min.js"></script>
399

L
lepdou 已提交
400
<!--angular-->
L
lepdou 已提交
401 402 403 404 405
<script src="vendor/angular/angular.min.js"></script>
<script src="vendor/angular/angular-ui-router.min.js"></script>
<script src="vendor/angular/angular-resource.min.js"></script>
<script src="vendor/angular/angular-toastr-1.4.1.tpls.min.js"></script>
<script src="vendor/angular/loading-bar.min.js"></script>
L
lepdou 已提交
406 407

<!-- bootstrap.js -->
L
lepdou 已提交
408 409
<script src="vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="vendor/bootstrap/js/bootstrap-treeview.min.js" type="text/javascript"></script>
L
lepdou 已提交
410 411

<!--biz script-->
L
lepdou 已提交
412
<script type="application/javascript" src="scripts/app.js"></script>
L
lepdou 已提交
413 414

<!--service-->
L
lepdou 已提交
415 416 417
<script type="application/javascript" src="scripts/services/AppService.js"></script>
<script type="application/javascript" src="scripts/services/ConfigService.js"></script>
<script type="application/javascript" src="scripts/AppUtils.js"></script>
L
lepdou 已提交
418 419

<!--controller-->
L
lepdou 已提交
420
<script type="application/javascript" src="scripts/controller/app/AppConfigController.js"></script>
421

L
lepdou 已提交
422
<script type="application/javascript" src="scripts/PageCommon.js"></script>
423

424 425
</body>
</html>