feat: 权限管理

src/components/base/AppList.vue

@@ -190,24 +190,25 @@ export default {
       let params = this.params
       // 翻页参数设置
       if (this.hasPagination) {
-        params.page = (this.page.currentPage - 1).toString()
-        params.page_size = this.page.size.toString()
+        params.page = this.page.currentPage
+        params.limit = this.page.size
       }
       // 接口请求之前
       if (beforeRequest) {
         params = beforeRequest(params, isReset)
       }
-      // for (const key in params) {
-      //   if (params[key] === '' || params[key] === undefined || params[key] === undefined) {
-      //     delete params[key]
-      //   }
-      // }
+      for (const key in params) {
+        if (params[key] === '' || params[key] === undefined || params[key] === undefined) {
+          delete params[key]
+        }
+      }
       this.loading = true
       httpRequest(params)
         .then(res => {
-          const { data = [], page_info: pageInfo = {} } = res || {}
-          this.page.total = parseInt(pageInfo.total_number || '')
-          this.dataList = callback ? callback(data) : data
+          const data = res.data || {}
+          const { data: list = [], total = 0 } = data
+          this.page.total = total
+          this.dataList = callback ? callback(data) : list
         })
         .catch(() => {
           this.page.total = 0
@@ -277,6 +278,7 @@ export default {
 }
 .table-list-hd {
   display: flex;
+  margin-bottom: 10px;
 }
 .table-list-filter {
   flex: 1;

src/modules/permissions/api.js

+import httpRequest from '@/utils/axios'
+
+/**
+ * 获取权限列表
+ */
+export function getPermissionList(params) {
+  return httpRequest.get('/api/xedu/admin/v1/permissions', { params })
+}
+
+/**
+ * 获取权限详情
+ */
+export function getPermission(params) {
+  return httpRequest.get(`/api/xedu/admin/v1/permission/${params.id}`, { params })
+}
+
+/**
+ * 创建权限
+ */
+export function createPermission(data) {
+  return httpRequest.post('/api/xedu/admin/v1/permission', data)
+}
+
+/**
+ * 修改权限
+ */
+export function updatePermission(data) {
+  return httpRequest.put(`/api/xedu/admin/v1/permission/${data.id}`, data)
+}
+
+/**
+ * 删除权限
+ */
+export function deletePermission(data) {
+  return httpRequest.delete(`/api/xedu/admin/v1/permission/${data.id}`, data)
+}

src/modules/permissions/components/Editform.vue

+<template>
+  <el-dialog :title="title" :close-on-click-modal="false" v-bind="$attrs" v-on="$listeners" width="600px">
+    <el-form ref="form" :model="form" :rules="rules" label-position="top">
+      <el-form-item label="名称" prop="name">
+        <el-input v-model="form.name" clearable></el-input>
+      </el-form-item>
+      <el-form-item label="权限标识" prop="tag">
+        <el-input v-model="form.tag" clearable :disabled="isEdit"></el-input>
+      </el-form-item>
+      <el-form-item label="类型" prop="type">
+        <el-radio-group v-model="form.type" :disabled="isEdit">
+          <el-radio :label="1">菜单权限</el-radio>
+          <el-radio :label="2">按钮权限</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="所属系统" prop="system_tag">
+        <el-radio-group v-model="form.system_tag" :disabled="isEdit">
+          <el-radio :label="1">学校端</el-radio>
+          <el-radio :label="2">教师端</el-radio>
+          <el-radio :label="3">学生端</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="路由" prop="effect_uris">
+        <el-input type="textarea" v-model="form.effect_uris" clearable placeholder="多个请用英文逗号隔开"></el-input>
+      </el-form-item>
+      <el-form-item label="权限描述" prop="desc">
+        <el-input type="textarea" v-model="form.desc" clearable></el-input>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button type="text" @click="onCancel">取消</el-button>&nbsp;&nbsp;
+      <el-button type="primary" size="medium" @click="onPrimary">保存</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+// lodash
+import { createPermission, updatePermission } from '../api.js'
+export default {
+  props: {
+    isEdit: { type: Boolean, default: false },
+    data: { type: Object, default: () => ({}) }
+  },
+  data() {
+    return {
+      form: { parent_id: '0', type: 1, name: '', tag: '', system_tag: '', desc: '', effect_uris: '' },
+      rules: {
+        name: [{ required: true, message: '请输入权限名称', trigger: 'blur' }],
+        tag: [{ required: true, message: '请输入权限唯一标识', trigger: 'blur' }],
+        type: [{ required: true, message: '请选择权限类型', trigger: 'blur' }],
+        system_tag: [{ required: true, message: '请选择所属系统', trigger: 'blur' }]
+      }
+    }
+  },
+  watch: {
+    data: {
+      immediate: true,
+      handler(data) {
+        this.form = Object.assign({}, this.form, data)
+      }
+    }
+  },
+  computed: {
+    title() {
+      return this.isEdit ? '修改权限' : '创建权限'
+    }
+  },
+  methods: {
+    // 取消
+    onCancel() {
+      this.$emit('update:visible', false)
+    },
+    // 确定
+    onPrimary() {
+      this.$refs.form.validate().then(() => {
+        this.isEdit ? this.edit() : this.create()
+      })
+    },
+    // 创建权限
+    create() {
+      createPermission(this.form).then(res => {
+        this.$message.success('创建成功')
+        this.$emit('update:visible', false)
+        this.$emit('success', res.data)
+      })
+    },
+    // 编辑权限
+    edit() {
+      updatePermission(this.form).then(res => {
+        this.$message.success('修改成功')
+        this.$emit('update:visible', false)
+        this.$emit('success', res.data)
+      })
+    }
+  }
+}
+</script>
+
+<style></style>

src/modules/permissions/index.js

+const routes = [
+  {
+    path: '/permissions',
+    component: () => import('@/components/layout/Index.vue'),
+    meta: { title: '权限管理' },
+    children: [{ path: '', component: () => import('./views/List.vue') }]
+  }
+]
+
+export { routes }

src/modules/permissions/views/List.vue

+<template>
+  <app-card>
+    <app-list v-bind="tableOptions" ref="list" row-key="id">
+      <template #header-aside>
+        <el-button type="primary" @click="handleCreate()">创建权限</el-button>
+      </template>
+      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+        <el-tab-pane
+          :label="item.label"
+          :name="item.value"
+          v-for="(item, index) in typeList"
+          :key="index"
+        ></el-tab-pane>
+      </el-tabs>
+      <template v-slot:table-x="{ row }">
+        <el-button type="text" @click="handleCreate(row)">创建子权限</el-button><br />
+        <el-button type="text" @click="handleUpdate(row)">编辑</el-button>
+        <el-button type="text" @click="onRemove(row)">删除</el-button>
+      </template>
+    </app-list>
+    <editform
+      :visible.sync="visible"
+      :isEdit="isEdit"
+      :data="editRaw"
+      @success="handleSuccess"
+      v-if="visible"
+    ></editform>
+  </app-card>
+</template>
+
+<script>
+// 接口
+import { getPermissionList, deletePermission } from '../api'
+
+export default {
+  components: { Editform: () => import('../components/Editform.vue') },
+  data() {
+    return {
+      visible: false,
+      isEdit: false, // 是否是编辑状态
+      editRaw: {}, // 编辑的数据
+      activeName: '',
+      typeList: [
+        { value: '', label: '全部' },
+        { value: '1', label: '菜单' },
+        { value: '2', label: '按钮' }
+      ]
+    }
+  },
+  computed: {
+    // 列表配置
+    tableOptions() {
+      return {
+        hasPagination: false,
+        remote: {
+          httpRequest: getPermissionList,
+          params: { name: '', tag: '', system_tag: '', type: '', is_format: 1 },
+          beforeRequest: this.beforeRequest,
+          callback(data) {
+            return Array.isArray(data) ? data : []
+          }
+        },
+        filters: [
+          { type: 'input', prop: 'name', placeholder: '权限名称' },
+          { type: 'input', prop: 'tag', placeholder: '权限标识' },
+          {
+            type: 'select',
+            prop: 'system_tag',
+            placeholder: '所属系统',
+            options: [
+              { label: '学校端', value: '1' },
+              { label: '教师端', value: '2' },
+              { label: '学生端', value: '3' }
+            ]
+          }
+        ],
+        columns: [
+          { label: '权限名称', prop: 'name' },
+          { label: '权限标识', prop: 'tag' },
+          {
+            label: '所属系统',
+            prop: 'system_tag',
+            computed({ row }) {
+              const map = { 1: '学校端', 2: '教师端', 3: '学生端' }
+              return map[row.system_tag] || row.system_tag
+            }
+          },
+          {
+            label: '类型',
+            prop: 'type',
+            computed({ row }) {
+              const map = { 1: '菜单权限', 2: '按钮权限' }
+              return map[row.type] || row.type
+            }
+          },
+          { label: '权限描述', prop: 'desc' },
+          { label: '操作', slots: 'table-x', align: 'center', width: 150, fixed: 'right' }
+        ]
+      }
+    }
+  },
+  methods: {
+    beforeRequest(params) {
+      params.type = this.activeName === '0' ? '' : this.activeName
+      return params
+    },
+    // tab
+    handleClick() {
+      this.$refs.list.refetch(true)
+    },
+    // 创建成功刷新列表
+    handleSuccess() {
+      this.$refs.list.refetch()
+    },
+    // 创建
+    handleCreate(row) {
+      this.isEdit = false
+      this.editRaw = row ? { parent_id: row.id, type: row.type, system_tag: row.system_tag } : { parent_id: '0' }
+      this.visible = true
+    },
+    // 编辑
+    handleUpdate(row) {
+      this.isEdit = true
+      this.editRaw = row
+      this.visible = true
+    },
+    // 删除
+    onRemove(row) {
+      this.$confirm('权限删除请谨慎操作，确定删除？', '删除权限', {
+        confirmButtonText: '删除',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.handleRemove(row)
+      })
+    },
+    // 删除
+    handleRemove(row) {
+      deletePermission({ id: row.id }).then(res => {
+        this.$message({ type: 'success', message: '删除成功' })
+        this.$refs.list.refetch()
+      })
+    }
+  }
+}
+</script>

src/modules/roles/api.js

@@ -4,64 +4,52 @@ import httpRequest from '@/utils/axios'
  * 获取角色列表
  */
 export function getRoleList(params) {
-  return httpRequest.get(`/api/permissions/admin/v1/${params.app_id}/application/roles`, { params })
+  return httpRequest.get('/api/xedu/admin/v1/roles', { params })
 }
 
 /**
- * 创建角色
+ * 获取角色详情
  */
-export function createRole(data) {
-  return httpRequest.post(`/api/permissions/admin/v1/${data.app_id}/application/role`, data)
+export function getRole(params) {
+  return httpRequest.get(`/api/xedu/admin/v1/role/${params.id}`, { params })
 }
 
 /**
- * 修改角色
+ * 创建角色
  */
-export function updateRole(data) {
-  return httpRequest.put(`/api/permissions/admin/v1/application/${data.id}/role`, data)
+export function createRole(data) {
+  return httpRequest.post('/api/xedu/admin/v1/role', data)
 }
 
 /**
- * 批量删除角色
+ * 修改角色
  */
-export function deleteRoles(data) {
-  return httpRequest.post(`/api/permissions/admin/v1/${data.app_id}/application/batch-delete/roles`, data)
+export function updateRole(data) {
+  return httpRequest.put(`/api/xedu/admin/v1/role/${data.id}`, data)
 }
 
 /**
- * 添加角色用户
- */
-export function addRoleUsers(data) {
-  return httpRequest.post(`/api/permissions/admin/v1/${data.app_id}/application/assign/users-to-role`, data)
-}
-/**
- * 获取角色用户
- */
-export function getRoleUsers(params) {
-  return httpRequest.get(`/api/permissions/admin/v1/${params.app_id}/application/assign/role-users`, { params })
-}
-/**
- * 删除角色用户
+ * 删除角色
  */
-export function deleteRoleUsers(data) {
-  return httpRequest.post(`/api/permissions/admin/v1/${data.app_id}/application/assign/remove-role-users`, data)
+export function deleteRole(data) {
+  return httpRequest.delete(`/api/xedu/admin/v1/role/${data.id}`, data)
 }
 
 /**
  * 获取权限列表
  */
 export function getPermissionList(params) {
-  return httpRequest.get(`/api/permissions/admin/v1/${params.app_id}/application/permissions`, { params })
+  return httpRequest.get(`/api/xedu/admin/v1/${params.app_id}/application/permissions`, { params })
 }
 /**
  * 获取角色所有权限
  */
 export function getRolePermissions(params) {
-  return httpRequest.get(`/api/permissions/admin/v1/${params.app_id}/application/assign/role-permissions`, { params })
+  return httpRequest.get(`/api/xedu/admin/v1/${params.app_id}/application/assign/role-permissions`, { params })
 }
 /**
  * 更新角色权限
  */
 export function updateRolePermissions(data) {
-  return httpRequest.post(`/api/permissions/admin/v1/${data.app_id}/application/assign/permissions-to-role`, data)
+  return httpRequest.post(`/api/xedu/admin/v1/${data.app_id}/application/assign/permissions-to-role`, data)
 }

src/modules/roles/components/Editform.vue

 <template>
   <el-dialog :title="title" :close-on-click-modal="false" v-bind="$attrs" v-on="$listeners" width="500px">
     <el-form ref="form" :model="form" :rules="rules" label-position="top">
-      <el-form-item label="名称" prop="name">
+      <el-form-item label="角色名称" prop="name">
         <el-input v-model="form.name" clearable></el-input>
       </el-form-item>
-      <el-form-item label="唯一标识" prop="tag">
-        <el-input v-model="form.tag" clearable :disabled="isEdit"></el-input>
-      </el-form-item>
-      <el-form-item label="描述" prop="desc">
+      <el-form-item label="角色描述" prop="desc">
         <el-input type="textarea" v-model="form.desc" clearable></el-input>
       </el-form-item>
     </el-form>
@@ -30,7 +27,7 @@ export default {
       form: { name: '', tag: '', desc: '' },
       rules: {
         name: [{ required: true, message: '请输入角色名称', trigger: 'blur' }],
-        tag: [{ required: true, message: '请输入角色唯一标识', trigger: 'blur' }]
+        desc: [{ required: true, message: '请输入角色描述', trigger: 'blur' }]
       }
     }
   },
@@ -47,7 +44,7 @@ export default {
       return this.$store.state.appid
     },
     title() {
-      return this.isEdit ? '修改角色' : '新增角色'
+      return this.isEdit ? '修改角色' : '添加角色'
     }
   },
   methods: {
@@ -61,11 +58,11 @@ export default {
         this.isEdit ? this.edit() : this.create()
       })
     },
-    // 新增角色
+    // 添加角色
     create() {
       const params = Object.assign({ app_id: this.appid }, this.form)
       createRole(params).then(res => {
-        this.$message.success('新增成功')
+        this.$message.success('添加成功')
         this.$emit('update:visible', false)
         this.$emit('success', res.data)
       })

src/modules/roles/views/List.vue

 <template>
   <app-card>
-    <app-list v-bind="tableOptions" ref="list" @selection-change="handleSelectionChange">
+    <app-list v-bind="tableOptions" ref="list">
       <template #header-aside>
         <el-button type="primary" icon="el-icon-plus" @click="handleCreate">添加角色</el-button>
       </template>
       <template v-slot:table-x="{ row }">
         <el-button type="text" @click="handleUpdate(row)">修改</el-button>
+        <el-button type="text" @click="onRemove(row)">删除</el-button>
         <el-button type="text" @click="handlePermission(row)">权限配置</el-button>&nbsp;
       </template>
-      <template #footer>
-        <el-button type="primary" @click="onRemove" :disabled="!multipleSelection.length">删除</el-button>
-      </template>
     </app-list>
     <!-- 创建/编辑 -->
     <editform
@@ -27,7 +25,7 @@
 
 <script>
 // 接口
-import { getRoleList, deleteRoles } from '../api'
+import { getRoleList, deleteRole } from '../api'
 export default {
   components: {
     Editform: () => import('../components/Editform.vue'),
@@ -38,14 +36,10 @@ export default {
       visible: false,
       isEdit: false, // 是否是编辑状态
       editRaw: {}, // 编辑的数据
-      permisssionVisible: false, // 是否显示权限设置
-      multipleSelection: [] // 已选择的数据
+      permisssionVisible: false // 是否显示权限设置
     }
   },
   computed: {
-    appid() {
-      return this.$store.state.appid
-    },
     // 列表配置
     tableOptions() {
       return {
@@ -53,33 +47,17 @@ export default {
           httpRequest: getRoleList,
           params: { app_id: this.$store.state.appid, name: '', tag: '' }
         },
-        filters: [
-          {
-            type: 'input',
-            prop: 'name',
-            placeholder: '角色名称'
-          },
-          {
-            type: 'input',
-            prop: 'tag',
-            placeholder: '角色唯一标识'
-          }
-        ],
+        filters: [{ type: 'input', prop: 'name', placeholder: '角色名称' }],
         columns: [
-          { type: 'selection' },
           { label: '角色名称', prop: 'name' },
-          { label: '标识', prop: 'tag' },
           { label: '角色描述', prop: 'desc' },
+          { label: '创建时间', prop: 'created_at' },
           { label: '操作', slots: 'table-x', align: 'right', width: 200, fixed: 'right' }
         ]
       }
     }
   },
   methods: {
-    // 选择
-    handleSelectionChange(value) {
-      this.multipleSelection = value
-    },
     // 创建成功刷新列表
     handleSuccess() {
       this.$refs.list.refetch()
@@ -102,17 +80,18 @@ export default {
       this.permisssionVisible = true
     },
     // 删除
-    onRemove() {
-      this.$confirm('角色删除请谨慎操作，确定删除？', '删除角色', {
+    onRemove(row) {
+      this.$confirm('删除该角色后，已绑定该角色的账号将失效', '删除角色', {
         confirmButtonText: '删除',
         cancelButtonText: '取消',
         type: 'warning'
-      }).then(this.handleRemove)
+      }).then(() => {
+        this.handleRemove(row)
+      })
     },
     // 删除
-    handleRemove() {
-      const ids = this.multipleSelection.map(item => item.id)
-      deleteRoles({ app_id: this.appid, ids: JSON.stringify(ids) }).then(res => {
+    handleRemove(row) {
+      deleteRole({ id: row.id }).then(res => {
         this.$message({ type: 'success', message: '删除成功' })
         this.$refs.list.refetch()
       })

src/modules/school/api.js

@@ -4,33 +4,33 @@ import httpRequest from '@/utils/axios'
  * 获取机构列表
  */
 export function getOrgList(params) {
-  return httpRequest.get('/admin/v1/organization', { params })
+  return httpRequest.get('/api/xedu/admin/v1/organization', { params })
 }
 
 /**
  * 获取机构详情
  */
 export function getOrg(params) {
-  return httpRequest.get(`/admin/v1/organization/${params.id}`, { params })
+  return httpRequest.get(`/api/xedu/admin/v1/organization/${params.id}`, { params })
 }
 
 /**
  * 创建机构
  */
 export function createOrg(data) {
-  return httpRequest.post('/api/permissions/admin/v1/organization', data)
+  return httpRequest.post('/api/xedu/admin/v1/organization', data)
 }
 
 /**
  * 修改机构
  */
 export function updateOrg(data) {
-  return httpRequest.put(`/admin/v1/organization/${data.id}`, data)
+  return httpRequest.put(`/api/xedu/admin/v1/organization/${data.id}`, data)
 }
 
 /**
  * 删除机构
  */
 export function deleteOrg(data) {
-  return httpRequest.delete(`/admin/v1/organization/${data.id}`, data)
+  return httpRequest.delete(`/api/xedu/admin/v1/organization/${data.id}`, data)
 }

vite.config.js

@@ -14,7 +14,7 @@ export default defineConfig({
       cert: fs.readFileSync(path.join(__dirname, './https/dev.ezijing.com.pem'))
     },
     proxy: {
-      '/api': 'https://x-school2.ezijing.com'
+      '/api': 'https://x-school-admin2.ezijing.com'
     }
   },
   resolve: {