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

658 lines
14 KiB

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