ehs_tanghHe
/
tanghe-report
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

样式修改

Browse Source
yanzili 3 years ago
parent e625fb1e32
commit 4946f68686
2 changed files with 102 additions and 55 deletions
Show Stats Download Patch File Download Diff File

128
report-ui/src/views/report/bigscreen/designer/index.vue
Unescape Escape View File

@ -46,15 +46,34 @@
<div class="layout-left-fold" <div class="layout-left-fold"
:style="{ width: widthLeftForToolsHideButton + 'px' }" :style="{ width: widthLeftForToolsHideButton + 'px' }"
@click="toolIsShow = !toolIsShow"> @click="toolIsShow = !toolIsShow">
<i class="iconfont iconzhankai" /> <i class="el-icon-arrow-right" />
</div> </div>
<div class="layout-middle" <div class="layout-middle"
:style="{ width: middleWidth + 'px', height: middleHeight + 'px' }"> :style="{ width: middleWidth + 'px', height: middleHeight + 'px' }">
<div class="top-button"> <div class="top-button">
<span class="btn border-right">
<span class="btn">
<el-tooltip class="item"
effect="dark"
content="保存"
placement="bottom">
<i class="iconfont iconsave"
@click="saveData"></i>
</el-tooltip>
</span>
<span class="btn">
<el-tooltip class="item"
effect="dark"
content="预览"
placement="bottom">
<i class="iconfont iconyulan"
@click="viewScreen"></i>
</el-tooltip>
</span>
<span class="btn border-left">
<ul class="nav"> <ul class="nav">
<li><i class="el-icon-brush"></i> <li><i class="el-icon-brush"></i><i class="el-icon-arrow-down"></i>
<ul> <ul>
<li> <li>
<div><i class="el-icon-full-screen mr10"></i>边框 <i class="el-icon-arrow-right ml20"></i></div> <div><i class="el-icon-full-screen mr10"></i>边框 <i class="el-icon-arrow-right ml20"></i></div>
@ -75,22 +94,21 @@
</ul> </ul>
</span> </span>
<span class="btn"> <span class="btn">
<el-tooltip class="item" <ul class="nav">
effect="dark" <li><i class="el-icon-refresh"></i><i class="el-icon-arrow-down"></i>
content="保存" <ul>
placement="bottom"> <li>
<i class="iconfont iconsave" <div><i class="el-icon-refresh-left mr10"></i>10秒</div>
@click="saveData"></i> </li>
</el-tooltip> <li>
</span> <div><i class="el-icon-refresh-left mr10"></i>60秒</div>
<span class="btn"> </li>
<el-tooltip class="item" <li>
effect="dark" <div><i class="el-icon-refresh-left mr10"></i>300秒</div>
content="预览" </li>
placement="bottom"> </ul>
<i class="iconfont iconyulan" </li>
@click="viewScreen"></i> </ul>
</el-tooltip>
</span> </span>
</div> </div>
<div class="workbench-container" <div class="workbench-container"
@ -640,7 +658,13 @@ export default {
margin-left: 20px; margin-left: 20px;
} }
.border-right { .border-right {
border-right: 1px solid #566876; border-right: 1px solid #273b4d;
}
.border-left {
border-left: 1px solid #273b4d;
}
.el-icon-arrow-down {
font-size: 10px;
} }
.is-active { .is-active {
background: #31455d !important; background: #31455d !important;
@ -697,24 +721,18 @@ export default {
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
height: 100%; height: 100%;
-webkit-box-align: bottom;
-ms-flex-align: bottom;
align-items: bottom;
font-size: 12px; font-size: 12px;
overflow: hidden; overflow: hidden;
background-color: #455766; background-color: #242a30;
cursor: pointer; cursor: pointer;
padding-top: 26%;
i { i {
font-size: 22px; font-size: 18px;
width: 18px; width: 18px;
height: 23px; height: 23px;
margin-left: 0px; margin-left: 0px;
color: #5a83bb; color: #bfcbd9;
transform: rotate(180deg);
-ms-transform: rotate(180deg); /* IE 9 */
-moz-transform: rotate(180deg); /* Firefox */
-webkit-transform: rotate(180deg); /* Safari 和 Chrome */
-o-transform: rotate(180deg); /* Opera */
} }
} }
@ -723,10 +741,10 @@ export default {
position: relative; position: relative;
//width: calc(100% - 445px); //width: calc(100% - 445px);
height: 100%; height: 100%;
background-color: #455766; background-color: rgb(36, 42, 48);
box-sizing: border-box; box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
border: 1px solid #455766; border: 1px solid rgb(36, 42, 48);
align-items: center; align-items: center;
vertical-align: middle; vertical-align: middle;
.top-button { .top-button {
@ -736,11 +754,30 @@ export default {
line-height: 40px; line-height: 40px;
margin-left: 9px; margin-left: 9px;
.btn { .btn {
color: #cde8ff; color: #788994;
width: 36px; width: 45px;
text-align: center; text-align: center;
display: block; display: block;
cursor: pointer; cursor: pointer;
.el-icon-arrow-down {
transform: rotate(0deg);
-ms-transform: rotate(0deg); /* IE 9 */
-moz-transform: rotate(0deg); /* Firefox */
-webkit-transform: rotate(0deg); /* Safari 和 Chrome */
-o-transform: rotate(0deg); /* Opera */
transition: all 0.4s ease-in-out;
}
&:hover {
background: rgb(25, 29, 34);
.el-icon-arrow-down {
transform: rotate(180deg);
-ms-transform: rotate(180deg); /* IE 9 */
-moz-transform: rotate(180deg); /* Firefox */
-webkit-transform: rotate(180deg); /* Safari 和 Chrome */
-o-transform: rotate(180deg); /* Opera */
transition: all 0.4s ease-in-out;
}
}
} }
} }
.workbench-container { .workbench-container {
@ -779,7 +816,7 @@ export default {
.el-tabs__header { .el-tabs__header {
.el-tabs__nav { .el-tabs__nav {
.el-tabs__item { .el-tabs__item {
background-color: #31455d; background-color: #242f3b;
border: 0px; border: 0px;
} }
.el-tabs__item.is-active { .el-tabs__item.is-active {
@ -788,7 +825,7 @@ export default {
} }
} }
.el-tabs__content { .el-tabs__content {
background-color: #263445; background-color: #242a30;
height: calc(100vh - 39px); height: calc(100vh - 39px);
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
@ -859,7 +896,7 @@ li {
clear: both; clear: both;
} }
.nav li { .nav li {
width: 40px; width: 45px;
text-align: center; text-align: center;
position: relative; position: relative;
} }
@ -871,7 +908,7 @@ li {
text-decoration: none; text-decoration: none;
} }
.nav li:hover { .nav li:hover {
color: #6dc5ff; color: #788994;
} }
.nav li ul { .nav li ul {
visibility: hidden; visibility: hidden;
@ -881,7 +918,7 @@ li {
top: 38px; top: 38px;
left: 0; left: 0;
padding: 0; padding: 0;
background-color: #263445; background-color: rgb(36, 42, 48);
opacity: 0; opacity: 0;
_margin: 0; _margin: 0;
width: 120px; width: 120px;
@ -891,6 +928,9 @@ li {
opacity: 1; opacity: 1;
visibility: visible; visibility: visible;
margin: 0; margin: 0;
li:hover {
background-color: rgb(25, 29, 34);
}
} }
.nav ul li { .nav ul li {
float: left; float: left;
@ -906,6 +946,7 @@ li {
float: none; float: none;
height: 120px; height: 120px;
border: 1px solid #30445c; border: 1px solid #30445c;
background-color: rgb(25, 29, 34);
transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
} }
.nav ul a:hover { .nav ul a:hover {
@ -921,7 +962,6 @@ li {
height: 300px; height: 300px;
overflow: auto; overflow: auto;
padding: 10px; padding: 10px;
box-shadow: -1px 0 0 #30445c;
_margin: 0; _margin: 0;
} }
.nav ul ul li { .nav ul ul li {
@ -931,4 +971,10 @@ li {
display: block; display: block;
float: left; float: left;
} }
/deep/.vue-ruler-h {
opacity: 0.3;
}
/deep/.vue-ruler-v {
opacity: 0.3;
}
</style> </style>

29
report-ui/src/views/report/report/index.vue
Unescape Escape View File

@ -140,14 +140,15 @@
:model="dialogForm" :model="dialogForm"
:rules="rules" :rules="rules"
size="small" size="small"
style="min-height:200px"
label-width="100px"> label-width="100px">
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :xs="24" <!-- <el-col :xs="24"
:sm="20" :sm="20"
:md="6" :md="6"
:lg="6" :lg="6"
:xl="6"> :xl="6"> -->
<!-- <el-form-item label="报表类型"> <!-- <el-form-item label="报表类型">
<el-select v-model="dialogForm.reportType" <el-select v-model="dialogForm.reportType"
placeholder="报表类型" placeholder="报表类型"
clearable> clearable>
@ -157,12 +158,12 @@
:value="item.id" /> :value="item.id" />
</el-select> </el-select>
</el-form-item> --> </el-form-item> -->
</el-col> <!-- </el-col> -->
<el-col :xs="24" <el-col :xs="24"
:sm="20" :sm="20"
:md="7" :md="12"
:lg="7" :lg="12"
:xl="7"> :xl="12">
<el-form-item label="名称" <el-form-item label="名称"
prop="reportName"> prop="reportName">
<el-input v-model="dialogForm.reportName" /> <el-input v-model="dialogForm.reportName" />
@ -170,22 +171,22 @@
</el-col> </el-col>
<el-col :xs="24" <el-col :xs="24"
:sm="20" :sm="20"
:md="7" :md="12"
:lg="7" :lg="12"
:xl="7"> :xl="12">
<el-form-item label="报表编码" <el-form-item label="报表编码"
prop="reportCode"> prop="reportCode">
<el-input v-model="dialogForm.reportCode" /> <el-input v-model="dialogForm.reportCode" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <!-- <el-row>
<el-col :xs="24" <el-col :xs="24"
:sm="20" :sm="20"
:md="6" :md="6"
:lg="6" :lg="6"
:xl="6"> :xl="6">
<!-- <el-form-item label="分组"> <el-form-item label="分组">
<el-select v-model="dialogForm.reportGroup" <el-select v-model="dialogForm.reportGroup"
placeholder="请选择" placeholder="请选择"
clearable> clearable>
@ -194,9 +195,9 @@
:label="item.text" :label="item.text"
:value="item.id" /> :value="item.id" />
</el-select> </el-select>
</el-form-item> --> </el-form-item>
</el-col> </el-col>
</el-row> </el-row> -->
<el-col :span="24"> <el-col :span="24">
<el-form-item label="备注"> <el-form-item label="备注">
<el-input v-model="dialogForm.reportDesc" <el-input v-model="dialogForm.reportDesc"

Write Preview
Loading…
Cancel
Save