lingling
/
tiny-rdm
mirror of https://github.com/tiny-craft/tiny-rdm.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

perf: add mark color in tab

This commit is contained in:
tiny-craft 2023-09-02 21:47:02 +08:00
parent bb537a7175
commit bc499643db
1 changed files with 12 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
frontend/src/components/content/ContentValueTab.vue
View File

@ -12,10 +12,6 @@ const i18n = useI18n()
const tabStore = useTabStore() const tabStore = useTabStore()
const connectionStore = useConnectionStore() const connectionStore = useConnectionStore()
const props = defineProps({
backgroundColor: String,
})
const onCloseTab = (tabIndex) => { const onCloseTab = (tabIndex) => {
$dialog.warning(i18n.t('close_confirm'), () => { $dialog.warning(i18n.t('close_confirm'), () => {
const tab = get(tabStore.tabs, tabIndex) const tab = get(tabStore.tabs, tabIndex)
@ -25,14 +21,18 @@ const onCloseTab = (tabIndex) => {
}) })
} }
const activeTabStyle = computed(() => ({ const activeTabStyle = computed(() => {
backgroundColor: themeVars.value.baseColor, const { name } = tabStore.currentTab
borderTopWidth: '1px', const { markColor = '' } = connectionStore.serverProfile[name] || {}
borderTopColor: themeVars.value.borderColor, return {
borderBottomColor: themeVars.value.baseColor, backgroundColor: themeVars.value.baseColor,
borderTopLeftRadius: themeVars.value.borderRadius, borderTopWidth: markColor ? '3px' : '1px',
borderTopRightRadius: themeVars.value.borderRadius, borderTopColor: markColor || themeVars.value.borderColor,
})) borderBottomColor: themeVars.value.baseColor,
borderTopLeftRadius: themeVars.value.borderRadius,
borderTopRightRadius: themeVars.value.borderRadius,
}
})
const inactiveTabStyle = computed(() => ({ const inactiveTabStyle = computed(() => ({
borderWidth: '0 0 1px', borderWidth: '0 0 1px',
borderBottomColor: themeVars.value.borderColor, borderBottomColor: themeVars.value.borderColor,