2024-06-04 18:45:11 +08:00
|
|
|
<div class="modal" id="userPermissionModal" tabindex="-1" aria-labelledby="userPermissionModalLabel" aria-hidden="true">
|
2024-06-05 11:34:45 +08:00
|
|
|
<div class="modal-dialog modal-lg">
|
|
|
|
|
<div class="modal-content"><!-- 修改了模态框的大小 -->
|
|
|
|
|
<div class="modal-header">
|
|
|
|
|
<h5 class="modal-title" id="userPermissionModalLabel">用户权限管理</h5>
|
|
|
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-body">
|
|
|
|
|
<!-- 表格右上方的新增按钮 -->
|
|
|
|
|
<div class="d-flex justify-content-end mb-2">
|
|
|
|
|
<button type="button" class="btn btn-success btn-sm">新增权限</button>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 权限管理表格 -->
|
|
|
|
|
<table class="table">
|
|
|
|
|
<thead>
|
|
|
|
|
<tr>
|
|
|
|
|
<th>资源分组</th>
|
|
|
|
|
<th>资源名称</th>
|
|
|
|
|
<th>新增权限</th>
|
|
|
|
|
<th>移除权限</th>
|
|
|
|
|
<th>修改权限</th>
|
|
|
|
|
<th>查看权限</th>
|
|
|
|
|
<th>操作</th>
|
|
|
|
|
</tr>
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody>
|
|
|
|
|
</tbody>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="modal-footer">
|
|
|
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
|
|
|
|
|
<button type="button" class="btn btn-primary">保存更改</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<script>
|
|
|
|
|
$(document).ready(function() {
|
|
|
|
|
$('.btn-outline-primary').on('click', function() {
|
|
|
|
|
const userId = $(this).closest('tr').data('id');
|
|
|
|
|
const url = "{% url 'get_user_existing_permissions' 0 %}".replace('0', userId);
|
|
|
|
|
$.ajax({
|
|
|
|
|
url: url,
|
|
|
|
|
type: 'GET',
|
|
|
|
|
success: function(data) {
|
|
|
|
|
const modalBody = $('#userPermissionModal .modal-body tbody');
|
|
|
|
|
modalBody.empty();
|
|
|
|
|
$.each(data.grouped_permissions, function(group, perms) {
|
|
|
|
|
$.each(perms, function(index, perm) {
|
|
|
|
|
modalBody.append(`
|
|
|
|
|
<tr>
|
|
|
|
|
<td>${perm.resource_group}</td>
|
|
|
|
|
<td>${perm.resource}</td>
|
|
|
|
|
<td>${perm.permission === '新增' ? '<input type="checkbox" checked disabled>' : ''}</td>
|
|
|
|
|
<td>${perm.permission === '删除' ? '<input type="checkbox" checked disabled>' : ''}</td>
|
|
|
|
|
<td>${perm.permission === '修改' ? '<input type="checkbox" checked disabled>' : ''}</td>
|
|
|
|
|
<td>${perm.permission === '查看' ? '<input type="checkbox" checked disabled>' : ''}</td>
|
|
|
|
|
<td>移除</td>
|
|
|
|
|
</tr>
|
|
|
|
|
`);
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
$('#userPermissionModal').modal('show');
|
|
|
|
|
},
|
|
|
|
|
error: function(xhr, status, error) {
|
|
|
|
|
alert('获取权限数据失败');
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
</script>
|
