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.
 
 
 

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