修改element版本 调整高度样式

This commit is contained in:
zyy 2019-11-14 17:06:00 +08:00
parent 94e77b6c6d
commit b189b64650
4 changed files with 22 additions and 25 deletions

View File

@ -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>

View File

@ -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;
} }

View File

@ -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 {

View File

@ -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>