| | |
| | | data:value |
| | | }); |
| | | }, |
| | | // getMenuTest: (params?: string) => { |
| | | // return request({ |
| | | // url: '/gitee/lyt-top/vue-next-admin-images/raw/master/menu/testMenu.json', |
| | | // method: 'get', |
| | | // params, |
| | | // }); |
| | | // }, |
| | | deleteMenu: (value?: object) => { |
| | | return request({ |
| | | url: `/menu/del`, |
| | | method: 'post', |
| | | data:value, |
| | | }); |
| | | }, |
| | | }; |
| | | } |
对比新文件 |
| | |
| | | import request from '/@/utils/request' |
| | | |
| | | export function productionDeviceApi() { |
| | | return { |
| | | getProductionDeviceList: (data: object) => { |
| | | return request({ |
| | | url: `/prevent/device/select/getDevicePage`, |
| | | method: 'post', |
| | | data:data |
| | | }); |
| | | }, |
| | | addProductionDevice: (data: object) => { |
| | | return request({ |
| | | url: `/prevent/device/insert/saveDevice`, |
| | | method: 'post', |
| | | data:data |
| | | }); |
| | | }, |
| | | modProductionDevice: (data: object) => { |
| | | return request({ |
| | | url: `/prevent/device/update/updateDevice`, |
| | | method: 'post', |
| | | data:data |
| | | }); |
| | | }, |
| | | deleteProductionDevice: (data: object) => { |
| | | return request({ |
| | | url: `/prevent/device/delete/deleteDevice`, |
| | | method: 'post', |
| | | data:data |
| | | }); |
| | | }, |
| | | } |
| | | } |
| | |
| | | method: 'post', |
| | | }); |
| | | }, |
| | | addRole: (data: object) => { |
| | | return request({ |
| | | url: `/role/add`, |
| | | method: 'post', |
| | | data:data |
| | | }); |
| | | }, |
| | | modRole: (data: object) => { |
| | | return request({ |
| | | url: `/role/mod`, |
| | | method: 'post', |
| | | data:data |
| | | }); |
| | | }, |
| | | }; |
| | | } |
| | |
| | | export async function initBackEndControlRoutes() { |
| | | if (window.nextLoading === undefined) NextLoading.start(); |
| | | if (!Session.get('token')) return false; |
| | | const res = await getBackEndControlRoutes(Session.get('projectId')); |
| | | const res = await getBackEndControlRoutes(Session.get('projectId') === null ? '' : Session.get('projectId')); |
| | | useRequestOldRoutes().setRequestOldRoutes(JSON.parse(JSON.stringify(res.data.data))); |
| | | dynamicRoutes[0].children = await backEndComponent(res.data.data); |
| | | await setAddRoute(); |
| | |
| | | }), |
| | | actions: { |
| | | async setUserInfos(value: any) { |
| | | debugger |
| | | this.userInfos.userName = value.username |
| | | this.userInfos.uid = value.id |
| | | this.userInfos.uid = value.uid |
| | | this.userInfos.roles = value.role |
| | | // const userName = Cookies.get('userName'); |
| | | // // 模拟数据 |
对比新文件 |
| | |
| | | import { App } from 'vue' |
| | | |
| | | export function preventClick(app: App){ |
| | | app.directive('debounce', { |
| | | mounted(el, binding) { |
| | | let timer : NodeJS.Timeout | null = null |
| | | el.addEventListener('click', () => { |
| | | debugger |
| | | let firstClick: Boolean = !timer; |
| | | if(firstClick){ |
| | | binding.value |
| | | } |
| | | if(timer){ |
| | | clearTimeout(timer) |
| | | } |
| | | timer = setTimeout(() => { |
| | | timer = null |
| | | if(!firstClick){ |
| | | binding.value |
| | | } |
| | | },3000); |
| | | }) |
| | | } |
| | | }) |
| | | } |
| | |
| | | <template> |
| | | <div>1</div> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <el-input size="default" placeholder="请输入角色名称" style="max-width: 180px"> </el-input> |
| | | <el-button size="default" type="primary" class="ml10" @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增','')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增角色 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="productionDeviceData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="区域位置" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="状态" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gtmCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditByUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gtmCreate" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('新增','')">新增</el-button> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改',scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | <roleDialog ref="roleDialogRef" @refreshRoleList="initRoleTableData"/> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: "index" |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import roleDialog from '/@/views/system/role/component/roleDialog.vue'; |
| | | import {productionDeviceApi} from "/@/api/productionDevice"; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | productionDeviceData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskLevel:number; |
| | | status:number; |
| | | depName:string; |
| | | location:string; |
| | | produceDeviceName:string; |
| | | }; |
| | | }; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'productionDevice', |
| | | components: { roleDialog }, |
| | | setup() { |
| | | const roleDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | productionDeviceData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskLevel:1, |
| | | status:1, |
| | | depName:"", |
| | | location:"", |
| | | produceDeviceName:"" |
| | | }, |
| | | }, |
| | | }); |
| | | // 初始化表格数据 |
| | | const initProductionDeviceTableData = async () => { |
| | | let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params) |
| | | if(res.data.code === '200'){ |
| | | state.productionDeviceData.data = res.data.data; |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }; |
| | | // 打开新增角色弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | roleDialogRef.value.openDialog(type, value); |
| | | }; |
| | | // 删除角色 |
| | | const onRowDel = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除角色名称:“${row.roleName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }).catch(() => {}); |
| | | }; |
| | | const handleSearch = () => { |
| | | initProductionDeviceTableData() |
| | | } |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.productionDeviceData.param.pageSize = val; |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.productionDeviceData.param.pageNum = val; |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initProductionDeviceTableData(); |
| | | }); |
| | | return { |
| | | onRowDel, |
| | | roleDialog, |
| | | handleSearch, |
| | | roleDialogRef, |
| | | onOpenDialogRef, |
| | | initProductionDeviceTableData, |
| | | onHandleSizeChange, |
| | | onHandleCurrentChange, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |
| | |
| | | userInfo.setUserInfos(res.data.data) |
| | | Session.set('token', res.data.data.accessToken); |
| | | Session.set('projectId',''); |
| | | Session.set('uid',res.data.data.id); |
| | | Session.set('uid',res.data.data.uid); |
| | | await initBackEndControlRoutes(); |
| | | signInSuccess(); |
| | | }else{ |
| | |
| | | struct:[] |
| | | } |
| | | }else{ |
| | | state.title = '编辑部门' |
| | | state.departmentForm = value |
| | | state.title = '修改部门' |
| | | state.departmentForm = JSON.parse(JSON.stringify(value)) |
| | | } |
| | | }; |
| | | // 关闭弹窗 |
| | |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'菜单新增成功', |
| | | message:'部门新增成功', |
| | | duration:2000 |
| | | }) |
| | | closeDialog(); |
| | | context.emit('getMenuList') |
| | | context.emit('getDepartmentList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'菜单修改成功', |
| | | message:'部门修改成功', |
| | | duration:2000 |
| | | }) |
| | | closeDialog(); |
| | | context.emit('getMenuList') |
| | | context.emit('getDepartmentList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | |
| | | :data="tableData.data" |
| | | style="width: 100%" |
| | | row-key="id" |
| | | default-expand-all |
| | | :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" |
| | | > |
| | | <el-table-column prop="name" label="部门名称" show-overflow-tooltip> </el-table-column> |
| | |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | <deptDialog ref="deptDialog" /> |
| | | <deptDialog ref="deptDialog" @getDepartmentList="initTableData"/> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | } |
| | | }; |
| | | // 打开新增菜单弹窗 |
| | | const onOpenDeptDialog = (type: string,value: any) => { |
| | | deptDialog.value.openDialog(type,value,state.tableData.data); |
| | | const onOpenDeptDialog = (type: string, value: any) => { |
| | | deptDialog.value.openDialog(type, value, state.tableData.data); |
| | | }; |
| | | // 删除当前行 |
| | | const onTabelRowDel = (row: TableDataRow) => { |
| | |
| | | }); |
| | | return { |
| | | deptDialog, |
| | | initTableData, |
| | | onOpenDeptDialog, |
| | | onTabelRowDel, |
| | | ...toRefs(state), |
| | |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenMenuDialog('新增')">新增</el-button> |
| | | <el-button size="small" text type="primary" @click="onOpenMenuDialog('修改',scope.row)">修改</el-button> |
| | | <!-- <el-button size="small" text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button>--> |
| | | <el-button size="small" text type="primary" @click="deleteMenu(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | import pinia from "/@/stores"; |
| | | import {dynamicRoutes} from "/@/router/route"; |
| | | import {useUserInfo} from "/@/stores/userInfo"; |
| | | import {initBackEndControlRoutes} from "/@/router/backEnd"; |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemMenu', |
| | | components: { menuDialog }, |
| | | setup() { |
| | | const menuDialog = ref(); |
| | | const storesRoutesList = useRoutesList(); |
| | | const state = reactive({ |
| | | projectId:'1', |
| | | menuData:[], |
| | |
| | | }; |
| | | // 打开编辑菜单弹窗 |
| | | // 删除当前行 |
| | | const onTabelRowDel = (row: RouteRecordRaw) => { |
| | | const deleteMenu = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除路由:${row.path}, 是否继续?`, '提示', { |
| | | confirmButtonText: '删除', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }).then(async () => { |
| | | let res = await useMenuApi().deleteMenu({id:row.id}) |
| | | if(res.data.code ==='200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | duration:2000, |
| | | message:'删除成功' |
| | | }) |
| | | await getMenuList() |
| | | if(Session.get('projectId') == state.projectId) await initBackEndControlRoutes() |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }).catch(() => {}); |
| | | }; |
| | | const getMenuList = async () => { |
| | | let res = await useMenuApi().getMenuAdmin(state.projectId) |
| | | if(res.data.code === '200'){ |
| | | state.menuTableData = res.data.data |
| | | // const storesRoutesList = useRoutesList(pinia); |
| | | // storesRoutesList.setRoutesList(res.data.data); |
| | | if(Session.get('projectId') == state.projectId) await initBackEndControlRoutes() |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | |
| | | getMenuList, |
| | | menuDialog, |
| | | onOpenMenuDialog, |
| | | onTabelRowDel, |
| | | deleteMenu, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-role-container"> |
| | | <el-dialog :title="title" v-model="isShowRoleDialog" width="769px"> |
| | | <el-form :model="roleForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="角色名称"> |
| | | <el-input v-model="roleForm.name" placeholder="请输入角色名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="角色标识"> |
| | | <el-input v-model="roleForm.code" placeholder="请输入角色标识" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="角色描述"> |
| | | <el-input v-model="roleForm.info" type="textarea" placeholder="请输入角色描述" maxlength="150"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowRoleDialog = !isShowRoleDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" size="default">{{ buttonName }}</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { ElMessage } from 'element-plus'; |
| | | import { reactive, toRefs, defineComponent } from 'vue'; |
| | | import {departmentApi} from "/@/api/department"; |
| | | import {useRoleApi} from "/@/api/role"; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface MenuDataTree { |
| | | id: number; |
| | | label: string; |
| | | children?: MenuDataTree[]; |
| | | } |
| | | interface RoleState { |
| | | title:string, |
| | | buttonName:string, |
| | | isShowRoleDialog: boolean; |
| | | roleForm: { |
| | | name: string; |
| | | code: string; |
| | | info: string; |
| | | }; |
| | | menuData: Array<MenuDataTree>; |
| | | menuProps: { |
| | | children: string; |
| | | label: string; |
| | | }; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemAddRole', |
| | | setup(prop,context) { |
| | | const state = reactive<RoleState>({ |
| | | isShowRoleDialog: false, |
| | | title:'', |
| | | buttonName:'', |
| | | roleForm: { |
| | | name: '', // 角色名称 |
| | | code: '', // 角色标识 |
| | | info: '', // 排序 |
| | | }, |
| | | menuData: [], |
| | | menuProps: { |
| | | children: 'children', |
| | | label: 'label', |
| | | }, |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type: string, value: any) => { |
| | | state.isShowRoleDialog = true; |
| | | if(type === '新增'){ |
| | | state.title = '新增角色' |
| | | state.buttonName = '新增' |
| | | state.roleForm = { |
| | | name:'', |
| | | code:'', |
| | | info:'', |
| | | } |
| | | }else{ |
| | | state.title = '修改角色' |
| | | state.buttonName = '修改' |
| | | state.roleForm = JSON.parse(JSON.stringify(value)) |
| | | } |
| | | }; |
| | | // 新增 |
| | | const onSubmit = async () => { |
| | | if(state.title === '新增角色'){ |
| | | let res = await useRoleApi().addRole(state.roleForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'角色新增成功', |
| | | duration:2000 |
| | | }) |
| | | state.isShowRoleDialog = false |
| | | context.emit('refreshRoleList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }else{ |
| | | let res = await useRoleApi().modRole(state.roleForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'角色修改成功', |
| | | duration:2000 |
| | | }) |
| | | state.isShowRoleDialog = false |
| | | context.emit('refreshRoleList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | } |
| | | }; |
| | | // 获取菜单结构数据 |
| | | return { |
| | | onSubmit, |
| | | openDialog, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | .system-add-role-container { |
| | | .menu-data-tree { |
| | | width: 100%; |
| | | border: 1px solid var(--el-border-color); |
| | | border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
| | | padding: 5px; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenAddRole"> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增','')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="name" label="角色名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="code" label="角色标识" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="sort" label="排序" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="角色状态" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <el-tag type="success" v-if="scope.row.status">启用</el-tag> |
| | | <el-tag type="info" v-else>禁用</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="info" label="角色描述" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button :disabled="scope.row.roleName === '超级管理员'" size="small" text type="primary" @click="onOpenEditRole(scope.row)" |
| | | >修改</el-button |
| | | > |
| | | <el-button :disabled="scope.row.roleName === '超级管理员'" size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('新增','')">新增</el-button> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改',scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="tableData.param.pageNum" |
| | | background |
| | | v-model:page-size="tableData.param.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="tableData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <AddRole ref="addRoleRef" /> |
| | | <EditRole ref="editRoleRef" /> |
| | | <roleDialog ref="roleDialogRef" @refreshRoleList="initRoleTableData"/> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import AddRole from '/@/views/system/role/component/addRole.vue'; |
| | | import EditRole from '/@/views/system/role/component/editRole.vue'; |
| | | import roleDialog from '/@/views/system/role/component/roleDialog.vue'; |
| | | import {useRoleApi} from "/@/api/role"; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemRole', |
| | | components: { AddRole, EditRole }, |
| | | components: { roleDialog }, |
| | | setup() { |
| | | const addRoleRef = ref(); |
| | | const editRoleRef = ref(); |
| | | const roleDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | tableData: { |
| | | data: [], |
| | |
| | | }, |
| | | }); |
| | | // 初始化表格数据 |
| | | const initTableData = async () => { |
| | | const initRoleTableData = async () => { |
| | | let res = await useRoleApi().getRoleList() |
| | | if(res.data.code === '200'){ |
| | | state.tableData.data = res.data.data; |
| | |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | |
| | | }; |
| | | // 打开新增角色弹窗 |
| | | const onOpenAddRole = () => { |
| | | addRoleRef.value.openDialog(); |
| | | }; |
| | | // 打开修改角色弹窗 |
| | | const onOpenEditRole = (row: Object) => { |
| | | editRoleRef.value.openDialog(row); |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | roleDialogRef.value.openDialog(type, value); |
| | | }; |
| | | // 删除角色 |
| | | const onRowDel = (row: any) => { |
| | |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }) |
| | | .then(() => { |
| | | }).then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }) |
| | | .catch(() => {}); |
| | | }).catch(() => {}); |
| | | }; |
| | | const handleSearch = () => { |
| | | initTableData() |
| | | initRoleTableData() |
| | | } |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initTableData(); |
| | | initRoleTableData(); |
| | | }); |
| | | return { |
| | | addRoleRef, |
| | | editRoleRef, |
| | | onOpenAddRole, |
| | | onOpenEditRole, |
| | | onRowDel, |
| | | roleDialog, |
| | | handleSearch, |
| | | roleDialogRef, |
| | | onOpenDialogRef, |
| | | initRoleTableData, |
| | | onHandleSizeChange, |
| | | onHandleCurrentChange, |
| | | handleSearch, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |