25개 이상의 토픽을 선택하실 수 없습니다. Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

569 lines
14 KiB

  1. <template>
  2. <view class="box">
  3. <view>
  4. <view class="search-box">
  5. <view class="search" @click="goSearch">
  6. <view class="search-img">
  7. <image class="search-img1" src="../../../static/images/search.png" mode=""></image>
  8. </view>
  9. <view class="search-text">输入客户姓名/手机号</view>
  10. </view>
  11. <view class="search-screen" @click="screenshow">
  12. <image class="search-screen1" src="../../../static/images/screen.png" mode=""></image>
  13. </view>
  14. </view>
  15. </view>
  16. <view class="content">
  17. <view v-if="recordList.length==0" style="width: 100%;height: 100%;display: flex;align-items: center;">
  18. <view style="width: 100%;padding-top: 200rpx;">
  19. <view style="width: 100%;text-align: center;">
  20. <image style="width: 220rpx;height: 200rpx;" src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  21. </view>
  22. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  23. </view>
  24. </view>
  25. <view v-if="recordList.length!=0" class="content-tips" v-for="(item,index) in recordList" :key='index' @click="gotoDetail(item.id)">
  26. <view class="content-first">
  27. <view class="left">
  28. <view class="img">{{item.name.slice(0,1)}}</view>
  29. <view class="test">{{item.name}}</view>
  30. </view>
  31. <!-- <view class="right">
  32. <view class="point"></view>
  33. <view class="test">定金</view>
  34. </view> -->
  35. </view>
  36. <view class="content-sec">
  37. <view class="content-sec-lab">
  38. 手机号码:<view class="content-sec-lab1">{{item.phone || '--'}}</view>
  39. </view>
  40. <view class="content-sec-lab">
  41. 客户标签:
  42. <text v-if="item.demand.cusSemanticWordsList.length==0">暂无</text>
  43. <view v-else class="content-sec-tips" v-for="(che,ind) in item.demand.cusSemanticWordsList" :key='ind'>{{che.name}}</view>
  44. </view>
  45. <view class="content-sec-lab">
  46. 顾问姓名:<view class="content-sec-lab1">{{item.agentName}}</view>
  47. </view>
  48. <view class="content-sec-lab">
  49. 添加时间:<view class="content-sec-lab1">{{item.createTime}}</view>
  50. </view>
  51. <view class="content-sec-num">
  52. <view class="">{{item.visitRecord || '--'}}次到访</view>
  53. <view class="">{{item.fraction || '0'}}% | {{item.fraction || '0'}}分</view>
  54. </view>
  55. </view>
  56. <view class="content-last" v-if="item.isshow==true">
  57. <!-- <view class="content-last-tab">添加提醒</view>
  58. <view class="content-last-tab">拨打电话</view> -->
  59. <view class="content-last-tab" @click.stop="gotoFollowUp(item.id)">写跟进</view>
  60. </view>
  61. </view>
  62. </view>
  63. <u-popup v-model="screenShow" mode="top" >
  64. <view class="screen">
  65. <!-- 顾问选择 -->
  66. <view class="screen-counselor">
  67. <view class="screen-text">
  68. 所属顾问
  69. </view>
  70. <view class="screen-sel">
  71. <u-input v-model="screen.agentIdtext" type="text" placeholder='请选择' @click="selectshow = true" class="screen-inp" disabled />
  72. <image class="screen-sel-img" src="../../../static/images/right.png" mode=""></image>
  73. </view>
  74. </view>
  75. <view class="screen-counselor">
  76. <view class="screen-text">
  77. 客户标签
  78. </view>
  79. <view class="screen-sel">
  80. <u-input v-model="screen.cunsumerTips" type="text" placeholder='请选择' @click="selectTipshow = true" class="screen-inp" disabled />
  81. <image class="screen-sel-img" src="../../../static/images/right.png" mode=""></image>
  82. </view>
  83. </view>
  84. <!-- 录音标示 -->
  85. <view class="screen-record">
  86. <view class="screen-record-text">
  87. 客户等级
  88. </view>
  89. <view class="screen-record-tab">
  90. <view :class="[screen.record==0?'screen-record-chose':'screen-record-nochose']" @click="screen.record=0">
  91. A
  92. </view>
  93. <view :class="[screen.record==1?'screen-record-chose':'screen-record-nochose']" @click="screen.record=1">
  94. B
  95. </view>
  96. <view :class="[screen.record==2?'screen-record-chose':'screen-record-nochose']" @click="screen.record=2">
  97. C
  98. </view>
  99. <view :class="[screen.record==3?'screen-record-chose':'screen-record-nochose']" @click="screen.record=3">
  100. D
  101. </view>
  102. </view>
  103. </view>
  104. <!-- <view class="screen-record">
  105. <view class="screen-record-text">
  106. 客户阶段
  107. </view>
  108. <view class="screen-record-tab">
  109. <view v-for="(item,index) in stageList" :key="index">
  110. <view :class="[screen.stage==index?'screen-record-chose':'screen-record-nochose']" @click="screen.stage=index" style="width: 120rpx;">
  111. {{item}}
  112. </view>
  113. </view>
  114. </view>
  115. </view> -->
  116. <view class="screen-record">
  117. <view class="screen-record-text">
  118. 到访次数
  119. </view>
  120. <view class="screen-record-tab">
  121. <view :class="[screen.visitRecord==1?'screen-record-chose':'screen-record-nochose']" @click="screen.visitRecord=1">
  122. 首次到访
  123. </view>
  124. <view :class="[screen.visitRecord==2?'screen-record-chose':'screen-record-nochose']" @click="screen.visitRecord=2">
  125. 第二次
  126. </view>
  127. <view :class="[screen.visitRecord==3?'screen-record-chose':'screen-record-nochose']" @click="screen.visitRecord=3">
  128. 第三次
  129. </view>
  130. <view :class="[screen.visitRecord==4?'screen-record-chose':'screen-record-nochose']" @click="screen.visitRecord=4">
  131. 三次以上
  132. </view>
  133. </view>
  134. </view>
  135. <view class="screen-foot">
  136. <view class="screen-foot-reset" @click="reset">
  137. 重置
  138. </view>
  139. <view class="screen-foot-sure" @click="screensure">
  140. 确定
  141. </view>
  142. </view>
  143. </view>
  144. </u-popup>
  145. <!-- 选择顾问的选择框 -->
  146. <u-select v-model="selectshow" :list="freeList" @confirm="actionSelectCallback"></u-select>
  147. <!-- 客户标签 -->
  148. <u-select v-model="selectTipshow" :list="list1" @confirm="selectCallback"></u-select>
  149. <!-- 时间选择器 -->
  150. </view>
  151. </template>
  152. <script>
  153. export default{
  154. data(){
  155. return{
  156. value:'',
  157. screenShow:false,
  158. selectshow:false,
  159. selectTipshow:false,
  160. buildingID:'',
  161. screen:{
  162. agentId:'',
  163. agentIdtext:'',
  164. visitRecord:'',
  165. record:null,
  166. cunsumerTips:''
  167. },
  168. stageList:['未知','到访','意向','定金','成交'],
  169. recordList:[],
  170. nextPage:1,
  171. totalRecord:'',
  172. freeList:[],
  173. userInfo:{}
  174. }
  175. },
  176. onShow() {
  177. this.buildingID = uni.getStorageSync('buildingID').id;
  178. this.recordList=[]
  179. this.getMyCustom()
  180. this.getFreeList()
  181. },
  182. onReachBottom() {
  183. if(this.totalRecord==this.nextPage){
  184. uni.showToast({
  185. icon:'none',
  186. title: '到底了',
  187. duration: 2000
  188. });
  189. return
  190. }else{
  191. this.nextPage+=1;
  192. this.getMyCustom();
  193. }
  194. },
  195. methods:{
  196. // 客户详情
  197. gotoDetail(id) {
  198. uni.navigateTo({
  199. url: `/pages/center/consumer/consumerDetail?id=${id}`
  200. })
  201. },
  202. getMyCustom(){
  203. var parames = {
  204. pageNum: this.nextPage,
  205. pageSize: 10,
  206. query: {
  207. projectId:this.buildingID,
  208. }
  209. };
  210. if (this.screen.agentId.length > 0) {
  211. parames.query.agentId = this.screen.agentId;
  212. }
  213. if (this.screen.visitRecord.length > 0) {
  214. parames.query.visitRecord = this.screen.visitRecord;
  215. }
  216. if (this.screen.visitRecord > 0) {
  217. parames.query.visitRecord = this.screen.visitRecord;
  218. }
  219. if(this.screen.record==0){
  220. parames.query.levels= ["1"]
  221. }else if(this.screen.record==1){
  222. parames.query.levels= ["2"]
  223. }else if(this.screen.record==2){
  224. parames.query.levels= ["3"]
  225. }else if(this.screen.record==3){
  226. parames.query.levels= ["4"]
  227. }else{
  228. parames.query.levels=''
  229. }
  230. this.userInfo = uni.getStorageSync('weapp_session_userInfo_data');
  231. this.$u.post("/customer/customerManagement", parames).then(data => {
  232. var list = data.results || [];
  233. list.forEach(item=>{
  234. if(this.userInfo.dataCode == 6){
  235. item.isshow=true;
  236. }else{
  237. item.isshow=false;
  238. }
  239. })
  240. this.recordList = [...this.recordList, ...list];
  241. this.totalRecord=data.totalPage;
  242. })
  243. },
  244. //获取顾问列表
  245. getFreeList() {
  246. this.$u.get("/zkAgentPool/freeList?itemId="+this.buildingID).then(res => {
  247. this.freeList = res;
  248. this.freeList.forEach(item=>{
  249. item.label=item.name;
  250. item.value=item.agentId
  251. })
  252. })
  253. },
  254. // 筛选
  255. screenshow(){
  256. this.screenShow=true
  257. },
  258. //选择顾问
  259. actionSelectCallback(e){
  260. this.screen.agentId=e[0].value;
  261. this.screen.agentIdtext=e[0].label;
  262. },
  263. //选择标签
  264. selectCallback(e){
  265. console.log(e[0].label)
  266. },
  267. //重置
  268. reset(){
  269. this.screen={
  270. agentId:'',
  271. agentIdtext:'',
  272. visitRecord:'',
  273. record:null,
  274. cunsumerTips:''
  275. }
  276. this.recordList=[];
  277. this.getMyCustom();
  278. },
  279. //筛选确认
  280. screensure(){
  281. this.screenShow=false;
  282. this.nextPage=1;
  283. this.recordList=[];
  284. this.getMyCustom();
  285. },
  286. goSearch(){
  287. uni.navigateTo({
  288. url: '/pages/center/consumer/consumerSearch'
  289. });
  290. },
  291. gotoFollowUp(id) {
  292. uni.navigateTo({
  293. url: `/pages/center/consumer/newFollowup/newFollowup?id=${id}`
  294. })
  295. },
  296. }
  297. }
  298. </script>
  299. <style lang="scss" scoped>
  300. .box {
  301. width: 100%;
  302. height: 100%;
  303. background: #F8F8F8;
  304. }
  305. .search-box{
  306. width: 100%;
  307. height: 102rpx;
  308. background: #FFFFFF;
  309. display: flex;
  310. align-items: center;
  311. justify-content: center;
  312. .search{
  313. width: 620rpx;
  314. height: 70rpx;
  315. display: flex;
  316. align-items: center;
  317. background: #F8F8F8;
  318. border-radius: 33rpx;
  319. .search-img{
  320. width: 26rpx;
  321. height: 30rpx;
  322. margin-left: 20rpx;
  323. .search-img1{
  324. width: 100%;
  325. height: 100%;
  326. margin-top: 2rpx;
  327. }
  328. }
  329. .search-text{
  330. font-size: 28rpx;
  331. font-weight: 400;
  332. color: #999999;
  333. margin-left:10rpx;
  334. }
  335. }
  336. .search-screen{
  337. width: 40rpx;
  338. height: 40rpx;
  339. margin-left: 30rpx;
  340. .search-screen1{
  341. width: 100%;
  342. height: 100%;
  343. }
  344. }
  345. }
  346. .content{
  347. // height: 1000rpx;/
  348. overflow: hidden;
  349. border-top: 1px solid #E0E0E0;
  350. .content-tips{
  351. background: #fff;
  352. // box-sizing: border-box;
  353. margin-bottom: 20rpx;
  354. overflow: hidden;
  355. .content-first{
  356. padding: 19rpx 30rpx;
  357. display: flex;
  358. justify-content: space-between;
  359. box-sizing: border-box;
  360. // border-top: 1px solid #E0E0E0;
  361. font-weight: 400;
  362. color: #292929;
  363. height: 90rpx;
  364. font-size: 30rpx;
  365. line-height: 30rpx;
  366. .left{
  367. display: flex;
  368. .img{
  369. // margin-top: 19rpx;
  370. width: 52rpx;
  371. height: 52rpx;
  372. border: 1px solid #E0E0E0;
  373. border-radius: 50%;
  374. text-align: center;
  375. line-height: 50rpx;
  376. }
  377. .test{
  378. margin-top: 11rpx;
  379. margin-left: 20rpx;
  380. font-weight: 500;
  381. color: #333333;
  382. }
  383. }
  384. .right{
  385. display: flex;
  386. .point{
  387. width: 12rpx;
  388. height: 12rpx;
  389. background: #2B6EFF;
  390. border-radius: 50%;
  391. margin-right: 9rpx;
  392. margin-top: 20rpx;
  393. }
  394. .test{
  395. margin-top: 11rpx;
  396. }
  397. }
  398. }
  399. .content-sec{
  400. border-top: 1px solid #E0E0E0;
  401. padding: 0 30rpx;
  402. padding-bottom: 30rpx;
  403. // height: 270rpx;
  404. position: relative;
  405. .content-sec-lab{
  406. margin-top: 30rpx;
  407. display: flex;
  408. font-size: 30rpx;
  409. font-weight: 400;
  410. color: #666666;
  411. line-height: 30rpx;
  412. .content-sec-lab1{
  413. color: #333333;
  414. }
  415. .content-sec-tips{
  416. max-width:174rpx ;
  417. height: 46rpx;
  418. background: #F2F2F2;
  419. border-radius: 6rpx;
  420. text-align: center;
  421. line-height: 26rpx;
  422. overflow: hidden;
  423. text-overflow:ellipsis;
  424. white-space: nowrap;
  425. font-size: 26rpx;
  426. font-weight: 400;
  427. color: #333333;
  428. margin-right: 24rpx;
  429. box-sizing: border-box;
  430. padding: 10rpx 24rpx;
  431. }
  432. }
  433. .content-sec-num{
  434. position: absolute;
  435. width: 190rpx;
  436. height: 90rpx;
  437. background: #F4F8FD;
  438. border-radius: 12rpx;
  439. font-weight: 400;
  440. color: #2671E2;
  441. line-height: 45rpx;
  442. bottom: 30rpx;
  443. right: 30rpx;
  444. text-align: center;
  445. }
  446. }
  447. .content-last{
  448. display: flex;
  449. border-top: 1px solid #E0E0E0;
  450. // padding: 0 30rpx;
  451. height: 78rpx;
  452. .content-last-tab{
  453. width: 33.4%;
  454. text-align: center;
  455. font-size: 30rpx;
  456. font-weight: 400;
  457. color: #333333;
  458. line-height: 78rpx;
  459. border-right: 1px solid #E0E0E0;
  460. }
  461. }
  462. }
  463. }
  464. // 这是弹出层
  465. .screen{
  466. // box-sizing: border-box;
  467. // padding: 0 30rpx;
  468. .screen-counselor{
  469. display: flex;
  470. height: 106rpx;
  471. // padding: 40rpx 30rpx 36rpx 30rpx;
  472. padding: 0 30rpx;
  473. box-sizing: border-box;
  474. border-bottom: 1px solid #CCCCCC;
  475. .screen-text{
  476. margin: 40rpx 0 36rpx 0;
  477. font-size: 30rpx;
  478. font-weight: 400;
  479. color: #333333;
  480. line-height: 30rpx;
  481. }
  482. .screen-sel{
  483. display: flex;
  484. justify-content: space-between;
  485. width: 500rpx;
  486. margin-left: 60rpx;
  487. .screen-sel-img{
  488. margin: 40rpx 0 36rpx 0;
  489. width: 14rpx;
  490. height: 30rpx;
  491. }
  492. .screen-inp{
  493. margin-top: 20rpx;
  494. }
  495. }
  496. }
  497. .screen-record{
  498. height: 192rpx;
  499. // width: 100%;
  500. overflow: hidden;
  501. padding: 0 30rpx;
  502. box-sizing: border-box;
  503. border-bottom: 1px solid #CCCCCC;
  504. .screen-record-text{
  505. margin-top: 36rpx;
  506. font-size: 30rpx;
  507. font-weight: 400;
  508. color: #333333;
  509. line-height: 30rpx;
  510. }
  511. .screen-record-tab{
  512. margin-top: 30rpx;
  513. display: flex;
  514. // justify-content: space-around;
  515. .screen-record-chose{
  516. width: 156rpx;
  517. height: 60rpx;
  518. background: #FFFFFF;
  519. border-radius: 4rpx;
  520. border: 1px solid #2671E2;
  521. text-align: center;
  522. line-height: 60rpx;
  523. margin-right: 22rpx;
  524. }
  525. .screen-record-nochose{
  526. width: 156rpx;
  527. height: 60rpx;
  528. background: #FFFFFF;
  529. border-radius: 4rpx;
  530. border: 1px solid #C9C9C9;
  531. text-align: center;
  532. line-height: 60rpx;
  533. margin-right: 22rpx;
  534. }
  535. }
  536. }
  537. .screen-foot{
  538. height: 88rpx;
  539. display: flex;
  540. .screen-foot-reset{
  541. width: 50%;
  542. text-align: center;
  543. line-height: 88rpx;
  544. font-size: 30rpx;
  545. font-weight: 400;
  546. color: #666666;
  547. }
  548. .screen-foot-sure{
  549. width: 50%;
  550. text-align: center;
  551. line-height: 88rpx;
  552. font-size: 30rpx;
  553. font-weight: 400;
  554. color: #FFFFFF;
  555. background: #2671E2;
  556. }
  557. }
  558. }
  559. </style>