mirror of
https://github.com/dataease/dataease.git
synced 2025-02-24 03:22:56 +08:00
fix: 样式优化
This commit is contained in:
parent
c61cae2020
commit
8b7d289f13
@ -7,7 +7,8 @@ import icon_down_outlined1 from '@/assets/svg/icon_down_outlined-1.svg'
|
||||
import icon_right_outlined from '@/assets/svg/icon_right_outlined.svg'
|
||||
import icon_done_outlined from '@/assets/svg/icon_done_outlined.svg'
|
||||
import icon_edit_outlined from '@/assets/svg/icon_edit_outlined.svg'
|
||||
import icon_sort_priority from '@/assets/svg/icon_sort_priority.svg'
|
||||
import icon_visible_outlined from '@/assets/svg/icon_visible_outlined.svg'
|
||||
import icon_invisible_outlined from '@/assets/svg/icon_invisible_outlined.svg'
|
||||
import { useI18n } from '@/hooks/web/useI18n'
|
||||
import { computed, onMounted, ref, toRefs, watch } from 'vue'
|
||||
import { getItemType } from '@/views/chart/components/editor/drag-item/utils'
|
||||
@ -282,7 +283,9 @@ onMounted(() => {
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-icon style="margin-left: 8px">
|
||||
<Icon><Hide v-show="showHideIcon" class="svg-icon inner-class" /></Icon>
|
||||
<Icon
|
||||
><icon_invisible_outlined v-show="showHideIcon" class="svg-icon inner-class"
|
||||
/></Icon>
|
||||
</el-icon>
|
||||
<el-tooltip :effect="toolTip" placement="top">
|
||||
<template #content>
|
||||
@ -392,10 +395,10 @@ onMounted(() => {
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="showSort()"
|
||||
:icon="icon_sort_priority"
|
||||
:command="beforeClickItem('sortPriority')"
|
||||
class="menu-item-padding"
|
||||
>
|
||||
<el-icon />
|
||||
<span>{{ t('chart.sort_priority') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
@ -642,8 +645,10 @@ onMounted(() => {
|
||||
:command="beforeClickItem('toggleHide')"
|
||||
>
|
||||
<el-icon>
|
||||
<icon v-if="item.hide === true" name="view"><View class="svg-icon" /></icon>
|
||||
<icon v-else name="hide"><Hide class="svg-icon" /></icon>
|
||||
<icon
|
||||
><icon_visible_outlined v-if="item.hide === true" class="svg-icon" />
|
||||
<icon_invisible_outlined v-else class="svg-icon"
|
||||
/></icon>
|
||||
</el-icon>
|
||||
<span>{{ item.hide === true ? t('chart.show') : t('chart.hide') }}</span>
|
||||
</el-dropdown-item>
|
||||
|
@ -288,10 +288,10 @@ onMounted(() => {
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
v-if="index !== 0"
|
||||
:icon="icon_sort_priority"
|
||||
:command="beforeClickItem('sortPriority')"
|
||||
class="menu-item-padding"
|
||||
>
|
||||
<el-icon />
|
||||
<span>{{ t('chart.sort_priority') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item class="menu-item-padding" :command="beforeClickItem('rename')">
|
||||
|
@ -4,18 +4,17 @@ import icon_sortZToA_outlined from '@/assets/svg/icon_sort-z-to-a_outlined.svg'
|
||||
import icon_sort_outlined from '@/assets/svg/icon_sort_outlined.svg'
|
||||
import icon_deleteTrash_outlined from '@/assets/svg/icon_delete-trash_outlined.svg'
|
||||
import icon_down_outlined1 from '@/assets/svg/icon_down_outlined-1.svg'
|
||||
import icon_dashboard_outlined from '@/assets/svg/icon_dashboard_outlined.svg'
|
||||
import icon_right_outlined from '@/assets/svg/icon_right_outlined.svg'
|
||||
import icon_done_outlined from '@/assets/svg/icon_done_outlined.svg'
|
||||
import icon_functions_outlined from '@/assets/svg/icon_functions_outlined.svg'
|
||||
import icon_describe_outlined from '@/assets/svg/icon_describe_outlined.svg'
|
||||
import icon_sort_priority from '@/assets/svg/icon_sort_priority.svg'
|
||||
import icon_visible_outlined from '@/assets/svg/icon_visible_outlined.svg'
|
||||
import icon_invisible_outlined from '@/assets/svg/icon_invisible_outlined.svg'
|
||||
import icon_edit_outlined from '@/assets/svg/icon_edit_outlined.svg'
|
||||
import iconFilter from '@/assets/svg/icon-filter.svg'
|
||||
import { useI18n } from '@/hooks/web/useI18n'
|
||||
import { computed, onMounted, reactive, ref, toRefs, watch } from 'vue'
|
||||
import { formatterItem } from '@/views/chart/components/js/formatter'
|
||||
import { getItemType, resetValueFormatter } from '@/views/chart/components/editor/drag-item/utils'
|
||||
import { Filter } from '@element-plus/icons-vue'
|
||||
import { quotaViews } from '@/views/chart/components/js/util'
|
||||
import { SUPPORT_Y_M } from '@/views/chart/components/editor/util/chart'
|
||||
import { fieldType } from '@/utils/attr'
|
||||
@ -393,7 +392,7 @@ onMounted(() => {
|
||||
</span>
|
||||
<el-icon style="margin-left: 8px">
|
||||
<Icon>
|
||||
<Hide
|
||||
<icon_invisible_outlined
|
||||
v-show="showHideIcon"
|
||||
:class="`field-icon-${fieldType[[2, 3].includes(item.deType) ? 2 : 0]}`"
|
||||
class="svg-icon inner-class"
|
||||
@ -748,9 +747,9 @@ onMounted(() => {
|
||||
<el-dropdown-item
|
||||
v-if="showSort"
|
||||
class="menu-item-padding"
|
||||
:icon="icon_sort_priority"
|
||||
:command="beforeClickItem('sortPriority')"
|
||||
>
|
||||
<el-icon />
|
||||
<span>{{ t('chart.sort_priority') }}</span>
|
||||
</el-dropdown-item>
|
||||
|
||||
@ -759,7 +758,7 @@ onMounted(() => {
|
||||
v-if="
|
||||
props.type !== 'extLabel' && props.type !== 'extTooltip' && props.type !== 'extBubble'
|
||||
"
|
||||
:icon="Filter"
|
||||
:icon="iconFilter"
|
||||
:command="beforeClickItem('filter')"
|
||||
:divided="chart.type.includes('chart-mix')"
|
||||
>
|
||||
@ -788,8 +787,10 @@ onMounted(() => {
|
||||
:command="beforeClickItem('toggleHide')"
|
||||
>
|
||||
<el-icon>
|
||||
<icon v-if="item.hide === true" name="view"><View class="svg-icon" /></icon>
|
||||
<icon v-else name="hide"><Hide class="svg-icon" /></icon>
|
||||
<icon
|
||||
><icon_visible_outlined v-if="item.hide === true" class="svg-icon" />
|
||||
<icon_invisible_outlined v-else class="svg-icon"
|
||||
/></icon>
|
||||
</el-icon>
|
||||
<span>{{ item.hide === true ? t('chart.show') : t('chart.hide') }}</span>
|
||||
</el-dropdown-item>
|
||||
|
@ -1398,6 +1398,7 @@ const mousedownDrag = () => {
|
||||
margin-bottom: 8px;
|
||||
background-color: white;
|
||||
color: #1f2329;
|
||||
font-size: 14px;
|
||||
|
||||
.ed-icon {
|
||||
font-size: 16px;
|
||||
@ -1480,8 +1481,22 @@ const mousedownDrag = () => {
|
||||
.system-text_bg {
|
||||
color: #1f2329;
|
||||
&:hover {
|
||||
background: #1f23291a;
|
||||
}
|
||||
|
||||
&:active {
|
||||
background: #1f232933;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: #3370ff1a;
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
&:focus:hover {
|
||||
color: #3370ff;
|
||||
background: #3370ff33;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1195,25 +1195,25 @@ const emits = defineEmits([
|
||||
direction="rtl"
|
||||
>
|
||||
<template #header v-if="currentNode">
|
||||
<div class="info-content">
|
||||
<div style="width: 100%">
|
||||
<div class="info">
|
||||
<span class="label">{{ t('data_set.table_name_de') }}</span>
|
||||
<span :title="currentNode.tableName" class="name ellipsis">{{
|
||||
<span :title="currentNode.tableName" class="label ellipsis">{{
|
||||
currentNode.tableName
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="info">
|
||||
<span class="label">{{ t('data_set.table_remarks') }}</span>
|
||||
<span :title="currentNode.noteName" style="max-width: 240px" class="name ellipsis">{{
|
||||
currentNode.noteName || '-'
|
||||
}}</span>
|
||||
<div class="info" style="margin-top: 4px">
|
||||
<span
|
||||
:title="getDsName(currentNode.datasourceId)"
|
||||
style="max-width: 550px"
|
||||
class="name ellipsis"
|
||||
>{{ t('auth.datasource') }}:{{ getDsName(currentNode.datasourceId) }}</span
|
||||
>
|
||||
</div>
|
||||
<div class="info" style="margin-top: 4px">
|
||||
<span :title="currentNode.noteName" style="max-width: 500px" class="name ellipsis"
|
||||
>{{ t('data_set.table_remarks') }}:{{ currentNode.noteName || '-' }}</span
|
||||
>
|
||||
</div>
|
||||
<span
|
||||
:title="getDsName(currentNode.datasourceId)"
|
||||
style="max-width: 550px"
|
||||
class="ds ellipsis"
|
||||
>{{ t('auth.datasource') }}:{{ getDsName(currentNode.datasourceId) }}</span
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
<union-field-list
|
||||
@ -1253,22 +1253,16 @@ const emits = defineEmits([
|
||||
|
||||
.union-item-drawer {
|
||||
.ed-drawer__header {
|
||||
height: 82px;
|
||||
height: auto;
|
||||
font-family: var(--de-custom_font, 'PingFang');
|
||||
|
||||
.ed-drawer__close-btn {
|
||||
top: 26px;
|
||||
}
|
||||
|
||||
.info-content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
top: 40.5px;
|
||||
}
|
||||
|
||||
.info {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
.label {
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
@ -1278,12 +1272,8 @@ const emits = defineEmits([
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
}
|
||||
.ds {
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
max-width: 500px;
|
||||
color: #646a73;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user