弹框样式调整
This commit is contained in:
parent
8e964622fb
commit
b1dab92965
|
|
@ -40,5 +40,80 @@ export default {
|
||||||
.el-form-item__label {
|
.el-form-item__label {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.el-table th {
|
||||||
|
// #253855 #30619B 背景色从上到下渐变
|
||||||
|
background: linear-gradient(to bottom, #2B313D, #3267A7);
|
||||||
|
color: #fff;
|
||||||
|
border-bottom: 1px solid #84FCFD !important;
|
||||||
|
}
|
||||||
|
.el-table tr {
|
||||||
|
background-color: #335684;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.el-table--striped .el-table__body tr.el-table__row--striped td {
|
||||||
|
background-color: #25447D;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.el-table td,.building-top .el-table th.is-leaf {
|
||||||
|
border-bottom: 1px solid #6983A5;
|
||||||
|
}
|
||||||
|
.el-table::before{
|
||||||
|
border-bottom: 1px solid #6983A5;
|
||||||
|
background-color: #6983A5;
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
.el-table--enable-row-hover .el-table__body tr:hover>td {
|
||||||
|
background-color: #6983A5;
|
||||||
|
}
|
||||||
|
.el-pagination__total {
|
||||||
|
color: #E1E3E6;
|
||||||
|
}
|
||||||
|
.el-pagination__jump {
|
||||||
|
color: #E1E3E6;
|
||||||
|
}
|
||||||
|
.el-input__inner {
|
||||||
|
background-color: transparent;
|
||||||
|
border: 1px solid #77E2E7;
|
||||||
|
color: #E1E3E6;
|
||||||
|
}
|
||||||
|
.el-pagination__sizes .el-input .el-input__inner {
|
||||||
|
color: #E3E4E7;
|
||||||
|
border: 1px solid #E3E4E7;
|
||||||
|
}
|
||||||
|
.el-pagination__editor.el-input .el-input__inner {
|
||||||
|
color: #E3E4E7;
|
||||||
|
border: 1px solid #E3E4E7;
|
||||||
|
}
|
||||||
|
.el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li {
|
||||||
|
color: #E3E4E7;
|
||||||
|
border: 1px solid #E3E4E7;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
.el-pagination.is-background .btn-next {
|
||||||
|
color: #E3E4E7;
|
||||||
|
border: 1px solid #E3E4E7;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
.el-pagination.is-background .el-pager li:not(.disabled).active {
|
||||||
|
background-color: #98F4FB;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
.el-button--primary {
|
||||||
|
background-color: #84FCFD;
|
||||||
|
border: #84FCFD;
|
||||||
|
color: #285050;
|
||||||
|
}
|
||||||
|
.el-button--default {
|
||||||
|
background-color: transparent;
|
||||||
|
border: 1px solid #84FCFD;
|
||||||
|
color: #D5D6DA;
|
||||||
|
}
|
||||||
|
.el-table__empty-block {
|
||||||
|
background-color: #335684;
|
||||||
|
.el-table__empty-text {
|
||||||
|
color: #D5D6DA;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,7 @@
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
@size-change="handleSizeChange"
|
@size-change="handleSizeChange"
|
||||||
@current-change="handleCurrentChange"
|
@current-change="handleCurrentChange"
|
||||||
|
style="color: #E1E3E6;"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -106,7 +107,7 @@ export default {
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.pagination-container {
|
.pagination-container {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
background: #fff;
|
/* background: #fff; */
|
||||||
/* padding: 32px 16px; */
|
/* padding: 32px 16px; */
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: end;
|
justify-content: end;
|
||||||
|
|
|
||||||
|
|
@ -11,13 +11,13 @@
|
||||||
<el-form :model="formData" ref="form" label-width="80px" :inline="false" size="small" inline width="100%">
|
<el-form :model="formData" ref="form" label-width="80px" :inline="false" size="small" inline width="100%">
|
||||||
<el-row >
|
<el-row >
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item class="formItem" label="维修情况" size="small">
|
<el-form-item class="formItem" size="small">
|
||||||
<div class="chart" id="fixPieChart" ref="pieChart"></div>
|
<div class="chart" id="fixPieChart" ref="pieChart"></div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item class="formItem" label=" 配件使用情况" label-width="110px" size="small">
|
<el-form-item class="formItem" size="small">
|
||||||
<div class="chart" id="fixBarChart"></div>
|
<div class="chart" id="fixBarChart"></div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -53,7 +53,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -76,9 +76,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -230,6 +230,9 @@ export default {
|
||||||
barData.seriesData.push(item.partNum)
|
barData.seriesData.push(item.partNum)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
if (barData.yAxisData.length > 5) barData.yAxisData = barData.yAxisData.slice(0, 5)
|
||||||
|
if(barData.seriesData.length > 5) barData.seriesData = barData.seriesData.slice(0, 5)
|
||||||
console.log('🚀 ~ getChart ~ barData:', barData);
|
console.log('🚀 ~ getChart ~ barData:', barData);
|
||||||
this.myPieChart(pieData)
|
this.myPieChart(pieData)
|
||||||
this.myBarChart(barData)
|
this.myBarChart(barData)
|
||||||
|
|
@ -240,6 +243,7 @@ export default {
|
||||||
let option = {
|
let option = {
|
||||||
color: ['#E89E42', '#ABF04B', '#C7352A'],
|
color: ['#E89E42', '#ABF04B', '#C7352A'],
|
||||||
title: {
|
title: {
|
||||||
|
text: ' 维修情况',
|
||||||
subtext: '',
|
subtext: '',
|
||||||
left: 'left',
|
left: 'left',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
|
|
@ -291,6 +295,7 @@ export default {
|
||||||
color: '#fff'
|
color: '#fff'
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
|
text: ' 配件使用情况',
|
||||||
subtext: '',
|
subtext: '',
|
||||||
left: 'left',
|
left: 'left',
|
||||||
textStyle: {
|
textStyle: {
|
||||||
|
|
@ -358,12 +363,14 @@ export default {
|
||||||
.content{
|
.content{
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
.el-row {
|
.el-row {
|
||||||
.formItem {
|
.formItem {
|
||||||
font-size: 20px !important;
|
|
||||||
background-image: url('../../assets/img/dialog/Heading.png');
|
background-image: url('../../assets/img/dialog/Heading.png');
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: 0 10px;
|
background-position: 0 10px;
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
|
.el-form--inline .el-form-item__label {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
.chart {
|
.chart {
|
||||||
width: 39vw;
|
width: 39vw;
|
||||||
height: 400px;
|
height: 400px;
|
||||||
|
|
@ -373,4 +380,7 @@ export default {
|
||||||
margin-left: 60px;
|
margin-left: 60px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.el-form-item__label {
|
||||||
|
font-size: large !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -48,7 +48,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -71,9 +71,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -48,9 +48,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -48,9 +48,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -62,9 +62,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -39,7 +39,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -62,9 +62,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -48,7 +48,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -71,9 +71,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -48,7 +48,7 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<el-table :data="tableData" style="width: 100%">
|
<el-table :data="tableData" style="width: 100%" stripe>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
v-for="item in tableColumn"
|
v-for="item in tableColumn"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
|
|
@ -82,9 +82,9 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<span slot="footer" class="dialog-footer">
|
<!-- <span slot="footer" class="dialog-footer">
|
||||||
<el-button @click="open = false">关 闭</el-button>
|
<el-button @click="open = false">关 闭</el-button>
|
||||||
</span>
|
</span> -->
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue