<div class="well" ng-controller="tokenController">

    <div class="row">
        <div class="col-lg-3">
            <div class="pa-sidebar panel">
                <ul class="nav nav-pills nav-stacked">
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.list')}"><a
                            ui-sref="token.list"
                            translate>All tokens</a></li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.details')}"
                        ng-show="$state.includes('token.details')"><a>Token
                        {{ $stateParams.tokenSerial }}</a>
                    </li>

                    <li role="presentation"
                        ng-class="{active: $state.includes('token.enroll')}"
                            >
                        <a ui-sref="token.enroll">
                            <span class="glyphicon glyphicon-edit"></span>
                            <translate>Enroll Token</translate>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.assign')}"
                        ng-show="loggedInUser.role == 'user' &&
                            checkRight('assign')">
                        <a ui-sref="token.assign">
                            <span class="glyphicon glyphicon-plus"></span>
                            <translate>Assign Token</translate>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.import')}"
                        ng-show="loggedInUser.role == 'admin' &&
                            checkRight('importtokens')">
                        <a ui-sref="token.import">
                            <span class="glyphicon glyphicon-upload"></span>
                            <translate>Import Tokens</translate>
                        </a>
                    </li>
                    <hr>
                    <li role="presentation"
                        ng-class="{active: $state.includes('token.lost')}"
                        ng-show="($state.includes('token.details')||
                        $state.includes('token.lost')) &&
                        checkRight('losttoken')">
                        <a ui-sref="token.lost({tokenSerial:selectedToken.serial})">
                            <span class="glyphicon glyphicon-eye-open"></span>
                            <translate>Lost Token</translate>
                        </a>
                    </li>
                    <li role="presentation"
                        ng-show="loggedInUser.role == 'admin' &&
                            checkRight('getserial')"
                        ng-class="{active: $state.includes('token.getserial')}">
                        <a ui-sref="token.getserial">
                            <span class="glyphicon glyphicon-question-sign">
                            </span>
                            <translate>Get Serial</translate>
                        </a>
                    </li>
                </ul>

                <div translate>
                    total tokens: {{ tokendata.count }}
                </div>
            </div>

        </div>

        <div ui-view class="col-lg-9 slide panel">
        </div>

    </div>


</div>

