mirror of
https://github.com/dataease/dataease.git
synced 2026-05-14 21:12:33 +08:00
style(数据大屏): 调整大屏Tab组件设置样式 (#17433)
This commit is contained in:
@@ -232,7 +232,7 @@ onMounted(() => {
|
||||
v-model="element.style.borderActive"
|
||||
@modelChange="val => onStyleAttrChange({ key: 'borderActive', value: val })"
|
||||
:themes="themes"
|
||||
:title="t('visualization.board') + '333'"
|
||||
:title="t('visualization.board')"
|
||||
name="borderSetting"
|
||||
class="common-style-area"
|
||||
>
|
||||
|
||||
@@ -29,9 +29,13 @@ const onTitleBackgroundChange = (params, paramsName) => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="tab-title-background">
|
||||
<el-tabs class="background-tabs" v-model="activeName" stretch>
|
||||
<el-tab-pane :label="t('visualization.active_title_background')" name="activeBackground">
|
||||
<div class="tab-title-background" :class="{ 'background-tabs-dark': themes === 'dark' }">
|
||||
<el-tabs class="background-tabs" v-model="activeName" :effect="themes" stretch>
|
||||
<el-tab-pane
|
||||
:effect="themes"
|
||||
:label="t('visualization.active_title_background')"
|
||||
name="activeBackground"
|
||||
>
|
||||
<background-overall-common
|
||||
:themes="themes"
|
||||
edit-position="tab"
|
||||
@@ -40,7 +44,11 @@ const onTitleBackgroundChange = (params, paramsName) => {
|
||||
@onBackgroundChange="onTitleBackgroundChange($event, 'active')"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="t('visualization.inactive_title_background')" name="inActiveBackground">
|
||||
<el-tab-pane
|
||||
:effect="themes"
|
||||
:label="t('visualization.inactive_title_background')"
|
||||
name="inActiveBackground"
|
||||
>
|
||||
<div class="background-label">
|
||||
<span>
|
||||
<el-form-item class="form-item no-margin-bottom" :class="'form-item-' + themes">
|
||||
@@ -94,4 +102,16 @@ const onTitleBackgroundChange = (params, paramsName) => {
|
||||
padding: 12px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.background-tabs-dark {
|
||||
:deep(.ed-tabs__item) {
|
||||
&:hover {
|
||||
color: var(--ed-color-primary);
|
||||
}
|
||||
color: #ebebeb;
|
||||
}
|
||||
:deep(.is-active) {
|
||||
color: var(--ed-color-primary);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user