483 lines
18 KiB
Vue
483 lines
18 KiB
Vue
<template>
|
|
<div>
|
|
<TableSearch :query="query" :options="searchOpt" :search="handleSearch" :refresh="GetPermissPolicy" />
|
|
<div class="container">
|
|
<div
|
|
v-loading="loading"
|
|
loading-text="加载中..."
|
|
style="min-height: 300px;"
|
|
>
|
|
<TableCustom :columns="columns" :tableData="tableData" :total="page.total" :viewFunc="handleView"
|
|
:delFunc="handleDelete" :changePage="changePage" :currentPage="page.index" :editFunc="handleEdit" :refresh="GetPermissPolicy">
|
|
<template #toolbarBtn>
|
|
<el-button type="warning" :icon="CirclePlusFilled" @click="visible_add = true">新增</el-button>
|
|
<el-button type="primary" :icon="Search" @click="get_user_permission_policy_visible = true">权限策略检测</el-button>
|
|
</template>
|
|
</TableCustom>
|
|
</div>
|
|
|
|
</div>
|
|
<el-dialog :title="isEdit ? '编辑': '编辑'" v-model="visible" width="900px" destroy-on-close
|
|
:close-on-click-modal="false" @close="closeDialog">
|
|
<TableEdit :form-data="rowData" :options="options_edit" :edit="isEdit" :update="handleUpdatePermissPolicy" />
|
|
</el-dialog>
|
|
<el-dialog :title="isAdd ? '新增' : '新增'" v-model="visible_add" width="900px" destroy-on-close
|
|
:close-on-click-modal="false" @close="closeDialog">
|
|
<TableEdit :form-data="rowData" :options="options" :edit="isAdd" :update="handleAddPermissPolicy" />
|
|
</el-dialog>
|
|
<el-dialog title="查看详情" v-model="visible1" width="700px" destroy-on-close>
|
|
<TableDetail :data="viewData"></TableDetail>
|
|
</el-dialog>
|
|
</div>
|
|
<div>
|
|
<el-dialog title="策略匹配检测" v-model="get_user_permission_policy_visible" width="700px" destroy-on-close>
|
|
<el-input v-model="permiss_policy_check_req" placeholder="请输入用户ID或用户名" style="width: 50%;"></el-input>
|
|
<el-button type="warning" :icon="Search" @click="GetOnePermissPolicy">权限策略检测</el-button>
|
|
<div>
|
|
<!-- 显示检测结果 -->
|
|
<div v-if="permiss_policy_check_res.ID">
|
|
<p>匹配到的权限策略：{{ permiss_policy_check_res.name }}</p>
|
|
<p>描述信息：{{ permiss_policy_check_res.info }}</p>
|
|
</div>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts" name="manage-permiss-policy">
|
|
//获取query参数
|
|
import { onMounted,ref, reactive } from 'vue';
|
|
import { CirclePlusFilled,Search } from '@element-plus/icons-vue';
|
|
import {PermissPolicyResponseData, PolicyUserRange} from '@/types/permiss_policy';
|
|
import {getAllDefaultUsers} from '@/api/user';
|
|
import {GetPermissPolicyService, DelPermissPolicyService, UpdatePermissPolicyService, AddPermissPolicyService} from '@/api/permiss_policy';
|
|
import { ElMessage } from 'element-plus';
|
|
import { FormOption } from '@/types/form-option';
|
|
|
|
const tableData = ref<PolicyUserRange[]>([]);
|
|
const allData = ref<PolicyUserRange[]>([]);
|
|
const visible = ref(false);
|
|
const visible_add = ref(false);
|
|
const isEdit = ref(false);
|
|
const isAdd = ref(false);
|
|
const rowData = ref<PolicyUserRange>({} as PolicyUserRange);
|
|
const user_select_opts = ref([]);
|
|
const get_user_permission_policy_visible = ref(false);
|
|
const permiss_policy_check_req = ref("");
|
|
const permiss_policy_check_res = ref<PolicyUserRange>({} as PolicyUserRange);
|
|
const loading = ref(false);
|
|
// 查询相关
|
|
const query = reactive({
|
|
name: '',
|
|
});
|
|
const page = reactive({
|
|
index: 1,
|
|
size: 10,
|
|
total: 122,
|
|
});
|
|
const searchOpt = {};
|
|
const viewData = ref({
|
|
row: {},
|
|
list: [
|
|
|
|
]
|
|
});
|
|
// 查看详情弹窗相关
|
|
const visible1 = ref(false);
|
|
|
|
onMounted(async () => {
|
|
// 获取query参数
|
|
GetPermissPolicy();
|
|
|
|
});
|
|
const closeDialog = () => {
|
|
visible.value = false;
|
|
visible_add.value = false;
|
|
isEdit.value = false;
|
|
};
|
|
|
|
|
|
const handleAddPermissPolicy = async (data) => {
|
|
if (data.upload_size && isNaN(Number(data.upload_size))) {
|
|
ElMessage.error('单个上传大小必须是数字');
|
|
return;
|
|
}
|
|
if (data.upload_max_size && isNaN(Number(data.upload_max_size))) {
|
|
ElMessage.error('总上传大小必须是数字');
|
|
return;
|
|
}
|
|
// 添加权限策略
|
|
let req = {
|
|
"policy_name": data.name,
|
|
"policy_info": data.info,
|
|
"user_range": [],
|
|
"redis": data.redis > 0 ? 1 : -1,
|
|
"run_shell": data.run_shell > 0 ? 1 : -1,
|
|
"upload": data.upload > 0 ? 1 : -1,
|
|
"cid": data.cid > 0? 1 : -1,
|
|
"file": data.file > 0? 1 : -1,
|
|
"device": data.device > 0 ? 1 : -1,
|
|
"upload_size": data.upload_size > 0 ? parseInt(data.upload_size) : 0,
|
|
"upload_max_size": data.upload_max_size > 0 ? parseInt(data.upload_max_size) : 0,
|
|
"send_mail": data.send_mail > 0 ? 1 : -1,
|
|
};
|
|
for(let i=0;i<data.range.length;i++){
|
|
req.user_range.push({"id":data.range[i]});
|
|
}
|
|
try {
|
|
const response = await AddPermissPolicyService(req);
|
|
if (response['code'] !== 0) {
|
|
ElMessage.error('添加权限策略失败:' + response["message"]);
|
|
return;
|
|
}
|
|
ElMessage.success('添加权限策略成功');
|
|
visible_add.value = false;
|
|
GetPermissPolicy();
|
|
} catch (error) {
|
|
console.error('获取权限策略失败:', error);
|
|
}
|
|
|
|
};
|
|
|
|
const GetAllDefaultUsers = async () => {
|
|
try {
|
|
const response = await getAllDefaultUsers();
|
|
if (response['code'] !== 0) {
|
|
console.error('获取默认用户失败:', response["message"]);
|
|
return;
|
|
}
|
|
user_select_opts.value.length = 0;
|
|
for (let i = 0; i < response.data.length; i++) {
|
|
let user = response.data[i];
|
|
user_select_opts.value.push({
|
|
value: user.id,
|
|
label: (user.type === 0 ? "user":"group" )+ ":"+user.name
|
|
});
|
|
}
|
|
//console.log("user_select_opts:", user_select_opts.value);
|
|
} catch (error) {
|
|
console.error('获取默认用户失败:', error);
|
|
}
|
|
};
|
|
|
|
GetAllDefaultUsers();
|
|
|
|
const handleUpdatePermissPolicy = async (data) => {
|
|
// 更新权限策略
|
|
let req = {
|
|
"id": data.ID,
|
|
"policy_name": data.name,
|
|
"policy_info": data.info,
|
|
"user_range": [],
|
|
"redis": data.redis > 0 ? 1 : -1,
|
|
"run_shell": data.run_shell > 0 ? 1 : -1,
|
|
"upload": data.upload > 0 ? 1 : -1,
|
|
"cid": data.cid > 0? 1 : -1,
|
|
"file": data.file > 0? 1 : -1,
|
|
"device": data.device > 0 ? 1 : -1,
|
|
"upload_size": 0,
|
|
"upload_max_size": 0,
|
|
"send_mail": data.send_mail > 0 ? 1 : -1,
|
|
};
|
|
//upload_size和upload_max_size必须是数字
|
|
if (data.upload_size > 0) {
|
|
req.upload_size = parseInt(data.upload_size);
|
|
}
|
|
if (data.upload_max_size > 0) {
|
|
req.upload_max_size = parseInt(data.upload_max_size);
|
|
}
|
|
for(let i=0;i<data.range.length;i++){
|
|
req.user_range.push({"id":data.range[i]});
|
|
}
|
|
try {
|
|
const response = await UpdatePermissPolicyService(req);
|
|
if (response['code'] !== 0) {
|
|
ElMessage.error('更新权限策略失败:' + response["message"]);
|
|
return;
|
|
}
|
|
ElMessage.success('更新权限策略成功');
|
|
} catch (error) {
|
|
console.error('更新权限策略失败:', error);
|
|
}
|
|
|
|
};
|
|
const handleDeletePermissPolicy = async () => {
|
|
// 删除权限策略
|
|
let req = {
|
|
"id": 1,
|
|
};
|
|
try {
|
|
const response = await DelPermissPolicyService(req);
|
|
if (response['code'] !== 0) {
|
|
ElMessage.error('删除权限策略失败:' + response["message"]);
|
|
return;
|
|
}
|
|
ElMessage.success('删除权限策略成功');
|
|
} catch (error) {
|
|
console.error('删除权限策略失败:', error);
|
|
}
|
|
};
|
|
const GetOnePermissPolicy = async () => {
|
|
try {
|
|
let req={
|
|
type: 1,
|
|
user_id: 0,
|
|
user_name: ""
|
|
}
|
|
if (isNaN(Number(permiss_policy_check_req.value))) {
|
|
req.user_name = permiss_policy_check_req.value;
|
|
} else {
|
|
req.user_id = parseInt(permiss_policy_check_req.value);
|
|
}
|
|
|
|
const response = await GetPermissPolicyService(req);
|
|
if (response['code'] !== 0) {
|
|
console.error('获取权限策略失败:', response["message"]);
|
|
return;
|
|
}
|
|
// allData.value = response.data;
|
|
let temp: PermissPolicyResponseData = response.data;
|
|
let temp_ :PolicyUserRange = {
|
|
ID: temp.policy.ID,
|
|
CreatedAt: temp.policy.CreatedAt,
|
|
UpdatedAt: temp.policy.UpdatedAt,
|
|
DeletedAt: temp.policy.DeletedAt,
|
|
name: temp.policy.name,
|
|
info: temp.policy.info,
|
|
redis: temp.policy.redis, // Redis 相关权限
|
|
run_shell: temp.policy.run_shell, // 运行 Shell 相关权限
|
|
upload: temp.policy.upload, // 上传相关权限
|
|
cid: temp.policy.cid, // 同上
|
|
file: temp.policy.file, // 同上
|
|
device: temp.policy.device, // 设备相关权限
|
|
upload_size: temp.policy.upload_size, // 同上
|
|
upload_max_size: temp.policy.upload_max_size, // 同上
|
|
send_mail: temp.policy.send_mail, // 发送邮件相关权限
|
|
range: temp.range.map(item => item.id),
|
|
};
|
|
permiss_policy_check_res.value = temp_;
|
|
|
|
} catch (error) {
|
|
console.error('获取权限策略失败:', error);
|
|
}
|
|
};
|
|
const sleep = (ms: number): Promise<void> => {
|
|
return new Promise(resolve => {
|
|
setTimeout(resolve, ms);
|
|
});
|
|
};
|
|
const GetPermissPolicy = async () => {
|
|
try {
|
|
loading.value = true;
|
|
const response = await GetPermissPolicyService({});
|
|
if (response['code'] !== 0) {
|
|
console.error('获取权限策略失败:', response["message"]);
|
|
return;
|
|
}
|
|
await sleep(100);
|
|
|
|
// allData.value = response.data;
|
|
allData.value = [];
|
|
for (let i = 0; i < response.data.length; i++) {
|
|
let temp: PermissPolicyResponseData = response.data[i];
|
|
let temp_ :PolicyUserRange = {
|
|
ID: temp.policy.ID,
|
|
CreatedAt: temp.policy.CreatedAt,
|
|
UpdatedAt: temp.policy.UpdatedAt,
|
|
DeletedAt: temp.policy.DeletedAt,
|
|
name: temp.policy.name,
|
|
info: temp.policy.info,
|
|
redis: temp.policy.redis, // Redis 相关权限
|
|
run_shell: temp.policy.run_shell, // 运行 Shell 相关权限
|
|
upload: temp.policy.upload, // 上传相关权限
|
|
cid: temp.policy.cid, // 同上
|
|
file: temp.policy.file, // 同上
|
|
device: temp.policy.device, // 设备相关权限
|
|
upload_size: temp.policy.upload_size, // 同上
|
|
upload_max_size: temp.policy.upload_max_size, // 同上
|
|
send_mail: temp.policy.send_mail, // 发送邮件相关权限
|
|
range: temp.range.map(item => item.id),
|
|
};
|
|
allData.value.push(temp_);
|
|
}
|
|
page.total = allData.value.length;
|
|
page.index = 1;
|
|
// 分页
|
|
let start = (page.index - 1) * page.size;
|
|
let end = start + page.size;
|
|
if (end > page.total) {
|
|
end = page.total;
|
|
}
|
|
if (start > page.total) {
|
|
start = page.total;
|
|
}
|
|
tableData.value = allData.value.slice(start, end);
|
|
loading.value = false;
|
|
} catch (error) {
|
|
console.error('获取权限策略失败:', error);
|
|
loading.value = false;
|
|
}
|
|
};
|
|
const handleEdit = async (row) => {
|
|
let data = row;
|
|
//console.log("edit_row_data:", data);
|
|
rowData.value = data;
|
|
isEdit.value = true;
|
|
visible.value = true;
|
|
};
|
|
|
|
const handleSearch = async () => {
|
|
await GetPermissPolicy();
|
|
page.total = allData.value.length;
|
|
page.index = 1;
|
|
// 分页
|
|
let start = (page.index - 1) * page.size;
|
|
let end = start + page.size;
|
|
if (end > page.total) {
|
|
end = page.total;
|
|
}
|
|
if (start > page.total) {
|
|
start = page.total;
|
|
}
|
|
tableData.value = allData.value.slice(start, end);
|
|
};
|
|
|
|
// 表格相关
|
|
let columns = ref([
|
|
// { type: 'index', label: '序号', width: 55, align: 'center' },
|
|
{ prop: 'ID', label: '权限策略ID' },
|
|
{prop: 'name', label: '名称'},
|
|
{ prop: 'info', label: '描述信息' },
|
|
{ prop: 'CreatedAt', label: '创建时间',type: 'date' },
|
|
{ prop: 'operator', label: '操作', width: 250 , operate: { view: true, edit: true, delete: true,push: {link: false,label:"继续该会话"},gen: {show: false,label:"下载文件"}, genv2:{type:"", label:"", show:false} }},
|
|
])
|
|
|
|
// 新增弹窗
|
|
let options = ref<FormOption>({
|
|
labelWidth: '100px',
|
|
span: 12,
|
|
list: [
|
|
{ type: 'input', label: '名称', prop: 'name', required: true },
|
|
{ type: 'input', label: '描述', prop: 'info', required: true },
|
|
{ type: 'input', label: '单个上传大小', prop: 'upload_size', required: true, is_textarea: false },
|
|
{ type: 'input', label: '总上传大小', prop: 'upload_max_size', required: true, is_textarea: false },
|
|
{ type: 'select', label: '生效范围', prop: 'range', required: true, opts:user_select_opts.value ,multiple: true},
|
|
{ type: 'switch', label: 'Redis权限', prop: 'redis', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '运行Shell权限', prop: 'run_shell', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '上传权限', prop: 'upload', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '设备权限', prop: 'device', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '发送邮件权限', prop: 'send_mail', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: 'CID权限', prop: 'cid', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '文件管理权限', prop: 'file', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
]
|
|
})
|
|
|
|
//编辑弹窗
|
|
let options_edit = ref<FormOption>({
|
|
labelWidth: '100px',
|
|
span: 12,
|
|
list: [
|
|
{ type: 'input', label: '名称', prop: 'name', required: true },
|
|
{ type: 'input', label: '描述', prop: 'info', required: true },
|
|
{ type: 'input', label: '单个上传大小', prop: 'upload_size', required: true },
|
|
{ type: 'input', label: '总上传大小', prop: 'upload_max_size', required: true },
|
|
{ type: 'select', label: '生效范围', prop: 'range', required: true, opts:user_select_opts.value ,multiple: true},
|
|
{ type: 'switch', label: 'Redis权限', prop: 'redis', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '运行Shell权限', prop: 'run_shell', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '上传权限', prop: 'upload', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '设备权限', prop: 'device', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '发送邮件权限', prop: 'send_mail', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: 'CID权限', prop: 'cid', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
{ type: 'switch', label: '文件管理权限', prop: 'file', required: false, activeText: '开启', inactiveText: '关闭' },
|
|
]
|
|
})
|
|
|
|
const handleView =async (row) => {
|
|
viewData.value.row = row;
|
|
viewData.value.list = [
|
|
{
|
|
prop: 'ID',
|
|
label: '权限策略ID',
|
|
},
|
|
{
|
|
prop: 'name',
|
|
label: '名称',
|
|
},
|
|
{
|
|
prop: 'info',
|
|
label: '描述',
|
|
},
|
|
{
|
|
prop: 'redis',
|
|
label: 'Redis权限',
|
|
},
|
|
{
|
|
prop: 'run_shell',
|
|
label: '运行Shell权限',
|
|
},
|
|
{
|
|
prop: 'upload',
|
|
label: '上传权限',
|
|
},
|
|
{
|
|
prop: 'device',
|
|
label: '设备权限',
|
|
},
|
|
{
|
|
prop: 'send_mail',
|
|
label: '发送邮件权限',
|
|
},
|
|
{
|
|
prop: 'cid',
|
|
label: 'CID权限',
|
|
},
|
|
{
|
|
prop: 'file',
|
|
label: '文件管理权限',
|
|
},
|
|
{
|
|
prop: 'CreatedAt',
|
|
label: '创建时间',
|
|
type: 'date'
|
|
},
|
|
{
|
|
prop: 'UpdatedAt',
|
|
label: '更新时间',
|
|
type: 'date'
|
|
},
|
|
]
|
|
visible1.value = true;
|
|
};
|
|
|
|
// 删除相关
|
|
const handleDelete = async (row) => {
|
|
let req={
|
|
id: row.ID,
|
|
}
|
|
try{
|
|
let result = await DelPermissPolicyService(req);
|
|
if(result['code'] === 0){
|
|
ElMessage.success("删除成功");
|
|
GetPermissPolicy();
|
|
}else{
|
|
ElMessage.error("删除失败");
|
|
}
|
|
}catch(e){
|
|
console.log(e);
|
|
}
|
|
}
|
|
|
|
const changePage = (val: number) => {
|
|
page.index = val;
|
|
//分页
|
|
let start = (page.index - 1) * page.size;
|
|
let end = start + page.size;
|
|
if (end > page.total) {
|
|
end = page.total;
|
|
}
|
|
if (start > page.total) {
|
|
start = page.total;
|
|
}
|
|
tableData.value = allData.value.slice(start, end);
|
|
};
|
|
|
|
</script> |