sftpgo/templates/webadmin/admin.html

<!--
Copyright (C) 2024 Nicola Murino

This WebUI uses the KeenThemes Mega Bundle, a proprietary theme:

https://keenthemes.com/products/templates-mega-bundle

KeenThemes HTML/CSS/JS components are allowed for use only within the
SFTPGo product and restricted to be used in a resealable HTML template
that can compete with KeenThemes products anyhow.

This WebUI is allowed for use only within the SFTPGo product and
therefore cannot be used in derivative works/products without an
explicit grant from the SFTPGo Team ([email protected]).
-->
{{template "base" .}}

{{- define "page_body"}}
<div class="card shadow-sm">
    <div class="card-header bg-light">
        <h3 data-i18n="{{.Title}}" class="card-title section-title"></h3>
    </div>
    <div class="card-body">
        {{- template "errmsg" .Error}}
        <form id="admin_form" action="{{.CurrentURL}}" method="POST" autocomplete="off">
            <div class="form-group row">
                <label for="idUsername" data-i18n="login.username" class="col-md-3 col-form-label">Username</label>
                <div class="col-md-9">
                    <input id="idUsername" type="text" placeholder="" name="username" value="{{.Admin.Username}}" maxlength="255" autocomplete="off"
                        spellcheck="false" required {{if .IsAdd}}class="form-control"{{else}}class="form-control-plaintext readonly-input" readonly{{end}} />
                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idPassword" data-i18n="login.password" class="col-md-3 col-form-label">Password</label>
                <div class="col-md-9">
                    <input id="idPassword" type="password" class="form-control" name="password" autocomplete="new-password"
                        spellcheck="false" value="" {{if not .IsAdd}}aria-describedby="idPasswordHelp"{{end}} />
                    {{- if not .IsAdd}}
                    <div id="idPasswordHelp" class="form-text" data-i18n="admin.password_help"></div>
                    {{- end}}
                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idStatus" data-i18n="general.status" class="col-md-3 col-form-label">Status</label>
                <div class="col-md-9">
                    <select id="idStatus" name="status" class="form-select" data-control="i18n-select2" data-hide-search="true">
                        <option data-i18n="general.active" value="1" {{- if eq .Admin.Status 1 }} selected{{- end}}>Active</option>
                        <option data-i18n="general.inactive" value="0" {{- if eq .Admin.Status 0 }} selected{{- end}}>Inactive</option>
                    </select>
                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idPermissions" data-i18n="general.permissions" class="col-md-3 col-form-label">Permissions</label>
                <div class="col-md-9">
                    <select id="idPermissions" name="permissions" class="form-select" data-control="i18n-select2" data-hide-search="true" data-close-on-select="false" multiple>
                        {{- range $validPerm := .Admin.GetValidPerms}}
                        <option value="{{$validPerm}}" {{- range $perm :=$.Admin.Permissions }}{{- if eq $perm $validPerm}} selected{{- end}}{{- end}}>{{$validPerm}}</option>
                        {{- end}}
                    </select>
                </div>
            </div>

            {{- if .Roles}}
            <div class="card mt-10">
                <div class="card-header bg-light">
                    <h3 data-i18n="general.role" class="card-title section-title-inner">Role</h3>
                </div>
                <div class="card-body">
                    {{template "infomsg" "admin.role_help"}}
                    <div class="form-group row mt-10">
                        <label for="idRole" data-i18n="general.role" class="col-md-3 col-form-label">Role</label>
                        <div class="col-md-9">
                            <select id="idRole" name="role" data-i18n="[data-placeholder]general.role_placeholder" class="form-select" data-control="i18n-select2" data-placeholder="Select a role" data-allow-clear="true">
                                <option value=""></option>
                                {{- range .Roles}}
                                <option value="{{.Name}}" {{if eq $.Admin.Role .Name}}selected{{end}}>{{.Name}}</option>
                                {{- end}}
                            </select>
                        </div>
                    </div>
                </div>
            </div>
            {{- end}}

            {{- if .Groups}}
            <div class="card mt-10">
                <div class="card-header bg-light">
                    <h3 data-i18n="admin.users_groups" class="card-title section-title-inner">Groups for users</h3>
                </div>
                <div class="card-body">
                    <div id="groups">
                        {{template "infomsg" "admin.users_groups_help"}}
                        <div class="form-group">
                            <div data-repeater-list="groups">
                                {{range $idx, $val := .Admin.Groups}}
                                <div data-repeater-item>
                                    <div data-repeater-item>
                                        <div class="form-group row">
                                            <div class="col-md-6 mt-3 mt-md-8">
                                                <select name="group" data-i18n="[data-placeholder]general.group_placeholder" class="form-select select-repetear" data-allow-clear="true">
                                                    <option value=""></option>
                                                    {{- range $.Groups}}
                                                    <option value="{{.Name}}" {{- if eq $val.Name .Name}} selected{{- end}}>{{.Name}}</option>
                                                    {{- end}}
                                                </select>
                                            </div>
                                            <div class="col-md-5 mt-3 mt-md-8">
                                                <select name="group_type" class="form-select select-repetear">
                                                    <option value="0" data-i18n="admin.group_membership" {{if eq $val.Options.AddToUsersAs 0}}selected{{end}}>Add as membership</option>
                                                    <option value="1" data-i18n="admin.group_primary" {{if eq $val.Options.AddToUsersAs 1}}selected{{end}}>Add as primary</option>
                                                    <option value="2" data-i18n="admin.group_secondary" {{if eq $val.Options.AddToUsersAs 2}}selected{{end}}>Add as secondary</option>
                                                </select>
                                            </div>
                                            <div class="col-md-1 mt-3 mt-md-8">
                                                <a href="#" data-repeater-delete
                                                    class="btn btn-light-danger ps-5 pe-4">
                                                    <i class="ki-duotone ki-trash fs-2">
                                                        <span class="path1"></span>
                                                        <span class="path2"></span>
                                                        <span class="path3"></span>
                                                        <span class="path4"></span>
                                                        <span class="path5"></span>
                                                    </i>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {{- else}}
                                <div data-repeater-item>
                                    <div class="form-group row">
                                        <div class="col-md-6 mt-3 mt-md-8">
                                            <select name="group" data-i18n="[data-placeholder]general.group_placeholder" class="form-select select-repetear" data-allow-clear="true">
                                                <option value=""></option>
                                                {{- range $.Groups}}
                                                <option value="{{.Name}}">{{.Name}}</option>
                                                {{- end}}
                                            </select>
                                        </div>
                                        <div class="col-md-5 mt-3 mt-md-8">
                                            <select name="group_type" class="form-select select-repetear select-first">
                                                <option value="0" data-i18n="admin.group_membership">Add as membership</option>
                                                <option value="1" data-i18n="admin.group_primary">Add as primary</option>
                                                <option value="2" data-i18n="admin.group_secondary">Add as secondary</option>
                                            </select>
                                        </div>
                                        <div class="col-md-1 mt-3 mt-md-8">
                                            <a href="#" data-repeater-delete
                                                class="btn btn-light-danger ps-5 pe-4">
                                                <i class="ki-duotone ki-trash fs-2">
                                                    <span class="path1"></span>
                                                    <span class="path2"></span>
                                                    <span class="path3"></span>
                                                    <span class="path4"></span>
                                                    <span class="path5"></span>
                                                </i>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                                {{- end}}
                            </div>
                        </div>

                        <div class="form-group mt-5">
                            <a href="#" data-repeater-create class="btn btn-light-primary">
                                <i class="ki-duotone ki-plus fs-3"></i>
                                <span data-i18n="general.add">Add</span>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
            {{- end}}

            <div class="card mt-10">
                <div class="card-header bg-light">
                    <h3 data-i18n="admin.user_page_pref" class="card-title section-title-inner">User page preferences</h3>
                </div>
                <div class="card-body">
                    {{template "infomsg" "admin.user_page_pref_help"}}

                    <div class="form-group row mt-10">
                        <label for="idUserPageHiddenSections" data-i18n="admin.hide_sections" class="col-md-3 col-form-label">Hide sections</label>
                        <div class="col-md-9">
                            <select id="idUserPageHiddenSections" name="user_page_hidden_sections" class="form-select" data-control="i18n-select2" data-hide-search="true" data-close-on-select="false" multiple>
                                <option value="1" data-i18n="title.groups" {{if .Admin.Filters.Preferences.HideGroups}}selected{{end}}>Groups</option>
                                <option value="2" data-i18n="storage.title" {{if .Admin.Filters.Preferences.HideFilesystem}}selected{{end}}>Filesystem</option>
                                <option value="3" data-i18n="title.folders" {{if .Admin.Filters.Preferences.HideVirtualFolders}}selected{{end}}>Virtual Folders</option>
                                <option value="4" data-i18n="title.profile" {{if .Admin.Filters.Preferences.HideProfile}}selected{{end}}>Profile</option>
                                <option value="5" data-i18n="general.acls" {{if .Admin.Filters.Preferences.HideACLs}}selected{{end}}>ACLs</option>
                                <option value="6" data-i18n="general.quota_limits" {{if .Admin.Filters.Preferences.HideDiskQuotaAndBandwidthLimits}}selected{{end}}>Disk quota and bandwidth limits</option>
                                <option value="7" data-i18n="general.advanced_settings" {{if .Admin.Filters.Preferences.HideAdvancedSettings}}selected{{end}}>Advanced settings</option>
                            </select>
                        </div>
                    </div>

                    <div class="form-group row mt-10">
                        <label for="idDefaultUsersExpiration" data-i18n="admin.default_users_expiration" class="col-md-3 col-form-label">Default users expiration</label>
                        <div class="col-md-9">
                            <input id="idDefaultUsersExpiration" type="number" min="0" class="form-control" name="default_users_expiration" value="{{.Admin.Filters.Preferences.DefaultUsersExpiration}}" aria-describedby="idDefaultUsersExpirationHelp"/>
                            <div id="idDefaultUsersExpirationHelp" class="form-text" data-i18n="admin.default_users_expiration_help"></div>
                        </div>
                    </div>

                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idEmail" data-i18n="general.email" class="col-md-3 col-form-label">Email</label>
                <div class="col-md-9">
                    <input id="idEmail" type="email" class="form-control" placeholder="" name="email" value="{{.Admin.Email}}"
                        maxlength="255" autocomplete="off" spellcheck="false" />
                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idDescription" data-i18n="general.description" class="col-md-3 col-form-label">Description</label>
                <div class="col-md-9">
                    <input id="idDescription" type="text" class="form-control" name="description" value="{{.Admin.Description}}" maxlength="255">
                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idAllowedIP" data-i18n="general.allowed_ip_mask" class="col-md-3 col-form-label">Allowed IP/Mask</label>
                <div class="col-md-9">
                    <textarea class="form-control" id="idAllowedIP" name="allowed_ip" aria-describedby="idAllowedIPHelp"
                        rows="3">{{.Admin.GetAllowedIPAsString}}</textarea>
                    <div id="idAllowedIPHelp" class="form-text" data-i18n="general.ip_mask_help"></div>
                </div>
            </div>

            <div class="form-group row align-items-center mt-10">
                <label data-i18n="general.api_key_auth" class="col-md-3 col-form-label" for="idAllowAPIKeyAuth">API key authentication</label>
                <div class="col-md-9">
                    <div class="form-check form-switch form-check-custom form-check-solid">
                        <input class="form-check-input" type="checkbox" id="idAllowAPIKeyAuth" name="allow_api_key_auth" {{if .Admin.Filters.AllowAPIKeyAuth}}checked{{end}}/>
                        <label data-i18n="filters.api_key_auth_help" class="form-check-label fw-semibold text-gray-800" for="idAllowAPIKeyAuth">
                            Allow to impersonate yourself, in REST API, with an API key
                        </label>
                    </div>
                </div>
            </div>

            <div class="form-group row mt-10">
                <label for="idAdditionalInfo" data-i18n="general.additional_info" class="col-md-3 col-form-label">Additional info</label>
                <div class="col-md-9">
                    <textarea id="idAdditionalInfo" class="form-control" name="additional_info" rows="3">{{.Admin.AdditionalInfo}}</textarea>
                </div>
            </div>

            <div class="d-flex justify-content-end mt-12">
                <input type="hidden" name="_form_token" value="{{.CSRFToken}}">
                <button type="submit" id="form_submit" class="btn btn-primary px-10" name="form_action" value="submit">
                    <span data-i18n="general.submit" class="indicator-label">
                        Submit
                    </span>
                    <span data-i18n="general.wait" class="indicator-progress">
                        Please wait...
                        <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
                    </span>
                </button>
            </div>
        </form>
    </div>
</div>
{{- end}}

{{- define "extra_js"}}
<script {{- if .CSPNonce}} nonce="{{.CSPNonce}}"{{- end}} src="{{.StaticURL}}/assets/plugins/custom/formrepeater/formrepeater.bundle.js"></script>
<script type="text/javascript" {{- if .CSPNonce}} nonce="{{.CSPNonce}}"{{- end}}>

    $(document).on("i18nload", function(){
        initRepeater('#groups');
        initRepeaterItems();
    });

    $(document).on("i18nshow", function(){
        $('#admin_form').submit(function (event) {
			let submitButton = document.querySelector('#form_submit');
			submitButton.setAttribute('data-kt-indicator', 'on');
			submitButton.disabled = true;
        });
    });
</script>
{{- end}}