disaster.vue 34 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708
  1. <!--灾后评估-->
  2. <template>
  3. <div class="visual-con">
  4. <!--头部-->
  5. <vheader></vheader>
  6. <!--主体-->
  7. <div class="visual-body">
  8. <!-- 左侧 -->
  9. <div class="leftbar" :class="indentleft" ref="left">
  10. <div class="forthis">
  11. <div class="this-title">
  12. <el-date-picker v-model="pickYear" @change="getInit()" type="year" placeholder="选择年">
  13. </el-date-picker>
  14. </div>
  15. <div class="i-list-con h-73">
  16. <div class="d-l-con-icon">
  17. <div class="icon-con m-btm-no">
  18. <div class="icon icon-dot"></div>
  19. <div class="icon-text flex-r">
  20. <h5>{{numberFiresYear}}次</h5>
  21. <h5>火灾次数</h5>
  22. </div>
  23. </div>
  24. <div class="icon-con m-btm-no">
  25. <div class="icon icon-dot"></div>
  26. <div class="icon-text flex-r">
  27. <h5>{{forestFireLossTotal}}万元</h5>
  28. <h5>损失总计</h5>
  29. </div>
  30. </div>
  31. </div>
  32. <div class="d-l-con flex-c">
  33. <div class="d-l-l-text">
  34. <h2>火灾损失价值</h2>
  35. </div>
  36. <div class="d-l-l-text ">
  37. <h3>合计:{{fireLossTotalYear}}万元</h3>
  38. </div>
  39. <el-table :data="forestResourcesYear">
  40. <el-table-column label="林木资源">
  41. <el-table-column label="成林" width="50%">
  42. <el-table-column label="蓄积">
  43. <el-table-column prop="forestArea" label="米">
  44. </el-table-column>
  45. </el-table-column>
  46. <el-table-column prop="worth" label="价值" width="50%">
  47. <el-table-column prop="forestPrice" label="万元">
  48. </el-table-column>
  49. </el-table-column>
  50. </el-table-column>
  51. <el-table-column prop="youngTree" label="幼树">
  52. <el-table-column prop="number" label="株数">
  53. <el-table-column prop="treesNumber" label="万株">
  54. </el-table-column>
  55. </el-table-column>
  56. <el-table-column prop="worth" label="价值">
  57. <el-table-column prop="treesPrice" label="万元">
  58. </el-table-column>
  59. </el-table-column>
  60. </el-table-column>
  61. </el-table-column>
  62. </el-table>
  63. <el-table style="margin-top: 1rem;" :data="casualtiesYear">
  64. <el-table-column prop="date" label="人员伤亡">
  65. <el-table-column label="轻伤" width="50%">
  66. <el-table-column label="人数">
  67. <el-table-column prop="minorInjuriesNumber" label="人">
  68. </el-table-column>
  69. </el-table-column>
  70. <el-table-column label="费用" width="50%">
  71. <el-table-column prop="minorInjuriesPrice" label="万元">
  72. </el-table-column>
  73. </el-table-column>
  74. </el-table-column>
  75. <el-table-column label="重伤">
  76. <el-table-column label="人数">
  77. <el-table-column prop="seriouslyInjuredNumber" label="人">
  78. </el-table-column>
  79. </el-table-column>
  80. <el-table-column label="费用">
  81. <el-table-column prop="seriouslyInjuredPrice" label="万元">
  82. </el-table-column>
  83. </el-table-column>
  84. </el-table-column>
  85. <el-table-column label="死亡">
  86. <el-table-column label="人数">
  87. <el-table-column prop="deathNumber" label="人">
  88. </el-table-column>
  89. </el-table-column>
  90. <el-table-column label="费用">
  91. <el-table-column prop="deathPrice" label="万元">
  92. </el-table-column>
  93. </el-table-column>
  94. </el-table-column>
  95. </el-table-column>
  96. </el-table>
  97. <el-table style="margin-top: 1rem;" :data="elseFireLossPriceYear">
  98. <el-table-column label="其他火灾损失">
  99. <el-table-column prop="elseFireLossPrice" label="万元">
  100. </el-table-column>
  101. </el-table-column>
  102. </el-table>
  103. </div>
  104. <div class="d-l-con flex-c">
  105. <div class="d-l-l-text">
  106. <h2>扑火费用支出</h2>
  107. </div>
  108. <div class="d-l-l-text ">
  109. <h3>合计:{{blazesPriceTotalYear}}万元</h3>
  110. </div>
  111. <el-table style="margin-top: 1rem;" :data="fireFightingCasualtiesYear">
  112. <el-table-column prop="date" label="人员伤亡">
  113. <el-table-column label="人工费" width="50%">
  114. <el-table-column label="人工">
  115. <el-table-column prop="artificialDays" label="工日">
  116. </el-table-column>
  117. </el-table-column>
  118. <el-table-column label="费用" width="50%">
  119. <el-table-column prop="artificialPrice" label="万元">
  120. </el-table-column>
  121. </el-table-column>
  122. </el-table-column>
  123. <el-table-column prop="vehicleFee" label="车辆费">
  124. <el-table-column label="合计">
  125. <el-table-column prop="vehicleNumber" label="台">
  126. </el-table-column>
  127. </el-table-column>
  128. <el-table-column label="汽车">
  129. <el-table-column prop="carNumber" label="台">
  130. </el-table-column>
  131. </el-table-column>
  132. <el-table-column label="费用">
  133. <el-table-column prop="vehiclePrice" label="万元">
  134. </el-table-column>
  135. </el-table-column>
  136. </el-table-column>
  137. <el-table-column prop="flightFee" label="飞行费">
  138. <el-table-column label="飞机">
  139. <el-table-column prop="planeNumber" label="架次">
  140. </el-table-column>
  141. </el-table-column>
  142. <el-table-column label="费用">
  143. <el-table-column prop="planePrice" label="万元">
  144. </el-table-column>
  145. </el-table-column>
  146. </el-table-column>
  147. </el-table-column>
  148. </el-table>
  149. <el-table style="margin-top: 1rem;" :data="otherFireCostsYear">
  150. <el-table-column label="其他火灾费用">
  151. <el-table-column prop="elseBlazesPrice" label="万元">
  152. </el-table-column>
  153. </el-table-column>
  154. </el-table>
  155. </div>
  156. </div>
  157. </div>
  158. </div>
  159. <!-- 地图 -->
  160. <supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'disasterMap'"
  161. :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false"></supermap>
  162. <!-- 右侧 -->
  163. <div class="rightbar" :class="indentright" ref="right">
  164. <div class="forthis">
  165. <div class="this-title">
  166. <span>列表</span>
  167. </div>
  168. <div class="i-list-con h-19">
  169. <div class="d-l-con" :class="{on:listCurrentIndex==index}" v-for="(item,index) in fireList" :key="index" @click="choseFireList(item.id,index)">
  170. <div class="d-l-l-text" >
  171. <i class="i-small"></i>
  172. <h4>{{pickYear.getYear()+1900}}年第{{index+1}}场火灾</h4>
  173. </div>
  174. </div>
  175. </div>
  176. </div>
  177. <div class="forthis">
  178. <div class="i-list-con h-51">
  179. <div class="forthis">
  180. <div class="d-l-con flex-c">
  181. <div class="d-l-l-text">
  182. <h2>火灾损失价值</h2>
  183. </div>
  184. <div class="d-l-l-text ">
  185. <h3>合计:{{fireLossTotal}}万元</h3>
  186. </div>
  187. <el-table :data="forestResources">
  188. <el-table-column label="林木资源">
  189. <el-table-column label="成林" width="50%">
  190. <el-table-column label="蓄积">
  191. <el-table-column prop="forestArea" label="米">
  192. </el-table-column>
  193. </el-table-column>
  194. <el-table-column prop="worth" label="价值" width="50%">
  195. <el-table-column prop="forestPrice" label="万元">
  196. </el-table-column>
  197. </el-table-column>
  198. </el-table-column>
  199. <el-table-column label="幼树">
  200. <el-table-column label="株数">
  201. <el-table-column prop="treesNumber" label="万株">
  202. </el-table-column>
  203. </el-table-column>
  204. <el-table-column prop="worth" label="价值">
  205. <el-table-column prop="treesPrice" label="万元">
  206. </el-table-column>
  207. </el-table-column>
  208. </el-table-column>
  209. </el-table-column>
  210. </el-table>
  211. <el-table style="margin-top: 1rem;" :data="casualties">
  212. <el-table-column label="人员伤亡">
  213. <el-table-column label="轻伤" width="50%">
  214. <el-table-column label="人数">
  215. <el-table-column prop="minorInjuriesNumber" label="人">
  216. </el-table-column>
  217. </el-table-column>
  218. <el-table-column label="费用" width="50%">
  219. <el-table-column prop="minorInjuriesPrice" label="万元">
  220. </el-table-column>
  221. </el-table-column>
  222. </el-table-column>
  223. <el-table-column label="重伤">
  224. <el-table-column label="人数">
  225. <el-table-column prop="seriouslyInjuredNumber" label="人">
  226. </el-table-column>
  227. </el-table-column>
  228. <el-table-column label="费用">
  229. <el-table-column prop="seriouslyInjuredPrice" label="万元">
  230. </el-table-column>
  231. </el-table-column>
  232. </el-table-column>
  233. <el-table-column label="死亡">
  234. <el-table-column label="人数">
  235. <el-table-column prop="deathNumber" label="人">
  236. </el-table-column>
  237. </el-table-column>
  238. <el-table-column label="费用">
  239. <el-table-column prop="deathPrice" label="万元">
  240. </el-table-column>
  241. </el-table-column>
  242. </el-table-column>
  243. </el-table-column>
  244. </el-table>
  245. <el-table style="margin-top: 1rem;" :data="elseFireLossPrice">
  246. <el-table-column label="其他火灾损失">
  247. <el-table-column prop="elseFireLossPrice" label="万元">
  248. </el-table-column>
  249. </el-table-column>
  250. </el-table>
  251. </div>
  252. <div class="d-l-con flex-c">
  253. <div class="d-l-l-text">
  254. <h2>扑火费用支出</h2>
  255. </div>
  256. <div class="d-l-l-text ">
  257. <h3>合计:{{blazesPriceTotal}}万元</h3>
  258. </div>
  259. <el-table style="margin-top: 1rem;" :data="fireFightingCasualties">
  260. <el-table-column label="人员伤亡">
  261. <el-table-column prop="artificial" label="人工费" width="50%">
  262. <el-table-column label="人工">
  263. <el-table-column prop="artificialDays" label="工日">
  264. </el-table-column>
  265. </el-table-column>
  266. <el-table-column label="费用" width="50%">
  267. <el-table-column prop="artificialPrice" label="万元">
  268. </el-table-column>
  269. </el-table-column>
  270. </el-table-column>
  271. <el-table-column label="车辆费">
  272. <el-table-column label="合计">
  273. <el-table-column prop="vehicleNumber" label="台">
  274. </el-table-column>
  275. </el-table-column>
  276. <el-table-column label="汽车">
  277. <el-table-column prop="carNumber" label="台">
  278. </el-table-column>
  279. </el-table-column>
  280. <el-table-column label="费用">
  281. <el-table-column prop="vehiclePrice" label="万元">
  282. </el-table-column>
  283. </el-table-column>
  284. </el-table-column>
  285. <el-table-column prop="flightFee" label="飞行费">
  286. <el-table-column label="飞机">
  287. <el-table-column prop="planeNumber" label="架次">
  288. </el-table-column>
  289. </el-table-column>
  290. <el-table-column label="费用">
  291. <el-table-column prop="planePrice" label="万元">
  292. </el-table-column>
  293. </el-table-column>
  294. </el-table-column>
  295. </el-table-column>
  296. </el-table>
  297. <el-table style="margin-top: 1rem;" :data="otherFireCosts">
  298. <el-table-column label="其他火灾费用">
  299. <el-table-column prop="elseBlazesPrice" label="万元">
  300. </el-table-column>
  301. </el-table-column>
  302. </el-table>
  303. </div>
  304. </div>
  305. </div>
  306. </div>
  307. </div>
  308. <vBottomMenu ref="bottomMenu"></vBottomMenu>
  309. <el-tooltip :content="indentText" placement="top" :disabled="indentdisabled">
  310. <div class="mascot" ref="mascot" :class="indentStyle" @click="indent"><img
  311. src="@/assets/images/mascot.png"/></div>
  312. </el-tooltip>
  313. </div>
  314. <eventLocation ref="eventLocation"></eventLocation>
  315. </div>
  316. </template>
  317. <script>
  318. import {
  319. getInit, selectFireLoseByid
  320. } from '@/api/disaster'
  321. import supermap from '@/components/supermap' //超图
  322. import vheader from '@/components/v-header.vue' //一体化共用头部
  323. import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
  324. import eventLocation from '@/components/eventLocation.vue' //事件定位弹窗
  325. // import echarts from 'echarts'
  326. let echarts = require('echarts')
  327. export default {
  328. dicts: ['event_source'],
  329. components: {
  330. supermap,
  331. vheader,
  332. vBottomMenu,
  333. eventLocation
  334. },
  335. created() {
  336. /** ----------------------------------底部按钮公用组件开始------------------------------------- */
  337. window.showDialog=this.showDialog
  338. window.choseLayerSwitching=this.choseLayerSwitching
  339. /** ----------------------------------底部按钮公用组件结束------------------------------------- */
  340. },
  341. mounted() {
  342. this.getInit()
  343. },
  344. data() {
  345. return {
  346. listCurrentIndex:0,
  347. numberFiresYear: 0,
  348. forestFireLossTotal: 0,
  349. fireLossTotalYear: 0,
  350. forestResourcesYear: [
  351. {
  352. forestArea: '0',
  353. forestPrice: '0',
  354. treesNumber: '0',
  355. treesPrice: '0'
  356. }
  357. ],
  358. casualtiesYear: [
  359. {
  360. minorInjuriesNumber: '0',
  361. minorInjuriesPrice: '0',
  362. seriouslyInjuredNumber: '0',
  363. seriouslyInjuredPrice: '0',
  364. deathNumber: '0',
  365. deathPrice: '0'
  366. }
  367. ],
  368. elseFireLossPriceYear: [
  369. {
  370. elseFireLossPrice: '0'
  371. }
  372. ],
  373. blazesPriceTotalYear: 0,
  374. fireFightingCasualtiesYear: [
  375. {
  376. artificialDays: '0',
  377. artificialPrice: '0',
  378. vehicleNumber: '0',
  379. carNumber: '0',
  380. vehiclePrice: '0',
  381. planeNumber: '0',
  382. planePrice: '0'
  383. }
  384. ],
  385. otherFireCostsYear: [
  386. {
  387. elseBlazesPrice: '0'
  388. }
  389. ],
  390. fireLossTotal: 0,
  391. forestResources: [
  392. {
  393. forestArea: '0',
  394. forestPrice: '0',
  395. treesNumber: '0',
  396. treesPrice: '0'
  397. }
  398. ],
  399. casualties: [
  400. {
  401. minorInjuriesNumber: '0',
  402. minorInjuriesPrice: '0',
  403. seriouslyInjuredNumber: '0',
  404. seriouslyInjuredPrice: '0',
  405. deathNumber: '0',
  406. deathPrice: '0'
  407. }
  408. ],
  409. elseFireLossPrice: [
  410. {
  411. elseFireLossPrice: '0'
  412. }
  413. ],
  414. blazesPriceTotal: 0,
  415. fireFightingCasualties: [
  416. {
  417. artificialDays: '0',
  418. artificialPrice: '0',
  419. vehicleNumber: '0',
  420. carNumber: '0',
  421. vehiclePrice: '0',
  422. planeNumber: '0',
  423. planePrice: '0'
  424. }
  425. ],
  426. otherFireCosts: [
  427. {
  428. elseBlazesPrice: '0'
  429. }
  430. ],
  431. pickYear: new Date(), //选择年份
  432. graphicsList: [],//地图区域
  433. fireList: [], //右侧活在列表
  434. eventChartData: [], //左侧eachar图表数据
  435. //左右缩进
  436. indentStyle: '',
  437. indentleft: '',
  438. indentright: '',
  439. indentText: '收起左右栏',
  440. indentdisabled: false
  441. }
  442. },
  443. methods: {
  444. /** ----------------------------------底部按钮公用组件开始------------------------------------- */
  445. showDialog(click) {
  446. if (click == 'eventLocation') {
  447. this.$refs.eventLocation.showEventLocation()
  448. this.$refs.supermap.isEditableLayers = false
  449. this.$refs.bottomMenu.showChild = false
  450. } else if (click == 'editableLayers') {
  451. this.$refs.bottomMenu.showChild = false
  452. if (!this.$refs.supermap.isEditableLayers) {
  453. this.$refs.supermap.isEditableLayers = true
  454. } else {
  455. this.$refs.supermap.isEditableLayers = false
  456. }
  457. } else if (click == 'layerSwitching') {
  458. this.$refs.supermap.isEditableLayers = false
  459. if (!this.$refs.bottomMenu.showChild) {
  460. this.$refs.bottomMenu.showChild = true
  461. } else {
  462. this.$refs.bottomMenu.showChild = false
  463. }
  464. }
  465. },
  466. //选择图层
  467. choseLayerSwitching(url) {
  468. this.$refs.supermap.layerSwitching(url, true);
  469. },
  470. /** ----------------------------------底部按钮公用组件结束------------------------------------- */
  471. choseFireList(id,index) {
  472. this.listCurrentIndex = index
  473. let that = this
  474. selectFireLoseByid(id).then(res => {
  475. this.graphicsList=[]
  476. //地图标记
  477. if (res.data.regionalFlagBOList != null && res.data.regionalFlagBOList.length > 0) {
  478. for (let i = 0; i < res.data.regionalFlagBOList.length; i++) {
  479. let latlng = {
  480. lat: res.data.regionalFlagBOList[i].latitude,
  481. lng: res.data.regionalFlagBOList[i].longitude
  482. }
  483. this.graphicsList.push(latlng)
  484. }
  485. setTimeout(() => {
  486. that.$refs.supermap.clearG()
  487. that.$refs.supermap.setGraphicsList(this.graphicsList, 'red')
  488. }, 1000)
  489. }else{
  490. that.$refs.supermap.clearG()
  491. }
  492. //右侧
  493. this.fireLossTotal = res.data.visuForestFireLossBO.fireLossTotal != null ? res.data.visuForestFireLossBO.fireLossTotal : 0
  494. this.forestResources[0].forestArea = res.data.visuForestFireLossBO.forestArea != null ? res.data.visuForestFireLossBO.forestArea : 0
  495. this.forestResources[0].forestPrice = res.data.visuForestFireLossBO.forestPrice != null ? res.data.visuForestFireLossBO.forestPrice : 0
  496. this.forestResources[0].treesNumber = res.data.visuForestFireLossBO.treesNumber != null ? res.data.visuForestFireLossBO.treesNumber : 0
  497. this.forestResources[0].treesPrice = res.data.visuForestFireLossBO.treesPrice != null ? res.data.visuForestFireLossBO.treesPrice : 0
  498. this.casualties[0].minorInjuriesNumber = res.data.visuForestFireLossBO.minorInjuriesNumber != null ? res.data.visuForestFireLossBO.minorInjuriesNumber : 0
  499. this.casualties[0].minorInjuriesPrice = res.data.visuForestFireLossBO.minorInjuriesPrice != null ? res.data.visuForestFireLossBO.minorInjuriesPrice : 0
  500. this.casualties[0].seriouslyInjuredNumber = res.data.visuForestFireLossBO.seriouslyInjuredNumber != null ? res.data.visuForestFireLossBO.seriouslyInjuredNumber : 0
  501. this.casualties[0].seriouslyInjuredPrice = res.data.visuForestFireLossBO.seriouslyInjuredPrice != null ? res.data.visuForestFireLossBO.seriouslyInjuredPrice : 0
  502. this.casualties[0].deathNumber = res.data.visuForestFireLossBO.deathNumber != null ? res.data.visuForestFireLossBO.deathNumber : 0
  503. this.casualties[0].deathPrice = res.data.visuForestFireLossBO.deathPrice != null ? res.data.visuForestFireLossBO.deathPrice : 0
  504. this.elseFireLossPrice[0].elseFireLossPrice = res.data.visuForestFireLossBO.elseFireLossPrice != null ? res.data.visuForestFireLossBO.elseFireLossPrice : 0
  505. this.blazesPriceTotal = res.data.visuForestFireLossBO.blazesPriceTotal != null ? res.data.visuForestFireLossBO.blazesPriceTotal : 0
  506. this.fireFightingCasualties[0].artificialDays = res.data.visuForestFireLossBO.artificialDays != null ? res.data.visuForestFireLossBO.artificialDays : 0
  507. this.fireFightingCasualties[0].artificialPrice = res.data.visuForestFireLossBO.artificialPrice != null ? res.data.visuForestFireLossBO.artificialPrice : 0
  508. this.fireFightingCasualties[0].vehicleNumber = res.data.visuForestFireLossBO.vehicleNumber != null ? res.data.visuForestFireLossBO.vehicleNumber : 0
  509. this.fireFightingCasualties[0].carNumber = res.data.visuForestFireLossBO.carNumber != null ? res.data.visuForestFireLossBO.carNumber : 0
  510. this.fireFightingCasualties[0].vehiclePrice = res.data.visuForestFireLossBO.vehiclePrice != null ? res.data.visuForestFireLossBO.vehiclePrice : 0
  511. this.fireFightingCasualties[0].planeNumber = res.data.visuForestFireLossBO.planeNumber != null ? res.data.visuForestFireLossBO.planeNumber : 0
  512. this.fireFightingCasualties[0].planePrice = res.data.visuForestFireLossBO.planePrice != null ? res.data.visuForestFireLossBO.planePrice : 0
  513. this.otherFireCosts[0].elseBlazesPrice = res.data.visuForestFireLossBO.elseBlazesPrice != null ? res.data.visuForestFireLossBO.elseBlazesPrice : 0
  514. })
  515. },
  516. getInit() {
  517. let that = this
  518. setTimeout(() => {
  519. that.graphicsList=[];
  520. that.$refs.supermap.clearG()
  521. }, 1000)
  522. //获取左侧菜单列表
  523. getInit(this.pickYear.getYear() + 1900).then(res => {
  524. this.fireList = []
  525. // //地图标记
  526. // if (res.data.regionalFlagBOList != null && res.data.regionalFlagBOList.length > 0) {
  527. // for (let i = 0; i < res.data.regionalFlagBOList.length; i++) {
  528. // let latlng = {
  529. // lat: res.data.regionalFlagBOList[i].latitude,
  530. // lng: res.data.regionalFlagBOList[i].longitude
  531. // }
  532. // this.graphicsList.push(latlng)
  533. // }
  534. // setTimeout(() => {
  535. // that.$refs.supermap.clearG()
  536. // that.$refs.supermap.setGraphicsList(this.graphicsList, 'red')
  537. // }, 1000)
  538. // }else {
  539. // that.$refs.supermap.clearG()
  540. // }
  541. //右侧列表
  542. if (res.data.visuForestFireLossTimeBOList != null && res.data.visuForestFireLossTimeBOList.length > 0) {
  543. this.numberFiresYear = res.data.visuForestFireLossTimeBOList.length
  544. this.fireList = res.data.visuForestFireLossTimeBOList
  545. }else{
  546. this.numberFiresYear = 0
  547. }
  548. //左侧
  549. if (res.data.visuForestFireLossBO != null) {
  550. this.forestFireLossTotal = res.data.visuForestFireLossBO.forestFireLossTotal != null ? res.data.visuForestFireLossBO.forestFireLossTotal : 0
  551. this.fireLossTotalYear = res.data.visuForestFireLossBO.fireLossTotal != null ? res.data.visuForestFireLossBO.fireLossTotal : 0
  552. this.forestResourcesYear[0].forestArea = res.data.visuForestFireLossBO.forestArea != null ? res.data.visuForestFireLossBO.forestArea : 0
  553. this.forestResourcesYear[0].forestPrice = res.data.visuForestFireLossBO.forestPrice != null ? res.data.visuForestFireLossBO.forestPrice : 0
  554. this.forestResourcesYear[0].treesNumber = res.data.visuForestFireLossBO.treesNumber != null ? res.data.visuForestFireLossBO.treesNumber : 0
  555. this.forestResourcesYear[0].treesPrice = res.data.visuForestFireLossBO.treesPrice != null ? res.data.visuForestFireLossBO.treesPrice : 0
  556. this.casualtiesYear[0].minorInjuriesNumber = res.data.visuForestFireLossBO.minorInjuriesNumber != null ? res.data.visuForestFireLossBO.minorInjuriesNumber : 0
  557. this.casualtiesYear[0].minorInjuriesPrice = res.data.visuForestFireLossBO.minorInjuriesPrice != null ? res.data.visuForestFireLossBO.minorInjuriesPrice : 0
  558. this.casualtiesYear[0].seriouslyInjuredNumber = res.data.visuForestFireLossBO.seriouslyInjuredNumber != null ? res.data.visuForestFireLossBO.seriouslyInjuredNumber : 0
  559. this.casualtiesYear[0].seriouslyInjuredPrice = res.data.visuForestFireLossBO.seriouslyInjuredPrice != null ? res.data.visuForestFireLossBO.seriouslyInjuredPrice : 0
  560. this.casualtiesYear[0].deathNumber = res.data.visuForestFireLossBO.deathNumber != null ? res.data.visuForestFireLossBO.deathNumber : 0
  561. this.casualtiesYear[0].deathPrice = res.data.visuForestFireLossBO.deathPrice != null ? res.data.visuForestFireLossBO.deathPrice : 0
  562. this.elseFireLossPriceYear[0].elseFireLossPrice = res.data.visuForestFireLossBO.elseFireLossPrice != null ? res.data.visuForestFireLossBO.elseFireLossPrice : 0
  563. this.blazesPriceTotalYear = res.data.visuForestFireLossBO.blazesPriceTotal != null ? res.data.visuForestFireLossBO.blazesPriceTotal : 0
  564. this.fireFightingCasualtiesYear[0].artificialDays = res.data.visuForestFireLossBO.artificialDays != null ? res.data.visuForestFireLossBO.artificialDays : 0
  565. this.fireFightingCasualtiesYear[0].artificialPrice = res.data.visuForestFireLossBO.artificialPrice != null ? res.data.visuForestFireLossBO.artificialPrice : 0
  566. this.fireFightingCasualtiesYear[0].vehicleNumber = res.data.visuForestFireLossBO.vehicleNumber != null ? res.data.visuForestFireLossBO.vehicleNumber : 0
  567. this.fireFightingCasualtiesYear[0].carNumber = res.data.visuForestFireLossBO.carNumber != null ? res.data.visuForestFireLossBO.carNumber : 0
  568. this.fireFightingCasualtiesYear[0].vehiclePrice = res.data.visuForestFireLossBO.vehiclePrice != null ? res.data.visuForestFireLossBO.vehiclePrice : 0
  569. this.fireFightingCasualtiesYear[0].planeNumber = res.data.visuForestFireLossBO.planeNumber != null ? res.data.visuForestFireLossBO.planeNumber : 0
  570. this.fireFightingCasualtiesYear[0].planePrice = res.data.visuForestFireLossBO.planePrice != null ? res.data.visuForestFireLossBO.planePrice : 0
  571. this.otherFireCostsYear[0].elseBlazesPrice = res.data.visuForestFireLossBO.elseBlazesPrice != null ? res.data.visuForestFireLossBO.elseBlazesPrice : 0
  572. } else {
  573. this.forestFireLossTotal = 0
  574. this.fireLossTotalYear = 0
  575. this.forestResourcesYear[0].forestArea = 0
  576. this.forestResourcesYear[0].forestPrice = 0
  577. this.forestResourcesYear[0].treesNumber = 0
  578. this.forestResourcesYear[0].treesPrice = 0
  579. this.casualtiesYear[0].minorInjuriesNumber = 0
  580. this.casualtiesYear[0].minorInjuriesPrice = 0
  581. this.casualtiesYear[0].seriouslyInjuredNumber = 0
  582. this.casualtiesYear[0].seriouslyInjuredPrice = 0
  583. this.casualtiesYear[0].deathNumber = 0
  584. this.casualtiesYear[0].deathPrice = 0
  585. this.elseFireLossPriceYear[0].elseFireLossPrice = 0
  586. this.blazesPriceTotalYear = 0
  587. this.fireFightingCasualtiesYear[0].artificialDays = 0
  588. this.fireFightingCasualtiesYear[0].artificialPrice = 0
  589. this.fireFightingCasualtiesYear[0].vehicleNumber = 0
  590. this.fireFightingCasualtiesYear[0].carNumber = 0
  591. this.fireFightingCasualtiesYear[0].vehiclePrice = 0
  592. this.fireFightingCasualtiesYear[0].planeNumber = 0
  593. this.fireFightingCasualtiesYear[0].planePrice = 0
  594. this.otherFireCostsYear[0].elseBlazesPrice = 0
  595. }
  596. //右侧
  597. this.fireLossTotal = res.data.visuForestFireLossBOFirst.fireLossTotal != null ? res.data.visuForestFireLossBOFirst.fireLossTotal : 0
  598. this.forestResources[0].forestArea = res.data.visuForestFireLossBOFirst.forestArea != null ? res.data.visuForestFireLossBOFirst.forestArea : 0
  599. this.forestResources[0].forestPrice = res.data.visuForestFireLossBOFirst.forestPrice != null ? res.data.visuForestFireLossBOFirst.forestPrice : 0
  600. this.forestResources[0].treesNumber = res.data.visuForestFireLossBOFirst.treesNumber != null ? res.data.visuForestFireLossBOFirst.treesNumber : 0
  601. this.forestResources[0].treesPrice = res.data.visuForestFireLossBOFirst.treesPrice != null ? res.data.visuForestFireLossBOFirst.treesPrice : 0
  602. this.casualties[0].minorInjuriesNumber = res.data.visuForestFireLossBOFirst.minorInjuriesNumber != null ? res.data.visuForestFireLossBOFirst.minorInjuriesNumber : 0
  603. this.casualties[0].minorInjuriesPrice = res.data.visuForestFireLossBOFirst.minorInjuriesPrice != null ? res.data.visuForestFireLossBOFirst.minorInjuriesPrice : 0
  604. this.casualties[0].seriouslyInjuredNumber = res.data.visuForestFireLossBOFirst.seriouslyInjuredNumber != null ? res.data.visuForestFireLossBOFirst.seriouslyInjuredNumber : 0
  605. this.casualties[0].seriouslyInjuredPrice = res.data.visuForestFireLossBOFirst.seriouslyInjuredPrice != null ? res.data.visuForestFireLossBOFirst.seriouslyInjuredPrice : 0
  606. this.casualties[0].deathNumber = res.data.visuForestFireLossBOFirst.deathNumber != null ? res.data.visuForestFireLossBOFirst.deathNumber : 0
  607. this.casualties[0].deathPrice = res.data.visuForestFireLossBOFirst.deathPrice != null ? res.data.visuForestFireLossBOFirst.deathPrice : 0
  608. this.elseFireLossPrice[0].elseFireLossPrice = res.data.visuForestFireLossBOFirst.elseFireLossPrice != null ? res.data.visuForestFireLossBOFirst.elseFireLossPrice : 0
  609. this.blazesPriceTotal = res.data.visuForestFireLossBOFirst.blazesPriceTotal != null ? res.data.visuForestFireLossBOFirst.blazesPriceTotal : 0
  610. this.fireFightingCasualties[0].artificialDays = res.data.visuForestFireLossBOFirst.artificialDays != null ? res.data.visuForestFireLossBOFirst.artificialDays : 0
  611. this.fireFightingCasualties[0].artificialPrice = res.data.visuForestFireLossBOFirst.artificialPrice != null ? res.data.visuForestFireLossBOFirst.artificialPrice : 0
  612. this.fireFightingCasualties[0].vehicleNumber = res.data.visuForestFireLossBOFirst.vehicleNumber != null ? res.data.visuForestFireLossBOFirst.vehicleNumber : 0
  613. this.fireFightingCasualties[0].carNumber = res.data.visuForestFireLossBOFirst.carNumber != null ? res.data.visuForestFireLossBOFirst.carNumber : 0
  614. this.fireFightingCasualties[0].vehiclePrice = res.data.visuForestFireLossBOFirst.vehiclePrice != null ? res.data.visuForestFireLossBOFirst.vehiclePrice : 0
  615. this.fireFightingCasualties[0].planeNumber = res.data.visuForestFireLossBOFirst.planeNumber != null ? res.data.visuForestFireLossBOFirst.planeNumber : 0
  616. this.fireFightingCasualties[0].planePrice = res.data.visuForestFireLossBOFirst.planePrice != null ? res.data.visuForestFireLossBOFirst.planePrice : 0
  617. this.otherFireCosts[0].elseBlazesPrice = res.data.visuForestFireLossBOFirst.elseBlazesPrice != null ? res.data.visuForestFireLossBOFirst.elseBlazesPrice : 0
  618. })
  619. },
  620. //事件chart
  621. eventChart() {
  622. // 基于准备好的dom,初始化echarts实例
  623. let myChart = echarts.init(document.getElementById('event-chart'))
  624. myChart.setOption({
  625. color: ['#2EACFF', '#FFA61C', '#2EC054', '#8C64D7'],
  626. tooltip: {
  627. trigger: 'item',
  628. formatter: '{a} <br/>{b} : {c} ({d}%)'
  629. },
  630. toolbox: {
  631. show: true
  632. },
  633. series: [{
  634. name: '事件分类',
  635. type: 'pie',
  636. roseType: true,
  637. radius: [30, 70],
  638. label: {
  639. show: true,
  640. formatter: '{b}\n{c} '
  641. },
  642. data: this.eventChartData
  643. }]
  644. })
  645. },
  646. //吉祥物收起左右框
  647. indent() {
  648. let list = document.getElementsByClassName('el-tooltip__popper')
  649. list[list.length - 1].style.display = 'none'
  650. if (this.indentStyle == '') {
  651. this.indentStyle = 'indent-style'
  652. this.indentleft = 'indent-left'
  653. this.indentright = 'indent-right'
  654. this.indentText = '展开左右栏'
  655. } else if (this.indentText == '展开左右栏') {
  656. this.indentStyle = ''
  657. this.indentleft = ''
  658. this.indentright = ''
  659. this.indentText = '收起左右栏'
  660. }
  661. },
  662. dropLocation(lat, lng) {
  663. this.$refs.supermap.dropLocation(lat, lng)
  664. }
  665. }
  666. }
  667. </script>
  668. <style lang="scss" scoped>
  669. @import '@/assets/styles/base.scss';
  670. .el-table__header {
  671. width: auto !important;
  672. }
  673. .d-dialog-con {
  674. position: absolute;
  675. left: -19rem;
  676. top: 0;
  677. }
  678. </style>