my_promoter.html 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. <!-- +---------------------------------------------------------------------- -->
  2. <!-- | CRMEB [ CRMEB赋能开发者,助力企业发展 ] -->
  3. <!-- +---------------------------------------------------------------------- -->
  4. <!-- | Copyright (c) 2016~2022 https://www.crmeb.com All rights reserved. -->
  5. <!-- +---------------------------------------------------------------------- -->
  6. <!-- | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权 -->
  7. <!-- +---------------------------------------------------------------------- -->
  8. <!-- | Author: CRMEB Team <admin@crmeb.com> -->
  9. <!-- +---------------------------------------------------------------------- -->
  10. {extend name="public/container"}
  11. {block name='head_top'}
  12. <style>
  13. body {
  14. background: #F5F5F5;
  15. }
  16. </style>
  17. {/block}
  18. {block name="title"}我的推广人{/block}
  19. {block name="content"}
  20. <div v-cloak id="app" class="my-promoter">
  21. <div class="header">
  22. <div class="search-info">
  23. <div class="search">
  24. <form @submit.prevent>
  25. <div :class="{ zIndex: zIndex }">
  26. <i class="iconfont iconsousuo"></i>
  27. <input v-model.trim="search" placeholder="输入昵称或手机号搜索" id="search" @focus="zIndex = true" @keyup.enter="keyupEnter">
  28. </div>
  29. <label :class="{ zIndex: zIndex }" for="search">
  30. <i class="iconfont iconsousuo"></i>
  31. <span>输入昵称或手机号搜索</span>
  32. </label>
  33. </form>
  34. </div>
  35. <div class="info">
  36. <ul>
  37. <li>
  38. <div>推广人数</div>
  39. <div>{$data.one_spread_count}</div>
  40. </li>
  41. <li>
  42. <div>直推订单</div>
  43. <div>{$data.order_count}</div>
  44. </li>
  45. </ul>
  46. </div>
  47. </div>
  48. <div class="caption">
  49. <div>推广人信息</div>
  50. <div v-show="!action">订单数/金额</div>
  51. <div v-show="action">操作管理</div>
  52. </div>
  53. </div>
  54. <div class="main">
  55. <ul>
  56. <li v-for="(item, index) in spreadList">
  57. <div>
  58. <img :src="item.avatar" alt="">
  59. </div>
  60. <div>
  61. <div>{{ item.nickname }}</div>
  62. <div>{{ item.phone }}</div>
  63. </div>
  64. <div v-show="!action">
  65. <div>直推<span>{{ item.sellout_count }}</span>单</div>
  66. <div>共{{ item.sellout_money }}元</div>
  67. </div>
  68. <div v-show="action" @click="removeSpread(item, index)">移除</div>
  69. </li>
  70. </ul>
  71. <div v-if="!spreadList.length && finished" class="empty">
  72. <img src="{__WAP_PATH}zsff/images/empty.png" alt="暂无数据">
  73. <div>暂无数据</div>
  74. </div>
  75. </div>
  76. <div class="footer">
  77. <button type="button" @click="action = !action">{{ action ? '取消学员管理' : '学员管理' }}</button>
  78. <button type="button" @click="goPosterSpread">推广学员</button>
  79. </div>
  80. <quick-menu></quick-menu>
  81. </div>
  82. {/block}
  83. {block name="foot"}
  84. <script>
  85. require(['vue', 'helper', 'store', 'quick'], function (Vue, helper, store) {
  86. var is_promoter = {$userInfo.is_promoter ? : 0};
  87. var isPromoter = {$isPromoter};
  88. new Vue({
  89. el: '#app',
  90. data: {
  91. now_money_order: 'desc',
  92. page: 1,
  93. limit: 16,
  94. search: '',
  95. spreadList: [],
  96. finished: false,
  97. action: false,
  98. zIndex: false
  99. },
  100. created: function () {
  101. var vm = this;
  102. vm.getSpreadList();
  103. helper.EventUtil.listenTouchDirection(document, function () {
  104. vm.getSpreadList();
  105. });
  106. },
  107. methods: {
  108. // 推广信息
  109. getSpreadList: function () {
  110. var vm = this;
  111. if (vm.finished) {
  112. return;
  113. }
  114. helper.loadFFF();
  115. store.baseGet(helper.U({
  116. c: 'spread',
  117. a: 'spread_list',
  118. q: {
  119. special_order: '',
  120. now_money_order: 'desc',
  121. page: vm.page++,
  122. limit: vm.limit,
  123. search: vm.search
  124. }
  125. }), function (res) {
  126. var list = res.data.data.list;
  127. helper.loadClear();
  128. vm.spreadList = vm.spreadList.concat(list);
  129. vm.finished = vm.limit > list.length;
  130. }, function () {
  131. helper.loadClear();
  132. });
  133. },
  134. // 点击移除
  135. removeSpread: function (spread, index) {
  136. var vm = this;
  137. layer.open({
  138. content: '确认移除吗,确认后不可恢复哦~',
  139. btn: ['确定', '取消'],
  140. yes: function(i){
  141. layer.close(i);
  142. helper.loadFFF();
  143. store.baseGet(helper.U({
  144. c: 'spread',
  145. a: 'remove_spread',
  146. q: {
  147. uid: spread.uid
  148. }
  149. }), function (res) {
  150. helper.loadClear();
  151. vm.spreadList.splice(index, 1);
  152. helper.pushMsg(res.data.msg);
  153. }, function () {
  154. helper.loadClear();
  155. });
  156. }
  157. });
  158. },
  159. // 点击推广学员
  160. goPosterSpread: function () {
  161. window.location.href = "{:url('poster_spread')}";
  162. },
  163. keyupEnter: function () {
  164. if (!this.search) {
  165. return;
  166. }
  167. this.finished = false;
  168. this.page = 1;
  169. this.spreadList = [];
  170. this.getSpreadList();
  171. }
  172. }
  173. });
  174. });
  175. </script>
  176. {/block}