From 5300055cd642d238557b36136f6c1b810e3a0642 Mon Sep 17 00:00:00 2001 From: LOGIC <376693576@qq.com> Date: Fri, 14 Aug 2020 17:31:14 +0800 Subject: [PATCH 1/9] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=B8=80=E6=B3=A2?= =?UTF-8?q?=E5=8E=9F=E7=89=88class?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- mock/app-data.js | 143 +- package.json | 81 +- src/a_component/Bread/index.js | 4 +- src/a_component/CanvasBack/index.js | 8 +- src/a_component/Header/index.js | 10 +- src/a_component/Icon/index.js | 2 +- src/a_component/Menu/index.js | 20 +- src/a_component/TreeChose/PowerTreeTable.js | 52 +- src/a_component/TreeChose/RoleTree.js | 22 +- src/a_component/TreeChose/menuChose.js | 14 +- src/a_container/ErrorPages/401.js | 9 +- src/a_container/ErrorPages/404.js | 9 +- src/a_container/Login/index.js | 52 +- src/a_container/System/MenuAdmin/index.js | 180 +- src/a_container/System/PowerAdmin/index.js | 197 +- src/a_container/System/RoleAdmin/index.js | 88 +- src/a_container/System/UserAdmin/index.js | 102 +- src/index.js | 7 +- src/layouts/BasicLayout.js | 32 +- src/layouts/UserLayout.js | 15 +- src/models/app.js | 32 +- src/models/sys.js | 10 +- src/router/index.js | 12 +- src/serviceWorker.js | 10 +- src/store/index.js | 4 +- src/util/axios.js | 2 +- src/util/json.js | 2 +- src/util/tools.js | 4 +- webpack.dev.config.js | 17 +- webpack.production.config.js | 20 +- yarn.lock | 4441 +++++++++++-------- 31 files changed, 3229 insertions(+), 2372 deletions(-) diff --git a/mock/app-data.js b/mock/app-data.js index 5cb2251..258b2ac 100644 --- a/mock/app-data.js +++ b/mock/app-data.js @@ -382,9 +382,14 @@ const roles = [ * 方法 * **/ // 登录 -const onLogin = p => { - const u = users.find(item => { - console.log("gaoxiao?", item.username, p.username, item.musername === p.username); +const onLogin = (p) => { + const u = users.find((item) => { + console.log( + "gaoxiao?", + item.username, + p.username, + item.musername === p.username + ); return item.username === p.username; }); console.log("没有？", users, p, u); @@ -396,7 +401,7 @@ const onLogin = p => { return { status: 200, data: u, message: "登录成功" }; }; // 删除消息数据 -const clearNews = p => { +const clearNews = (p) => { // const p = JSON.parse(request.body); switch (p.type) { case "notice": @@ -417,24 +422,24 @@ const clearNews = p => { }; }; // 获取所有菜单 -const getMenus = p => { +const getMenus = (p) => { return { status: 200, data: menus, message: "success" }; }; // 获取菜单（根据ID） -const getMenusById = p => { +const getMenusById = (p) => { // const p = JSON.parse(request.body); let res = []; if (p.id instanceof Array) { - res = menus.filter(item => p.id.includes(item.id)); + res = menus.filter((item) => p.id.includes(item.id)); } else { - const t = menus.find(item => item.id === p.id); + const t = menus.find((item) => item.id === p.id); res.push(t); } return { status: 200, data: res, message: "success" }; }; // 添加新菜单 -const addMenu = p => { +const addMenu = (p) => { // const p = JSON.parse(request.body); console.log("添加：", p); p.id = ++id_sequence; @@ -442,10 +447,10 @@ const addMenu = p => { return { status: 200, data: menus, message: "添加成功" }; }; // 修改菜单 -const upMenu = p => { +const upMenu = (p) => { // const p = JSON.parse(request.body); console.log("到这了吗：", p); - const oldIndex = menus.findIndex(item => item.id === p.id); + const oldIndex = menus.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { const news = Object.assign({}, menus[oldIndex], p); menus.splice(oldIndex, 1, news); @@ -455,12 +460,14 @@ const upMenu = p => { } }; // 删除菜单 -const delMenu = p => { +const delMenu = (p) => { // const p = JSON.parse(request.body); - const oldIndex = menus.findIndex(item => item.id === p.id); + const oldIndex = menus.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { - const haveChild = menus.findIndex(item => item.parent === menus[oldIndex].id); + const haveChild = menus.findIndex( + (item) => item.parent === menus[oldIndex].id + ); if (haveChild === -1) { menus.splice(oldIndex, 1); return { status: 200, data: menus, message: "success" }; @@ -472,14 +479,16 @@ const delMenu = p => { } }; // 根据菜单ID查询其下权限 -const getPowerByMenuId = p => { +const getPowerByMenuId = (p) => { // const p = JSON.parse(request.body); const menuId = Number(p.menuId); if (menuId) { return { status: 200, - data: powers.filter(item => item.menu === menuId).sort((a, b) => a.sorts - b.sorts), + data: powers + .filter((item) => item.menu === menuId) + .sort((a, b) => a.sorts - b.sorts), message: "success", }; } else { @@ -487,30 +496,30 @@ const getPowerByMenuId = p => { } }; // 根据权限ID查询对应的权限 -const getPowerById = p => { +const getPowerById = (p) => { // const p = JSON.parse(request.body); let res = []; console.log("开始查权限了，都有什么：", p); if (p.id instanceof Array) { - res = powers.filter(item => p.id.includes(item.id)); + res = powers.filter((item) => p.id.includes(item.id)); } else { - const t = powers.find(item => item.id === p.id); + const t = powers.find((item) => item.id === p.id); res.push(t); } return { status: 200, data: res, message: "success" }; }; // 添加权限 -const addPower = p => { +const addPower = (p) => { // const p = JSON.parse(request.body); p.id = ++id_sequence; powers.push(p); return { status: 200, data: { id: p.id }, message: "success" }; }; // 修改权限 -const upPower = p => { +const upPower = (p) => { // const p = JSON.parse(request.body); console.log("到这了吗：", p); - const oldIndex = powers.findIndex(item => item.id === p.id); + const oldIndex = powers.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { const news = Object.assign({}, powers[oldIndex], p); powers.splice(oldIndex, 1, news); @@ -520,8 +529,8 @@ const upPower = p => { } }; // 删除权限 -const delPower = p => { - const oldIndex = powers.findIndex(item => item.id === p.id); +const delPower = (p) => { + const oldIndex = powers.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { powers.splice(oldIndex, 1); @@ -531,9 +540,9 @@ const delPower = p => { } }; // 查询角色（分页,条件筛选） -const getRoles = p => { +const getRoles = (p) => { // const p = JSON.parse(request.body); - const map = roles.filter(item => { + const map = roles.filter((item) => { let yeah = true; if (p.title && !item.title.includes(p.title)) { yeah = false; @@ -553,32 +562,32 @@ const getRoles = p => { }; }; // 查询角色（所有） -const getAllRoles = p => { +const getAllRoles = (p) => { return { status: 200, data: roles, message: "success" }; }; // 查询角色（通过角色ID） -const getRoleById = p => { +const getRoleById = (p) => { // const p = JSON.parse(request.body); let res = []; if (p.id instanceof Array) { - res = roles.filter(item => p.id.includes(item.id)); + res = roles.filter((item) => p.id.includes(item.id)); } else { - const t = roles.find(item => item.id === p.id); + const t = roles.find((item) => item.id === p.id); res.push(t); } return { status: 200, data: res, message: "success" }; }; // 添加角色 -const addRole = p => { +const addRole = (p) => { // const p = JSON.parse(request.body); p.id = ++id_sequence; roles.push(p); return { status: 200, data: null, message: "success" }; }; // 修改角色 -const upRole = p => { +const upRole = (p) => { // const p = JSON.parse(request.body); - const oldIndex = roles.findIndex(item => item.id === p.id); + const oldIndex = roles.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { const news = Object.assign({}, roles[oldIndex], p); roles.splice(oldIndex, 1, news); @@ -588,9 +597,9 @@ const upRole = p => { } }; // 删除角色 -const delRole = p => { +const delRole = (p) => { // const p = JSON.parse(request.body); - const oldIndex = roles.findIndex(item => item.id === p.id); + const oldIndex = roles.findIndex((item) => item.id === p.id); console.log("开始删除：", oldIndex); if (oldIndex !== -1) { roles.splice(oldIndex, 1); @@ -600,16 +609,16 @@ const delRole = p => { } }; // 根据角色ID查询该角色所拥有的菜单和权限详细信息 -const findAllPowerByRoleId = p => { +const findAllPowerByRoleId = (p) => { // const p = JSON.parse(request.body); - const t = roles.find(item => item.id === p.id); + const t = roles.find((item) => item.id === p.id); if (t) { const res = t.powers.map((item, index) => { - const _menu = menus.find(v => v.id === item.menuId); - const _powers = item.powers.map(v => { - return powers.find(p => p.id === v); + const _menu = menus.find((v) => v.id === item.menuId); + const _powers = item.powers.map((v) => { + return powers.find((p) => p.id === v); }); - _menu.powers = _powers.filter(item => item.conditions === 1); + _menu.powers = _powers.filter((item) => item.conditions === 1); return _menu; }); return { status: 200, data: res, message: "success" }; @@ -618,30 +627,32 @@ const findAllPowerByRoleId = p => { } }; // 获取所有的菜单及权限数据 - 为了构建PowerTree组件 -const getAllPowers = p => { - const res = menus.map(item => { +const getAllPowers = (p) => { + const res = menus.map((item) => { const _menu = item; - const _powers = powers.filter(v => v.menu === item.id && v.conditions === 1); + const _powers = powers.filter( + (v) => v.menu === item.id && v.conditions === 1 + ); _menu.powers = _powers; return _menu; }); return { status: 200, data: res, message: "success" }; }; // 给指定角色分配菜单和权限 -const setPowersByRoleId = p => { +const setPowersByRoleId = (p) => { // const p = JSON.parse(request.body); - const oldIndex = roles.findIndex(item => item.id === p.id); + const oldIndex = roles.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { - let pow = p.menus.map(item => ({ menuId: item, powers: [] })); + let pow = p.menus.map((item) => ({ menuId: item, powers: [] })); console.log("此时的POW", pow); // 将每一个权限id归类到对应的菜单里 - p.powers.forEach(ppItem => { + p.powers.forEach((ppItem) => { // 通过权限id查询该权限对象 - const thePowerData = powers.find(pItem => pItem.id === ppItem); + const thePowerData = powers.find((pItem) => pItem.id === ppItem); if (thePowerData) { const theMenuId = thePowerData.menu; if (theMenuId) { - const thePow = pow.find(powItem => powItem.menuId === theMenuId); + const thePow = pow.find((powItem) => powItem.menuId === theMenuId); if (thePow) { thePow.powers.push(ppItem); } @@ -658,20 +669,20 @@ const setPowersByRoleId = p => { }; // 给指定角色分配菜单和权限 -const setPowersByRoleIds = ps => { - ps.forEach(p => { - const oldIndex = roles.findIndex(item => item.id === p.id); +const setPowersByRoleIds = (ps) => { + ps.forEach((p) => { + const oldIndex = roles.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { - let pow = p.menus.map(item => ({ menuId: item, powers: [] })); + let pow = p.menus.map((item) => ({ menuId: item, powers: [] })); console.log("此时的POW", pow); // 将每一个权限id归类到对应的菜单里 - p.powers.forEach(ppItem => { + p.powers.forEach((ppItem) => { // 通过权限id查询该权限对象 - const thePowerData = powers.find(pItem => pItem.id === ppItem); + const thePowerData = powers.find((pItem) => pItem.id === ppItem); if (thePowerData) { const theMenuId = thePowerData.menu; if (theMenuId) { - const thePow = pow.find(powItem => powItem.menuId === theMenuId); + const thePow = pow.find((powItem) => powItem.menuId === theMenuId); if (thePow) { thePow.powers.push(ppItem); } @@ -686,8 +697,8 @@ const setPowersByRoleIds = ps => { }; // 条件分页查询用户列表 -const getUserList = p => { - const map = users.filter(item => { +const getUserList = (p) => { + const map = users.filter((item) => { let yeah = true; if (p.username && !item.username.includes(p.username)) { yeah = false; @@ -707,16 +718,16 @@ const getUserList = p => { }; }; // 添加用户 -const addUser = p => { +const addUser = (p) => { // const p = JSON.parse(request.body); p.id = ++id_sequence; users.push(p); return { status: 200, data: null, message: "success" }; }; // 修改用户 -const upUser = p => { +const upUser = (p) => { // const p = JSON.parse(request.body); - const oldIndex = users.findIndex(item => item.id === p.id); + const oldIndex = users.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { const news = Object.assign({}, users[oldIndex], p); users.splice(oldIndex, 1, news); @@ -726,9 +737,9 @@ const upUser = p => { } }; // 删除用户 -const delUser = p => { +const delUser = (p) => { // const p = JSON.parse(request.body); - const oldIndex = users.findIndex(item => item.id === p.id); + const oldIndex = users.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { users.splice(oldIndex, 1); return { status: 200, data: null, message: "success" }; @@ -737,9 +748,9 @@ const delUser = p => { } }; // 给用户分配角色 -const setUserRoles = p => { +const setUserRoles = (p) => { // const p = JSON.parse(request.body); - const oldIndex = users.findIndex(item => item.id === p.id); + const oldIndex = users.findIndex((item) => item.id === p.id); if (oldIndex !== -1) { users.splice(oldIndex, 1); return { status: 200, data: null, message: "success" }; diff --git a/package.json b/package.json index 883c534..07eba6b 100644 --- a/package.json +++ b/package.json @@ -24,64 +24,65 @@ }, "dependencies": { "@rematch/core": "^1.4.0", - "antd": "4.0.2", + "antd": "4.5.4", "axios": "^0.19.2", - "core-js": "^3.6.4", + "core-js": "^3.6.5", "history": "^4.10.1", - "lodash": "^4.17.15", + "lodash": "^4.17.20", "normalize.css": "^8.0.1", - "react": "^16.13.0", - "react-dom": "^16.13.0", + "react": "^16.13.1", + "react-dom": "^16.13.1", "react-loadable": "^5.5.0", - "react-redux": "^7.2.0", - "react-router-dom": "^5.1.2", - "react-vcode": "^1.0.4", + "react-redux": "^7.2.1", + "react-router-dom": "^5.2.0", + "react-vcode": "^1.0.7", "redux": "^4.0.5", - "retalk": "^3.2.0" + "retalk": "^3.2.4" }, "devDependencies": { - "@babel/core": "^7.8.7", - "@babel/plugin-proposal-class-properties": "^7.8.3", - "@babel/plugin-proposal-decorators": "^7.8.3", - "@babel/plugin-proposal-nullish-coalescing-operator": "^7.8.3", - "@babel/plugin-proposal-object-rest-spread": "^7.8.3", - "@babel/plugin-proposal-optional-chaining": "^7.8.3", + "@babel/core": "^7.11.1", + "@babel/plugin-proposal-class-properties": "^7.10.4", + "@babel/plugin-proposal-decorators": "^7.10.5", + "@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4", + "@babel/plugin-proposal-object-rest-spread": "^7.11.0", + "@babel/plugin-proposal-optional-chaining": "^7.11.0", "@babel/plugin-syntax-dynamic-import": "^7.8.3", - "@babel/plugin-transform-runtime": "^7.8.3", - "@babel/preset-env": "^7.8.7", - "@babel/preset-react": "^7.8.3", - "@babel/runtime": "^7.8.7", - "antd-dayjs-webpack-plugin": "^0.0.8", - "autoprefixer": "^9.7.4", + "@babel/plugin-transform-runtime": "^7.11.0", + "@babel/preset-env": "^7.11.0", + "@babel/preset-react": "^7.10.4", + "@babel/runtime": "^7.11.2", + "antd-dayjs-webpack-plugin": "^1.0.1", + "autoprefixer": "^9.8.6", "babel-eslint": "^10.1.0", - "babel-loader": "^8.0.6", + "babel-loader": "^8.1.0", "babel-plugin-import": "^1.13.0", "body-parser": "^1.19.0", "clean-webpack-plugin": "^3.0.0", - "css-loader": "^3.4.2", - "eslint": "^6.8.0", - "eslint-loader": "^3.0.3", - "eslint-plugin-prettier": "^3.1.2", - "eslint-plugin-react": "^7.19.0", - "eslint-plugin-react-hooks": "^2.5.0", + "copy-webpack-plugin": "^6.0.3", + "css-loader": "^4.2.1", + "eslint": "^7.6.0", + "eslint-loader": "^4.0.2", + "eslint-plugin-prettier": "^3.1.4", + "eslint-plugin-react": "^7.20.6", + "eslint-plugin-react-hooks": "^4.0.8", "express": "^4.17.1", - "favicons-webpack-plugin": "3.0.1", - "file-loader": "^5.1.0", + "favicons-webpack-plugin": "4.2.0", + "file-loader": "^6.0.0", "happypack": "^5.0.1", - "html-webpack-plugin": "^4.0.0-beta.11", - "less": "^3.11.1", - "less-loader": "^5.0.0", - "mini-css-extract-plugin": "^0.9.0", + "html-webpack-plugin": "^4.3.0", + "less": "^3.12.2", + "less-loader": "^6.2.0", + "mini-css-extract-plugin": "^0.10.0", "mockjs": "^1.1.0", "optimize-css-assets-webpack-plugin": "^5.0.3", "postcss-loader": "^3.0.0", - "prettier": "1.19.1", - "style-loader": "1.1.3", + "prettier": "2.0.5", + "style-loader": "1.2.1", "sw-precache-webpack-plugin": "^1.0.0", - "terser-webpack-plugin": "^2.3.5", - "url-loader": "^3.0.0", - "webpack": "^4.42.0", - "webpack-cli": "^3.3.11", + "terser-webpack-plugin": "^4.1.0", + "url-loader": "^4.1.0", + "webpack": "^4.44.1", + "webpack-cli": "^3.3.12", "webpack-dev-middleware": "^3.7.2", "webpack-hot-middleware": "^2.25.0", "webpackbar": "^4.0.0", diff --git a/src/a_component/Bread/index.js b/src/a_component/Bread/index.js index 2c70330..c768099 100644 --- a/src/a_component/Bread/index.js +++ b/src/a_component/Bread/index.js @@ -7,10 +7,10 @@ import "./index.less"; export default class Com extends React.PureComponent { /** 根据当前location动态生成对应的面包屑 **/ makeBread(location, menus) { - const paths = location.pathname.split("/").filter(item => !!item); + const paths = location.pathname.split("/").filter((item) => !!item); const breads = []; paths.forEach((item, index) => { - const temp = menus.find(v => v.url.replace(/^\//, "") === item); + const temp = menus.find((v) => v.url.replace(/^\//, "") === item); if (temp) { breads.push( {temp.title} diff --git a/src/a_component/CanvasBack/index.js b/src/a_component/CanvasBack/index.js index f47553f..423a3cb 100644 --- a/src/a_component/CanvasBack/index.js +++ b/src/a_component/CanvasBack/index.js @@ -9,7 +9,7 @@ export default class CanvasBack extends React.PureComponent { constructor(props) { super(props); this.state = { - context: null + context: null, }; this.ctx = null; this.dots = []; // 所有的点 @@ -46,7 +46,7 @@ export default class CanvasBack extends React.PureComponent { dx: !!Math.round(this.random(0, 1)), // 当前方向x dy: !!Math.round(this.random(0, 1)), // 当前方向y color: this.random(20, 70), // b通道颜色值 - dcolor: !!Math.round(this.random(0, 1)) // 颜色改变向量 + dcolor: !!Math.round(this.random(0, 1)), // 颜色改变向量 }; this.dots.push(temp); } @@ -105,7 +105,7 @@ export default class CanvasBack extends React.PureComponent { const step_row = height / (row - 2); const step_col = width / (col - 2); - this.dots.forEach(function(item, index) { + this.dots.forEach(function (item, index) { if (item.dx) { // 增 if (item.sx < step_col / 3) { @@ -162,7 +162,7 @@ export default class CanvasBack extends React.PureComponent { render() { return (
- (this.myCanvas = c)} /> + (this.myCanvas = c)} />
); } diff --git a/src/a_component/Header/index.js b/src/a_component/Header/index.js index 7b15568..0604e89 100644 --- a/src/a_component/Header/index.js +++ b/src/a_component/Header/index.js @@ -18,7 +18,7 @@ import { GithubOutlined, ChromeOutlined, LogoutOutlined, - SmileOutlined + SmileOutlined, } from "@ant-design/icons"; import "./index.less"; const { Header } = Layout; @@ -26,7 +26,7 @@ export default class HeaderCom extends React.PureComponent { constructor(props) { super(props); this.state = { - fullScreen: false // 当前是否是全屏状态 + fullScreen: false, // 当前是否是全屏状态 }; } @@ -56,7 +56,7 @@ export default class HeaderCom extends React.PureComponent { } } this.setState({ - fullScreen: true + fullScreen: true, }); }; @@ -79,14 +79,14 @@ export default class HeaderCom extends React.PureComponent { } } this.setState({ - fullScreen: false + fullScreen: false, }); }; /** * 退出登录 * **/ - onMenuClick = e => { + onMenuClick = (e) => { if (e.key === "logout") { // 退出按钮被点击 this.props.onLogout(); diff --git a/src/a_component/Icon/index.js b/src/a_component/Icon/index.js index 990d638..05f0b8d 100644 --- a/src/a_component/Icon/index.js +++ b/src/a_component/Icon/index.js @@ -3,7 +3,7 @@ import React from "react"; import { createFromIconfontCN } from "@ant-design/icons"; const IconFont = createFromIconfontCN({ - scriptUrl: "//at.alicdn.com/t/font_1688075_vwak21i2wxj.js" + scriptUrl: "//at.alicdn.com/t/font_1688075_vwak21i2wxj.js", }); export default class Icon extends React.PureComponent { diff --git a/src/a_component/Menu/index.js b/src/a_component/Menu/index.js index 9a5888b..590916e 100644 --- a/src/a_component/Menu/index.js +++ b/src/a_component/Menu/index.js @@ -23,7 +23,7 @@ export default class MenuCom extends React.PureComponent { sourceData: [], // 菜单数据（层级） treeDom: [], // 生成的菜单结构 chosedKey: [], // 当前选中 - openKeys: [] // 当前需要被展开的项 + openKeys: [], // 当前需要被展开的项 }; } @@ -44,20 +44,20 @@ export default class MenuCom extends React.PureComponent { /** 处理当前选中 **/ nowChosed(location) { - const paths = location.pathname.split("/").filter(item => !!item); + const paths = location.pathname.split("/").filter((item) => !!item); this.setState({ chosedKey: [location.pathname], - openKeys: paths.map(item => `/${item}`) + openKeys: paths.map((item) => `/${item}`), }); } /** 菜单展开和关闭时触发 **/ onOpenChange(keys) { this.setState({ - openKeys: keys + openKeys: keys, }); } - onSelect = e => { + onSelect = (e) => { console.log("被选中：", e); this.props.history.push(e.key); }; @@ -73,7 +73,7 @@ export default class MenuCom extends React.PureComponent { const treeDom = this.makeTreeDom(sourceData, ""); this.setState({ sourceData, - treeDom + treeDom, }); } @@ -82,11 +82,11 @@ export default class MenuCom extends React.PureComponent { let kids; if (!one) { // 第1次递归 - kids = data.filter(item => !item.parent); + kids = data.filter((item) => !item.parent); } else { - kids = data.filter(item => item.parent === one.id); + kids = data.filter((item) => item.parent === one.id); } - kids.forEach(item => (item.children = this.dataToJson(item, data))); + kids.forEach((item) => (item.children = this.dataToJson(item, data))); return kids.length ? kids : null; } @@ -143,7 +143,7 @@ export default class MenuCom extends React.PureComponent { mode="inline" selectedKeys={this.state.chosedKey} {...(this.props.collapsed ? {} : { openKeys: this.state.openKeys })} - onOpenChange={e => this.onOpenChange(e)} + onOpenChange={(e) => this.onOpenChange(e)} onSelect={this.onSelect} > {this.state.treeDom} diff --git a/src/a_component/TreeChose/PowerTreeTable.js b/src/a_component/TreeChose/PowerTreeTable.js index 676af2b..cc41774 100644 --- a/src/a_component/TreeChose/PowerTreeTable.js +++ b/src/a_component/TreeChose/PowerTreeTable.js @@ -21,7 +21,7 @@ export default class TreeTable extends React.PureComponent { sourceData0: [], // 原始数据 - 扁平数据 sourceData: [], // 原始数据 - 层级数据 btnDtoChecked: [], // 受控，所有被选中的btnDto数据 - treeChecked: [] // 受控，所有被选中的表格行 + treeChecked: [], // 受控，所有被选中的表格行 }; } @@ -43,7 +43,7 @@ export default class TreeTable extends React.PureComponent { this.props.onOk && this.props.onOk({ menus: this.state.treeChecked, - powers: this.state.btnDtoChecked + powers: this.state.btnDtoChecked, }); } @@ -73,7 +73,7 @@ export default class TreeTable extends React.PureComponent { sourceData0: data, sourceData, treeChecked, - btnDtoChecked + btnDtoChecked, }); } @@ -82,11 +82,11 @@ export default class TreeTable extends React.PureComponent { let kids; if (!one) { // 第1次递归 - kids = data.filter(item => !item.parent); + kids = data.filter((item) => !item.parent); } else { - kids = data.filter(item => item.parent === one.id); + kids = data.filter((item) => item.parent === one.id); } - kids.forEach(item => { + kids.forEach((item) => { item.children = this.dataToJson(item, data); item.key = item.id; }); @@ -95,7 +95,7 @@ export default class TreeTable extends React.PureComponent { // Dto受控 dtoIsChecked(id) { - return !!this.state.btnDtoChecked.find(item => item === id); + return !!this.state.btnDtoChecked.find((item) => item === id); } // TABLE 字段 makeColumns() { @@ -104,7 +104,7 @@ export default class TreeTable extends React.PureComponent { title: "菜单", dataIndex: "title", key: "title", - width: "30%" + width: "30%", }, { title: "权限", @@ -118,15 +118,15 @@ export default class TreeTable extends React.PureComponent { this.onBtnDtoChange(e, item.id, record)} + onChange={(e) => this.onBtnDtoChange(e, item.id, record)} > {item.title} ); }); } - } - } + }, + }, ]; return columns; } @@ -136,33 +136,33 @@ export default class TreeTable extends React.PureComponent { return { onChange: (selectedRowKeys, selectedRows) => { this.setState({ - treeChecked: selectedRowKeys + treeChecked: selectedRowKeys, }); }, onSelect: (record, selected, selectedRows) => { - const t = this.state.sourceData0.find(item => item.id === record.id); + const t = this.state.sourceData0.find((item) => item.id === record.id); if (selected) { // 选中，连带其权限全部勾选 if (t && Array.isArray(t.powers)) { const temp = Array.from( new Set([ - ...t.powers.map(item => item.id), - ...this.state.btnDtoChecked + ...t.powers.map((item) => item.id), + ...this.state.btnDtoChecked, ]) ); this.setState({ - btnDtoChecked: temp + btnDtoChecked: temp, }); } } else { // 取消选中，连带其权限全部取消勾选 if (t && Array.isArray(t.powers)) { - const mapTemp = t.powers.map(item => item.id); + const mapTemp = t.powers.map((item) => item.id); const temp = this.state.btnDtoChecked.filter( - item => mapTemp.indexOf(item) < 0 + (item) => mapTemp.indexOf(item) < 0 ); this.setState({ - btnDtoChecked: temp + btnDtoChecked: temp, }); } } @@ -173,17 +173,17 @@ export default class TreeTable extends React.PureComponent { this.setState({ // treeChecked: this.state.sourceData0.map((item) => item.id), btnDtoChecked: this.state.sourceData0.reduce((v1, v2) => { - return [...v1, ...v2.powers.map(k => k.id)]; - }, []) + return [...v1, ...v2.powers.map((k) => k.id)]; + }, []), }); } else { this.setState({ // treeChecked: [], - btnDtoChecked: [] + btnDtoChecked: [], }); } }, - selectedRowKeys: this.state.treeChecked + selectedRowKeys: this.state.treeChecked, }; } @@ -200,10 +200,10 @@ export default class TreeTable extends React.PureComponent { console.log("取消啊兄弟", old, id); old.splice(old.indexOf(id), 1); // 判断当前这一行的权限中是否还有被选中的，如果全都没有选中，那当前菜单也要取消选中 - const tempMap = record.powers.map(item => item.id); + const tempMap = record.powers.map((item) => item.id); if ( !this.state.btnDtoChecked.some( - item => item !== id && tempMap.indexOf(item) >= 0 + (item) => item !== id && tempMap.indexOf(item) >= 0 ) ) { treeChecked.splice(treeChecked.indexOf(record.id), 1); @@ -211,7 +211,7 @@ export default class TreeTable extends React.PureComponent { } this.setState({ btnDtoChecked: old, - treeChecked + treeChecked, }); } diff --git a/src/a_component/TreeChose/RoleTree.js b/src/a_component/TreeChose/RoleTree.js index a5d9ae8..3f912d1 100644 --- a/src/a_component/TreeChose/RoleTree.js +++ b/src/a_component/TreeChose/RoleTree.js @@ -19,7 +19,7 @@ export default class RoleTreeComponent extends React.PureComponent { super(props); this.state = { sourceData: [], // 原始数据，有层级关系 - nowKeys: [] // 当前选中的keys + nowKeys: [], // 当前选中的keys }; } @@ -33,7 +33,7 @@ export default class RoleTreeComponent extends React.PureComponent { } if (this.props.defaultKeys !== prevP.defaultKeys) { this.setState({ - nowKeys: this.props.defaultKeys.map(item => `${item}`) + nowKeys: this.props.defaultKeys.map((item) => `${item}`), }); } } @@ -41,14 +41,14 @@ export default class RoleTreeComponent extends React.PureComponent { /** 处理原始数据，将原始数据处理为层级关系 **/ makeSourceData(data) { const d = _.cloneDeep(data); - d.forEach(item => { + d.forEach((item) => { item.key = String(item.id); }); // 按照sort排序 const sourceData = this.dataToJson(null, d) || []; console.log("处理后的数据：", sourceData); this.setState({ - sourceData + sourceData, }); } @@ -57,11 +57,11 @@ export default class RoleTreeComponent extends React.PureComponent { let kids; if (!one) { // 第1次递归 - kids = data.filter(item => !item.parent); + kids = data.filter((item) => !item.parent); } else { - kids = data.filter(item => item.parent === one.id); + kids = data.filter((item) => item.parent === one.id); } - kids.forEach(item => (item.children = this.dataToJson(item, data))); + kids.forEach((item) => (item.children = this.dataToJson(item, data))); return kids.length ? kids : null; } @@ -95,7 +95,7 @@ export default class RoleTreeComponent extends React.PureComponent { /** 点击确定时触发 **/ onOk = () => { // 通过key返回指定的数据 - const res = this.props.data.filter(item => { + const res = this.props.data.filter((item) => { return this.state.nowKeys.includes(`${item.id}`); }); // 返回选中的keys和选中的具体数据 @@ -108,10 +108,10 @@ export default class RoleTreeComponent extends React.PureComponent { }; /** 选中或取消选中时触发 **/ - onCheck = keys => { + onCheck = (keys) => { console.log("onCheck", keys); this.setState({ - nowKeys: keys + nowKeys: keys, }); }; @@ -129,7 +129,7 @@ export default class RoleTreeComponent extends React.PureComponent { checkable selectable={false} checkedKeys={this.state.nowKeys} - onCheck={keys => this.onCheck(keys)} + onCheck={(keys) => this.onCheck(keys)} treeData={this.state.sourceData} > diff --git a/src/a_component/TreeChose/menuChose.js b/src/a_component/TreeChose/menuChose.js index 87d3f16..4ce55c2 100644 --- a/src/a_component/TreeChose/menuChose.js +++ b/src/a_component/TreeChose/menuChose.js @@ -9,7 +9,7 @@ export default class MenuChoseComponent extends React.PureComponent { super(props); this.state = { sourceData: [], // 原始数据，有层级关系 - nowData: undefined // 当前选中的节点信息 + nowData: undefined, // 当前选中的节点信息 }; } @@ -31,7 +31,7 @@ export default class MenuChoseComponent extends React.PureComponent { }); const sourceData = this.dataToJson(null, d) || []; this.setState({ - sourceData + sourceData, }); } @@ -40,11 +40,11 @@ export default class MenuChoseComponent extends React.PureComponent { let kids; if (!one) { // 第1次递归 - kids = data.filter(item => !item.parent); + kids = data.filter((item) => !item.parent); } else { - kids = data.filter(item => item.parent === one.id); + kids = data.filter((item) => item.parent === one.id); } - kids.forEach(item => (item.children = this.dataToJson(item, data))); + kids.forEach((item) => (item.children = this.dataToJson(item, data))); return kids.length ? kids : null; } @@ -68,11 +68,11 @@ export default class MenuChoseComponent extends React.PureComponent { if (e.selected) { // 选中 this.setState({ - nowData: e.node.props.data + nowData: e.node.props.data, }); } else { this.setState({ - nowData: undefined + nowData: undefined, }); } }; diff --git a/src/a_container/ErrorPages/401.js b/src/a_container/ErrorPages/401.js index 493ad69..d011216 100644 --- a/src/a_container/ErrorPages/401.js +++ b/src/a_container/ErrorPages/401.js @@ -6,22 +6,19 @@ import { Button } from "antd"; import "./index.less"; import Img from "@/assets/error.gif"; -@connect( - state => ({}), - dispatch => ({}) -) +@connect((state) => ({}), (dispatch) => ({})) export default class NoPowerContainer extends React.Component { constructor(props) { super(props); this.state = { - show: false + show: false, }; } componentDidMount() { setTimeout(() => this.setState({ - show: true + show: true, }) ); } diff --git a/src/a_container/ErrorPages/404.js b/src/a_container/ErrorPages/404.js index 61beb75..8409b1a 100644 --- a/src/a_container/ErrorPages/404.js +++ b/src/a_container/ErrorPages/404.js @@ -6,22 +6,19 @@ import { Button } from "antd"; import "./index.less"; import Img from "@/assets/error.gif"; -@connect( - state => ({}), - dispatch => ({}) -) +@connect((state) => ({}), (dispatch) => ({})) export default class NotFoundContainer extends React.Component { constructor(props) { super(props); this.state = { - show: false + show: false, }; } componentDidMount() { setTimeout(() => this.setState({ - show: true + show: true, }) ); } diff --git a/src/a_container/Login/index.js b/src/a_container/Login/index.js index f0cc2a7..664aaf1 100644 --- a/src/a_container/Login/index.js +++ b/src/a_container/Login/index.js @@ -18,13 +18,13 @@ import CanvasBack from "@/a_component/CanvasBack"; import LogoImg from "@/assets/logo.png"; @connect( - state => ({}), - dispatch => ({ + (state) => ({}), + (dispatch) => ({ onLogin: dispatch.app.onLogin, setUserInfo: dispatch.app.setUserInfo, getRoleById: dispatch.sys.getRoleById, getPowerById: dispatch.sys.getPowerById, - getMenusById: dispatch.sys.getMenusById + getMenusById: dispatch.sys.getMenusById, }) ) export default class LoginContainer extends React.Component { @@ -35,7 +35,7 @@ export default class LoginContainer extends React.Component { loading: false, // 是否正在登录中 rememberPassword: false, // 是否记住密码 codeValue: "00000", // 当前验证码的值 - show: false // 加载完毕时触发动画 + show: false, // 加载完毕时触发动画 }; } @@ -45,13 +45,13 @@ export default class LoginContainer extends React.Component { if (userLoginInfo) { userLoginInfo = JSON.parse(userLoginInfo); this.setState({ - rememberPassword: true + rememberPassword: true, }); console.log("what:", this.form); this.form.current.setFieldsValue({ username: userLoginInfo.username, - password: tools.uncompile(userLoginInfo.password) + password: tools.uncompile(userLoginInfo.password), }); } if (!userLoginInfo) { @@ -60,7 +60,7 @@ export default class LoginContainer extends React.Component { document.getElementById("vcode").focus(); } this.setState({ - show: true + show: true, }); } @@ -70,7 +70,7 @@ export default class LoginContainer extends React.Component { const values = await this.form.current.validateFields(); this.setState({ loading: true }); this.loginIn(values.username, values.password) - .then(res => { + .then((res) => { console.log("lo:", res); if (res.status === 200) { message.success("登录成功"); @@ -79,7 +79,7 @@ export default class LoginContainer extends React.Component { "userLoginInfo", JSON.stringify({ username: values.username, - password: tools.compile(values.password) // 密码简单加密一下再存到localStorage + password: tools.compile(values.password), // 密码简单加密一下再存到localStorage }) ); // 保存用户名和密码 } else { @@ -97,7 +97,7 @@ export default class LoginContainer extends React.Component { message.error(res.message); } }) - .finally(err => { + .finally((err) => { this.setState({ loading: false }); }); } catch (e) { @@ -137,7 +137,7 @@ export default class LoginContainer extends React.Component { return res2; } - roles = res2.data.filter(item => item.conditions === 1); // conditions: 1启用 -1禁用 + roles = res2.data.filter((item) => item.conditions === 1); // conditions: 1启用 -1禁用 /** 3.根据菜单id 获取菜单信息 **/ const menuAndPowers = roles.reduce( @@ -145,26 +145,26 @@ export default class LoginContainer extends React.Component { [] ); const res3 = await this.props.getMenusById({ - id: Array.from(new Set(menuAndPowers.map(item => item.menuId))) + id: Array.from(new Set(menuAndPowers.map((item) => item.menuId))), }); if (!res3 || res3.status !== 200) { // 查询菜单信息失败 return res3; } - menus = res3.data.filter(item => item.conditions === 1); + menus = res3.data.filter((item) => item.conditions === 1); /** 4.根据权限id，获取权限信息 **/ const res4 = await this.props.getPowerById({ id: Array.from( new Set(menuAndPowers.reduce((a, b) => [...a, ...b.powers], [])) - ) + ), }); if (!res4 || res4.status !== 200) { // 权限查询失败 return res4; } - powers = res4.data.filter(item => item.conditions === 1); + powers = res4.data.filter((item) => item.conditions === 1); console.log("搞笑？"); return { status: 200, data: { userBasicInfo, roles, menus, powers } }; } @@ -172,7 +172,7 @@ export default class LoginContainer extends React.Component { // 记住密码按钮点击 onRemember(e) { this.setState({ - rememberPassword: e.target.checked + rememberPassword: e.target.checked, }); } @@ -181,10 +181,10 @@ export default class LoginContainer extends React.Component { console.log("why:", this.form); setTimeout(() => { this.form.current.setFieldsValue({ - vcode: code // 开发模式自动赋值验证码，正式环境，这里应该赋值'' + vcode: code, // 开发模式自动赋值验证码，正式环境，这里应该赋值'' }); this.setState({ - codeValue: code + codeValue: code, }); }); } @@ -213,8 +213,8 @@ export default class LoginContainer extends React.Component { { required: true, whitespace: true, - message: "请输入用户名" - } + message: "请输入用户名", + }, ]} > this.onVcodeChange(code)} + onChange={(code) => this.onVcodeChange(code)} className="vcode" options={{ - lines: 16 + lines: 16, }} /> @@ -288,7 +288,7 @@ export default class LoginContainer extends React.Component { this.onRemember(e)} + onChange={(e) => this.onRemember(e)} > 记住密码 diff --git a/src/a_container/System/MenuAdmin/index.js b/src/a_container/System/MenuAdmin/index.js index 8761c3e..7655c1c 100644 --- a/src/a_container/System/MenuAdmin/index.js +++ b/src/a_container/System/MenuAdmin/index.js @@ -13,8 +13,26 @@ import "./index.less"; // ================== // 所需的所有组件 // ================== -import { Tree, Button, Table, Tooltip, Popconfirm, Modal, Form, Select, Input, InputNumber, message, Divider } from "antd"; -import { EyeOutlined, ToolOutlined, DeleteOutlined, PlusCircleOutlined } from "@ant-design/icons"; +import { + Tree, + Button, + Table, + Tooltip, + Popconfirm, + Modal, + Form, + Select, + Input, + InputNumber, + message, + Divider, +} from "antd"; +import { + EyeOutlined, + ToolOutlined, + DeleteOutlined, + PlusCircleOutlined, +} from "@ant-design/icons"; import { IconsData } from "@/util/json"; import Icon from "@/a_component/Icon"; const { TreeNode } = Tree; @@ -22,16 +40,16 @@ const { Option } = Select; const { TextArea } = Input; @connect( - state => ({ + (state) => ({ roles: state.sys.roles, powersCode: state.app.powersCode, }), - dispatch => ({ + (dispatch) => ({ addMenu: dispatch.sys.addMenu, getMenus: dispatch.sys.getMenus, upMenu: dispatch.sys.upMenu, delMenu: dispatch.sys.delMenu, - }), + }) ) export default class MenuAdminContainer extends React.Component { constructor(props) { @@ -66,11 +84,14 @@ export default class MenuAdminContainer extends React.Component { }); this.props .getMenus() - .then(res => { + .then((res) => { if (res.status === 200) { this.setState({ data: res.data, - tableData: res.data.filter(item => item.parent === (Number(this.state.treeSelect.id) || null)), + tableData: res.data.filter( + (item) => + item.parent === (Number(this.state.treeSelect.id) || null) + ), }); this.makeSourceData(res.data); } @@ -88,7 +109,7 @@ export default class MenuAdminContainer extends React.Component { /** 处理原始数据，将原始数据处理为层级关系 **/ makeSourceData(data) { const d = _.cloneDeep(data); - d.forEach(item => { + d.forEach((item) => { item.key = String(item.id); }); // 按照sort排序 @@ -106,17 +127,17 @@ export default class MenuAdminContainer extends React.Component { let kids; if (!one) { // 第1次递归 - kids = data.filter(item => !item.parent); + kids = data.filter((item) => !item.parent); } else { - kids = data.filter(item => item.parent === one.id); + kids = data.filter((item) => item.parent === one.id); } - kids.forEach(item => (item.children = this.dataToJson(item, data))); + kids.forEach((item) => (item.children = this.dataToJson(item, data))); return kids.length ? kids : null; } /** 递归构建树结构 **/ makeTreeDom(data) { - return data.map(item => { + return data.map((item) => { if (item.children) { return ( @@ -138,13 +159,15 @@ export default class MenuAdminContainer extends React.Component { } this.setState({ treeSelect, - tableData: this.state.data.filter(item => item.parent === (Number(treeSelect.id) || null)), + tableData: this.state.data.filter( + (item) => item.parent === (Number(treeSelect.id) || null) + ), }); }; /** 工具 - 根据parentID返回parentName **/ - getNameByParentId = id => { - const p = this.state.data.find(item => item.id === id); + getNameByParentId = (id) => { + const p = this.state.data.find((item) => item.id === id); return p ? p.title : undefined; }; @@ -154,7 +177,10 @@ export default class MenuAdminContainer extends React.Component { modalShow: true, nowData: data, operateType: type, - formParent: type === "add" ? { label: undefined, value: undefined } : { label: this.getNameByParentId(data.parent), value: data.parent }, + formParent: + type === "add" + ? { label: undefined, value: undefined } + : { label: this.getNameByParentId(data.parent), value: data.parent }, }); setTimeout(() => { if (type === "add") { @@ -239,9 +265,9 @@ export default class MenuAdminContainer extends React.Component { } /** 删除一条数据 **/ - onDel = record => { + onDel = (record) => { const params = { id: record.id }; - this.props.delMenu(params).then(res => { + this.props.delMenu(params).then((res) => { if (res.status === 200) { this.getData(); this.props.updateUserInfo(); @@ -264,7 +290,7 @@ export default class MenuAdminContainer extends React.Component { title: "图标", dataIndex: "icon", key: "icon", - render: text => { + render: (text) => { return text ? : ""; }, }, @@ -290,13 +316,18 @@ export default class MenuAdminContainer extends React.Component { title: "父级", dataIndex: "parent", key: "parent", - render: text => this.getNameByParentId(text), + render: (text) => this.getNameByParentId(text), }, { title: "状态", dataIndex: "conditions", key: "conditions", - render: (text, record) => (text === 1 ? 启用 : 禁用), + render: (text, record) => + text === 1 ? ( + 启用 + ) : ( + 禁用 + ), }, { title: "操作", @@ -308,29 +339,43 @@ export default class MenuAdminContainer extends React.Component { p.includes("menu:query") && controls.push( - this.onModalShow(record, "see")}> + this.onModalShow(record, "see")} + > - , + ); p.includes("menu:up") && controls.push( - this.onModalShow(record, "up")}> + this.onModalShow(record, "up")} + > - , + ); p.includes("menu:del") && controls.push( - this.onDel(record)}> + this.onDel(record)} + > - , + ); const result = []; controls.forEach((item, index) => { @@ -389,14 +434,20 @@ export default class MenuAdminContainer extends React.Component { defaultExpandedKeys={["0"]} onSelect={this.onTreeSelect} selectedKeys={[String(this.state.treeSelect.id)]} - treeData={this.state.sourceData}> + treeData={this.state.sourceData} + >
  • -
    • @@ -415,11 +466,14 @@ export default class MenuAdminContainer extends React.Component {
{/** 查看&新增&修改用户模态框 **/} this.onOk()} onCancel={this.onClose} - confirmLoading={this.state.modalLoading}> + confirmLoading={this.state.modalLoading} + >
- + ]} + > + - - + + - {IconsData.map((item, index) => { return ( - -