<div class="region-manage">
    <div class="row" style="margin:0px;" ng-click="unSelectArea($event)">
        <div class="col-sm-12 tool-bar">
            <button class="btn btn-in-grid cannot-click" ng-class="{true:'region-btn-disable',false:''}[!canAdd]" ng-click="newRegion($event)" ng-disabled="!canAdd"><i class="material-icons middle">add_circle_outline</i><span class="cannot-click"> {{'Add' | translate }}</span></button>
            <button class="btn btn-in-grid cannot-click" ng-class="{true:'region-btn-disable',false:''}[!canEdit]" ng-click="edit($event)" ng-disabled="!canEdit"><i class="material-icons middle">create</i> {{'Edit' | translate }}</button>
            <button class="btn btn-in-grid cannot-click" ng-hide="!isActiveStr" ng-class="{true:'region-btn-disable',false:''}[!isActiveStr]" ng-disabled="!isActiveStr" ng-click="updateIsActive($event)"><i ng-hide="!isActiveOperate" class="material-icons middle">remove_circle</i><i ng-hide="isActiveOperate" class="material-icons enable">&#xE038;</i>{{isActiveStr}}</button>
            <export-button class="cannot-click" style="float: right; margin-right: 15px; margin-top: 9px;">
                <export-button>
                    <br />

</div>
    </div>
    <div class="row region-content" style="margin:0px;">
        <div class="col-md-3 col-lg-3 col-sm-3 border-gray region-tree-container" style="width: 25%;height: 100%;">
            <div class="dx-viewport grid-container" style="margin-top: 5px;">
                <div dx-tree-view="areaTreeViewOptions" dx-item-alias="areaTreeNodeObj">
                    <div data-options="dxTemplate: { name: 'itemAreaTreeTemplate' }">
                        <span ng-class="{false:'disable-item', true:''}[areaTreeNodeObj.data.isActive]" title="{{ areaTreeNodeObj.text  }}" class="ellipsis span-block">{{ areaTreeNodeObj.text  }}</span>
                    </div>
                </div>
            </div>
            <div class="alert alert-warning" style="display:none;">{{ output }}</div>
        </div>
        <div class="col-md-9 col-lg-9 col-sm-9 border-gray no-padding chinaMap-warp" ng-click="unSelectArea()">
            <div id="chinaMap" style="height:100%;width:100%;"></div>
        </div>
    </div>
    <!-- 添加区域 -->
    <div class="modal fade" id="addRegionPop" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" style="width:510px;height:200px;" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="modal-title" ng-if="isAdd">{{'AddRegionTitle' | translate }}</div>
                    <div class="modal-title" ng-if="!isAdd">{{'EditRegionTitle' | translate}}</div>
                </div>
                <div class="modal-body">
                    <form class="form-horizontal" id="addRegionForm">
                        <div class="form-group">
                            <label for="telCode" class="col-sm-3 control-label">{{'RegionNameLabel' | translate }}：</label>
                            <div class="col-sm-9">
                                <input class="form-control" name="areaName" id="areaName" maxlength="50" ng-model="editModel.areaName" placeholder="{{'RegionNamePlaceholder'|translate}}" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="telCode" class="col-sm-3 control-label">{{'RegionProviceLabel' | translate }}：</label>
                            <region-selector selected-node-list="selectedNodeList" selected-city-list="editModel.SelectedCityList" is-edit="editModel.isEdit"></region-selector>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" ng-click="save()">{{'Confirm' | translate }}</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">{{'Cancel' | translate }}</button>
                </div>
            </div>
        </div>
    </div>
</div>