mirror of
https://github.com/1Panel-dev/MaxKB.git
synced 2025-12-26 01:33:05 +00:00
团队管理优化
This commit is contained in:
parent
78e372fa21
commit
3450847ccc
|
|
@ -1,50 +1,56 @@
|
|||
<template>
|
||||
<el-input v-model="filterText" placeholder="搜索" prefix-icon="Search" class="mb-16" />
|
||||
|
||||
<el-table :data="data" :max-height="tableHeight">
|
||||
<el-table-column prop="name" :label="isApplication ? '应用名称' : '数据集名称'">
|
||||
<template #default="{ row }">
|
||||
<div class="flex align-center">
|
||||
<AppAvatar
|
||||
v-if="isApplication"
|
||||
:name="row.name"
|
||||
pinyinColor
|
||||
class="mr-12"
|
||||
shape="square"
|
||||
:size="24"
|
||||
/>
|
||||
<AppAvatar v-else-if="isDataset" class="mr-12" shape="square" :size="24">
|
||||
<img src="@/assets/icon_document.svg" style="width: 58%" alt="" />
|
||||
</AppAvatar>
|
||||
<span class="ellipsis-1"> {{ row?.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="管理" align="center" width="60">
|
||||
<!-- <template #header>
|
||||
<el-input
|
||||
v-model="filterText"
|
||||
placeholder="搜索"
|
||||
prefix-icon="Search"
|
||||
class="p-24 pt-0 pb-0 mb-16 mt-4"
|
||||
/>
|
||||
<div class="p-24 pt-0">
|
||||
<el-table :data="data" :max-height="tableHeight">
|
||||
<el-table-column prop="name" :label="isApplication ? '应用名称' : '数据集名称'">
|
||||
<template #default="{ row }">
|
||||
<div class="flex align-center">
|
||||
<AppAvatar
|
||||
v-if="isApplication"
|
||||
:name="row.name"
|
||||
pinyinColor
|
||||
class="mr-12"
|
||||
shape="square"
|
||||
:size="24"
|
||||
/>
|
||||
<AppAvatar v-else-if="isDataset" class="mr-12" shape="square" :size="24">
|
||||
<img src="@/assets/icon_document.svg" style="width: 58%" alt="" />
|
||||
</AppAvatar>
|
||||
<span class="ellipsis-1"> {{ row?.name }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="管理" align="center" width="60">
|
||||
<!-- <template #header>
|
||||
<el-checkbox
|
||||
v-model="allChecked[MANAGE]"
|
||||
label="管理"
|
||||
@change="handleCheckAllChange($event, MANAGE)"
|
||||
/>
|
||||
</template> -->
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.operate[MANAGE]" @change="checkedOperateChange(MANAGE, row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="使用" align="center" width="60">
|
||||
<!-- <template #header>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.operate[MANAGE]" @change="checkedOperateChange(MANAGE, row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="使用" align="center" width="60">
|
||||
<!-- <template #header>
|
||||
<el-checkbox
|
||||
v-model="allChecked[USE]"
|
||||
label="使用"
|
||||
@change="handleCheckAllChange($event, USE)"
|
||||
/>
|
||||
</template> -->
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.operate[USE]" @change="checkedOperateChange(USE, row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<template #default="{ row }">
|
||||
<el-checkbox v-model="row.operate[USE]" @change="checkedOperateChange(USE, row)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, computed } from 'vue'
|
||||
|
|
@ -56,7 +62,8 @@ const props = defineProps({
|
|||
default: () => []
|
||||
},
|
||||
id: String,
|
||||
type: String
|
||||
type: String,
|
||||
tableHeight: Number
|
||||
})
|
||||
|
||||
const isDataset = computed(() => props.type === DATASET)
|
||||
|
|
@ -68,8 +75,6 @@ const allChecked: any = ref({
|
|||
[USE]: false
|
||||
})
|
||||
|
||||
const tableHeight = ref(0)
|
||||
|
||||
const filterText = ref('')
|
||||
|
||||
watch(
|
||||
|
|
@ -113,12 +118,6 @@ function compare(attrs: string | number) {
|
|||
}
|
||||
|
||||
onMounted(() => {
|
||||
tableHeight.value = window.innerHeight - 300
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
tableHeight.value = window.innerHeight - 300
|
||||
})()
|
||||
}
|
||||
Object.keys(allChecked.value).map((item) => {
|
||||
allChecked.value[item] = compare(item)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -40,21 +40,26 @@
|
|||
</common-list>
|
||||
</div>
|
||||
<div class="permission-setting flex" v-loading="rLoading">
|
||||
<div class="team-manage__table p-24">
|
||||
<h4>权限设置</h4>
|
||||
<div class="team-manage__table">
|
||||
<h4 class="p-24 pb-0 mb-4">权限设置</h4>
|
||||
<el-tabs v-model="activeName" class="team-manage__tabs">
|
||||
<el-tab-pane
|
||||
v-for="item in settingTags"
|
||||
v-for="(item, index) in settingTags"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:name="item.value"
|
||||
>
|
||||
<PermissionSetting :data="item.data" :type="item.value"></PermissionSetting>
|
||||
<PermissionSetting
|
||||
:key="index"
|
||||
:data="item.data"
|
||||
:type="item.value"
|
||||
:tableHeight="tableHeight"
|
||||
></PermissionSetting>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
|
||||
<div class="team-manage__footer border-t p-16 flex">
|
||||
<div class="submit-button">
|
||||
<el-button type="primary" @click="submitPermissions">保存</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -81,6 +86,7 @@ const currentUser = ref<String>('')
|
|||
const filterText = ref('')
|
||||
|
||||
const activeName = ref(DATASET)
|
||||
const tableHeight = ref(0)
|
||||
|
||||
const settingTags = reactive([
|
||||
{
|
||||
|
|
@ -201,6 +207,13 @@ function refresh() {
|
|||
}
|
||||
|
||||
onMounted(() => {
|
||||
tableHeight.value = window.innerHeight - 330
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
tableHeight.value = window.innerHeight - 330
|
||||
console.log(tableHeight.value)
|
||||
})()
|
||||
}
|
||||
getMember()
|
||||
})
|
||||
</script>
|
||||
|
|
@ -223,17 +236,28 @@ onMounted(() => {
|
|||
box-sizing: border-box;
|
||||
width: calc(100% - var(--setting-left-width));
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
.submit-button {
|
||||
position: absolute;
|
||||
top: 54px;
|
||||
right: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
&__tabs {
|
||||
margin-top: 10px;
|
||||
:deep(.el-tabs__nav-wrap::after) {
|
||||
height: 1px;
|
||||
}
|
||||
:deep(.el-tabs__nav-scroll) {
|
||||
padding: 0 24px;
|
||||
}
|
||||
:deep(.el-tabs__active-bar) {
|
||||
height: 3px;
|
||||
}
|
||||
}
|
||||
&__table {
|
||||
flex: 1;
|
||||
}
|
||||
&__footer {
|
||||
flex: 0 0 auto;
|
||||
justify-content: right;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue