FloorFunc.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <template>
  2. <div class='floor-function'>
  3. <div class="floor-item">
  4. <div class="floor-item-title">
  5. <span class="floor-item-text">F3</span>
  6. <p class="floor-item-goMap" @click='goToMapView'>
  7. <span>查看平面图 </span>
  8. <van-icon class='floor-item-arrow' name='arrow' />
  9. </p>
  10. </div>
  11. </div>
  12. </div>
  13. </template>
  14. <script>
  15. export default {
  16. name: 'FloorFunc',
  17. props: {},
  18. data() {
  19. return {}
  20. },
  21. components: {},
  22. beforeMount() {},
  23. mounted() {},
  24. methods: {
  25. goToMapView() {
  26. this.$router.push({ name: 'MapView' })
  27. },
  28. },
  29. }
  30. </script>
  31. <style lang='less' scoped>
  32. .floor-function {
  33. width: 100%;
  34. height: calc(100% - 50px);
  35. background-color: #FFFFFF;
  36. box-sizing: border-box;
  37. .floor-item-title {
  38. padding: 0 10px;
  39. height: 44px;
  40. line-height: 44px;
  41. background: rgba(2, 91, 170, 0.1);
  42. color: #025BAA;
  43. .floor-item-text {
  44. font-size: 16px;
  45. font-weight: 600;
  46. display: inline-block;
  47. }
  48. .floor-item-goMap {
  49. font-size: 14px;
  50. float: right;
  51. .floor-item-arrow {
  52. position: relative;
  53. top: 2px;
  54. }
  55. }
  56. }
  57. }
  58. </style>