芝麻web文件管理V1.00

编辑当前文件:/home/mgatv524/public_html/mctv/views/user-page.twig

{#
/**
 * Copyright (C) 2021 Xibo Signage Ltd
 *
 * Xibo - Digital Signage - http://www.xibo.org.uk
 *
 * This file is part of Xibo.
 *
 * Xibo is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * any later version.
 *
 * Xibo is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with Xibo.  If not, see <http://www.gnu.org/licenses/>.
 */
#}
{% extends "authed.twig" %}
{% import "inline.twig" as inline %}

{% block title %}{{ "Users"|trans }} | {% endblock %}

{% block actionMenu %}
    <div class="widget-action-menu pull-right">
        {% if currentUser.isSuperAdmin() or (currentUser.isGroupAdmin() and currentUser.featureEnabled("users.add")) %}
            {% if currentUser.getOptionValue("isAlwaysUseManualAddUserForm", 0) %}
                {% set addUserFormUrl = url_for("user.add.form") %}
            {% else %}
                {% set addUserFormUrl = url_for("user.onboarding.form") %}
            {% endif %}
            <button id="user-add-button" class="btn btn-success XiboFormButton" title="{% trans "Add a new User" %}" href="{{ addUserFormUrl }}"><i class="fa fa-user-plus" aria-hidden="true"></i> {% trans "Add User" %}</button>
        {% endif %}
        <button class="btn btn-info XiboFormButton" title="{% trans "View my authenticated applications" %}" href="{{ url_for("user.applications") }}"><i class="fa fa-check-circle" aria-hidden="true"></i> {% trans "My Applications" %}</button>
        <button class="btn btn-primary refresh-grid" title="{% trans "Refresh the Table" %}" href="#"><i class="fa fa-refresh" aria-hidden="true"></i> {% trans "Refresh" %}</button>
    </div>
{% endblock %}

{% block pageContent %}
    <div class="widget">
        <div class="widget-title">{% trans "Users" %}</div>
        <div class="widget-body">
            <div class="XiboGrid" id="{{ random() }}" data-grid-name="usersView">
                <div class="XiboFilter card mb-3 bg-light">
                    <div class="FilterDiv card-body" id="Filter">
                        <form class="form-inline">

<div class="form-group mr-1 mb-1">
                                <label class="control-label mr-1" title="" for="userName" accesskey="">{% trans "Name" %}</label>
                                <div>
                                    <div class="input-group">
                                        <input class="form-control" name="userName" type="text" id="userName" value="">
                                        <div class="input-group-append input-group-addon">
                                            <div class="input-group-text">
                                                <input title="{% trans "Use Regex?" %}" type="checkbox" id="useRegexForName" name="useRegexForName">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

{% set title %}{% trans "User Type" %}{% endset %}
                            {{ inline.dropdown("userTypeId", "single", title, "", [{userTypeId:null, userType:""}]|merge(userTypes), "userTypeId", "userType") }}

{% set title %}{% trans "Retired" %}{% endset %}
                            {% set values = [{id: 1, value: "Yes"}, {id: 0, value: "No"}] %}
                            {{ inline.dropdown("retired", "single", title, 0, values, "id", "value") }}
                        </form>
                    </div>
                </div>
                <div class="XiboData card pt-3">
                    <table id="users" class="table table-striped" data-state-preference-name="userGrid">
                        <thead>
                            <tr>
                                <th>{% trans "Name" %}</th>
                                <th>{% trans "Homepage" %}</th>
                                <th>{% trans "Email" %}</th>
                                <th>{% trans "Library Quota" %}</th>
                                <th>{% trans "Last Login" %}</th>
                                <th>{% trans "Logged In?" %}</th>
                                <th>{% trans "Retired?" %}</th>
                                <th>{% trans "Two Factor" %}</th>
                                <th>{% trans "First Name" %}</th>
                                <th>{% trans "Last Name" %}</th>
                                <th>{% trans "Phone" %}</th>
                                <th>{% trans "Ref 1" %}</th>
                                <th>{% trans "Ref 2" %}</th>
                                <th>{% trans "Ref 3" %}</th>
                                <th>{% trans "Ref 4" %}</th>
                                <th>{% trans "Ref 5" %}</th>
                                <th class="rowMenu">{% trans "Row Menu" %}</th>
                            </tr>
                        </thead>
                        <tbody>

</tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block javaScript %}
    <script type="text/javascript">

$(document).ready(function() {
            var table = $("#users").DataTable({
                "language": dataTablesLanguage,
                dom: dataTablesTemplate,
                serverSide: true,
                stateSave: true,
                responsive: true,
                stateDuration: 0,
                stateLoadCallback: dataTableStateLoadCallback,
                stateSaveCallback: dataTableStateSaveCallback,
                searchDelay: 3000,
                "order": [[0, "asc"]],
                "filter": false,
                ajax: {
                    url: "{{ url_for("user.search") }}",
                    "data": function (d) {
                        $.extend(d, $("#users").closest(".XiboGrid").find(".FilterDiv form").serializeObject());
                    }
                },
                "columns": [
                    {"data": "userName", responsivePriority: 2},
                    {
                        "data": "homePage",
                        "sortable": false,
                        responsivePriority: 3
                    },
                    {"data": "email", responsivePriority: 3},
                    {
                        "name": "libraryQuota",
                         responsivePriority: 3,
                        "data": null,
                        "render": {"_": "libraryQuota", "display": "libraryQuotaFormatted", "sort": "libraryQuota"}
                    },
                    {"data": "lastAccessed", "visible": false, responsivePriority: 4},
                    {
                        "data": "loggedIn",
                        responsivePriority: 3,
                        "render": dataTableTickCrossColumn,
                        "visible": false,
                        "sortable": false
                    },
                    {
                        "data": "retired",
                         responsivePriority: 3,
                        "render": dataTableTickCrossColumn
                    },
                    {
                        "data": "twoFactorTypeId",
                         responsivePriority: 5,
                        "visible": false,
                        "render": function (data, type, row) {
                            if (type != "display")
                                return data;

var icon = "";
                            if (data == 1)
                                icon = "fa-envelope";
                            else if (data == 2)
                                icon = "fa-google";
                            else
                                icon = "fa-times";

return '<span class="fa ' + icon + '" title="' + (row.twoFactorDescription) + '"></span>';
                        }
                    },
                    {"data": "firstName", "visible": false, responsivePriority: 5},
                    {"data": "lastName", "visible": false, responsivePriority: 5},
                    {"data": "phone", "visible": false, responsivePriority: 5},
                    {"data": "ref1", "visible": false, responsivePriority: 5},
                    {"data": "ref2", "visible": false, responsivePriority: 5},
                    {"data": "ref3", "visible": false, responsivePriority: 5},
                    {"data": "ref4", "visible": false, responsivePriority: 5},
                    {"data": "ref5", "visible": false, responsivePriority: 5},
                    {
                        "orderable": false,
                        responsivePriority: 1,
                        "data": dataTableButtonsColumn
                    }
                ]
            });

table.on('draw', dataTableDraw);
            table.on('processing.dt', dataTableProcessing)
            dataTableAddButtons(table, $('#users_wrapper').find('.dataTables_buttons'));

$(".refresh-grid").click(function() {
                table.ajax.reload();
            });
        });

return $("<span>" + state.content + "</span>");
                }
            });

// Bind to the add form submit
            $(".UserForm").validate({
                submitHandler: function (form) {
                    // Grab and alter the value in the library quota field
                    var libraryQuotaField = $(form).find("input[name=libraryQuota]");
                    var libraryQuotaUnitsField = $(form).find("select[name=libraryQuotaUnits]");
                    var libraryQuota = libraryQuotaField.val();

if (libraryQuotaUnitsField.val() === 'mb') {
                        libraryQuota = libraryQuota * 1024;
                    } else if (libraryQuotaUnitsField.val() === 'gb') {
                        libraryQuota = libraryQuota * 1024 * 1024;
                    }

// Set the field
                    libraryQuotaField.prop('value', libraryQuota);

XiboFormSubmit(form);
                },
                errorElement: "span",
                highlight: function(element) {
                    $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
                },
                success: function(element) {
                    $(element).closest('.form-group').removeClass('has-error').addClass('has-success');
                },
                invalidHandler: function(event, validator) {
                    // Remove the spinner
                    $(this).closest(".modal-dialog").find(".saving").remove();
                    // https://github.com/xibosignage/xibo/issues/1589
                    $(this).closest(".modal-dialog").find(".save-button").removeClass("disabled");
                }
            });
        }

/**
         * Callback when the onboarding form is opened.
         */
        function onboardingFormOpen(dialog) {
            $(dialog).find('[data-toggle="popover"]').popover();

// Init the folder panel
            {% if currentUser.featureEnabled("folder.view") %}
            initFolderPanel(dialog);
            {% endif %}

var navListItems = $(dialog).find('div.setup-panel div a'),
                allWells = $(dialog).find('.setup-content'),
                stepWizard = $(dialog).find('.stepwizard');

navListItems.click(function (e) {
                e.preventDefault();
                var $target = $($(this).attr('href')),
                    $item = $(this);

if (!$item.attr('disabled')) {
                    // Set all step links to inactive
                    navListItems
                        .removeClass('btn-success')
                        .addClass('btn-default');

// Activate this specific one
                    $item.addClass('btn-success');

// Hide all the panels and show this specific one
                    allWells.hide();
                    $target.show();
                    $target.find('input:eq(0)').focus();

// Set the active panel on the links
                    stepWizard.data("active", $target.prop("id"))

// Is the next action to finish?
                    if ($target.data("next") === "finished") {
                        $(dialog).find("#onboarding-steper-next-button").html("{{ "Save"|trans }}");
                    } else {
                        $(dialog).find("#onboarding-steper-next-button").html("{{ "Next"|trans }}")
                    }
                }
            });

// Add some buttons.
            $(dialog).find(".modal-footer")
                .append($('<a class="btn btn-default">').html("{{ "Close"|trans }}")
                    .click(function(e) {
                        e.preventDefault();
                        XiboDialogClose();
                    }))
                .append($('<a id="onboarding-steper-next-button" class="btn">').html("{{ "Next"|trans }}")
                    .addClass("btn-primary")
                    .click(function(e) {
                        e.preventDefault();
                        var steps = $(dialog).find(".stepwizard"),
                            curStep = $(dialog).find("#" + steps.data("active")),
                            curInputs = curStep.find("input[type='text'],input[type='url']"),
                            isValid = true;

// What is the next step?
                        if (curStep.data("next") === "finished") {
                            // Keep the form open
                            var $form = $(dialog).find("#userOnboardingForm");
                            $form.data("apply", true);
                            // Submit the form thereby creating the user
                            XiboFormSubmit($form, e, function(xhr) {
                                // Callback
                                if (xhr.success && xhr.id) {
                                    {% if currentUser.featureEnabled("folder.view") %}
                                    // Submit the folder ownerships
                                    var selected = $(dialog).find("#container-folder-tree").jstree("get_selected");
                                    var groupIds = {};
                                    groupIds[xhr.data.groupId] = {
                                        "view": 1,
                                        "edit": 1
                                    };
                                    $.ajax(permissionsUrl.replace(":entity", "Folder"), {
                                        "method": "POST",
                                        "data": {
                                            "ids": selected.join(","),
                                            "groupIds": groupIds
                                        },
                                        "error": function() {
                                            toastr.error("{{ "Problem saving folder sharing, please check the User created." }}");
                                        }
                                    });
                                    {% endif %}

XiboDialogClose();
                                }
                            });
                        } else if (curStep.data("next") === "onboarding-step-2" && $("input[name='groupId']:checked").val() === "manual") {
                            // Load the user add form.
                            XiboDialogClose();
                            XiboFormRender("{{ url_for("user.add.form") }}");
                        } else {
                            var nextStepWizard = steps.find("a[href='#" + curStep.data("next") + "']");

$(dialog).find(".form-group").removeClass("has-error");
                            for (var i = 0; i < curInputs.length; i++) {
                                if (!curInputs[i].validity.valid) {
                                    isValid = false;
                                    $(curInputs[i]).closest(".form-group").addClass("has-error");
                                }
                            }

// Set the defaults.
                            if (curStep.data("next") === "onboarding-step-2") {
                                var $userGroupSelected = $("input[name='groupId']:checked");
                                $(dialog).find("input[name=homePageId]").val($userGroupSelected.data("defaultHomepageId"));
                            }

if (isValid) {
                                nextStepWizard.removeAttr('disabled').trigger('click');
                            }
                        }
                    }));
        }

function initFolderPanel(dialog) {
            var $container = $(dialog).find("#container-folder-tree");

$container.jstree({
                "plugins": ["checkbox", "sort"],
                "themes" : {
                    "responsive" : true
                },
                "core": {
                    "data": {
                        "url": foldersUrl
                    }
                },
                "checkbox" : {
                    "three_state" : false
                },
            }).on("ready.jstree", function(e, data) {
                $(this).jstree().disable_checkbox(1);
                $(this).jstree().disable_node(1);
                $(this).jstree("open_all");
            });
        }
    </script>
    <style type="text/css">
        /* Onboarding Step Wizard */
        .stepwizard-step p {
            margin-top: 0px;
            color:#666;
        }
        .stepwizard-row {
            display: table-row;
        }
        .stepwizard {
            display: table;
            width: 100%;
            position: relative;
        }
        .stepwizard-step button[disabled] {
            /*opacity: 1 !important;
            filter: alpha(opacity=100) !important;*/
        }
        .stepwizard .btn.disabled, .stepwizard .btn[disabled], .stepwizard fieldset[disabled] .btn {
            opacity:1 !important;
            color:#bbb;
            background: white;
            border: 1px solid #bbbbbb;
        }
        .stepwizard-row:before {
            top: 14px;
            bottom: 0;
            position: absolute;
            content:" ";
            width: 100%;
            height: 1px;
            background-color: #ccc;
            z-index: 0;
        }
        .stepwizard .stepwizard-step {
            display: table-cell;
            text-align: center;
            position: relative;
        }
        .stepwizard .btn-circle {
            width: 30px;
            height: 30px;
            text-align: center;
            padding: 6px 0;
            font-size: 12px;
            line-height: 1.428571429;
            border-radius: 15px;
        }
        .stepwizard .btn-default {
            background: #bbbbbb;
            border: 1px solid grey;
        }
        .stepwizard .btn-success {
            background: #28a745;
            border: 1px solid #28a745;
        }
        .onboarding-form .checkbox+.checkbox, .onboarding-form .radio+.radio {
            margin-top: 8px;
        }
        .onboarding-form .has-error {
            color: red;
        }
        .jstree-checkbox-disabled {
            display: none !important;
        }
    </style>
{% endblock %}