chooseCustomer.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. <template>
  2. <view class="chooseCustomer-content">
  3. <view class="search">
  4. <view class="flex justify_between align_center search-title" v-if="backPage!='shelfSeting'">
  5. <text class="search-label">客户名称</text>
  6. <view class="search-btn" v-if="backPage != 'salesRecord'">
  7. <text>没有搜索到?</text>
  8. <text>点击</text>
  9. <text @click="addCustomer">新增客户</text>
  10. </view>
  11. </view>
  12. <view v-else>
  13. <view class="shelfName">{{shelfName}}</view>
  14. <view class="flex justify_between align_center search-title">
  15. <view class="search-btn">
  16. <text>请先设置此货架的关联客户。没有搜索到?</text>
  17. <text>点击</text>
  18. <text @click="addCustomer">新增客户</text>
  19. </view>
  20. </view>
  21. </view>
  22. <u-search
  23. placeholder="请输入客户名称搜索"
  24. v-model="queryWord"
  25. height="90"
  26. @input="$u.debounce(searchBrand, 500)"
  27. @blur="$u.debounce(searchBrand, 500)"
  28. @search="$u.debounce(searchBrand, 500)"
  29. @clear="clearSearch"
  30. :showAction="false">
  31. </u-search>
  32. </view>
  33. <scroll-view class="picker-content flex_1" scroll-y >
  34. <view class="picker-main">
  35. <view class="picker-main-item" v-for="(item, index) in listData" :key="item.id" @click="chooseItem(item)">
  36. <view class="item-name">{{item.customerName}}</view>
  37. </view>
  38. <view v-if="listData&&listData.length>=20 && !loading" style="color:#999;font-size: 26upx;text-align: center;padding: 10upx;">最多显示前20条匹配客户,请尝试输入更多内容</view>
  39. <view v-if="listData && listData.length == 0 && !loading">
  40. <u-empty text="暂无匹配客户" mode="list" :img-width="200" :margin-top="60"></u-empty>
  41. </view>
  42. <view v-if="loading">
  43. <u-loadmore :load-text="$config('loadText')" status="loading" />
  44. </view>
  45. </view>
  46. </scroll-view>
  47. </view>
  48. </template>
  49. <script>
  50. import {customerList} from '@/api/customer.js'
  51. export default{
  52. data(){
  53. return{
  54. loading: false,
  55. listData:[],
  56. queryWord:'',
  57. pageSize:20,
  58. pageNo:1,
  59. scrollH:300,
  60. backPage:'',
  61. shelfName: ''
  62. }
  63. },
  64. onLoad(opts) {
  65. uni.$on('clear',this.clearSearch)
  66. this.backPage = opts.backPage
  67. let title = '选择客户'
  68. if(opts.backPage == 'shelfSeting'){
  69. title = '关联客户'
  70. }
  71. if(opts.backPage == 'shelfEdit'){
  72. title = '修改关联客户'
  73. }
  74. uni.setNavigationBarTitle({
  75. title: title
  76. })
  77. this.shelfName = opts.shelfName
  78. },
  79. onShow() {
  80. this.init()
  81. },
  82. onUnload() {
  83. uni.$off('clear',this.clearSearch)
  84. },
  85. methods:{
  86. // 初始数据
  87. init(){
  88. this.listData=[]
  89. this.queryWord=''
  90. this.pageSize=20
  91. this.pageNo=1
  92. },
  93. // 新增客户
  94. addCustomer(){
  95. uni.navigateTo({
  96. url:'/pages/sales/addCustomer?backPage='+this.backPage
  97. })
  98. },
  99. getData(){
  100. console.log('调用')
  101. // uni.showLoading({title:'加载中...',mask:true})
  102. this.loading = true
  103. customerList({queryWord:this.queryWord,pageNo:this.pageNo,pageSize:this.pageSize}).then(res => {
  104. if(res.status == 200 && res.data){
  105. this.listData = res.data.list
  106. }else{
  107. this.listData = []
  108. }
  109. // uni.hideLoading()
  110. this.loading = false
  111. })
  112. },
  113. // 搜索品牌
  114. searchBrand(){
  115. if(this.queryWord != ''){
  116. this.getData()
  117. }
  118. },
  119. clearSearch(){
  120. this.queryWord = ''
  121. this.listData = []
  122. },
  123. chooseItem(item){
  124. console.log(item,this.backPage)
  125. this.queryWord=item.customerName
  126. // 新增销售单
  127. if(this.backPage == 'addSales'){
  128. uni.redirectTo({
  129. url:'/pages/sales/addSales?pageType=edit&nowId='+item.id
  130. })
  131. }
  132. // 销售记录
  133. if(this.backPage == 'salesRecord'){
  134. uni.$emit("searchSalesRecord",item)
  135. uni.navigateBack()
  136. }
  137. // 门店审核通过
  138. if(this.backPage == 'authPass'){
  139. uni.$emit("addCustome",item)
  140. uni.navigateBack()
  141. }
  142. // 货架设置关联客户
  143. if(this.backPage == 'shelfSeting'){
  144. uni.$emit("setCustome",item)
  145. uni.navigateBack()
  146. }
  147. if(this.backPage == 'shelfEdit'){
  148. uni.$emit("editCustome",item)
  149. uni.navigateBack()
  150. }
  151. }
  152. },
  153. }
  154. </script>
  155. <style lang="scss">
  156. .chooseCustomer-content{
  157. width: 100%;
  158. height: 100vh;
  159. background-color: #fff;
  160. padding:0 30upx;
  161. display: flex;
  162. flex-direction: column;
  163. .search{
  164. .shelfName{
  165. font-weight: bold;
  166. }
  167. .search-title{
  168. padding: 20upx 0;
  169. .search-label{
  170. font-size: 30upx;
  171. font-weight: 600;
  172. }
  173. .search-btn{
  174. font-size: 24upx;
  175. color: #999;
  176. text:last-child{
  177. display: inline-block;
  178. padding-left: 10upx;
  179. color:#007AFF
  180. }
  181. }
  182. }
  183. }
  184. .picker-content{
  185. padding: 6upx 0 20upx;
  186. width: 100%;
  187. height: calc(100vh - 144upx);
  188. flex: 1;
  189. overflow-y: scroll;
  190. .picker-main{
  191. width: 100%;
  192. .picker-main-item{
  193. padding: 0 20upx;
  194. .item-name{
  195. padding: 30upx 0;
  196. border-bottom: 1rpx solid #e5e6eb;
  197. }
  198. .item-name:not(:last-child){
  199. border-bottom:none
  200. }
  201. }
  202. }
  203. }
  204. }
  205. </style>