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.
 
 
 
 

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