Não pode escolher mais do que 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.
 
 
 

555 linhas
12 KiB

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