You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

601 lines
14 KiB

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