AI销管
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

1179 lines
28 KiB

  1. <template>
  2. <view class="box">
  3. <view style="flex-shrink: 0;">
  4. <view class="search-box">
  5. <view class="search" @click="goSearch">
  6. <view class="search-img">
  7. <image class="search-img1" src="../../../static/images/search.png" mode=""></image>
  8. </view>
  9. <view class="search-text">输入客户姓名/手机号</view>
  10. </view>
  11. </view>
  12. </view>
  13. <!-- 选择器 -->
  14. <view class="boxtittab">
  15. <view class="tabbox" @click="tapsoltishow">
  16. {{ sortFilter }}
  17. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  18. </view>
  19. <view class="tabbox" @click="taptimeisshow">
  20. {{ arriveFilter }}
  21. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  22. </view>
  23. <view class="tabbox" @click="taptimetuisshow">
  24. {{ receptionDuration }}
  25. <u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  26. </view>
  27. <view class="tabbox" @click="screenshow">
  28. 更多筛选<u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  29. </view>
  30. </view>
  31. <!-- 筛选后的数量 -->
  32. <view class="count" v-if="recordList.length > 0">
  33. 筛选结果:<text>{{totalRecords}} </text>条
  34. </view>
  35. <view class="content">
  36. <view v-if="recordList.length==0" style="width: 100%;height: 100%;display: flex;align-items: center;">
  37. <view style="width: 100%;height: 100%;padding-top: 200rpx;">
  38. <view style="width: 100%;text-align: center;">
  39. <image style="width: 220rpx;height: 200rpx;"
  40. src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  41. </view>
  42. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  43. </view>
  44. </view>
  45. <view v-if="recordList.length!=0" class="content-tips" v-for="(item,index) in recordList" :key='index'
  46. @click="gotoDetail(item.id)">
  47. <view class="content-first">
  48. <view class="left">
  49. <template v-if="item.level > 0">
  50. <view class="img" :class="colorName[item.level]">{{ item.level | levelText }}</view>
  51. </template>
  52. <view class="test">{{item.name}}</view>
  53. <view v-if="item.clientStageName" class="clientStageName">{{ item.clientStageName }}</view>
  54. </view>
  55. <view class="right">
  56. {{item.fraction || '0'}}%
  57. <image class="right-img" src="../../../static/images/arrow-right.png" mode=""></image>
  58. </view>
  59. </view>
  60. <view class="content-sec">
  61. <view class="content-sec-lab">
  62. 客户手机:<view class="content-sec-lab1">{{item.phone | phoneText}}</view>
  63. </view>
  64. <view class="content-sec-lab">
  65. 负责顾问:<view class="content-sec-lab1">{{item.agentName || ''}}</view>
  66. </view>
  67. <view class="content-sec-lab" style="line-height: 46rpx;">
  68. 客户意向:
  69. <text v-if="item.demand.cusSemanticWordsList==null">暂无</text>
  70. <template v-else>
  71. <block v-for="(che,ind) in item.demand.cusSemanticWordsList" :key='ind'>
  72. <view class="content-sec-tips">{{che.name}}</view>
  73. </block>
  74. </template>
  75. </view>
  76. <view class="content-sec-lab">
  77. 添加时间:<view class="content-sec-lab1">{{item.createTime | formatTime}}</view>
  78. </view>
  79. <view class="content-sec-num">
  80. <view class="">{{item.visitRecord || '--'}}次到访 | {{item.mm || '0'}}<text
  81. style="font-size: 24rpx;">min</text></view>
  82. </view>
  83. </view>
  84. <template v-if="permissions.commonly2">
  85. <view class="content-last">
  86. <!-- <view class="content-last-tab">添加提醒</view>
  87. <view class="content-last-tab">拨打电话</view> -->
  88. <view class="content-last-tab" @click.stop="gotoFollowUp(item)">写跟进</view>
  89. </view>
  90. </template>
  91. </view>
  92. </view>
  93. <u-popup v-model="screenShow" mode="top">
  94. <view class="screen">
  95. <!-- 顾问选择 -->
  96. <view class="screen-counselor">
  97. <view class="screen-text">
  98. 所属顾问
  99. </view>
  100. <view class="screen-sel" @tap="selectshow = true">
  101. <input v-model="screen.agentIdtext" type="text" placeholder="请选择" class="screen-inp" disabled />
  102. <image class="screen-sel-img" src="../../../static/images/right.png" mode=""></image>
  103. </view>
  104. </view>
  105. <view class="screen-counselor">
  106. <view class="screen-text">
  107. 客户标签
  108. </view>
  109. <view class="screen-sel" @tap="selectTipshow = true">
  110. <input v-model="screen.cunsumerTips" type="text" placeholder="请选择" class="screen-inp"
  111. disabled />
  112. <image class="screen-sel-img" src="../../../static/images/right.png" mode=""></image>
  113. </view>
  114. </view>
  115. <!-- 录音标示 -->
  116. <view class="screen-record">
  117. <view class="screen-record-text">
  118. 客户等级
  119. </view>
  120. <view class="screen-record-tab">
  121. <block v-for="(item,index) in levelList" :key="index">
  122. <view :class="[item.isShow?'screen-record-chose':'screen-record-nochose']"
  123. @click="choiceLevel(index,item.value)">
  124. {{item.label}}
  125. </view>
  126. </block>
  127. </view>
  128. </view>
  129. <!-- 客户来源 -->
  130. <template v-if="list.length > 0">
  131. <view class="screen-record">
  132. <view class="screen-record-text">
  133. 客户来源
  134. </view>
  135. <view class="screen-record-tab">
  136. <block v-for="(item, index) in list" :key="index">
  137. <view @tap="sourceId = item.id; sourceIndex = index "
  138. :class="[sourceIndex == index ? 'screen-record-chose':'screen-record-nochose']">
  139. {{ item.sourceName }}
  140. </view>
  141. </block>
  142. </view>
  143. </view>
  144. </template>
  145. <view class="screen-record">
  146. <view class="screen-record-text">
  147. 到访次数
  148. </view>
  149. <view class="screen-record-tab">
  150. <block v-for="(item,index) in visitList" :key="index">
  151. <view :class="[item.isShow?'screen-record-chose':'screen-record-nochose']"
  152. @click="choice(index, item.value)">
  153. {{item.label}}
  154. </view>
  155. </block>
  156. <!-- <view :class="[screen.visitRecord==1?'screen-record-chose':'screen-record-nochose']"
  157. @click="screenvisitRecord(1)">
  158. 首次到访
  159. </view>
  160. <view :class="[screen.visitRecord==2?'screen-record-chose':'screen-record-nochose']"
  161. @click="screenvisitRecord(2)">
  162. 2次到访
  163. </view>
  164. <view :class="[screen.visitRecord==3?'screen-record-chose':'screen-record-nochose']"
  165. @click="screenvisitRecord(3)">
  166. 3次到访
  167. </view>
  168. <view :class="[screen.visitRecord==4?'screen-record-chose':'screen-record-nochose']"
  169. @click="screenvisitRecord(4)">
  170. 3次以上
  171. </view> -->
  172. </view>
  173. </view>
  174. <view class="screen-foot">
  175. <view class="screen-foot-reset" @click="reset">
  176. 重置
  177. </view>
  178. <view class="screen-foot-sure" @click="screensure">
  179. 确定
  180. </view>
  181. </view>
  182. </view>
  183. </u-popup>
  184. <!-- 选择顾问的选择框 -->
  185. <u-select v-model="selectshow" :list="freeList" @confirm="actionSelectCallback"></u-select>
  186. <!-- 客户标签 -->
  187. <u-select v-model="selectTipshow" :list="findKeywordsList" @confirm="selectCallback"></u-select>
  188. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  189. <u-popup v-model="timeshow" mode="bottom">
  190. <view class="timeview" :style="{ color: activeTotal == 5 ? '#2B6EFF' : '#333333' }"
  191. @click="tabtimetap(5, '到访时间')">
  192. 全部</view>
  193. <view class="timeview" :style="{ color: activeTotal == 0 ? '#2B6EFF' : '#333333' }"
  194. @click="tabtimetap(0, '今天')">
  195. 今天</view>
  196. <view class="timeview" :style="{ color: activeTotal == 1 ? '#2B6EFF' : '#333333' }"
  197. @click="tabtimetap(1, '昨天')">
  198. 昨天</view>
  199. <view class="timeview" :style="{ color: activeTotal == 2 ? '#2B6EFF' : '#333333' }"
  200. @click="tabtimetap(2, '近7天')">
  201. 近7天</view>
  202. <view class="timeview" :style="{ color: activeTotal == 3 ? '#2B6EFF' : '#333333' }"
  203. @click="tabtimetap(3, '近30天')">
  204. 近30天</view>
  205. <view class="timeview" :style="{ color: activeTotal == 4 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(4)">
  206. 自定义</view>
  207. </u-popup>
  208. <u-popup v-model="timetushow" mode="bottom">
  209. <view class="timeview" :style="{ color: activeTotal2 == 0 ? '#2B6EFF' : '#333333' }"
  210. @click="timetap(0, '接待时长')">全部
  211. </view>
  212. <view class="timeview" :style="{ color: activeTotal2 == 1 ? '#2B6EFF' : '#333333' }"
  213. @click="timetap(1, '0~15min')">
  214. 0~15min</view>
  215. <view class="timeview" :style="{ color: activeTotal2 == 2 ? '#2B6EFF' : '#333333' }"
  216. @click="timetap(2, '15~30min')">
  217. 15~30min</view>
  218. <view class="timeview" :style="{ color: activeTotal2 == 3 ? '#2B6EFF' : '#333333' }"
  219. @click="timetap(3, '30~60min')">
  220. 30~60min</view>
  221. <view class="timeview" :style="{ color: activeTotal2 == 4 ? '#2B6EFF' : '#333333' }"
  222. @click="timetap(4, '60~90min')">
  223. 60~90min</view>
  224. <view class="timeview" :style="{ color: activeTotal2 == 5 ? '#2B6EFF' : '#333333' }"
  225. @click="timetap(5, '90min以上')">
  226. 90min以上</view>
  227. </u-popup>
  228. <u-popup v-model="soltishow" mode="bottom">
  229. <view class="soltishow" @tap.stop @touchmove.stop>
  230. <block v-for="(item, index) in orderBylist" :key="index">
  231. <view class="soltishow-item" @click="selectCallback2(item)">
  232. {{ item.label }}
  233. </view>
  234. </block>
  235. </view>
  236. </u-popup>
  237. <!-- <u-select v-model="soltishow" :list="orderBylist" @confirm="selectCallback2"></u-select> -->
  238. <!-- 底部导航栏 -->
  239. <u-tabbar :mid-button="true" activeColor="#1296db" inactiveColor="#999999" v-model="current" :list="tabbarList">
  240. </u-tabbar>
  241. </view>
  242. </template>
  243. <script>
  244. import tabbarList from '@/utils/tabbar.js'
  245. let _this
  246. export default {
  247. data() {
  248. return {
  249. // tabbar配置项
  250. current: 1,
  251. tabbarList: tabbarList,
  252. //--- end --- tabbar配置项
  253. orderBylist: [{
  254. label: '创建时间倒序',
  255. value: '1'
  256. },
  257. {
  258. label: '创建时间正序',
  259. value: '2'
  260. },
  261. {
  262. label: '接待时间倒序',
  263. value: '3'
  264. },
  265. {
  266. label: '接待时间正序',
  267. value: '4'
  268. },
  269. {
  270. label: '执行率正序',
  271. value: '5'
  272. },
  273. {
  274. label: '执行率倒序',
  275. value: '6'
  276. },
  277. {
  278. label: '接访次数正序',
  279. value: '7'
  280. },
  281. {
  282. label: '接访次数倒序',
  283. value: '8'
  284. },
  285. ],
  286. value: '',
  287. screenShow: false,
  288. selectshow: false,
  289. selectTipshow: false,
  290. buildingID: '',
  291. screen: {
  292. agentId: '',
  293. agentIdtext: '',
  294. visitRecord: [],
  295. record: [],
  296. cunsumerTips: '',
  297. cunsumerTipsid: '',
  298. },
  299. stageList: ['未知', '到访', '意向', '定金', '成交'],
  300. recordList: [],
  301. nextPage: 1,
  302. totalRecord: '',
  303. totalRecords: '', // 总条数
  304. freeList: [],
  305. userInfo: {},
  306. findKeywordsList: [],
  307. isnorefresh: '',
  308. activeTotal: 5,
  309. activeTotal2: 0,
  310. totalTimeShow: false,
  311. timeshow: false,
  312. timetushow: false,
  313. soltishow: false,
  314. staTime: '',
  315. endtime: '',
  316. orderBy: '', // 排序的id
  317. permissions: {
  318. commonly1: false,
  319. commonly2: false
  320. },
  321. list: [], // 客户来源列表
  322. sourceId: '', // 选中的客户来源id
  323. sourceIndex: -1, // 选中项的下标
  324. // 不同等级之间的颜色
  325. colorName: [
  326. '', "A", "B", "C", "D"
  327. ],
  328. // 筛选文字展示
  329. sortFilter: '排序',
  330. arriveFilter: '到访时间',
  331. receptionDuration: '接待时长',
  332. visitList: [{
  333. label: '首次到访',
  334. value: 1,
  335. isShow: false,
  336. }, {
  337. label: '2次到访',
  338. value: 2,
  339. isShow: false,
  340. }, {
  341. label: '3次到访',
  342. value: 3,
  343. isShow: false,
  344. }, {
  345. label: '3次以上',
  346. value: 4,
  347. isShow: false,
  348. }, ],
  349. levelList: [{
  350. label: 'A',
  351. value: 1,
  352. isShow: false,
  353. }, {
  354. label: 'B',
  355. value: 2,
  356. isShow: false,
  357. }, {
  358. label: 'C',
  359. value: 3,
  360. isShow: false,
  361. }, {
  362. label: 'D',
  363. value: 4,
  364. isShow: false,
  365. }, ],
  366. isRefresh: false
  367. }
  368. },
  369. onLoad(options) {
  370. _this = this
  371. this.isnorefresh = 'refresh';
  372. this.userInfo = uni.getStorageSync("weapp_session_userInfo_data")
  373. console.log(this.userInfo.showPhoneStatus)
  374. if (this.isnorefresh == 'refresh') {
  375. this.buildingID = uni.getStorageSync('buildingID').id;
  376. this.nextPage = 1;
  377. this.recordList = []
  378. this.getFreeList()
  379. this.getfindKeywordsList()
  380. this.getFromSource();
  381. this.isRefresh = false;
  382. this.getMyCustom()
  383. }
  384. },
  385. onPullDownRefresh() {
  386. this.nextPage = 1;
  387. this.isRefresh = true;
  388. this.resetFilter()
  389. this.reset()
  390. this.getFreeList()
  391. this.getfindKeywordsList()
  392. this.getFromSource();
  393. this.getMyCustom();
  394. setTimeout(() => {
  395. uni.stopPullDownRefresh()
  396. }, 2000)
  397. },
  398. onShow() {
  399. let newmenulist = uni.getStorageSync('weapp_session_Menu_data');
  400. this.permissions.commonly1 = newmenulist.khgl_ck;
  401. this.permissions.commonly2 = newmenulist.khgl_gj;
  402. },
  403. onReachBottom() {
  404. if (this.totalRecord == this.nextPage) {
  405. uni.showToast({
  406. icon: 'none',
  407. title: '到底了',
  408. duration: 2000
  409. });
  410. return
  411. } else {
  412. this.isRefresh = false;
  413. this.nextPage += 1;
  414. this.getMyCustom();
  415. }
  416. },
  417. methods: {
  418. // 过滤
  419. resetFilter() {
  420. this.sortFilter = '排序';
  421. this.orderBy = null;
  422. this.arriveFilter = '到访时间';
  423. this.staTime = '';
  424. this.endtime = '';
  425. this.nextPage = 1;
  426. this.activeTotal = 5;
  427. this.recordList = [];
  428. this.receptionDuration = '接待时长';
  429. this.activeTotal2 = 0;
  430. },
  431. // 获取客户来源
  432. getFromSource() {
  433. this.$u.get('customer/findCustomerSourceList', {
  434. houseId: this.buildingID
  435. }).then(res => {
  436. console.log('我进来了')
  437. this.list = res
  438. })
  439. },
  440. tapsoltishow() {
  441. this.soltishow = true;
  442. },
  443. taptimetuisshow() {
  444. this.timetushow = true;
  445. },
  446. taptimeisshow() {
  447. this.timeshow = true;
  448. },
  449. //选择标签
  450. selectCallback2(e) {
  451. this.sortFilter = e.label;
  452. this.orderBy = e.value;
  453. this.nextPage = 1;
  454. this.recordList = [];
  455. this.soltishow = false
  456. this.isRefresh = false;
  457. this.getMyCustom();
  458. },
  459. //选择录音时长
  460. timetap(index, text) {
  461. if (text) this.receptionDuration = text
  462. this.timetushow = false;
  463. this.activeTotal2 = index;
  464. this.nextPage = 1;
  465. this.recordList = [];
  466. this.isRefresh = false;
  467. this.getMyCustom();
  468. },
  469. //时间选择
  470. tabtimetap(index, text) {
  471. this.timeshow = false;
  472. if (text) this.arriveFilter = text
  473. if (index == 4) {
  474. this.totalTimeShow = true;
  475. } else {
  476. this.activeTotal = index;
  477. this.staTime = '';
  478. this.endtime = '';
  479. this.nextPage = 1;
  480. this.isRefresh = false;
  481. this.recordList = [];
  482. this.getMyCustom();
  483. }
  484. },
  485. //自定义时间
  486. totalTimeChange(e) {
  487. this.staTime = e.startDate;
  488. this.endtime = e.endDate;
  489. this.activeTotal = 4;
  490. this.nextPage = 1;
  491. this.recordList = [];
  492. this.isRefresh = false;
  493. this.getMyCustom();
  494. },
  495. recordclick(i) {
  496. if (this.screen.record == i) {
  497. this.screen.record = null
  498. } else {
  499. this.screen.record = i
  500. }
  501. },
  502. choice(index, e) {
  503. if (this.visitList[index].isShow == true) {
  504. this.visitList[index].isShow = false;
  505. for (var i = 0; i < this.screen.visitRecord.length; i++) {
  506. if (this.screen.visitRecord[i] === e) {
  507. this.screen.visitRecord.splice(i, 1);
  508. }
  509. }
  510. } else {
  511. this.visitList[index].isShow = true;
  512. console.log(this.screen)
  513. this.screen.visitRecord.push(e)
  514. }
  515. },
  516. choiceLevel(index, e) {
  517. if (this.levelList[index].isShow == true) {
  518. this.levelList[index].isShow = false;
  519. for (var i = 0; i < this.screen.record.length; i++) {
  520. if (this.screen.record[i] === e) {
  521. this.screen.record.splice(i, 1);
  522. }
  523. }
  524. } else {
  525. this.levelList[index].isShow = true;
  526. this.screen.record.push(e)
  527. }
  528. },
  529. screenvisitRecord(i) {
  530. if (this.screen.visitRecord == i) {
  531. this.screen.visitRecord = ''
  532. } else {
  533. this.screen.visitRecord = i
  534. }
  535. },
  536. // 客户详情
  537. gotoDetail(id) {
  538. if (this.permissions.commonly1 == true) {
  539. uni.navigateTo({
  540. url: `/pages/center/consumer/consumerDetail?id=${id}`
  541. })
  542. }
  543. },
  544. getMyCustom() {
  545. let dateType = 0;
  546. let recDurationInterval = 0;
  547. let orderBy = 0;
  548. if (this.activeTotal == 5) {
  549. dateType = null;
  550. } else if (this.activeTotal == 4) {
  551. dateType = null;
  552. } else {
  553. dateType = this.activeTotal;
  554. }
  555. if (this.activeTotal2 == 0) {
  556. recDurationInterval = null
  557. } else {
  558. recDurationInterval = this.activeTotal2
  559. }
  560. if (this.orderBy == 0) {
  561. orderBy = null;
  562. } else {
  563. orderBy = this.orderBy;
  564. }
  565. var parames = {
  566. pageNum: this.nextPage,
  567. pageSize: 10,
  568. query: {
  569. projectId: this.buildingID,
  570. keywordsId: this.screen.cunsumerTipsid,
  571. agentId: this.screen.agentId,
  572. dateType: dateType,
  573. staDate: this.staTime,
  574. endDate: this.endtime,
  575. recDurationInterval: recDurationInterval,
  576. orderBy: orderBy,
  577. sourceId: this.sourceId
  578. }
  579. };
  580. console.log(this.screen.visitRecord)
  581. if (this.screen.visitRecord.length > 0) {
  582. parames.query.visitRecords = this.screen.visitRecord.join(',');
  583. }
  584. if (this.screen.record.length > 0) {
  585. parames.query.level = this.screen.record.join(',');
  586. }
  587. this.$u.post("/customer/customerManagement", parames).then(data => {
  588. if (this.staTime && this.endtime) {
  589. this.receptionDuration = `${this.staTime}-${this.endtime}`
  590. }
  591. var list = data.results || [];
  592. console.log(list)
  593. list.forEach(item => {
  594. if (item.demand.cusSemanticWordsList != null) {
  595. item.demand.cusSemanticWordsList.forEach(che => {
  596. if (che.isInterval == 0) {
  597. che.name = che.name + che.unit + '-' + che.endName + che.unit;
  598. }
  599. })
  600. }
  601. })
  602. if (this.isRefresh) {
  603. this.recordList = list;
  604. } else {
  605. this.recordList = [...this.recordList, ...list];
  606. }
  607. this.totalRecord = data.totalPage;
  608. this.totalRecords = data.totalRecord;
  609. })
  610. },
  611. //获取顾问列表
  612. getFreeList() {
  613. this.freeList = []
  614. this.$u.post("/cusLvStatistics/selectAllAccountIdByHouseId", {
  615. houseId: this.buildingID
  616. }).then(res => {
  617. this.freeList = res;
  618. this.freeList.forEach(item => {
  619. item.label = item.name;
  620. item.value = item.accountId
  621. })
  622. })
  623. },
  624. //获取客户标签
  625. getfindKeywordsList() {
  626. this.findKeywordsList = []
  627. this.$u.post("/customer/findKeywords", {
  628. houseId: this.buildingID
  629. }).then(res => {
  630. res.forEach(item => {
  631. if (item.isInterval == 0) {
  632. item.label = item.name + item.unit + '-' + item.endName + item.unit;
  633. } else {
  634. item.label = item.name
  635. }
  636. item.value = item.id;
  637. })
  638. this.findKeywordsList = res;
  639. })
  640. },
  641. // 筛选
  642. screenshow() {
  643. this.screenShow = true
  644. },
  645. //选择顾问
  646. actionSelectCallback(e) {
  647. this.screen.agentId = e[0].value;
  648. this.screen.agentIdtext = e[0].label;
  649. },
  650. //选择标签
  651. selectCallback(e) {
  652. this.screen.cunsumerTips = e[0].label;
  653. this.screen.cunsumerTipsid = e[0].value;
  654. },
  655. //重置
  656. reset() {
  657. this.screen = {
  658. agentId: '',
  659. agentIdtext: '',
  660. visitRecord: [],
  661. record: [],
  662. cunsumerTips: '',
  663. cunsumerTipsid: '',
  664. level: ''
  665. }
  666. this.visitList.map(i => {
  667. i.isShow = false
  668. })
  669. this.levelList.map(i => {
  670. i.isShow = false
  671. })
  672. this.nextPage = 1;
  673. this.recordList = [];
  674. this.sourceId = '';
  675. this.sourceIndex = -1;
  676. this.isRefresh = false;
  677. this.getMyCustom();
  678. },
  679. //筛选确认
  680. screensure() {
  681. this.nextPage = 1;
  682. this.recordList = [];
  683. this.screenShow = false;
  684. this.isRefresh = false;
  685. this.getMyCustom();
  686. },
  687. goSearch() {
  688. uni.navigateTo({
  689. url: '/pages/center/consumer/consumerSearch'
  690. });
  691. },
  692. gotoFollowUp(item) {
  693. uni.navigateTo({
  694. url: `/pages/center/consumer/newFollowup/newFollowup?id=${item.id}&level=${item.level}&clientStageName=${item.clientStageName}`
  695. })
  696. },
  697. },
  698. filters: {
  699. // 筛选等级展示文字
  700. levelText(level) {
  701. let str = '';
  702. switch (Number(level)) {
  703. case 1:
  704. str = "A"
  705. break;
  706. case 2:
  707. str = "B"
  708. break;
  709. case 3:
  710. str = "C"
  711. break;
  712. case 4:
  713. str = "D"
  714. break;
  715. default:
  716. str = ''
  717. break;
  718. }
  719. return str
  720. },
  721. // 加密手机
  722. phoneText(mobile) {
  723. if (!mobile) return '--'
  724. if (_this.userInfo.showPhoneStatus == 1) return mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
  725. else return mobile
  726. },
  727. // 格式化时间
  728. formatTime(time) {
  729. if (!time) return
  730. return time.substring(5, time.length)
  731. }
  732. }
  733. }
  734. </script>
  735. <style lang="scss" scoped>
  736. .box {
  737. width: 100vw;
  738. min-height: calc(100vh - var(--window-top));
  739. background: #F8F8F8;
  740. display: flex;
  741. flex-direction: column;
  742. .content {
  743. flex-grow: 1;
  744. }
  745. }
  746. .timeview {
  747. height: 80rpx;
  748. line-height: 80rpx;
  749. width: 100%;
  750. text-align: center;
  751. border-bottom: 1px solid #F8F8F8;
  752. }
  753. //时间切换的样式
  754. .boxtittab {
  755. position: sticky;
  756. top: var(--window-top);
  757. z-index: 999;
  758. width: 100;
  759. height: 92rpx;
  760. background: #FFFFFF;
  761. border: 1px solid #E0E0E0;
  762. flex-shrink: 0;
  763. display: flex;
  764. align-items: center;
  765. .tabbox {
  766. flex: 1;
  767. height: 100%;
  768. text-align: center;
  769. line-height: 92rpx;
  770. color: #666666;
  771. font-size: 28rpx;
  772. overflow: hidden;
  773. text-overflow: ellipsis;
  774. display: -webkit-box;
  775. /* 将对象作为弹性伸缩盒子模型显示 */
  776. -webkit-line-clamp: 1;
  777. /* 控制最多显示几行 */
  778. -webkit-box-orient: vertical;
  779. /* 设置或检索伸缩盒对象的子元素的排列方式 */
  780. }
  781. }
  782. .soltishow {
  783. width: 100%;
  784. min-height: 40vh;
  785. .soltishow-item {
  786. width: 100%;
  787. height: 80rpx;
  788. display: flex;
  789. align-items: center;
  790. justify-content: center;
  791. }
  792. }
  793. .search-box {
  794. width: 100%;
  795. height: 102rpx;
  796. background: #FFFFFF;
  797. display: flex;
  798. align-items: center;
  799. justify-content: center;
  800. .search {
  801. width: 94%;
  802. height: 70rpx;
  803. display: flex;
  804. align-items: center;
  805. background: #F8F8F8;
  806. border-radius: 33rpx;
  807. .search-img {
  808. width: 26rpx;
  809. height: 30rpx;
  810. margin-left: 20rpx;
  811. .search-img1 {
  812. width: 100%;
  813. height: 100%;
  814. margin-top: 2rpx;
  815. }
  816. }
  817. .search-text {
  818. font-size: 28rpx;
  819. font-weight: 400;
  820. color: #999999;
  821. margin-left: 10rpx;
  822. }
  823. }
  824. .search-screen {
  825. width: 40rpx;
  826. height: 40rpx;
  827. margin-left: 30rpx;
  828. .search-screen1 {
  829. width: 100%;
  830. height: 100%;
  831. }
  832. }
  833. }
  834. .count {
  835. width: 100%;
  836. height: 90rpx;
  837. display: flex;
  838. align-items: center;
  839. justify-content: center;
  840. background-color: #FBE4E4;
  841. text {
  842. color: #F71616;
  843. }
  844. }
  845. .content {
  846. .content-tips {
  847. background: #fff;
  848. margin-top: 20rpx;
  849. .content-first {
  850. padding: 19rpx 30rpx;
  851. display: flex;
  852. justify-content: space-between;
  853. align-items: center;
  854. box-sizing: border-box;
  855. color: #292929;
  856. height: 90rpx;
  857. font-size: 30rpx;
  858. .left {
  859. display: flex;
  860. align-items: center;
  861. .img {
  862. width: 52rpx;
  863. height: 52rpx;
  864. border: 1px solid #E0E0E0;
  865. border-radius: 50%;
  866. margin-right: 20rpx;
  867. display: flex;
  868. align-items: center;
  869. justify-content: center;
  870. }
  871. .clientStageName {
  872. margin-left: 20rpx;
  873. padding: 5rpx 20rpx;
  874. border: 1px solid #F29819;
  875. border-radius: 32rpx 32rpx 32rpx 0;
  876. color: #F29819;
  877. font-size: 20rpx;
  878. }
  879. // '#19AC09', '#F29819', '#F2D01A', '#1396F6',
  880. .A {
  881. color: #FFF;
  882. background: #19AC09;
  883. border: 1px solid #19AC09;
  884. }
  885. .B {
  886. color: #FFF;
  887. background: #F29819;
  888. border: 1px solid #F29819;
  889. }
  890. .C {
  891. color: #FFF;
  892. background: #F2D01A;
  893. border: 1px solid #F2D01A;
  894. }
  895. .D {
  896. color: #FFF;
  897. background: #1396F6;
  898. border: 1px solid #1396F6;
  899. }
  900. .test {
  901. font-weight: 500;
  902. color: #333333;
  903. }
  904. }
  905. .right {
  906. display: flex;
  907. align-items: center;
  908. color: #2671E2;
  909. font-size: 30rpx;
  910. .right-img {
  911. margin: 5rpx 0 0 10rpx;
  912. width: 14rpx;
  913. height: 30rpx;
  914. }
  915. }
  916. }
  917. .content-sec {
  918. border-top: 1px solid #E0E0E0;
  919. padding: 0 30rpx;
  920. padding-bottom: 30rpx;
  921. position: relative;
  922. .content-sec-lab {
  923. margin-top: 30rpx;
  924. display: flex;
  925. font-size: 30rpx;
  926. font-weight: 400;
  927. color: #666666;
  928. line-height: 46rpx;
  929. .content-sec-lab1 {
  930. color: #333333;
  931. }
  932. .content-sec-tips {
  933. max-width: 160rpx;
  934. height: 46rpx;
  935. background: #F2F2F2;
  936. border-radius: 6rpx;
  937. text-align: center;
  938. line-height: 26rpx;
  939. overflow: hidden;
  940. text-overflow: ellipsis;
  941. white-space: nowrap;
  942. font-size: 26rpx;
  943. font-weight: 400;
  944. color: #333333;
  945. margin-right: 20rpx;
  946. box-sizing: border-box;
  947. padding: 10rpx 24rpx;
  948. }
  949. }
  950. .content-sec-num {
  951. position: absolute;
  952. bottom: 25rpx;
  953. right: 30rpx;
  954. padding: 3rpx 12rpx;
  955. background: #F4F8FD;
  956. border-radius: 6rpx;
  957. color: #2671E2;
  958. line-height: 45rpx;
  959. text-align: center;
  960. }
  961. }
  962. .content-last {
  963. height: 108rpx;
  964. display: flex;
  965. justify-content: flex-end;
  966. align-items: center;
  967. border-top: 1px solid #E0E0E0;
  968. .content-last-tab {
  969. margin-right: 30rpx;
  970. width: 156rpx;
  971. height: 60rpx;
  972. font-size: 30rpx;
  973. color: #333333;
  974. border-radius: 30rpx;
  975. border: 1px solid #999999;
  976. display: flex;
  977. align-items: center;
  978. justify-content: center;
  979. }
  980. }
  981. }
  982. }
  983. // 这是弹出层
  984. .screen {
  985. // box-sizing: border-box;
  986. // padding: 0 30rpx;
  987. .screen-counselor {
  988. display: flex;
  989. height: 106rpx;
  990. // padding: 40rpx 30rpx 36rpx 30rpx;
  991. padding: 0 30rpx;
  992. box-sizing: border-box;
  993. border-bottom: 1px solid #E0E0E0;
  994. .screen-text {
  995. flex-shrink: 0;
  996. margin: 40rpx 0 36rpx 0;
  997. font-size: 30rpx;
  998. font-weight: 400;
  999. color: #333333;
  1000. line-height: 30rpx;
  1001. }
  1002. .screen-sel {
  1003. flex-grow: 1;
  1004. display: flex;
  1005. justify-content: flex-end;
  1006. align-items: center;
  1007. margin-left: 60rpx;
  1008. .screen-sel-img {
  1009. flex-shrink: 0;
  1010. margin: 40rpx 0 36rpx 0;
  1011. width: 14rpx;
  1012. height: 30rpx;
  1013. }
  1014. .screen-inp {
  1015. padding: 0 20rpx;
  1016. text-align: right;
  1017. }
  1018. }
  1019. }
  1020. .screen-record {
  1021. height: 192rpx;
  1022. // width: 100%;
  1023. overflow: hidden;
  1024. padding: 0 30rpx;
  1025. box-sizing: border-box;
  1026. border-bottom: 1px solid #E0E0E0;
  1027. .screen-record-text {
  1028. margin-top: 36rpx;
  1029. font-size: 30rpx;
  1030. font-weight: 400;
  1031. color: #333333;
  1032. line-height: 30rpx;
  1033. }
  1034. .screen-record-tab {
  1035. margin-top: 30rpx;
  1036. display: flex;
  1037. // justify-content: space-around;
  1038. .screen-record-chose {
  1039. width: 156rpx;
  1040. height: 60rpx;
  1041. background: #2671E2;
  1042. border-radius: 4rpx;
  1043. border: 1px solid #2671E2;
  1044. text-align: center;
  1045. line-height: 60rpx;
  1046. margin-right: 22rpx;
  1047. color: #FFFFFF;
  1048. }
  1049. .screen-record-nochose {
  1050. width: 156rpx;
  1051. height: 60rpx;
  1052. background: #FFFFFF;
  1053. border-radius: 4rpx;
  1054. border: 1px solid #C9C9C9;
  1055. text-align: center;
  1056. line-height: 60rpx;
  1057. margin-right: 22rpx;
  1058. }
  1059. }
  1060. }
  1061. .screen-foot {
  1062. width: 100%;
  1063. height: 88rpx;
  1064. display: flex;
  1065. .screen-foot-reset {
  1066. width: 50%;
  1067. text-align: center;
  1068. height: 88rpx;
  1069. line-height: 88rpx;
  1070. font-size: 30rpx;
  1071. font-weight: 400;
  1072. color: #666666;
  1073. }
  1074. .screen-foot-sure {
  1075. width: 50%;
  1076. text-align: center;
  1077. line-height: 88rpx;
  1078. height: 88rpx;
  1079. font-size: 30rpx;
  1080. font-weight: 400;
  1081. color: #FFFFFF;
  1082. background: #2671E2;
  1083. }
  1084. }
  1085. }
  1086. </style>