index.vue 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711
  1. <template>
  2. <view>
  3. <u-picker mode="selector" v-model="isswitchshow" :range="columns" range-key="label" :default-selector="columnsindex" @confirm="switchBtn" ></u-picker>
  4. <view class="userHead" :style="isswitch?'padding-top:40px':''" >
  5. <view class="userHead-img">
  6. <u-avatar src="../../assets/img/head.png" size="140"></u-avatar>
  7. </view>
  8. <view class="userHead-text">
  9. <h3>{{info.merchantAccountName}}</h3>
  10. <view class="userHead-text-position">
  11. <u-icon name="account-pin-box-fill" custom-prefix="custom-icon" color="#fff" size="32"></u-icon>
  12. <p>{{getPhone(info.phone)}}</p>
  13. <p
  14. v-if="isswitch" @click="isswitchshow=true"
  15. style="border: 1px solid rgba(255, 255, 255, 1);
  16. border-radius: 10px;
  17. padding: 0 10px;">
  18. <img src="../../assets/img/userswitch.svg" style="height: 32rpx;width: 32rpx;" alt="">
  19. 切换账号</p>
  20. </view>
  21. </view>
  22. </view>
  23. <view class="userInfo function-menu " style="padding-top:20rpx ;padding-bottom:60rpx ;margin-bottom:120rpx ;" v-if="home&&accountType8" >
  24. <template v-for="(item,i ) in vipPlatformList" >
  25. <view class=" userInfo-main2" :key="i" >
  26. <h2 v-if="vipPlatformList.length>1">
  27. {{item.entAccountName}}
  28. </h2>
  29. <h3>
  30. 企业余额:{{showNumJP(item.entAccountBalance)}}元
  31. </h3>
  32. <!-- <view class="userInfo-btn" >帐户提现</view> -->
  33. </view>
  34. <view class="item" :key="'b'+i"
  35. @click="gotoUrl('pagesFinance/accountType8/personmanage/index?id='+item.id)" >
  36. <view class="item-icon">
  37. <i class="ri-folder-user-line"></i>
  38. </view>
  39. <view class="item-name">
  40. 员工管理
  41. </view>
  42. </view>
  43. <view class="item" :key="'a'+i"
  44. @click="gotoUrl('pagesFinance/accountType8/carmanage/index?id='+item.entAccountId)" >
  45. <view class="item-icon">
  46. <img src="../../assets/img/riLine-bus-line.svg" alt="">
  47. </view>
  48. <view class="item-name">
  49. 车辆管理
  50. </view>
  51. </view>
  52. </template>
  53. <view class="item" @click="gotoUrl('pagesFinance/user/help')" v-if="false" >
  54. <view class="item-icon">
  55. <i data-v-137d5072="" class="ri-compass-3-line"></i>
  56. </view>
  57. <view class="item-name">
  58. 帮助中心
  59. </view>
  60. </view>
  61. <view class="item" @click="phone()" >
  62. <view class="item-icon">
  63. <i data-v-137d5072="" class="ri-customer-service-2-line"></i>
  64. </view>
  65. <view class="item-name">
  66. 联系客服
  67. </view>
  68. </view>
  69. </view>
  70. <view class="userInfo" v-if="home&&accountType">
  71. <view class="userInfo-head"><p>可提现金额<span v-if="info.accountType==3">(T+4)</span></p></view>
  72. <view class="userInfo-main">
  73. <h2>{{showNumJP(home.accountBalance)}}元
  74. <view class="withdraw" v-if="info.status&&(info.accountType!=3&&info.accountType!=1)" @click="gotoUrl('pagesFinance/user/withdrawal/withdrawRecord')" >
  75. 账户提现
  76. </view>
  77. <view class="withdraw" v-if="info.accountType==3" @click="gotoUrl('pagesFinance/user/withdrawal/cashoutList')" >
  78. 账户提现
  79. </view>
  80. </h2>
  81. <!-- <view class="userInfo-btn" >帐户提现</view> -->
  82. </view>
  83. <view class="userInfo-foot">
  84. <!-- <view class="userInfo-item">
  85. <p>今日收益</p>
  86. <h4>{{home.todayAmount}}</h4>
  87. </view> -->
  88. <view class="userInfo-item">
  89. <p>冻结金额(提现中)</p>
  90. <h4>{{showNumJP(home.waitingAmount)}}元</h4>
  91. </view>
  92. <view class="userInfo-item">
  93. <p>已提现</p>
  94. <h4>{{showNumJP(home.withdrawnAmount)}}元</h4>
  95. </view>
  96. </view>
  97. </view>
  98. <!-- 功能菜单 -->
  99. <view class="function-menu" v-if="accountType">
  100. <view class="item" @click="gotoUrl('pagesFinance/user/stationsList')" >
  101. <view class="item-icon">
  102. <img src="../../assets/img/riLine-user-settings-line.svg" alt="">
  103. </view>
  104. <view class="item-name">
  105. 我的充电桩
  106. </view>
  107. <view class="position" v-if="home&&home.deviceNumbers" >
  108. <view id="talkbubble" :style="home.deviceNumbers>=100?'padding: 2px 16rpx;':''" >{{home.deviceNumbers}}桩{{home.gunNumbers?home.gunNumbers+'枪':''}}</view>
  109. </view>
  110. </view>
  111. <view class="item" v-if="false"
  112. @click="gotoUrl('pagesFinance/user/activatedChargingPile')" >
  113. <view class="item-icon">
  114. <img src="../../assets/img/riLine-link.svg" alt="">
  115. </view>
  116. <view class="item-name">
  117. 激活充电桩
  118. </view>
  119. </view>
  120. <view class="item" v-if="info.accountType==2" @click="gotoUrl('pagesFinance/user/withdrawal/businessList')">
  121. <view class="item-icon">
  122. <img src="../../assets/img/riLine-file-list-3-line.svg" alt="">
  123. </view>
  124. <view class="item-name">
  125. 收益核算
  126. </view>
  127. </view>
  128. <view class="item" v-if="info.accountType==3" @click="gotoUrl('pagesFinance/user/withdrawal/cashoutList')">
  129. <view class="item-icon"> <!--个人 -->
  130. <i data-v-7e5aa06e="" class="ri-todo-line"></i>
  131. </view>
  132. <view class="item-name">
  133. 提现记录
  134. </view>
  135. </view>
  136. <view class="item" v-else @click="gotoUrl('pagesFinance/user/withdrawal/withdrawRecord')">
  137. <view class="item-icon">
  138. <i data-v-7e5aa06e="" class="ri-todo-line"></i>
  139. </view>
  140. <view class="item-name">
  141. 提现记录
  142. </view>
  143. </view>
  144. <view class="item" @click="gotoUrl('pagesFinance/preengaged/preengaged')">
  145. <view class="item-icon">
  146. <i data-v-137d5072="" class="ri-map-pin-time-line"></i>
  147. </view>
  148. <view class="item-name">
  149. 我被预约
  150. </view>
  151. </view>
  152. <view class="item" @click="gotoUrl('pagesFinance/recordOfInvoice/recordOfInvoice')">
  153. <view class="item-icon">
  154. <i data-v-137d5072="" class="ri-ticket-line"></i>
  155. </view>
  156. <view class="item-name">
  157. 开票记录
  158. </view>
  159. </view>
  160. <view class="item" @click="gotoUrl('pagesFinance/user/stationsListLine')">
  161. <view class="item-icon">
  162. <i class="ri-webcam-line"></i>
  163. </view>
  164. <view class="item-name">
  165. 摄像头
  166. </view>
  167. </view>
  168. <view class="item"
  169. v-for="(item,i) in vipPlatformList" :key="i"
  170. @click="gotoUrl('pagesFinance/user/ownManagement?id='+item.id)" >
  171. <view class="item-icon">
  172. <i class="ri-folder-user-line"></i>
  173. </view>
  174. <view class="item-name">
  175. {{vipPlatformList.length==1?'车主管理':item.name}}
  176. </view>
  177. </view>
  178. <view class="item" @click="gotoUrl('pagesFinance/user/help')" v-if="false" >
  179. <view class="item-icon">
  180. <i data-v-137d5072="" class="ri-compass-3-line"></i>
  181. </view>
  182. <view class="item-name">
  183. 帮助中心
  184. </view>
  185. </view>
  186. <view class="item" @click="phone()" >
  187. <view class="item-icon">
  188. <i data-v-137d5072="" class="ri-customer-service-2-line"></i>
  189. </view>
  190. <view class="item-name">
  191. 联系客服
  192. </view>
  193. </view>
  194. <view class="item" @click="gotoUrl('pagesFinance/user/about')" v-if="false" >
  195. <view class="item-icon">
  196. <i data-v-137d5072="" class="ri-account-pin-box-line"></i>
  197. </view>
  198. <view class="item-name">
  199. 关于我们
  200. </view>
  201. </view>
  202. </view>
  203. <button class="logout-btn" @click="logout">退出账号</button>
  204. <Tabbar8 :current="1" v-if="info.accountType==8" ref="tabbarMain" ></Tabbar8>
  205. <Tabbar :current="3" v-else ref="tabbarMain" ></Tabbar>
  206. </view>
  207. </template>
  208. <script>
  209. import Tabbar from '@/components/TabbarFinance.vue'
  210. import Tabbar8 from '@/components/TabbarFinance8.vue'
  211. import * as API from '@/apis/finance.js'
  212. import {
  213. substrMb
  214. } from '@/utils'
  215. export default {
  216. data() {
  217. return {
  218. columns:[],
  219. isWithdrawal:false,
  220. isswitchshow:false,
  221. isswitch:false,
  222. tel:'400-8899-619',
  223. role:{},
  224. info:{},
  225. home:null,
  226. current: 0,
  227. vipPlatformList:[],
  228. columnsindex:[0],
  229. background:{
  230. background: 'none'
  231. },
  232. }
  233. },
  234. components: {
  235. Tabbar,Tabbar8
  236. },
  237. computed:{
  238. accountType(){
  239. if(this.accountType8){
  240. return false
  241. }
  242. return true
  243. },
  244. accountType8(){
  245. if(this.info&&this.info.accountType==8){
  246. return true
  247. }else
  248. return false
  249. }
  250. },
  251. onLoad() {
  252. this.info=this.carhelp.getPersonInfo()
  253. if(process.env.NODE_ENV === "development"){
  254. this.isWithdrawal=true
  255. }
  256. },
  257. onReady() {
  258. //this.getHomePage()
  259. },
  260. onShow() {
  261. if(this.$refs.tabbarMain){
  262. var i=3
  263. if(this.accountType8){
  264. i=1
  265. }
  266. this.$refs.tabbarMain.setcount(i);
  267. }
  268. this.query()
  269. this.getHomePage()
  270. },
  271. methods: {
  272. switchBtn(e){
  273. var obj=this.columns[e[0]]
  274. uni.showLoading({
  275. title: "加载中",
  276. mask: true,
  277. })
  278. API.switchUser({
  279. newUserId:obj.value
  280. }).then((response) => {
  281. uni.hideLoading();
  282. this.query(true)
  283. }).catch(error => {
  284. uni.hideLoading();
  285. })
  286. //
  287. },
  288. query(bl){
  289. uni.showLoading({
  290. title: "加载中",
  291. mask: true,
  292. })
  293. API.findByOpenId({
  294. openId: this.carhelp.getOpenId(),
  295. }).then((response) => {
  296. //this.loginset(response)
  297. var token = response ? response.data.token : '';
  298. this.carhelp.setToken(token);
  299. this.carhelp.setPersonInfo(response.data.user);
  300. this.carhelp.setPersonInfoPlus(response.data)
  301. this.info=response.data.user
  302. this.isswitch=response.data.haveOtherUser;
  303. if(this.isswitch){
  304. this.allUserList()
  305. }
  306. if(bl){
  307. this.getHomePage()
  308. }
  309. uni.hideLoading();
  310. }).catch(error => {
  311. uni.hideLoading();
  312. })
  313. },
  314. allUserList(){
  315. API.allUserList({
  316. }).then((response) => {
  317. var list=response.data.allUserList;
  318. this.columns=[]
  319. for(var i in list){
  320. var obj=list[i]
  321. if(obj.isCurrentUser){
  322. this.columnsindex=[i]
  323. }
  324. this.columns.push({
  325. value:obj.id,
  326. label:obj.merchantAccountName
  327. })
  328. }
  329. }).catch(error => {
  330. uni.hideLoading();
  331. })
  332. },
  333. getPhone(phone){
  334. var backphone="";
  335. if(phone){
  336. backphone=substrMb(phone,0,3)+"****"+substrMb(phone,7,4)
  337. }
  338. return backphone;
  339. },
  340. showModel(){
  341. var bankCard="";
  342. var sss=""
  343. if(this.home.bankCard){
  344. bankCard=substrMb(this.home.bankCard,0,4)+"****"+substrMb(this.home.bankCard,this.home.bankCard.length-4,4)
  345. }
  346. var code=this.home.bank+":"+bankCard;
  347. if(this.home.bank==null&&this.home.bankCard==null){
  348. code="未绑定"
  349. }
  350. uni.showModal({
  351. showCancel:false,
  352. content:code,
  353. })
  354. },
  355. logoutApi(){
  356. uni.showLoading({
  357. title: "加载中",
  358. mask: true,
  359. })
  360. var data = {
  361. };
  362. API.logout(data).then((res) => {
  363. this.carhelp.setToken("");
  364. this.carhelp.set("merchantUser_token_tdate","")
  365. this.carhelp.setPersonInfo("");
  366. this.carhelp.setPersonInfoPlus("" )
  367. uni.reLaunch({
  368. url:"/pagesFinance/login/index?phone="+this.info.phone
  369. })
  370. }).catch(error => {
  371. uni.showToast({
  372. title: error
  373. })
  374. })
  375. },
  376. logout(){
  377. uni.showModal({
  378. title: '提示',
  379. content: '确认是否退出?',
  380. success: res=> {
  381. if (res.confirm) {
  382. //付钱 改为组件
  383. this.logoutApi();
  384. } else if (res.cancel) {
  385. console.log('用户点击取消');
  386. }
  387. }
  388. });
  389. },
  390. phone(){
  391. uni.makePhoneCall({
  392. phoneNumber:this.tel //仅为示例
  393. });
  394. },
  395. getHomePage(){
  396. uni.showLoading({
  397. title: "加载中",
  398. mask: true,
  399. })
  400. API.homePage().then((res) => {
  401. this.home = res.data
  402. if(res.data.vipPlatformList){
  403. this.vipPlatformList=res.data.vipPlatformList
  404. }
  405. uni.hideLoading()
  406. }).catch(error => {
  407. uni.showToast({
  408. title: error
  409. })
  410. })
  411. }
  412. }
  413. }
  414. </script>
  415. <style>
  416. page{
  417. background:url(../../assets/img/index_header_bg.png) no-repeat top center #f7f7f7;
  418. background-size: 100%;
  419. }
  420. </style>
  421. <style lang="scss" scoped>
  422. .navbar-tit {
  423. color: #fff;
  424. font-size: 18px;
  425. text-align: right;
  426. width: 100%;
  427. padding-top: 3px;
  428. padding-right: 3px;
  429. }
  430. .userCell{
  431. background-color: #fff;
  432. border-radius: 8px;
  433. margin: 16px;
  434. .userCell-item{
  435. display: flex;
  436. justify-content: space-between;
  437. align-items: center;
  438. padding: 16px;
  439. .userCell-title{
  440. display: flex;
  441. align-items: center;
  442. p{
  443. margin-left: 8px;
  444. }
  445. }
  446. span{
  447. color:#999;
  448. }
  449. }
  450. }
  451. .userInfo{
  452. // background-color: #fff;
  453. background: linear-gradient(#fff2eb,#ffffff);
  454. margin: 16px;
  455. padding: 16px;
  456. border-radius: 8px;
  457. p{
  458. color:#637AA2;
  459. }
  460. .userInfo-main2{
  461. width: 100%;
  462. margin-top: 4px;
  463. align-items: center;
  464. h2{
  465. flex: 1;
  466. font-size: 44rpx;
  467. }
  468. }
  469. .userInfo-main{
  470. display: flex;
  471. justify-content: space-between;
  472. margin-top: 4px;
  473. align-items: center;
  474. h2{
  475. flex: 1;
  476. font-size: 64rpx;
  477. display: flex;
  478. justify-content: space-between;
  479. .withdraw{
  480. margin: auto 0;
  481. width: 80px;
  482. height:30px;
  483. line-height: 28px;
  484. border-radius: 20px;
  485. background-color: rgba(255, 133, 1, 100);
  486. color: rgba(255, 255, 255, 100);
  487. font-size: 14px;
  488. text-align: center;
  489. }
  490. }
  491. }
  492. .userInfo-btn{
  493. padding: 6px 10px;
  494. background-color: #FF8501;
  495. color:#fff;
  496. border-radius: 15px;
  497. }
  498. .userInfo-foot{
  499. display: flex;
  500. justify-content: space-between;
  501. margin-top: 12px;
  502. .userInfo-item{
  503. flex: 1;
  504. h4{
  505. font-size: 16px;
  506. margin-top: 4px;
  507. }
  508. }
  509. }
  510. }
  511. .userHead{
  512. display: flex;
  513. align-items: center;
  514. padding:40px 20px 0;
  515. .userHead-img{
  516. }
  517. .userHead-text{
  518. margin-left: 12px;
  519. h3{
  520. font-size: 24px;
  521. color:#fff;
  522. font-weight: normal;
  523. }
  524. .userHead-text-position{
  525. display: flex;
  526. align-items: center;
  527. margin-top: 5px;
  528. p{
  529. color:#fff;
  530. margin-left: 4px;
  531. }
  532. }
  533. }
  534. }
  535. .userData{
  536. background-color: #fff;
  537. margin: 16px;
  538. padding: 16px;
  539. border-radius: 8px;
  540. display: flex;
  541. }
  542. .userData-item{
  543. flex: 1;
  544. display: flex;
  545. flex-direction: column;
  546. align-items: center;
  547. justify-content:space-between;
  548. .userData-data{
  549. font-size: 24px;
  550. font-weight: bold;
  551. }
  552. .userData-name{
  553. font-size: 16px;
  554. }
  555. .userData-foot{
  556. margin-top: 4px;
  557. color:#637AA2;
  558. }
  559. }
  560. //功能菜单
  561. .function-menu{
  562. margin: 12px 16px;
  563. background-color: #fff;
  564. border-radius: 8px;
  565. padding: 0 13px;
  566. display: flex;
  567. flex-wrap: wrap;
  568. }
  569. @media screen and (max-width: 375px) {
  570. .item {
  571. width: 33% !important;
  572. }
  573. }
  574. .item{
  575. min-width: 25%;
  576. margin-top: 20px;
  577. margin-bottom: 11px;
  578. display: flex;
  579. flex-direction: column;
  580. align-items: center;
  581. color: rgba(119, 119, 119, 100);
  582. i{
  583. font-size: 24px
  584. }
  585. .item-name{
  586. font-size: 14px;
  587. margin-top: 8px;
  588. }
  589. }
  590. .logout-btn{
  591. background-color: #fff;
  592. margin: 12px 16px;
  593. border: 8px;
  594. color: rgba(238, 49, 56, 100);
  595. font-size: 16px;
  596. line-height: 40px;
  597. }
  598. .position {
  599. position: relative;
  600. top: -75px;
  601. //left: 24%;
  602. height: 0px;
  603. z-index: 999;
  604. }
  605. #talkbubble {
  606. position: absolute;
  607. top: 0;
  608. left: 0;
  609. padding: 1px 20rpx;
  610. line-height: 40rpx;
  611. font-size: 24rpx;
  612. color: #fff;
  613. background: red;
  614. position: relative;
  615. border-radius: 10px;
  616. text-align: center;
  617. }
  618. #talkbubble:before {
  619. content: "";
  620. position: absolute;
  621. top: 100%;
  622. right: 20%;
  623. border-top: 5px solid red;
  624. border-right: 5px solid transparent;
  625. border-left: 5px solid transparent;
  626. }
  627. </style>