nps/web/views/index/add.html

<div class="row tile">
    <div class="col-md-12 col-md-auto">
        <div class="ibox float-e-margins">
            <h3 class="ibox-title" langtag="page-add"></h3>
            <div class="ibox-content">
                <form class="form-horizontal">
                    <div class="form-group">
                        <label class="control-label font-bold" langtag="word-scheme"></label>
                        <div class="col-sm-10">
                            <select class="form-control" name="type" id="type">
                                <option {{if eq "tcp" .type}}selected{{end}} value="tcp" langtag="scheme-tcp"></option>
                                <option {{if eq "udp" .type}}selected{{end}} value="udp" langtag="scheme-udp"></option>
                                <option {{if eq "httpProxy" .type}}selected{{end}} value="httpProxy" langtag="scheme-httpProxy"></option>
                                <option {{if eq "socks5" .type}}selected{{end}} value="socks5" langtag="scheme-socks5">
                                </option>
                                <option {{if eq "secret" .type}}selected{{end}} value="secret" langtag="scheme-secret"></option>
                                <option {{if eq "p2p" .type}}selected{{end}} value="p2p" langtag="scheme-p2p"></option>
                            {{/*<option {{if eq "file" .type}}selected{{end}} value="file" langtag="scheme-file"></option>*/}}
                            </select>

                        </div>
                    </div>

                    <div class="form-group" id="client_id">
                        <label class="control-label font-bold" langtag="word-clientid"></label>
                        <div class="col-sm-10">
                            <input value="{{.client_id}}" class="form-control" type="text" name="client_id" placeholder="" langtag="word-clientid">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="control-label font-bold" langtag="word-remark"></label>
                        <div class="col-sm-10">
                            <input class="form-control" type="text" name="remark" placeholder="" langtag="info-unrestricted">
                        </div>
                    </div>
                {{if eq true .allow_multi_ip}}
                    <div class="form-group" id="server_ip">
                        <label class="control-label font-bold" langtag="word-serverip"></label>
                        <div class="col-sm-10">
                            <input class="form-control" type="text" value="0.0.0.0" name="server_ip" placeholder="" langtag="info-suchasip">
                        </div>
                    </div>
                {{end}}
                    <div class="form-group" id="port">
                        <label class="control-label font-bold" langtag="word-serverport"></label>
                        <div class="col-sm-10">
                            <input class="form-control" type="text" name="port" placeholder="" langtag="info-suchasport">
                        </div>
                    </div>

                {{if eq true .allow_local_proxy}}
                    <div class="form-group" id="local_proxy">
                        <label class="control-label font-bold" langtag="word-proxytolocal"></label>
                        <div class="col-sm-10">
                            <select class="form-control" name="local_proxy">
                                <option value="0" langtag="word-no"></option>
                                <option value="1" langtag="word-yes"></option>
                            </select>
                        </div>
                    </div>
                {{end}}

                    <div class="form-group" id="target">
                        <label class="control-label font-bold" langtag="word-target"></label>
                        <div class="col-sm-10">
                            <textarea class="form-control" name="target" rows="4" placeholder="" langtag="info-suchasiplist"></textarea>
                            <span class="help-block m-b-none" langtag="info-targettunnel"></span>
                        </div>
                    </div>

                    <div class="form-group" id="local_path">
                        <label class="control-label font-bold" langtag="word-localpath"></label>
                        <div class="col-sm-10">
                            <input class="form-control" type="text" name="local_path" placeholder="" langtag="info-suchaslocalpath">
                        </div>
                    </div>

                    <div class="form-group" id="strip_pre">
                        <label class="control-label font-bold" langtag="word-stripprefix"></label>
                        <div class="col-sm-10">
                            <input class="form-control" type="text" name="strip_pre" placeholder="" langtag="info-suchasstripprefix">
                        </div>
                    </div>

                    <div class="form-group" id="password">
                        <label class="control-label font-bold" langtag="word-identificationkey"></label>
                        <div class="col-sm-10">
                            <input class="form-control" type="text" name="password" placeholder="" langtag="word-identificationkey">
                            <span class="help-block m-b-none" langtag="info-identificationkey"></span>
                        </div>
                    </div>
                    <div class="hr-line-dashed"></div>
                    <div class="form-group">
                        <div class="col-sm-4 col-sm-offset-2">
                            <button class="btn btn-success" type="button" onclick="submitform('add', '{{.web_base_url}}/index/add', $('form').serializeArray())">
                                <i class="fa fa-fw fa-lg fa-check-circle"></i> <span langtag="word-add"></span>
                        </button>
                        </div>
                    </div>

                </form>
            </div>
        </div>
    </div>
</div>
<script>
    var arr = []
    arr["all"] = ["type", "port", "compress", "u", "p", "target", "password", "local_path", "strip_pre", "local_proxy"]
    arr["tcp"] = ["type", "port", "target", "u", "p", "compress", "local_proxy"]
    arr["udp"] = ["type", "port", "target", "compress", "local_proxy"]
    arr["socks5"] = ["type", "port", "compress", "u", "p"]
    arr["httpProxy"] = ["type", "port", "compress", "u", "p"]
    arr["secret"] = ["type", "target", "compress", "u", "p", "password"]
    arr["p2p"] = ["type", "target", "password"]
    arr["file"] = ["type", "port", "local_path", "strip_pre"]
    arrClientHide = ["compress", "u", "p", "crypt", "mux"]

    function resetForm() {
        for (var i = 0; i < arr["all"].length; i++) {
            $("#" + arr["all"][i]).css("display", "none")
        }
        o = $("#type option:selected").val()
        for (var i = 0; i < arr[o].length; i++) {
            $("#" + arr[o][i]).css("display", "block")
        }
    }

    function resetClientCnf() {
        for (var i = 0; i < arrClientHide.length; i++) {
            $("#" + arrClientHide[i]).css("display", "block")
        }
        op = $("#use_client  option:selected").val()
        if (op == 1) {
            for (var i = 0; i < arrClientHide.length; i++) {
                $("#" + arrClientHide[i]).css("display", "none")
            }
        }
    }

    $(function () {
        resetForm()
        resetClientCnf()
        $("#type").on("change", function () {
            resetForm()
            resetClientCnf()
        })
        $("#use_client").on("change", function () {
            resetForm()
            resetClientCnf()
        })
    })
</script>