root/rax-medical
1
0
Fork 0
mirror of https://gitee.com/xiongmao1988/rax-medical.git synced 2025-08-24 13:04:57 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

菜单管理

This commit is contained in:
zhaoyz 2024-04-24 19:35:24 +08:00
parent 198b34f732
commit 15c9b35f1b
8 changed files with 442 additions and 307 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/api/menu.ts Normal file
View File

@ -0,0 +1,55 @@
import request from "@/utils/request";
const getMenuTreeUrl = "/admin/menu/tree";
const menuUrl = "/admin/menu";
export function getMenuTree(menuName?: string, parent?: string, type?: string) {
return new Promise((resolve, reject) => {
const params: any = [];
if (parent) {
params.push("parent=" + parent);
}
if (menuName) {
params.push("menuName=" + menuName);
}
if (type) {
params.push("type=" + type);
}
request.get(getMenuTreeUrl + (params.length > 0 ? "?" + params.join("&") : ""))
.then((res) => {
resolve(res.data);
}).catch(err => {
reject(err);
})
})
}
export function saveMenu(menu: any) {
return new Promise((resolve, reject) => {
request.post(menuUrl, menu).then((res: any) => {
resolve(res.data);
}).catch(err => {
reject(err);
})
})
}
export function updateMenu(menu: any) {
return new Promise((resolve, reject) => {
request.put(menuUrl, menu).then((res: any) => {
resolve(res);
}).catch(err => {
reject(err);
})
})
}
export function deleteById(id: string) {
return new Promise((resolve) => {
request.delete(menuUrl + "/" + id).then((res: any) => {
resolve(res.data);
}).catch(err => {
resolve(err);
})
})
}

1
src/components/system-logs.vue
View File

@ -20,7 +20,6 @@ function getLogList() {
logManageApi.getPage(0, 100).then((res: any) => { logManageApi.getPage(0, 100).then((res: any) => {
if (res.code == 0) { if (res.code == 0) {
activities.value = res.data.records; activities.value = res.data.records;
console.log(activities.value)
} }
}) })
} }

1
src/views/index.vue
View File

@ -77,7 +77,6 @@ const userInfo = useLoginStore().getlogin()
const hospitals = ref([] as any) const hospitals = ref([] as any)
getHospitalsData().then((res: any) => { getHospitalsData().then((res: any) => {
hospitals.value = res hospitals.value = res
// console.log(res)
}) })
const menus = [] as any const menus = [] as any

286
src/views/permissions-manage/form/menu-form.vue
View File

@ -1,165 +1,199 @@
<template> <template>
<el-form ref="formRef" :model="formData" :rules="rules" label-width="100"> <el-form ref="formRef" :model="formData" :rules="rules" label-width="100">
<el-form-item label="类型" prop="type"> <el-form-item label="类型" prop="type">
<el-radio-group v-model="formData.type" :disabled="type === 'edit'"> <el-radio-group v-model="formData.menuType" :disabled="type === 'edit'">
<el-radio label="菜单" border>菜单</el-radio> <el-radio label="0" border>菜单</el-radio>
<el-radio label="按钮" border>按钮</el-radio> <el-radio label="1" border v-if="formData.parentId != -1">按钮</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="上级菜单" prop="fatherMenu"> <el-form-item label="上级菜单" prop="parentName">
<el-select v-model="formData.fatherMenu" placeholder="请选择上级菜单" clearable> <!-- <el-select v-model="formData.parentMenu" placeholder="请选择上级菜单" clearable>
<el-option v-for="item in fatherMenuOption" :key="item.value" :label="item.label" :value="item.value" /> <el-option v-for="item in parentMenu" :key="item.value" :label="item.label" :value="item.value"/>
</el-select> </el-select>-->
</el-form-item> <el-input v-model="formData.parentName" readonly placeholder="请输入菜单名称"></el-input>
<el-form-item label="菜单名称" prop="menuName"> </el-form-item>
<el-input v-model="formData.menuName" placeholder="请输入菜单名称"></el-input> <el-form-item label="菜单名称" prop="name">
</el-form-item> <el-input v-model="formData.name" placeholder="请输入菜单名称"></el-input>
<el-form-item label="图标" prop="icon"> </el-form-item>
<i :class="formData.icon" style="font-size: 26px;margin: 0 10px;"></i> <el-form-item label="图标" prop="icon">
<el-button @click="isIconDialog = true">选择图标</el-button> <i :class="formData.icon" style="font-size: 26px;margin: 0 10px;"></i>
</el-form-item> <el-button @click="isIconDialog = true">选择图标</el-button>
<el-form-item label="路由" prop="route"> </el-form-item>
<el-input v-model="formData.route" placeholder="请输入路由"></el-input> <el-form-item label="路由" prop="route">
</el-form-item> <el-input v-model="formData.path" placeholder="请输入路由"></el-input>
<el-form-item label="排序" prop="order"> </el-form-item>
<el-input class="number-input" v-model="formData.order" type="number" input-style="text-align: center;" @change="numberInputChange"> <el-form-item label="排序" prop="order">
<template #prepend> <el-input class="number-input" v-model="formData.sortOrder"
<el-button text icon="Minus" :disabled="formData.order <= 1" @click="formData.order--" /> type="number" input-style="text-align: center;"
</template> @change="numberInputChange">
<template #append> <template #prepend>
<el-button text icon="Plus" @click="formData.order++" /> <el-button text icon="Minus" :disabled="formData.sortOrder <= 1"
</template> @click="formData.sortOrder--"/>
</el-input> </template>
</el-form-item> <template #append>
<el-form-item label="是否显示" prop="isShow"> <el-button text icon="Plus" @click="formData.sortOrder++"/>
<el-radio-group v-model="formData.isShow"> </template>
<el-radio :label="true" border>是</el-radio> </el-input>
<el-radio :label="false" border>否</el-radio> </el-form-item>
</el-radio-group> <el-form-item label="是否显示" prop="visible">
</el-form-item> <el-radio-group v-model="formData.visible">
<el-radio label="1" border>是</el-radio>
<el-radio label="0" border>否</el-radio>
</el-radio-group>
</el-form-item>
<div style="text-align: right;padding-top: 0;"> <div style="text-align: right;padding-top: 0;">
<el-button class="f18" @click="close">取消</el-button> <el-button class="f18" @click="close">取消</el-button>
<el-button class="f18" type="primary" @click="saveData">确认</el-button> <el-button class="f18" type="primary" @click="saveData">确认</el-button>
</div> </div>
</el-form> </el-form>
<el-dialog v-model="isIconDialog" title="选择图标" top="20vh" width="25%"> <el-dialog v-model="isIconDialog" title="选择图标" top="20vh" width="25%">
<div class="iconfont-box"> <div class="iconfont-box">
<div class="iconfont-item" v-for="item in iconfont.glyphs" :key="item.font_class" @click="iconClick(item)"> <div class="iconfont-item" v-for="item in iconfont.glyphs"
<i :class="'icon-' + item.font_class"></i> :key="item.font_class" @click="iconClick(item)">
</div> <i :class="'icon-' + item.font_class"></i>
</div> </div>
</el-dialog> </div>
</el-dialog>
</template> </template>
<script lang='ts' setup> <script lang='ts' setup>
import { onMounted, reactive, ref, toRefs, watch } from 'vue' import {onMounted, reactive, ref} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus' import {ElMessage} from 'element-plus'
import iconfont from "@/assets/font/iconfont.json"; import iconfont from "@/assets/font/iconfont.json";
import * as menuApi from "@/api/menu";
const emit = defineEmits(['close']) const emit = defineEmits(['close', "saveOrUpdateEvent"])
const props = defineProps({ const props = defineProps({
type: String type: String
})
defineExpose({
resetData,
}) })
const fatherMenuOption = [
{ label: '权限管理', value: '权限管理' },
{ label: '患者管理', value: '患者管理' },
]
const rules = reactive({ const rules = reactive({
menuName: [ name: [
{ required: true, message: '请输入菜单名称', trigger: ['blur', 'change'] }, {required: true, message: '请输入菜单名称', trigger: ['blur', 'change']},
], ],
route: [ path: [
{ required: true, message: '请输入路由地址', trigger: ['blur', 'change'] }, {required: true, message: '请输入路由地址', trigger: ['blur', 'change']},
] ]
}) })
const formRef = ref() const formRef = ref()
const isIconDialog = ref(false) const isIconDialog = ref(false)
const formData = ref({} as any) const formData = ref({} as any)
onMounted(() => { onMounted(() => {
resetData() resetData()
// console.log(iconfont.glyphs)
}) })
defineExpose({
formData,
resetData,
})
function close() { function close() {
emit('close') emit('close')
} }
function resetData() {
formRef.value.resetFields() function resetData(menu?: any, form?: any) {
formData.value = { formRef.value.resetFields()
id: '', if (form) {
type: '菜单', formData.value = {
fatherMenu: '', menuId: form.id,
menuName: '', menuType: form.menuType,
icon: '', parentName: form.parentName,
route: '', parentId: form.parentId,
order: 1, name: form.name,
isShow: true icon: form.meta.icon,
} path: form.path,
sortOrder: form.sortOrder,
visible: form.visible
}
} else {
formData.value = {
menuId: '',
menuType: '0',
parentName: menu ? menu.name : "无",
parentId: menu ? menu.id : "-1",
name: '',
icon: '',
path: '',
sortOrder: 1,
visible: "1"
}
}
} }
const numberInputChange = (e: any) => { const numberInputChange = (e: any) => {
if(!Number(e)) { if (!Number(e)) {
formData.value.order = 1 formData.value.sortOrder = 1
} }
} }
const iconClick = (e: any) => { const iconClick = (e: any) => {
formData.value.icon = 'icon-' + e.font_class formData.value.icon = 'icon-' + e.font_class
isIconDialog.value = false isIconDialog.value = false
} }
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() if (form.menuId) {
} else { menuApi.updateMenu(form).then((res: any) => {
// console.log('error submit!', fields) if (res.code == 0) {
} ElMessage.success("修改成功");
}) emit("saveOrUpdateEvent");
} else {
ElMessage.error("修改失败");
}
})
} else {
menuApi.saveMenu(form).then((res: any) => {
if (res.code == 0) {
ElMessage.success('保存成功！');
emit("saveOrUpdateEvent");
} else {
ElMessage.error("保存失败");
}
})
}
}
})
} }
</script> </script>
<style lang='scss' scoped> <style lang='scss' scoped>
:deep(.el-form-item) { :deep(.el-form-item) {
.el-form-item__label { .el-form-item__label {
display: block; display: block;
// text-align: justify; // text-align: justify;
// text-align-last: justify; // text-align-last: justify;
padding: 0 10px 0 20px; padding: 0 10px 0 20px;
&:before { &:before {
display: none; display: none;
} }
} }
} }
.iconfont-box { .iconfont-box {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
max-height: 300px; max-height: 300px;
overflow-y: auto; overflow-y: auto;
.iconfont-item {
width: 50px; .iconfont-item {
height: 50px; width: 50px;
line-height: 50px; height: 50px;
text-align: center; line-height: 50px;
font-size: 30px; text-align: center;
&:hover { font-size: 30px;
background: rgba($main-color, .1);
} &:hover {
&:focus, &:active { background: rgba($main-color, .1);
background: rgba($main-color, .2); }
color: $main-color;
} &:focus, &:active {
} background: rgba($main-color, .2);
color: $main-color;
}
}
} }
</style> </style>

161
src/views/permissions-manage/form/role-form.vue
View File

@ -1,107 +1,126 @@
<template> <template>
<el-form ref="formRef" :model="formData" :rules="rules" label-width="100"> <el-form ref="formRef" :model="formData" :rules="rules" label-width="100">
<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="roleMark">
<el-input v-model="formData.roleMark" placeholder="请输入角色标识" :disabled="type === 'edit'"></el-input> <el-input v-model="formData.roleMark" placeholder="请输入角色标识" :disabled="type === 'edit'"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="角色描述" prop="roleRemark"> <el-form-item label="角色描述" prop="roleRemark">
<el-input v-model="formData.roleRemark" type="textarea" :rows="3" placeholder="请输入角色描述"></el-input> <el-input v-model="formData.roleRemark" type="textarea" :rows="3" placeholder="请输入角色描述"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="数据权限" prop="dataPermissions"> <el-form-item label="数据权限" prop="dataPermissions">
<el-select v-model="formData.dataPermissions" placeholder="请选择角色"> <!-- <el-select v-model="formData.dataPermissions" placeholder="请选择角色">
<el-option v-for="item in dataPermissionsOption" :key="item.value" :label="item.label" <el-option v-for="item in dataPermissionsOption" :key="item.value" :label="item.label"
:value="item.value" /> :value="item.value" />
</el-select> </el-select>-->
</el-form-item> <div class="tree-container">
<el-tree ref="treeRef" :key="treeKey" :props="treeProps" :data="treeData" :default-expanded-keys="expandedKey"
node-key="id"
show-checkbox @check-change="checkChange"/>
</div>
</el-form-item>
<div style="text-align: right;padding-top: 0;"> <div style="text-align: right;padding-top: 0;">
<el-button class="f18" @click="close">取消</el-button> <el-button class="f18" @click="close">取消</el-button>
<el-button class="f18" type="primary" @click="saveData">确认</el-button> <el-button class="f18" type="primary" @click="saveData">确认</el-button>
</div> </div>
</el-form> </el-form>
</template> </template>
<script lang='ts' setup> <script lang='ts' setup>
import { onMounted, reactive, ref, toRefs, watch } from 'vue' import {onMounted, reactive, ref} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus' import {ElMessage} from 'element-plus'
import {getMenuData} from '@/static-data/menu'
const emit = defineEmits(['close']) const emit = defineEmits(['close'])
const props = defineProps({ const props = defineProps({
type: String type: String
}) })
const dataPermissionsOption = [ const dataPermissionsOption = [
{ label: '全部', value: '全部' }, {label: '全部', value: '全部'},
] ]
const rules = reactive({ const rules = reactive({
roleName: [ roleName: [
{ required: true, message: '请输入角色名称', trigger: ['blur', 'change'] }, {required: true, message: '请输入角色名称', trigger: ['blur', 'change']},
], ],
roleMark: [ roleMark: [
{ required: true, message: '请输入角色标识', trigger: ['blur', 'change'] }, {required: true, message: '请输入角色标识', trigger: ['blur', 'change']},
], ],
dataPermissions: [ dataPermissions: [
{ required: true, message: '请选择数据权限', trigger: ['blur', 'change'] }, {required: true, message: '请选择数据权限', trigger: ['blur', 'change']},
] ]
}) })
const formRef = ref() const formRef = ref()
const formData = ref({ const formData = ref({
id: '', id: '',
roleName: '', roleName: '',
roleMark: '', roleMark: '',
roleRemark: '', roleRemark: '',
dataPermissions: '', dataPermissions: '',
} as any) } as any)
const treeProps = {
label: 'menuName',
children: 'children'
}
const treeData = ref()
onMounted(() => { onMounted(() => {
resetData() resetData()
treeData.value = getMenuData()
}) })
defineExpose({ defineExpose({
formData, formData,
resetData, resetData,
}) })
function close() { function close() {
emit('close') emit('close')
} }
function resetData() { function resetData() {
formRef.value.resetFields() formRef.value.resetFields()
formData.value = { formData.value = {
id: '', id: '',
roleName: '', roleName: '',
roleMark: '', roleMark: '',
roleRemark: '', roleRemark: '',
dataPermissions: '', dataPermissions: '',
} }
} }
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('保存成功！') ElMessage.success('保存成功！')
close() close()
} else { } else {
// console.log('error submit!', fields) // console.log('error submit!', fields)
} }
}) })
} }
</script> </script>
<style lang='scss' scoped> <style lang='scss' scoped>
:deep(.el-form-item) { :deep(.el-form-item) {
.el-form-item__label { .el-form-item__label {
display: block; display: block;
// text-align: justify; // text-align: justify;
// text-align-last: justify; // text-align-last: justify;
padding: 0 10px 0 20px; padding: 0 10px 0 20px;
&:before { &:before {
display: none; display: none;
} }
} }
}
.tree-container {
width: 100%;
min-height: 200px;
max-height: 500px;
overflow-y: auto;
} }
</style> </style>

227
src/views/permissions-manage/menu-manage.vue
View File

@ -1,133 +1,164 @@
<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.menuName" 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="searchList">查询</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 @click="expandTable">展开/折叠</el-button> <el-button @click="expandTable">展开/折叠</el-button>
</div> </div>
<TableAbility :isDownload="false" @searchBtn="isSearch = !isSearch" @refreshBtn="initData()"></TableAbility> <TableAbility :isDownload="false" @searchBtn="isSearch = !isSearch" @refreshBtn="initData()"></TableAbility>
</div> </div>
<div class="table-part"> <div class="table-part">
<el-table ref="tableRef" :data="tableData" row-key="id" height="100%" border show-overflow-tooltip <el-table ref="tableRef" :data="tableData" row-key="id" height="100%" border show-overflow-tooltip
@row-click="tableRowClick"> @row-click="tableRowClick">
<el-table-column property="menuName" label="菜单名称" width="180" align="center" /> <el-table-column property="name" label="菜单名称" width="180" align="center"/>
<el-table-column property="order" label="排序" width="80" align="center" /> <el-table-column property="sortOrder" label="排序" width="80" align="center"/>
<el-table-column label="图标" width="80" align="center"> <el-table-column label="图标" width="80" align="center">
<template #default="scope"><i class="main-color f20" :class="scope.row.icon"></i></template> <template #default="scope"><i class="main-color f20" :class="scope.row.meta.icon"></i></template>
</el-table-column> </el-table-column>
<el-table-column property="route" label="路由" width="260" align="center" /> <el-table-column property="path" label="路由" width="260" align="center"/>
<el-table-column property="type" label="类型" width="180" align="center" /> <el-table-column property="menuType" label="类型" width="180" align="center"/>
<el-table-column label="操作" align="center"> <el-table-column label="操作" align="center">
<template #default="scope"> <template #default="scope">
<span @click.stop> <div @click.stop>
<el-button link icon="EditPen" @click="editData(scope.row)">修改</el-button> <el-button link icon="EditPen" @click="addData(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>
</div> <el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%">
</div> <MenuForm ref="menuFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'"
<el-dialog v-model="isFormDialog" :title="formDialogTitle" width="30%"> @save-or-update-event="formSaveUpdateEvent" @close="isFormDialog = false"/>
<MenuForm ref="doctorFormRef" :type="formDialogTitle === '添加' ? 'add' : 'edit'" @close="isFormDialog = false" /> </el-dialog>
</el-dialog>
</template> </template>
<script lang='ts' setup> <script lang='ts' setup>
import { onMounted, reactive, ref, toRefs, watch } from 'vue' import {onMounted, ref} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { tableRemoveRow, exportData } from '@/utils/table-util'
import { getMenuData } from '@/static-data/menu'
import CommonPagination from '@/components/common-pagination.vue'
import MenuForm from './form/menu-form.vue' import MenuForm from './form/menu-form.vue'
import * as menuApi from "@/api/menu";
import {ElMessage, ElMessageBox} from "element-plus";
let isExpand = false // 表格展开状态 let isExpand = false // 表格展开状态
const tableRef = ref() const tableRef = ref()
const doctorFormRef = ref() const menuFormRef = ref()
const isSearch = ref(true) const isSearch = ref(true)
const loading = ref(true) const loading = ref(true)
const isFormDialog = ref(false) const isFormDialog = ref(false)
const formDialogTitle = ref('') const formDialogTitle = ref('')
const queryParams = ref({ const queryParams = ref('')
menuName: ''
} as any)
const tableData = ref([] as any) const tableData = ref([] as any)
initData() onMounted(() => {
initData();
})
function initData() { function initData() {
loading.value = true loading.value = true;
tableData.value = [] tableData.value = [];
setTimeout(() => { getMenuTree();
tableData.value = getMenuData() }
loading.value = false
}, 200); function searchList() {
loading.value = true;
tableData.value = [];
getMenuTree(queryParams.value)
}
function resetSearch() {
queryParams.value = '';
initData();
}
function getMenuTree(name?: string) {
menuApi.getMenuTree(name).then((res: any) => {
tableData.value = res.data;
updateMenuTree(res.data, tableData.value);
})
}
function updateMenuTree(source: any[], target: any[]) {
target.forEach((row: any) => {
});
} }
const queryData = (e: any) => { const queryData = (e: any) => {
loading.value = true loading.value = true
tableData.value = [] tableData.value = []
setTimeout(() => { setTimeout(() => {
while (tableData.value.length < 10) { while (tableData.value.length < 10) {
tableData.value.push({ tableData.value.push({
id: tableData.value.length, id: tableData.value.length,
menuName: e.menuName, menuName: e.menuName,
order: tableData.value.length + 1, order: tableData.value.length + 1,
icon: 'icon-shouye-zhihui', icon: 'icon-shouye-zhihui',
route: '/permissions-manage', route: '/permissions-manage',
type: '菜单', type: '菜单',
}) })
} }
loading.value = false loading.value = false
}, 200); }, 200);
} }
const addData = () => { const addData = (menu?: any) => {
isFormDialog.value = true isFormDialog.value = true
formDialogTitle.value = '添加' formDialogTitle.value = '添加'
setTimeout(() => { setTimeout(() => {
doctorFormRef.value.resetData() menuFormRef.value.resetData(menu)
}, 0) }, 0)
} }
const expandTable = () => { const expandTable = () => {
isExpand = !isExpand isExpand = !isExpand
tableData.value.forEach((row: any) => { tableData.value.forEach((row: any) => {
tableRef.value.toggleRowExpansion(row, isExpand) tableRef.value.toggleRowExpansion(row, isExpand)
}) })
} }
const removeData = (e?: any) => { const removeData = (e?: any) => {
const selectRow = e || tableRef.value.getSelectionRows() ElMessageBox.confirm(
tableRemoveRow({ data: selectRow }, (res: boolean) => { '是否删除？',
if (res) { {
// console.log('调用删除', selectRow) confirmButtonText: '确定',
} cancelButtonText: '取消',
}) type: 'warning',
draggable: true
}
).then(() => {
menuApi.deleteById(e.id).then((res: any) => {
if (res.code == 0) {
ElMessage.success("删除成功");
initData();
} else {
ElMessage.error(res.msg ? res.msg : "删除失败");
}
})
})
} }
const editData = (e: any) => { const editData = (e: any) => {
isFormDialog.value = true isFormDialog.value = true
formDialogTitle.value = '修改' formDialogTitle.value = '修改'
setTimeout(() => { setTimeout(() => {
doctorFormRef.value.resetData() menuFormRef.value.resetData(null, JSON.parse(JSON.stringify(e)))
doctorFormRef.value.formData = JSON.parse(JSON.stringify(e)) }, 0)
}, 0)
} }
const tableRowClick = (row: any) => { const tableRowClick = (row: any) => {
tableRef.value.toggleRowExpansion(row) tableRef.value.toggleRowExpansion(row)
} }
const paginationChange = (page: number, size: number) => {
function formSaveUpdateEvent() {
isFormDialog.value = false;
initData();
} }
</script> </script>
<style lang='scss' scoped></style> <style lang='scss' scoped></style>

14
src/views/permissions-manage/role-manage.vue
View File

@ -3,7 +3,7 @@
<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.roleName" 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="queryData(queryParams)">查询</el-button>
<el-button icon="Refresh" @click="queryParams = {}">重置</el-button> <el-button icon="Refresh" @click="queryParams = {}">重置</el-button>
@ -51,10 +51,9 @@
</template> </template>
<script lang='ts' setup> <script lang='ts' setup>
import { onMounted, reactive, ref, toRefs, watch } from 'vue' import {ref} from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus' import {dateFormater} from '@/utils/date-util'
import { dateFormater } from '@/utils/date-util' import {exportData, tableRemoveRow} from '@/utils/table-util'
import { tableRemoveRow, exportData } 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'
@ -68,9 +67,7 @@ const isSearch = ref(true)
const loading = ref(true) const loading = ref(true)
const isFormDialog = ref(false) const isFormDialog = ref(false)
const formDialogTitle = ref('') const formDialogTitle = ref('')
const queryParams = ref({ const queryParams = ref("")
roleName: ''
} as any)
const tableData = ref([] as any) const tableData = ref([] as any)
queryData({ roleName: '测试' }) queryData({ roleName: '测试' })
@ -127,6 +124,7 @@ const editData = (e: any) => {
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, size: number) => {
} }

4
vite.config.ts
View File

@ -24,14 +24,14 @@ export default defineConfig({
proxy: { proxy: {
'/api': { '/api': {
//target: 'http://192.168.137.235:9999', // 目标服务器地址 //target: 'http://192.168.137.235:9999', // 目标服务器地址
target: 'http://192.168.1.110:9999', // 目标服务器地址 target: 'http://localhost:9999', // 目标服务器地址
ws: true, // 是否启用 WebSocket ws: true, // 是否启用 WebSocket
changeOrigin: true, // 是否修改请求头中的 Origin 字段 changeOrigin: true, // 是否修改请求头中的 Origin 字段
rewrite: (path) => path.replace(/^\/api/, ''), rewrite: (path) => path.replace(/^\/api/, ''),
}, },
'/socket.io': { '/socket.io': {
//target: 'ws://192.168.137.235:9999', //target: 'ws://192.168.137.235:9999',
target: 'ws://192.168.1.110:9999', target: 'ws://localhost:9999',
ws: true, ws: true,
changeOrigin: true, changeOrigin: true,
rewrite: (path) => path.replace(/^\/socket.io/, ''), rewrite: (path) => path.replace(/^\/socket.io/, ''),