Você não pode selecionar mais de 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.
 
 
 

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