|
|
@@ -0,0 +1,188 @@
|
|
|
+<template>
|
|
|
+ <div class="table-wrapper">
|
|
|
+ <div class="table-box">
|
|
|
+ <el-table
|
|
|
+ :cell-style="{border:0,color:'#fff'}"
|
|
|
+ :data="tableData"
|
|
|
+ :header-cell-style="{color:'#fff'}"
|
|
|
+ :row-style="{backgroundColor:'rgb(4,66,115,0.3)'}"
|
|
|
+ size="mini"
|
|
|
+ style="width: 1429px;font-size: 17px;background: none"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ label="场站名称"
|
|
|
+ prop="stationName"
|
|
|
+ width="230px"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ label="类别"
|
|
|
+ prop="type"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ label="计划值"
|
|
|
+ prop="plan">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ label="计算时刻"
|
|
|
+ prop="time">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ label="是否下发"
|
|
|
+ prop="status">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'Article-Index',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: {
|
|
|
+ taskNumber: '',
|
|
|
+ date: '',
|
|
|
+ current: 1,
|
|
|
+ size: 10
|
|
|
+ },
|
|
|
+ tableData: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {},
|
|
|
+ mounted() {
|
|
|
+ const tableDataList = require('../tabledata.json');
|
|
|
+ this.tableData = tableDataList.rqddjhList
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+
|
|
|
+
|
|
|
+body {
|
|
|
+ border: 0;
|
|
|
+ background-image: url(../Articles/img/bgc.png)
|
|
|
+}
|
|
|
+
|
|
|
+.table-wrapper {
|
|
|
+ width: 97%;
|
|
|
+ height: 100%;
|
|
|
+ padding-left: 2%;
|
|
|
+
|
|
|
+ .table-box {
|
|
|
+ min-height: 300px;
|
|
|
+ background-size: cover;
|
|
|
+ margin-top: 50px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ margin-left: 60px;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-form-item__label {
|
|
|
+ color: #fff;
|
|
|
+ font-size: 17px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-input__inner {
|
|
|
+ background-color: rgba(14, 73, 131);
|
|
|
+ border: 1px solid rgb(64, 153, 255);
|
|
|
+ height: 34px;
|
|
|
+ font-size: 17px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table__header {
|
|
|
+ background: url(../Articles/img/bg1.png);
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td {
|
|
|
+ background-color: rgb(103, 118, 49) !important
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-col {
|
|
|
+ padding: 0;
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-col:nth-child(1) {
|
|
|
+ width: 19%;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-col:nth-child(2) {
|
|
|
+ width: 22%;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-col:nth-child(3) {
|
|
|
+ width: 19%;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-col:nth-child(4) {
|
|
|
+ width: 19%;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-col:nth-child(5) {
|
|
|
+ width: 11%;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /deep/ .el-input__inner {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /deep/ .el-icon-arrow-up {
|
|
|
+ transform: rotateZ(0deg);
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ /deep/ .el-icon-arrow-up:before {
|
|
|
+ content: url(../Articles/img/xiala2.png);
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-input__prefix {
|
|
|
+ left: 75%;
|
|
|
+ padding-top: 3px;
|
|
|
+ width: 10%;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-icon-date:before {
|
|
|
+ content: url(../Articles/img/riqi.png);
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table__header tr {
|
|
|
+ background: url(../Articles/img/bg1.png);
|
|
|
+ height: 49px;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table th.el-table__cell {
|
|
|
+ background: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table__body {
|
|
|
+ -webkit-border-vertical-spacing: 13px; // 垂直间距
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-form-item__content {
|
|
|
+ text-align: left;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table, .el-table__expanded-cell {
|
|
|
+ background-color: rgb(1, 40, 81);
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
