Skip to content

M
mes-ui
Commit 6ea776ec authored by renjintao's avatar renjintao
Browse files
Options

index bg&&scrool

parent 66b7669d
Hide whitespace changes
Inline Side-by-side
Showing with 442 additions and 416 deletions
pages/demo/02/index.vue
View file @ 6ea776ec
<template> <template>
<div style="width:1860px;margin:0 auto;" class="divmain"> <div class="mainDivs">
<Row :gutter="24" index> <div style="width:1860px;margin:0 auto;" class="divmain">
<!--left--> <Row :gutter="24" index>
<Col span="5"> <!--left-->
<Card class="mt10" style="width:100%; box-shadow: 0 0 10px #ccc"> <Col span="5">
<p slot="title">实时行车异常列车</p> <Card class="mt10" style="width:100%; box-shadow: 0 0 10px #ccc">
<a href="#" slot="extra"> <p slot="title">实时行车异常列车</p>
<Icon type="ios-more" size="28" color="#888" /> <a href="#" slot="extra">
</a> <Icon type="ios-more" size="28" color="#888" />
<List :split="false"> </a>
<ListItem class="listBg"> <List :split="false">
<ListItemMeta title="坐便器不可用"> <ListItem class="listBg">
<template slot="description"> <ListItemMeta title="坐便器不可用">
<li class="fl">XX列08车</li> <template slot="description">
<li class="fr">07-22 14:26:36</li> <li class="fl">XX列08车</li>
</template> <li class="fr">07-22 14:26:36</li>
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
<ListItem class="listBg"> </ListItem>
<ListItemMeta title="换弓"> <ListItem class="listBg">
<template slot="description"> <ListItemMeta title="换弓">
<li class="fl">XX列08车</li> <template slot="description">
<li class="fr">07-22 14:26:36</li> <li class="fl">XX列08车</li>
</template> <li class="fr">07-22 14:26:36</li>
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
<ListItem class="listBg"> </ListItem>
<ListItemMeta title="牵引"> <ListItem class="listBg">
<template slot="description"> <ListItemMeta title="牵引">
<li class="fl">XX列08车</li> <template slot="description">
<li class="fr">07-22 14:26:36</li> <li class="fl">XX列08车</li>
</template> <li class="fr">07-22 14:26:36</li>
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
<ListItem class="listBg"> </ListItem>
<ListItemMeta title="牵引有效率丢失"> <ListItem class="listBg">
<template slot="description"> <ListItemMeta title="牵引有效率丢失">
<li class="fl">XX列08车</li> <template slot="description">
<li class="fr">07-22 14:26:36</li> <li class="fl">XX列08车</li>
</template> <li class="fr">07-22 14:26:36</li>
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
</List> </ListItem>
</Card> </List>
<Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;"> </Card>
<p slot="title">实时故障</p> <Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;">
<a href="#" slot="extra"> <p slot="title">实时故障</p>
<Icon type="ios-more" size="28" color="#888" /> <a href="#" slot="extra">
</a> <Icon type="ios-more" size="28" color="#888" />
<div style="background:#d2e6fa;border:#1c80e6 solid 1px;padding:4px;text-align:center;"> </a>
涉及列车： <div style="background:#d2e6fa;border:#1c80e6 solid 1px;padding:4px;text-align:center;">
<span class="f18 fwBold">2</span>个路局 涉及列车：
<span class="f18 fwBold">4</span>个车型的 <span class="f18 fwBold">2</span>个路局
<span class="f18 fwBold">9</span>列车 <span class="f18 fwBold">4</span>个车型的
</div> <span class="f18 fwBold">9</span>列车
<List> </div>
<ListItem> <List>
<ListItemMeta> <ListItem>
<template slot="title"> <ListItemMeta>
<Icon type="ios-square" size="18" color="#ff7976" /> <template slot="title">
<span style="color:#ff7976" class="f18">10</span>列：XX局 <Icon type="ios-square" size="18" color="#ff7976" />
<span class="f18 fwBold">5</span>个，XX局 <span style="color:#ff7976" class="f18">10</span>列：XX局
<span class="f18 fwBold">5</span>个 <span class="f18 fwBold">5</span>个，XX局
</template> <span class="f18 fwBold">5</span>个
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
<ListItem> </ListItem>
<ListItemMeta> <ListItem>
<template slot="title"> <ListItemMeta>
<Icon type="ios-square" size="18" color="#ff7976" /> <template slot="title">
<span style="color:#ff7976" class="f18">10</span>列：XX局 <Icon type="ios-square" size="18" color="#ff7976" />
<span class="f18 fwBold">5</span>个，XX局 <span style="color:#ff7976" class="f18">10</span>列：XX局
<span class="f18 fwBold">5</span>个 <span class="f18 fwBold">5</span>个，XX局
</template> <span class="f18 fwBold">5</span>个
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
<ListItem> </ListItem>
<ListItemMeta> <ListItem>
<template slot="title"> <ListItemMeta>
<Icon type="ios-square" size="18" color="#ffa126" /> <template slot="title">
<span style="color:#ffa126" class="f18">10</span>列：XX局 <Icon type="ios-square" size="18" color="#ffa126" />
<span class="f18 fwBold">5</span>个，XX局 <span style="color:#ffa126" class="f18">10</span>列：XX局
<span class="f18 fwBold">5</span>个 <span class="f18 fwBold">5</span>个，XX局
</template> <span class="f18 fwBold">5</span>个
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
<ListItem> </ListItem>
<ListItemMeta> <ListItem>
<template slot="title"> <ListItemMeta>
<Icon type="ios-square" size="18" color="#1c80e6" /> <template slot="title">
<span style="color:#1c80e6" class="f18">10</span>列：XX局 <Icon type="ios-square" size="18" color="#1c80e6" />
<span class="f18 fwBold">5</span>个，XX局 <span style="color:#1c80e6" class="f18">10</span>列：XX局
<span class="f18 fwBold">5</span>个 <span class="f18 fwBold">5</span>个，XX局
</template> <span class="f18 fwBold">5</span>个
</ListItemMeta> </template>
</ListItem> </ListItemMeta>
</List> </ListItem>
<div> </List>
<Echart1 /> <div>
</div> <Echart1 />
</Card> </div>
</Col> </Card>
<Col span="15"> </Col>
<Row class="mt20"> <Col span="15">
<Col span="12" class="tc"> <Row class="mt20">
今日在修： <Col span="12" class="tc">
<span class="f30 fwBold mr20">21</span> 今日在修：
今日出库： <span class="f30 fwBold mr20">21</span>
<span class="f30 fwBold mr20">2</span> 今日出库：
<span class="ml20">温度：20°c</span> <span class="f30 fwBold mr20">2</span>
<span class="ml20">湿度：50%</span> <span class="ml20">温度：20°c</span>
</Col> <span class="ml20">湿度：50%</span>
<Col span="12" class="tc"> </Col>
<Icon type="md-alert" color="#ed4014" size="24" /> <Col span="12" class="tc">
<span class="ml5 mr15">有故障</span> <Icon type="md-alert" color="#ed4014" size="24" />
<Icon type="md-checkmark-circle" color="#19be6b" size="24" /> <span class="ml5 mr15">有故障</span>
<span class="ml5 mr15">无故障</span> <Icon type="md-checkmark-circle" color="#19be6b" size="24" />
<Icon type="md-checkmark-circle" color="#2d8cf0" size="24" /> <span class="ml5 mr15">无故障</span>
<span class="ml5 mr15">故障已处理</span> <Icon type="md-checkmark-circle" color="#2d8cf0" size="24" />
</Col> <span class="ml5 mr15">故障已处理</span>
</Row> </Col>
<!--1--> </Row>
<Row class="mt50"> <!--1-->
<Col span="24" style="height:150px;" class="pl30"> <Row class="mt50">
<Train :row="dataGreen1" @on-ok="drawerRight = true" class="fl"></Train> <Col span="24" style="height:150px;" class="pl30">
<Train :row="dataGreen2" @on-ok="drawerRight = true" class="fl"></Train> <Train :row="dataGreen1" @on-ok="drawerRight = true" class="fl"></Train>
</Col> <Train :row="dataGreen2" @on-ok="drawerRight = true" class="fl"></Train>
</Row> </Col>
<!--2/3--> </Row>
<Row class="pl30"> <!--2/3-->
<Col span="24" style="height:150px"> <Row class="pl30">
<Train :row="dataGreen1"></Train> <Col span="24" style="height:150px">
</Col> <Train :row="dataGreen1"></Train>
</Row> </Col>
<Row class="pl30"> </Row>
<Col span="24" style="height:150px"> <Row class="pl30">
<Train :row="dataGreen1"></Train> <Col span="24" style="height:150px">
</Col> <Train :row="dataGreen1"></Train>
</Row> </Col>
<!--4/5--> </Row>
<Row class="pl30"> <!--4/5-->
<Col span="24" style="height:150px"> <Row class="pl30">
<Train :row="dataGray1" class="fl"></Train> <Col span="24" style="height:150px">
<Train :row="dataGray2" class="fl"></Train> <Train :row="dataGray1" class="fl"></Train>
</Col> <Train :row="dataGray2" class="fl"></Train>
</Row> </Col>
<Row class="pl30"> </Row>
<Col span="24" style="height:150px"> <Row class="pl30">
<Train :row="dataGray1"></Train> <Col span="24" style="height:150px">
</Col> <Train :row="dataGray1"></Train>
</Row> </Col>
<Row class="pl30 pr30"> </Row>
<Col span="24"> <Row class="pl30 pr30">
<Card style="width:100%" shadow class="mt30"> <Col span="24">
<p slot="title">轨侧设备数据监测</p> <Card style="width:100%" shadow class="mt30">
<Row :gutter="24" index> <p slot="title">轨侧设备数据监测</p>
<Col span="2" class="tr">运行</Col> <Row :gutter="24" index>
<Col span="7"> <Col span="2" class="tr">运行</Col>
<Progress :percent="100" :stroke-width="5" stroke-color="#2d8cf0"> <Col span="7">
<span style="color:#666">40台</span> <Progress :percent="100" :stroke-width="5" stroke-color="#2d8cf0">
</Progress> <span style="color:#666">40台</span>
</Col> </Progress>
<Col span="2" class="tr">未开机</Col> </Col>
<Col span="6"> <Col span="2" class="tr">未开机</Col>
<Progress :percent="100" :stroke-width="5" stroke-color="#ccc"> <Col span="6">
<span style="color:#666">32台</span> <Progress :percent="100" :stroke-width="5" stroke-color="#ccc">
</Progress> <span style="color:#666">32台</span>
</Col> </Progress>
<Col span="2" class="tr">报警</Col> </Col>
<Col span="4"> <Col span="2" class="tr">报警</Col>
<Progress :percent="100" :stroke-width="5" stroke-color="#ff0000"> <Col span="4">
<span style="color:#666">7台</span> <Progress :percent="100" :stroke-width="5" stroke-color="#ff0000">
</Progress> <span style="color:#666">7台</span>
</Col> </Progress>
</Row> </Col>
</Card> </Row>
</Col> </Card>
</Row> </Col>
</Col> </Row>
<Col span="4" class="colmain"> </Col>
<Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;"> <Col span="4" class="colmain">
<p slot="title">优秀员工</p> <Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;">
<p slot="title">优秀员工</p>
<Row class="mb30"> <Row class="mb30">
<Col span="8" class="tc"> <Col span="8" class="tc">
<div @mouseover="showInfo1" @mouseout="hideInfo1" class="hoverImg"> <div @mouseover="showInfo1" @mouseout="hideInfo1" class="hoverImg">
...@@ -201,101 +202,102 @@ ...@@ -201,101 +202,102 @@
</div> </div>
</Col> </Col>
</Row> </Row>
</Card> </Card>
<div v-show="avatarInfo1" class="divInfo"> <div v-show="avatarInfo1" class="divInfo">
<p>姓名：李志锋</p> <p>姓名：李志锋</p>
<p>班组：机务</p> <p>班组：机务</p>
<p>上榜理由：</p> <p>上榜理由：</p>
<p> <p>
&nbsp;&nbsp;&nbsp;&nbsp;上月工时排名第一。李志锋同志在上月工作中，不辞辛劳，任劳任怨，共完成工时298个工时，大大提高了班组的整体工作进度。 &nbsp;&nbsp;&nbsp;&nbsp;上月工时排名第一。李志锋同志在上月工作中，不辞辛劳，任劳任怨，共完成工时298个工时，大大提高了班组的整体工作进度。
为表彰先进，特评李志锋同志为2020年度第6期的“工时之星”光荣称号，以兹鼓励。 为表彰先进，特评李志锋同志为2020年度第6期的“工时之星”光荣称号，以兹鼓励。
</p> </p>
<p class="tc"> <p class="tc">
<img src="/images/honor1.png" /> <img src="/images/honor1.png" />
</p> </p>
</div> </div>
<div v-show="avatarInfo2" class="divInfo"> <div v-show="avatarInfo2" class="divInfo">
<p>姓名：刘菲菲</p> <p>姓名：刘菲菲</p>
<p>班组：乘务</p> <p>班组：乘务</p>
<p>上榜理由：</p> <p>上榜理由：</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;上月质量评比排名第一。刘菲菲同志在上月工作中，精益求精，认真细致，好评率100%，大大提高了乘务组的整体工作形象。</p> <p>&nbsp;&nbsp;&nbsp;&nbsp;上月质量评比排名第一。刘菲菲同志在上月工作中，精益求精，认真细致，好评率100%，大大提高了乘务组的整体工作形象。</p>
<p class="tc"> <p class="tc">
<img src="/images/honor2.png" /> <img src="/images/honor2.png" />
</p> </p>
</div>
<div v-show="avatarInfo3" class="divInfo">
<p>姓名：黄飞</p>
<p>班组：维修</p>
<p>上榜理由：</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;上月任务完成排名第一。黄飞同志在上月工作中，敏捷高效，勇猛精进，多项任务用时全组最少，大大提高了班组的整体工作效率，为优化工艺提供了可靠的参考。</p>
<p class="tc">
<img src="/images/honor3.png" />
</p>
</div>
<Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;">
<p slot="title">物料库房相关统计</p>
<div>
<Row>
<Col span="12">
<Echart2 :row="echart2data1" />
</Col>
<Col span="12">
<Echart2a :row="echart2data2" />
</Col>
<Col span="12">
<Echart2b :row="echart2data3" />
</Col>
<Col span="12">
<Echart2c :row="echart2data4" />
</Col>
</Row>
</div> </div>
</Card> <div v-show="avatarInfo3" class="divInfo">
<Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;"> <p>姓名：黄飞</p>
<p slot="title">任务执行状态统计</p> <p>班组：维修</p>
<div> <p>上榜理由：</p>
<Echart3 /> <p>&nbsp;&nbsp;&nbsp;&nbsp;上月任务完成排名第一。黄飞同志在上月工作中，敏捷高效，勇猛精进，多项任务用时全组最少，大大提高了班组的整体工作效率，为优化工艺提供了可靠的参考。</p>
<p class="tc">
<img src="/images/honor3.png" />
</p>
</div> </div>
</Card> <Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;">
<Drawer title="机车信息" v-model="drawerRight" width="330" :mask="false"> <p slot="title">物料库房相关统计</p>
<List :split="false"> <div>
<ListItem>车号：CR200J3004-3002</ListItem> <Row>
<ListItem>接车时间：20200714</ListItem> <Col span="12">
<ListItem>计划出库时间：20200715</ListItem> <Echart2 :row="echart2data1" />
<ListItem>任务类型：D1修</ListItem> </Col>
<ListItem>作业进度：</ListItem> <Col span="12">
<ListItem></ListItem> <Echart2a :row="echart2data2" />
<ListItem>接触网供电作业</ListItem> </Col>
<ListItem> <Col span="12">
<Progress :percent="100" :stroke-width="5" stroke-color="#2d8cf0" /> <Echart2b :row="echart2data3" />
</ListItem> </Col>
<ListItem>设施设备检查、试风实验、塞拉门实验</ListItem> <Col span="12">
<ListItem> <Echart2c :row="echart2data4" />
<Progress :percent="80" :stroke-width="5" stroke-color="#2d8cf0" /> </Col>
</ListItem> </Row>
<ListItem>动车组D1修有电作业</ListItem> </div>
<ListItem> </Card>
<Progress :percent="75" :stroke-width="5" stroke-color="#2d8cf0" /> <Card class="mt30" style="width:100%; box-shadow: 0 0 10px #ccc;">
</ListItem> <p slot="title">任务执行状态统计</p>
<ListItem>电务通讯设备状态有电检查</ListItem> <div>
<ListItem> <Echart3 />
<Progress :percent="40" :stroke-width="5" stroke-color="#2d8cf0" /> </div>
</ListItem> </Card>
<ListItem>车厢内部保洁整备</ListItem> <Drawer title="机车信息" v-model="drawerRight" width="330" :mask="false">
<ListItem> <List :split="false">
<Progress :percent="50" :stroke-width="5" stroke-color="#2d8cf0" /> <ListItem>车号：CR200J3004-3002</ListItem>
</ListItem> <ListItem>接车时间：20200714</ListItem>
<ListItem>出库联检、机务调车出库</ListItem> <ListItem>计划出库时间：20200715</ListItem>
<ListItem> <ListItem>任务类型：D1修</ListItem>
<Progress :percent="0" :stroke-width="5" stroke-color="#2d8cf0" /> <ListItem>作业进度：</ListItem>
</ListItem> <ListItem></ListItem>
</List> <ListItem>接触网供电作业</ListItem>
</Drawer> <ListItem>
</Col> <Progress :percent="100" :stroke-width="5" stroke-color="#2d8cf0" />
</Row> </ListItem>
<Row> <ListItem>设施设备检查、试风实验、塞拉门实验</ListItem>
<Col span="24" class="mb50">&nbsp;</Col> <ListItem>
</Row> <Progress :percent="80" :stroke-width="5" stroke-color="#2d8cf0" />
</ListItem>
<ListItem>动车组D1修有电作业</ListItem>
<ListItem>
<Progress :percent="75" :stroke-width="5" stroke-color="#2d8cf0" />
</ListItem>
<ListItem>电务通讯设备状态有电检查</ListItem>
<ListItem>
<Progress :percent="40" :stroke-width="5" stroke-color="#2d8cf0" />
</ListItem>
<ListItem>车厢内部保洁整备</ListItem>
<ListItem>
<Progress :percent="50" :stroke-width="5" stroke-color="#2d8cf0" />
</ListItem>
<ListItem>出库联检、机务调车出库</ListItem>
<ListItem>
<Progress :percent="0" :stroke-width="5" stroke-color="#2d8cf0" />
</ListItem>
</List>
</Drawer>
</Col>
</Row>
<Row>
<Col span="24" class="mb50">&nbsp;</Col>
</Row>
</div>
</div> </div>
</template> </template>
<script> <script>
...@@ -489,4 +491,14 @@ export default { ...@@ -489,4 +491,14 @@ export default {
.hoverImg :hover { .hoverImg :hover {
background: #ccc; background: #ccc;
} }
.mainDivs {
position: fixed;
width: 100%;
top: 90px;
left: 0;
right: 0;
background: #f5f6fa;
height: calc(100vh - 90px);
overflow: auto;
}
</style> </style>
\ No newline at end of file
pages/demo/06/index.vue
View file @ 6ea776ec
<template> <template>
<div style="width:1740px;margin:0 auto;"> <div class="mainDivs">
<Row class="mt20"> <div style="width:1740px;margin:0 auto;">
<Col span="12" class="tc"> <Row class="mt20">
今日在修： <Col span="12" class="tc">
<span class="f30 fwBold mr20">21</span> 今日在修：
今日出库： <span class="f30 fwBold mr20">21</span>
<span class="f30 fwBold mr20">2</span> 今日出库：
<span class="ml20">温度：20°c</span> <span class="f30 fwBold mr20">2</span>
<span class="ml20">湿度：50%</span> <span class="ml20">温度：20°c</span>
</Col> <span class="ml20">湿度：50%</span>
<Col span="12" class="tc"> </Col>
<Icon type="md-alert" color="#ed4014" size="24" /> <Col span="12" class="tc">
<span class="ml5 mr15">有故障</span> <Icon type="md-alert" color="#ed4014" size="24" />
<Icon type="md-checkmark-circle" color="#19be6b" size="24" /> <span class="ml5 mr15">有故障</span>
<span class="ml5 mr15">无故障</span> <Icon type="md-checkmark-circle" color="#19be6b" size="24" />
<Icon type="md-checkmark-circle" color="#2d8cf0" size="24" /> <span class="ml5 mr15">无故障</span>
<span class="ml5 mr15">故障已处理</span> <Icon type="md-checkmark-circle" color="#2d8cf0" size="24" />
</Col> <span class="ml5 mr15">故障已处理</span>
</Row> </Col>
<!--1--> </Row>
<Row class="mt50"> <!--1-->
<Col span="24" style="height:150px;"> <Row class="mt50">
<span class="fl trainTitles" style="color: #19be6b;">有电</span> <Col span="24" style="height:150px;">
<Train :row="dataGreen1" class="fl"></Train> <span class="fl trainTitles" style="color: #19be6b;">有电</span>
<Train :row="dataGreen2" class="fl"></Train> <Train :row="dataGreen1" class="fl"></Train>
</Col> <Train :row="dataGreen2" class="fl"></Train>
</Row> </Col>
<Row class="lh30"> </Row>
<Col span="4"> <Row class="lh30">
<span>接触网供电作业</span> <Col span="4">
</Col> <span>接触网供电作业</span>
<Col span="5"> </Col>
<Progress :percent="30.8" :stroke-width="5" /> <Col span="5">
</Col> <Progress :percent="30.8" :stroke-width="5" />
<Col span="3">&nbsp;</Col> </Col>
<Col span="4">设施设备检查、试风实验、塞拉门实验</Col> <Col span="3">&nbsp;</Col>
<Col span="5"> <Col span="4">设施设备检查、试风实验、塞拉门实验</Col>
<Progress :percent="30.8" :stroke-width="5" /> <Col span="5">
</Col> <Progress :percent="30.8" :stroke-width="5" />
<Col span="3">&nbsp;</Col> </Col>
<Col span="3">&nbsp;</Col>
<Col span="4"> <Col span="4">
<span>动车组D1修有电作业</span> <span>动车组D1修有电作业</span>
</Col> </Col>
<Col span="5"> <Col span="5">
<Progress :percent="52.8" :stroke-width="5" /> <Progress :percent="52.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4">电务通讯设备状态有电检查</Col> <Col span="4">电务通讯设备状态有电检查</Col>
<Col span="5"> <Col span="5">
<Progress :percent="52.8" :stroke-width="5" /> <Progress :percent="52.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4"> <Col span="4">
<span>车厢内部保洁整备</span> <span>车厢内部保洁整备</span>
</Col> </Col>
<Col span="5"> <Col span="5">
<Progress :percent="40.8" :stroke-width="5" /> <Progress :percent="40.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4">故障处理和加装改造</Col> <Col span="4">故障处理和加装改造</Col>
<Col span="5"> <Col span="5">
<Progress :percent="40.8" :stroke-width="5" /> <Progress :percent="40.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4"> <Col span="4">
<span>出库联检、机务调车出库</span> <span>出库联检、机务调车出库</span>
</Col> </Col>
<Col span="5"> <Col span="5">
<Progress :percent="40.8" :stroke-width="5" /> <Progress :percent="40.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
</Row> </Row>
<Divider /> <Divider />
<!--2--> <!--2-->
<Row> <Row>
<Col span="24" style="height:150px"> <Col span="24" style="height:150px">
<span class="fl trainTitles" style="color: #2d8cf0;">作业前准备</span> <Train :row="dataBlue" class="fl"></Train> <span class="fl trainTitles" style="color: #2d8cf0;">作业前准备</span>
</Col> <Train :row="dataBlue" class="fl"></Train>
</Row> </Col>
<Row class="lh30"> </Row>
<Col span="4"> <Row class="lh30">
<span>接触网断电作业</span> <Col span="4">
</Col> <span>接触网断电作业</span>
<Col span="5"> </Col>
<Progress :percent="30.8" :stroke-width="5" /> <Col span="5">
</Col> <Progress :percent="30.8" :stroke-width="5" />
<Col span="3">&nbsp;</Col> </Col>
<Col span="4">升弓验电</Col> <Col span="3">&nbsp;</Col>
<Col span="5"> <Col span="4">升弓验电</Col>
<Progress :percent="30.8" :stroke-width="5" /> <Col span="5">
</Col> <Progress :percent="30.8" :stroke-width="5" />
<Col span="3">&nbsp;</Col> </Col>
</Row> <Col span="3">&nbsp;</Col>
<Divider /> </Row>
<Divider />
<!--3--> <!--3-->
<Row> <Row>
<Col span="24" style="height:150px"> <Col span="24" style="height:150px">
<span class="fl trainTitles" style="color: #888;">无电</span><Train :row="dataGray" class="fl"></Train> <span class="fl trainTitles" style="color: #888;">无电</span>
</Col> <Train :row="dataGray" class="fl"></Train>
</Row> </Col>
<Row class="lh30"> </Row>
<Col span="4"> <Row class="lh30">
<span>静态检查及功能确认</span> <Col span="4">
</Col> <span>静态检查及功能确认</span>
<Col span="5"> </Col>
<Progress :percent="30.8" :stroke-width="5" /> <Col span="5">
</Col> <Progress :percent="30.8" :stroke-width="5" />
<Col span="3">&nbsp;</Col> </Col>
<Col span="4">动车组D1修无电作业</Col> <Col span="3">&nbsp;</Col>
<Col span="5"> <Col span="4">动车组D1修无电作业</Col>
<Progress :percent="30.8" :stroke-width="5" /> <Col span="5">
</Col> <Progress :percent="30.8" :stroke-width="5" />
<Col span="3">&nbsp;</Col> </Col>
<Col span="3">&nbsp;</Col>
<Col span="4"> <Col span="4">
<span>电务通讯设备状态静态检查及数据下载</span> <span>电务通讯设备状态静态检查及数据下载</span>
</Col> </Col>
<Col span="5"> <Col span="5">
<Progress :percent="52.8" :stroke-width="5" /> <Progress :percent="52.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4">车厢外皮及车内保洁</Col> <Col span="4">车厢外皮及车内保洁</Col>
<Col span="5"> <Col span="5">
<Progress :percent="52.8" :stroke-width="5" /> <Progress :percent="52.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4"> <Col span="4">
<span>故障处理和加装改造</span> <span>故障处理和加装改造</span>
</Col> </Col>
<Col span="5"> <Col span="5">
<Progress :percent="40.8" :stroke-width="5" /> <Progress :percent="40.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
<Col span="4">吸污上水、上沙</Col> <Col span="4">吸污上水、上沙</Col>
<Col span="5"> <Col span="5">
<Progress :percent="40.8" :stroke-width="5" /> <Progress :percent="40.8" :stroke-width="5" />
</Col> </Col>
<Col span="3">&nbsp;</Col> <Col span="3">&nbsp;</Col>
</Row> </Row>
<Row> <Row>
<Col span="24" class="mb50">&nbsp;</Col> <Col span="24" class="mb50">&nbsp;</Col>
</Row> </Row>
</div>
</div> </div>
</template> </template>
<script> <script>
...@@ -223,6 +227,16 @@ export default { ...@@ -223,6 +227,16 @@ export default {
}; };
</script> </script>
<style lang="less"> <style lang="less">
.mainDivs {
position: fixed;
width: 100%;
top: 90px;
left: 0;
right: 0;
background: #f5f6fa;
height: calc(100vh - 90px);
overflow:auto;
}
.trainTitles { .trainTitles {
line-height: 130px; line-height: 130px;
font-size: 18px; font-size: 18px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment