QRCode.vue 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. <template>
  2. <view class="content" @click="maskClick">
  3. <view class="qrcode">
  4. <!-- <uqrcode ref="uqrcode"></uqrcode> -->
  5. <img :src="imgSrc" alt="" class="img">
  6. <!-- <view class="qrcode-text">客户扫码</view> -->
  7. </view>
  8. <u-modal v-model="isShowAlert" :title-style="{fontSize: '18px',fontWeight:'500'}"
  9. :content-style="{fontSize: '14px',fontWeight:'400'}" confirm-color='#22C572' confirm-text='确定' title='提示'
  10. :showCancelButton='false' :content="content" @confirm="alertBtn" @cancel="cancelClick"></u-modal>
  11. </view>
  12. </template>
  13. <script>
  14. import {
  15. mapState
  16. } from 'vuex';
  17. export default {
  18. data() {
  19. return {
  20. imgSrc: "",
  21. isShowAlert: false,
  22. content: '登录信息过期需要重新登录,是否立即登录?',
  23. };
  24. },
  25. onReady() {
  26. this.$api.doRequest('get', '/commonUser/api/checkSession').then(res => {
  27. if (res.data.data == "INVALID") {
  28. this.isShowAlert = true;
  29. // uni.showModal({
  30. // title: "提示",
  31. // content: "Session过期需要重新登录,是否立即登录",
  32. // showCancel: true,
  33. // confirmText: '登录',
  34. // success(e) {
  35. // if (e.confirm) {
  36. // uni.navigateTo({
  37. // url: '/pages/public/login'
  38. // })
  39. // }
  40. // }
  41. // })
  42. } else {
  43. this.getQRCode()
  44. }
  45. })
  46. .catch(res => {
  47. if (res.message) {
  48. uni.showToast({
  49. title: res.message,
  50. icon: 'none',
  51. duration: 2000
  52. })
  53. }
  54. });
  55. // console.log(this.userInfo)
  56. // this.$refs
  57. // .uqrcode
  58. // .make({
  59. // size: 300,
  60. // margin:50,
  61. // text: JSON.stringify({
  62. // userName:this.userInfo.userName,
  63. // })
  64. // })
  65. // .then(res => {
  66. // // 返回的res与uni.canvasToTempFilePath返回一致
  67. // console.log(res)
  68. // })
  69. },
  70. computed: {
  71. ...mapState(['hasLogin', 'userInfo'])
  72. },
  73. methods: {
  74. alertBtn() {
  75. uni.navigateTo({
  76. url: '/pages/public/login'
  77. })
  78. },
  79. cancelClick() {
  80. this.isShowAlert = false
  81. },
  82. maskClick() {
  83. uni.navigateBack(-1)
  84. },
  85. getQRCode() {
  86. this.$api.doRequest('get', '/identityAuthenticationInfo/generateQRCodeImage').then(res => {
  87. this.imgSrc = res.data.data
  88. })
  89. .catch(res => {
  90. if (res.message) {
  91. uni.showToast({
  92. title: res.message,
  93. icon: 'none',
  94. duration: 2000
  95. })
  96. }
  97. });
  98. }
  99. }
  100. }
  101. </script>
  102. <style lang="scss">
  103. .content {
  104. background: rgba(0, 0, 0, 0.4);
  105. height: 100vh;
  106. display: flex;
  107. justify-content: center;
  108. align-items: center;
  109. }
  110. .qrcode-text {
  111. text-align: center;
  112. position: relative;
  113. font-size: 24rpx;
  114. font-weight: 400;
  115. color: #878C9C;
  116. top: -40rpx;
  117. }
  118. .qrcode {
  119. position: fixed;
  120. top: 30%;
  121. margin: auto;
  122. }
  123. .img {
  124. width: 400rpx;
  125. }
  126. </style>