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.
 
 
 

901 lines
22 KiB

  1. <template>
  2. <view class="box">
  3. <view class="content">
  4. <view class="content-tips" @click="goedit()">
  5. <view class="content-first">
  6. <view class="left">
  7. <view class="img">{{customerInfo.name.slice(0,1) || '--'}}</view>
  8. <view class="test">{{customerInfo.name || '--'}}</view>
  9. <view class="edit">
  10. <image class="screen-sel-img" src="../../../static/images/edit.png" mode=""></image>
  11. </view>
  12. </view>
  13. <!-- <view class="right">
  14. <view class="point"></view>
  15. <view class="test">定金</view>
  16. </view> -->
  17. </view>
  18. <view class="content-sec">
  19. <view class="content-sec-lab">
  20. 手机号码:<view class="content-sec-lab1">{{customerInfo.phone || '--'}}</view>
  21. </view>
  22. <view class="content-sec-lab">
  23. 客户标签:
  24. <view class="content-sec-tips">投资</view>
  25. <view class="content-sec-tips">理财专用</view>
  26. <view class="content-sec-tips">学区</view>
  27. </view>
  28. <view class="content-sec-lab">
  29. 顾问姓名:<view class="content-sec-lab1">{{customerInfo.agentName}}</view>
  30. </view>
  31. <view class="content-sec-lab">
  32. 添加时间:<view class="content-sec-lab1">{{customerInfo.createTime}}</view>
  33. </view>
  34. <view class="content-sec-num">
  35. <view class="">{{customerInfo.visitRecord || '--'}}次到访</view>
  36. <view class="">{{customerInfo.fraction || '0'}}% | {{customerInfo.fraction || '0'}}分</view>
  37. </view>
  38. </view>
  39. <view class="content-last">
  40. <view class="content-last-con">
  41. 备注:{{customerInfo.demand.remarks ? customerInfo.demand.remarks : "暂无"}}
  42. </view>
  43. </view>
  44. </view>
  45. </view>
  46. <view class="tabchange">
  47. <view class="tab">
  48. <view class="tabbox">
  49. <view :class="{ activecllasscet: activeTotal == 0 }" @click="tabtimetap(0)">接待记录</view>
  50. </view>
  51. <view class="tabbox">
  52. <view :class="{ activecllasscet: activeTotal == 1 }" @click="tabtimetap(1)">跟进记录</view>
  53. </view>
  54. <view class="tabbox">
  55. <view :class="{ activecllasscet: activeTotal == 2 }" @click="tabtimetap(2)">执行率</view>
  56. </view>
  57. </view>
  58. <!-- 接待记录 -->
  59. <view class="tabactive1" v-if="activeTotal==0" style="min-height: 600rpx;">
  60. <view v-if="Thevisitingrecords.length==0" style="width: 100%;height: 100%;display: flex;align-items: center;">
  61. <view style="width: 100%;padding-top: 60rpx;">
  62. <view style="width: 100%;text-align: center;">
  63. <image style="width: 220rpx;height: 200rpx;" src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  64. </view>
  65. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  66. </view>
  67. </view>
  68. <view v-if="Thevisitingrecords.length!=0" class="content-tips" v-for="(item,index) in Thevisitingrecords" :key="index" @click="tapThevisiting(item)">
  69. <view class="content-first">
  70. <view class="left">
  71. <view class="img">{{item.agentName.slice(0,1) || '--'}}</view>
  72. <view class="name">{{item.agentName || '--'}}</view>
  73. <view class="status">代接待</view>
  74. </view>
  75. <!-- <view class="right">
  76. <view class="point"></view>
  77. <view class="">优秀案例</view>
  78. </view> -->
  79. </view>
  80. <view class="content-sec">
  81. <view class="left">
  82. <view class="cus">客户:{{item.name || ''}} |</view>
  83. <view class="arriveNum">{{item.visitRecord || '--'}}次到访</view>
  84. </view>
  85. <view class="right">{{item.fraction || '0'}}% | {{item.fraction || '0'}}分</view>
  86. </view>
  87. <view class="content-last">{{item.createTime}} | {{item.mm || '--'}}分钟</view>
  88. </view>
  89. </view>
  90. <!-- 跟进记录 -->
  91. <view class="tabactive2" v-if="activeTotal==1" style="min-height: 600rpx;">
  92. <view v-if="fllowList.length==0" style="width: 100%;height: 100%;display: flex;align-items: center;">
  93. <view style="width: 100%;padding-top: 60rpx;">
  94. <view style="width: 100%;text-align: center;">
  95. <image style="width: 220rpx;height: 200rpx;" src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  96. </view>
  97. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  98. </view>
  99. </view>
  100. <view v-if="fllowList.length!=0" class="tab2-tips" v-for="(item,index) in fllowList" :key="index">
  101. <view class="tab2-first">
  102. <view class="tab2-first-1">
  103. <view class="tab2-first-left">
  104. <view class="img">{{item.agentName.slice(0,1) || '--'}}</view>
  105. <view class="name">{{item.agentName || '||'}}</view>
  106. </view>
  107. <view class="tab2-first-right">{{item.createTime}}</view>
  108. </view>
  109. <view class="tab2-first-foot">跟进内容:{{item.remarks || '暂无'}}</view>
  110. </view>
  111. <!-- <view class="tab2-sec">
  112. <view class="tab-sec-edit">编辑记录</view>
  113. </view> -->
  114. </view>
  115. </view>
  116. <!-- 评分 -->
  117. <view class="ratecenter" v-if="activeTotal==2">
  118. <view class="ratetetle">执行总览</view>
  119. <view class="rateyuanbox">
  120. <view class="rateyuanboxzuo">
  121. <view class="boxzuoview cccccc">3次</view>
  122. <view style="color: #333333;font-size: 28rpx;font-weight: 400;text-align: center;">接待次数</view>
  123. </view>
  124. <view class="rateyuanboxyou">
  125. <view class="boxzuoview" style="width: 100%;display: flex;justify-content: center;">
  126. <u-circle-progress active-color="#4FC78F" width='139' :percent="customerInfo.fraction">
  127. <view style="text-align: center;color: #4FC78F;">{{customerInfo.fraction}}%</view>
  128. </u-circle-progress>
  129. </view>
  130. <view style="color: #333333;font-size: 28rpx;font-weight: 400;text-align: center;">销讲执行率</view>
  131. </view>
  132. <view class="rateyuanboxzuo">
  133. <view class="boxzuoview cccccc">{{customerInfo.mm}}分</view>
  134. <view style="color: #333333;font-size: 28rpx;font-weight: 400;text-align: center;">接待时长</view>
  135. </view>
  136. </view>
  137. <view style="width: 100%;height: 80rpx;border-bottom: 1rpx solid #E0E0E0;display: flex;align-items: center;">
  138. <view style="flex: 1;font-size: 28rpx;color: #333333;font-weight: 600;text-indent: 20rpx;">指标</view>
  139. <view style="flex: 1;font-size: 28rpx;color: #333333;font-weight: 600;text-indent: 170rpx;">执行率</view>
  140. </view>
  141. <view v-if="ratelist.length==0" style="width: 100%;height: 100%;display: flex;align-items: center;">
  142. <view style="width: 100%;padding-top: 60rpx;">
  143. <view style="width: 100%;text-align: center;">
  144. <image style="width: 220rpx;height: 200rpx;" src="https://static.quhouse.com/zhikong_xcx_img/nodatalist.png" mode=""></image>
  145. </view>
  146. <view style="text-align: center;width: 100%;margin-top: 20rpx;color: #999999;">暂无数据</view>
  147. </view>
  148. </view>
  149. <view v-if="ratelist.length!=0" class="rate-box" style="margin-top: 10rpx;">
  150. <!-- <view class="title">总执行率 {{totalRate}}%</view> -->
  151. <view v-for="(item,index) in ratelist" :key="index" class="u-m-b-14">
  152. <view class="level1">
  153. <view class="level-name u-line-1">
  154. {{item.name}}
  155. </view>
  156. <view class="level-progress">
  157. <view class="color" :style="{width: item.ratepercent/item.rate*100+'%'}"></view>
  158. </view>
  159. <view class="level-rate">{{((item.ratepercent/item.rate).toFixed(2)*100).toFixed()}}%</view>
  160. <image v-if="!item.show" class="arrow rotatearrow" @click="changeshow(item,1)" src="/static/images/down.png"
  161. mode="" />
  162. <image v-else class="arrow" @click="changeshow(item,0)" src="/static/images/up.png" mode="" />
  163. </view>
  164. <view class="level1-subbox" v-if="item.show">
  165. <view class="sub-name" v-for="(subitem,i) in item.children" :key="i">
  166. <view class="subitem-name u-line-1" @tap="clickaudeopal(subitem)">{{subitem.name}}</view>
  167. <image class="checkimg" v-if="!subitem.selected" src="/static/images/rate-checked.png" mode="" />
  168. <image class="checkimg" v-else src="/static/images/rate-nocheck.png" mode="" />
  169. </view>
  170. </view>
  171. </view>
  172. </view>
  173. </view>
  174. </view>
  175. <view class="pon-foot" v-if="buttonisshow">
  176. <view class="foot-tab" @click="goRemind">添加提醒</view>
  177. <!-- <view class="foot-tab">拨打电话</view> -->
  178. <view class="foot-tab" @click="followRecordAdd()">写跟进</view>
  179. </view>
  180. </view>
  181. </template>
  182. <script>
  183. export default{
  184. data(){
  185. return{
  186. activeTotal: 0,
  187. customerId:'',
  188. customerInfo:{
  189. name:'',
  190. createTime:'',
  191. agentName:''
  192. },
  193. Thevisitingrecords:[],
  194. totalRate:[],
  195. ratelist:[],
  196. fllowList:[],
  197. userInfo:{},
  198. buttonisshow:false
  199. }
  200. },
  201. onLoad(options) {
  202. this.customerId = options.id;
  203. },
  204. onShow() {
  205. this.userInfo = uni.getStorageSync('weapp_session_userInfo_data');
  206. if(this.userInfo.dataCode == 6){
  207. this.buttonisshow=true;
  208. }else{
  209. this.buttonisshow=false
  210. }
  211. this.getCustomerInfo()
  212. this.tabtimetap(0)
  213. },
  214. methods:{
  215. // 获取到访记录
  216. getVisitList() {
  217. this.$u.get("/customer/findByPhoneAndProject?id=" + this.customerId, ).then(res => {
  218. this.Thevisitingrecords = res
  219. })
  220. },
  221. // 获取客户信息
  222. getCustomerInfo() {
  223. const that = this;
  224. this.$u.get("/customer/findById", {
  225. id: this.customerId
  226. }).then(res => {
  227. if(res.fraction==null){
  228. res.fraction='0';
  229. }
  230. this.customerInfo = res;
  231. })
  232. },
  233. tabtimetap(idx){
  234. this.activeTotal=idx
  235. if(idx==0){
  236. this.getVisitList()
  237. }else if(idx==1){
  238. this.getFollowList()
  239. }else{
  240. this.getRatelist()
  241. }
  242. },
  243. tapThevisiting(item) {
  244. if(item.yon!=0){
  245. uni.showToast({
  246. icon:'none',
  247. title: '暂无录音',
  248. duration: 2000
  249. });
  250. return
  251. }else{
  252. const parames = {
  253. pageNum: 1,
  254. pageSize: 100,
  255. query: {
  256. customerId: item.id,
  257. }
  258. }
  259. var item={
  260. bg:0,
  261. customerId:item.id,
  262. id:''
  263. }
  264. this.$u.post("/corpus/findByPage", parames).then(res => {
  265. if(res==null){
  266. uni.showToast({
  267. icon: "none",
  268. title: "暂无音频"
  269. })
  270. return
  271. }
  272. if(res[0].recordDuration>360){
  273. let newobj = res[0];
  274. uni.navigateTo({
  275. url: `/pages/mine/details2?customerId=${newobj.customerId}&status=${newobj.status}&itemobj=${JSON.stringify(item)}&stateisshow=${"2"}`
  276. })
  277. }else{
  278. let newobj = res[0];
  279. uni.navigateTo({
  280. url: `/pages/mine/details?customerId=${newobj.customerId}&status=${newobj.status}&itemobj=${JSON.stringify(item)}&stateisshow=${"1"}`
  281. })
  282. }
  283. })
  284. }
  285. },
  286. // 获取跟进记录
  287. getFollowList() {
  288. this.fllowList=[];
  289. this.$u.post("/customer/getCusStage", {
  290. customerId: this.customerId
  291. }).then(res => {
  292. res.forEach(item=>{
  293. item.agentName=this.customerInfo.agentName
  294. })
  295. this.fllowList = res;
  296. })
  297. },
  298. // 新增跟进
  299. followRecordAdd() {
  300. uni.navigateTo({
  301. url: `/pages/center/consumer/newFollowup/newFollowup?id=${this.customerId}`
  302. })
  303. },
  304. // 去编辑
  305. goedit(){
  306. // console.log('去编辑')
  307. uni.navigateTo({
  308. url:`/pages/center/consumer/edit?id=${this.customerId}`
  309. })
  310. },
  311. // 去添加提醒
  312. goRemind(){
  313. uni.navigateTo({
  314. url:'/pages/center/consumer/remind'
  315. })
  316. },
  317. //评分点击
  318. clickaudeopal(item){
  319. if(item.selected==0){
  320. uni.navigateTo({
  321. url: '/pages/mine/ScoringPlaylist?customerId='+this.customerId +"&id="+item.marketingId
  322. })
  323. }
  324. },
  325. changeshow(item, type) {
  326. if (type == 1) {
  327. item.show = true
  328. } else {
  329. item.show = false
  330. }
  331. },
  332. // 获取评分
  333. getRatelist() {
  334. this.$u.get("/customer/findzkMByCusId", {
  335. cusId: this.customerId
  336. }).then(res => {
  337. if (res.length) {
  338. let level1 = []
  339. let level2rate = 0
  340. res.forEach(item => {
  341. if (item.pid == 0) {
  342. level1.push({
  343. id: item.marketingId,
  344. rate: item.fraction,
  345. name: item.name,
  346. sort: item.sort,
  347. show: false,
  348. ratepercent: 0,
  349. children: []
  350. })
  351. } else {
  352. if (item.selected == 0) {
  353. level2rate += item.fraction
  354. }
  355. }
  356. })
  357. this.totalRate = level2rate
  358. res.forEach(subitem => {
  359. let subitempid = subitem.pid
  360. level1.forEach(item => {
  361. if (subitempid == item.id) {
  362. if (subitem.selected == 0) {
  363. item.ratepercent += subitem.fraction
  364. }
  365. item.children.push({
  366. id: subitem.id,
  367. rate: subitem.fraction,
  368. selected: subitem.selected,
  369. name: subitem.name,
  370. marketingId:subitem.marketingId
  371. })
  372. }
  373. })
  374. })
  375. level1[0].show = true;
  376. this.ratelist = level1
  377. }
  378. })
  379. },
  380. }
  381. }
  382. </script>
  383. <style lang="scss" scoped>
  384. .cccccc{
  385. text-align: center;
  386. height: 140rpx;
  387. line-height: 140rpx;
  388. font-size: 30rpx;
  389. }
  390. .ratecenter{
  391. background-color: #FFFFFF;
  392. padding-bottom: 30rpx;
  393. width: 100%;
  394. .ratetetle{
  395. padding: 30rpx;
  396. font-size: 30rpx;
  397. font-weight: 400;
  398. color: #333333;
  399. padding-bottom:6rpx;
  400. }
  401. .rateyuanbox{
  402. width: 100%;
  403. height:210rpx;
  404. padding-bottom: 30rpx;
  405. border-bottom:1rpx solid #E0E0E0;
  406. display: flex;
  407. padding-left: 80rpx;
  408. padding-right: 80rpx;
  409. .rateyuanboxzuo{
  410. width: 30%;
  411. height: 100%;
  412. }
  413. .rateyuanboxyou{
  414. width: 40%;
  415. height: 100%;
  416. }
  417. .boxzuoview{
  418. width: 100%;
  419. height: 140rpx;
  420. }
  421. }
  422. }
  423. .box {
  424. width: 100%;
  425. height: 100%;
  426. background: #F8F8F8;
  427. }
  428. // 评分
  429. .rate-box {
  430. padding: 10rpx 20rpx;
  431. background-color: #FFFFFF;
  432. .date {
  433. width: 300rpx;
  434. height: 33rpx;
  435. font-size: 24rpx;
  436. font-weight: 400;
  437. color: #333333;
  438. line-height: 33rpx;
  439. letter-spacing: 1rpx;
  440. margin-bottom: 8rpx;
  441. }
  442. .title {
  443. width: 100%;
  444. height: 42rpx;
  445. font-size: 30rpx;
  446. font-weight: 500;
  447. color: #333333;
  448. line-height: 42rpx;
  449. letter-spacing: 2rpx;
  450. margin-bottom: 20rpx;
  451. }
  452. .level1 {
  453. display: flex;
  454. align-items: center;
  455. .level-name {
  456. width: 104rpx;
  457. height: 33rpx;
  458. font-size: 24rpx;
  459. font-weight: 500;
  460. color: #333333;
  461. line-height: 33rpx;
  462. letter-spacing: 1rpx;
  463. margin-right: 10rpx;
  464. }
  465. .level-progress {
  466. flex: 1;
  467. border-radius: 11rpx;
  468. height: 21rpx;
  469. background-color: #BEE4FF;
  470. position: relative;
  471. .color {
  472. width: 0;
  473. position: absolute;
  474. top: 0;
  475. left: 0;
  476. height: 21rpx;
  477. border-radius: 11rpx 0 0 11rpx;
  478. background-color: #008EF2;
  479. }
  480. }
  481. .level-rate {
  482. width: 65rpx;
  483. height: 33rpx;
  484. font-size: 24rpx;
  485. font-weight: 500;
  486. color: #333333;
  487. line-height: 33rpx;
  488. letter-spacing: 1rpx;
  489. margin: 0 20rpx 0 15rpx;
  490. }
  491. .arrow {
  492. width: 37rpx;
  493. height: 21rpx;
  494. padding: 5rpx 20rpx;
  495. }
  496. .rotatearrow {
  497. transform: rotate(270deg);
  498. }
  499. }
  500. .level1-subbox {
  501. display: flex;
  502. margin-top: 20rpx;
  503. flex-wrap: wrap;
  504. .sub-name {
  505. width: 50%;
  506. display: flex;
  507. margin-bottom: 18rpx;
  508. .subitem-name {
  509. width: 104rpx;
  510. height: 33rpx;
  511. font-size: 24rpx;
  512. font-weight: 400;
  513. color: #999999;
  514. line-height: 33rpx;
  515. letter-spacing: 1rpx;
  516. margin-right: 12rpx;
  517. }
  518. .checkimg {
  519. width: 27rpx;
  520. height: 27rpx;
  521. }
  522. }
  523. }
  524. }
  525. .tab{
  526. height: 88rpx;
  527. border-bottom: 1px solid #E0E0E0;
  528. background: #FFFFFF;
  529. display: flex;
  530. align-items: center;
  531. .tabbox {
  532. flex: 1;
  533. height: 100%;
  534. text-align: center;
  535. line-height: 92rpx;
  536. color: #666666;
  537. font-size: 28rpx;
  538. display: flex;
  539. justify-content: center;
  540. .activecllasscet {
  541. border-bottom: 2px solid #2671E2;
  542. color: #2671E2;
  543. font-weight: 600;
  544. }
  545. }
  546. }
  547. .content{
  548. // height: 1000rpx;/
  549. overflow: hidden;
  550. border-top: 1px solid #E0E0E0;
  551. .content-tips{
  552. background: #fff;
  553. // box-sizing: border-box;
  554. margin-bottom: 20rpx;
  555. overflow: hidden;
  556. .content-first{
  557. padding: 19rpx 30rpx;
  558. display: flex;
  559. justify-content: space-between;
  560. box-sizing: border-box;
  561. // border-top: 1px solid #E0E0E0;
  562. font-weight: 400;
  563. color: #292929;
  564. height: 90rpx;
  565. font-size: 30rpx;
  566. line-height: 30rpx;
  567. .left{
  568. display: flex;
  569. .img{
  570. // margin-top: 19rpx;
  571. width: 52rpx;
  572. height: 52rpx;
  573. border: 1px solid #E0E0E0;
  574. border-radius: 50%;
  575. text-align: center;
  576. line-height: 50rpx;
  577. }
  578. .test{
  579. margin-top: 11rpx;
  580. margin-left: 20rpx;
  581. font-weight: 500;
  582. color: #333333;
  583. }
  584. .edit{
  585. height: 30rpx;
  586. width: 30rpx;
  587. margin-left: 30rpx;
  588. margin-top: 11rpx;
  589. image{
  590. width: 100%;
  591. height: 100%;
  592. }
  593. }
  594. }
  595. .right{
  596. display: flex;
  597. .point{
  598. width: 12rpx;
  599. height: 12rpx;
  600. background: #2B6EFF;
  601. border-radius: 50%;
  602. margin-right: 9rpx;
  603. margin-top: 20rpx;
  604. }
  605. .test{
  606. margin-top: 11rpx;
  607. }
  608. }
  609. }
  610. .content-sec{
  611. border-top: 1px solid #E0E0E0;
  612. padding: 0 30rpx;
  613. height: 270rpx;
  614. position: relative;
  615. .content-sec-lab{
  616. margin-top: 30rpx;
  617. display: flex;
  618. font-size: 30rpx;
  619. font-weight: 400;
  620. color: #666666;
  621. line-height: 30rpx;
  622. .content-sec-lab1{
  623. color: #333333;
  624. }
  625. .content-sec-tips{
  626. max-width:174rpx ;
  627. height: 46rpx;
  628. background: #F2F2F2;
  629. border-radius: 6rpx;
  630. text-align: center;
  631. line-height: 26rpx;
  632. overflow: hidden;
  633. text-overflow:ellipsis;
  634. white-space: nowrap;
  635. font-size: 26rpx;
  636. font-weight: 400;
  637. color: #333333;
  638. margin-right: 24rpx;
  639. box-sizing: border-box;
  640. padding: 10rpx 24rpx;
  641. }
  642. }
  643. .content-sec-num{
  644. position: absolute;
  645. width: 190rpx;
  646. height: 90rpx;
  647. background: #F4F8FD;
  648. border-radius: 12rpx;
  649. font-weight: 400;
  650. color: #2671E2;
  651. line-height: 45rpx;
  652. bottom: 30rpx;
  653. right: 30rpx;
  654. text-align: center;
  655. }
  656. }
  657. .content-last{
  658. padding: 30rpx;
  659. height: 168rpx;
  660. .content-last-con{
  661. width: 690rpx;
  662. height: 108rpx;
  663. background: #F8F8F8;
  664. border-radius: 8rpx;
  665. padding: 14rpx 20rpx;
  666. font-size: 28rpx;
  667. font-weight: 400;
  668. color: #333333;
  669. line-height: 40rpx;
  670. }
  671. }
  672. }
  673. }
  674. .tabchange{
  675. // background: #FFFFFF;
  676. overflow: hidden;
  677. .tabactive1{
  678. .content-tips{
  679. background: #fff;
  680. padding: 0 30rpx;
  681. box-sizing: border-box;
  682. overflow: hidden;
  683. margin-bottom: 20rpx;
  684. .content-first{
  685. margin-top: 19rpx;
  686. display: flex;
  687. justify-content: space-between;
  688. .left{
  689. display: flex;
  690. .img{
  691. width: 52rpx;
  692. height: 52rpx;
  693. background: #FFFFFF;
  694. border: 1px solid #C9C9C9;
  695. border-radius: 50%;
  696. text-align: center;
  697. line-height: 52rpx;
  698. }
  699. .name{
  700. font-weight: 600;
  701. color: #333333;
  702. margin-left: 20rpx;
  703. margin-top: 11rpx;
  704. }
  705. .status{
  706. width: 110rpx;
  707. height: 42rpx;
  708. background: #FFF9F5;
  709. border-radius: 4rpx;
  710. font-size: 26rpx;
  711. font-weight: 400;
  712. color: #EC8D49;
  713. line-height: 42rpx;
  714. text-align: center;
  715. margin-left: 19rpx;
  716. margin-top: 11rpx;
  717. }
  718. }
  719. .right{
  720. display: flex;
  721. margin-top: 11rpx;
  722. .point{
  723. width: 12rpx;
  724. height: 12rpx;
  725. background: #2B6EFF;
  726. border-radius: 50%;
  727. margin-right: 9rpx;
  728. margin-top: 16rpx;
  729. }
  730. }
  731. }
  732. .content-sec{
  733. display: flex;
  734. justify-content: space-between;
  735. margin-top: 19rpx;
  736. .left{
  737. display: flex;
  738. .cus{
  739. font-size: 30rpx;
  740. font-weight: 400;
  741. color: #666666;
  742. line-height: 30rpx;
  743. }
  744. .arriveNum{
  745. font-size: 30rpx;
  746. font-weight: 400;
  747. line-height: 30rpx;
  748. margin-left: 10rpx;
  749. }
  750. }
  751. .right{
  752. width: 192rpx;
  753. height: 46rpx;
  754. background: #F4F8FD;
  755. border-radius: 6rpx;
  756. text-align: center;
  757. line-height: 46rpx;
  758. font-weight: 400;
  759. color: #2671E2;
  760. }
  761. }
  762. .content-last{
  763. margin: 30rpx 0;
  764. font-size: 30rpx;
  765. font-weight: 400;
  766. color: #666666;
  767. line-height: 30rpx;
  768. }
  769. }
  770. }
  771. .tabactive2{
  772. .tab2-tips{
  773. background: #fff;
  774. // height: 270rpx;
  775. overflow: auto;
  776. margin-bottom: 20rpx;
  777. .tab2-first{
  778. // height: 150rpx;
  779. border-bottom: 1px solid #E0E0E0;
  780. padding: 0 30rpx;
  781. margin-top: 19rpx;
  782. box-sizing: border-box;
  783. .tab2-first-1{
  784. display: flex;
  785. justify-content: space-between;
  786. // height: 75rpx;
  787. .tab2-first-left{
  788. display: flex;
  789. .img{
  790. width: 52rpx;
  791. height: 52rpx;
  792. background: #FFFFFF;
  793. border: 1px solid #C9C9C9;
  794. border-radius: 50%;
  795. text-align: center;
  796. line-height: 52rpx;
  797. }
  798. .name{
  799. font-weight: 600;
  800. color: #333333;
  801. margin-left: 20rpx;
  802. margin-top: 11rpx;
  803. }
  804. }
  805. .tab2-first-right{
  806. font-size: 30rpx;
  807. font-weight: 400;
  808. color: #666666;
  809. margin-top: 11rpx;
  810. }
  811. }
  812. .tab2-first-foot{
  813. margin-top: 19rpx;
  814. margin-bottom: 30rpx;
  815. font-size: 30rpx;
  816. font-weight: 400;
  817. color: #666666;
  818. line-height: 30rpx;
  819. }
  820. }
  821. .tab2-sec{
  822. height: 120rpx;
  823. padding: 30rpx;
  824. float: right;
  825. .tab-sec-edit{
  826. width: 156rpx;
  827. height: 60rpx;
  828. background: #FFFFFF;
  829. border-radius: 4px;
  830. border: 1px solid #2671E2;
  831. text-align: center;
  832. line-height: 60rpx;
  833. font-weight: 400;
  834. color: #2671E2;
  835. }
  836. }
  837. }
  838. }
  839. }
  840. .pon-foot{
  841. position: fixed;
  842. width: 750rpx;
  843. height: 100rpx;
  844. background: #FFFFFF;
  845. box-shadow: 0px -2rpx 8rpx 0rpx rgba(224, 224, 224, 0.5);
  846. bottom: 0;
  847. display: flex;
  848. justify-content: space-around;
  849. align-items: center;
  850. // padding-top: 24rpx;
  851. box-sizing: border-box;
  852. // padding: ;
  853. .foot-tab{
  854. text-align: center;
  855. width: 270rpx;
  856. height: 70rpx;
  857. line-height: 70rpx;
  858. background: #2671E2;
  859. box-shadow: 0px -2rpx 8rpx 0px rgba(224, 224, 224, 0.5);
  860. border-radius: 6rpx;
  861. font-size: 30rpx;
  862. font-weight: 400;
  863. color: #FFFFFF;
  864. }
  865. }
  866. </style>