index.vue 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. <template>
  2. <div class='other-matter'>
  3. <van-tabs v-model='active' class='other-tabs' color='#025BAA' title-active-color='#025BAA' :line-width='60'>
  4. <van-tab title='综合事项'>
  5. <ComprehensiveMatter />
  6. </van-tab>
  7. <van-tab title='辅助用房'>
  8. <AuxiliaryRoom />
  9. </van-tab>
  10. </van-tabs>
  11. </div>
  12. </template>
  13. <script>
  14. import Vue from 'vue'
  15. import { Tab, Tabs } from 'vant'
  16. Vue.use(Tab).use(Tabs)
  17. import ComprehensiveMatter from './ComprehensiveMatter'
  18. import AuxiliaryRoom from './AuxiliaryRoom'
  19. export default {
  20. name: 'OtherMatter',
  21. props: {},
  22. components: { ComprehensiveMatter, AuxiliaryRoom },
  23. data() {
  24. return {
  25. active: 1,
  26. }
  27. },
  28. beforeMount() {},
  29. mounted() {},
  30. methods: {},
  31. }
  32. </script>
  33. <style lang='less' scoped>
  34. .other-matter {
  35. width: 100%;
  36. height: calc(100% - 100px);
  37. // background-color: #d3d3d3;
  38. .other-tabs {
  39. height: 100%;
  40. /deep/ .van-tab__text {
  41. font-size: 16px;
  42. }
  43. /deep/ .van-tabs__wrap {
  44. height: 45px;
  45. }
  46. /deep/ .van-tabs__content {
  47. height: calc(100% - 45px);
  48. .van-tab__pane {
  49. height: 100%;
  50. }
  51. }
  52. }
  53. }
  54. </style>