Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.
 
 
 

774 řádky
16 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="selectshow = true">
  10. {{ guwenText }}
  11. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  12. </view>
  13. <view class="tabbox" @click="tapsoltishow">
  14. {{ steyStatus }}
  15. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  16. </view>
  17. <view class="tabbox" @click="showIdent = true">
  18. {{ weijinTag }}
  19. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  20. </view>
  21. </view>
  22. <view class="count" v-if="recordList.length > 0">
  23. 筛选结果:<text>{{totalRecords}} </text>条
  24. </view>
  25. <view class="content">
  26. <view v-if="recordList.length==0"
  27. style="width: 100%;height: 100%;display: flex;align-items: center;background: #FFFFFF;">
  28. <view style="width: 100%;padding-top: 200rpx;">
  29. <view style="width: 100%;text-align: center;">
  30. <image style="width: 220rpx;height: 200rpx;"
  31. src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  32. </view>
  33. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  34. </view>
  35. </view>
  36. <view v-if="recordList.length!=0" class="content-tips" v-for="(item,index) in recordList" :key='index'
  37. @click="tapThevisiting(item, index)">
  38. <view class="content-first">
  39. <view class="left">
  40. <view class="img">顾</view>
  41. <view class="name">{{item.agentName}}</view>
  42. <view class="status" v-if="item.replaceReception==1">代接待</view>
  43. </view>
  44. <view class="right">
  45. <view class="">
  46. {{ item.violatedStatus | ViolatedStatus }}|{{ item.disposeStatus | DisposeStatus }}
  47. </view>
  48. </view>
  49. </view>
  50. <view class="content-last">
  51. <view class="item">
  52. <image src="@/static/images/img/time.png" mode=""></image>
  53. <text>{{item.createTime}}</text>
  54. </view>
  55. <view class="item">
  56. <image src="@/static/images/img/voice.png" mode=""></image>
  57. <text>{{item.mm || '0'}}min</text>
  58. </view>
  59. <view class="item">
  60. <image src="@/static/images/img/hit.png" mode=""></image>
  61. <text>{{item.violatedFrequency || '0'}}</text>
  62. </view>
  63. </view>
  64. </view>
  65. </view>
  66. <!-- 选择顾问的选择框 -->
  67. <u-select v-model="selectshow" :list="freeList" @confirm="actionSelectCallback"></u-select>
  68. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  69. <u-popup v-model="timeshow" mode="bottom">
  70. <block v-for="(data, index) in activeList" :key="index">
  71. <view class="timeview" :style="{ color: activeTotal == data.id ? '#2B6EFF' : '#333333' }"
  72. @click="tabtimetap(data.id, data.title)">{{ data.title }}</view>
  73. </block>
  74. </u-popup>
  75. <u-select v-model="soltishow" :list="orderBylist" @confirm="selectCallback2"></u-select>
  76. <u-select v-model="showIdent" :list="identList" @confirm="selectIdent"></u-select>
  77. </view>
  78. </template>
  79. <script>
  80. export default {
  81. data() {
  82. return {
  83. orderBylist: [{
  84. label: '全部',
  85. value: null
  86. }, {
  87. label: '待处理',
  88. value: 0
  89. }, {
  90. label: '已处理',
  91. value: 1
  92. }],
  93. activeTotal: 5,
  94. activeList: [ // 时间筛选数组
  95. {
  96. title: '全部',
  97. id: 5,
  98. },
  99. {
  100. title: '今天',
  101. id: 0,
  102. },
  103. {
  104. title: '昨天',
  105. id: 1,
  106. },
  107. {
  108. title: '近7天',
  109. id: 2,
  110. },
  111. {
  112. title: '近30天',
  113. id: 3,
  114. },
  115. {
  116. title: '自定义',
  117. id: 4,
  118. },
  119. ],
  120. showIdent: false, // 显示选择违禁标识列表
  121. identList: [ // 违禁标识列表
  122. {
  123. label: '全部',
  124. value: null
  125. },
  126. {
  127. label: '有效',
  128. value: 1
  129. },
  130. {
  131. label: '无效',
  132. value: 2
  133. },
  134. ],
  135. violatedStatus: null, // 违禁状态
  136. selectshow: false,
  137. totalTimeShow: false,
  138. screen: {
  139. agentId: '', //顾问id
  140. record: '0',
  141. },
  142. freeList: [], //顾问
  143. recordList: [],
  144. buildingID: '',
  145. nextPage: 1,
  146. totalRecord: "",
  147. staTime: '',
  148. endtime: '',
  149. isnorefresh: '',
  150. activeTotal2: 0,
  151. timeshow: false,
  152. soltishow: false,
  153. orderBy: null,
  154. userInfo: {},
  155. totalRecords: '', // 列表全部的条数
  156. isRefresh: false,
  157. nextPageObj: {}, // 跳转详情页面的参数
  158. // 页面文字展示内容
  159. timeText: '接待时间', //
  160. guwenText: '顾问', //
  161. steyStatus: '处理状态', //
  162. weijinTag: '违禁标识', // 违禁标识
  163. }
  164. },
  165. onLoad(options) {
  166. this.isnorefresh = options.refresh;
  167. if (options.activeTotal) {
  168. this.activeTotal = options.activeTotal
  169. }
  170. if (options.staTime) {
  171. this.staTime = options.staTime;
  172. this.endtime = options.endtime;
  173. }
  174. if (options.violatedStatus) this.violatedStatus = options.violatedStatus
  175. },
  176. onShow() {
  177. this.userInfo = uni.getStorageSync('weapp_session_userInfo_data');
  178. if (this.isnorefresh == 'refresh') {
  179. this.buildingID = uni.getStorageSync('buildingID').id;
  180. this.recordList = [];
  181. this.nextPage = 1;
  182. this.isRefresh = false;
  183. this.getMyCustom()
  184. this.getFreeList();
  185. this.isnorefresh = '';
  186. }
  187. var pages = getCurrentPages();
  188. pages[0].$vm.path = '/pages/index/index'
  189. console.log(pages[0].$vm.path)
  190. },
  191. onPullDownRefresh() {
  192. this.nextPage = 1;
  193. this.isRefresh = true;
  194. this.getMyCustom()
  195. this.resetRefreshParams()
  196. setTimeout(function() {
  197. uni.stopPullDownRefresh();
  198. }, 1000);
  199. },
  200. onReachBottom() {
  201. if (this.totalRecord == this.nextPage) {
  202. uni.showToast({
  203. icon: 'none',
  204. title: '到底了',
  205. duration: 2000
  206. });
  207. return
  208. } else {
  209. this.nextPage += 1;
  210. this.isRefresh = false;
  211. this.getMyCustom();
  212. }
  213. },
  214. methods: {
  215. // 重置参数
  216. resetRefreshParams() {
  217. this.timeText = '接待时间'
  218. this.activeTotal = 5
  219. this.guwenText = '顾问'
  220. this.screen.agentId = '' // 顾问id
  221. this.steyStatus = '处理状态'
  222. this.orderBy = null
  223. this.weijinTag = '违禁标识'
  224. this.violatedStatus = null // 违禁状态
  225. },
  226. tapsoltishow() {
  227. this.soltishow = true;
  228. },
  229. taptimeisshow() {
  230. this.timeshow = true;
  231. },
  232. //选择标签
  233. selectCallback2(e) {
  234. this.orderBy = e[0].value;
  235. this.steyStatus = e[0].label;
  236. this.nextPage = 1;
  237. this.recordList = [];
  238. this.isRefresh = false;
  239. this.getMyCustom();
  240. },
  241. // 选择违禁标识
  242. selectIdent(e) {
  243. this.violatedStatus = e[0].value
  244. this.weijinTag = e[0].label
  245. this.nextPage = 1;
  246. this.recordList = [];
  247. this.isRefresh = false;
  248. this.getMyCustom();
  249. },
  250. //时间选择
  251. tabtimetap(index, title) {
  252. this.timeshow = false;
  253. if (index == 4) {
  254. this.totalTimeShow = true;
  255. } else {
  256. this.timeText = title
  257. this.activeTotal = index;
  258. this.staTime = '';
  259. this.endtime = '';
  260. this.nextPage = 1;
  261. this.recordList = [];
  262. this.isRefresh = false;
  263. this.getMyCustom();
  264. }
  265. },
  266. //自定义时间
  267. totalTimeChange(e) {
  268. this.staTime = e.startDate;
  269. this.endtime = e.endDate;
  270. this.timeText = `${e.startDate}-${e.endDate}`
  271. this.activeTotal = 4;
  272. this.nextPage = 1;
  273. this.recordList = [];
  274. this.isRefresh = false;
  275. this.getMyCustom();
  276. },
  277. // 跳转违禁详情
  278. tapThevisiting(item, index) {
  279. if (item.status == 0) {
  280. uni.showToast({
  281. icon: "none",
  282. title: "排队中"
  283. })
  284. return
  285. } else {
  286. const parames = {
  287. pageNum: 1,
  288. pageSize: 100,
  289. query: {
  290. customerId: item.id,
  291. }
  292. }
  293. this.$u.post("/customer/prohibitedMatch", {
  294. customerId: item.id
  295. }).then(res => {
  296. let newweijin = res[0];
  297. newweijin.transferContent = JSON.parse(newweijin.transferContent)
  298. var item = {
  299. bg: newweijin.transferContent.bg,
  300. customerId: newweijin.corpusId,
  301. }
  302. uni.setStorageSync("searchobj", item); //写入缓存
  303. this.$u.post("/corpus/findByPage", parames).then(res => {
  304. if (res == null) {
  305. uni.showToast({
  306. icon: "none",
  307. title: "暂无音频"
  308. })
  309. return
  310. } else {
  311. let newobj = res[0];
  312. let obj = {
  313. pageSize: index+1,
  314. num: this.totalRecords,
  315. query: {
  316. ...this.nextPageObj
  317. }
  318. }
  319. uni.setStorageSync('nextPageObj', JSON.stringify(obj))
  320. uni.navigateTo({
  321. url: `/pages/center/prohibited/details?customerId=${newobj.customerId}&status=${newobj.status}&stateisshow=${"2"}&index=${index}&isMerge=${res[0].merge}`
  322. })
  323. // if (res[0].merge == 0) {
  324. // }
  325. // else {
  326. // uni.navigateTo({
  327. // url: `/pages/mine/details?customerId=${newobj.customerId}&status=${newobj.status}&stateisshow=${"2"}`
  328. // })
  329. // }
  330. }
  331. })
  332. })
  333. }
  334. },
  335. // 获取围巾列表
  336. getMyCustom() {
  337. let dateType = 0;
  338. if (this.activeTotal == 5) {
  339. dateType = null;
  340. } else if (this.activeTotal == 4) {
  341. dateType = null;
  342. } else {
  343. dateType = this.activeTotal;
  344. }
  345. var parames = {
  346. pageNum: this.nextPage,
  347. pageSize: 10,
  348. query: {
  349. projectId: this.buildingID,
  350. time: 1,
  351. staTime: this.staTime,
  352. endtime: this.endtime,
  353. taboo: 1,
  354. dateType: dateType,
  355. disposeStatus: this.orderBy, // 处理状态
  356. violatedStatus: this.violatedStatus, // 违禁状态
  357. }
  358. };
  359. if (this.screen.agentId) {
  360. parames.query.agentId = this.screen.agentId
  361. }
  362. this.$u.post("/customer/findbypage", parames).then(data => {
  363. var list = data.results || [];
  364. if (this.isRefresh) {
  365. this.recordList = list;
  366. } else {
  367. this.recordList = [...this.recordList, ...list];
  368. }
  369. this.totalRecord = data.totalPage;
  370. this.totalRecords = data.totalRecord;
  371. this.nextPageObj = parames.query
  372. })
  373. },
  374. //获取顾问列表
  375. getFreeList() {
  376. this.$u.post("/cusLvStatistics/selectAllAccountIdByHouseId", {
  377. houseId: this.buildingID
  378. }).then(res => {
  379. this.freeList = res;
  380. this.freeList.forEach(item => {
  381. item.label = item.name;
  382. item.value = item.accountId
  383. })
  384. this.freeList.unshift({
  385. label: '全部',
  386. value: null,
  387. })
  388. })
  389. },
  390. //顾问确认
  391. actionSelectCallback(e) {
  392. this.screen.agentId = e[0].value;
  393. this.guwenText = e[0].label;
  394. this.recordList = [];
  395. this.nextPage = 1;
  396. this.selectshow = false;
  397. this.isRefresh = false;
  398. this.getMyCustom();
  399. },
  400. },
  401. filters: {
  402. // violatedStatus
  403. ViolatedStatus(status) {
  404. let str = '';
  405. switch (status) {
  406. case 0:
  407. str = '有效违禁'
  408. break;
  409. case 1:
  410. str = '有效违禁'
  411. break;
  412. case 2:
  413. str = '无效违禁'
  414. break;
  415. }
  416. return str
  417. },
  418. // DisposeStatus
  419. DisposeStatus(status) {
  420. let str = '';
  421. switch (status) {
  422. case 0:
  423. str = '待处理'
  424. break;
  425. case 1:
  426. str = '已处理'
  427. break;
  428. }
  429. return str
  430. },
  431. }
  432. }
  433. </script>
  434. <style lang="scss" scoped>
  435. .box {
  436. width: 100vw;
  437. min-height: calc(100vh - var(--window-top));
  438. background: #F8F8F8;
  439. }
  440. .count {
  441. width: 100%;
  442. height: 90rpx;
  443. display: flex;
  444. align-items: center;
  445. justify-content: center;
  446. background-color: #FBE4E4;
  447. text {
  448. color: #F71616;
  449. }
  450. }
  451. .timeview {
  452. height: 80rpx;
  453. line-height: 80rpx;
  454. width: 100%;
  455. text-align: center;
  456. border-bottom: 1px solid #F8F8F8;
  457. }
  458. //时间切换的样式
  459. .boxtittab {
  460. position: sticky;
  461. top: var(--window-top);
  462. z-index: 100;
  463. width: 100;
  464. height: 92rpx;
  465. background: #FFFFFF;
  466. border: 1px solid #E0E0E0;
  467. display: flex;
  468. align-items: center;
  469. .tabbox {
  470. flex: 1;
  471. height: 100%;
  472. text-align: center;
  473. line-height: 92rpx;
  474. color: #666666;
  475. font-size: 28rpx;
  476. overflow: hidden;
  477. /* 超出一行文字自动隐藏 */
  478. text-overflow: ellipsis;
  479. /*文字隐藏后添加省略号*/
  480. white-space: nowrap;
  481. /*强制不换行*/
  482. }
  483. }
  484. .search-box {
  485. width: 100%;
  486. height: 102rpx;
  487. background: #FFFFFF;
  488. display: flex;
  489. align-items: center;
  490. justify-content: center;
  491. .search {
  492. width: 94%;
  493. height: 70rpx;
  494. display: flex;
  495. align-items: center;
  496. background: #F8F8F8;
  497. border-radius: 33rpx;
  498. .search-img {
  499. width: 26rpx;
  500. height: 30rpx;
  501. margin-left: 20rpx;
  502. .search-img1 {
  503. width: 100%;
  504. height: 100%;
  505. margin-top: 2rpx;
  506. }
  507. }
  508. .search-text {
  509. font-size: 28rpx;
  510. font-weight: 400;
  511. color: #999999;
  512. margin-left: 10rpx;
  513. }
  514. }
  515. .search-screen {
  516. width: 40rpx;
  517. height: 40rpx;
  518. margin-left: 30rpx;
  519. .search-screen1 {
  520. width: 100%;
  521. height: 100%;
  522. }
  523. }
  524. }
  525. .content {
  526. .content-tips {
  527. margin: 0 0 20rpx 0;
  528. background: #fff;
  529. box-sizing: border-box;
  530. display: flex;
  531. flex-direction: column;
  532. .content-first {
  533. padding: 20rpx 30rpx;
  534. display: flex;
  535. justify-content: space-between;
  536. background-color: #EEF4FD;
  537. .left {
  538. display: flex;
  539. .img {
  540. margin-right: 10rpx;
  541. width: 52rpx;
  542. height: 52rpx;
  543. background: #FFFFFF;
  544. border: 1px solid #C9C9C9;
  545. border-radius: 50%;
  546. text-align: center;
  547. line-height: 52rpx;
  548. }
  549. .name {
  550. font-weight: 600;
  551. color: #333333;
  552. // margin-left: 20rpx;
  553. margin-top: 11rpx;
  554. }
  555. .status {
  556. width: 110rpx;
  557. height: 42rpx;
  558. background: #FFF9F5;
  559. border-radius: 4rpx;
  560. font-size: 26rpx;
  561. font-weight: 400;
  562. color: #EC8D49;
  563. line-height: 42rpx;
  564. text-align: center;
  565. margin-left: 19rpx;
  566. margin-top: 11rpx;
  567. }
  568. }
  569. .right {
  570. display: flex;
  571. margin-top: 11rpx;
  572. .point {
  573. width: 12rpx;
  574. height: 12rpx;
  575. background: #2B6EFF;
  576. border-radius: 50%;
  577. margin-right: 9rpx;
  578. margin-top: 16rpx;
  579. }
  580. }
  581. }
  582. .content-last {
  583. padding: 24rpx 30rpx;
  584. font-size: 30rpx;
  585. font-weight: 400;
  586. color: #666666;
  587. display: flex;
  588. justify-content: space-between;
  589. .item {
  590. flex-shrink: 0;
  591. display: flex;
  592. align-items: center;
  593. image {
  594. margin-right: 10rpx;
  595. width: 32rpx;
  596. height: 32rpx;
  597. }
  598. text {
  599. font-size: 28rpx;
  600. }
  601. }
  602. }
  603. }
  604. }
  605. // 这是弹出层
  606. .screen {
  607. // box-sizing: border-box;
  608. // padding: 0 30rpx;
  609. position: absolute;
  610. .screen-counselor {
  611. display: flex;
  612. height: 106rpx;
  613. // padding: 40rpx 30rpx 36rpx 30rpx;
  614. padding: 0 30rpx;
  615. box-sizing: border-box;
  616. border-bottom: 1px solid #EEEEEE;
  617. .screen-text {
  618. margin: 40rpx 0 36rpx 0;
  619. font-size: 30rpx;
  620. font-weight: 400;
  621. color: #333333;
  622. line-height: 30rpx;
  623. }
  624. .screen-sel {
  625. display: flex;
  626. justify-content: space-between;
  627. width: 500rpx;
  628. margin-left: 60rpx;
  629. .screen-sel-img {
  630. margin: 40rpx 0 36rpx 0;
  631. width: 14rpx;
  632. height: 30rpx;
  633. }
  634. .screen-inp {
  635. margin-top: 20rpx;
  636. }
  637. }
  638. }
  639. .screen-record {
  640. height: 192rpx;
  641. // width: 100%;
  642. overflow: hidden;
  643. padding: 0 30rpx;
  644. box-sizing: border-box;
  645. border-bottom: 1px solid #EEEEEE;
  646. .screen-record-text {
  647. margin-top: 36rpx;
  648. font-size: 30rpx;
  649. font-weight: 400;
  650. color: #333333;
  651. line-height: 30rpx;
  652. }
  653. .screen-record-tab {
  654. margin-top: 30rpx;
  655. display: flex;
  656. // justify-content: space-around;
  657. .screen-record-chose {
  658. width: 156rpx;
  659. height: 60rpx;
  660. background: #2671E2;
  661. border-radius: 4rpx;
  662. border: 1px solid #2671E2;
  663. text-align: center;
  664. line-height: 60rpx;
  665. margin-right: 22rpx;
  666. color: #FFFFFF;
  667. }
  668. .screen-record-nochose {
  669. width: 156rpx;
  670. height: 60rpx;
  671. background: #FFFFFF;
  672. border-radius: 4rpx;
  673. border: 1px solid #C9C9C9;
  674. text-align: center;
  675. line-height: 60rpx;
  676. margin-right: 22rpx;
  677. }
  678. }
  679. }
  680. .screen-foot {
  681. width: 100%;
  682. height: 100rpx;
  683. display: flex;
  684. .screen-foot-reset {
  685. width: 50%;
  686. text-align: center;
  687. height: 100rpx;
  688. line-height: 100rpx;
  689. font-size: 30rpx;
  690. font-weight: 400;
  691. color: #666666;
  692. }
  693. .screen-foot-sure {
  694. width: 50%;
  695. text-align: center;
  696. line-height: 100rpx;
  697. height: 100rpx;
  698. font-size: 30rpx;
  699. font-weight: 400;
  700. color: #FFFFFF;
  701. background: #2671E2;
  702. }
  703. }
  704. }
  705. </style>