shadowsocks-manager/plugins/webgui/public/views/admin/addGroup.html

A shadowsocks manager tool for multi user and traffic control.

<div layout="column">
    <div flex="15"></div>
    <div flex layout="row">
        <div flex="10" flex-gt-sm="30"></div>
        <div flex layout="column" layout-align="space-around stretch">
            <div style="height: 30px;"></div>
            <form name="groupForm">
                <md-input-container class="md-block">
                    <label>名称</label>
                    <input type="text" required name="name" ng-model="group.name">
                    <div ng-messages="groupForm.name.$error">
                        <div ng-message="required">不能名称为空</div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block">
                    <label>备注</label>
                    <input type="text" required name="comment" ng-model="group.comment">
                    <div ng-messages="groupForm.comment.$error">
                        <div ng-message="required">备注不能为空</div>
                    </div>
                </md-input-container>
            </form>
            <div style="width: 100%;" layout="row" layout-align="space-between center">
                <div flex="75">显示公共的公告</div>
                <div flex layout="row" layout-align="end center">
                    <md-switch ng-model="group.showNotice" aria-label="showNotice" ng-true-value="1" ng-false-value="0">
                    </md-switch>
                </div>
            </div>
            <div style="width: 100%;" layout="row" layout-align="space-between center">
                <div flex="75">允许购买多个账号</div>
                <div flex layout="row" layout-align="end center">
                    <md-switch ng-model="group.multiAccount" aria-label="multiAccount" ng-true-value="1" ng-false-value="0">
                    </md-switch>
                </div>
            </div>
            <div style="width: 100%;" layout="row" layout-align="space-between center">
                <div flex="75">自定义分组订单</div>
                <div flex layout="row" layout-align="end center">
                    <md-switch ng-model="groupOrder" aria-label="groupOrder">
                    </md-switch>
                </div>
            </div>
            <div layout="column" layout-wrap flex ng-if="groupOrder">
                <div layout="column" layout-wrap flex ng-repeat="order in orders">
                    <div flex="100">
                        <md-checkbox ng-model="groupOrderObj[order.id]">
                            <div layout="row" layout-align="space-between center">
                                <span flex>{{ order.name }}</span>
                            </div>
                        </md-checkbox>
                    </div>
                </div>
            </div>
        </div>
        <div flex="10" flex-gt-sm="30"></div>
    </div>
    <div flex layout="row" layout-align="center start">
        <div flex="10" flex-gt-sm="30"></div>
        <div layout="row" flex layout-align="space-around center">
            <md-button class="md-primary" ng-click="cancel()">取消</md-button>
            <md-button class="md-raised md-primary" ng-click="confirm()" ng-disabled="!group.name">确认</md-button>
        </div>
        <div flex="10" flex-gt-sm="30"></div>
    </div>
</div>