orderissuer.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <view :style="getHeight">
  3. <!-- 公共组件-每个页面必须引入 -->
  4. <public-module></public-module>
  5. <view class="content d-flex flex-column a-center j-center">
  6. <image src="/static/image/addStaff/face_sao.png" mode="widthFix" lazy-load style="width: 500upx;"></image>
  7. <image :src="recommendImg" mode="widthFix" lazy-load style="width: 450upx;"></image>
  8. <view>新成员只需要扫描您的二维码,即可马上注册加入啦!</view>
  9. </view>
  10. </view>
  11. </template>
  12. <script>
  13. import {
  14. mapState
  15. } from "vuex"
  16. import QR from "@/common/wxqrcode.js"
  17. export default {
  18. data() {
  19. return {
  20. recommendImg: ""
  21. }
  22. },
  23. computed: {
  24. ...mapState(['userInfo']),
  25. getHeight() {
  26. let height = uni.getSystemInfoSync().windowHeight;
  27. return `height: ${height}px;`;
  28. }
  29. },
  30. onLoad() {
  31. var id = this.userInfo.sysUser.id;
  32. console.log(id)
  33. this.recommendImg = QR.createQrCodeImg(this.$base.h5BaseUrl + "/#/pages/register/orderissuer?id=" + id, {
  34. size: parseInt(200) //二维码大小
  35. })
  36. },
  37. methods: {
  38. }
  39. }
  40. </script>
  41. <style>
  42. .content {
  43. position: absolute;
  44. top: 50%;
  45. left: 50%;
  46. transform: translate(-50%, -60%);
  47. }
  48. .content>image {
  49. margin-top: 30upx;
  50. margin-bottom: 30upx;
  51. }
  52. .content>view {
  53. width: 400upx;
  54. color: red;
  55. text-align: center;
  56. }
  57. </style>