guide.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <template>
  2. <view class="pages">
  3. <view class="" style="font-size: 36rpx;font-weight: 700;">
  4. 专属森林向导提醒您
  5. </view>
  6. <view class="content">
  7. <u-parse :content="muster.muster"></u-parse>
  8. </view>
  9. <view class="" style="font-size: 36rpx;font-weight: 700;">
  10. 您的专属森林向导
  11. </view>
  12. <view class="image">
  13. <image :src="muster.qrcode_url" mode="aspectFill"></image>
  14. </view>
  15. <view class="submit" @click="savePoster()">
  16. 保存二维码到相册
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. data() {
  23. return {
  24. muster: ''
  25. }
  26. },
  27. onLoad(o) {
  28. if (o.muster) {
  29. let muster = decodeURIComponent(o.muster)
  30. this.muster = JSON.parse(muster)
  31. }
  32. },
  33. methods: {
  34. init() {
  35. let list = uni.getStorageSync("data")
  36. // console.log(list[5])
  37. this.list = list[5].value.phone
  38. },
  39. toPhone(item) {
  40. uni.makePhoneCall({
  41. phoneNumber: item //仅为示例
  42. });
  43. },
  44. savePoster() {
  45. uni.getSetting({ //获取用户的当前设置
  46. success: (res) => {
  47. if (res.authSetting['scope.writePhotosAlbum']) { //验证用户是否授权可以访问相册
  48. this.saveImageToPhotosAlbum();
  49. } else {
  50. uni.authorize({ //如果没有授权,向用户发起请求
  51. scope: 'scope.writePhotosAlbum',
  52. success: () => {
  53. this.saveImageToPhotosAlbum();
  54. },
  55. fail: () => {
  56. uni.showToast({
  57. title: "请打开保存相册权限,再点击保存相册分享",
  58. icon: "none",
  59. duration: 3000
  60. });
  61. setTimeout(() => {
  62. uni.openSetting({ //调起客户端小程序设置界面,让用户开启访问相册
  63. success: (res2) => {
  64. this.saveImageToPhotosAlbum()
  65. // console.log(res2.authSetting)
  66. }
  67. });
  68. }, 3000);
  69. }
  70. })
  71. }
  72. }
  73. })
  74. },
  75. saveImageToPhotosAlbum() {
  76. let base64 = this.muster.qrcode_url.replace(/^data:image\/\w+;base64,/, ""); //去掉data:image/png;base64,
  77. let filePath = wx.env.USER_DATA_PATH + '/ph_fit_qrcode.png';
  78. uni.showLoading({
  79. title: '加载中',
  80. mask: true
  81. })
  82. uni.getFileSystemManager().writeFile({
  83. filePath: filePath, //创建一个临时文件名
  84. data: base64, //写入的文本或二进制数据
  85. encoding: 'base64', //写入当前文件的字符编码
  86. success: res => {
  87. uni.saveImageToPhotosAlbum({
  88. filePath: filePath,
  89. success: function(res2) {
  90. uni.hideLoading();
  91. uni.showToast({
  92. title: '保存成功',
  93. icon: "none",
  94. duration: 5000
  95. })
  96. },
  97. fail: function(err) {
  98. uni.hideLoading();
  99. // console.log(err.errMsg);
  100. }
  101. })
  102. },
  103. fail: err => {
  104. uni.hideLoading();
  105. //console.log(err)
  106. }
  107. })
  108. },
  109. }
  110. }
  111. </script>
  112. <style lang="less">
  113. page {
  114. background-color: #F4F4F4;
  115. font-size: 28rpx;
  116. }
  117. .pages {
  118. margin: 40rpx 30rpx;
  119. .content {
  120. margin: 24rpx 0 94rpx;
  121. }
  122. .image {
  123. width: 200rpx;
  124. height: 200rpx;
  125. background-color: pink;
  126. margin: 40rpx auto 73rpx;
  127. image {
  128. width: 100%;
  129. height: 100%;
  130. }
  131. }
  132. .submit {
  133. margin: 0 auto;
  134. box-sizing: border-box;
  135. text-align: center;
  136. color: #FCFCFC;
  137. width: 654rpx;
  138. height: 92rpx;
  139. line-height: 92rpx;
  140. background: #1E9F6A;
  141. border-radius: 8rpx 16rpx 8rpx 16rpx;
  142. }
  143. }
  144. </style>