|
@@ -1,320 +1,407 @@
|
|
|
<template>
|
|
|
- <div class="stationPowerContro" :class="!theme ? 'themeDark' : 'themeLight'">
|
|
|
- <div class="stationPowerControSeach">
|
|
|
- <div class="seach_top">
|
|
|
- <div class="exceed">
|
|
|
- <span class="exceedName">时间:</span>
|
|
|
- <el-date-picker v-model="pickerTime" @change="changeTime" format="YYYY-MM-DD" type="date"
|
|
|
- placeholder="选择时间" />
|
|
|
- </div>
|
|
|
- <el-button type="primary" @click="seachData">计 算</el-button>
|
|
|
- <el-button @click="exportExcel">导 出</el-button>
|
|
|
- </div>
|
|
|
+ <div class="stationPowerContro" :class="!theme ? 'themeDark' : ''">
|
|
|
+ <div class="stationPowerControSeach">
|
|
|
+ <div class="seach_top">
|
|
|
+ <div class="exceed">
|
|
|
+ <span class="exceedName" style="x`">时间:</span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="pickerTime"
|
|
|
+ @change="changeTime"
|
|
|
+ format="YYYY-MM-DD"
|
|
|
+ type="date"
|
|
|
+ placeholder="选择时间"
|
|
|
+ />
|
|
|
</div>
|
|
|
- <div class="stationPowerControTable">
|
|
|
- <p class="tableTitle">{{titelMonth}}场站中长期电量未来40天预测</p>
|
|
|
- <span class="tableUnit">单位:m/s,万kwh</span>
|
|
|
- <div :style="tableHeight">
|
|
|
- <div class="tablestyle warn-table" style="margin-top: 10px">
|
|
|
- <!-- :span-method="mergeSameCells" -->
|
|
|
- <el-table :data="tableData" v-loading="loading" border style="width: 100%"
|
|
|
- :max-height="tableMainHeight" ref="stationPowerTable"
|
|
|
- element-loading-background="rgba(0,0,0,.5)" :header-cell-style="{ 'text-align': 'center' }">
|
|
|
- <el-table-column prop="name" label="名称" width="200" align="center" fixed>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="time" label="周期" width="73" align="center" fixed>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="日期" align="center">
|
|
|
- <el-table-column :prop="item.value" :label="item.label" align="center"
|
|
|
- v-for="(item, index) in tableColumn" :key="index">
|
|
|
- <template #default="scope">
|
|
|
- {{scope.row[scope.row.nameEn+(index+1)]}}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <el-button type="primary" @click="seachData">计 算</el-button>
|
|
|
+ <el-button @click="exportExcel">导 出</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="stationPowerControTable">
|
|
|
+ <p class="tableTitle">{{ titelMonth }}场站中长期电量未来40天预测</p>
|
|
|
+ <span class="tableUnit">单位:m/s,万kwh</span>
|
|
|
+ <div :style="tableHeight">
|
|
|
+ <div class="tablestyle warn-table" style="margin-top: 5px">
|
|
|
+ <!-- :span-method="mergeSameCells" -->
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ v-loading="loading"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ :max-height="tableMainHeight"
|
|
|
+ ref="stationPowerTable"
|
|
|
+ element-loading-background="rgba(0,0,0,.5)"
|
|
|
+ :header-cell-style="{ 'text-align': 'center', 'font-size': '12px' }"
|
|
|
+ :cell-style="{
|
|
|
+ 'font-size': '12px',
|
|
|
+ }"
|
|
|
+ :row-style="{ height: '23px' }"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="名称"
|
|
|
+ width="100"
|
|
|
+ align="center"
|
|
|
+ fixed
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <span
|
|
|
+ :style="`${
|
|
|
+ scope.row.time === '合计'
|
|
|
+ ? 'font-weight: 700; color: #1890ff;'
|
|
|
+ : ''
|
|
|
+ }`"
|
|
|
+ >{{ scope.row.name }}</span
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="time"
|
|
|
+ label="周期"
|
|
|
+ width="45"
|
|
|
+ align="center"
|
|
|
+ fixed
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <span
|
|
|
+ :style="`${
|
|
|
+ scope.row.time === '合计'
|
|
|
+ ? 'font-weight: 700; color: #1890ff;'
|
|
|
+ : ''
|
|
|
+ }`"
|
|
|
+ >{{ scope.row.time }}</span
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :prop="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ align="center"
|
|
|
+ width="45"
|
|
|
+ v-for="(item, index) in tableColumn"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <span
|
|
|
+ :style="`${
|
|
|
+ scope.row.time === '合计'
|
|
|
+ ? 'font-weight: 700; color: #1890ff;'
|
|
|
+ : ''
|
|
|
+ }`"
|
|
|
+ >{{ scope.row[scope.row.nameEn + (index + 1)] }}</span
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column label="日期" align="center">
|
|
|
+ <el-table-column
|
|
|
+ :prop="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ align="center"
|
|
|
+ v-for="(item, index) in tableColumn"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <span
|
|
|
+ :style="`${
|
|
|
+ scope.row.time === '合计'
|
|
|
+ ? 'font-weight: 700; color: #1890ff;'
|
|
|
+ : ''
|
|
|
+ }`"
|
|
|
+ >{{ scope.row[scope.row.nameEn + (index + 1)] }}</span
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column> -->
|
|
|
+ </el-table>
|
|
|
</div>
|
|
|
-
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {
|
|
|
- apiGetallStationPower
|
|
|
- } from "../../api/api";
|
|
|
+import { apiGetallStationPower } from "../../api/api";
|
|
|
|
|
|
- import jsonData from "./component/stationPowerControl.json";
|
|
|
- import dayjs from "dayjs";
|
|
|
- import * as XLSX from 'xlsx'
|
|
|
- import {
|
|
|
- saveAs
|
|
|
- } from 'file-saver'
|
|
|
- import * as XLSXD from 'xlsx-js-style'
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- loading: false,
|
|
|
- pickerTime: "",
|
|
|
- titelMonth: "",
|
|
|
- tableData: [],
|
|
|
- tableColumn: [],
|
|
|
- echartsTheme: "",
|
|
|
- theme: null,
|
|
|
+import jsonData from "./component/stationPowerControl.json";
|
|
|
+import dayjs from "dayjs";
|
|
|
+import * as XLSX from "xlsx";
|
|
|
+import { saveAs } from "file-saver";
|
|
|
+import * as XLSXD from "xlsx-js-style";
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ pickerTime: "",
|
|
|
+ titelMonth: "",
|
|
|
+ tableData: [],
|
|
|
+ tableColumn: [],
|
|
|
+ echartsTheme: "",
|
|
|
+ theme: null,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ "$store.state.theme": {
|
|
|
+ handler: function (newVal, oldVal) {
|
|
|
+ this.theme = newVal;
|
|
|
+ this.echartsTheme = !newVal ? "dark" : "";
|
|
|
+ // this.getStationData();
|
|
|
+ },
|
|
|
+ immediate: true,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.pickerTime = dayjs(new Date()).format("YYYY-MM-DD");
|
|
|
+ this.titelMonth =
|
|
|
+ this.pickerTime.split("-")[0] +
|
|
|
+ "年" +
|
|
|
+ this.pickerTime.split("-")[1] +
|
|
|
+ "月" +
|
|
|
+ this.pickerTime.split("-")[2] +
|
|
|
+ "日";
|
|
|
+ this.getStationData();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ tableHeight() {
|
|
|
+ let height = (document.documentElement.clientHeight - 190) / 2 + "px";
|
|
|
+ return {
|
|
|
+ width: "100%",
|
|
|
+ height: height,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ tableMainHeight() {
|
|
|
+ let height = document.documentElement.clientHeight - 180 + "px";
|
|
|
+ return height;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getStationData() {
|
|
|
+ let that = this;
|
|
|
+ that.loading = true;
|
|
|
+ let params = {
|
|
|
+ date: that.pickerTime,
|
|
|
+ };
|
|
|
+ apiGetallStationPower(params)
|
|
|
+ .then((res) => {
|
|
|
+ that.loading = false;
|
|
|
+ if (res && res.data) {
|
|
|
+ // that.tableData = res.data.power
|
|
|
+ res.data.power.forEach((iv) => {
|
|
|
+ let obj = {
|
|
|
+ name: iv.name,
|
|
|
+ nameEn: iv.nameEn,
|
|
|
+ time: iv.time,
|
|
|
+ };
|
|
|
+ iv.power.forEach((ic, idx) => {
|
|
|
+ obj[obj.nameEn + (idx + 1)] = ic.toFixed(2);
|
|
|
+ });
|
|
|
+ that.tableData.push(obj);
|
|
|
+ });
|
|
|
+ res.data.title.forEach((it, index) => {
|
|
|
+ let obj = {
|
|
|
+ label: it,
|
|
|
+ value: index,
|
|
|
+ };
|
|
|
+ that.tableColumn.push(obj);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ that.loading = false;
|
|
|
+ let tableColumn = [...Array(40).keys()].map((i) => i + 1);
|
|
|
+ tableColumn.forEach((it, index) => {
|
|
|
+ let obj = {
|
|
|
+ label: dayjs(this.pickerTime).add(it, "day").format("MM-DD"),
|
|
|
+ value: index,
|
|
|
};
|
|
|
- },
|
|
|
- watch: {
|
|
|
- "$store.state.theme": {
|
|
|
- handler: function (newVal, oldVal) {
|
|
|
- this.theme = newVal;
|
|
|
- this.echartsTheme = !newVal ? "dark" : "";
|
|
|
- // this.getStationData();
|
|
|
- },
|
|
|
- immediate: true,
|
|
|
- },
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.pickerTime = dayjs(new Date()).format("YYYY-MM-DD")
|
|
|
- this.titelMonth = this.pickerTime.split("-")[0] + "年" + this.pickerTime.split("-")[1] + "月" + this
|
|
|
- .pickerTime.split("-")[2] + "日"
|
|
|
- this.getStationData();
|
|
|
- },
|
|
|
- computed: {
|
|
|
- tableHeight() {
|
|
|
- let height = (document.documentElement.clientHeight - 190) / 2 + "px";
|
|
|
- return {
|
|
|
- width: "100%",
|
|
|
- height: height,
|
|
|
- };
|
|
|
- },
|
|
|
- tableMainHeight() {
|
|
|
- let height = (document.documentElement.clientHeight - 180) + "px";
|
|
|
- return height
|
|
|
- },
|
|
|
- },
|
|
|
- methods: {
|
|
|
- getStationData() {
|
|
|
- let that = this;
|
|
|
- that.loading = true
|
|
|
- let params = {
|
|
|
- date: that.pickerTime
|
|
|
- }
|
|
|
- apiGetallStationPower(params).then(res => {
|
|
|
- that.loading = false
|
|
|
- if (res && res.data) {
|
|
|
- // that.tableData = res.data.power
|
|
|
- res.data.power.forEach(iv => {
|
|
|
- let obj = {
|
|
|
- name: iv.name,
|
|
|
- nameEn: iv.nameEn,
|
|
|
- time: iv.time
|
|
|
- }
|
|
|
- iv.power.forEach((ic, idx) => {
|
|
|
- (obj[obj.nameEn + (idx + 1)]) = ic.toFixed(2)
|
|
|
- })
|
|
|
- that.tableData.push(obj)
|
|
|
- })
|
|
|
- console.log("table=====>>>>", that.tableData)
|
|
|
- res.data.title.forEach((it, index) => {
|
|
|
- let obj = {
|
|
|
- label: it,
|
|
|
- value: index
|
|
|
- }
|
|
|
- that.tableColumn.push(obj)
|
|
|
- })
|
|
|
- }
|
|
|
- }).catch(e => {
|
|
|
- that.loading = false
|
|
|
- let tableColumn = [...Array(40).keys()].map(i => i + 1)
|
|
|
- tableColumn.forEach((it, index) => {
|
|
|
- let obj = {
|
|
|
- label: it,
|
|
|
- value: index
|
|
|
- }
|
|
|
- that.tableColumn.push(obj)
|
|
|
- })
|
|
|
- that.tableData = jsonData.data
|
|
|
- })
|
|
|
- },
|
|
|
- changeTime(val) {
|
|
|
-
|
|
|
- },
|
|
|
- seachData() {
|
|
|
- let str = dayjs(this.pickerTime).format("YYYY-MM")
|
|
|
- this.titelMonth = str.split("-")[0] + "年" + str.split("-")[1] + "月"
|
|
|
- this.getStationData()
|
|
|
- },
|
|
|
- exportExcel() {
|
|
|
- let $e = this.$refs.stationPowerTable.$el
|
|
|
- try {
|
|
|
- let $table = $e.querySelector('.el-table__fixed')
|
|
|
- if (!$table) {
|
|
|
- $table = $e
|
|
|
- }
|
|
|
- const wb = XLSX.utils.table_to_book($table, {
|
|
|
- raw: true
|
|
|
- })
|
|
|
+ that.tableColumn.push(obj);
|
|
|
+ });
|
|
|
+ that.tableData = jsonData.data;
|
|
|
+ console.log(222, that.tableData);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ changeTime(val) {},
|
|
|
+ seachData() {
|
|
|
+ let str = dayjs(this.pickerTime).format("YYYY-MM");
|
|
|
+ this.titelMonth = str.split("-")[0] + "年" + str.split("-")[1] + "月";
|
|
|
+ this.getStationData();
|
|
|
+ },
|
|
|
+ exportExcel() {
|
|
|
+ let $e = this.$refs.stationPowerTable.$el;
|
|
|
+ try {
|
|
|
+ let $table = $e.querySelector(".el-table__fixed");
|
|
|
+ if (!$table) {
|
|
|
+ $table = $e;
|
|
|
+ }
|
|
|
+ const wb = XLSX.utils.table_to_book($table, {
|
|
|
+ raw: true,
|
|
|
+ });
|
|
|
|
|
|
- const wbout = XLSXD.write(wb, {
|
|
|
- bookType: 'xlsx',
|
|
|
- bookSST: true,
|
|
|
- type: 'array'
|
|
|
- })
|
|
|
- saveAs(
|
|
|
- new Blob([wbout], {
|
|
|
- type: 'application/octet-stream'
|
|
|
- }),
|
|
|
- `场站中长期电量预测数据导出.xlsx`,
|
|
|
- )
|
|
|
- } catch (e) {
|
|
|
- if (typeof console !== 'undefined') console.error(e)
|
|
|
- }
|
|
|
- },
|
|
|
- mergeSameCells({
|
|
|
- row,
|
|
|
- column,
|
|
|
- rowIndex,
|
|
|
- columnIndex
|
|
|
- }) {
|
|
|
- if (columnIndex === 0) {
|
|
|
- const prevRow = this.tableData[rowIndex];
|
|
|
- if (prevRow && this.tableData[rowIndex + 1] && this.tableData[rowIndex + 1].name === prevRow.name) {
|
|
|
- if (row.name.indexOf('风速') !== -1) {
|
|
|
- return {
|
|
|
- rowspan: 2,
|
|
|
- colspan: 1,
|
|
|
- }
|
|
|
- } else {
|
|
|
- return {
|
|
|
- rowspan: 3,
|
|
|
- colspan: 1,
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- // if (columnIndex === 0) {
|
|
|
- // if (rowIndex % 2 === 0) {
|
|
|
- // return {
|
|
|
- // rowspan: 2,
|
|
|
- // colspan: 1,
|
|
|
- // }
|
|
|
- // } else {
|
|
|
- // return {
|
|
|
- // rowspan: 0,
|
|
|
- // colspan: 0,
|
|
|
- // }
|
|
|
- // }
|
|
|
- // }
|
|
|
- }
|
|
|
- },
|
|
|
- };
|
|
|
+ const wbout = XLSXD.write(wb, {
|
|
|
+ bookType: "xlsx",
|
|
|
+ bookSST: true,
|
|
|
+ type: "array",
|
|
|
+ });
|
|
|
+ saveAs(
|
|
|
+ new Blob([wbout], {
|
|
|
+ type: "application/octet-stream",
|
|
|
+ }),
|
|
|
+ `场站中长期电量预测数据导出.xlsx`
|
|
|
+ );
|
|
|
+ } catch (e) {
|
|
|
+ if (typeof console !== "undefined") console.error(e);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mergeSameCells({ row, column, rowIndex, columnIndex }) {
|
|
|
+ if (columnIndex === 0) {
|
|
|
+ const prevRow = this.tableData[rowIndex];
|
|
|
+ if (
|
|
|
+ prevRow &&
|
|
|
+ this.tableData[rowIndex + 1] &&
|
|
|
+ this.tableData[rowIndex + 1].name === prevRow.name
|
|
|
+ ) {
|
|
|
+ if (row.name.indexOf("风速") !== -1) {
|
|
|
+ return {
|
|
|
+ rowspan: 2,
|
|
|
+ colspan: 1,
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ return {
|
|
|
+ rowspan: 3,
|
|
|
+ colspan: 1,
|
|
|
+ };
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // if (columnIndex === 0) {
|
|
|
+ // if (rowIndex % 2 === 0) {
|
|
|
+ // return {
|
|
|
+ // rowspan: 2,
|
|
|
+ // colspan: 1,
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // return {
|
|
|
+ // rowspan: 0,
|
|
|
+ // colspan: 0,
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
- .stationPowerContro {
|
|
|
- padding: 0 20px 0 20px;
|
|
|
-
|
|
|
- .stationPowerControSeach {
|
|
|
- margin-top: 20px;
|
|
|
+.stationPowerContro {
|
|
|
+ padding: 0 20px 0 20px;
|
|
|
|
|
|
- .seach_top {
|
|
|
- display: flex;
|
|
|
-
|
|
|
- .exceed {
|
|
|
- .exceedName {
|
|
|
- margin-top: 7px;
|
|
|
- font-size: 14px;
|
|
|
- margin-left: 10px;
|
|
|
- }
|
|
|
+ .tablestyle {
|
|
|
+ .el-table {
|
|
|
+ .el-table__inner-wrapper {
|
|
|
+ width: 115%;
|
|
|
+ transform: scaleX(0.885);
|
|
|
+ transform-origin: 0 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cell {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- display: flex;
|
|
|
- margin-right: 20px;
|
|
|
+ .stationPowerControSeach {
|
|
|
+ margin-top: 20px;
|
|
|
|
|
|
- .el-select,
|
|
|
- .el-select__wrapper {
|
|
|
- height: 32px;
|
|
|
- }
|
|
|
+ .seach_top {
|
|
|
+ display: flex;
|
|
|
|
|
|
- .el-date-editor {
|
|
|
- height: 32px;
|
|
|
+ .exceed {
|
|
|
+ .exceedName {
|
|
|
+ margin-top: 7px;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
|
|
|
- .el-input__icon,
|
|
|
- .el-range-separator {
|
|
|
- line-height: 30px;
|
|
|
- }
|
|
|
- }
|
|
|
+ display: flex;
|
|
|
+ margin-right: 20px;
|
|
|
|
|
|
- .select-trigger {
|
|
|
- .el-input {
|
|
|
- .el-input__wrapper {
|
|
|
- height: 30px;
|
|
|
- }
|
|
|
- }
|
|
|
+ .el-select,
|
|
|
+ .el-select__wrapper {
|
|
|
+ height: 32px;
|
|
|
+ }
|
|
|
|
|
|
- .el-input__suffix {
|
|
|
- .el-input__icon {
|
|
|
- line-height: 30px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ .el-date-editor {
|
|
|
+ height: 32px;
|
|
|
|
|
|
- .el-button {
|
|
|
- height: 30px;
|
|
|
- padding: 0 20px;
|
|
|
- line-height: 5px;
|
|
|
- }
|
|
|
- }
|
|
|
+ .el-input__icon,
|
|
|
+ .el-range-separator {
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .stationPowerControTable {
|
|
|
- .tableTitle {
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- font-size: 18px;
|
|
|
- font-weight: 600;
|
|
|
+ .select-trigger {
|
|
|
+ .el-input {
|
|
|
+ .el-input__wrapper {
|
|
|
+ height: 30px;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .tableUnit {
|
|
|
- font-size: 14px;
|
|
|
+ .el-input__suffix {
|
|
|
+ .el-input__icon {
|
|
|
+ line-height: 30px;
|
|
|
}
|
|
|
+ }
|
|
|
}
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-button {
|
|
|
+ height: 30px;
|
|
|
+ padding: 0 20px;
|
|
|
+ line-height: 5px;
|
|
|
+ }
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .themeDark {
|
|
|
- background-image: none;
|
|
|
+ .stationPowerControTable {
|
|
|
+ .tableTitle {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
|
|
|
- .stationPowerControSeach {
|
|
|
- .exceedName {
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- }
|
|
|
+ .tableUnit {
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- .stationPowerControTable {
|
|
|
-
|
|
|
- .tableTitle,
|
|
|
- .tableUnit {
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- }
|
|
|
+.themeDark {
|
|
|
+ background-image: none;
|
|
|
|
|
|
+ .stationPowerControSeach {
|
|
|
+ .exceedName {
|
|
|
+ color: #fff;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .themeLight {
|
|
|
- .stationPowerControSeach {
|
|
|
- .exceedName {
|
|
|
- color: #000;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .stationPowerControTable {
|
|
|
+ .stationPowerControTable {
|
|
|
+ .tableTitle,
|
|
|
+ .tableUnit {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
- .tableTitle,
|
|
|
- .tableUnit {
|
|
|
- color: #000;
|
|
|
- }
|
|
|
- }
|
|
|
+.themeLight {
|
|
|
+ .stationPowerControSeach {
|
|
|
+ .exceedName {
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
+ .stationPowerControTable {
|
|
|
+ .tableTitle,
|
|
|
+ .tableUnit {
|
|
|
+ color: #000;
|
|
|
}
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|