userList.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. <template>
  2. <view class="">
  3. <view class="search-user flex-y-center ">
  4. <view class="search-content flex-y-center">
  5. <icon type="search" size="18" />
  6. <input confirm-type="search" v-model="seTval" @confirm="confirm" @input="getSearch" class="flex-grow-1"
  7. type="text" placeholder-style="font-size:26rpx" placeholder="请输入昵称或手机号" />
  8. <view class="flex-center" style="margin-left: 10rpx;" @click.stop="onDel" v-if="seTval">
  9. <icon type="clear" size="18" />
  10. </view>
  11. </view>
  12. <view class="search-btn" @click="search">
  13. 搜索
  14. </view>
  15. </view>
  16. <view style="height: 100rpx;"></view>
  17. <view class="list">
  18. <view class="item" style="border: none;" @click="back(item)" v-for="(item,index) in list" :key="index">
  19. <view class="box-pack-between">
  20. <view class="name box-pack-between flex-grow-1">
  21. <text>id:{{item.id}}</text>
  22. <text><block v-if="item.mobile">({{item.type==1?'微信':'支付宝'}}{{item.mobile}})</block> {{item.level_name||'未知'}} </text>
  23. </view>
  24. </view>
  25. </view>
  26. </view>
  27. </view>
  28. </template>
  29. <script>
  30. export default {
  31. data() {
  32. return {
  33. list: [],
  34. is_bottom: false,
  35. keywords: '',
  36. admin_id: '',
  37. }
  38. },
  39. onLoad() {
  40. this.admin_id = uni.getStorageSync("admin_id");
  41. this.getData(1)
  42. },
  43. onReachBottom() {
  44. if (!this.is_bottom) {
  45. this.getData(this.page + 1)
  46. }
  47. },
  48. methods: {
  49. getSearch(e) {
  50. if (!e.detail.value) {
  51. this.page = 1;
  52. this.list = [];
  53. this.keywords = "";
  54. this.getData(1);
  55. }
  56. this.keywords = e.detail.value;
  57. },
  58. back(item) {
  59. let pages = getCurrentPages(); //获取所有页面栈实例列表
  60. let nowPage = pages[pages.length - 1]; //当前页页面实例
  61. let prevPage = pages[pages.length - 2]; //上一页页面实例
  62. prevPage.$vm.user_id = item.id; //修改上一页data里面的sh参数值为100
  63. prevPage.$vm.user_name = item.level_name;
  64. uni.navigateBack({
  65. delta: 1
  66. })
  67. },
  68. onDel() {
  69. this.seTval = '';
  70. this.page = 1;
  71. this.list = [];
  72. this.keywords = "";
  73. this.getData(1);
  74. },
  75. confirm(e) {
  76. this.page = 1;
  77. this.list = [];
  78. this.keywords = e.detail.value;
  79. this.getData(1);
  80. },
  81. search(e) {
  82. this.page = 1;
  83. this.list = [];
  84. this.getData(1);
  85. },
  86. getData(page) {
  87. if (page == 1) {
  88. this.list = []
  89. this.page = 1
  90. this.is_bottom = false
  91. }
  92. this.request({
  93. url: 'smdcshop/user_list',
  94. data: {
  95. level_name: "",
  96. limit: 40,
  97. page,
  98. type: 0,
  99. serch: this.keywords,
  100. admin_id: this.admin_id,
  101. }
  102. }).then(res => {
  103. if (res.code == 200 && res.data.length) {
  104. this.list = this.list.concat(res.data)
  105. this.page = page
  106. } else {
  107. this.is_bottom = true
  108. }
  109. })
  110. }
  111. }
  112. }
  113. </script>
  114. <style>
  115. .item {
  116. padding: 20rpx;
  117. border-bottom: 1rpx solid #1f1f1f;
  118. }
  119. .search-user {
  120. z-index: 999;
  121. position: fixed;
  122. left: 0;
  123. width: 100%;
  124. height: 100rpx;
  125. background: #FFFFFF;
  126. margin-left: 15rpx;
  127. }
  128. .search-user .search-content {
  129. width: 83%;
  130. height: 70rpx;
  131. background: #F1F1F1;
  132. border-radius: 100rpx;
  133. padding: 0 20rpx;
  134. }
  135. .search-user .search-content icon {
  136. margin-right: 10rpx;
  137. }
  138. .search-user .search-btn {
  139. margin-left: 20rpx;
  140. font-size: 28rpx;
  141. }
  142. </style>