indexcf.vue 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. <template name="apps">
  2. <view>
  3. <cu-custom bgColor="bg-blue">
  4. <block slot="content">首页</block>
  5. </cu-custom>
  6. <swiper class="swiper" circular :indicator-dots="true" :autoplay="true" :interval="3000" :duration="800">
  7. <swiper-item>
  8. <image src="../../static/img/banner.png" class="swiper-item"></image>
  9. </swiper-item>
  10. </swiper>
  11. <view class="line-box">
  12. <view class="btn-box-3 mart-t">
  13. <navigator class="h-200" hover-class="none" url="/pages/yqList/yqList">
  14. </navigator>
  15. </view>
  16. <view class="btn-box-6 mart-t">
  17. <navigator class="h-200" hover-class="none" url="/pages/tdList/tdList">
  18. </navigator>
  19. </view>
  20. <view class="btn-box-1 mart-t">
  21. <navigator class="h-200" hover-class="none" url="/pages/buildListcf/buildListcf">
  22. </navigator>
  23. </view>
  24. <view class="btn-box-2 mart-t">
  25. <navigator class="h-200" hover-class="none" url="/pages/comListcf/comListcf">
  26. </navigator>
  27. </view>
  28. <view class="btn-box-4 mart-t">
  29. <navigator class="h-200" hover-class="none" url="/pages/map/mapVisualization-th">
  30. </navigator>
  31. </view>
  32. <view class="btn-box-5 mart-t">
  33. <navigator class="h-200" hover-class="none" url="/pages/analysiscf/analysiscf">
  34. </navigator>
  35. </view>
  36. </view>
  37. </view>
  38. </template>
  39. <script>
  40. import loginService from "@/api/auth/loginService"
  41. export default {
  42. name: "apps",
  43. data() {
  44. return {
  45. stype: "", // 企业 => 3 楼宇 => 2 园区 => 1 zfadmin => 4 admin=> 5
  46. };
  47. },
  48. onShow() {
  49. },
  50. created() {
  51. },
  52. methods: {
  53. }
  54. }
  55. </script>
  56. <style>
  57. .page {
  58. height: 100vh;
  59. }
  60. .line-box {
  61. display: flex;
  62. padding-left: 20rpx;
  63. padding-right: 20rpx;
  64. justify-content: space-between;
  65. margin-top: 20rpx;
  66. flex-wrap: wrap;
  67. }
  68. .mart-t {
  69. margin-top: 30rpx;
  70. }
  71. .btn-box-1 {
  72. width: 337rpx;
  73. height: 200rpx;
  74. background-image: url('../../static/img/btn1.png');
  75. background-size: 100% 100%;
  76. }
  77. .btn-box-2 {
  78. width: 337rpx;
  79. height: 200rpx;
  80. background-image: url('../../static/img/btn4.png');
  81. background-size: 100% 100%;
  82. }
  83. .btn-box-3 {
  84. width: 337rpx;
  85. height: 200rpx;
  86. background-image: url('../../static/img/btnyq.png');
  87. background-size: 100% 100%;
  88. }
  89. .btn-box-4 {
  90. width: 337rpx;
  91. height: 200rpx;
  92. background-image: url('../../static/img/btn5.png');
  93. background-size: 100% 100%;
  94. }
  95. .btn-box-5 {
  96. width: 337rpx;
  97. height: 200rpx;
  98. background-image: url('../../static/img/btn3.png');
  99. background-size: 100% 100%;
  100. }
  101. .btn-box-6 {
  102. width: 337rpx;
  103. height: 200rpx;
  104. background-image: url('../../static/img/btntd.png');
  105. background-size: 100% 100%;
  106. }
  107. .h-200 {
  108. height: 200rpx;
  109. }
  110. .swiper {
  111. width: 750rpx;
  112. height: 360rpx;
  113. }
  114. .swiper-item {
  115. width: 750rpx;
  116. height: 360rpx;
  117. background-color: aliceblue;
  118. }
  119. .font-size-35 {
  120. font-size: 35px !important;
  121. }
  122. .img-size {
  123. width: 80rpx;
  124. height: 80rpx;
  125. }
  126. .content-box {
  127. width: 337rpx;
  128. height: 200rpx;
  129. }
  130. .my-app .padding-sm {
  131. padding: 6px;
  132. }
  133. .grid .padding-sm .bg-white {
  134. box-shadow: 0 1px 4px #f9f9f9, 1px 1px 40px rgba(0, 0, 0, .06);
  135. }
  136. .bg-blue {
  137. background: #fff;
  138. color: #0081ff !important;
  139. }
  140. .text-white,
  141. .line-white,
  142. .lines-white {
  143. color: #0081ff !important;
  144. }
  145. </style>