Decision2.vue 38 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405
  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. import api from "@api/economic/index.js";
  198. export default {
  199. components: {
  200. Panel,
  201. Table,
  202. SvgIcon,
  203. DualPieChart,
  204. MultipleBarChart,
  205. Dayinfo,
  206. ToolbarPanel,
  207. },
  208. data() {
  209. let that = this;
  210. return {
  211. tableIdArr: [], //放checkbox的id数组
  212. tableId: [],
  213. checkLength: 0, //对标分析只能选择2个
  214. tableData: {
  215. column: [
  216. {
  217. name: "",
  218. field: "index",
  219. is_num: false,
  220. is_light: false,
  221. },
  222. {
  223. name: "",
  224. field: "check",
  225. is_num: false,
  226. is_light: false,
  227. template: () => {
  228. return "<input class='check curCheckBox' type='CheckBox' />";
  229. },
  230. click: function(event, data) {
  231. var dataId = that.tableIdArr[data.index - 1];
  232. if (event.target.checked == false && that.checkLength <= 2) {
  233. that.tableId.forEach((item, i) => {
  234. if (item == dataId) {
  235. that.tableId.splice(i, 1);
  236. that.dbData.splice(i, 1);
  237. }
  238. });
  239. that.checkLength--;
  240. } else if (event.target.checked && that.checkLength < 2) {
  241. that.tableId.push(dataId);
  242. that.dbData.push(data);
  243. that.checkLength++;
  244. } else if (that.checkLength == 2) {
  245. event.target.checked = false;
  246. }
  247. },
  248. },
  249. {
  250. name: "名称",
  251. field: "name",
  252. is_num: false,
  253. is_light: false,
  254. },
  255. {
  256. name: "综合排名",
  257. field: "zhpm",
  258. is_num: false,
  259. is_light: false,
  260. sortable: true,
  261. },
  262. {
  263. name: "发电量排名",
  264. field: "fdlpm",
  265. is_num: false,
  266. is_light: false,
  267. sortable: true,
  268. },
  269. {
  270. name: "发电量",
  271. field: "fdl",
  272. is_num: false,
  273. is_light: false,
  274. sortable: true,
  275. },
  276. {
  277. name: "故障损失排名",
  278. field: "gzssdlpm",
  279. is_num: false,
  280. is_light: false,
  281. sortable: true,
  282. },
  283. {
  284. name: "故障损失",
  285. field: "gzssdl",
  286. is_num: false,
  287. is_light: false,
  288. sortable: true,
  289. },
  290. {
  291. name: "检修损失排名",
  292. field: "jxssdlpm",
  293. is_num: false,
  294. is_light: false,
  295. sortable: true,
  296. },
  297. {
  298. name: "检修损失",
  299. field: "jxssdl",
  300. is_num: false,
  301. is_light: false,
  302. sortable: true,
  303. },
  304. {
  305. name: "性能损失排名",
  306. field: "xnssdlpm",
  307. is_num: false,
  308. is_light: false,
  309. sortable: true,
  310. },
  311. {
  312. name: "性能损失",
  313. field: "xnssdl",
  314. is_num: false,
  315. is_light: false,
  316. sortable: true,
  317. },
  318. {
  319. name: "限电损失排名",
  320. field: "xdssdlpm",
  321. is_num: false,
  322. is_light: false,
  323. sortable: true,
  324. },
  325. {
  326. name: "限电损失",
  327. field: "xdssdl",
  328. is_num: false,
  329. is_light: false,
  330. sortable: true,
  331. },
  332. {
  333. name: "受累损失排名",
  334. field: "slssdlpm",
  335. is_num: false,
  336. is_light: false,
  337. sortable: true,
  338. },
  339. {
  340. name: "受累损失",
  341. field: "slssdl",
  342. is_num: false,
  343. is_light: false,
  344. sortable: true,
  345. },
  346. {
  347. name: "风能利用率排名",
  348. field: "fnlylpm",
  349. is_num: false,
  350. is_light: false,
  351. sortable: true,
  352. },
  353. {
  354. name: "风能利用率(%)",
  355. field: "fnlyl",
  356. is_num: false,
  357. is_light: false,
  358. sortable: true,
  359. },
  360. {
  361. name: "故障损失率排名",
  362. field: "gzsslpm",
  363. is_num: false,
  364. is_light: false,
  365. sortable: true,
  366. },
  367. {
  368. name: "故障损失率(%)",
  369. field: "gzssl",
  370. is_num: false,
  371. is_light: false,
  372. sortable: true,
  373. },
  374. {
  375. name: "检修损失率排名",
  376. field: "jxsslpm",
  377. is_num: false,
  378. is_light: false,
  379. sortable: true,
  380. },
  381. {
  382. name: "检修损失率(%)",
  383. field: "jxssl",
  384. is_num: false,
  385. is_light: false,
  386. sortable: true,
  387. },
  388. {
  389. name: "弃风率排名",
  390. field: "qflpm",
  391. is_num: false,
  392. is_light: false,
  393. sortable: true,
  394. },
  395. {
  396. name: "弃风率(%)",
  397. field: "qfl",
  398. is_num: false,
  399. is_light: false,
  400. sortable: true,
  401. },
  402. {
  403. name: "性能损失率排名",
  404. field: "xnsslpm",
  405. is_num: false,
  406. is_light: false,
  407. sortable: true,
  408. },
  409. {
  410. name: "性能损失率(%)",
  411. field: "xnssl",
  412. is_num: false,
  413. is_light: false,
  414. sortable: true,
  415. },
  416. {
  417. name: "受累损失率排名",
  418. field: "slsslpm",
  419. is_num: false,
  420. is_light: false,
  421. sortable: true,
  422. },
  423. {
  424. name: "受累损失率(%)",
  425. field: "slssl",
  426. is_num: false,
  427. is_light: false,
  428. sortable: true,
  429. },
  430. {
  431. name: "操作",
  432. field: "cz",
  433. is_num: false,
  434. is_light: false,
  435. template: function() {
  436. return "<a class='action'>详情</a>";
  437. },
  438. click: function(event, data) {
  439. var dataId = that.tableIdArr[data.index - 1];
  440. that.clearDb();
  441. that.detailShow = 2;
  442. // var that = this;
  443. api.benchmarkingDetails({
  444. id: dataId,
  445. beginDate: that.value4,
  446. endDate: that.value5,
  447. target: "",
  448. sort: "",
  449. }).then((res) => {
  450. var dataTab = [];
  451. res.data.forEach((item, index) => {
  452. that.tableIdArr.push(item.id);
  453. console.log(this,that)
  454. dataTab.push({
  455. //表格
  456. index: index + 1,
  457. fdl: item.fdl,
  458. name: item.name,
  459. zhpm: item.zhpm,
  460. gzssdl: item.gzssdl,
  461. jxssdlpm: item.jxssdlpm,
  462. jxssdl: item.jxssdl,
  463. xnssdlpm: item.xnssdlpm,
  464. xnssdl: item.xnssdl,
  465. xdssdlpm: item.xdssdlpm,
  466. xdssdl: item.xdssdl,
  467. slssdlpm: item.slssdlpm,
  468. slssdl: item.slssdl,
  469. fnlylpm: item.fnlylpm,
  470. fnlyl: item.fnlyl,
  471. gzsslpm: item.gzsslpm,
  472. gzssl: item.gzssl,
  473. jxsslpm: item.jxsslpm,
  474. jxssl: item.jxssl,
  475. qflpm: item.qflpm,
  476. qfl: item.qfl,
  477. xnsslpm: item.xnsslpm,
  478. xnssl: item.xnssl,
  479. slsslpm: item.slsslpm,
  480. slssl: item.slssl,
  481. is_light: false,
  482. });
  483. });
  484. that.tableDataDetail.data = dataTab;
  485. });
  486. // that.API.requestData({
  487. // method: "GET",
  488. // baseURL: "http://10.83.66.220:8020/",
  489. // subUrl: "benchmarking/details",
  490. // data: {
  491. // id: dataId,
  492. // beginDate: that.value4,
  493. // endDate: that.value5,
  494. // target: "",
  495. // sort: "",
  496. // },
  497. // success(res) {
  498. // var dataTab = [];
  499. // res.data.forEach((item, index) => {
  500. // that.tableIdArr.push(item.id);
  501. // dataTab.push({
  502. // //表格
  503. // index: index + 1,
  504. // fdl: item.fdl,
  505. // name: item.name,
  506. // zhpm: item.zhpm,
  507. // gzssdl: item.gzssdl,
  508. // jxssdlpm: item.jxssdlpm,
  509. // jxssdl: item.jxssdl,
  510. // xnssdlpm: item.xnssdlpm,
  511. // xnssdl: item.xnssdl,
  512. // xdssdlpm: item.xdssdlpm,
  513. // xdssdl: item.xdssdl,
  514. // slssdlpm: item.slssdlpm,
  515. // slssdl: item.slssdl,
  516. // fnlylpm: item.fnlylpm,
  517. // fnlyl: item.fnlyl,
  518. // gzsslpm: item.gzsslpm,
  519. // gzssl: item.gzssl,
  520. // jxsslpm: item.jxsslpm,
  521. // jxssl: item.jxssl,
  522. // qflpm: item.qflpm,
  523. // qfl: item.qfl,
  524. // xnsslpm: item.xnsslpm,
  525. // xnssl: item.xnssl,
  526. // slsslpm: item.slsslpm,
  527. // slssl: item.slssl,
  528. // is_light: false,
  529. // });
  530. // });
  531. // that.tableDataDetail.data = dataTab;
  532. // },
  533. // });
  534. },
  535. },
  536. ],
  537. data: [],
  538. },
  539. tableDataDetail: {
  540. column: [
  541. {
  542. name: "",
  543. field: "index",
  544. is_num: false,
  545. is_light: false,
  546. },
  547. {
  548. // name: "",
  549. name: "发电量",
  550. field: "fdl",
  551. is_num: false,
  552. is_light: false,
  553. display: "none",
  554. },
  555. {
  556. name: "",
  557. field: "check",
  558. is_num: false,
  559. is_light: false,
  560. template: function() {
  561. return "<input class='check curCheckBox checkItem' type='CheckBox'/>";
  562. },
  563. click: function(event, data) {
  564. var dataId = that.tableIdArr[data.index - 1];
  565. if (event.target.checked == false && that.checkLength <= 2) {
  566. that.tableId.forEach((item, i) => {
  567. if (item == dataId) {
  568. that.tableId.splice(i, 1);
  569. that.dbData.splice(i, 1);
  570. }
  571. });
  572. that.checkLength--;
  573. } else if (event.target.checked && that.checkLength < 2) {
  574. that.tableId.push(dataId);
  575. that.dbData.push(data);
  576. that.checkLength++;
  577. } else if (that.checkLength == 2) {
  578. event.target.checked = false;
  579. }
  580. },
  581. },
  582. {
  583. name: "风机名称",
  584. field: "name",
  585. is_num: false,
  586. is_light: false,
  587. },
  588. {
  589. name: "综合排名",
  590. field: "zhpm",
  591. is_num: false,
  592. is_light: false,
  593. sortable: true,
  594. },
  595. {
  596. name: "故障损失",
  597. field: "gzssdl",
  598. is_num: false,
  599. is_light: false,
  600. sortable: true,
  601. },
  602. {
  603. name: "检修损失排名",
  604. field: "jxssdlpm",
  605. is_num: false,
  606. is_light: false,
  607. sortable: true,
  608. },
  609. {
  610. name: "检修损失",
  611. field: "jxssdl",
  612. is_num: false,
  613. is_light: false,
  614. sortable: true,
  615. },
  616. {
  617. name: "性能损失排名",
  618. field: "xnssdlpm",
  619. is_num: false,
  620. is_light: false,
  621. sortable: true,
  622. },
  623. {
  624. name: "性能损失",
  625. field: "xnssdl",
  626. is_num: false,
  627. is_light: false,
  628. sortable: true,
  629. },
  630. {
  631. name: "限电损失排名",
  632. field: "xdssdlpm",
  633. is_num: false,
  634. is_light: false,
  635. sortable: true,
  636. },
  637. {
  638. name: "限电损失",
  639. field: "xdssdl",
  640. is_num: false,
  641. is_light: false,
  642. sortable: true,
  643. },
  644. {
  645. name: "受累损失排名",
  646. field: "slssdlpm",
  647. is_num: false,
  648. is_light: false,
  649. sortable: true,
  650. },
  651. {
  652. name: "受累损失",
  653. field: "slssdl",
  654. is_num: false,
  655. is_light: false,
  656. sortable: true,
  657. },
  658. {
  659. name: "故障损失率排名",
  660. field: "gzsslpm",
  661. is_num: false,
  662. is_light: false,
  663. sortable: true,
  664. },
  665. {
  666. name: "故障损失率(%)",
  667. field: "gzssl",
  668. is_num: false,
  669. is_light: false,
  670. sortable: true,
  671. },
  672. {
  673. name: "检修损失率排名",
  674. field: "jxsslpm",
  675. is_num: false,
  676. is_light: false,
  677. sortable: true,
  678. },
  679. {
  680. name: "检修损失率(%)",
  681. field: "jxssl",
  682. is_num: false,
  683. is_light: false,
  684. sortable: true,
  685. },
  686. {
  687. name: "弃风率排名",
  688. field: "qflpm",
  689. is_num: false,
  690. is_light: false,
  691. sortable: true,
  692. },
  693. {
  694. name: "弃风率(%)",
  695. field: "qfl",
  696. is_num: false,
  697. is_light: false,
  698. sortable: true,
  699. },
  700. {
  701. name: "性能损失率排名",
  702. field: "xnsslpm",
  703. is_num: false,
  704. is_light: false,
  705. sortable: true,
  706. },
  707. {
  708. name: "性能损失率(%)",
  709. field: "xnssl",
  710. is_num: false,
  711. is_light: false,
  712. sortable: true,
  713. },
  714. {
  715. name: "受累损失率排名",
  716. field: "slsslpm",
  717. is_num: false,
  718. is_light: false,
  719. sortable: true,
  720. },
  721. {
  722. name: "受累损失率(%)",
  723. field: "slssl",
  724. is_num: false,
  725. is_light: false,
  726. sortable: true,
  727. },
  728. ],
  729. data: [],
  730. },
  731. options: [],
  732. ChangZhan: [], //场站
  733. XiangMu: [], //项目
  734. XianLu: [], //线路
  735. value1: [],
  736. value2: [],
  737. value3: [],
  738. value4: "",
  739. value5: "",
  740. innerFdl: [], //发电量占比
  741. outerFdl: [],
  742. innerCz: [], //各场站损失电量占比
  743. outerCz: [],
  744. innerLl: [], //理论发电量占比
  745. outerLl: [],
  746. analyis: [], //损失电量分析
  747. dialogVisible: false,
  748. radarValue: [],
  749. windNum: "dd",
  750. windNum2: "dd",
  751. tabs: [],
  752. analyisDialog: [],
  753. detailShow: 1,
  754. ajaxData: [],
  755. dbData: [],
  756. };
  757. },
  758. created() {
  759. this.ChangZhanVal();
  760. // this.XiangMuVal()
  761. this.value4 = this.getTime(1);
  762. this.value5 = this.getTime(2);
  763. this.AjaxCommon();
  764. },
  765. methods: {
  766. ChangZhanVal() {
  767. api.benchmarkingWplist2({
  768. }).then((res) => {
  769. // that.value2.push(res.data[0].id);
  770. this.ChangZhan = res.data;
  771. // that.AjaxCommon();
  772. this.XiangMuVal(this.value2);
  773. console.log("resCHANzhan:", res.data);
  774. console.log("value2:", this.value2);
  775. });
  776. // var that = this;
  777. // that.API.requestData({
  778. // method: "GET",
  779. // baseURL: "http://10.83.66.220:8020/",
  780. // subUrl: "benchmarking/wplist",
  781. // success(res) {
  782. // // that.value2.push(res.data[0].id);
  783. // that.ChangZhan = res.data;
  784. // // that.AjaxCommon();
  785. // that.XiangMuVal(that.value2);
  786. // console.log("resCHANzhan:", res.data);
  787. // console.log("value2:", that.value2);
  788. // },
  789. // });
  790. },
  791. ChangZhanChange(val) {
  792. this.value1 = val;
  793. this.value2 = [];
  794. // this.value2 = val;
  795. this.value3 = [];
  796. this.AjaxCommon();
  797. this.XiangMuVal(val);
  798. this.clearDb();
  799. },
  800. XiangMuVal(val) {
  801. api.benchmarkingProjectList({
  802. wpids: val,
  803. }).then((res) => {
  804. this.XiangMu = res.data;
  805. });
  806. // var that = this;
  807. // that.API.requestData({
  808. // method: "GET",
  809. // baseURL: "http://10.83.66.220:8020/",
  810. // subUrl: "benchmarking/projectList",
  811. // data: {
  812. // wpids: val,
  813. // },
  814. // success(res) {
  815. // that.XiangMu = res.data;
  816. // console.log("Xiangmu:", res.data);
  817. // },
  818. // });
  819. },
  820. XiangMuChange(val) {
  821. this.value2 = val;
  822. this.value3 = [];
  823. this.AjaxCommon();
  824. // this.XiangMuVal(val);
  825. this.XianLuVal(val);
  826. this.clearDb();
  827. },
  828. XianLuVal(val) {
  829. api.benchmarkingLineList2({
  830. projects: val,
  831. }).then((res) => {
  832. this.XianLu = res.data;
  833. });
  834. // var that = this;
  835. // that.API.requestData({
  836. // method: "GET",
  837. // baseURL: "http://10.83.66.220:8020/",
  838. // subUrl: "benchmarking/lineList",
  839. // data: {
  840. // projects: val,
  841. // },
  842. // success(res) {
  843. // that.XianLu = res.data;
  844. // },
  845. // });
  846. },
  847. XianLuChange(val) {
  848. this.value3 = val;
  849. this.AjaxCommon();
  850. this.clearDb();
  851. },
  852. BeginChange(val) {
  853. this.value4 = val;
  854. this.AjaxCommon();
  855. this.clearDb();
  856. },
  857. EndChange(val) {
  858. this.value5 = val;
  859. this.AjaxCommon();
  860. this.clearDb();
  861. },
  862. getTime(val) {
  863. //时间戳处理,val=1是默认开始时间(当前月第一天),val=2是默认结束时间(今天)
  864. var date = new Date();
  865. var year = date.getFullYear(),
  866. month = date.getMonth() + 1,
  867. day = date.getDate();
  868. month >= 1 && month <= 9 ? (month = "0" + month) : "";
  869. day >= 0 && day <= 9 ? (day = "0" + day) : "";
  870. var begin = year + "-" + month + "-01";
  871. var end = year + "-" + month + "-" + day;
  872. if (val == 1) {
  873. return begin;
  874. } else if (val == 2) {
  875. return end;
  876. }
  877. },
  878. AjaxCommon() {
  879. api.benchmarkingWxssl({
  880. wpids: this.value1,
  881. projectids: this.value2,
  882. lineids: this.value3,
  883. beginDate: this.value4,
  884. endDate: this.value5,
  885. target: "",
  886. sort: "",
  887. }).then((res) => {
  888. this.ajaxData = res.data;
  889. console.log("resData:", res);
  890. var dataTab = [], //表格
  891. fdl = [],
  892. cz = [],
  893. ll = [],
  894. analyis = [],
  895. gzssdl = [],
  896. jxssdl = [],
  897. xnssdl = [],
  898. xdssdl = [],
  899. slssdl = [];
  900. res.data.forEach((item, index) => {
  901. this.tableIdArr.push(item.id);
  902. dataTab.push({
  903. //表格
  904. index: index + 1,
  905. name: item.name,
  906. zhpm: item.zhpm,
  907. fdlpm: item.fdlpm,
  908. fdl: item.fdl,
  909. gzssdlpm: item.gzssdlpm,
  910. gzssdl: item.gzssdl,
  911. jxssdlpm: item.jxssdlpm,
  912. jxssdl: item.jxssdl,
  913. xnssdlpm: item.xnssdlpm,
  914. xnssdl: item.xnssdl,
  915. xdssdlpm: item.xdssdlpm,
  916. xdssdl: item.xdssdl,
  917. slssdlpm: item.slssdlpm,
  918. slssdl: item.slssdl,
  919. fnlylpm: item.fnlylpm,
  920. fnlyl: item.fnlyl,
  921. gzsslpm: item.gzsslpm,
  922. gzssl: item.gzssl,
  923. jxsslpm: item.jxsslpm,
  924. jxssl: item.jxssl,
  925. qflpm: item.qflpm,
  926. qfl: item.qfl,
  927. xnsslpm: item.xnsslpm,
  928. xnssl: item.xnssl,
  929. slsslpm: item.slsslpm,
  930. slssl: item.slssl,
  931. is_light: false,
  932. });
  933. fdl.push({
  934. value: item.fdl,
  935. name: item.name,
  936. });
  937. cz.push({
  938. value: (
  939. item.gzssdl +
  940. item.jxssdl +
  941. item.xnssdl +
  942. item.xdssdl +
  943. item.slssdl
  944. ).toFixed(2),
  945. name: item.name,
  946. });
  947. ll.push({
  948. value: item.llfdl,
  949. name: item.name,
  950. });
  951. gzssdl.push({
  952. text: item.name,
  953. value: item.gzssdl,
  954. });
  955. jxssdl.push({
  956. text: item.name,
  957. value: item.jxssdl,
  958. });
  959. xnssdl.push({
  960. text: item.name,
  961. value: item.xnssdl,
  962. });
  963. xdssdl.push({
  964. text: item.name,
  965. value: item.xdssdl,
  966. });
  967. slssdl.push({
  968. text: item.name,
  969. value: item.slssdl,
  970. });
  971. });
  972. analyis.push(
  973. {
  974. title: "故障损失电量",
  975. yAxisIndex: 0,
  976. value: gzssdl,
  977. },
  978. {
  979. title: "检修损失电量",
  980. yAxisIndex: 0,
  981. value: jxssdl,
  982. },
  983. {
  984. title: "性能损失电量",
  985. yAxisIndex: 0,
  986. value: xnssdl,
  987. },
  988. {
  989. title: "限电损失电量",
  990. yAxisIndex: 0,
  991. value: xdssdl,
  992. },
  993. {
  994. title: "受累损失电量",
  995. yAxisIndex: 0,
  996. value: slssdl,
  997. }
  998. );
  999. this.tableData.data = dataTab;
  1000. this.innerFdl = fdl;
  1001. this.outerFdl = fdl;
  1002. this.innerCz = cz;
  1003. this.outerCz = cz;
  1004. this.innerLl = ll;
  1005. this.outerLl = ll;
  1006. this.analyis = analyis;
  1007. });
  1008. // var that = this;
  1009. // that.API.requestData({
  1010. // //五项损失率
  1011. // method: "GET",
  1012. // baseURL: "http://10.83.66.220:8020/",
  1013. // subUrl: "benchmarking/wxssl",
  1014. // data: {
  1015. // wpids: that.value1,
  1016. // projectids: that.value2,
  1017. // lineids: that.value3,
  1018. // beginDate: that.value4,
  1019. // endDate: that.value5,
  1020. // target: "",
  1021. // sort: "",
  1022. // },
  1023. // success(res) {
  1024. // that.ajaxData = res.data;
  1025. // console.log("resData:", res);
  1026. // var dataTab = [], //表格
  1027. // fdl = [],
  1028. // cz = [],
  1029. // ll = [],
  1030. // analyis = [],
  1031. // gzssdl = [],
  1032. // jxssdl = [],
  1033. // xnssdl = [],
  1034. // xdssdl = [],
  1035. // slssdl = [];
  1036. // res.data.forEach((item, index) => {
  1037. // that.tableIdArr.push(item.id);
  1038. // dataTab.push({
  1039. // //表格
  1040. // index: index + 1,
  1041. // name: item.name,
  1042. // zhpm: item.zhpm,
  1043. // fdlpm: item.fdlpm,
  1044. // fdl: item.fdl,
  1045. // gzssdlpm: item.gzssdlpm,
  1046. // gzssdl: item.gzssdl,
  1047. // jxssdlpm: item.jxssdlpm,
  1048. // jxssdl: item.jxssdl,
  1049. // xnssdlpm: item.xnssdlpm,
  1050. // xnssdl: item.xnssdl,
  1051. // xdssdlpm: item.xdssdlpm,
  1052. // xdssdl: item.xdssdl,
  1053. // slssdlpm: item.slssdlpm,
  1054. // slssdl: item.slssdl,
  1055. // fnlylpm: item.fnlylpm,
  1056. // fnlyl: item.fnlyl,
  1057. // gzsslpm: item.gzsslpm,
  1058. // gzssl: item.gzssl,
  1059. // jxsslpm: item.jxsslpm,
  1060. // jxssl: item.jxssl,
  1061. // qflpm: item.qflpm,
  1062. // qfl: item.qfl,
  1063. // xnsslpm: item.xnsslpm,
  1064. // xnssl: item.xnssl,
  1065. // slsslpm: item.slsslpm,
  1066. // slssl: item.slssl,
  1067. // is_light: false,
  1068. // });
  1069. // fdl.push({
  1070. // value: item.fdl,
  1071. // name: item.name,
  1072. // });
  1073. // cz.push({
  1074. // value: (
  1075. // item.gzssdl +
  1076. // item.jxssdl +
  1077. // item.xnssdl +
  1078. // item.xdssdl +
  1079. // item.slssdl
  1080. // ).toFixed(2),
  1081. // name: item.name,
  1082. // });
  1083. // ll.push({
  1084. // value: item.llfdl,
  1085. // name: item.name,
  1086. // });
  1087. // gzssdl.push({
  1088. // text: item.name,
  1089. // value: item.gzssdl,
  1090. // });
  1091. // jxssdl.push({
  1092. // text: item.name,
  1093. // value: item.jxssdl,
  1094. // });
  1095. // xnssdl.push({
  1096. // text: item.name,
  1097. // value: item.xnssdl,
  1098. // });
  1099. // xdssdl.push({
  1100. // text: item.name,
  1101. // value: item.xdssdl,
  1102. // });
  1103. // slssdl.push({
  1104. // text: item.name,
  1105. // value: item.slssdl,
  1106. // });
  1107. // });
  1108. // analyis.push(
  1109. // {
  1110. // title: "故障损失电量",
  1111. // yAxisIndex: 0,
  1112. // value: gzssdl,
  1113. // },
  1114. // {
  1115. // title: "检修损失电量",
  1116. // yAxisIndex: 0,
  1117. // value: jxssdl,
  1118. // },
  1119. // {
  1120. // title: "性能损失电量",
  1121. // yAxisIndex: 0,
  1122. // value: xnssdl,
  1123. // },
  1124. // {
  1125. // title: "限电损失电量",
  1126. // yAxisIndex: 0,
  1127. // value: xdssdl,
  1128. // },
  1129. // {
  1130. // title: "受累损失电量",
  1131. // yAxisIndex: 0,
  1132. // value: slssdl,
  1133. // }
  1134. // );
  1135. // that.tableData.data = dataTab;
  1136. // that.innerFdl = fdl;
  1137. // that.outerFdl = fdl;
  1138. // that.innerCz = cz;
  1139. // that.outerCz = cz;
  1140. // that.innerLl = ll;
  1141. // that.outerLl = ll;
  1142. // that.analyis = analyis;
  1143. // },
  1144. // });
  1145. },
  1146. AjaxDbfx() {
  1147. var that = this;
  1148. var data = that.dbData;
  1149. that.windNum = data[0].name;
  1150. that.windNum2 = data[1].name;
  1151. that.tabs = [
  1152. {
  1153. name: "发电量",
  1154. windData1: data[0].fdl,
  1155. windData2: data[1].fdl,
  1156. },
  1157. {
  1158. name: "故障损失电量",
  1159. windData1: data[0].gzssdl,
  1160. windData2: data[1].gzssdl,
  1161. },
  1162. {
  1163. name: "检修损失电量",
  1164. windData1: data[0].jxssdl,
  1165. windData2: data[1].jxssdl,
  1166. },
  1167. {
  1168. name: "性能未达标损失电量",
  1169. windData1: data[0].xnssdl,
  1170. windData2: data[1].xnssdl,
  1171. },
  1172. {
  1173. name: "受累损失电量",
  1174. windData1: data[0].slssdl,
  1175. windData2: data[1].slssdl,
  1176. },
  1177. {
  1178. name: "风能利用率",
  1179. windData1: data[0].fnlyl,
  1180. windData2: data[1].fnlyl,
  1181. },
  1182. {
  1183. name: "故障损失率",
  1184. windData1: data[0].gzssl,
  1185. windData2: data[1].gzssl,
  1186. },
  1187. {
  1188. name: "检修损失率",
  1189. windData1: data[0].jxssl,
  1190. windData2: data[1].jxssl,
  1191. },
  1192. {
  1193. name: "弃风率",
  1194. windData1: data[0].qfl,
  1195. windData2: data[1].qfl,
  1196. },
  1197. {
  1198. name: "性能损失率",
  1199. windData1: data[0].xnssl,
  1200. windData2: data[1].xnssl,
  1201. },
  1202. {
  1203. name: "受累损失率",
  1204. windData1: data[0].slssl,
  1205. windData2: data[1].slssl,
  1206. },
  1207. ];
  1208. that.radarValue = [
  1209. {
  1210. indicator: [
  1211. "风能利用率",
  1212. "故障损失率",
  1213. "检修损失率",
  1214. "弃风率",
  1215. "性能损失率",
  1216. "受累损失率",
  1217. ],
  1218. data: [
  1219. {
  1220. value: [
  1221. data[0].fnlylpm,
  1222. data[0].gzsslpm,
  1223. data[0].jxsslpm,
  1224. data[0].qflpm,
  1225. data[0].xnsslpm,
  1226. data[0].slsslpm,
  1227. ],
  1228. },
  1229. {
  1230. value: [
  1231. data[1].fnlylpm,
  1232. data[1].gzsslpm,
  1233. data[1].jxsslpm,
  1234. data[1].qflpm,
  1235. data[1].xnsslpm,
  1236. data[1].slsslpm,
  1237. ],
  1238. },
  1239. ],
  1240. },
  1241. ];
  1242. var analyis = [],
  1243. gzssdl = [],
  1244. jxssdl = [],
  1245. xnssdl = [],
  1246. xdssdl = [],
  1247. slssdl = [];
  1248. data.forEach((item, index) => {
  1249. gzssdl.push({
  1250. text: item.name,
  1251. value: item.gzssdl,
  1252. });
  1253. jxssdl.push({
  1254. text: item.name,
  1255. value: item.jxssdl,
  1256. });
  1257. xnssdl.push({
  1258. text: item.name,
  1259. value: item.xnssdl,
  1260. });
  1261. xdssdl.push({
  1262. text: item.name,
  1263. value: item.xdssdl,
  1264. });
  1265. slssdl.push({
  1266. text: item.name,
  1267. value: item.slssdl,
  1268. });
  1269. });
  1270. analyis.push(
  1271. {
  1272. title: "故障损失电量",
  1273. yAxisIndex: 0,
  1274. value: gzssdl,
  1275. },
  1276. {
  1277. title: "检修损失电量",
  1278. yAxisIndex: 0,
  1279. value: jxssdl,
  1280. },
  1281. {
  1282. title: "性能损失电量",
  1283. yAxisIndex: 0,
  1284. value: xnssdl,
  1285. },
  1286. {
  1287. title: "限电损失电量",
  1288. yAxisIndex: 0,
  1289. value: xdssdl,
  1290. },
  1291. {
  1292. title: "受累损失电量",
  1293. yAxisIndex: 0,
  1294. value: slssdl,
  1295. }
  1296. );
  1297. that.analyisDialog = analyis;
  1298. },
  1299. tooltip(param, callback) {
  1300. var color = ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"];
  1301. var result = param[0].axisValue;
  1302. param.forEach((value, index) => {
  1303. result +=
  1304. "<br />" +
  1305. `<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color[index]};"></span>` +
  1306. value.seriesName +
  1307. ":" +
  1308. value.value;
  1309. });
  1310. callback(result);
  1311. return true;
  1312. },
  1313. dbfx() {
  1314. var that = this;
  1315. if (that.tableId.length == 2) {
  1316. that.dialogVisible = true;
  1317. this.AjaxDbfx();
  1318. this.clearDb();
  1319. }
  1320. },
  1321. clearDb() {
  1322. //清空对标状态
  1323. this.$refs.curRef.clearCheckBox();
  1324. this.tableId = [];
  1325. this.dbData = [];
  1326. this.checkLength = 0;
  1327. },
  1328. back() {
  1329. this.detailShow = 1;
  1330. this.clearDb();
  1331. },
  1332. onSort() {
  1333. this.clearDb();
  1334. },
  1335. },
  1336. };
  1337. </script>
  1338. <style lang="less">
  1339. .decision-page-2 {
  1340. .content .project-table {
  1341. tbody {
  1342. height: calc(100vh - 24.5vh);
  1343. }
  1344. }
  1345. .project-table {
  1346. overflow: auto;
  1347. tbody {
  1348. height: 145px;
  1349. }
  1350. th,
  1351. td {
  1352. color: #b2bdc0;
  1353. &:nth-child(1) {
  1354. width: 50px;
  1355. }
  1356. &:nth-child(2) {
  1357. width: 50px;
  1358. }
  1359. }
  1360. }
  1361. .action {
  1362. text-decoration: underline;
  1363. color: @green;
  1364. cursor: pointer;
  1365. }
  1366. }
  1367. </style>