AI营销辅助 普强使用
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ů.
 
 
 

900 řádky
24 KiB

  1. <template>
  2. <view class="box">
  3. <view>
  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="taptimeisshow">
  16. 接待时间<u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  17. </view>
  18. <view class="tabbox" @click="taptimetuisshow">
  19. 接待时长<u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  20. </view>
  21. <view class="tabbox" @click="tapsoltishow">
  22. 排序<u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  23. </view>
  24. <view class="tabbox" @click="screenshow">
  25. 更多筛选<u-icon name="arrow-down" size="24" style="padding-left: 12rpx;"></u-icon>
  26. </view>
  27. </view>
  28. <view class="count" v-if="recordList.length > 0">
  29. 筛选结果:<text>{{totalRecords}} </text>条
  30. </view>
  31. <view class="content">
  32. <view v-if="recordList.length==0" style="width: 100%;height: 100%;display: flex;align-items: center;">
  33. <view style="width: 100%;padding-top: 200rpx;background: #FFFFFF;">
  34. <view style="width: 100%;text-align: center;">
  35. <image style="width: 220rpx;height: 200rpx;" src="https://static.pachira.cn/zhikong_xcx_img/nodatalist.png" mode=""></image>
  36. </view>
  37. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  38. </view>
  39. </view>
  40. <view v-if="recordList.length!=0" class="content-tips" v-for="(item,index) in recordList" :key='index' @click="gotoDetail(item.id)">
  41. <view class="content-first">
  42. <view class="left">
  43. <view v-if="item.level.length==0"></view>
  44. <view class="img" v-else-if="item.level==1">A</view>
  45. <view class="img" v-else-if="item.level==2">B</view>
  46. <view class="img" v-else-if="item.level==3">C</view>
  47. <view class="img" v-else-if="item.level==4">D</view>
  48. <view class="test">{{item.name}}</view>
  49. </view>
  50. <!-- <view class="right">
  51. <view class="point"></view>
  52. <view class="test">定金</view>
  53. </view> -->
  54. </view>
  55. <view class="content-sec">
  56. <view class="content-sec-lab">
  57. 手机号码:<view class="content-sec-lab1">{{item.phone || '--'}}</view>
  58. </view>
  59. <view class="content-sec-lab" style="line-height: 46rpx;">
  60. 客户标签:
  61. <text v-if="item.demand.cusSemanticWordsList==null">暂无</text>
  62. <view v-else class="content-sec-tips" v-for="(che,ind) in item.demand.cusSemanticWordsList" :key='ind'>{{che.name}}</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">
  68. 添加时间:<view class="content-sec-lab1">{{item.createTime}}</view>
  69. </view>
  70. <view class="content-sec-num">
  71. <view class="">{{item.visitRecord || '--'}}次到访</view>
  72. <view class="">{{item.fraction || '0'}}% | {{item.mm || '0'}}<text style="font-size: 24rpx;">min</text></view>
  73. </view>
  74. </view>
  75. <view class="content-last" v-if="item.isshow==true">
  76. <!-- <view class="content-last-tab">添加提醒</view>
  77. <view class="content-last-tab">拨打电话</view> -->
  78. <view class="content-last-tab" @click.stop="gotoFollowUp(item.id)">写跟进</view>
  79. </view>
  80. </view>
  81. </view>
  82. <u-popup v-model="screenShow" mode="top" >
  83. <view class="screen">
  84. <!-- 顾问选择 -->
  85. <view class="screen-counselor">
  86. <view class="screen-text">
  87. 所属顾问
  88. </view>
  89. <view class="screen-sel" @click="selectshow = true">
  90. <u-input v-model="screen.agentIdtext" type="text" placeholder='请选择' class="screen-inp" disabled />
  91. <image class="screen-sel-img" src="../../../static/images/right.png" mode=""></image>
  92. </view>
  93. </view>
  94. <view class="screen-counselor">
  95. <view class="screen-text">
  96. 客户标签
  97. </view>
  98. <view class="screen-sel" @click="selectTipshow = true">
  99. <u-input v-model="screen.cunsumerTips" type="text" placeholder='请选择' class="screen-inp" disabled />
  100. <image class="screen-sel-img" src="../../../static/images/right.png" mode=""></image>
  101. </view>
  102. </view>
  103. <!-- 录音标示 -->
  104. <view class="screen-record">
  105. <view class="screen-record-text">
  106. 客户等级
  107. </view>
  108. <view class="screen-record-tab">
  109. <block v-for="(item,index) in levelList" :key="index">
  110. <view :class="[item.isShow?'screen-record-chose':'screen-record-nochose']"
  111. @click="choiceLevel(index,item.value)">
  112. {{item.label}}
  113. </view>
  114. </block>
  115. <!-- <view :class="[screen.record==0?'screen-record-chose':'screen-record-nochose']" @click="recordclick(0)">
  116. A
  117. </view>
  118. <view :class="[screen.record==1?'screen-record-chose':'screen-record-nochose']" @click="recordclick(1)">
  119. B
  120. </view>
  121. <view :class="[screen.record==2?'screen-record-chose':'screen-record-nochose']" @click="recordclick(2)">
  122. C
  123. </view>
  124. <view :class="[screen.record==3?'screen-record-chose':'screen-record-nochose']" @click="recordclick(3)">
  125. D
  126. </view> -->
  127. </view>
  128. </view>
  129. <!-- <view class="screen-record">
  130. <view class="screen-record-text">
  131. 客户阶段
  132. </view>
  133. <view class="screen-record-tab">
  134. <view v-for="(item,index) in stageList" :key="index">
  135. <view :class="[screen.stage==index?'screen-record-chose':'screen-record-nochose']" @click="screen.stage=index" style="width: 120rpx;">
  136. {{item}}
  137. </view>
  138. </view>
  139. </view>
  140. </view> -->
  141. <view class="screen-record">
  142. <view class="screen-record-text">
  143. 到访次数
  144. </view>
  145. <view class="screen-record-tab">
  146. <block v-for="(item,index) in visitList" :key="index">
  147. <view :class="[item.isShow?'screen-record-chose':'screen-record-nochose']"
  148. @click="choice(index,item.value)">
  149. {{item.label}}
  150. </view>
  151. </block>
  152. <!-- <view :class="[screen.visitRecord==1?'screen-record-chose':'screen-record-nochose']" @click="screenvisitRecord(1)">
  153. 首次到访
  154. </view>
  155. <view :class="[screen.visitRecord==2?'screen-record-chose':'screen-record-nochose']" @click="screenvisitRecord(2)">
  156. 2次到访
  157. </view>
  158. <view :class="[screen.visitRecord==3?'screen-record-chose':'screen-record-nochose']" @click="screenvisitRecord(3)">
  159. 3次到访
  160. </view>
  161. <view :class="[screen.visitRecord==4?'screen-record-chose':'screen-record-nochose']" @click="screenvisitRecord(4)">
  162. 3次以上
  163. </view> -->
  164. </view>
  165. </view>
  166. <view class="screen-foot">
  167. <view class="screen-foot-reset" @click="reset">
  168. 重置
  169. </view>
  170. <view class="screen-foot-sure" @click="screensure">
  171. 确定
  172. </view>
  173. </view>
  174. </view>
  175. </u-popup>
  176. <!-- 选择顾问的选择框 -->
  177. <u-select v-model="selectshow" :list="freeList" @confirm="actionSelectCallback"></u-select>
  178. <!-- 客户标签 -->
  179. <u-select v-model="selectTipshow" :list="findKeywordsList" @confirm="selectCallback"></u-select>
  180. <u-calendar v-model="totalTimeShow" mode="range" @change="totalTimeChange"></u-calendar>
  181. <u-popup v-model="timeshow" mode="bottom">
  182. <view class="timeview" :style="{ color: activeTotal == 5 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(5)">全部</view>
  183. <view class="timeview" :style="{ color: activeTotal == 0 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(0)">今天</view>
  184. <view class="timeview" :style="{ color: activeTotal == 1 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(1)">昨天</view>
  185. <view class="timeview" :style="{ color: activeTotal == 2 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(2)">近7天</view>
  186. <view class="timeview" :style="{ color: activeTotal == 3 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(3)">近30天</view>
  187. <view class="timeview" :style="{ color: activeTotal == 4 ? '#2B6EFF' : '#333333' }" @click="tabtimetap(4)">自定义</view>
  188. </u-popup>
  189. <u-popup v-model="timetushow" mode="bottom">
  190. <view class="timeview" :style="{ color: activeTotal2 == 0 ? '#2B6EFF' : '#333333' }" @click="timetap(0)">全部</view>
  191. <view class="timeview" :style="{ color: activeTotal2 == 1 ? '#2B6EFF' : '#333333' }" @click="timetap(1)">0~15min</view>
  192. <view class="timeview" :style="{ color: activeTotal2 == 2 ? '#2B6EFF' : '#333333' }" @click="timetap(2)">15~30min</view>
  193. <view class="timeview" :style="{ color: activeTotal2 == 3 ? '#2B6EFF' : '#333333' }" @click="timetap(3)">30~60min</view>
  194. <view class="timeview" :style="{ color: activeTotal2 == 4 ? '#2B6EFF' : '#333333' }" @click="timetap(4)">60~90min</view>
  195. <view class="timeview" :style="{ color: activeTotal2 == 5 ? '#2B6EFF' : '#333333' }" @click="timetap(5)">90min以上</view>
  196. </u-popup>
  197. <u-select v-model="soltishow" :list="orderBylist" @confirm="selectCallback2"></u-select>
  198. </view>
  199. </template>
  200. <script>
  201. export default{
  202. data(){
  203. return{
  204. orderBylist:[
  205. {label:'全部',value:'0'},
  206. {label:'创建时间倒序',value:'1'},
  207. {label:'创建时间正序',value:'2'},
  208. {label:'接待时间倒序',value:'3'},
  209. {label:'接待时间正序',value:'4'},
  210. {label:'执行率正序',value:'5'},
  211. {label:'执行率倒序',value:'6'},
  212. {label:'接访次数正序',value:'7'},
  213. {label:'接访次数倒序',value:'8'},
  214. ],
  215. value:'',
  216. screenShow:false,
  217. selectshow:false,
  218. selectTipshow:false,
  219. buildingID:'',
  220. screen:{
  221. agentId:'',
  222. agentIdtext:'',
  223. visitRecord:[],
  224. record:[],
  225. cunsumerTips:'',
  226. cunsumerTipsid:''
  227. },
  228. stageList:['未知','到访','意向','定金','成交'],
  229. recordList:[],
  230. nextPage:1,
  231. totalRecord:'',
  232. freeList:[],
  233. userInfo:{},
  234. findKeywordsList:[],
  235. isnorefresh:'',
  236. activeTotal:5,
  237. activeTotal2:0,
  238. totalTimeShow: false,
  239. timeshow:false,
  240. timetushow:false,
  241. soltishow:false,
  242. staTime:'',
  243. endtime:'',
  244. orderBy:'',
  245. totalRecords:'',
  246. visitList: [{
  247. label: '首次到访',
  248. value: 1,
  249. isShow: false,
  250. }, {
  251. label: '2次到访',
  252. value: 2,
  253. isShow: false,
  254. }, {
  255. label: '3次到访',
  256. value: 3,
  257. isShow: false,
  258. }, {
  259. label: '3次以上',
  260. value: 4,
  261. isShow: false,
  262. }, ],
  263. levelList: [{
  264. label: 'A',
  265. value: 0,
  266. isShow: false,
  267. }, {
  268. label: 'B',
  269. value: 1,
  270. isShow: false,
  271. }, {
  272. label: 'C',
  273. value: 2,
  274. isShow: false,
  275. }, {
  276. label: 'D',
  277. value: 3,
  278. isShow: false,
  279. }, ],
  280. isRefresh:false
  281. }
  282. },
  283. onLoad(options) {
  284. this.isnorefresh=options.refresh;
  285. },
  286. onShow() {
  287. if(this.isnorefresh=='refresh'){
  288. this.buildingID = uni.getStorageSync('buildingID').id;
  289. this.nextPage=1;
  290. this.recordList=[]
  291. this.isRefresh = false;
  292. this.getMyCustom()
  293. this.getFreeList()
  294. this.getfindKeywordsList()
  295. this.isnorefresh='';
  296. }
  297. },
  298. onReachBottom() {
  299. if(this.totalRecord==this.nextPage){
  300. uni.showToast({
  301. icon:'none',
  302. title: '到底了',
  303. duration: 2000
  304. });
  305. return
  306. }else{
  307. this.nextPage+=1;
  308. this.isRefresh = false;
  309. this.getMyCustom();
  310. }
  311. },
  312. onPullDownRefresh(){
  313. this.isRefresh = true;
  314. this.nextPage = 1;
  315. this.getMyCustom()
  316. setTimeout(function () {
  317. uni.stopPullDownRefresh();
  318. }, 1000);
  319. },
  320. methods:{
  321. choice(index,e) {
  322. if (this.visitList[index].isShow == true) {
  323. this.visitList[index].isShow = false;
  324. for (var i = 0; i < this.screen.visitRecord.length; i++) {
  325. if (this.screen.visitRecord[i] === e) {
  326. this.screen.visitRecord.splice(i, 1);
  327. }
  328. }
  329. } else {
  330. this.visitList[index].isShow = true;
  331. this.screen.visitRecord.push(e)
  332. }
  333. },
  334. choiceLevel(index,e) {
  335. if (this.levelList[index].isShow == true) {
  336. this.levelList[index].isShow = false;
  337. for (var i = 0; i < this.screen.record.length; i++) {
  338. if (this.screen.record[i] === e) {
  339. this.screen.record.splice(i, 1);
  340. }
  341. }
  342. } else {
  343. this.levelList[index].isShow = true;
  344. this.screen.record.push(e)
  345. }
  346. },
  347. tapsoltishow(){
  348. this.soltishow=true;
  349. },
  350. taptimetuisshow(){
  351. this.timetushow=true;
  352. },
  353. taptimeisshow(){
  354. this.timeshow=true;
  355. },
  356. //选择标签
  357. selectCallback2(e){
  358. this.orderBy=e[0].value;
  359. this.nextPage=1;
  360. this.isRefresh = false;
  361. this.recordList=[];
  362. this.getMyCustom();
  363. },
  364. //选择录音时长
  365. timetap(index){
  366. this.timetushow=false;
  367. this.activeTotal2=index;
  368. this.nextPage=1;
  369. this.isRefresh = false;
  370. this.recordList=[];
  371. this.getMyCustom();
  372. },
  373. //时间选择
  374. tabtimetap(index){
  375. this.timeshow=false;
  376. if (index == 4) {
  377. this.totalTimeShow = true;
  378. } else {
  379. this.activeTotal = index;
  380. this.staTime='';
  381. this.endtime='';
  382. this.nextPage=1;
  383. this.isRefresh = false;
  384. this.recordList=[];
  385. this.getMyCustom();
  386. }
  387. },
  388. //自定义时间
  389. totalTimeChange(e) {
  390. this.staTime=e.startDate;
  391. this.endtime=e.endDate;
  392. this.activeTotal=4;
  393. this.nextPage=1;
  394. this.recordList=[];
  395. this.isRefresh = false;
  396. this.getMyCustom();
  397. },
  398. recordclick(i){
  399. if(this.screen.record==i){
  400. this.screen.record=null
  401. }else{
  402. this.screen.record=i
  403. }
  404. },
  405. screenvisitRecord(i){
  406. if(this.screen.visitRecord==i){
  407. this.screen.visitRecord=''
  408. }else{
  409. this.screen.visitRecord=i
  410. }
  411. },
  412. // 客户详情
  413. gotoDetail(id) {
  414. uni.navigateTo({
  415. url: `/pages/center/consumer/consumerDetail?id=${id}`
  416. })
  417. },
  418. getMyCustom(){
  419. let dateType=0;
  420. let recDurationInterval=0;
  421. let orderBy=0;
  422. if(this.activeTotal==5){
  423. dateType=null;
  424. }else if(this.activeTotal==4){
  425. dateType=null;
  426. }else{
  427. dateType=this.activeTotal;
  428. }
  429. if(this.activeTotal2==0){
  430. recDurationInterval=null
  431. }else{
  432. recDurationInterval=this.activeTotal2
  433. }
  434. if(this.orderBy==0){
  435. orderBy=null;
  436. }else{
  437. orderBy=this.orderBy;
  438. }
  439. var parames = {
  440. pageNum: this.nextPage,
  441. pageSize: 10,
  442. query: {
  443. projectId:this.buildingID,
  444. keywordsId:this.screen.cunsumerTipsid,
  445. agentId:this.screen.agentId,
  446. dateType:dateType,
  447. staTime:this.staTime,
  448. endtime:this.endtime,
  449. recDurationInterval:recDurationInterval,
  450. orderBy:orderBy
  451. }
  452. };
  453. if (this.screen.visitRecord.length > 0) {
  454. parames.query.visitRecords = this.screen.visitRecord.join(',');
  455. }
  456. if (this.screen.record.length > 0) {
  457. parames.query.level = this.screen.record.join(',');
  458. }
  459. // if(this.screen.record==0){
  460. // parames.query.levels= ["1"]
  461. // }else if(this.screen.record==1){
  462. // parames.query.levels= ["2"]
  463. // }else if(this.screen.record==2){
  464. // parames.query.levels= ["3"]
  465. // }else if(this.screen.record==3){
  466. // parames.query.levels= ["4"]
  467. // }else{
  468. // parames.query.levels=''
  469. // }
  470. this.userInfo = uni.getStorageSync('weapp_session_userInfo_data');
  471. this.$u.post("/customer/customerManagement", parames).then(data => {
  472. var list = data.results || [];
  473. list.forEach(item=>{
  474. if(this.userInfo.dataCode == 6){
  475. item.isshow=true;
  476. }else{
  477. item.isshow=false;
  478. }
  479. })
  480. list.forEach(item=>{
  481. if(item.demand.cusSemanticWordsList!=null){
  482. item.demand.cusSemanticWordsList.forEach(che=>{
  483. if(che.isInterval==0){
  484. che.name=che.name+che.unit+'-'+che.endName+che.unit;
  485. }
  486. })
  487. }
  488. })
  489. // this.recordList = [...this.recordList, ...list];
  490. if(this.isRefresh){
  491. this.recordList = list;
  492. }else{
  493. this.recordList = [...this.recordList, ...list];
  494. }
  495. this.totalRecord=data.totalPage;
  496. this.totalRecords = data.totalRecord;
  497. })
  498. },
  499. //获取顾问列表
  500. getFreeList() {
  501. this.freeList=[]
  502. this.$u.get("/zkAgentPool/freeList?itemId="+this.buildingID).then(res => {
  503. this.freeList = res;
  504. this.freeList.forEach(item=>{
  505. item.label=item.name;
  506. item.value=item.agentId
  507. })
  508. })
  509. },
  510. //获取客户标签
  511. getfindKeywordsList() {
  512. this.findKeywordsList=[]
  513. this.$u.post("/customer/findKeywords",{houseId:this.buildingID}).then(res => {
  514. res.forEach(item=>{
  515. if(item.isInterval==0){
  516. item.label=item.name+item.unit+'-'+item.endName+item.unit;
  517. }else{
  518. item.label=item.name
  519. }
  520. item.value=item.id;
  521. })
  522. this.findKeywordsList = res;
  523. })
  524. },
  525. // 筛选
  526. screenshow(){
  527. this.screenShow=true
  528. },
  529. //选择顾问
  530. actionSelectCallback(e){
  531. this.screen.agentId=e[0].value;
  532. this.screen.agentIdtext=e[0].label;
  533. },
  534. //选择标签
  535. selectCallback(e){
  536. this.screen.cunsumerTips=e[0].label;
  537. this.screen.cunsumerTipsid=e[0].value;
  538. },
  539. //重置
  540. reset(){
  541. this.screen={
  542. agentId:'',
  543. agentIdtext:'',
  544. visitRecord:'',
  545. record:[],
  546. cunsumerTips:'',
  547. cunsumerTipsid:''
  548. }
  549. this.visitList.map(i=>{
  550. i.isShow = false
  551. })
  552. this.levelList.map(i=>{
  553. i.isShow = false
  554. })
  555. this.nextPage=1;
  556. this.recordList=[];
  557. this.screenShow=false;
  558. this.isRefresh = false;
  559. this.getMyCustom();
  560. },
  561. //筛选确认
  562. screensure(){
  563. this.nextPage=1;
  564. this.isRefresh = false;
  565. this.recordList=[];
  566. this.screenShow=false;
  567. this.getMyCustom();
  568. },
  569. goSearch(){
  570. uni.navigateTo({
  571. url: '/pages/center/consumer/consumerSearch'
  572. });
  573. },
  574. gotoFollowUp(id) {
  575. uni.navigateTo({
  576. url: `/pages/center/consumer/newFollowup/newFollowup?id=${id}`
  577. })
  578. },
  579. }
  580. }
  581. </script>
  582. <style lang="scss" scoped>
  583. .box {
  584. width: 100%;
  585. height: 100%;
  586. background: #F8F8F8;
  587. }
  588. .count {
  589. width: 100%;
  590. height: 90rpx;
  591. display: flex;
  592. align-items: center;
  593. justify-content: center;
  594. background-color: #FBE4E4;
  595. text {
  596. color: #F71616;
  597. }
  598. }
  599. .timeview{
  600. height: 80rpx;
  601. line-height: 80rpx;
  602. width: 100%;
  603. text-align: center;
  604. border-bottom: 1px solid #F8F8F8;
  605. }
  606. //时间切换的样式
  607. .boxtittab {
  608. width: 100;
  609. height: 92rpx;
  610. background: #FFFFFF;
  611. border: 1px solid #E0E0E0;
  612. display: flex;
  613. align-items: center;
  614. .tabbox {
  615. flex: 1;
  616. height: 100%;
  617. text-align: center;
  618. line-height: 92rpx;
  619. color: #666666;
  620. font-size: 28rpx;
  621. }
  622. }
  623. .search-box{
  624. width: 100%;
  625. height: 102rpx;
  626. background: #FFFFFF;
  627. display: flex;
  628. align-items: center;
  629. justify-content: center;
  630. .search{
  631. width: 94%;
  632. height: 70rpx;
  633. display: flex;
  634. align-items: center;
  635. background: #F8F8F8;
  636. border-radius: 33rpx;
  637. .search-img{
  638. width: 26rpx;
  639. height: 30rpx;
  640. margin-left: 20rpx;
  641. .search-img1{
  642. width: 100%;
  643. height: 100%;
  644. margin-top: 2rpx;
  645. }
  646. }
  647. .search-text{
  648. font-size: 28rpx;
  649. font-weight: 400;
  650. color: #999999;
  651. margin-left:10rpx;
  652. }
  653. }
  654. .search-screen{
  655. width: 40rpx;
  656. height: 40rpx;
  657. margin-left: 30rpx;
  658. .search-screen1{
  659. width: 100%;
  660. height: 100%;
  661. }
  662. }
  663. }
  664. .content{
  665. // height: 1000rpx;/
  666. overflow: hidden;
  667. border-top: 1px solid #E0E0E0;
  668. .content-tips{
  669. background: #fff;
  670. // box-sizing: border-box;
  671. margin-top: 20rpx;
  672. overflow: hidden;
  673. .content-first{
  674. padding: 19rpx 30rpx;
  675. display: flex;
  676. justify-content: space-between;
  677. box-sizing: border-box;
  678. // border-top: 1px solid #E0E0E0;
  679. font-weight: 400;
  680. color: #292929;
  681. height: 90rpx;
  682. font-size: 30rpx;
  683. line-height: 30rpx;
  684. .left{
  685. display: flex;
  686. .img{
  687. // margin-top: 19rpx;
  688. width: 52rpx;
  689. height: 52rpx;
  690. border: 1px solid #E0E0E0;
  691. border-radius: 50%;
  692. text-align: center;
  693. line-height: 50rpx;
  694. margin-right: 20rpx;
  695. }
  696. .test{
  697. margin-top: 11rpx;
  698. // margin-left: 20rpx;
  699. font-weight: 500;
  700. color: #333333;
  701. }
  702. }
  703. .right{
  704. display: flex;
  705. .point{
  706. width: 12rpx;
  707. height: 12rpx;
  708. background: #2B6EFF;
  709. border-radius: 50%;
  710. margin-right: 9rpx;
  711. margin-top: 20rpx;
  712. }
  713. .test{
  714. margin-top: 11rpx;
  715. }
  716. }
  717. }
  718. .content-sec{
  719. border-top: 1px solid #E0E0E0;
  720. padding: 0 30rpx;
  721. padding-bottom: 30rpx;
  722. // height: 270rpx;
  723. position: relative;
  724. .content-sec-lab{
  725. margin-top: 30rpx;
  726. display: flex;
  727. font-size: 30rpx;
  728. font-weight: 400;
  729. color: #666666;
  730. line-height: 46rpx;
  731. .content-sec-lab1{
  732. color: #333333;
  733. }
  734. .content-sec-tips{
  735. max-width:160rpx ;
  736. height: 46rpx;
  737. background: #F2F2F2;
  738. border-radius: 6rpx;
  739. text-align: center;
  740. line-height: 26rpx;
  741. overflow: hidden;
  742. text-overflow:ellipsis;
  743. white-space: nowrap;
  744. font-size: 26rpx;
  745. font-weight: 400;
  746. color: #333333;
  747. margin-right: 20rpx;
  748. box-sizing: border-box;
  749. padding: 10rpx 24rpx;
  750. }
  751. }
  752. .content-sec-num{
  753. position: absolute;
  754. width: 200rpx;
  755. height: 90rpx;
  756. background: #F4F8FD;
  757. border-radius: 12rpx;
  758. font-weight: 400;
  759. color: #2671E2;
  760. line-height: 45rpx;
  761. bottom: 30rpx;
  762. right: 30rpx;
  763. text-align: center;
  764. }
  765. }
  766. .content-last{
  767. display: flex;
  768. border-top: 1px solid #E0E0E0;
  769. // padding: 0 30rpx;
  770. height: 78rpx;
  771. .content-last-tab{
  772. width: 33.4%;
  773. text-align: center;
  774. font-size: 30rpx;
  775. font-weight: 400;
  776. color: #333333;
  777. line-height: 78rpx;
  778. border-right: 1px solid #E0E0E0;
  779. }
  780. }
  781. }
  782. }
  783. // 这是弹出层
  784. .screen{
  785. // box-sizing: border-box;
  786. // padding: 0 30rpx;
  787. .screen-counselor{
  788. display: flex;
  789. height: 106rpx;
  790. // padding: 40rpx 30rpx 36rpx 30rpx;
  791. padding: 0 30rpx;
  792. box-sizing: border-box;
  793. border-bottom: 1px solid #E0E0E0;
  794. .screen-text{
  795. margin: 40rpx 0 36rpx 0;
  796. font-size: 30rpx;
  797. font-weight: 400;
  798. color: #333333;
  799. line-height: 30rpx;
  800. }
  801. .screen-sel{
  802. display: flex;
  803. justify-content: space-between;
  804. width: 500rpx;
  805. margin-left: 60rpx;
  806. .screen-sel-img{
  807. margin: 40rpx 0 36rpx 0;
  808. width: 14rpx;
  809. height: 30rpx;
  810. }
  811. .screen-inp{
  812. margin-top: 20rpx;
  813. }
  814. }
  815. }
  816. .screen-record{
  817. height: 192rpx;
  818. // width: 100%;
  819. overflow: hidden;
  820. padding: 0 30rpx;
  821. box-sizing: border-box;
  822. border-bottom: 1px solid #E0E0E0;
  823. .screen-record-text{
  824. margin-top: 36rpx;
  825. font-size: 30rpx;
  826. font-weight: 400;
  827. color: #333333;
  828. line-height: 30rpx;
  829. }
  830. .screen-record-tab{
  831. margin-top: 30rpx;
  832. display: flex;
  833. // justify-content: space-around;
  834. .screen-record-chose{
  835. width: 156rpx;
  836. height: 60rpx;
  837. background: #2671E2;
  838. border-radius: 4rpx;
  839. border: 1px solid #2671E2;
  840. text-align: center;
  841. line-height: 60rpx;
  842. margin-right: 22rpx;
  843. color: #FFFFFF;
  844. }
  845. .screen-record-nochose{
  846. width: 156rpx;
  847. height: 60rpx;
  848. background: #FFFFFF;
  849. border-radius: 4rpx;
  850. border: 1px solid #C9C9C9;
  851. text-align: center;
  852. line-height: 60rpx;
  853. margin-right: 22rpx;
  854. }
  855. }
  856. }
  857. .screen-foot{
  858. width: 100%;
  859. height: 88rpx;
  860. display: flex;
  861. .screen-foot-reset{
  862. width: 50%;
  863. text-align: center;
  864. height: 88rpx;
  865. line-height: 88rpx;
  866. font-size: 30rpx;
  867. font-weight: 400;
  868. color: #666666;
  869. }
  870. .screen-foot-sure{
  871. width: 50%;
  872. text-align: center;
  873. line-height: 88rpx;
  874. height: 88rpx;
  875. font-size: 30rpx;
  876. font-weight: 400;
  877. color: #FFFFFF;
  878. background: #2671E2;
  879. }
  880. }
  881. }
  882. </style>