feat(property-marketing): 新增账号选择组件并优化图表展示逻辑
perf: 重构投放指南组件结构，移除冗余代码 perf: 优化仪表盘图表配置，使用动态渲染方式 perf: 统一组件样式引用方式，移除重复样式定义
This commit is contained in:
林志军
@ -1,6 +1,7 @@
|
||||
|
||||
.table-wrap {
|
||||
width: 100%;
|
||||
|
||||
.pagination-box {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
@ -10,161 +11,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.part-div {
|
||||
width: 100%;
|
||||
background: var(--BG-white, white);
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
outline: 1px var(--BG-300, #E6E6E8) solid;
|
||||
outline-offset: -1px;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
display: inline-flex;
|
||||
margin-top: 15px;
|
||||
// margin: 10px;
|
||||
|
||||
.arco-tabs {
|
||||
margin-bottom: 10px;
|
||||
height: 76px;
|
||||
|
||||
.arco-tabs-tab {
|
||||
height: 56px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.part-div-header {
|
||||
align-self: stretch;
|
||||
height: 64px;
|
||||
padding: 10px 24px 10px 24px;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
display: inline-flex
|
||||
}
|
||||
|
||||
.a-tab-class {
|
||||
color: var(--Brand-6, #6D4CFE);
|
||||
font-size: 66px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 30px;
|
||||
word-wrap: break-word;
|
||||
height: 56px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.part-div-header-title {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 18px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 26px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
|
||||
.search-form {
|
||||
padding: 10px 24px 20px 24px;
|
||||
|
||||
}
|
||||
|
||||
.account-table {
|
||||
padding: 1px 24px 20px 24px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
.month-data-body {
|
||||
width: 100%;
|
||||
padding-bottom: 20px;
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
background: var(--BG-white, white);
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
outline: 1px var(--BG-300, #E6E6E8) solid;
|
||||
outline-offset: -1px;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
display: inline-flex;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.month-body-div {
|
||||
align-self: stretch;
|
||||
height: 64px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
display: inline-flex
|
||||
}
|
||||
|
||||
|
||||
.month-data-title {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 18px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 26px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
|
||||
.overall-strategy {
|
||||
width: 98%;
|
||||
padding: 20px 10px 20px 16px;
|
||||
background: var(--BG-100, #F7F8FA);
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
display: inline-flex;
|
||||
margin: 20px;
|
||||
|
||||
}
|
||||
|
||||
.placement-optimization-title {
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 16px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
.placement-optimization-str {
|
||||
align-self: stretch;
|
||||
color: var(--Text-2, #3C4043);
|
||||
font-size: 14px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
.player-title {
|
||||
margin: 10px 0px 15px 20px;
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 16px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
|
||||
:deep(.arco-tabs) {
|
||||
.arco-tabs-tab {
|
||||
height: 56px;
|
||||
@ -172,14 +18,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.down-btn {
|
||||
float: right;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px
|
||||
}
|
||||
|
||||
|
||||
.guidelines-data-wrap {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
@ -278,4 +122,154 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.part-div {
|
||||
width: 100%;
|
||||
background: var(--BG-white, white);
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
outline: 1px var(--BG-300, #E6E6E8) solid;
|
||||
outline-offset: -1px;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
display: inline-flex;
|
||||
margin-top: 15px;
|
||||
// margin: 10px;
|
||||
|
||||
.arco-tabs {
|
||||
margin-bottom: 10px;
|
||||
height: 76px;
|
||||
|
||||
.arco-tabs-tab {
|
||||
height: 56px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.part-div-header {
|
||||
align-self: stretch;
|
||||
height: 64px;
|
||||
padding: 10px 24px 10px 24px;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
display: inline-flex
|
||||
}
|
||||
|
||||
.a-tab-class {
|
||||
color: var(--Brand-6, #6D4CFE);
|
||||
font-size: 66px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 30px;
|
||||
word-wrap: break-word;
|
||||
height: 56px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.part-div-header-title {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 18px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 26px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.month-data-title {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 18px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 26px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
.overall-strategy {
|
||||
width: 98%;
|
||||
padding: 20px 10px 20px 16px;
|
||||
background: var(--BG-100, #F7F8FA);
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
display: inline-flex;
|
||||
margin: 20px;
|
||||
|
||||
}
|
||||
|
||||
.placement-optimization-title {
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 16px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
.search-form {
|
||||
padding: 10px 24px 20px 24px;
|
||||
|
||||
}
|
||||
|
||||
.account-table {
|
||||
padding: 1px 24px 20px 24px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.month-data-body {
|
||||
width: 100%;
|
||||
padding-bottom: 20px;
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
background: var(--BG-white, white);
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
outline: 1px var(--BG-300, #E6E6E8) solid;
|
||||
outline-offset: -1px;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
display: inline-flex;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.month-body-div {
|
||||
align-self: stretch;
|
||||
height: 64px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
display: inline-flex
|
||||
}
|
||||
|
||||
.placement-optimization-str {
|
||||
align-self: stretch;
|
||||
color: var(--Text-2, #3C4043);
|
||||
font-size: 14px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
|
||||
.player-title {
|
||||
margin: 10px 0px 15px 20px;
|
||||
color: var(--Text-1, #211F24);
|
||||
font-size: 16px;
|
||||
font-family: PuHuiTi-Medium;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
word-wrap: break-word
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user