perf: update detail

This commit is contained in:
ibuler 2024-12-27 19:08:51 +08:00
parent 48d81dbd19
commit 24f30ab198
48 changed files with 150 additions and 121 deletions

View File

@ -13,7 +13,6 @@
</el-form-item>
</span>
</el-form>
<slot />
</IBox>
</template>
@ -45,7 +44,7 @@ export default {
},
labelWidth: {
type: String,
default: '25%'
default: ''
}
},
data() {
@ -71,55 +70,60 @@ export default {
padding: 20px 40px;
}
.el-form-item {
border-bottom: 1px dashed #EBEEF5;
padding: 1px 0;
margin-bottom: 0;
&:last-child {
border-bottom: none;
}
&.array-item {
border-bottom: none;
::v-deep .el-form-item__content {
border-bottom: 1px dashed #EBEEF5
}
::v-deep .el-form-item__label:last-child {
border: 1px dashed #EBEEF5;
}
}
::v-deep .el-form-item__label {
padding-right: 8%;
overflow: hidden;
color: var(--color-icon-primary);
span {
display: inline-block;
line-height: 1.5;
}
}
::v-deep .el-form-item__content {
color: var(--color-text-primary);
font-size: 13px;
line-height: 40px;
}
::v-deep .el-tag--mini {
margin-right: 3px;
}
}
.item-value span {
word-break: break-word;
}
.content {
font-size: 13px;
line-height: 2.5;
line-height: 2;
::v-deep .el-form-item {
//border-bottom: 1px dashed #EBEEF5;
padding: 1px 0;
margin-bottom: 0;
text-align: end;
&:last-child {
//border-bottom: none;
}
&.array-item {
border-bottom: none;
::v-deep .el-form-item__content {
border-bottom: 1px dashed #EBEEF5
}
::v-deep .el-form-item__label:last-child {
border: 1px dashed #EBEEF5;
}
}
.el-form-item__label {
//padding-right: 8%;
overflow: hidden;
color: var(--color-icon-primary);
font-size: 12px;
line-height: 1.4;
font-weight: 400;
span {
display: inline-block;
//line-height: 1.1;
}
}
.el-form-item__content {
color: var(--color-text-primary);
font-size: 13px;
//line-height: 1.3;
//padding-bottom: 10px;
}
::v-deep .el-tag--mini {
margin-right: 3px;
}
}
.item-value span {
word-break: break-word;
}
}
</style>

View File

@ -341,7 +341,7 @@ b, strong {
tr td {
line-height: 1.42857;
padding: 8px;
padding: 8px 0;
vertical-align: top;
}

View File

@ -89,6 +89,11 @@ export default {
margin-right: 30px;
height: 100%;
// Detail
&.content {
margin-right: 0;
}
&.el-form--label-top {
.el-radio-group {
.el-radio {

View File

@ -39,32 +39,32 @@ export default {
</script>
<style scoped>
.quick-actions ::v-deep table {
width: 100%;
}
.quick-actions ::v-deep table {
width: 100%;
}
.quick-actions ::v-deep tr > td {
line-height: 1.43;
padding: 8px;
vertical-align: top;
font-size: 13px;
width: 50%;
}
.quick-actions ::v-deep tr > td {
line-height: 1.43;
padding: 8px 0;
vertical-align: top;
font-size: 13px;
width: 50%;
}
.quick-actions ::v-deep tr > td > span:last-child {
float: right;
}
.quick-actions ::v-deep tr > td > span:last-child {
float: right;
}
.quick-actions ::v-deep button {
padding: 4px 5px;
font-size: 13px;
width: 65px;
.quick-actions ::v-deep button {
padding: 4px 5px;
font-size: 13px;
width: 65px;
span {
overflow: hidden;
white-space: nowrap; /* 控制文本不换行 */
text-overflow: ellipsis;
display: block;
}
span {
overflow: hidden;
white-space: nowrap; /* 控制文本不换行 */
text-overflow: ellipsis;
display: block;
}
}
</style>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -7,7 +7,7 @@
:table-config="tableConfig"
/>
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AssetRelationCard type="primary" v-bind="assetRelationConfig" />
<RelationCard style="margin-top: 15px" type="info" v-bind="nodeRelationConfig" />
</el-col>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :object="detail" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :object="object" v-bind="detail" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -5,7 +5,7 @@
<AutoDetailCard :excludes="excludes" :object="object" :url="url" />
<AutoDetailCard :fields="detailFields" :object="object" :title="$tc('TaskDetail')" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickEditActions" type="primary" />
<QuickActions :actions="quickExecuteActions" type="primary" />
<RelationCard

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
<IBox :title="$tc('Protocols')">
<ProtocolSelector

View File

@ -1,7 +1,7 @@
<template>
<div>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -4,7 +4,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions
v-if="object.id"
:actions="quickActions"

View File

@ -8,7 +8,7 @@
:url="url"
/>
</el-col>
<el-col v-if="hasSummary" :md="20" :sm="24">
<el-col v-if="hasSummary" :md="20" :sm="24" class="detail-right-quick-actions">
<IBox
v-if="object.summary.ok"
:title="`${$tc('SuccessAsset')} (${object.summary.ok.length})` "

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :excludes="excludes" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -4,7 +4,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -1,6 +1,6 @@
<template>
<el-row :gutter="20">
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
</el-row>

View File

@ -13,7 +13,7 @@
:url="url"
/>
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<IBox :title="$tc('Account')" type="primary">
<AccountFormatter
:assets="assetIds"

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<ListTable ref="ListTable" :header-actions="headerActions" :table-config="tableConfig" class- />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<AssetRelationCard type="primary" v-bind="assetRelationConfig" />
<RelationCard style="margin-top: 15px" type="info" v-bind="nodeRelationConfig" />
</el-col>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<ListTable ref="ListTable" :header-actions="headerActions" :table-config="tableConfig" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<RelationCard type="primary" v-bind="userRelationConfig" />
<RelationCard style="margin-top: 15px" type="info" v-bind="groupRelationConfig" />
</el-col>

View File

@ -5,7 +5,7 @@
<el-col :md="24" :sm="24">
<DetailCard :items="detailCardItems" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions
:actions="authQuickActions"
:title="$tc('AuthSettings')"

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<DetailCard v-if="object" :items="detailItems" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions v-if="object" :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<ListTable :header-actions="headerConfig" :table-config="config" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -5,7 +5,7 @@
<AutoDetailCard v-bind="detailSpecInfoConfig" />
<AutoDetailCard v-bind="detailInfoConfig" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
<RelationCard
ref="LabelRelation"

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<ListTable :header-actions="headerConfig" :table-config="config" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -8,7 +8,7 @@
<el-col :md="24" :sm="24">
<DetailCard :items="detailItems" :title="cardTitle" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<QuickActions :actions="quickActions" type="primary" />
</el-col>
</el-row>

View File

@ -3,7 +3,7 @@
<el-col :md="24" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24" />
<el-col :md="20" :sm="24" class="detail-right-quick-actions" />
</el-row>
</template>

View File

@ -4,7 +4,7 @@
<el-col :md="24" :sm="24">
<GenericListTable ref="listTable" :header-actions="headerActions" :table-config="tableConfig" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<RelationCard :key="relationKey" v-bind="relationConfig" @addSuccess="addSuccess" />
</el-col>
</el-row>

View File

@ -1,9 +1,9 @@
<template>
<el-row :gutter="20">
<el-col :md="14" :sm="24">
<el-col :md="20" :sm="24">
<AutoDetailCard :fields="detailFields" :object="object" :url="url" />
</el-col>
<el-col :md="10" :sm="24">
<el-col :md="20" :sm="24">
<IBox :title="$tc('Permissions')">
<div style="height: 10%">
<el-button

View File

@ -7,7 +7,7 @@
:table-config="tableConfig"
/>
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="20" :sm="24" class="detail-right-quick-actions">
<RelationCard v-if="!loading" ref="userRelation" v-bind="relationConfig" />
</el-col>
</el-row>

View File

@ -52,6 +52,13 @@ export default {
}
}
},
beforeClick: ({ row }) => {
vm.$router.push({
query: {
_scope: row.scope.value
}
})
},
drawer: true
}
},

View File

@ -1,11 +1,11 @@
<template>
<el-row :gutter="20">
<el-col :md="24" :sm="24">
<el-col :md="14" :sm="24">
<AutoDetailCard :fields="detailFields" :formatters="detailFormatters" :object="object" :url="url" />
</el-col>
<el-col :md="20" :sm="24">
<el-col :md="10" :sm="24">
<QuickActions :actions="quickActions" type="primary" />
<RelationCard style="margin-top: 15px" type="info" v-bind="relationConfig" />
<RelationCard type="info" v-bind="relationConfig" />
</el-col>
</el-row>
</template>
@ -262,10 +262,23 @@ export default {
}
</script>
<style scoped>
<style lang="scss" scoped>
.mfa-setting ::v-deep .el-slider__runway {
margin-top: 0;
margin-bottom: 0;
}
.detail-right-quick-actions {
display: flex;
& > div {
margin-right: 20px;
width: 350px;
}
& > div:last-child {
margin-right: 0; /* 清除最后一个元素的多余间距 */
}
}
</style>