Você não pode selecionar mais de 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.

index.vue 17 KiB

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