Merge pull request #22 from biaov/hotfix/20231023/permission

修复控制台权限详情不能访问的问题

admin/.vscode/settings.json

@@ -1,3 +1,3 @@
-{
-  "editor.formatOnSave": true
-}
+{
+  "editor.formatOnSave": true
+}

admin/README.md

@@ -4,19 +4,19 @@
 
 ## 安装依赖
 
-```Basic
+```sh
 npm i
 ```
 
 ## 运行项目
 
-```Basic
+```sh
 npm start
 ```
 
 ## 打包项目
 
-```Basic
+```sh
 npm run build
 ```
 

admin/src/App.tsx

@@ -1,17 +1,17 @@
-import React from 'react'
-import { ConfigProvider } from 'antd'
-import dayjs from 'dayjs'
-import 'dayjs/locale/zh-cn'
-import zhCN from 'antd/locale/zh_CN'
-import 'antd/dist/reset.css'
-import RouterView from '@/router'
-
-dayjs.locale('zh-cn')
-
-const App: React.FC = () => (
-  <ConfigProvider locale={zhCN}>
-    <RouterView />
-  </ConfigProvider>
-)
-
-export default App
+import React from 'react'
+import { ConfigProvider } from 'antd'
+import dayjs from 'dayjs'
+import 'dayjs/locale/zh-cn'
+import zhCN from 'antd/locale/zh_CN'
+import 'antd/dist/reset.css'
+import RouterView from '@/router'
+
+dayjs.locale('zh-cn')
+
+const App: React.FC = () => (
+  <ConfigProvider locale={zhCN}>
+    <RouterView />
+  </ConfigProvider>
+)
+
+export default App

admin/src/api/factory.ts

@@ -1,18 +1,18 @@
-import { service } from '@/utils/request'
-import { defaultPageSize } from '@/config'
-import { PagingResponse } from './types'
-
-export const restful = (path: string) => ({
-  paging: <T>(query = {}): Promise<PagingResponse<T>> => service.get(path, { params: { current: 1, pageSize: defaultPageSize, ...query } }),
-  all: <T>(query = {}) => service.get(path, { params: { ...query, all: true } }) as Promise<T>,
-  get: <T>(id: number): Promise<T> => service.get(`${path}/${id}`),
-  create: (data = {}) => service.post(path, data),
-  delete: (id: number) => service.delete(`${path}/${id}`),
-  update: (id: number, data = {}) => service.patch(`${path}/${id}`, data),
-  replace: (id: number, data = {}) => service.put(`${path}/${id}`, data)
-})
-
-export const command = (path: string) => ({
-  get: <T>(query = {}) => service.get(path, { params: query }) as Promise<T>,
-  post: <T>(data = {}, config = {}) => service.post(path, data, config) as Promise<T>
-})
+import { service } from '@/utils/request'
+import { defaultPageSize } from '@/config'
+import { PagingResponse } from './types'
+
+export const restful = (path: string) => ({
+  paging: <T>(query = {}): Promise<PagingResponse<T>> => service.get(path, { params: { current: 1, pageSize: defaultPageSize, ...query } }),
+  all: <T>(query = {}) => service.get(path, { params: { ...query, all: true } }) as Promise<T>,
+  get: <T>(id: number): Promise<T> => service.get(`${path}/${id}`),
+  create: (data = {}) => service.post(path, data),
+  delete: (id: number) => service.delete(`${path}/${id}`),
+  update: (id: number, data = {}) => service.patch(`${path}/${id}`, data),
+  replace: (id: number, data = {}) => service.put(`${path}/${id}`, data)
+})
+
+export const command = (path: string) => ({
+  get: <T>(query = {}) => service.get(path, { params: query }) as Promise<T>,
+  post: <T>(data = {}, config = {}) => service.post(path, data, config) as Promise<T>
+})

admin/src/api/types.ts

@@ -1,10 +1,10 @@
-interface Meta {
-  total: number
-  current: number
-  pageSize: number
-}
-
-export interface PagingResponse<T = Record<string, any>> {
-  meta: Meta
-  items: T[]
-}
+interface Meta {
+  total: number
+  current: number
+  pageSize: number
+}
+
+export interface PagingResponse<T = Record<string, any>> {
+  meta: Meta
+  items: T[]
+}

admin/src/components/page-loading/index.module.less

@@ -1,6 +1,6 @@
-.m-loading {
-  width: 400px;
-  margin: 0 auto;
-  padding: 100px;
-  text-align: center;
+.m-loading {
+  width: 400px;
+  margin: 0 auto;
+  padding: 100px;
+  text-align: center;
 }

admin/src/components/page-loading/index.tsx

@@ -1,13 +1,13 @@
-import { Spin } from 'antd'
-import Styles from './index.module.less'
-
-/**
- * 页面加载组件
- */
-export default function PageLoadingComponent() {
-  return (
-    <div className={Styles['m-loading']}>
-      <Spin tip="加载中..." spinning={true} />
-    </div>
-  )
-}
+import { Spin } from 'antd'
+import Styles from './index.module.less'
+
+/**
+ * 页面加载组件
+ */
+export default function PageLoadingComponent() {
+  return (
+    <div className={Styles['m-loading']}>
+      <Spin tip="加载中..." spinning={true} />
+    </div>
+  )
+}

admin/src/components/rich-text/index.tsx

@@ -1,42 +1,42 @@
-import { useEffect, useState } from 'react'
-import ReactQuill from 'react-quill'
-import 'react-quill/dist/quill.snow.css'
-import type { Props } from './types'
-
-export default function richTextComponent(props: Partial<Props> = {}) {
-  const { value = '', onChange } = props
-  const [richTextValue, setRichTextValue] = useState('')
-
-  useEffect(() => {
-    setRichTextValue(value)
-  }, [])
-
-  const modules = {
-    toolbar: [
-      ['bold', 'italic', 'underline', 'strike'],
-      ['blockquote', 'code-block'],
-
-      [{ header: 1 }, { header: 2 }],
-      [{ list: 'ordered' }, { list: 'bullet' }],
-      [{ script: 'sub' }, { script: 'super' }],
-      [{ indent: '-1' }, { indent: '+1' }],
-      [{ direction: 'rtl' }],
-
-      [{ size: ['small', false, 'large', 'huge'] }],
-      [{ header: [1, 2, 3, 4, 5, 6, false] }],
-
-      [{ color: [] }, { background: [] }],
-      [{ font: [] }],
-      [{ align: [] }],
-
-      ['clean']
-    ]
-  }
-
-  const onChangeRichText = (val: string) => {
-    setRichTextValue(val)
-    onChange && onChange(val)
-  }
-
-  return <ReactQuill placeholder="请输入内容" theme="snow" {...{ richTextValue, modules }} style={{ height: '300px', marginBottom: '43px' }} onChange={onChangeRichText} />
-}
+import { useEffect, useState } from 'react'
+import ReactQuill from 'react-quill'
+import 'react-quill/dist/quill.snow.css'
+import type { Props } from './types'
+
+export default function richTextComponent(props: Partial<Props> = {}) {
+  const { value = '', onChange } = props
+  const [richTextValue, setRichTextValue] = useState('')
+
+  useEffect(() => {
+    setRichTextValue(value)
+  }, [])
+
+  const modules = {
+    toolbar: [
+      ['bold', 'italic', 'underline', 'strike'],
+      ['blockquote', 'code-block'],
+
+      [{ header: 1 }, { header: 2 }],
+      [{ list: 'ordered' }, { list: 'bullet' }],
+      [{ script: 'sub' }, { script: 'super' }],
+      [{ indent: '-1' }, { indent: '+1' }],
+      [{ direction: 'rtl' }],
+
+      [{ size: ['small', false, 'large', 'huge'] }],
+      [{ header: [1, 2, 3, 4, 5, 6, false] }],
+
+      [{ color: [] }, { background: [] }],
+      [{ font: [] }],
+      [{ align: [] }],
+
+      ['clean']
+    ]
+  }
+
+  const onChangeRichText = (val: string) => {
+    setRichTextValue(val)
+    onChange && onChange(val)
+  }
+
+  return <ReactQuill placeholder="请输入内容" theme="snow" {...{ richTextValue, modules }} style={{ height: '300px', marginBottom: '43px' }} onChange={onChangeRichText} />
+}

admin/src/config/sidebar.tsx

@@ -190,7 +190,12 @@ export const items = () => [
       {
         label: '角色权限详情',
         key: '/setting/role-permission',
-        permissions: [],
+        permissions: [
+          {
+            label: '查看角色权限详情',
+            value: '/setting/role-permission/detail'
+          }
+        ],
         hidden: true
       },
       {
@@ -245,5 +250,5 @@ export const itemOptions = items().map(item => ({
 export const allPermission = items().map(item => ({
   ...item,
   value: item.key,
-  children: item.children.filter(chld => !chld.hidden).map(child => ({ ...child, value: child.key, children: child.permissions }))
+  children: item.children.map(child => ({ ...child, value: child.key, children: child.permissions }))
 }))

admin/src/main.tsx

@@ -1,11 +1,11 @@
-import ReactDOM from 'react-dom/client'
-import { Provider } from 'react-redux'
-import App from './App'
-import store from './store'
-import './styles/index.less'
-
-ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
-  <Provider store={store}>
-    <App />
-  </Provider>
-)
+import ReactDOM from 'react-dom/client'
+import { Provider } from 'react-redux'
+import App from './App'
+import store from './store'
+import './styles/index.less'
+
+ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
+  <Provider store={store}>
+    <App />
+  </Provider>
+)

admin/src/router/guard.tsx

@@ -30,7 +30,7 @@ export const CheckPermission = ({ component, ...rest }: Record<string, unknown>)
   const { pathname } = useLocation()
 
   if (permissions) {
-    const hasPermission = permissions.includes('*') || permissions.includes(`${pathname}/list`) || pathname === '/'
+    const hasPermission = permissions.includes('*') || permissions.includes(`${pathname}/list`) || permissions.includes(pathname.replace(/\d+/g, 'detail')) || pathname === '/'
     if (!hasPermission) return <Navigate to="/403" replace />
   }