fix(全局): 样式调整
This commit is contained in:
parent
d37f3fa99d
commit
e62728ad81
|
@ -279,7 +279,4 @@
|
|||
:deep(.arco-table-cell) {
|
||||
padding: 6px 8px;
|
||||
}
|
||||
:deep(#ms-table-footer-wrapper) {
|
||||
margin-top: 8px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -90,7 +90,7 @@
|
|||
@select="folderNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
|
|
@ -51,7 +51,7 @@
|
|||
@select="folderNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
|
|
@ -27,12 +27,11 @@
|
|||
@select="folderNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">
|
||||
<MsIcon type="icon-icon_folder_filled1" size="14" class="mr-1 text-[var(--color-text-4)]" />{{
|
||||
nodeData.name
|
||||
}}</div
|
||||
>
|
||||
<MsIcon type="icon-icon_folder_filled1" size="14" class="mr-1 text-[var(--color-text-4)]" />
|
||||
{{ nodeData.name }}
|
||||
</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
@ -215,7 +215,7 @@
|
|||
<div
|
||||
v-if="showBatchAction || !!attrs.showPagination"
|
||||
id="ms-table-footer-wrapper"
|
||||
class="mt-[16px] flex h-[32px] w-full flex-row flex-nowrap items-center overflow-hidden"
|
||||
class="mt-[16px] flex w-full flex-row flex-nowrap items-center overflow-hidden"
|
||||
:class="{ 'justify-between': showBatchAction }"
|
||||
>
|
||||
<span v-if="props.actionConfig && selectedCount > 0 && !showBatchAction" class="title text-[var(--color-text-2)]">
|
||||
|
|
|
@ -102,7 +102,7 @@
|
|||
<apiMethodName :method="nodeData.attachInfo?.method || nodeData.attachInfo?.protocol" />
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
</div>
|
||||
<div v-else class="inline-flex w-full">
|
||||
<div v-else class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
|
|
@ -127,7 +127,7 @@
|
|||
<apiMethodName :method="nodeData.attachInfo?.method || nodeData.attachInfo?.protocol" />
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
</div>
|
||||
<div v-else :id="nodeData.id" class="inline-flex w-full">
|
||||
<div v-else :id="nodeData.id" class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div v-if="!props.isModal" class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">
|
||||
{{ modulesCount[nodeData.id] || 0 }}
|
||||
|
@ -286,7 +286,7 @@
|
|||
};
|
||||
}
|
||||
return {
|
||||
height: 'calc(100vh - 305px)',
|
||||
height: 'calc(100vh - 298px)',
|
||||
threshold: 200,
|
||||
fixedSize: true,
|
||||
buffer: 15, // 缓冲区默认 10 的时候,虚拟滚动的底部 padding 计算有问题
|
||||
|
|
|
@ -46,7 +46,7 @@
|
|||
@select="handleNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-4)]"
|
||||
>({{ moduleCountMap[nodeData.id] || 0 }})</div
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
@select="folderNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div :id="nodeData.id" class="inline-flex w-full">
|
||||
<div :id="nodeData.id" class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
|
|
@ -77,7 +77,7 @@
|
|||
@drop="handleDrop"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div :id="nodeData.id" class="inline-flex w-full">
|
||||
<div :id="nodeData.id" class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<div :class="['p-[8px_16px]', props.class]">
|
||||
<div class="mb-[16px] flex items-center justify-between">
|
||||
<div class="mb-[8px] flex items-center justify-between">
|
||||
<div class="flex items-center"> </div>
|
||||
<div class="items-right flex gap-[8px]">
|
||||
<a-input-search
|
||||
|
@ -987,10 +987,6 @@
|
|||
const statusFilters = ref<string[]>([]);
|
||||
const tableStore = useTableStore();
|
||||
|
||||
const activeModules = computed(() => {
|
||||
return props.activeModule === 'all' ? [] : [props.activeModule];
|
||||
});
|
||||
|
||||
async function loadScenarioList(refreshTreeCount?: boolean) {
|
||||
let moduleIds: string[] = [];
|
||||
if (props.activeModule && props.activeModule !== 'all') {
|
||||
|
|
|
@ -648,7 +648,7 @@
|
|||
|
||||
<style scoped lang="less">
|
||||
.pageWrap {
|
||||
height: calc(100% - 54px);
|
||||
height: calc(100% - 50px);
|
||||
border-radius: var(--border-radius-large);
|
||||
@apply bg-white;
|
||||
.case {
|
||||
|
|
|
@ -44,7 +44,7 @@
|
|||
@select="folderNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div :id="nodeData.id" class="inline-flex w-full">
|
||||
<div :id="nodeData.id" class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
@drop="handleDrag"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div v-if="!props.isModal" class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">
|
||||
{{ nodeData.count || 0 }}
|
||||
|
|
|
@ -50,7 +50,7 @@
|
|||
@select="caseNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full" @click="setFocusKey(nodeData)">
|
||||
<div class="inline-flex w-full gap-[8px]" @click="setFocusKey(nodeData)">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">
|
||||
{{ nodeData.count || 0 }}
|
||||
|
|
|
@ -44,7 +44,7 @@
|
|||
@select="caseNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]" @click="setFocusKey(nodeData)">{{
|
||||
nodeData.name
|
||||
}}</div>
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
@select="folderNodeSelect"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">{{ nodeData.count || 0 }}</div>
|
||||
</div>
|
||||
|
@ -74,7 +74,7 @@
|
|||
|
||||
const virtualListProps = computed(() => {
|
||||
return {
|
||||
height: 'calc(100vh - 460px)',
|
||||
height: 'calc(100vh - 408px)',
|
||||
threshold: 200,
|
||||
fixedSize: true,
|
||||
buffer: 15, // 缓冲区默认 10 的时候,虚拟滚动的底部 padding 计算有问题
|
||||
|
|
|
@ -68,7 +68,7 @@
|
|||
@drop="handleDrop"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div v-if="!props.isModal" class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">
|
||||
{{ nodeData.count || 0 }}
|
||||
|
@ -148,7 +148,7 @@
|
|||
};
|
||||
}
|
||||
return {
|
||||
height: 'calc(100vh - 325px)',
|
||||
height: 'calc(100vh - 218px)',
|
||||
threshold: 200,
|
||||
fixedSize: true,
|
||||
buffer: 15, // 缓冲区默认 10 的时候,虚拟滚动的底部 padding 计算有问题
|
||||
|
|
|
@ -31,7 +31,7 @@
|
|||
@drop="handleDrop"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div v-if="!props.isModal" class="ms-tree-node-count ml-auto text-[var(--color-text-brand)]">
|
||||
{{ nodeData.count || 0 }}
|
||||
|
@ -114,7 +114,7 @@
|
|||
};
|
||||
}
|
||||
return {
|
||||
height: 'calc(100vh - 325px)',
|
||||
height: 'calc(100vh - 292px)',
|
||||
threshold: 200,
|
||||
fixedSize: true,
|
||||
buffer: 15, // 缓冲区默认 10 的时候,虚拟滚动的底部 padding 计算有问题
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<MsList
|
||||
v-model:focus-item-key="focusItemKey"
|
||||
:virtual-list-props="{
|
||||
height: 'calc(100vh - 325px)',
|
||||
height: 'calc(100vh - 275px)',
|
||||
}"
|
||||
:data="storageList"
|
||||
:bordered="false"
|
||||
|
|
|
@ -30,7 +30,7 @@
|
|||
@drop="handleDrag"
|
||||
>
|
||||
<template #title="nodeData">
|
||||
<div class="inline-flex w-full">
|
||||
<div class="inline-flex w-full gap-[8px]">
|
||||
<div class="one-line-text w-full text-[var(--color-text-1)]">{{ nodeData.name }}</div>
|
||||
<div v-if="!props.isModal" class="ms-tree-node-count ml-[4px] text-[var(--color-text-brand)]">
|
||||
{{ nodeData.count || 0 }}
|
||||
|
|
Loading…
Reference in New Issue