SystemFloor.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <template>
  2. <div class='system-floor'>
  3. <van-nav-bar :title='title' left-arrow @click-left='backPage' />
  4. <!-- 楼层平面图列表 页面组件 -->
  5. <FloorFunc v-if='!fbt' class='system-floor-func' />
  6. <!-- 分支图 -->
  7. <LegendList v-else :floorsArr='fbtArr' class='system-floor-func' />
  8. </div>
  9. </template>
  10. <script>
  11. /**
  12. * 设备设施中的平面图, xx系统-楼层分布
  13. */
  14. import Vue from 'vue'
  15. import { NavBar, List } from 'vant'
  16. Vue.use(NavBar).use(List)
  17. import FloorFunc from '@/views/FloorFunc'
  18. import LegendList from '@/views/legendList'
  19. export default {
  20. name: 'SyetemFloor',
  21. props: {},
  22. components: { FloorFunc, LegendList },
  23. data() {
  24. return {
  25. title: '供电系统-楼层分布',
  26. fbt: false,
  27. fbtArr: [],
  28. }
  29. },
  30. created() {
  31. const { title, fbt, fbtArr } = this.$route.query
  32. // 分布图使用
  33. this.fbt = fbt || false
  34. this.fbtArr = fbtArr ? JSON.parse(fbtArr) : []
  35. this.title = title
  36. },
  37. beforeMount() {},
  38. mounted() {},
  39. methods: {
  40. backPage() {
  41. this.$router.go(-1)
  42. },
  43. },
  44. }
  45. </script>
  46. <style lang='less' scoped>
  47. .system-floor {
  48. width: 100%;
  49. height: calc(100% - 45px);
  50. background-color: #aaa;
  51. .system-floor-func {
  52. width: 100%;
  53. height: calc(100% - 45px);
  54. }
  55. // 返回箭头修改
  56. /deep/ .van-nav-bar .van-icon {
  57. color: #000;
  58. }
  59. }
  60. </style>