Decision2.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191
  1. <template>
  2. <div class="decision-page-2">
  3. <div class="query mg-b-8">
  4. <div class="query-items">
  5. <div class="query-item">
  6. <div class="lable">场站:</div>
  7. <div class="search-input">
  8. <el-select
  9. v-model="value1"
  10. @change="ChangZhanChange(value1)"
  11. multiple
  12. placeholder="请选择"
  13. popper-class="select"
  14. >
  15. <el-option
  16. v-for="item in ChangZhan"
  17. :key="item.id"
  18. :value="item.id"
  19. :label="item.name"
  20. >
  21. </el-option>
  22. </el-select>
  23. </div>
  24. </div>
  25. <div class="query-item">
  26. <div class="lable">项目:</div>
  27. <div class="search-input">
  28. <el-select
  29. v-model="value2"
  30. @change="XiangMuChange(value2)"
  31. multiple
  32. placeholder="请选择"
  33. popper-class="select"
  34. >
  35. <el-option
  36. v-for="item in XiangMu"
  37. :key="item.id"
  38. :value="item.id"
  39. :label="item.name"
  40. >
  41. </el-option>
  42. </el-select>
  43. </div>
  44. </div>
  45. <div class="query-item">
  46. <div class="lable">线路:</div>
  47. <div class="search-input">
  48. <el-select
  49. v-model="value3"
  50. @change="XianLuChange(value3)"
  51. multiple
  52. placeholder="请选择"
  53. popper-class="select"
  54. >
  55. <el-option
  56. v-for="item in XianLu"
  57. :key="item.id"
  58. :label="item.name"
  59. :value="item.id"
  60. >
  61. </el-option>
  62. </el-select>
  63. </div>
  64. </div>
  65. <div class="query-item">
  66. <div class="lable">开始日期:</div>
  67. <div class="search-input">
  68. <el-date-picker
  69. v-model="value4"
  70. @change="BeginChange(value4)"
  71. type="date"
  72. value-format="YYYY-MM-DD"
  73. placeholder="选择日期"
  74. popper-class="date-select"
  75. >
  76. </el-date-picker>
  77. </div>
  78. </div>
  79. <div class="query-item">
  80. <div class="lable">结束日期:</div>
  81. <div class="search-input">
  82. <el-date-picker
  83. v-model="value5"
  84. @change="EndChange(value5)"
  85. type="date"
  86. value-format="YYYY-MM-DD"
  87. placeholder="选择日期"
  88. popper-class="date-select"
  89. >
  90. </el-date-picker>
  91. <div class="unit svg-icon svg-icon-gray">
  92. <svg-icon :svgid="''" />
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. <div class="query-actions">
  98. <button class="btn green">搜索</button>
  99. <button class="btn" @click="dbfx">对标分析</button>
  100. <button class="btn">导出</button>
  101. <button class="btn" v-show="detailShow == 2" @click="back">返回</button>
  102. </div>
  103. </div>
  104. <div v-show="detailShow == 1">
  105. <toolbar-panel title="风机绩效榜" :showLine="false"></toolbar-panel>
  106. <div class="mg-b-16">
  107. <div class="project-table">
  108. <Table
  109. :data="tableData"
  110. :canScroll="false"
  111. ref="curRef"
  112. @onSort="onSort"
  113. ></Table>
  114. </div>
  115. </div>
  116. <el-row class="mg-b-16">
  117. <el-col :span="8">
  118. <panel title="发电量占比">
  119. <dual-pie-chart
  120. height="21.296vh"
  121. :innerData="innerFdl"
  122. :outerData="outerFdl"
  123. />
  124. </panel>
  125. </el-col>
  126. <el-col :span="8">
  127. <panel title="各场站损失电量占比">
  128. <dual-pie-chart
  129. height="21.296vh"
  130. :innerData="innerCz"
  131. :outerData="outerCz"
  132. />
  133. </panel>
  134. </el-col>
  135. <el-col :span="8">
  136. <panel title="理论发电量占比">
  137. <dual-pie-chart
  138. height="21.296vh"
  139. :innerData="innerLl"
  140. :outerData="outerLl"
  141. />
  142. </panel>
  143. </el-col>
  144. </el-row>
  145. <div>
  146. <panel title="损失电量分析">
  147. <multiple-bar-chart
  148. :height="'calc(100vh - 21.5vh - 500px)'"
  149. :list="analyis"
  150. :customerTooltip="true"
  151. @tooltip="tooltip"
  152. :units="['(万KWh)']"
  153. />
  154. </panel>
  155. </div>
  156. </div>
  157. <el-row :type="'flex'" class="content" v-show="detailShow == 2">
  158. <el-col :span="24" class="pd-l-8">
  159. <panel :title="'风机对标列表明细'" :showLine="false">
  160. <div class="project-table">
  161. <Table
  162. :data="tableDataDetail"
  163. ref="curRef"
  164. @onSort="onSort"
  165. ></Table>
  166. </div>
  167. </panel>
  168. </el-col>
  169. </el-row>
  170. <el-dialog
  171. title="对标排名分析"
  172. v-model="dialogVisible"
  173. width="70%"
  174. top="10vh"
  175. custom-class="modal"
  176. :close-on-click-modal="false"
  177. >
  178. <dayinfo
  179. :radarValue="radarValue"
  180. :title="[windNum,windNum2]"
  181. :windNum="windNum"
  182. :windNum2="windNum2"
  183. :tabs="tabs"
  184. :analyisDialog="analyisDialog"
  185. />
  186. </el-dialog>
  187. </div>
  188. </template>
  189. <script>
  190. import MultipleBarChart from "../../components/chart/bar/multiple-bar-chart.vue";
  191. import DualPieChart from "../../components/chart/pie/dual-pie-chart.vue";
  192. import SvgIcon from "../../components/coms/icon/svg-icon.vue";
  193. import Panel from "../../components/coms/panel/panel.vue";
  194. import Table from "./table.vue";
  195. import ToolbarPanel from "../../components/coms/panel/toolbar-panel.vue";
  196. import Dayinfo from "./dayinfo.vue";
  197. export default {
  198. components: {
  199. Panel,
  200. Table,
  201. SvgIcon,
  202. DualPieChart,
  203. MultipleBarChart,
  204. Dayinfo,
  205. ToolbarPanel,
  206. },
  207. data() {
  208. let that = this;
  209. return {
  210. tableIdArr: [], //放checkbox的id数组
  211. tableId: [],
  212. checkLength: 0, //对标分析只能选择2个
  213. tableData: {
  214. column: [
  215. {
  216. name: "",
  217. field: "index",
  218. is_num: false,
  219. is_light: false,
  220. },
  221. {
  222. name: "",
  223. field: "check",
  224. is_num: false,
  225. is_light: false,
  226. template: () => {
  227. return "<input class='check curCheckBox' type='CheckBox' />";
  228. },
  229. click: function(event, data) {
  230. var dataId = that.tableIdArr[data.index - 1];
  231. if (event.target.checked == false && that.checkLength <= 2) {
  232. that.tableId.forEach((item, i) => {
  233. if (item == dataId) {
  234. that.tableId.splice(i, 1);
  235. that.dbData.splice(i, 1);
  236. }
  237. });
  238. that.checkLength--;
  239. } else if (event.target.checked && that.checkLength < 2) {
  240. that.tableId.push(dataId);
  241. that.dbData.push(data);
  242. that.checkLength++;
  243. } else if (that.checkLength == 2) {
  244. event.target.checked = false;
  245. }
  246. },
  247. },
  248. {
  249. name: "名称",
  250. field: "name",
  251. is_num: false,
  252. is_light: false,
  253. },
  254. {
  255. name: "综合排名",
  256. field: "zhpm",
  257. is_num: false,
  258. is_light: false,
  259. sortable: true,
  260. },
  261. {
  262. name: "发电量排名",
  263. field: "fdlpm",
  264. is_num: false,
  265. is_light: false,
  266. sortable: true,
  267. },
  268. {
  269. name: "发电量",
  270. field: "fdl",
  271. is_num: false,
  272. is_light: false,
  273. sortable: true,
  274. },
  275. {
  276. name: "故障损失排名",
  277. field: "gzssdlpm",
  278. is_num: false,
  279. is_light: false,
  280. sortable: true,
  281. },
  282. {
  283. name: "故障损失",
  284. field: "gzssdl",
  285. is_num: false,
  286. is_light: false,
  287. sortable: true,
  288. },
  289. {
  290. name: "检修损失排名",
  291. field: "jxssdlpm",
  292. is_num: false,
  293. is_light: false,
  294. sortable: true,
  295. },
  296. {
  297. name: "检修损失",
  298. field: "jxssdl",
  299. is_num: false,
  300. is_light: false,
  301. sortable: true,
  302. },
  303. {
  304. name: "性能损失排名",
  305. field: "xnssdlpm",
  306. is_num: false,
  307. is_light: false,
  308. sortable: true,
  309. },
  310. {
  311. name: "性能损失",
  312. field: "xnssdl",
  313. is_num: false,
  314. is_light: false,
  315. sortable: true,
  316. },
  317. {
  318. name: "限电损失排名",
  319. field: "xdssdlpm",
  320. is_num: false,
  321. is_light: false,
  322. sortable: true,
  323. },
  324. {
  325. name: "限电损失",
  326. field: "xdssdl",
  327. is_num: false,
  328. is_light: false,
  329. sortable: true,
  330. },
  331. {
  332. name: "受累损失排名",
  333. field: "slssdlpm",
  334. is_num: false,
  335. is_light: false,
  336. sortable: true,
  337. },
  338. {
  339. name: "受累损失",
  340. field: "slssdl",
  341. is_num: false,
  342. is_light: false,
  343. sortable: true,
  344. },
  345. {
  346. name: "风能利用率排名",
  347. field: "fnlylpm",
  348. is_num: false,
  349. is_light: false,
  350. sortable: true,
  351. },
  352. {
  353. name: "风能利用率(%)",
  354. field: "fnlyl",
  355. is_num: false,
  356. is_light: false,
  357. sortable: true,
  358. },
  359. {
  360. name: "故障损失率排名",
  361. field: "gzsslpm",
  362. is_num: false,
  363. is_light: false,
  364. sortable: true,
  365. },
  366. {
  367. name: "故障损失率(%)",
  368. field: "gzssl",
  369. is_num: false,
  370. is_light: false,
  371. sortable: true,
  372. },
  373. {
  374. name: "检修损失率排名",
  375. field: "jxsslpm",
  376. is_num: false,
  377. is_light: false,
  378. sortable: true,
  379. },
  380. {
  381. name: "检修损失率(%)",
  382. field: "jxssl",
  383. is_num: false,
  384. is_light: false,
  385. sortable: true,
  386. },
  387. {
  388. name: "弃风率排名",
  389. field: "qflpm",
  390. is_num: false,
  391. is_light: false,
  392. sortable: true,
  393. },
  394. {
  395. name: "弃风率(%)",
  396. field: "qfl",
  397. is_num: false,
  398. is_light: false,
  399. sortable: true,
  400. },
  401. {
  402. name: "性能损失率排名",
  403. field: "xnsslpm",
  404. is_num: false,
  405. is_light: false,
  406. sortable: true,
  407. },
  408. {
  409. name: "性能损失率(%)",
  410. field: "xnssl",
  411. is_num: false,
  412. is_light: false,
  413. sortable: true,
  414. },
  415. {
  416. name: "受累损失率排名",
  417. field: "slsslpm",
  418. is_num: false,
  419. is_light: false,
  420. sortable: true,
  421. },
  422. {
  423. name: "受累损失率(%)",
  424. field: "slssl",
  425. is_num: false,
  426. is_light: false,
  427. sortable: true,
  428. },
  429. {
  430. name: "操作",
  431. field: "cz",
  432. is_num: false,
  433. is_light: false,
  434. template: function() {
  435. return "<a class='action'>详情</a>";
  436. },
  437. click: function(event, data) {
  438. var dataId = that.tableIdArr[data.index - 1];
  439. that.clearDb();
  440. that.detailShow = 2;
  441. // var that = this;
  442. that.API.requestData({
  443. method: "GET",
  444. baseURL: "http://10.155.32.4:9001/",
  445. subUrl: "benchmarking/details",
  446. data: {
  447. id: dataId,
  448. beginDate: that.value4,
  449. endDate: that.value5,
  450. target: "",
  451. sort: "",
  452. },
  453. success(res) {
  454. var dataTab = [];
  455. res.data.forEach((item, index) => {
  456. that.tableIdArr.push(item.id);
  457. dataTab.push({
  458. //表格
  459. index: index + 1,
  460. fdl: item.fdl,
  461. name: item.name,
  462. zhpm: item.zhpm,
  463. gzssdl: item.gzssdl,
  464. jxssdlpm: item.jxssdlpm,
  465. jxssdl: item.jxssdl,
  466. xnssdlpm: item.xnssdlpm,
  467. xnssdl: item.xnssdl,
  468. xdssdlpm: item.xdssdlpm,
  469. xdssdl: item.xdssdl,
  470. slssdlpm: item.slssdlpm,
  471. slssdl: item.slssdl,
  472. fnlylpm: item.fnlylpm,
  473. fnlyl: item.fnlyl,
  474. gzsslpm: item.gzsslpm,
  475. gzssl: item.gzssl,
  476. jxsslpm: item.jxsslpm,
  477. jxssl: item.jxssl,
  478. qflpm: item.qflpm,
  479. qfl: item.qfl,
  480. xnsslpm: item.xnsslpm,
  481. xnssl: item.xnssl,
  482. slsslpm: item.slsslpm,
  483. slssl: item.slssl,
  484. is_light: false,
  485. });
  486. });
  487. that.tableDataDetail.data = dataTab;
  488. },
  489. });
  490. },
  491. },
  492. ],
  493. data: [],
  494. },
  495. tableDataDetail: {
  496. column: [
  497. {
  498. name: "",
  499. field: "index",
  500. is_num: false,
  501. is_light: false,
  502. },
  503. {
  504. // name: "",
  505. name: "发电量",
  506. field: "fdl",
  507. is_num: false,
  508. is_light: false,
  509. display: "none",
  510. },
  511. {
  512. name: "",
  513. field: "check",
  514. is_num: false,
  515. is_light: false,
  516. template: function() {
  517. return "<input class='check curCheckBox checkItem' type='CheckBox'/>";
  518. },
  519. click: function(event, data) {
  520. var dataId = that.tableIdArr[data.index - 1];
  521. if (event.target.checked == false && that.checkLength <= 2) {
  522. that.tableId.forEach((item, i) => {
  523. if (item == dataId) {
  524. that.tableId.splice(i, 1);
  525. that.dbData.splice(i, 1);
  526. }
  527. });
  528. that.checkLength--;
  529. } else if (event.target.checked && that.checkLength < 2) {
  530. that.tableId.push(dataId);
  531. that.dbData.push(data);
  532. that.checkLength++;
  533. } else if (that.checkLength == 2) {
  534. event.target.checked = false;
  535. }
  536. },
  537. },
  538. {
  539. name: "风机名称",
  540. field: "name",
  541. is_num: false,
  542. is_light: false,
  543. },
  544. {
  545. name: "综合排名",
  546. field: "zhpm",
  547. is_num: false,
  548. is_light: false,
  549. sortable: true,
  550. },
  551. {
  552. name: "故障损失",
  553. field: "gzssdl",
  554. is_num: false,
  555. is_light: false,
  556. sortable: true,
  557. },
  558. {
  559. name: "检修损失排名",
  560. field: "jxssdlpm",
  561. is_num: false,
  562. is_light: false,
  563. sortable: true,
  564. },
  565. {
  566. name: "检修损失",
  567. field: "jxssdl",
  568. is_num: false,
  569. is_light: false,
  570. sortable: true,
  571. },
  572. {
  573. name: "性能损失排名",
  574. field: "xnssdlpm",
  575. is_num: false,
  576. is_light: false,
  577. sortable: true,
  578. },
  579. {
  580. name: "性能损失",
  581. field: "xnssdl",
  582. is_num: false,
  583. is_light: false,
  584. sortable: true,
  585. },
  586. {
  587. name: "限电损失排名",
  588. field: "xdssdlpm",
  589. is_num: false,
  590. is_light: false,
  591. sortable: true,
  592. },
  593. {
  594. name: "限电损失",
  595. field: "xdssdl",
  596. is_num: false,
  597. is_light: false,
  598. sortable: true,
  599. },
  600. {
  601. name: "受累损失排名",
  602. field: "slssdlpm",
  603. is_num: false,
  604. is_light: false,
  605. sortable: true,
  606. },
  607. {
  608. name: "受累损失",
  609. field: "slssdl",
  610. is_num: false,
  611. is_light: false,
  612. sortable: true,
  613. },
  614. {
  615. name: "故障损失率排名",
  616. field: "gzsslpm",
  617. is_num: false,
  618. is_light: false,
  619. sortable: true,
  620. },
  621. {
  622. name: "故障损失率(%)",
  623. field: "gzssl",
  624. is_num: false,
  625. is_light: false,
  626. sortable: true,
  627. },
  628. {
  629. name: "检修损失率排名",
  630. field: "jxsslpm",
  631. is_num: false,
  632. is_light: false,
  633. sortable: true,
  634. },
  635. {
  636. name: "检修损失率(%)",
  637. field: "jxssl",
  638. is_num: false,
  639. is_light: false,
  640. sortable: true,
  641. },
  642. {
  643. name: "弃风率排名",
  644. field: "qflpm",
  645. is_num: false,
  646. is_light: false,
  647. sortable: true,
  648. },
  649. {
  650. name: "弃风率(%)",
  651. field: "qfl",
  652. is_num: false,
  653. is_light: false,
  654. sortable: true,
  655. },
  656. {
  657. name: "性能损失率排名",
  658. field: "xnsslpm",
  659. is_num: false,
  660. is_light: false,
  661. sortable: true,
  662. },
  663. {
  664. name: "性能损失率(%)",
  665. field: "xnssl",
  666. is_num: false,
  667. is_light: false,
  668. sortable: true,
  669. },
  670. {
  671. name: "受累损失率排名",
  672. field: "slsslpm",
  673. is_num: false,
  674. is_light: false,
  675. sortable: true,
  676. },
  677. {
  678. name: "受累损失率(%)",
  679. field: "slssl",
  680. is_num: false,
  681. is_light: false,
  682. sortable: true,
  683. },
  684. ],
  685. data: [],
  686. },
  687. options: [],
  688. ChangZhan: [], //场站
  689. XiangMu: [], //项目
  690. XianLu: [], //线路
  691. value1: [],
  692. value2: [],
  693. value3: [],
  694. value4: "",
  695. value5: "",
  696. innerFdl: [], //发电量占比
  697. outerFdl: [],
  698. innerCz: [], //各场站损失电量占比
  699. outerCz: [],
  700. innerLl: [], //理论发电量占比
  701. outerLl: [],
  702. analyis: [], //损失电量分析
  703. dialogVisible: false,
  704. radarValue: [],
  705. windNum: "dd",
  706. windNum2: "dd",
  707. tabs: [],
  708. analyisDialog: [],
  709. detailShow: 1,
  710. ajaxData: [],
  711. dbData: [],
  712. };
  713. },
  714. created() {
  715. this.ChangZhanVal();
  716. // this.XiangMuVal()
  717. this.value4 = this.getTime(1);
  718. this.value5 = this.getTime(2);
  719. this.AjaxCommon();
  720. },
  721. methods: {
  722. ChangZhanVal() {
  723. var that = this;
  724. that.API.requestData({
  725. method: "GET",
  726. baseURL: "http://10.155.32.4:9001/",
  727. subUrl: "benchmarking/wplist",
  728. success(res) {
  729. // that.value2.push(res.data[0].id);
  730. that.ChangZhan = res.data;
  731. // that.AjaxCommon();
  732. that.XiangMuVal(that.value2);
  733. },
  734. });
  735. },
  736. ChangZhanChange(val) {
  737. this.value1 = val;
  738. this.value2 = [];
  739. // this.value2 = val;
  740. this.value3 = [];
  741. this.AjaxCommon();
  742. this.XiangMuVal(val);
  743. this.clearDb();
  744. },
  745. XiangMuVal(val) {
  746. var that = this;
  747. that.API.requestData({
  748. method: "GET",
  749. baseURL: "http://10.155.32.4:9001/",
  750. subUrl: "benchmarking/projectList",
  751. data: {
  752. wpids: val,
  753. },
  754. success(res) {
  755. that.XiangMu = res.data;
  756. },
  757. });
  758. },
  759. XiangMuChange(val) {
  760. this.value2 = val;
  761. this.value3 = [];
  762. this.AjaxCommon();
  763. // this.XiangMuVal(val);
  764. this.XianLuVal(val);
  765. this.clearDb();
  766. },
  767. XianLuVal(val) {
  768. var that = this;
  769. that.API.requestData({
  770. method: "GET",
  771. baseURL: "http://10.155.32.4:9001/",
  772. subUrl: "benchmarking/lineList",
  773. data: {
  774. projects: val,
  775. },
  776. success(res) {
  777. that.XianLu = res.data;
  778. },
  779. });
  780. },
  781. XianLuChange(val) {
  782. this.value3 = val;
  783. this.AjaxCommon();
  784. this.clearDb();
  785. },
  786. BeginChange(val) {
  787. this.value4 = val;
  788. this.AjaxCommon();
  789. this.clearDb();
  790. },
  791. EndChange(val) {
  792. this.value5 = val;
  793. this.AjaxCommon();
  794. this.clearDb();
  795. },
  796. getTime(val) {
  797. //时间戳处理,val=1是默认开始时间(当前月第一天),val=2是默认结束时间(今天)
  798. var date = new Date();
  799. var year = date.getFullYear(),
  800. month = date.getMonth() + 1,
  801. day = date.getDate();
  802. month >= 1 && month <= 9 ? (month = "0" + month) : "";
  803. day >= 0 && day <= 9 ? (day = "0" + day) : "";
  804. var begin = year + "-" + month + "-01";
  805. var end = year + "-" + month + "-" + day;
  806. if (val == 1) {
  807. return begin;
  808. } else if (val == 2) {
  809. return end;
  810. }
  811. },
  812. AjaxCommon() {
  813. var that = this;
  814. that.API.requestData({
  815. //五项损失率
  816. method: "GET",
  817. baseURL: "http://10.155.32.4:9001/",
  818. subUrl: "benchmarking/wxssl",
  819. data: {
  820. wpids: that.value1,
  821. projectids: that.value2,
  822. lineids: that.value3,
  823. beginDate: that.value4,
  824. endDate: that.value5,
  825. target: "",
  826. sort: "",
  827. },
  828. success(res) {
  829. that.ajaxData = res.data;
  830. var dataTab = [], //表格
  831. fdl = [],
  832. cz = [],
  833. ll = [],
  834. analyis = [],
  835. gzssdl = [],
  836. jxssdl = [],
  837. xnssdl = [],
  838. xdssdl = [],
  839. slssdl = [];
  840. res.data.forEach((item, index) => {
  841. that.tableIdArr.push(item.id);
  842. dataTab.push({
  843. //表格
  844. index: index + 1,
  845. name: item.name,
  846. zhpm: item.zhpm,
  847. fdlpm: item.fdlpm,
  848. fdl: item.fdl,
  849. gzssdlpm: item.gzssdlpm,
  850. gzssdl: item.gzssdl,
  851. jxssdlpm: item.jxssdlpm,
  852. jxssdl: item.jxssdl,
  853. xnssdlpm: item.xnssdlpm,
  854. xnssdl: item.xnssdl,
  855. xdssdlpm: item.xdssdlpm,
  856. xdssdl: item.xdssdl,
  857. slssdlpm: item.slssdlpm,
  858. slssdl: item.slssdl,
  859. fnlylpm: item.fnlylpm,
  860. fnlyl: item.fnlyl,
  861. gzsslpm: item.gzsslpm,
  862. gzssl: item.gzssl,
  863. jxsslpm: item.jxsslpm,
  864. jxssl: item.jxssl,
  865. qflpm: item.qflpm,
  866. qfl: item.qfl,
  867. xnsslpm: item.xnsslpm,
  868. xnssl: item.xnssl,
  869. slsslpm: item.slsslpm,
  870. slssl: item.slssl,
  871. is_light: false,
  872. });
  873. fdl.push({
  874. value: item.fdl,
  875. name: item.name,
  876. });
  877. cz.push({
  878. value: (
  879. item.gzssdl +
  880. item.jxssdl +
  881. item.xnssdl +
  882. item.xdssdl +
  883. item.slssdl
  884. ).toFixed(2),
  885. name: item.name,
  886. });
  887. ll.push({
  888. value: item.llfdl,
  889. name: item.name,
  890. });
  891. gzssdl.push({
  892. text: item.name,
  893. value: item.gzssdl,
  894. });
  895. jxssdl.push({
  896. text: item.name,
  897. value: item.jxssdl,
  898. });
  899. xnssdl.push({
  900. text: item.name,
  901. value: item.xnssdl,
  902. });
  903. xdssdl.push({
  904. text: item.name,
  905. value: item.xdssdl,
  906. });
  907. slssdl.push({
  908. text: item.name,
  909. value: item.slssdl,
  910. });
  911. });
  912. analyis.push(
  913. {
  914. title: "故障损失电量",
  915. yAxisIndex: 0,
  916. value: gzssdl,
  917. },
  918. {
  919. title: "检修损失电量",
  920. yAxisIndex: 0,
  921. value: jxssdl,
  922. },
  923. {
  924. title: "性能损失电量",
  925. yAxisIndex: 0,
  926. value: xnssdl,
  927. },
  928. {
  929. title: "限电损失电量",
  930. yAxisIndex: 0,
  931. value: xdssdl,
  932. },
  933. {
  934. title: "受累损失电量",
  935. yAxisIndex: 0,
  936. value: slssdl,
  937. }
  938. );
  939. that.tableData.data = dataTab;
  940. that.innerFdl = fdl;
  941. that.outerFdl = fdl;
  942. that.innerCz = cz;
  943. that.outerCz = cz;
  944. that.innerLl = ll;
  945. that.outerLl = ll;
  946. that.analyis = analyis;
  947. },
  948. });
  949. },
  950. AjaxDbfx() {
  951. var that = this;
  952. var data = that.dbData;
  953. that.windNum = data[0].name;
  954. that.windNum2 = data[1].name;
  955. that.tabs = [
  956. {
  957. name: "发电量",
  958. windData1: data[0].fdl,
  959. windData2: data[1].fdl,
  960. },
  961. {
  962. name: "故障损失电量",
  963. windData1: data[0].gzssdl,
  964. windData2: data[1].gzssdl,
  965. },
  966. {
  967. name: "检修损失电量",
  968. windData1: data[0].jxssdl,
  969. windData2: data[1].jxssdl,
  970. },
  971. {
  972. name: "性能未达标损失电量",
  973. windData1: data[0].xnssdl,
  974. windData2: data[1].xnssdl,
  975. },
  976. {
  977. name: "受累损失电量",
  978. windData1: data[0].slssdl,
  979. windData2: data[1].slssdl,
  980. },
  981. {
  982. name: "风能利用率",
  983. windData1: data[0].fnlyl,
  984. windData2: data[1].fnlyl,
  985. },
  986. {
  987. name: "故障损失率",
  988. windData1: data[0].gzssl,
  989. windData2: data[1].gzssl,
  990. },
  991. {
  992. name: "检修损失率",
  993. windData1: data[0].jxssl,
  994. windData2: data[1].jxssl,
  995. },
  996. {
  997. name: "弃风率",
  998. windData1: data[0].qfl,
  999. windData2: data[1].qfl,
  1000. },
  1001. {
  1002. name: "性能损失率",
  1003. windData1: data[0].xnssl,
  1004. windData2: data[1].xnssl,
  1005. },
  1006. {
  1007. name: "受累损失率",
  1008. windData1: data[0].slssl,
  1009. windData2: data[1].slssl,
  1010. },
  1011. ];
  1012. that.radarValue = [
  1013. {
  1014. indicator: [
  1015. "风能利用率",
  1016. "故障损失率",
  1017. "检修损失率",
  1018. "弃风率",
  1019. "性能损失率",
  1020. "受累损失率",
  1021. ],
  1022. data: [
  1023. {
  1024. value: [
  1025. data[0].fnlylpm,
  1026. data[0].gzsslpm,
  1027. data[0].jxsslpm,
  1028. data[0].qflpm,
  1029. data[0].xnsslpm,
  1030. data[0].slsslpm,
  1031. ],
  1032. },
  1033. {
  1034. value: [
  1035. data[1].fnlylpm,
  1036. data[1].gzsslpm,
  1037. data[1].jxsslpm,
  1038. data[1].qflpm,
  1039. data[1].xnsslpm,
  1040. data[1].slsslpm,
  1041. ],
  1042. },
  1043. ],
  1044. },
  1045. ];
  1046. var analyis = [],
  1047. gzssdl = [],
  1048. jxssdl = [],
  1049. xnssdl = [],
  1050. xdssdl = [],
  1051. slssdl = [];
  1052. data.forEach((item, index) => {
  1053. gzssdl.push({
  1054. text: item.name,
  1055. value: item.gzssdl,
  1056. });
  1057. jxssdl.push({
  1058. text: item.name,
  1059. value: item.jxssdl,
  1060. });
  1061. xnssdl.push({
  1062. text: item.name,
  1063. value: item.xnssdl,
  1064. });
  1065. xdssdl.push({
  1066. text: item.name,
  1067. value: item.xdssdl,
  1068. });
  1069. slssdl.push({
  1070. text: item.name,
  1071. value: item.slssdl,
  1072. });
  1073. });
  1074. analyis.push(
  1075. {
  1076. title: "故障损失电量",
  1077. yAxisIndex: 0,
  1078. value: gzssdl,
  1079. },
  1080. {
  1081. title: "检修损失电量",
  1082. yAxisIndex: 0,
  1083. value: jxssdl,
  1084. },
  1085. {
  1086. title: "性能损失电量",
  1087. yAxisIndex: 0,
  1088. value: xnssdl,
  1089. },
  1090. {
  1091. title: "限电损失电量",
  1092. yAxisIndex: 0,
  1093. value: xdssdl,
  1094. },
  1095. {
  1096. title: "受累损失电量",
  1097. yAxisIndex: 0,
  1098. value: slssdl,
  1099. }
  1100. );
  1101. that.analyisDialog = analyis;
  1102. },
  1103. tooltip(param, callback) {
  1104. var color = ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"];
  1105. var result = param[0].axisValue;
  1106. param.forEach((value, index) => {
  1107. result +=
  1108. "<br />" +
  1109. `<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color[index]};"></span>` +
  1110. value.seriesName +
  1111. ":" +
  1112. value.value;
  1113. });
  1114. callback(result);
  1115. return true;
  1116. },
  1117. dbfx() {
  1118. var that = this;
  1119. if (that.tableId.length == 2) {
  1120. that.dialogVisible = true;
  1121. this.AjaxDbfx();
  1122. this.clearDb();
  1123. }
  1124. },
  1125. clearDb() {
  1126. //清空对标状态
  1127. this.$refs.curRef.clearCheckBox();
  1128. this.tableId = [];
  1129. this.dbData = [];
  1130. this.checkLength = 0;
  1131. },
  1132. back() {
  1133. this.detailShow = 1;
  1134. this.clearDb();
  1135. },
  1136. onSort() {
  1137. this.clearDb();
  1138. },
  1139. },
  1140. };
  1141. </script>
  1142. <style lang="less">
  1143. .decision-page-2 {
  1144. .content .project-table {
  1145. tbody {
  1146. height: calc(100vh - 24.5vh);
  1147. }
  1148. }
  1149. .project-table {
  1150. overflow: auto;
  1151. tbody {
  1152. height: 145px;
  1153. }
  1154. th,
  1155. td {
  1156. color: #b2bdc0;
  1157. &:nth-child(1) {
  1158. width: 50px;
  1159. }
  1160. &:nth-child(2) {
  1161. width: 50px;
  1162. }
  1163. }
  1164. }
  1165. .action {
  1166. text-decoration: underline;
  1167. color: @green;
  1168. cursor: pointer;
  1169. }
  1170. }
  1171. </style>