权限管理添加用户查询和组长权限配置接口调用

src/api/demo.ts

@@ -1,13 +0,0 @@
-import request from '../utils/request.js'
-
-let teacherPrefix = import.meta.env.VITE_API_TEACHER_PRE 
-
-
-// 查询课程列表数据接口（课程列表页面）
-export const getXXX = (data:any) => {
-    return request({
-        url: `${teacherPrefix}/xxx`,
-        method: 'post',
-        data
-    })
-}

src/api/groupManage.ts

@@ -11,7 +11,8 @@ export const getAllUserApi = (params:any) => {
     })
 }
 
-// 分组管理操作
+/**分组管理操作*/
+
 // 分组列表查询接口
 export const getGroupListApi = () => {
     return request({

src/api/userPrivilegeManagement.ts

@@ -0,0 +1,42 @@
+// src/api/login.ts
+import request from '../utils/request.js'
+let adminPrefix = import.meta.env.VITE_API_ADMIN_PRE
+
+// 查询所有用户
+export const getAllRoleUserApi = (params:any) => {
+    return request({
+        url: `${adminPrefix}/api/v1/role/users/list`,
+        method: 'get',
+        params
+    })
+}
+
+/** 用户角色配置 操作 */
+
+// 获取人员权限角色配置信息
+export const getUserRoleConfigApi = () => {
+    return request({
+        url: `${adminPrefix}/api/v1/role/tableData`,
+        method: 'get',
+    })
+}
+
+// 设置角色用户数据接口
+export const addUserRoleConfigApi = (data:any) => {
+    return request({
+        url: `${adminPrefix}/api/v1/role/userAdd`,
+        method: 'post',
+        data
+    })
+}
+
+// 删除角色用户数据接口
+export const deleteUserRoleConfigApi = (id:any) => {
+    return request({
+        url: `${adminPrefix}/api/v1/role/userDel/${id}`,
+        method: 'post',
+    })
+}
+
+
+/** 用户角色配置查询操作 */

src/views/userPrivilegeManagement/groupManage/index.vue

@@ -135,10 +135,6 @@ import {
 
 } from '@/api/groupManage'
 
-import {
-    getProvinceConfigListApi,
-} from '@/api/parameterConfig'
-
 import { ElMessage } from 'element-plus';
 /**
  * 1. 左侧 员工相关信息及操作
@@ -190,10 +186,8 @@ const HandleSearchChange = async (params,key)=>{
  */
 // 分组信息
 const isConfigMode = ref(false)
-const defaultProvince = ref('beijing')
-
+const defaultProvince = ref('')
 const filterGroupTableColumns = ref([...groupTableColumns.value])
-
 const groupPeopleTableData = ref([]) //分组人员表格配置
 
 

src/views/userPrivilegeManagement/permissionManage/index.vue

@@ -17,7 +17,9 @@
                 <div class="search_content">
                     <div class="content_left">
                         <TabSearch :tabList="roleList" 
-                            :defaultTabKey="defaultRole" tabType="line" />
+                            :defaultTabKey="defaultRole" 
+                            tabType="line" 
+                            @tabChange="HandleRoleTabChange"/>
                     </div>
                     <div class="content_right">
                         <span v-if="isConfigMode" class="config_switch_desc">
@@ -29,23 +31,65 @@
                 </div>
             </div>
             <div class="page_jg_20" />
-            <Table :tableColumns="tableColumns" :tableData="groupPeopleTableData">
-                 <template v-for="column in tableColumns.slice(1)" :key="column.name"   v-slot:[column.name]="{row}"> 
-                    <div class="cell_container" @click="HandleAddUser(row, column.name)">
 
-                        <template v-if="row?.[column.name] && row?.[column.name]?.length > 0">
-                            <template v-for="(user,idx) in row?.[column.name]">
+            <!-- 组长配置列表 -->
+            <Table  v-if="defaultRole === '2'"
+                :tableColumns="groupTableColumns" 
+                :tableData="groupPeopleTableData" 
+                :hidePagination="true">
+
+                <template #region="{row}">
+                    {{ row.region.name }}
+                </template>
+
+                <template #groupLeader="{row}">
+                    <div class="cell_container" @click="HandleAddUser(row, 'groupLeader')">
+                        <template v-if="row?.groupLeader && row?.groupLeader?.length > 0">
+                            <template v-for="(user,idx) in row?.groupLeader">
                                 <el-tooltip
                                     effect="dark"
-                                    :content="`${user.name}`"
+                                    :content="`${user.userName}`"
                                     placement="top-start"
                                 >
                                     <div v-if="isConfigMode" class="teacher_tag">
-                                        <span :title="user.name">{{ user.name }}</span>
-                                        <el-icon class="delete_icon" @click.stop="HandleRemoveUser(row, column.name, idx,'administrative')"><Close /></el-icon>
+                                        <span :title="user.userName">{{ user.userName }}</span>
+                                        <el-icon class="delete_icon" @click.stop="HandleRemoveUser(row, 'groupLeader', idx)"><Close /></el-icon>
                                     </div>
                                     <div v-else class="disabled_teacher">
-                                        <span :title="user.name">{{ user.name}}</span>
+                                        <span :title="user.userName">{{ user.userName}}</span>
+                                    </div>
+                                </el-tooltip>
+                            </template>
+                        </template>
+                        <template v-else>
+                            <span v-if="isConfigMode" class="placeholder_text" >请选择员工</span>
+                            <span v-else>-</span>
+                        </template>
+                  </div>
+                </template>
+            </Table>
+
+            <!-- 管理员配置列表 -->
+             <Table v-if="defaultRole === '1'" 
+                :tableColumns="managerConfigTableColumns" 
+                :tableData="managerConfigTableData"
+                :hidePagination="true">
+
+                <template #people="{row}">
+                    <div class="cell_container" @click="HandleAddUser(row, 'people')">
+                        <template v-if="row?.people && row?.people?.length > 0">
+                            <template v-for="(user,idx) in row?.people">
+                                <el-tooltip
+                                    effect="dark"
+                                    :content="`${user.userName}`"
+                                    placement="top-start"
+                                >
+                                    <div v-if="isConfigMode" class="teacher_tag">
+                                        <span :title="user.userName">{{ user.userName }}</span>
+                                        <el-icon class="delete_icon" @click.stop="HandleRemoveUser(row, 'people', idx)"><Close /></el-icon>
+                                    </div>
+                                    <div v-else class="disabled_teacher">
+                                        <span :title="user.userName">{{ user.userName}}</span>
                                     </div>
                                 </el-tooltip>
                             </template>
@@ -64,33 +108,37 @@
 
 
 <script setup lang="ts">
-import { ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import FormSearchGroup from '@/baseComponents/FormSearchGroup.vue';
 import {accountFormSearhList} from './formSearch'
 import Table from '@/baseComponents/Table.vue';
 import TabSearch from '@/baseComponents/TabSearch.vue';
 
-import {tableColumns,userTableColumns} from './table'
-import {roleList} from './tabSearch'
+import {groupTableColumns,userTableColumns,
+        managerConfigTableColumns} from './table'
+import {
+    getAllRoleUserApi,
+    getUserRoleConfigApi,
+    
+    addUserRoleConfigApi,
+    deleteUserRoleConfigApi,
+} from '@/api/userPrivilegeManagement'
 
+import { getCityGroupPeopleListApi,deleteCityGroupPeopleApi,
+    getGroupDataApi,getGroupListApi,
+ } from '@/api/groupManage';
 
-// 员工账号信息
-const userAccountData = ref([
-    {
-        account:'xxx',
-        name:'xx',
-        id:'1',
-    },
-    {
-        account:'xxx',
-        name:'xx2',
-        id:'2',
-    },
-])
 
+// 员工账号信息
+const userAccountData = ref([])
 // 分组信息
 const isConfigMode = ref(false)
-const defaultRole = ref('projectLeader')
+const defaultRole = ref('')
+
+// 所有角色下的分组人员配置
+const allRoleGroupPeopleData = ref([])
+
+// 当前角色下的 分组人员配置
 const groupPeopleTableData = ref([
      {
         id:'1',
@@ -103,6 +151,22 @@ const groupPeopleTableData = ref([
         project1:[],
     },
 ])
+// 管理员配置列表
+const managerConfigTableData = ref([
+    
+])
+
+
+const roleList = computed(()=>{
+    let roleTabOpt = allRoleGroupPeopleData.value.map(item=>{
+        return  {
+            label:item.roleName,
+            key:item.roleId,
+        }
+    }) || []
+    defaultRole.value = roleTabOpt?.[0]?.key
+    return roleTabOpt
+})
 
 const selectedUser = ref()
 
@@ -116,7 +180,7 @@ const tableRowClassName = ({row,rowIndex})=>{
 const HandleSelectUser = (user) => {
   selectedUser.value = {
     id:user.id,
-    name:user.name,
+    name:user.username,
     account:user.account,
   };
 };
@@ -126,17 +190,33 @@ const HandleAddUser = async (row, cell) => {
     if (!isConfigMode.value) return;
     if (!selectedUser.value) return;
 
-    let teacherMsg = { 
-        id: selectedUser.value?.id, 
-        name: selectedUser.value?.name,
-        account:selectedUser.value?.account 
+    // 管理员 和组长的传参区分
+
+    let params = {
+        roleId: defaultRole.value,
+        userId: selectedUser.value.id,
+        groupId: row.region.id
     }
-    if (!row[cell]) {
-        row[cell] = [];
+    let res = await addUserRoleConfigApi(params)
+    if(res?.code == 200){
+
+        // 返回结果待完善————
+        let teacherMsg = { 
+            id: selectedUser.value?.id, 
+            userName: selectedUser.value?.name,
+            account:selectedUser.value?.account 
+        }
+        if (!row[cell]) {
+            row[cell] = [];
+        }
+        console.log('row.cell',row[cell])
+        row[cell].push(teacherMsg)
+
+
     }
-    console.log('row.cell',row[cell])
-    row[cell].push(teacherMsg)
 
+
+   
     // let res = await saveTeachingRelationshipApi({
     //     ...teacherMsg,
     //     evaluationId:route.query.id,
@@ -153,7 +233,7 @@ const HandleAddUser = async (row, cell) => {
 
 
 // 移除员工
-const HandleRemoveUser = async (row, cell, index,type) => {
+const HandleRemoveUser = async (row, cell, index) => {
     if (!isConfigMode.value) return;
     let id = null
     let res = undefined
@@ -169,6 +249,70 @@ const HandleRemoveUser = async (row, cell, index,type) => {
     // }
 };
 
+// 获取所有员工列表
+const GetAllUserList = async ()=>{
+    let params = {
+        username:''
+    }
+    let res = await getAllRoleUserApi(params)
+    if(res?.code == 200){
+        userAccountData.value = res.data
+    }
+}
+
+// 获取员工的权限配置列表
+const GetUserRoleConfigApi = async ()=>{
+    let res = await getUserRoleConfigApi()
+    if(res?.code ==200){
+        allRoleGroupPeopleData.value = res?.data || []
+
+        res?.data.map(item=>{
+            // 管理员
+            if(item.roleId === '1'){
+                let rolePeople =  item.userData.map(user=>{
+                    return {
+                        id:user.id,
+                        userName:user.userName,
+                        account:user.account,
+                    }
+                })
+                managerConfigTableData.value =[{
+                    role:item.roleName,
+                    people:rolePeople
+                }]
+
+            // 组长
+            }else if(item.roleId === '2'){
+
+                // 所有的人员配置列表
+                // item.userData
+                // 待完善
+                // 人物赋值
+                groupPeopleTableData.value = item.groupData.map(item=>{
+                    return {
+                        region:{
+                            id:item.id,
+                            name:item.title
+                        },
+                        groupLeader:[]
+                    }
+                })
+            }
+        })
+    }
+}
+
+
+// 处理角色切换
+const HandleRoleTabChange = (val)=>{
+    console.log('当前选中的值',val)
+    defaultRole.value = val
+}
+
+onMounted(async()=>{
+   await GetAllUserList()
+   await GetUserRoleConfigApi()
+})
 
 </script>
 

src/views/userPrivilegeManagement/permissionManage/tabSearch.ts

@@ -1,13 +0,0 @@
-import { ref } from "vue";
-
-
-export const  roleList = ref([
-    {
-        label:'项目组长',
-        key:'projectLeader',
-    },
-    {
-        label:'管理员',
-        key:'manager',
-    },
-])

src/views/userPrivilegeManagement/permissionManage/table.ts

@@ -13,7 +13,7 @@ export const userTableColumns = ref([
         custom:false,
     },
     {
-        name:'name',
+        name:'username',
         label:'姓名',
         width:'80',
         fixed:'',
@@ -25,10 +25,35 @@ export const userTableColumns = ref([
 
 
 // 动态变更项 ————
-export const tableColumns = ref([
+// 组长配置项列表
+export const groupTableColumns = ref([
     {
-        name: 'region', // 对应“项目组”列，通常作为行头
-        label: '项目组(分组名称)',
+        name: 'region', 
+        label: '项目组',
+        width: '80',
+        fixed: 'left', 
+        align: 'center',
+        minWidth: '',
+        custom: true,
+    },
+    {
+        name: 'groupLeader',
+        label: '项目组长',
+        width: '320',
+        fixed: '',
+        align: 'left',
+        minWidth: '',
+        custom: true,
+    },
+   
+]);
+
+
+// 管理员配置项列表
+export const managerConfigTableColumns = ref([
+    {
+        name: 'role', // 对应“项目组”列，通常作为行头
+        label: '角色',
         width: '80',
         fixed: 'left', // 建议固定首列，防止横向滚动时看不清区域
         align: 'center',
@@ -36,8 +61,8 @@ export const tableColumns = ref([
         custom: false,
     },
     {
-        name: 'project1',
-        label: '项目组长',
+        name: 'people',
+        label: '人员',
         width: '320',
         fixed: '',
         align: 'left',
@@ -45,4 +70,4 @@ export const tableColumns = ref([
         custom: true,
     },
    
-]);
+]);