fix:联调成员新增接口
This commit is contained in:
@@ -36,6 +36,7 @@
|
||||
value-key="id"
|
||||
v-select-more="handleLoadMore"
|
||||
@change="changeMember"
|
||||
popper-class="standard-select-dropdown-height"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in selectOptions"
|
||||
@@ -73,7 +74,7 @@
|
||||
</el-select>
|
||||
</div>
|
||||
<el-scrollbar
|
||||
height="calc(100vh - 216px)"
|
||||
height="calc(100vh - 220px)"
|
||||
@end-reached="loadMoreList"
|
||||
ref="listRef"
|
||||
>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { ref, shallowRef, computed, watch } from 'vue';
|
||||
|
||||
export function useLocalManager<T>(initialDataGetter: () => T[], pageSize = 20) {
|
||||
// 1. 全量数据池(使用 shallowRef 保证 1W 条数据操作不卡顿)
|
||||
// 1. 全量数据池
|
||||
const fullData = shallowRef<T[]>([]);
|
||||
|
||||
// 2. 内部展示条数
|
||||
@@ -10,10 +10,18 @@ export function useLocalManager<T>(initialDataGetter: () => T[], pageSize = 20)
|
||||
// 3. 监听初始数据的变化(处理后端异步返回)
|
||||
watch(initialDataGetter, (newVal) => {
|
||||
if (Array.isArray(newVal)) {
|
||||
fullData.value = [...newVal];
|
||||
displayCount.value = pageSize;
|
||||
// 全量去重,确保内部池子纯净
|
||||
const map = new Map();
|
||||
newVal.forEach(item => { if((item as any).id) map.set((item as any).id, item) });
|
||||
const uniqueData = Array.from(map.values()) as T[];
|
||||
|
||||
fullData.value = uniqueData;
|
||||
// 如果数据被删减到小于当前水位,重置水位
|
||||
if (uniqueData.length < displayCount.value) {
|
||||
displayCount.value = Math.max(pageSize, uniqueData.length);
|
||||
}
|
||||
}, { immediate: true });
|
||||
}
|
||||
}, { immediate: true,deep:true });
|
||||
|
||||
// 4. 切片数据(UI 渲染对象)
|
||||
const displayData = computed(() => {
|
||||
@@ -28,22 +36,10 @@ export function useLocalManager<T>(initialDataGetter: () => T[], pageSize = 20)
|
||||
displayCount.value += pageSize;
|
||||
};
|
||||
|
||||
// 移除
|
||||
const remove = (id: string | number, key = 'id') => {
|
||||
fullData.value = fullData.value.filter(item => (item as any)[key] !== id);
|
||||
};
|
||||
|
||||
// 新增
|
||||
const add = (item: T) => {
|
||||
fullData.value = [item, ...fullData.value];
|
||||
};
|
||||
|
||||
return {
|
||||
fullData,
|
||||
displayData,
|
||||
displayCount,
|
||||
loadMore,
|
||||
noMore,
|
||||
remove,
|
||||
add
|
||||
};
|
||||
}
|
||||
@@ -27,7 +27,7 @@
|
||||
.permission-scroll-area{
|
||||
padding: 0 var(--common-padding);
|
||||
box-sizing: border-box;
|
||||
height: calc(100vh - 190px); //设置固定的高度
|
||||
height: calc(100vh - 194px); //设置固定的高度
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@@ -66,7 +66,7 @@
|
||||
|
||||
.permission-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.row-label {
|
||||
|
||||
@@ -27,7 +27,6 @@
|
||||
</div>
|
||||
</template>
|
||||
</stageBreadcrumbs>
|
||||
<template v-if="[1, 2].includes(activeTab)">
|
||||
<!-- 表格 -->
|
||||
<CommonTable
|
||||
ref="tableRef"
|
||||
@@ -66,9 +65,6 @@
|
||||
>
|
||||
</template>
|
||||
</CommonTable>
|
||||
</template>
|
||||
<!-- 前线配置模块内容 -->
|
||||
<template v-else> 权限配置模块 </template>
|
||||
</div>
|
||||
|
||||
<!-- 成员管理 -->
|
||||
@@ -105,9 +101,10 @@ import {
|
||||
enableRole,
|
||||
disableRole,
|
||||
getRoleMemberList,
|
||||
copyRolePermission
|
||||
copyRolePermission,
|
||||
batchSaveRole
|
||||
} from "@/api/stage/permission/index.ts";
|
||||
import { useLocalManager } from '@/hooks/useLocalManager';
|
||||
import { useLocalManager } from "@/hooks/useLocalManager";
|
||||
defineOptions({ name: "PermissionManagement" });
|
||||
const activeTab = ref(1);
|
||||
const tableRef = ref(null);
|
||||
@@ -119,6 +116,7 @@ const showMember = ref(false);
|
||||
const showRoles = ref(false);
|
||||
const detailId = ref("");
|
||||
const showPermission = ref(false);
|
||||
const selectMember = ref({}); //当前选择的成员数量数据
|
||||
const tabList = [
|
||||
{
|
||||
label: "角色与权限",
|
||||
@@ -126,14 +124,8 @@ const tabList = [
|
||||
},
|
||||
];
|
||||
|
||||
const {
|
||||
fullData,
|
||||
displayData,
|
||||
loadMore,
|
||||
noMore,
|
||||
remove,
|
||||
add
|
||||
} = useLocalManager(()=>memberList.value);
|
||||
const { fullData, displayData, loadMore, noMore, remove, add } =
|
||||
useLocalManager(() => memberList.value);
|
||||
|
||||
const roleColumns = [
|
||||
{
|
||||
@@ -229,7 +221,7 @@ const roleColumns = [
|
||||
ElMessage.success("复制成功");
|
||||
tableRef.value.refresh();
|
||||
} catch (error) {
|
||||
console.log('copy error',error);
|
||||
console.log("copy error", error);
|
||||
}
|
||||
},
|
||||
},
|
||||
@@ -286,12 +278,24 @@ const tableColumns = computed(() => {
|
||||
// 当前成员数量
|
||||
const addMember = (row) => {
|
||||
showMember.value = true;
|
||||
selectMember.value = row;
|
||||
getMemberList({ id: row.id });
|
||||
};
|
||||
|
||||
// 保存成员数量
|
||||
const handleSaveMember = async () => {
|
||||
console.log("保存成员数量",memberList.value);
|
||||
const handleSaveMember = async (row) => {
|
||||
const { id } = selectMember.value;
|
||||
const userIds = memberList.value.map((item) => item.id);
|
||||
try {
|
||||
await batchSaveRole(id,{userIds})
|
||||
ElMessage.success("保存成功");
|
||||
const currentRow = dataList.value.find(item => item.id === id);
|
||||
if (currentRow) {
|
||||
currentRow.memberCount = memberList.value.length;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log('batch save error',error);
|
||||
}
|
||||
};
|
||||
|
||||
// 刷新列表
|
||||
@@ -332,17 +336,12 @@ const getTableData = async (params) => {
|
||||
}
|
||||
};
|
||||
|
||||
// TODO: 后面会修改成全部获取获取成员角色列表 (分页获取)
|
||||
// 后面会修改成全部获取获取成员角色列表
|
||||
const getMemberList = async (params) => {
|
||||
// 获取成员角色列表
|
||||
const queryParams = {
|
||||
roleId: "",
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await getRoleMemberList(params.id);
|
||||
memberList.value = res.records;
|
||||
const response = await getRoleMemberList(params.id);
|
||||
memberList.value = response;
|
||||
} catch (error) {
|
||||
console.log("error", error);
|
||||
}
|
||||
|
||||
@@ -195,3 +195,9 @@
|
||||
--el-overlay-color-lighter: rgba(0, 0, 0, .12);
|
||||
backdrop-filter: blur(8px);
|
||||
}
|
||||
|
||||
.standard-select-dropdown-height{
|
||||
.el-select-dropdown__wrap{
|
||||
min-height: 240px;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user