myUser.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. <template>
  2. <view style="padding-bottom: 30rpx;">
  3. <view class="search-box ddflex">
  4. <view class="search-input ddflex fflex">
  5. <image class="search-input-icon" src="../../static/pages/images/search.png"></image>
  6. <input class="fflex" v-model="searchValue" confirm-type="search" @confirm="searchFn" placeholder="请输入用户昵称或电话"/>
  7. <view class="search-btn" @click="searchFn">搜索</view>
  8. </view>
  9. </view>
  10. <view style="height: 135rpx;"></view>
  11. <view>
  12. <view class="user-item ddflex" v-for="item,index in groupList">
  13. <view class="ddflex">
  14. <image class="user-header" src="../../static/images/userimg.png"></image>
  15. <view class="fflex">
  16. <view class="user-nickName">{{item.nickName}}</view>
  17. <view class="user-phone">{{item.realName?item.realName:''}}<text v-if="item.mobile">({{item.mobile}})</text></view>
  18. </view>
  19. </view>
  20. <view class="option-btn" v-if="item.status==1" @click="jinyong(2,item,index)">禁用</view>
  21. <view class="option-btn" v-else-if="item.status==2" @click="jinyong(1,item,index)">已禁用</view>
  22. <view class="option-btn" v-else-if="item.status==3">黑名单</view>
  23. </view>
  24. </view>
  25. </view>
  26. </template>
  27. <script>
  28. const app = getApp();
  29. const req = require("../../utils/request.js");
  30. export default {
  31. components: {},
  32. props: {},
  33. data() {
  34. return {
  35. systems: {},
  36. isTop:0,
  37. groupList: [],
  38. page: 1,
  39. limit: 10,
  40. searchValue:'',
  41. isQuerying:false,//正在查询数据
  42. }
  43. },
  44. onLoad(options) {
  45. this.getDataList()
  46. },
  47. onShow() {
  48. },
  49. onReachBottom() {
  50. this.getDataList(true)
  51. },
  52. methods: {
  53. getDataList(isPage) {
  54. if(this.isQuerying) return
  55. else this.isQuerying = true
  56. if (!isPage) {
  57. this.page = 1
  58. }
  59. let queryParams = {
  60. page: this.page,
  61. limit: this.limit,
  62. }
  63. if(this.searchValue){
  64. queryParams.name=this.searchValue
  65. }
  66. req.getRequest(
  67. '/admin/v2/user/page',
  68. queryParams,
  69. data => {
  70. if (data != null && data.list.length > 0) {
  71. if (!isPage) {
  72. this.groupList = data.list
  73. } else {
  74. this.groupList = this.groupList.concat(data.list)
  75. }
  76. this.page++
  77. } else {
  78. if (!isPage)
  79. this.groupList = data.list
  80. else {}
  81. }
  82. uni.hideLoading()
  83. this.isQuerying = false
  84. }
  85. )
  86. },
  87. jinyong(type,item,index){
  88. uni.showModal({
  89. title:'提示',
  90. content:type==1?'确定解除该用户禁用?':'确定禁用该用户?',
  91. success: (res) => {
  92. if(res.confirm){
  93. let dataP = {
  94. id:item.id,
  95. type:type
  96. }
  97. req.getRequest('/admin/v2/user/disable',dataP,res=>{
  98. if(type==1){
  99. this.groupList[index].status=1
  100. req.msg('已解除禁用')
  101. }else{
  102. this.groupList[index].status=2
  103. req.msg('已禁用')
  104. }
  105. })
  106. }
  107. }
  108. })
  109. },
  110. searchFn(){
  111. this.getDataList()
  112. },
  113. },
  114. mounted() {
  115. },
  116. onPageScroll: function(e) {
  117. }
  118. }
  119. </script>
  120. <style>
  121. @import "./myUser.css";
  122. </style>