修改element版本 调整高度样式
This commit is contained in:
parent
94e77b6c6d
commit
b189b64650
@ -5,7 +5,7 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.png">
|
<link rel="icon" href="<%= BASE_URL %>favicon.png">
|
||||||
<link rel="stylesheet" href="https://cdn.bootcss.com/element-ui/2.12.0/theme-chalk/index.css">
|
<link rel="stylesheet" href="https://cdn.bootcss.com/element-ui/2.7.2/theme-chalk/index.css">
|
||||||
<link href="https://cdn.bootcss.com/nprogress/0.2.0/nprogress.min.css" rel="stylesheet">
|
<link href="https://cdn.bootcss.com/nprogress/0.2.0/nprogress.min.css" rel="stylesheet">
|
||||||
<title><%= webpackConfig.name %></title>
|
<title><%= webpackConfig.name %></title>
|
||||||
<script src="/static/inflate.min.js"></script>
|
<script src="/static/inflate.min.js"></script>
|
||||||
@ -17,9 +17,9 @@
|
|||||||
<script src="https://cdn.bootcss.com/vue-router/3.0.6/vue-router.min.js"></script>
|
<script src="https://cdn.bootcss.com/vue-router/3.0.6/vue-router.min.js"></script>
|
||||||
<script src="https://cdn.bootcss.com/nprogress/0.2.0/nprogress.min.js"></script>
|
<script src="https://cdn.bootcss.com/nprogress/0.2.0/nprogress.min.js"></script>
|
||||||
|
|
||||||
<script src="https://cdn.bootcss.com/element-ui/2.12.0/index.js"></script>
|
<script src="https://cdn.bootcss.com/element-ui/2.7.2/index.js"></script>
|
||||||
<script src="https://cdn.bootcss.com/element-ui/2.12.0/locale/en.min.js"></script>
|
<script src="https://cdn.bootcss.com/element-ui/2.7.2/locale/en.min.js"></script>
|
||||||
<script src="https://cdn.bootcss.com/element-ui/2.12.0/locale/zh-CN.min.js"></script>
|
<script src="https://cdn.bootcss.com/element-ui/2.7.2/locale/zh-CN.min.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
|
@ -531,11 +531,7 @@ export default {
|
|||||||
$menuItemPadding: 5px;
|
$menuItemPadding: 5px;
|
||||||
|
|
||||||
#PlanMenuBar {
|
#PlanMenuBar {
|
||||||
z-index: 10;
|
|
||||||
position: absolute;
|
|
||||||
top: $top;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: $height;
|
|
||||||
line-height: $height;
|
line-height: $height;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
ref="table"
|
ref="table"
|
||||||
:data="config.data"
|
:data="config.data"
|
||||||
:highlight-current-row="config.highlightCurrentRow"
|
:highlight-current-row="config.highlightCurrentRow"
|
||||||
:height="height"
|
class="table_box"
|
||||||
:show-header="config.showHeader"
|
:show-header="config.showHeader"
|
||||||
border
|
border
|
||||||
@current-change="handleChange"
|
@current-change="handleChange"
|
||||||
@ -33,10 +33,6 @@
|
|||||||
export default {
|
export default {
|
||||||
name: 'DataTable',
|
name: 'DataTable',
|
||||||
props: {
|
props: {
|
||||||
height: {
|
|
||||||
type: Number,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
config: {
|
config: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: true
|
required: true
|
||||||
@ -89,8 +85,8 @@ export default {
|
|||||||
border: 1px solid #B6BCCC !important;
|
border: 1px solid #B6BCCC !important;
|
||||||
border-bottom: 2px solid #B6BCCC !important;
|
border-bottom: 2px solid #B6BCCC !important;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
height: $height;
|
height: 20px;
|
||||||
line-height: $height;
|
line-height: 20px;
|
||||||
.title{
|
.title{
|
||||||
float: left;
|
float: left;
|
||||||
color: #000;
|
color: #000;
|
||||||
@ -99,6 +95,10 @@ export default {
|
|||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.table_box{
|
||||||
|
height: calc(100% - 20px);
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
/deep/ {
|
/deep/ {
|
||||||
.el-table--border th.gutter {
|
.el-table--border th.gutter {
|
||||||
@ -106,7 +106,6 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.el-table {
|
.el-table {
|
||||||
overflow-y: hidden;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
th.is-leaf {
|
th.is-leaf {
|
||||||
|
@ -1,21 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
|
<div id="PlanSchedule">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<div :id="runPlanId" />
|
<div :id="runPlanId" />
|
||||||
</div>
|
</div>
|
||||||
<div v-show="showTrain" class="position">
|
<div v-show="showTrain" class="position">
|
||||||
<data-table
|
<data-table
|
||||||
ref="serviceTable"
|
ref="serviceTable"
|
||||||
:height="(height - 45)/2"
|
class="data_table_box"
|
||||||
:config="serviceNumberConfig"
|
:config="serviceNumberConfig"
|
||||||
:style="{top: top-(height - 45)/2+'px'}"
|
|
||||||
@touch="scheduleTouch"
|
@touch="scheduleTouch"
|
||||||
/>
|
/>
|
||||||
<data-table
|
<data-table
|
||||||
ref="tripTable"
|
ref="tripTable"
|
||||||
:height="height/2"
|
class="data_table_box"
|
||||||
:config="tripNumberConfig"
|
:config="tripNumberConfig"
|
||||||
:style="{top: top-height/2+'px'}"
|
|
||||||
@touch="trainNumTouch"
|
@touch="trainNumTouch"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@ -275,10 +273,10 @@ export default {
|
|||||||
const serviceNumber = this.$store.state.runPlan.selected.serviceNumber;
|
const serviceNumber = this.$store.state.runPlan.selected.serviceNumber;
|
||||||
let tripNumber = null;
|
let tripNumber = null;
|
||||||
if (row) {
|
if (row) {
|
||||||
const data = [];
|
// const data = [];
|
||||||
tripNumber = row.tripNumber;
|
tripNumber = row.tripNumber;
|
||||||
const op = this.myChart.getOption();
|
const op = this.myChart.getOption();
|
||||||
debugger;
|
// debugger;
|
||||||
// op.series.forEach(item => {
|
// op.series.forEach(item => {
|
||||||
// if (item.name == serviceNumber) {
|
// if (item.name == serviceNumber) {
|
||||||
// item.data.forEach(nor => {
|
// item.data.forEach(nor => {
|
||||||
@ -592,8 +590,9 @@ export default {
|
|||||||
|
|
||||||
#PlanSchedule {
|
#PlanSchedule {
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
height: calc(100% - 45px);
|
||||||
|
position: relative;
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@ -603,10 +602,13 @@ export default {
|
|||||||
|
|
||||||
.position {
|
.position {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 2px;
|
top: 0px;
|
||||||
right: 50px;
|
right: 50px;
|
||||||
width: 220px;
|
width: 220px;
|
||||||
height: calc(100% - 45px);
|
height: calc(100% - 45px);
|
||||||
}
|
}
|
||||||
|
.data_table_box{
|
||||||
|
height: 50%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user