meanTorrent/modules/forums/client/views/admin/configure.client.view.html

<section class="container padding-top-10" ng-controller="ForumsAdminController as vm" ng-init="vm.init();">
    <div class="row margin-top-20 forum-list">
        <div class="col-md-10 col-md-offset-1">
            <button class="btn btn-success" ng-click="vm.popupCreateForum($event)">　　{{ 'FORUMS.BTN_ADD_FORUM' | translate }}　　</button>
        </div>

        <div class="col-sm-10 col-sm-offset-1 margin-top-30">
            <div class="table-responsive table-category" ng-repeat="cat in vm.forumsConfig.category">
                <table class="table table-hover table-valign-middle">
                    <thead>
                        <tr>
                            <th class="col-md-7">{{'FORUMS.CATEGORY.'+cat.name | translate}}</th>
                            <th class="text-center">{{'FORUMS.FIELDS.ORDER' | translate}}</th>
                            <th class="text-center">{{'FORUMS.FIELDS.MODERATORS' | translate}}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ng-repeat="f in vm.forums | filter: { category: cat.value }">
                            <td>
                                <h4>{{f.name}} <span class="badge badge_mt" ng-show="f.readOnly">R</span>
                                    <small>[<a href="#" ng-click="vm.popupEditForum($event, f);">{{'FORUMS.LINK_EDIT' | translate}}</a>]</small>
                                    <small>[<a href="#"
                                               uib-popover-template="vm.addModeratorPopover.templateUrl"
                                               popover-append-to-body="true"
                                               popover-title="{{vm.addModeratorPopover.title | translate}}"
                                               popover-trigger="'outsideClick'"
                                               popover-placement="top"
                                               popover-is-open="vm.addModeratorPopover.items[f._id]"
                                               popover-class="add-moderator-popover"
                                               ng-click="vm.addModeratorClicked(f);">{{vm.addModeratorPopover.title | translate}}</a>]
                                    </small>
                                </h4>

                                <p class="forum-desc" ng-bind-html="vm.getForumDesc(f);"></p>
                            </td>
                            <td class="text-center">{{f.order}}</td>
                            <td class="text-center">
                                <div ng-repeat="m in f.moderators">
                                    <span class="text-primary">{{m.username}}</span>
                                    <small>[
                                        <a href="#" ng-click="vm.removeModeratorClicked(f, m);">-</a> ]
                                    </small>
                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div id="popupSlide" side-overlay="right" side-class="forum-side-overlay" side-modal side-close-on-esc side-close-on-outside-click>
        <div class="forum-popup">
            <h3 class="margin-left-30">{{vm.actionTitle | translate}}</h3>
            <li class="status-divider"></li>
            <form class="form-horizontal margin-top-50">
                <div class="form-group">
                    <label for="forum-cat" class="col-sm-4 control-label">{{'FORUMS.FIELDS.CATEGORY' | translate}}</label>

                    <div class="col-sm-8">
                        <select class="form-control" id="forum-cat" ng-model="vm.forum.category" ng-change="vm.categoryChanged();">
                            <option ng-repeat="t in vm.forumsConfig.category" value="{{t.value}}">{{'FORUMS.CATEGORY.'+t.name | translate}}
                            </option>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="forum-name" class="col-sm-4 control-label">{{'FORUMS.FIELDS.NAME' | translate}}</label>

                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="forum-name" placeholder="{{'FORUMS.FIELDS.NAME' | translate}}"
                               ng-model="vm.forum.name">
                    </div>
                </div>
                <div class="form-group">
                    <label for="forum-desc" class="col-sm-4 control-label">{{'FORUMS.FIELDS.DESC' | translate}}</label>

                    <div class="col-sm-8">
                        <textarea class="form-control" id="forum-desc" placeholder="{{'FORUMS.FIELDS.DESC' | translate}}"
                                  ng-model="vm.forum.desc"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label for="forum-order" class="col-sm-4 control-label">{{'FORUMS.FIELDS.ORDER' | translate}}</label>

                    <div class="col-sm-8">
                        <input type="number" class="form-control" id="forum-order" placeholder="{{'FORUMS.FIELDS.NAME' | translate}}"
                               ng-model="vm.forum.order">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-4 col-sm-8">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" ng-model="vm.forum.readOnly"> {{'FORUMS.FIELDS.READONLY_POST' | translate}}
                            </label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-4 col-sm-8">
                        <button type="submit" class="btn btn-success"
                                ng-click="vm.createNewForum();"
                                ng-hide="vm.isEdit"
                                ng-disabled="!vm.forum.name || !vm.forum.desc ">{{'FORUMS.BTN_ADD' | translate}}
                        </button>
                        <button type="submit" class="btn btn-success"
                                ng-click="vm.editForum();"
                                ng-show="vm.isEdit"
                                ng-disabled="!vm.forum.name || !vm.forum.desc ">{{'FORUMS.BTN_EDIT' | translate}}
                        </button>
                        <button type="submit" class="btn btn-success"
                                ng-click="vm.deleteForum();"
                                ng-show="vm.isEdit"
                                ng-disabled="!vm.forum.name || !vm.forum.desc ">{{'FORUMS.BTN_DELETE' | translate}}
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <script type="text/ng-template" id="add-moderator.html">
        <form>
            <div class="form-group">
                <input type="text" ng-model="vm.addModeratorPopover.username" class="form-control"
                       placeholder="{{ 'STATUS_FIELD.USERNAME' | translate }}" autofocus>
            </div>
            <div class="margin-top-10">
                <button class="btn btn-default" ng-disabled="!vm.addModeratorPopover.username"
                        ng-click="vm.addModerator();">{{ 'FORUMS.BTN_ADD' | translate }}
                </button>
            </div>
        </form>
    </script>
</section>