From 3f31d0f210c8d2e4c1e616603915dadeceb70a49 Mon Sep 17 00:00:00 2001 From: alan Date: Thu, 30 May 2019 09:23:06 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=B0=86=E6=A0=B7=E5=BC=8F?= =?UTF-8?q?=E6=94=BE=E5=88=B0=E7=BB=84=E4=BB=B6=E5=90=8C=E7=BA=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/connection/left/item/left_item.less | 18 +++++++++ src/app/connection/left/item/left_item.ts | 4 +- .../connection/left/item/left_item_icon.ts | 1 + src/app/connection/left/left.ts | 2 +- .../connection/more/item/more_link_item.less | 6 +++ .../connection/more/item/more_link_item.ts | 6 ++- src/app/connection/right/right.ts | 1 - src/app/status/left/left.ts | 2 +- src/app/status/left/left_item.less | 9 +++++ src/app/status/left/left_item.ts | 1 + src/app/status/right/right_card.less | 9 +++++ src/app/status/right/right_card.ts | 4 ++ src/app/title/title.less | 7 ++++ src/app/title/title.ts | 4 ++ src/less/index.less | 3 +- src/less/lib/background.less | 1 - src/less/lib/color.less | 3 +- src/less/resource/common.less | 39 ------------------- 18 files changed, 72 insertions(+), 48 deletions(-) create mode 100644 src/app/connection/left/item/left_item.less create mode 100644 src/app/connection/more/item/more_link_item.less create mode 100644 src/app/status/left/left_item.less create mode 100644 src/app/status/right/right_card.less create mode 100644 src/app/title/title.less delete mode 100644 src/less/resource/common.less diff --git a/src/app/connection/left/item/left_item.less b/src/app/connection/left/item/left_item.less new file mode 100644 index 0000000..998a760 --- /dev/null +++ b/src/app/connection/left/item/left_item.less @@ -0,0 +1,18 @@ +@import '../../../../less/index.less'; +.dec-webui-dcm-connection-left-item{ + &-selected{ + background-color: @background-color-blue-transparent; + .link-title{ + color: @font-color-highlight; + } + } + &:hover{ + background-color: @background-color-blue-transparent; + .link-item-icon{ + visibility: visible; + } + } + .link-item-icon{ + visibility: hidden; + } +} \ No newline at end of file diff --git a/src/app/connection/left/item/left_item.ts b/src/app/connection/left/item/left_item.ts index 621b1a3..48680fc 100644 --- a/src/app/connection/left/item/left_item.ts +++ b/src/app/connection/left/item/left_item.ts @@ -1,3 +1,4 @@ +import './left_item.less'; import {WidgetType, Icon, TextButton, LeftRightVerticalAdapt} from '@ui'; import ItemIcon from './left_item_icon'; import Model from '../../link_set.model'; @@ -8,6 +9,7 @@ const Widget: WidgetType = { title: '', id: '', creator: '', + baseCls: 'dec-webui-dcm-connection-left-item', }, _store() { return BI.Models.getModel(Model); @@ -17,7 +19,7 @@ const Widget: WidgetType = { return { type: LeftRightVerticalAdapt, - cls: `link-item cursor-pointer`, + cls: `cursor-pointer`, height: 24, items: { left: [ diff --git a/src/app/connection/left/item/left_item_icon.ts b/src/app/connection/left/item/left_item_icon.ts index 2d3cd84..d8fd1d5 100644 --- a/src/app/connection/left/item/left_item_icon.ts +++ b/src/app/connection/left/item/left_item_icon.ts @@ -15,6 +15,7 @@ const Widget: WidgetType = { if (value === ACTION_DELETE) { return { type: BubbleCombo, + stopPropagation: true, direction: 'bottom', ref () { combo = this; diff --git a/src/app/connection/left/left.ts b/src/app/connection/left/left.ts index 547d572..afcf09f 100644 --- a/src/app/connection/left/left.ts +++ b/src/app/connection/left/left.ts @@ -27,7 +27,7 @@ const Widget: WidgetType = { return BI.map(linkList, (index: number, item: LinkType) => { return { type: LeftItem, - cls: item.isSelected ? 'left-item-selected' : '', + cls: item.isSelected ? 'dec-webui-dcm-connection-left-item-selected' : '', title: item.connectionName, id: item.connectionId, creator: item.creator, diff --git a/src/app/connection/more/item/more_link_item.less b/src/app/connection/more/item/more_link_item.less new file mode 100644 index 0000000..8bcc779 --- /dev/null +++ b/src/app/connection/more/item/more_link_item.less @@ -0,0 +1,6 @@ +@import '../../../../less/index.less'; +.dec-webui-dcm-connection-more-link-item{ + &:hover{ + border: solid 1px @border-color-highlight; + } +} \ No newline at end of file diff --git a/src/app/connection/more/item/more_link_item.ts b/src/app/connection/more/item/more_link_item.ts index f9a7212..9604b42 100644 --- a/src/app/connection/more/item/more_link_item.ts +++ b/src/app/connection/more/item/more_link_item.ts @@ -1,8 +1,12 @@ +import './more_link_item.less'; import {WidgetType, Vertical, Img, Label, Layout, Absolute} from '@ui/index'; import ModelName from './more_link_litem.model'; const className = 'dec.dcm.component.linkSet.morelink.item'; const Widget: WidgetType = { + props: { + baseCls: 'dec-webui-dcm-connection-more-link-item', + }, _store() { return BI.Models.getModel(ModelName); }, @@ -17,7 +21,7 @@ const Widget: WidgetType = { return { type: Vertical, - cls: 'dcm-link-more bi-border cursor-pointer', + cls: 'bi-border cursor-pointer', width: 120, height: 117, items: [ diff --git a/src/app/connection/right/right.ts b/src/app/connection/right/right.ts index 961cabc..16ef861 100644 --- a/src/app/connection/right/right.ts +++ b/src/app/connection/right/right.ts @@ -21,7 +21,6 @@ const Widget: WidgetType = { render() { return { type: ListView, - cls: 'dcm-link-form', ref(_ref: any) { rightContent = _ref; }, diff --git a/src/app/status/left/left.ts b/src/app/status/left/left.ts index 06f3259..cfe6a5e 100644 --- a/src/app/status/left/left.ts +++ b/src/app/status/left/left.ts @@ -32,7 +32,7 @@ const Widget: WidgetType = { return BI.map(linkList, (index: number, item: LinkType) => { return { type: LeftItem, - cls: item.connectionName === selectTitle ? 'left-item-selected' : '', + cls: item.connectionName === selectTitle ? 'dec-webui-dcm-status-left-item-selected' : '', title: item.connectionName, id: item.connectionId, creator: item.creator, diff --git a/src/app/status/left/left_item.less b/src/app/status/left/left_item.less new file mode 100644 index 0000000..458769f --- /dev/null +++ b/src/app/status/left/left_item.less @@ -0,0 +1,9 @@ +@import '../../../less/index.less'; +.dec-webui-dcm-status-left-item{ + &-selected{ + background-color: @background-color-blue-transparent; + .link-title{ + color: @font-color-highlight; + } + } +} \ No newline at end of file diff --git a/src/app/status/left/left_item.ts b/src/app/status/left/left_item.ts index 8936982..abc9b9a 100644 --- a/src/app/status/left/left_item.ts +++ b/src/app/status/left/left_item.ts @@ -1,3 +1,4 @@ +import './left_item.less'; import {WidgetType, TextButton, VerticalAdapt} from '@ui'; import Model from './left.model'; const className = 'dec.dcm.component.linkStatus.left.item'; diff --git a/src/app/status/right/right_card.less b/src/app/status/right/right_card.less new file mode 100644 index 0000000..6b121b9 --- /dev/null +++ b/src/app/status/right/right_card.less @@ -0,0 +1,9 @@ +@import '../../../less/index.less'; +.dec-webui-dcm-status-right-card{ + .card-font-success{ + font-size: @font-size-30; + } + .card-font-heighlight{ + font-size: @font-size-30; + } +} \ No newline at end of file diff --git a/src/app/status/right/right_card.ts b/src/app/status/right/right_card.ts index 00bc02d..1cdb719 100644 --- a/src/app/status/right/right_card.ts +++ b/src/app/status/right/right_card.ts @@ -1,6 +1,10 @@ +import './right_card.less'; import {WidgetType, Left, Label, Vertical, FloatCenter, CenterAdapt, VerticalAdapt} from '@ui/index'; const className = 'dec.dcm.component.linkStatus.right.card'; const Widget: WidgetType = { + props: { + baseCls: 'dec-webui-dcm-status-right-card', + }, render() { const {maxActive, maxIdle, numActive, numIdle} = this.options; diff --git a/src/app/title/title.less b/src/app/title/title.less new file mode 100644 index 0000000..7137334 --- /dev/null +++ b/src/app/title/title.less @@ -0,0 +1,7 @@ +@import '../../less/index.less'; +.dec-webui-dcm-title{ + .title-item-selected{ + color: @background-color-highlight; + border-bottom: solid 2px @border-color-highlight; + } +} \ No newline at end of file diff --git a/src/app/title/title.ts b/src/app/title/title.ts index c00ba63..7647265 100644 --- a/src/app/title/title.ts +++ b/src/app/title/title.ts @@ -1,9 +1,13 @@ +import './title.less'; import {WidgetType, IconButton, LeftRightVerticalAdapt} from '@ui/index'; import TitleItem from './item/title_item'; import {isDesigner, closeWindow} from '@shared/crud/crud.request'; import {TAB_LINK_SET, TAB_LINK_POOL} from '@private/constants'; const className = 'dec.dcm.title'; const Widget: WidgetType = { + props: { + baseCls: 'dec-webui-dcm-title', + }, render() { const hideCloseButton = isDesigner(); diff --git a/src/less/index.less b/src/less/index.less index 7a227dc..9d67e74 100644 --- a/src/less/index.less +++ b/src/less/index.less @@ -1,5 +1,4 @@ @import "lib/background"; @import "lib/color"; @import "resource/background"; -@import "resource/font"; -@import "resource/common"; \ No newline at end of file +@import "resource/font"; \ No newline at end of file diff --git a/src/less/lib/background.less b/src/less/lib/background.less index e5baaf9..bff78bf 100644 --- a/src/less/lib/background.less +++ b/src/less/lib/background.less @@ -1,4 +1,3 @@ -@background-color-blue-transparent: @color-bi-blue-5; @background-resources: "resources.png"; @background-warning: "warning.png"; @background-database-selected: "database-selected.png"; diff --git a/src/less/lib/color.less b/src/less/lib/color.less index 3b63c6d..ca1c3a1 100644 --- a/src/less/lib/color.less +++ b/src/less/lib/color.less @@ -1 +1,2 @@ -@import "../../../node_modules/fineui/src/less/lib/colors"; \ No newline at end of file +@import "../../../node_modules/fineui/src/less/lib/colors"; +@background-color-blue-transparent: @color-bi-blue-5; \ No newline at end of file diff --git a/src/less/resource/common.less b/src/less/resource/common.less deleted file mode 100644 index 2021202..0000000 --- a/src/less/resource/common.less +++ /dev/null @@ -1,39 +0,0 @@ -.dec-webui-dcm-layout{ - .title-item-selected{ - color: @background-color-highlight; - border-bottom: solid 2px @border-color-highlight; - } - .dcm-link-left{ - .link-item{ - &:hover{ - background-color: @background-color-blue-transparent; - .link-item-icon{ - visibility: visible; - } - } - .link-item-icon{ - visibility: hidden; - } - } - .left-item-selected{ - background-color: @background-color-blue-transparent; - .link-title{ - color: @font-color-highlight; - } - } - } - .dcm-link-form{ - .card-font-success{ - font-size: @font-size-30; - } - .card-font-heighlight{ - font-size: @font-size-30; - } - } - .dcm-link-more{ - &:hover{ - border: solid 1px @border-color-highlight; - } - } -} -