首页 > 其他分享 >svnhooks--给用户提交权限,实现单次提交

svnhooks--给用户提交权限,实现单次提交

时间:2024-09-02 16:46:58浏览次数:10  
标签:function svnhooks -- 用户 user 提交 hasPermission 权限 filteredUsers

上一篇文章说到,我们通过getuser的方法向服务器请求到svn配置文件有写权限的用户,下面我们需要把用户显示在前端文件中,简单列一下前端的核心显示代码,具体的css样式就不列出来了

        <div class="user-container" id="userList" {% if commitSwitch=='true' %}style="display: flex;" {% else
             %}style="display: none;" {% endif %}>
            <div class="user-list" id="noPermission">
                <div class="header-container">
                    <h4>无权限用户:</h4>
                    <input type="text" id="searchBox" class="form-control search-box" placeholder="搜索用户...">
                </div>
                <div class="user-items">
                    <!-- 用户项将动态添加到这里 -->
                </div>
                <div class="text-center">
                    <nav aria-label="分页导航">
                        <ul class="pagination" id="pagination">
                            <!-- 分页按钮将动态添加到这里 -->
                        </ul>
                    </nav>
                </div>
            </div>
            <div class="button-container">
                <button class="move-button right" id="moveToPermission"></button>
                <button class="move-button left" id="moveToNoPermission"></button>
            </div>
            <div class="user-list" id="hasPermission">
                <div class="header-container">
                    <h4>有权限用户:</h4>
                </div>
                <div class="user-items"
                     style="max-height: 250px;  flex-direction: column;overflow-y: auto; display: flex; margin: 5px 0;">
                    <!-- 初始为空,移动用户后动态添加 -->
                </div>
            </div>
        </div>

这里就是页面的分页处理,还是数据初始化,以及移动用户后向服务器请求更改状态

$(document).ready(function () {
        const usersPerPage = 10; // 每页显示的用户数量
        let currentPage = 1;
        let users = {};
        let filteredUsers = {
            hasPermission: [],
            noPermission: []
        };



        // 定义一个函数来获取用户列表
        function fetchUsers(callback) {
            $.get('/api/users2', function (data) {
                users = data; // 假设返回的是用户对象
                filteredUsers.hasPermission = [];
                filteredUsers.noPermission = [];

                // 根据权限分配用户到不同的列表
                for (const [user, hasPermission] of Object.entries(users)) {
                    if (hasPermission) {
                        filteredUsers.hasPermission.push(user);
                    } else {
                        filteredUsers.noPermission.push(user);
                    }
                }
                callback();
            });
        }

        // 初始获取用户列表
        fetchUsers(function () {
            displayUsers();
            setupPagination();
        });

        function displayUsers() {
            const start = (currentPage - 1) * usersPerPage;
            const end = start + usersPerPage;

            // 显示无权限用户
            $('#noPermission .user-items').empty();
            filteredUsers.noPermission.slice(start, end).forEach(function (user) {
                $('#noPermission .user-items').append(`<div><label><input type="checkbox" value="${user}"> ${user}</label></div>`);
            });

            // 显示有权限用户
            $('#hasPermission .user-items').empty();
            filteredUsers.hasPermission.forEach(function (user) {
                $('#hasPermission .user-items').append(`<div><label><input type="checkbox" value="${user}"> ${user}</label></div>`);
            });
        }

        function setupPagination() {
            const totalPages = Math.ceil(filteredUsers.noPermission.length / usersPerPage);
            $('#pagination').empty(); // 清空现有的分页按钮

            for (let i = 1; i <= totalPages; i++) {
                $('#pagination').append(`
                <li class="page-item ${i === currentPage ? 'active' : ''}">
                    <a class="page-link" href="#" data-page="${i}">${i}</a>
                </li>
            `);
            }

            // 添加点击事件
            $('.page-link').click(function (e) {
                e.preventDefault();
                currentPage = parseInt($(this).data('page'));
                displayUsers();
                setupPagination();
            });
        }

        $('#commitSwitch').change(function () {
            const isChecked = $('#commitSwitch').is(':checked');
            getCommitSwitchStatus(function (commitSwitch11) {
                if (commitSwitch11 === 'true') {
                    $('#userList').css('display', 'flex'); // 切换用户列表的显示状态
                } else {
                    $('#userList').toggle(false); // 切换用户列表的显示状态
                }
            });

            // 发送POST请求更新开关状态
            $.ajax({
                url: '/set_switch',
                type: 'POST',
                contentType: 'application/json', // 设置请求头为JSON
                data: JSON.stringify({commit_switch: isChecked.toString()}), // 转换为字符串
                success: function (response) {
                    console.log('成功更新:', response); // 处理成功响应
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    console.error('更新失败:', textStatus, errorThrown); // 处理错误
                }
            });
        });

        // 定义一个函数来通过 AJAX 请求获取实时的 commit_switch 状态
        function getCommitSwitchStatus(callback) {
            $.ajax({
                url: '/get_switch', // 替换为实际的 API 地址
                method: 'GET', // 使用 GET 方法请求数据
                success: function (data) {
                    const commitSwitch11 = data.commit_switch;
                    callback(commitSwitch11);
                },
                error: function () {
                    alert('Failed to fetch commit switch status.');
                }
            });
        }

        // 定义一个函数来移动用户项
        function moveUsers(fromSelector, toSelector) {
            console.log('moveUsers 被调用');
            console.log('fromSelector:', fromSelector);
            console.log('toSelector:', toSelector);
            console.log('初始有权限用户列表:', filteredUsers.hasPermission);
            console.log('初始无权限用户列表:', filteredUsers.noPermission);

            $(fromSelector + ' .user-items input:checked').each(function () {
                const user = $(this).val();
                console.log('当前处理的用户:', user);

                console.log('检查用户是否在目标区域:', user, '目标区域:', toSelector);

                // 检查用户是否已经在目标区域
                if (toSelector === '#hasPermission' && filteredUsers.hasPermission.includes(user)) {
                    console.log(user + ' 已经在有权限列表中!');
                    alert(user + ' 已经在有权限列表中!');
                    location.reload(); // 刷新页面以更新状态
                    return; // 不执行移动操作
                } else if (toSelector === '#noPermission' && filteredUsers.noPermission.includes(user)) {
                    console.log(user + ' 已经在无权限列表中!');
                    alert(user + ' 已经在无权限列表中!');
                    location.reload(); // 刷新页面以更新状态
                    return; // 不执行移动操作
                }

                const userLabel = $(this).parent().detach();
                $(toSelector + ' .user-items').append(userLabel);
                $(this).prop('checked', false);

                // 更新用户权限值
                if (toSelector === '#hasPermission') {
                    filteredUsers.hasPermission.push(user);
                    filteredUsers.noPermission = filteredUsers.noPermission.filter(u => u !== user);
                    users[user] = true; // 更新权限
                } else {
                    filteredUsers.noPermission.push(user);
                    filteredUsers.hasPermission = filteredUsers.hasPermission.filter(u => u !== user);
                    users[user] = false; // 更新权限
                }

                // 打印更新后的状态
                console.log('移动用户后有权限用户列表:', filteredUsers.hasPermission);
                console.log('移动用户后无权限用户列表:', filteredUsers.noPermission);
                console.log('用户权限更新:', user, '新权限:', users[user]);

                // 发送 AJAX 请求到服务端
                $.ajax({
                    url: '/api/updateUserPermissions',
                    method: 'POST',
                    contentType: 'application/json',
                    data: JSON.stringify({user: user, permission: users[user]}),
                    success: function (response) {
                        console.log('权限更新成功:', response);
                    },
                    error: function (error) {
                        console.error('权限更新失败:', error);
                    }
                });
            });
        }


        // 为 “Move to Permission” 按钮绑定点击事件
        $('#moveToPermission').click(function () {
            getCommitSwitchStatus(function (commitSwitch11) {
                if (commitSwitch11 === 'true') {
                    fetchUsers(function () {
                        moveUsers('#noPermission', '#hasPermission');
                    });
                } else {
                    alert('SVN锁定已经被关闭,无需再授权');
                    location.reload(); // 刷新页面以更新状态
                }
            });
        });

        // 为 “Move to No Permission” 按钮绑定点击事件
        $('#moveToNoPermission').click(function () {
            getCommitSwitchStatus(function (commitSwitch11) {
                if (commitSwitch11 === 'true') {
                    fetchUsers(function () {
                        moveUsers('#hasPermission', '#noPermission');
                    });
                } else {
                    alert('SVN锁定已经被关闭,无需再授权');
                    location.reload(); // 刷新页面以更新状态
                }
            });
        });
    });

 

服务端一开始请求到的用户时一个list,我们需要把它改成一个字典,key是用户名,value是提交权限,一开始全部默认是false,如果svnhoos打开,所有用户都无法提交

# 向 svn 仓库的配置文件获取有写权限的用户
users1 = get_users_with_write_access(hostname, username, password, authz_path)
users2 = {user: False for user in users1}

这里是定义一个GET方法,客户端需要请求用户数据显示

#提供用户列表
@app.route('/api/users2', methods=['GET'])
def get_users2():
    users_permissions = users2
    return jsonify(users_permissions)

这个方法是接收客户端做了授予权限以后,服务端数据的改变

更新用户提交权限,用户在网页的操作
@app.route('/api/updateUserPermissions', methods=['POST'])
def update_user_permissions():
    try:
        data = request.get_json()
        user = data.get('user')
        permission = data.get('permission')

        if user in users2:
            users2[user] = permission
            response = {
                'status': 'success',
                'message': f'{user} 权限已更新为 {permission}'
            }
        else:
            response = {
                'status': 'error',
                'message': f'用户 {user} 不存在'
            }
        # 通知所有连接的客户端刷新页面
        socketio.emit('refresh_page')
        return jsonify(response), 200

    except Exception as e:
        return jsonify({
            'status': 'error',
            'message': str(e)
        }), 500

在每次修改了用户权限后,我会调用socker,刷新一次页面,避免有多个用户操作页面,数据更新不及时,导致权限变更后,其他用户显示的数据是滞后的

如果用使用socket,需要在html前端加一个socker的引用

  <script src="https://cdn.socket.io/4.0.0/socket.io.min.js"></script>
    <script>
        var socket = io();

        socket.on('refresh_page', function() {
            location.reload(); // 刷新页面
        });
    </script>

大概的效果就是如下

 

标签:function,svnhooks,--,用户,user,提交,hasPermission,权限,filteredUsers
From: https://www.cnblogs.com/a565810497/p/18392997

相关文章

  • Java服务端数据库连接:连接池的优化策略
    Java服务端数据库连接:连接池的优化策略大家好,我是微赚淘客返利系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿!数据库连接池是Java服务端应用中用于管理数据库连接的一种有效机制。它通过重用现有的数据库连接来减少创建和销毁连接的开销。然而,连接池的性能和稳定性需要通过......
  • 【Java】若依(ruoyi)——2.项目启动(前后端不分离版)
    上一章节已经下载了源码。接下来,将启动ruoyi的前后端不分离版。前提已经下载了ruoyi源码系统环境符合要求(JDK>=1.8,MySQL>5.7,Maven>=3.0)已安装开发工具(源码的说明文档介绍的工具为Eclipse,我这里使用Idea)步骤1.新建MySql数据库,并执行 ry_20240601.sql(日期后缀......
  • Tushare Pro 新版发布,免费、开源的python财经数据接口包
     Tushare是一个免费、开源的python财经数据接口包。主要实现对股票等金融数据从数据采集、清洗加工 到 数据存储的过程,能够为金融分析人员提供快速、整洁、和多样的便于分析的数据,为他们在数据获取方面极大地减轻工作量,使他们更加专注于策略和模型的研究与实现上。考虑到Py......
  • Apache DolphinScheduler大规模任务调度系统对大数据实时Flink任务支持
    转载自神龙大侠我是用olphinScheduler3.2.1版本做源代码编译部署(部署方式参考我的另外一篇文档《源代码编译,ApacheDolphinScheduler前后端分离部署解决方案》)二进制文件部署本文也适用,只需要修改相对应的配置即可。资源管理底层基座替换成hdfsFlink程序jar包是在资源中心进......
  • Java服务端服务监控:Spring Boot Actuator的实践
    Java服务端服务监控:SpringBootActuator的实践大家好,我是微赚淘客返利系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿!在微服务架构中,服务监控是确保系统健康运行的关键。SpringBootActuator提供了一系列的监控和管理功能,使得开发者能够更好地监控和管理SpringBoot应用......
  • linux定时重启jar包项目
    1、创建.sh文件touchgtws.sh//创建文件vitouchgtws.sh //编辑文件#!/bin/bash#停止现有程序pkill-fdp-upload.jar#等待三秒时间sleep3#重启项目包nohupjava-jardp-upload.jar>dp-upload.log&#输出提示信息echo"定时任务重启成功"exit注意......
  • Magic Gems 矩阵乘法
    //MagicGems.cpp:此文件包含"main"函数。程序执行将在此处开始并结束。///*http://oj.daimayuan.top/course/22/problem/1046题目描述Reziba拥有无限多个魔法宝石,每个魔法宝石的大小为1单元。每个魔法宝石可以被分解为m个普通宝石,每个普通宝石的大小也是1......
  • P3193 [HNOI2008] GT考试 解题报告
    题目传送门题目大意:给定一个长度为\(m\)且只含\(0\sim9\)的字符串\(s\),求出所有长度为\(n\)的,只含\(0\sim9\)且不含\(s\)字符串的数量,结果对\(mod\)取模。数据范围:\(n\le10^9,m\le20,k\le1000\)。思路:不难发现和这道题很像,只是\(n\)的数据范围被扩大到......
  • Java服务端数据库连接:连接池的故障排查
    Java服务端数据库连接:连接池的故障排查大家好,我是微赚淘客返利系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿!在Java服务端开发中,数据库连接池是提高数据库连接复用和性能的关键组件。然而,连接池的配置不当或使用错误都可能导致各种故障。本文将探讨如何排查和解决Java服务......
  • 【系统服务工具箱】17项系统常用服务快捷启动,适合小白,仅700KB不到
    为了方便用户调用这些系统命令,写个集成的小软件。简单方便。cmd管理员控制面板注册表计算机管理设备管理任务管理环境变量磁盘管理磁盘清理服务组策略网络连接区域语言选项Internet属性设备和打印机电源选项卸载程序  https://wwnb.lanzoul.com/b02sezb......