daily.vue 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199
  1. <template>
  2. <div class="daily">
  3. <h1 class="tit">山西晋能新能源日报</h1>
  4. <div class="daily-table">
  5. <el-table :data="tableData" :row-class-name="tableRowClassName">
  6. <el-table-column
  7. prop="foreignkeyname"
  8. align="center"
  9. label="风场名称"
  10. width="100"
  11. >
  12. </el-table-column>
  13. <el-table-column
  14. prop="speed"
  15. align="center"
  16. label="平均风速(m/s)"
  17. width="91"
  18. >
  19. </el-table-column>
  20. <el-table-column prop="rfdl" align="center" label="日发电量(万KWh)">
  21. </el-table-column>
  22. <el-table-column
  23. prop="yljfdl"
  24. align="center"
  25. label="月累计发电量(万KWh)"
  26. >
  27. </el-table-column>
  28. <el-table-column
  29. prop="nljfdl"
  30. align="center"
  31. label="年累计发电量(万KWh)"
  32. >
  33. </el-table-column>
  34. <el-table-column prop="rswdl" align="center" label="日上网电量(万KWh)">
  35. </el-table-column>
  36. <el-table-column
  37. prop="yljswdl"
  38. align="center"
  39. label="月上累计网电量(万KWh)"
  40. >
  41. </el-table-column>
  42. <el-table-column
  43. prop="nljswdl"
  44. align="center"
  45. label="年上累计网电量(万KWh)"
  46. >
  47. </el-table-column>
  48. <el-table-column
  49. prop="zhcydl"
  50. align="center"
  51. label="综合厂用电量(万KWh)"
  52. >
  53. </el-table-column>
  54. <el-table-column
  55. prop="yljzhcydl"
  56. align="center"
  57. label="月累计综合厂用电量(万KWh)"
  58. >
  59. </el-table-column>
  60. <el-table-column
  61. prop="scadarfdl"
  62. align="center"
  63. label="SCADA日发电量(万KWh)"
  64. >
  65. </el-table-column>
  66. <el-table-column
  67. prop="scadayljfdl"
  68. align="center"
  69. label="SCADA月累计发电量(万KWh)"
  70. >
  71. </el-table-column>
  72. <el-table-column
  73. prop="scadanljfdl"
  74. align="center"
  75. label="SCADA年累计发电量(万KWh)"
  76. >
  77. </el-table-column>
  78. <el-table-column
  79. prop="scadazhcydl"
  80. align="center"
  81. label="SCADA综合厂用电量(万KWh)"
  82. >
  83. </el-table-column>
  84. <el-table-column
  85. prop="scadayljzhcydl"
  86. align="center"
  87. label="SCADA月累计综合厂用电量(万KWh)"
  88. >
  89. </el-table-column>
  90. <el-table-column
  91. prop="scadazhcydl"
  92. align="center"
  93. label="SCADA综合厂用电率(%)"
  94. >
  95. </el-table-column>
  96. <el-table-column
  97. prop="rxdssdl"
  98. align="center"
  99. label="日限电损失电量(KWh)"
  100. >
  101. </el-table-column>
  102. <el-table-column
  103. prop="yljxdssdl"
  104. align="center"
  105. label="月累计限电损失电量(万KWh)"
  106. >
  107. </el-table-column>
  108. <el-table-column
  109. prop="nljxdssdl"
  110. align="center"
  111. label="年累计限电损失电量(万KWh)"
  112. >
  113. </el-table-column>
  114. </el-table>
  115. </div>
  116. </div>
  117. </template>
  118. <script>
  119. import api from "@api/economic/index.js";
  120. import { number } from "echarts";
  121. export default {
  122. data() {
  123. return {
  124. dateArea: [
  125. this.fmtDate(
  126. new Date(
  127. new Date().setTime(new Date().getTime() - 60 * 60 * 24 * 1000)
  128. )
  129. ),
  130. ],
  131. tableData: [],
  132. };
  133. },
  134. created() {
  135. this.getList();
  136. },
  137. methods: {
  138. tableRowClassName({ row, rowIndex }) {
  139. if (row.isWind == 1) {
  140. return "warning-row";
  141. }
  142. return "";
  143. },
  144. getList: function () {
  145. api
  146. .energyDaily({
  147. theday: this.dateArea[0],
  148. })
  149. .then((res) => {
  150. let newArr = [];
  151. for (let key in res.data) {
  152. newArr.push(...res.data[key]);
  153. }
  154. for (let i = 0; i < newArr.length; i++) {
  155. if (newArr[i].isWind != "0") {
  156. newArr[i].foreignkeyname = newArr[i].foreignkeyname + "(合计)";
  157. }
  158. for (let key in newArr[i]) {
  159. if (typeof newArr[i][key] == "number") {
  160. newArr[i][key] = newArr[i][key].toFixed(2);
  161. }
  162. }
  163. }
  164. this.tableData = newArr;
  165. });
  166. },
  167. // 格式化日期
  168. fmtDate(date) {
  169. let curDate = date || new Date();
  170. let year = curDate.getFullYear();
  171. let mouth = curDate.getUTCMonth() + 1;
  172. let day = curDate.getDate();
  173. return (
  174. year +
  175. "-" +
  176. (mouth < 10 ? "0" + mouth : mouth) +
  177. "-" +
  178. (day < 10 ? "0" + day : day)
  179. );
  180. },
  181. },
  182. };
  183. </script>
  184. <style lang="less" scoped>
  185. .daily {
  186. .tit {
  187. text-align: center;
  188. color: rgb(131, 121, 121);
  189. }
  190. .daily-table {
  191. margin: 20px 20px 0 20px;
  192. }
  193. .active {
  194. background-color: beige;
  195. }
  196. }
  197. </style>