角色管理和远程连接时间格式错误修复

This commit is contained in:
zhaoyz 2024-04-25 19:06:30 +08:00
parent 15c9b35f1b
commit e349bdbecf
5 changed files with 197 additions and 152 deletions

View File

@ -1,13 +1,27 @@
import {getData} from "@/utils/request"; import request, {getData} from "@/utils/request";
const getRoleListUrl = '/admin/role/list' const getRoleListUrl = '/admin/role/page';
const roleUrl = "/admin/role";
export function getRoleList() { export function getRoleList(current: number, size: number, name?: string) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
getData(getRoleListUrl).then((res: any) => { const params: any[] = ["current=" + current, "size=" + size];
if (name) params.push("roleName=" + name);
getData(getRoleListUrl + "?" + params.join("&")).then((res: any) => {
resolve(res.data) resolve(res.data)
}).catch(error => { }).catch(error => {
reject(error) resolve(error)
}) })
}) })
} }
export function addRole(role: any) {
return new Promise((resolve, reject) => {
request.postForm(roleUrl, role).then((res: any) => {
resolve(res.data);
}).catch(err => {
resolve(err);
})
})
}

View File

@ -3,19 +3,16 @@
<el-form-item label="角色名称" prop="roleName"> <el-form-item label="角色名称" prop="roleName">
<el-input v-model="formData.roleName" placeholder="请输入角色名称"></el-input> <el-input v-model="formData.roleName" placeholder="请输入角色名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="角色标识" prop="roleMark"> <el-form-item label="角色标识" prop="roleCode">
<el-input v-model="formData.roleMark" placeholder="请输入角色标识" :disabled="type === 'edit'"></el-input> <el-input v-model="formData.roleCode" placeholder="请输入角色标识" :disabled="type === 'edit'"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="角色描述" prop="roleRemark"> <el-form-item label="角色描述" prop="roleDesc">
<el-input v-model="formData.roleRemark" type="textarea" :rows="3" placeholder="请输入角色描述"></el-input> <el-input v-model="formData.roleDesc" type="textarea" :rows="3" placeholder="请输入角色描述"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="数据权限" prop="dataPermissions"> <el-form-item label="数据权限">
<!-- <el-select v-model="formData.dataPermissions" placeholder="请选择角色">
<el-option v-for="item in dataPermissionsOption" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>-->
<div class="tree-container"> <div class="tree-container">
<el-tree ref="treeRef" :key="treeKey" :props="treeProps" :data="treeData" :default-expanded-keys="expandedKey" <el-tree ref="treeRef" :props="treeProps" :data="treeData"
:default-expanded-keys="expandedKey"
node-key="id" node-key="id"
show-checkbox @check-change="checkChange"/> show-checkbox @check-change="checkChange"/>
</div> </div>
@ -32,49 +29,51 @@
import {onMounted, reactive, ref} from 'vue' import {onMounted, reactive, ref} from 'vue'
import {ElMessage} from 'element-plus' import {ElMessage} from 'element-plus'
import {getMenuData} from '@/static-data/menu' import {getMenuData} from '@/static-data/menu'
import * as roleApi from "@/api/role";
import * as menuApi from "@/api/menu";
const emit = defineEmits(['close']) const emit = defineEmits(['close'])
const props = defineProps({ const props = defineProps({
type: String type: String
}) })
const dataPermissionsOption = [ defineExpose({
{label: '全部', value: '全部'}, resetData,
] })
const rules = reactive({ const rules = reactive({
roleName: [ roleName: [
{required: true, message: '请输入角色名称', trigger: ['blur', 'change']}, {required: true, message: '请输入角色名称', trigger: ['blur', 'change']},
], ],
roleMark: [ roleCode: [
{required: true, message: '请输入角色标识', trigger: ['blur', 'change']}, {required: true, message: '请输入角色标识', trigger: ['blur', 'change']},
],
dataPermissions: [
{required: true, message: '请选择数据权限', trigger: ['blur', 'change']},
] ]
}) })
const formRef = ref() const formRef = ref()
const formData = ref({ const formData = ref({
id: '', roleId: '',
roleName: '', roleName: '',
roleMark: '', roleCode: '',
roleRemark: '', roleDesc: '',
dataPermissions: '', menuIds: []
} as any) } as any)
const treeRef = ref();
const treeProps = { const treeProps = {
label: 'menuName', label: 'name',
children: 'children' children: 'children'
} }
const expandedKey = ref<string[]>([])
const treeData = ref() const treeData = ref()
onMounted(() => { onMounted(() => {
resetData() resetData()
treeData.value = getMenuData() treeData.value = getMenuData()
getMenuTree();
}) })
defineExpose({ const getMenuTree = () => {
formData, menuApi.getMenuTree().then((res: any) => {
resetData, treeData.value = res.data;
}) })
}
function close() { function close() {
emit('close') emit('close')
@ -83,10 +82,10 @@ function close() {
function resetData() { function resetData() {
formRef.value.resetFields() formRef.value.resetFields()
formData.value = { formData.value = {
id: '', roleId: '',
roleName: '', roleName: '',
roleMark: '', roleCode: '',
roleRemark: '', roleDesc: '',
dataPermissions: '', dataPermissions: '',
} }
} }
@ -94,13 +93,24 @@ function resetData() {
const saveData = async () => { const saveData = async () => {
await formRef.value.validate((valid: any, fields: any) => { await formRef.value.validate((valid: any, fields: any) => {
if (valid) { if (valid) {
ElMessage.success('保存成功!') const form = Object.assign({}, formData.value);
close() form.menuIds = form.menuIds.join(",");
} else { roleApi.addRole(form).then((res: any) => {
// console.log('error submit!', fields) if (res.code == 0) {
ElMessage.success('保存成功!');
close();
} else {
ElMessage.error(res.msg ? res.msg : "保存失败");
}
});
} }
}) })
} }
const checkChange = () => {
formData.value.menuIds = treeRef.value.getCheckedKeys();
}
</script> </script>
<style lang='scss' scoped> <style lang='scss' scoped>

View File

@ -59,6 +59,7 @@ const isFormDialog = ref(false)
const formDialogTitle = ref('') const formDialogTitle = ref('')
const queryParams = ref('') const queryParams = ref('')
const tableData = ref([] as any) const tableData = ref([] as any)
const tableMap: any = {};
onMounted(() => { onMounted(() => {
initData(); initData();
@ -84,32 +85,31 @@ function resetSearch() {
function getMenuTree(name?: string) { function getMenuTree(name?: string) {
menuApi.getMenuTree(name).then((res: any) => { menuApi.getMenuTree(name).then((res: any) => {
tableData.value = res.data; tableData.value = res.data;
updateMenuTree(res.data, tableData.value); initTableMap(tableData.value);
}) })
} }
function updateMenuTree(source: any[], target: any[]) { function initTableMap(data: any) {
target.forEach((row: any) => { data.forEach((row: any, i: number) => {
handleInitTree(row, i, []);
}); });
} }
const queryData = (e: any) => { function handleInitTree(row: any, i: number, pArr: any) {
loading.value = true //
tableData.value = [] const cArr: any = [].concat(pArr);
setTimeout(() => { cArr.push(i);
while (tableData.value.length < 10) {
tableData.value.push({ tableMap[row.id] = cArr;
id: tableData.value.length, row.indexArr = cArr;
menuName: e.menuName, if (row.children) {
order: tableData.value.length + 1, row.children.forEach((row: any, i: number) => {
icon: 'icon-shouye-zhihui', handleInitTree(row, i, cArr);
route: '/permissions-manage', })
type: '菜单', }
})
}
loading.value = false
}, 200);
} }
const addData = (menu?: any) => { const addData = (menu?: any) => {
isFormDialog.value = true isFormDialog.value = true
formDialogTitle.value = '添加' formDialogTitle.value = '添加'
@ -141,6 +141,7 @@ const removeData = (e?: any) => {
ElMessage.error(res.msg ? res.msg : "删除失败"); ElMessage.error(res.msg ? res.msg : "删除失败");
} }
}) })
}).catch(() => {
}) })
} }
const editData = (e: any) => { const editData = (e: any) => {

View File

@ -1,63 +1,65 @@
<template> <template>
<div class="table-page"> <div class="table-page">
<div class="search-part" v-show="isSearch"> <div class="search-part" v-show="isSearch">
<div class="search-cell"> <div class="search-cell">
<span class="label">角色名称</span> <span class="label">角色名称</span>
<el-input v-model="queryParams" placeholder="请输入角色名称"></el-input> <el-input v-model="queryParams" placeholder="请输入角色名称"></el-input>
</div> </div>
<el-button type="primary" icon="Search" @click="queryData(queryParams)">查询</el-button> <el-button type="primary" icon="Search" @click="search">查询</el-button>
<el-button icon="Refresh" @click="queryParams = {}">重置</el-button> <el-button icon="Refresh" @click="resetSearch">重置</el-button>
</div> </div>
<div class="button-part" style="justify-content: space-between;"> <div class="button-part" style="justify-content: space-between;">
<div> <div>
<el-button type="primary" icon="FirstAidKit" @click="addData">新增</el-button> <el-button type="primary" icon="FirstAidKit" @click="addData">新增</el-button>
<el-button icon="FirstAidKit" @click="importData">导入</el-button> <el-button icon="FirstAidKit" @click="importData">导入</el-button>
<el-button icon="Delete" @click="removeData()">删除</el-button> <el-button icon="Delete" @click="removeData()">删除</el-button>
</div> </div>
<TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="queryData({})" @downloadBtn="exportData('角色数据', tableData)"></TableAbility> <TableAbility @searchBtn="isSearch = !isSearch" @refreshBtn="init"
</div> @downloadBtn="exportData('角色数据', tableData)"></TableAbility>
<div class="table-part"> </div>
<el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip <div class="table-part">
@row-click="tableRowClick"> <el-table ref="tableRef" v-loading="loading" :data="tableData" height="100%" border show-overflow-tooltip
<el-table-column type="selection" width="55" /> @row-click="tableRowClick">
<el-table-column type="index" label="#" width="55" align="center" /> <el-table-column type="selection" width="55"/>
<el-table-column property="roleName" label="角色名称" width="120" align="center" /> <el-table-column type="index" label="#" width="55" align="center"/>
<el-table-column property="roleMark" label="角色标识" width="180" align="center" /> <el-table-column property="roleName" label="角色名称" width="120" align="center"/>
<el-table-column property="roleRemark" label="角色描述" width="120" align="center" /> <el-table-column property="roleCode" label="角色标识" width="180" align="center"/>
<el-table-column property="dataPermissions" label="数据权限" width="120" align="center" /> <el-table-column property="roleDesc" label="角色描述" width="120" align="center"/>
<el-table-column label="创建时间" width="220" align="center"> <el-table-column property="dataPermissions" label="数据权限" width="120" align="center"/>
<template #default="scope">{{ scope.row.createdTime }}</template> <el-table-column label="创建时间" width="220" align="center">
</el-table-column> <template #default="scope">{{ scope.row.createTime }}</template>
<el-table-column label="操作" align="center"> </el-table-column>
<template #default="scope"> <el-table-column label="操作" align="center">
<span @click.stop> <template #default="scope">
<el-button link icon="RefreshLeft" @click="empower(scope.row)">授权</el-button> <div @click.stop>
<el-button link icon="EditPen" @click="editData(scope.row)">修改</el-button> <el-button link icon="RefreshLeft" @click="empower(scope.row)">授权</el-button>
<el-button link icon="Delete" @click="removeData(scope.row)">删除</el-button> <el-button link icon="EditPen" @click="editData(scope.row)">修改</el-button>
</span> <el-button link icon="Delete" @click="removeData(scope.row)">删除</el-button>
</template> </div>
</el-table-column> </template>
</el-table> </el-table-column>
</div> </el-table>
<div class="pagination-part"> </div>
<CommonPagination :total="100" @paginationChange="paginationChange" /> <div class="pagination-part">
</div> <CommonPagination :total="total" @paginationChange="paginationChange"/>
</div> </div>
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%"> </div>
<RoleForm ref="RoleFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" /> <el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%">
</el-dialog> <RoleForm ref="RoleFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false"/>
<ImportDialog ref="importDialogRef" title="角色导入" templateUrl="#" importUrl="#" /> </el-dialog>
<EmpowerDialog ref="empowerDialogRef" /> <ImportDialog ref="importDialogRef" title="角色导入" templateUrl="#" importUrl="#"/>
<EmpowerDialog ref="empowerDialogRef"/>
</template> </template>
<script lang='ts' setup> <script lang='ts' setup>
import {ref} from 'vue' import {onMounted, ref} from 'vue'
import {dateFormater} from '@/utils/date-util' import {dateFormater} from '@/utils/date-util'
import {exportData, tableRemoveRow} from '@/utils/table-util' import {exportData, tableRemoveRow} from '@/utils/table-util'
import CommonPagination from '@/components/common-pagination.vue' import CommonPagination from '@/components/common-pagination.vue'
import RoleForm from './form/role-form.vue' import RoleForm from './form/role-form.vue'
import ImportDialog from '@/components/import-dialog.vue' import ImportDialog from '@/components/import-dialog.vue'
import EmpowerDialog from './form/empower-dialog.vue' import EmpowerDialog from './form/empower-dialog.vue'
import * as roleApi from "@/api/role";
const tableRef = ref() const tableRef = ref()
const RoleFormRef = ref() const RoleFormRef = ref()
@ -69,64 +71,82 @@ const isFormDialog = ref(false)
const formDialogTitle = ref('') const formDialogTitle = ref('')
const queryParams = ref("") const queryParams = ref("")
const tableData = ref([] as any) const tableData = ref([] as any)
let current = 0;
let size = 10;
const total = ref(0);
queryData({ roleName: '测试' }) onMounted(() => {
init();
})
function queryData(e: any) { function init() {
loading.value = true loading.value = true
tableData.value = [] total.value = 0;
setTimeout(() => { current = 0;
while (tableData.value.length < 10) { tableData.value = [];
tableData.value.push({ getRoleList();
roleName: e.roleName || '测试', loading.value = false
roleMark: 'ROLE_ADMIN',
roleRemark: '超级管理员',
dataPermissions: '全部',
createdTime: dateFormater('yyyy-MM-dd HH:mm:ss'),
})
}
loading.value = false
}, 200);
} }
function getRoleList() {
roleApi.getRoleList(current, size, queryParams.value).then((res: any) => {
if (res.code == 0) {
total.value = res.data.total
tableData.value = res.data.records
}
})
}
function search() {
init();
}
function resetSearch() {
queryParams.value = "";
init();
}
const addData = () => { const addData = () => {
isFormDialog.value = true isFormDialog.value = true
formDialogTitle.value = '添加' formDialogTitle.value = '添加'
setTimeout(() => { setTimeout(() => {
RoleFormRef.value.resetData() RoleFormRef.value.resetData()
}, 0) }, 0)
} }
const importData = () => { const importData = () => {
setTimeout(() => { setTimeout(() => {
importDialogRef.value.open() importDialogRef.value.open()
}, 0); }, 0);
} }
const removeData = (e?: any) => { const removeData = (e?: any) => {
const selectRow = e || tableRef.value.getSelectionRows() const selectRow = e || tableRef.value.getSelectionRows()
tableRemoveRow({ data: selectRow }, (res: boolean) => { tableRemoveRow({data: selectRow}, (res: boolean) => {
if (res) { if (res) {
// console.log('', selectRow) // console.log('', selectRow)
} }
}) })
} }
const empower = (e: any) => { const empower = (e: any) => {
setTimeout(() => { setTimeout(() => {
empowerDialogRef.value.open() empowerDialogRef.value.open()
}) })
} }
const editData = (e: any) => { const editData = (e: any) => {
isFormDialog.value = true isFormDialog.value = true
formDialogTitle.value = '修改' formDialogTitle.value = '修改'
setTimeout(() => { setTimeout(() => {
RoleFormRef.value.resetData() RoleFormRef.value.resetData()
RoleFormRef.value.formData = JSON.parse(JSON.stringify(e)) // RoleFormRef.value.formData = JSON.parse(JSON.stringify(e))
}, 0) }, 0)
} }
const tableRowClick = (row: any) => { const tableRowClick = (row: any) => {
tableRef.value.toggleRowSelection(row) tableRef.value.toggleRowSelection(row)
} }
const paginationChange = (page: number, size: number) => { const paginationChange = (page: number, s: number) => {
current = page
size = s
getRoleList()
} }
</script> </script>

View File

@ -63,7 +63,7 @@ const confirmRemote = () => {
ElMessage.success('连接成功!') ElMessage.success('连接成功!')
patientInfo.value.isRemote = true patientInfo.value.isRemote = true
patientInfo.value.taskName = '远程控制' + (patientInfo.value.index + 1) patientInfo.value.taskName = '远程控制' + (patientInfo.value.index + 1)
patientInfo.value.date = dateFormater("yyyy-MM-dd", patientInfo.value.date) patientInfo.value.date = dateFormater("yyyyMMdd", patientInfo.value.date)
unsubscribeLastTask(); unsubscribeLastTask();
remoteWsStore.$patch({currentTaskIndex: patientInfo.value.index}) remoteWsStore.$patch({currentTaskIndex: patientInfo.value.index})
remoteWsStore.setRemoteLog({ remoteWsStore.setRemoteLog({