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

A shadowsocks manager tool for multi user and traffic control.

<div layout-fill layout="row" layout-align="center center" ng-hide="account.type">
    <div flex style="height: 180px;"></div>
    <div flex layout="row" layout-align="center center">
        <md-progress-circular md-mode="indeterminate" class="md-accent"></md-progress-circular>
    </div>
    <div flex style="height: 180px;"></div>
</div>
<div layout="column" ng-show="account.type">
    <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>
            <div style="width: 100%;" layout="row" layout-align="space-between center">
                <div flex="75" translate>从订单中选择类型</div>
                <div flex layout="row" layout-align="end center">
                    <md-switch ng-model="account.fromOrder" aria-label="fromOrder" ng-true-value="1" ng-false-value="0">
                    </md-switch>
                </div>
            </div>
            <div style="width: 100%;" layout="row" layout-align="space-between center" ng-if="account.fromOrder === 1">
                <div flex="75" translate>更改类型时保持过期时间不变</div>
                <div flex layout="row" layout-align="end center">
                    <md-switch ng-model="account.fixedExpire" aria-label="fixedExpire">
                    </md-switch>
                </div>
            </div>
            <form name="accountForm">
                <md-input-container class="md-block" ng-show="account.fromOrder === 0">
                    <label translate>类型</label>
                    <div layout="row">
                        <md-select ng-model="account.type" flex="75">
                            <md-option ng-repeat="type in typeList" value="{{type.value}}" translate>{{ type.key }}</md-option>
                        </md-select>
                        <div ng-if="+account.type >= 2 && +account.type <= 5" layout="row" layout-align="end center">
                            <md-button ng-click="pickTime()">
                                <md-icon class="material-icons">access_time</md-icon>
                            </md-button>
                        </div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block" ng-show="+account.fromOrder === 1">
                    <label translate>类型</label>
                    <div layout="row">
                        <md-select ng-model="account.orderId" flex="75">
                            <md-option ng-repeat="order in orders" value="{{order.id}}" translate>{{ order.name }}</md-option>
                        </md-select>
                        <div layout="row" layout-align="end center">
                            <md-button ng-click="pickTime()">
                                <md-icon class="material-icons">access_time</md-icon>
                            </md-button>
                        </div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block">
                    <label translate>端口</label>
                    <input type="number" required name="port" ng-model="account.port">
                    <div ng-messages="accountForm.port.$error">
                        <div ng-message="required">端口不能为空</div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block">
                    <label translate>密码</label>
                    <input type="text" required disabled name="password" ng-model="account.password">
                    <div ng-messages="accountForm.password.$error">
                        <div ng-message="required">密码不能为空</div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block" ng-if="account.fromOrder === 1 || +account.type >= 1">
                    <label translate>流量</label>
                    <input type="text" required name="flow" ng-model="account.flowStr">
                    <div ng-messages="accountForm.flow.$error">
                        <div ng-message="required">流量不能为空</div>
                    </div>
                </md-input-container>
                <md-input-container class="md-block">
                    <label translate>自动删除延迟</label>
                    <input type="text" required name="autoRemoveDelay" ng-model="account.autoRemoveDelayStr" ng-disabled="!account.autoRemove">
                </md-input-container>
            </form>
            <div ng-if="account.fromOrder === 1 || +account.type >= 1" style="width: 100%; height: 52px;" layout="row" layout-align="space-between center" ng-click="setAccountServer()">
                <div flex="75" translate>
                    <span>自定义服务器&nbsp;[{{ account.server ? account.server.length : '∞' }}]</span>
                </div>
                <div flex layout="row" layout-align="end center">
                    <md-button class="md-icon-button"><md-icon>keyboard_arrow_right</md-icon></md-button>
                </div>
            </div>
            <div ng-if="account.fromOrder === 1 || +account.type >= 1" 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="account.multiServerFlow" aria-label="multiServerFlow" ng-true-value="1" ng-false-value="0">
                    </md-switch>
                </div>
            </div>
            <div ng-if="account.fromOrder === 1 || +account.type !== 1" 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="account.autoRemove" aria-label="autoRemove" 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="account.cleanFlow" aria-label="cleanFlow" ng-true-value="1" ng-false-value="0">
                    </md-switch>
                </div>
            </div>
        </div>
        <div flex="10" flex-gt-sm="30"></div>
    </div>
    <div style="height: 50px;"></div>
    <div class="bottom-nav">
        <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-warn" ng-click="deleteAccount()">删除</md-button>
                <md-button class="md-raised md-primary" ng-click="confirm()" ng-disabled="!account.port || !account.flowStr">确认</md-button>
            </div>
            <div flex="10" flex-gt-sm="30"></div>
        </div>
    </div>
</div>