decision2Xldb.vue 23 KB

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