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

<head>
    <meta charset="UTF-8">
    <title>apollo</title>
lepdou committed
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>

lepdou committed
15
<apollonav></apollonav>
lepdou committed
16

17 18 19 20 21 22
<div class="container-fluid apollo-container app" id="config-info">

    <!--具体配置信息-->
    <div class="row config-info-container">

        <!--tag导航-->
23
        <div class="col-md-3 col-xs-3 col-sm-3" ng-controller="ConfigBaseInfoController">
24 25 26 27 28
            <div id="treeview"></div>
            <!--app info-->
            <section class="panel">
                <header class="panel-heading">
                    <img src="img/info.png" class="i-25-20"/> 应用信息
lepdou committed
29 30 31
                            <span class="tools pull-right">
                                <a href="javascript:;" class="icon-chevron-down"></a>
                            </span>
32 33 34
                </header>
                <div class="panel-body">
                    <table class="project-info">
lepdou committed
35
                        <tbody class="text-left">
36
                        <tr>
37
                            <th>AppId:</th>
38 39 40 41 42 43 44
                            <td ng-bind="appBaseInfo.appId"></td>
                        </tr>
                        <tr>
                            <th>应用名:</th>
                            <td ng-bind="appBaseInfo.name"></td>
                        </tr>
                        <tr>
45 46 47 48 49
                            <th>部门:</th>
                            <td ng-bind="appBaseInfo.orgInfo"></td>
                        </tr>
                        <tr>
                            <th>负责人:</th>
50 51 52
                            <td ng-bind="appBaseInfo.ownerName"></td>
                        </tr>
                        <tr>
53
                            <th>负责人Email:</th>
54 55 56 57 58
                            <td ng-bind="appBaseInfo.ownerEmail"></td>
                        </tr>
                        <tr ng-show="missEnvs.length > 0">
                            <th>缺失的环境:</th>
                            <td>
lepdou committed
59 60
                                        <span ng-repeat="env in missEnvs" ng-bind="env">
                                        </span>
61 62 63 64
                            </td>
                        </tr>
                        </tbody>
                    </table>
lepdou committed
65

66 67
                </div>
            </section>
68
            <a class="list-group-item" ng-show="missEnvs.length > 0" ng-click="createAppInMissEnv()">
69 70
                <div class="row icon-text icon-plus-orange">
                    <p class="btn-title ng-binding">补缺环境</p>
71 72
                </div>
            </a>
lepdou committed
73

74
            <apolloentrance apollo-title="'添加集群'" apollo-img-src="'plus-orange'"
lepdou committed
75 76
                            apollo-href="'cluster.html?#/appid=' + pageContext.appId"></apolloentrance>

77
            <apolloentrance apollo-title="'添加Namespace'" apollo-img-src="'plus-orange'"
78
                            apollo-href="'namespace.html?#/appid=' + pageContext.appId"
lepdou committed
79 80
                            ng-show="hasCreateNamespacePermission"></apolloentrance>

81
            <apolloentrance apollo-title="'项目权限'" apollo-img-src="'user-manage'"
lepdou committed
82 83
                            apollo-href="'/app/role.html?#/appid=' + pageContext.appId"
                            ng-show="hasAssignUserPermission"></apolloentrance>
84 85 86 87
            </section>


        </div>
lepdou committed
88

89
        <!--namespaces-->
90
        <div class="col-md-9 col-xs-9 col-sm-9 config-item-container hide" ng-controller="ConfigNamespaceController">
91
            <div ng-repeat="namespace in namespaces">
lepdou committed
92 93 94 95
                <apollonspanel namespace="namespace" app-id="pageContext.appId"
                               env="pageContext.env" cluster="pageContext.clusterName"
                               pre-release-ns="prepareReleaseNamespace"
                               create-item="createItem" edit-item="editItem"
lepdou committed
96
                               pre-delete-item="preDeleteItem" commit-change="commitChange"
lepdou committed
97
                               pre-rollback="preRollback"></apollonspanel>
98
            </div>
lepdou committed
99

100
            <!-- delete modal-->
lepdou committed
101 102 103 104
            <apolloconfirmdialog apollo-dialog-id="'deleteConfirmDialog'" apollo-title="'删除配置'"
                                 apollo-detail="'确定要删除配置吗?'" apollo-confirm="deleteItem"></apolloconfirmdialog>

            <apolloconfirmdialog apollo-dialog-id="'releaseNoPermissionDialog'" apollo-title="'发布'"
lepdou committed
105
                                 apollo-detail="'您没有发布权限哦~ 请找 ' + masterUsers + ' 分配权限'"
lepdou committed
106
                                 apollo-show-cancel-btn="false"></apolloconfirmdialog>
107

108 109 110 111 112 113 114
            <apolloconfirmdialog apollo-dialog-id="'namespaceLockedDialog'" apollo-title="'编辑受限'"
                                 apollo-detail="'当前namespace正在被 ' + lockOwner + ' 编辑, 一次发布只能被一个人修改.'"
                                 apollo-show-cancel-btn="false"></apolloconfirmdialog>

            <apolloconfirmdialog apollo-dialog-id="'releaseDenyDialog'" apollo-title="'发布受限'"
                                 apollo-detail="'您不能发布哟~ 编辑和发布不能为同一个人'"
                                 apollo-show-cancel-btn="false"></apolloconfirmdialog>
lepdou committed
115

lepdou committed
116 117 118
            <apolloconfirmdialog apollo-dialog-id="'rollbackAlertDialog'" apollo-title="'回滚'"
                                 apollo-detail="'确定要回滚吗?'"
                                 apollo-show-cancel-btn="true" apollo-confirm="rollback"></apolloconfirmdialog>
lepdou committed
119 120


121 122 123
            <!--create release modal-->
            <form class="modal fade form-horizontal" name="releaseForm" valdr-type="Release" id="releaseModal"
                  tabindex="-1" role="dialog"
124 125 126 127 128 129 130 131 132 133
                  ng-submit="release()">
                <div class="modal-dialog" role="document" style="width: 960px">
                    <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">
134 135 136 137 138 139 140 141 142 143 144 145 146
                                <div class="col-sm-2 control-label" ng-if="!toReleaseNamespace.isPropertiesFormat">
                                    <div class="row">
                                        <div class="btn-group btn-group-xs" style="padding-right: 10px" role="group">
                                            <button type="button" class="btn btn-default" ng-class="{active:releaseChangeViewType=='change'}"
                                                    ng-click="switchReleaseChangeViewType('change')">查看变更
                                            </button>
                                            <button type="button" class="btn btn-default" ng-class="{active:releaseChangeViewType=='release'}"
                                                    ng-click="switchReleaseChangeViewType('release')">发布的值
                                            </button>
                                        </div>
                                    </div>
                                </div>
                                <label class="col-sm-2 control-label" ng-if="toReleaseNamespace.isPropertiesFormat">Changes</label>
lepdou committed
147
                                <div class="col-sm-10" ng-if="toReleaseNamespace.itemModifiedCnt" valdr-form-group>
lepdou committed
148 149

                                    <!--properites format-->
150
                                    <table class="table table-bordered table-striped text-center table-hover"
lepdou committed
151 152
                                           ng-show="toReleaseNamespace.itemModifiedCnt"
                                           ng-if="toReleaseNamespace.isPropertiesFormat">
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
                                        <thead>
                                        <tr>
                                            <th>
                                                Key
                                            </th>
                                            <th>
                                                Old Value
                                            </th>
                                            <th>
                                                New Value
                                            </th>
                                            <th>
                                                最后修改人
                                            </th>
                                            <th>
                                                最后修改时间
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>

                                        <tr ng-repeat="config in toReleaseNamespace.items"
                                            ng-if="config.item.key && config.isModified">
                                            <td width="20%" title="{{config.item.key}}">
                                                        <span class="label label-danger"
178
                                                              ng-show="config.isDeleted">deleted</span>
179 180 181 182 183 184 185 186 187 188 189
                                                <span ng-bind="config.item.key | limitTo: 250"></span>
                                                <span ng-bind="config.item.key.length > 250 ? '...' :''"></span>
                                            </td>
                                            <td width="25%" title="{{config.oldValue}}">
                                                <span ng-bind="config.oldValue | limitTo: 250"></span>
                                                <span ng-bind="config.oldValue.length > 250 ? '...': ''"></span>
                                            </td>
                                            <td width="25%" title="{{config.newValue}}">
                                                <span ng-bind="config.newValue | limitTo: 250"></span>
                                                <span ng-bind="config.newValue.length > 250 ? '...': ''"></span>
                                            </td>
lepdou committed
190
                                            <td width="15%" ng-bind="config.item.dataChangeLastModifiedBy">
191 192
                                            </td>
                                            <td width="15%"
lepdou committed
193
                                                ng-bind="config.item.dataChangeLastModifiedTime | date: 'yyyy-MM-dd HH:mm:ss'">
194 195 196 197
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
lepdou committed
198 199 200

                                    <!--file format -->
                                    <div ng-repeat="item in toReleaseNamespace.items"
201 202 203 204 205 206
                                         ng-if="!toReleaseNamespace.isPropertiesFormat" ng-show="releaseChangeViewType=='change'">
                                        <apollodiff old-str="item.oldValue" new-str="item.newValue"
                                                    apollo-id="'releaseStrDiff'"></apollodiff>
                                    </div>
                                    <div ng-repeat="item in toReleaseNamespace.items"
                                         ng-if="!toReleaseNamespace.isPropertiesFormat" ng-show="releaseChangeViewType=='release'">
lepdou committed
207
                                        <textarea class="form-control" rows="20" style="border-radius: 0px"
208 209
                                        ng-disabled="true" ng-show="item.newValue" ng-bind="item.newValue">
                                        </textarea>
lepdou committed
210 211
                                    </div>

212
                                </div>
lepdou committed
213
                                <div class="col-sm-5" valdr-form-group>
214
                                    <span ng-show="!toReleaseNamespace.itemModifiedCnt">
lepdou committed
215 216
                                        配置没有变化
                                    </span>
217
                                </div>
218 219 220 221 222
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">
                                    <apollorequiredfiled></apollorequiredfiled>
                                    Release Name:</label>
lepdou committed
223
                                <div class="col-sm-5" valdr-form-group>
224 225
                                    <input type="text" name="releaseName" class="form-control"
                                           placeholder="input release name"
226 227 228 229 230
                                           ng-model="releaseTitle" ng-required="true">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">Comment:</label>
lepdou committed
231
                                <div class="col-sm-10" valdr-form-group>
232 233
                                            <textarea rows="4" name="comment" class="form-control"
                                                      style="margin-top: 15px;"
lepdou committed
234 235
                                                      ng-model="releaseComment"
                                                      placeholder="Add an optional extended description..."></textarea>
lepdou committed
236 237
                                </div>
                            </div>
238 239 240 241 242


                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
243 244
                            <button type="submit" class="btn btn-primary"
                                    ng-disabled="releaseForm.$invalid || releaseBtnDisabled">发布
245
                            </button>
lepdou committed
246
                        </div>
247 248 249 250 251
                    </div>
                </div>
            </form>

            <!--table mode item modal-->
252 253
            <form class="modal fade form-horizontal" name="itemForm" valdr-type="Item" id="itemModal" role="dialog"
                  ng-submit="doItem()">
254 255 256
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header panel-primary">
257 258
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"
                                    ng-click="cancelEdit()"><span
259 260 261 262 263 264 265 266 267 268
                                    aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title">
                                <span ng-show="tableViewOperType == 'create'"> 添加配置项</span>
                                <span ng-show="tableViewOperType == 'update'"> 修改配置项</span>
                            </h4>
                        </div>
                        <div class="modal-body">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">
                                    <apollorequiredfiled
269
                                            ng-show="tableViewOperType == 'create'"></apollorequiredfiled>
270 271
                                    Key
                                </label>
lepdou committed
272 273
                                <div class="col-sm-10" valdr-form-group>
                                    <input type="text" name="key" class="form-control" ng-model="item.key"
274
                                           ng-required="true" ng-disabled="tableViewOperType != 'create'">
lepdou committed
275
                                </div>
276 277 278
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">
279
                                    <apollorequiredfiled></apollorequiredfiled>
280 281
                                    Value
                                </label>
lepdou committed
282
                                <div class="col-sm-10" valdr-form-group>
283 284
                                            <textarea type="text" name="value" class="form-control" rows="6"
                                                      ng-model="item.value">
lepdou committed
285
                                                </textarea>
286 287 288 289
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">Comment</label>
lepdou committed
290
                                <div class="col-sm-10" valdr-form-group>
291 292
                                            <textarea class="form-control" name="comment" ng-model="item.comment"
                                                      rows="2">
lepdou committed
293
                                            </textarea>
lepdou committed
294
                                </div>
295
                            </div>
296
                            <div class="form-group" ng-show="tableViewOperType == 'create'">
297 298 299 300 301 302 303 304 305 306 307
                                <label class="col-sm-2 control-label">
                                    <apollorequiredfiled></apollorequiredfiled>
                                    选择集群</label>
                                <div class="col-sm-10">
                                    <apolloclusterselector apollo-app-id="pageContext.appId"
                                                           apollo-default-all-checked="false"
                                                           apollo-default-checked-env="pageContext.env"
                                                           apollo-default-checked-cluster="pageContext.clusterName"
                                                           apollo-select="collectSelectedClusters">

                                    </apolloclusterselector>
lepdou committed
308
                                </div>
lepdou committed
309 310
                            </div>
                        </div>
311 312
                        <div class="modal-footer">
                            </button>
313 314
                            <button type="button" class="btn btn-default" data-dismiss="modal" ng-click="cancelEdit()">
                                关闭
315 316
                            </button>
                            <button type="submit" class="btn btn-primary"
317 318
                                    ng-disabled="itemForm.$invalid || (addItemBtnDisabled && tableViewOperType == 'create')">
                                提交
319 320 321
                            </button>
                        </div>
                    </div>
lepdou committed
322
                </div>
323
            </form>
lepdou committed
324 325 326

            <!--rollback-->
            <form class="modal fade form-horizontal" id="rollbackModal" tabindex="-1" role="dialog"
lepdou committed
327
                  ng-submit="showRollbackAlertDialog()">
lepdou committed
328 329 330 331 332
                <div class="modal-dialog" role="document" style="width: 960px">
                    <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>
lepdou committed
333
                            <div class="modal-title text-center">
lepdou committed
334 335 336 337
                                <span style="font-size: 18px;" ng-bind="firstRelease.name"></span>
                                <span style="font-size: 18px;"> &nbsp;回滚到&nbsp;</span>
                                <span style="font-size: 18px;" ng-bind="secondRelease.name"></span>
                            </div>
lepdou committed
338 339 340 341 342 343 344
                        </div>
                        <div class="modal-body">
                            <div class="alert alert-warning" role="alert">
                                此操作将会回滚到上一个发布版本,且当前版本作废,但不影响正在修改的配置。可在发布历史页面查看当前生效的版本
                                <a target="_blank"
                                   href="/config/history.html?#/appid={{toRollbackNamespace.baseInfo.appId}}&env={{pageContext.env}}&clusterName={{toRollbackNamespace.baseInfo.clusterName}}&namespaceName={{toRollbackNamespace.baseInfo.namespaceName}}">点击查看</a>
                            </div>
lepdou committed
345 346

                            <div class="form-group" style="margin-top: 15px;">
lepdou committed
347 348 349 350 351
                                <!--properties format-->
                                <div class="col-sm-12"
                                     ng-if="releaseCompareResult.length > 0 && toRollbackNamespace.isPropertiesFormat">
                                    <table class="table table-bordered table-striped text-center table-hover"
                                           ng-if="toRollbackNamespace.isPropertiesFormat">
lepdou committed
352 353
                                        <thead>
                                        <tr>
lepdou committed
354 355 356
                                            <th>
                                                Type
                                            </th>
lepdou committed
357 358 359 360 361 362 363 364 365 366 367 368 369
                                            <th>
                                                Key
                                            </th>
                                            <th>
                                                回滚前
                                            </th>
                                            <th>
                                                回滚后
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>

lepdou committed
370 371
                                        <tr ng-repeat="change in releaseCompareResult">
                                            <td width="10%">
lepdou committed
372 373 374
                                                <span ng-show="change.type == 'ADDED'">新增</span>
                                                <span ng-show="change.type == 'MODIFIED'">更新</span>
                                                <span ng-show="change.type == 'DELETED'">删除</span>
lepdou committed
375 376
                                            </td>
                                            <td width="20%" ng-bind="change.entity.firstEntity.key">
lepdou committed
377 378

                                            </td>
lepdou committed
379
                                            <td width="35%" ng-bind="change.entity.firstEntity.value">
lepdou committed
380
                                            </td>
lepdou committed
381
                                            <td width="35%" ng-bind="change.entity.secondEntity.value">
lepdou committed
382 383 384 385 386
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
lepdou committed
387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406

                                <!--file format -->
                                <div class="col-sm-12"
                                     ng-if="releaseCompareResult.length > 0 && !toRollbackNamespace.isPropertiesFormat">
                                    <div ng-repeat="change in releaseCompareResult"
                                         ng-if="!toRollbackNamespace.isPropertiesFormat">
                                        <h5>回滚前</h5>
                                        <textarea class="form-control no-radius" rows="20"
                                                  ng-disabled="true" ng-bind="change.entity.firstEntity.value">
                                            </textarea>
                                        <hr>
                                        <h5>回滚后</h5>
                                        <textarea class="form-control no-radius" rows="20"
                                                  ng-disabled="true" ng-bind="change.entity.secondEntity.value">
                                            </textarea>
                                    </div>

                                </div>
                                <div class="col-sm-12 text-center" ng-if="releaseCompareResult.length == 0">
                                    <h4>
lepdou committed
407
                                        配置没有变化
lepdou committed
408
                                    </h4>
lepdou committed
409 410 411 412 413 414 415 416
                                </div>
                            </div>


                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                            <button type="submit" class="btn btn-danger" ng-if="releaseCompareResult.length > 0"
lepdou committed
417
                                    ng-disabled="rollbackBtnDisabled">回滚
lepdou committed
418 419 420 421 422 423
                            </button>
                        </div>
                    </div>
                </div>
            </form>

lepdou committed
424
        </div>
425
    </div>
lepdou committed
426

lepdou committed
427

lepdou committed
428 429
</div>

lepdou committed
430

lepdou committed
431
<div ng-include="'views/common/footer.html'"></div>
432

lepdou committed
433

lepdou committed
434
<!-- jquery.js -->
435
<script src="vendor/jquery.min.js" type="text/javascript"></script>
lepdou committed
436 437

<!--lodash.js-->
lepdou committed
438
<script src="vendor/lodash.min.js" type="text/javascript"></script>
lepdou committed
439

440
<!--nicescroll-->
lepdou committed
441
<script src="vendor/jquery.nicescroll.min.js"></script>
442

443
<!--angular-->
lepdou committed
444 445 446 447 448
<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>
449 450

<!-- bootstrap.js -->
lepdou committed
451 452
<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>
453

454 455
<script src="vendor/diff.min.js" type="text/javascript"></script>

456

lepdou committed
457 458 459 460
<!--valdr-->
<script src="vendor/valdr/valdr.min.js" type="text/javascript"></script>
<script src="vendor/valdr/valdr-message.min.js" type="text/javascript"></script>

461
<!--biz script-->
lepdou committed
462
<script type="application/javascript" src="scripts/app.js"></script>
lepdou committed
463 464

<!--service-->
lepdou committed
465
<script type="application/javascript" src="scripts/services/AppService.js"></script>
lepdou committed
466
<script type="application/javascript" src="scripts/services/EnvService.js"></script>
lepdou committed
467
<script type="application/javascript" src="scripts/services/UserService.js"></script>
lepdou committed
468
<script type="application/javascript" src="scripts/services/ConfigService.js"></script>
469
<script type="application/javascript" src="scripts/services/ReleaseService.js"></script>
lepdou committed
470
<script type="application/javascript" src="scripts/services/PermissionService.js"></script>
471
<script type="application/javascript" src="scripts/services/CommitService.js"></script>
472
<script type="application/javascript" src="scripts/services/NamespaceLockService.js"></script>
lepdou committed
473 474


lepdou committed
475
<script type="application/javascript" src="scripts/AppUtils.js"></script>
lepdou committed
476

lepdou committed
477
<!--directive-->
lepdou committed
478 479
<script type="application/javascript" src="scripts/directive/directive.js"></script>
<script type="application/javascript" src="scripts/directive/namespace-panel-directive.js"></script>
480
<script type="application/javascript" src="scripts/directive/diff-directive.js"></script>
lepdou committed
481

lepdou committed
482
<!--controller-->
483 484
<script type="application/javascript" src="scripts/controller/config/ConfigNamespaceController.js"></script>
<script type="application/javascript" src="scripts/controller/config/ConfigBaseInfoController.js"></script>
485

lepdou committed
486
<script type="application/javascript" src="scripts/PageCommon.js"></script>
487

lepdou committed
488
<script src="scripts/valdr.js" type="text/javascript"></script>
489 490
</body>
</html>