chooseBuilding.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. <template>
  2. <view :class="$isEmpty(buiding_list)?'empty-wrap':''">
  3. <view class="bg-gray" style="padding: 16rpx 30rpx;">
  4. <text >当前选择小区:</text>
  5. </view>
  6. <view class="bg-white" style="padding:30rpx 30rpx 20rpx 30rpx;border-bottom: 1rpx solid #efefef;display: flex;justify-content: space-between;">
  7. <view class="text-blue">
  8. <text class="">{{residential_name}}</text>
  9. </view>
  10. <view class="cu-btn line-blue sm round" @tap="change">
  11. <text class="cuIcon-refresh padding-right-10"></text>
  12. <text>切换小区</text>
  13. </view>
  14. </view>
  15. <view class="bg-gray" style="padding: 12rpx 30rpx;">
  16. <text >选择楼栋:</text>
  17. </view>
  18. <u-cell-group v-if="!$isEmpty(buiding_list)">
  19. <u-cell-item @click="jump(item)" v-for="(item, index) in buiding_list" :key="index" :title="item.name" :arrow="false"></u-cell-item>
  20. </u-cell-group>
  21. <u-empty marginTop="200" icon-size="160" v-if="$isEmpty(buiding_list)&&!loading" text="暂无楼栋信息" src="/static/common/empty.png"></u-empty>
  22. <u-back-top :scroll-top="scrollTop"></u-back-top>
  23. </view>
  24. </template>
  25. <script>
  26. var app = getApp();
  27. export default {
  28. data() {
  29. return {
  30. loading:true,
  31. scrollTop:0,
  32. buiding_list: null,
  33. //小区集合
  34. residential_name: null //小区名字
  35. };
  36. },
  37. onPageScroll(e) {
  38. this.scrollTop = e.scrollTop;
  39. },
  40. /**
  41. * 生命周期函数--监听页面加载
  42. */
  43. onLoad: function (options) {
  44. //小区名字
  45. this.residential_name = options.residential_name
  46. var residential_id = options.residential_id
  47. this.getBuilding(residential_id)
  48. },
  49. methods: {
  50. change(){
  51. uni.navigateBack({
  52. delta:1
  53. })
  54. },
  55. jump(item){
  56. app.globalData.building_id=item.id
  57. let params={
  58. building_name:item.name,
  59. building_id:item.id,
  60. residential_name:this.residential_name
  61. }
  62. uni.navigateTo({
  63. url:"../chooseUnit/chooseUnit"+this.$u.queryParams(params)
  64. })
  65. },
  66. //根据小区id获取楼栋信息
  67. getBuilding: function (residential_id) {
  68. uni.showLoading({
  69. title:"数据加载中.."
  70. })
  71. let that = this;
  72. let params = {
  73. residential_id:residential_id
  74. };
  75. // let operation = 'estate/getBuildingsByResidentialId';
  76. this.$http.getBuildingsByResidentialId(params).then(res=>{
  77. //获取成功
  78. if (res.data.result_code == 1) {
  79. that.setData({
  80. buiding_list: res.data.list
  81. });
  82. } else {
  83. app.globalData.oneFailHint(res.data.result_msg);
  84. }
  85. uni.hideLoading()
  86. that.loading=false
  87. });
  88. }
  89. }
  90. };
  91. </script>
  92. <style>
  93. page{
  94. overflow-y: scroll
  95. }
  96. .isOver {
  97. width: 100%;
  98. height: 50px;
  99. line-height: 50px;
  100. text-align: center;
  101. // background: #fff;
  102. font-size: 28rpx;
  103. }
  104. .nav_section {
  105. width: 100%;
  106. background:#fff;
  107. }
  108. .nav_section_items {
  109. display: flex;
  110. flex-direction: row;
  111. justify-content: space-between;
  112. padding: 30rpx;
  113. border-bottom: 2rpx solid #ddd;
  114. position: relative;
  115. }
  116. .nav_section_items:active {
  117. background: #ddd;
  118. }
  119. .nav_section_items .section_cont view {
  120. overflow: hidden;
  121. text-overflow: ellipsis;
  122. white-space: nowrap;
  123. display: block;
  124. }
  125. .nav_section_items .section_cont .section_cont_sub {
  126. font-size: 30rpx;
  127. line-height: 50rpx;
  128. color: #000;
  129. margin-bottom: 10rpx;
  130. }
  131. .section_cont_tel .info{
  132. width: 500rpx;
  133. overflow: hidden;
  134. white-space: nowrap;
  135. text-overflow: ellipsis;
  136. display: inline-block;
  137. }
  138. .empty-wrap{ background-color: #FFFFFF; min-height: 100vh;}
  139. </style>