list.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. <template>
  2. <view>
  3. <view class="list">
  4. <view class="item" v-for="(item, index) in list" :key="index" @click="detail(item)">
  5. <view class="lef">
  6. <image :src="ip + item.showPictures[0]" mode="aspectFill" class="pic"></image>
  7. <view class="tag">{{ item.shopType == 1 ? '门店' : '酒店' }}</view>
  8. </view>
  9. <view class="con">
  10. <view class="title omit">{{ item.name }}</view>
  11. <view class="ms">
  12. <view class="wz">{{ item.addres }}</view>
  13. <view class="audit" v-if="item.auditFlag == 0">
  14. <text class="icon">&#xe82e;</text>
  15. <text>待审核</text>
  16. </view>
  17. <view class="audit" v-if="item.auditFlag == 1" style="color: #18B566;">
  18. <text class="icon">&#xe82e;</text>
  19. <text>审核通过</text>
  20. </view>
  21. <view class="audit" v-if="item.auditFlag == 2" style="color: #F44336;">
  22. <text class="icon">&#xe82e;</text>
  23. <text>审核不通过</text>
  24. </view>
  25. </view>
  26. </view>
  27. <view class="clear"></view>
  28. </view>
  29. </view>
  30. <view class="noLogin">
  31. <image class="u-error-icon" src="../../static/sj.png" mode="widthFix" v-if="list.length == 0"></image>
  32. <view class="dll" @click="go()">申请店铺</view>
  33. </view>
  34. </view>
  35. </template>
  36. <script>
  37. export default {
  38. data() {
  39. return {
  40. ip: this.$http.urls.ip,
  41. list: [],
  42. param: { pageNum: 1, pageSize: 10, memberId: this.$getUser().memberId}
  43. };
  44. },
  45. onLoad() {
  46. uni.$on('shop', res => {
  47. this.getData();
  48. });
  49. this.getData();
  50. },
  51. methods: {
  52. //获取数据
  53. getData() {
  54. this.$http.request({
  55. url: this.$http.urls.getShopList,
  56. data: this.param,
  57. success: res => {
  58. this.list = res.data.data.list;
  59. this.list.forEach(item => {
  60. item.showPictures =item.showPictures.split(",");
  61. item.pic=item.pic.split(",");
  62. });
  63. }
  64. });
  65. },
  66. //上报数据
  67. up(item) {
  68. uni.navigateTo({ url: '/pages/shop/up?item=' + JSON.stringify(item) });
  69. },
  70. //开通店铺
  71. go() {
  72. uni.navigateTo({ url: '/pages/shop/apply' });
  73. },
  74. //详情
  75. detail(item) {
  76. uni.navigateTo({ url: '/pages/shop/detail'});
  77. }
  78. },
  79. //下拉刷新
  80. onPullDownRefresh() {
  81. setTimeout(() => {
  82. uni.stopPullDownRefresh();
  83. this.getData();
  84. }, 1000);
  85. }
  86. };
  87. </script>
  88. <style lang="scss">
  89. .list {
  90. padding: 0px 10px 70px 10px;
  91. .item {
  92. background-color: white;
  93. padding: 15px 8px 15px 8px;
  94. border-bottom: 1px solid #e5e5e5;
  95. border-radius: 5px;
  96. margin-top: 10px;
  97. box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.2);
  98. .lef {
  99. float: left;
  100. width: 30%;
  101. position: relative;
  102. overflow: hidden;
  103. height: 85px;
  104. border-radius: 4px;
  105. .pic {
  106. width: 100%;
  107. height: 85px;
  108. background-color: #dcdcdc;
  109. }
  110. .tag {
  111. position: absolute;
  112. bottom: 0;
  113. width: 100%;
  114. text-align: center;
  115. background-color: $theme-color;
  116. height: 20px;
  117. opacity: 0.7;
  118. color: white;
  119. }
  120. }
  121. .con {
  122. padding-left: 30px;
  123. width: 60%;
  124. float: left;
  125. .title {
  126. font-size: 15px;
  127. text-align: left;
  128. color: #252525;
  129. font-weight: bold;
  130. }
  131. .ms {
  132. margin-top: 5px;
  133. .ll {
  134. color: #d72424;
  135. font-size: 16px;
  136. padding-right: 5px;
  137. }
  138. .wz {
  139. font-size: 12px;
  140. }
  141. .audit {
  142. font-size: 12px;
  143. margin-top: 5px;
  144. color: $dar;
  145. .icon {
  146. padding-right: 3px;
  147. }
  148. }
  149. }
  150. }
  151. }
  152. }
  153. .noLogin {
  154. margin-top: -40px;
  155. }
  156. </style>