feat(项目管理): 项目管理应用设置页面调整

This commit is contained in:
xinxin.wu 2024-09-03 18:43:15 +08:00 committed by Craftsman
parent f44307ff31
commit 4aecb7565f
2 changed files with 29 additions and 11 deletions

View File

@ -236,11 +236,11 @@
<slot v-if="record.children" name="expand-icon" v-bind="{ expanded, record }">
<div
:class="`${
expanded ? 'bg-[rgb(var(--primary-1))]' : 'bg-[var(--color-text-n8)]'
expanded ? 'expanded-border bg-[rgb(var(--primary-1))]' : 'not-expanded-border bg-[var(--color-text-n8)]'
} expand-btn-wrapper flex items-center justify-center`"
>
<MsIcon v-if="!expanded" :size="8" type="icon-icon_right_outlined" class="text-[var(--color-text-4)]" />
<MsIcon v-else :size="8" class="text-[rgb(var(--primary-6))]" type="icon-icon_down_outlined" />
<MsIcon v-else :size="8" class="text-[rgb(var(--primary-5))]" type="icon-icon_down_outlined" />
</div>
</slot>
</template>
@ -1017,6 +1017,8 @@
background: none !important;
}
:deep(.arco-table .arco-table-expand-btn) {
width: 16px;
height: 16px;
border-color: transparent;
}
:deep(.arco-table-tr-expand .arco-table-td) {
@ -1050,9 +1052,15 @@
height: 16px;
border: none;
border-radius: 50%;
// background: var(--color-text-n8);
background: white;
}
}
.not-expanded-border {
border: 1px solid var(--color-text-n8) !important;
}
.expanded-border {
border: 1px solid rgb(var(--primary-5)) !important;
}
:deep(.arco-table .arco-table-expand-btn:hover) {
border-color: transparent;
background: transparent;

View File

@ -13,12 +13,14 @@
v-on="propsEvent"
>
<template #module="{ record }">
<div v-if="record.children">
<MsIcon class="text-[var(--color-text-4)]" :type="getMenuIcon(record.module)" />
<span class="ml-[4px]">{{ t(`menu.${record.module}`) }}</span>
<div v-if="record.children" class="flex items-center">
<div class="icon-class">
<MsIcon class="text-[12px] text-[rgb(var(--primary-4))]" :type="getMenuIcon(record.module)" />
</div>
<span>{{ t(`menu.${record.module}`) }}</span>
</div>
<div v-else>
<span class="ml-[4px]">{{ t(`project.menu.${record.type}`) }}</span>
<span class="ml-[28px]">{{ t(`project.menu.${record.type}`) }}</span>
</div>
</template>
<template #description="{ record }">
@ -458,7 +460,7 @@
dataIndex: 'module',
slotName: 'module',
width: 221,
headerCellClass: 'pl-[16px]',
headerCellClass: 'pl-[40px]',
},
{
title: 'common.desc',
@ -477,11 +479,11 @@
const noTitleColumns = [
{
title: 'project.menu.name',
title: '',
dataIndex: 'module',
slotName: 'module',
width: 221,
headerCellClass: 'pl-[16px]',
headerCellClass: 'pl-[40px]',
},
{
title: '',
@ -895,4 +897,12 @@
);
</script>
<style scoped></style>
<style scoped lang="less">
.icon-class {
margin: 0 8px 0 16px;
width: 20px;
height: 20px;
background-color: rgba(var(--primary-1));
@apply flex items-center justify-center rounded-full;
}
</style>