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
2 anos atrás
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790
  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. validInvalid: 0, // 接待有效无效
  369. }
  370. };
  371. if (this.screen.agentId) {
  372. parames.query.agentId = this.screen.agentId
  373. }
  374. this.$u.post("/customer/findbypage", parames).then(data => {
  375. this.LOADING = false
  376. var list = data.results || [];
  377. if (this.isRefresh) {
  378. this.recordList = list;
  379. } else {
  380. this.recordList = [...this.recordList, ...list];
  381. }
  382. this.totalRecord = data.totalPage;
  383. this.totalRecords = data.totalRecord;
  384. this.nextPageObj = parames.query
  385. }).catch(e => {
  386. this.LOADING = false
  387. })
  388. },
  389. //获取顾问列表
  390. getFreeList() {
  391. this.$u.post("/cusLvStatistics/selectAllAccountIdByHouseId", {
  392. houseId: this.buildingID
  393. }).then(res => {
  394. this.freeList = res;
  395. this.freeList.forEach(item => {
  396. item.label = item.name;
  397. item.value = item.accountId
  398. })
  399. this.freeList.unshift({
  400. label: '全部',
  401. value: null,
  402. })
  403. })
  404. },
  405. //顾问确认
  406. actionSelectCallback(e) {
  407. this.screen.agentId = e[0].value;
  408. this.guwenText = e[0].label;
  409. this.recordList = [];
  410. this.nextPage = 1;
  411. this.selectshow = false;
  412. this.isRefresh = false;
  413. this.getMyCustom();
  414. },
  415. },
  416. filters: {
  417. // violatedStatus
  418. ViolatedStatus(status) {
  419. let str = '';
  420. switch (status) {
  421. case 0:
  422. str = '有效违禁'
  423. break;
  424. case 1:
  425. str = '有效违禁'
  426. break;
  427. case 2:
  428. str = '无效违禁'
  429. break;
  430. }
  431. return str
  432. },
  433. // DisposeStatus
  434. DisposeStatus(status) {
  435. let str = '';
  436. switch (status) {
  437. case 0:
  438. str = '待处理'
  439. break;
  440. case 1:
  441. str = '已处理'
  442. break;
  443. }
  444. return str
  445. },
  446. }
  447. }
  448. </script>
  449. <style lang="scss" scoped>
  450. .box {
  451. width: 100vw;
  452. min-height: calc(100vh - var(--window-top));
  453. background: #F8F8F8;
  454. }
  455. .count {
  456. width: 100%;
  457. height: 90rpx;
  458. display: flex;
  459. align-items: center;
  460. justify-content: center;
  461. background-color: #FBE4E4;
  462. text {
  463. color: #F71616;
  464. }
  465. }
  466. .timeview {
  467. height: 80rpx;
  468. line-height: 80rpx;
  469. width: 100%;
  470. text-align: center;
  471. border-bottom: 1px solid #F8F8F8;
  472. }
  473. //时间切换的样式
  474. .boxtittab {
  475. position: sticky;
  476. top: var(--window-top);
  477. z-index: 100;
  478. width: 100;
  479. height: 92rpx;
  480. background: #FFFFFF;
  481. border: 1px solid #E0E0E0;
  482. display: flex;
  483. align-items: center;
  484. .tabbox {
  485. flex: 1;
  486. height: 100%;
  487. text-align: center;
  488. line-height: 92rpx;
  489. color: #666666;
  490. font-size: 28rpx;
  491. overflow: hidden;
  492. /* 超出一行文字自动隐藏 */
  493. text-overflow: ellipsis;
  494. /*文字隐藏后添加省略号*/
  495. white-space: nowrap;
  496. /*强制不换行*/
  497. }
  498. }
  499. .search-box {
  500. width: 100%;
  501. height: 102rpx;
  502. background: #FFFFFF;
  503. display: flex;
  504. align-items: center;
  505. justify-content: center;
  506. .search {
  507. width: 94%;
  508. height: 70rpx;
  509. display: flex;
  510. align-items: center;
  511. background: #F8F8F8;
  512. border-radius: 33rpx;
  513. .search-img {
  514. width: 26rpx;
  515. height: 30rpx;
  516. margin-left: 20rpx;
  517. .search-img1 {
  518. width: 100%;
  519. height: 100%;
  520. margin-top: 2rpx;
  521. }
  522. }
  523. .search-text {
  524. font-size: 28rpx;
  525. font-weight: 400;
  526. color: #999999;
  527. margin-left: 10rpx;
  528. }
  529. }
  530. .search-screen {
  531. width: 40rpx;
  532. height: 40rpx;
  533. margin-left: 30rpx;
  534. .search-screen1 {
  535. width: 100%;
  536. height: 100%;
  537. }
  538. }
  539. }
  540. .content {
  541. .content-tips {
  542. margin: 0 0 20rpx 0;
  543. background: #fff;
  544. box-sizing: border-box;
  545. display: flex;
  546. flex-direction: column;
  547. .content-first {
  548. padding: 20rpx 30rpx;
  549. display: flex;
  550. justify-content: space-between;
  551. background-color: #EEF4FD;
  552. .left {
  553. display: flex;
  554. .img {
  555. margin-right: 10rpx;
  556. width: 52rpx;
  557. height: 52rpx;
  558. background: #FFFFFF;
  559. border: 1px solid #C9C9C9;
  560. border-radius: 50%;
  561. text-align: center;
  562. line-height: 52rpx;
  563. }
  564. .name {
  565. font-weight: 600;
  566. color: #333333;
  567. // margin-left: 20rpx;
  568. margin-top: 11rpx;
  569. }
  570. .status {
  571. width: 110rpx;
  572. height: 42rpx;
  573. background: #FFF9F5;
  574. border-radius: 4rpx;
  575. font-size: 26rpx;
  576. font-weight: 400;
  577. color: #EC8D49;
  578. line-height: 42rpx;
  579. text-align: center;
  580. margin-left: 19rpx;
  581. margin-top: 11rpx;
  582. }
  583. }
  584. .right {
  585. display: flex;
  586. margin-top: 11rpx;
  587. .point {
  588. width: 12rpx;
  589. height: 12rpx;
  590. background: #2B6EFF;
  591. border-radius: 50%;
  592. margin-right: 9rpx;
  593. margin-top: 16rpx;
  594. }
  595. }
  596. }
  597. .content-last {
  598. padding: 24rpx 30rpx;
  599. font-size: 30rpx;
  600. font-weight: 400;
  601. color: #666666;
  602. display: flex;
  603. justify-content: space-between;
  604. .item {
  605. flex-shrink: 0;
  606. display: flex;
  607. align-items: center;
  608. image {
  609. margin-right: 10rpx;
  610. width: 32rpx;
  611. height: 32rpx;
  612. }
  613. text {
  614. font-size: 28rpx;
  615. }
  616. }
  617. }
  618. }
  619. }
  620. // 这是弹出层
  621. .screen {
  622. // box-sizing: border-box;
  623. // padding: 0 30rpx;
  624. position: absolute;
  625. .screen-counselor {
  626. display: flex;
  627. height: 106rpx;
  628. // padding: 40rpx 30rpx 36rpx 30rpx;
  629. padding: 0 30rpx;
  630. box-sizing: border-box;
  631. border-bottom: 1px solid #EEEEEE;
  632. .screen-text {
  633. margin: 40rpx 0 36rpx 0;
  634. font-size: 30rpx;
  635. font-weight: 400;
  636. color: #333333;
  637. line-height: 30rpx;
  638. }
  639. .screen-sel {
  640. display: flex;
  641. justify-content: space-between;
  642. width: 500rpx;
  643. margin-left: 60rpx;
  644. .screen-sel-img {
  645. margin: 40rpx 0 36rpx 0;
  646. width: 14rpx;
  647. height: 30rpx;
  648. }
  649. .screen-inp {
  650. margin-top: 20rpx;
  651. }
  652. }
  653. }
  654. .screen-record {
  655. height: 192rpx;
  656. // width: 100%;
  657. overflow: hidden;
  658. padding: 0 30rpx;
  659. box-sizing: border-box;
  660. border-bottom: 1px solid #EEEEEE;
  661. .screen-record-text {
  662. margin-top: 36rpx;
  663. font-size: 30rpx;
  664. font-weight: 400;
  665. color: #333333;
  666. line-height: 30rpx;
  667. }
  668. .screen-record-tab {
  669. margin-top: 30rpx;
  670. display: flex;
  671. // justify-content: space-around;
  672. .screen-record-chose {
  673. width: 156rpx;
  674. height: 60rpx;
  675. background: #2671E2;
  676. border-radius: 4rpx;
  677. border: 1px solid #2671E2;
  678. text-align: center;
  679. line-height: 60rpx;
  680. margin-right: 22rpx;
  681. color: #FFFFFF;
  682. }
  683. .screen-record-nochose {
  684. width: 156rpx;
  685. height: 60rpx;
  686. background: #FFFFFF;
  687. border-radius: 4rpx;
  688. border: 1px solid #C9C9C9;
  689. text-align: center;
  690. line-height: 60rpx;
  691. margin-right: 22rpx;
  692. }
  693. }
  694. }
  695. .screen-foot {
  696. width: 100%;
  697. height: 100rpx;
  698. display: flex;
  699. .screen-foot-reset {
  700. width: 50%;
  701. text-align: center;
  702. height: 100rpx;
  703. line-height: 100rpx;
  704. font-size: 30rpx;
  705. font-weight: 400;
  706. color: #666666;
  707. }
  708. .screen-foot-sure {
  709. width: 50%;
  710. text-align: center;
  711. line-height: 100rpx;
  712. height: 100rpx;
  713. font-size: 30rpx;
  714. font-weight: 400;
  715. color: #FFFFFF;
  716. background: #2671E2;
  717. }
  718. }
  719. }
  720. </style>