Internship-position.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. <template>
  2. <view class="flex-common-css iPhone-bottom box-border-box">
  3. <Nav title="实习岗位" leftColor="#fff" bgckgroundBox='transparent' titleColor="#fff"></Nav>
  4. <image class="bg" src="@/static/img/index/sxgw.png" mode=""></image>
  5. <image class="code-img" :src="codeImg" mode="aspectFit"></image>
  6. <image @click="saveImg" class="but-img" src="@/static/img/index/bcdxc.png" mode=""></image>
  7. </view>
  8. </template>
  9. <script>
  10. import {
  11. commonPracticeCode
  12. } from "@/api/common.js"
  13. export default {
  14. components: {},
  15. data() {
  16. return {
  17. codeImg: ''
  18. };
  19. },
  20. onLoad(data) {},
  21. mounted() {
  22. this.commonPracticeCode()
  23. },
  24. methods: {
  25. commonPracticeCode() {
  26. commonPracticeCode().then((res) => {
  27. if (res.code == 1) {
  28. this.codeImg = res.data.url
  29. }
  30. })
  31. },
  32. scrolltolower() {
  33. console.log('触底');
  34. },
  35. saveImg() {
  36. uni.downloadFile({
  37. url: this.codeImg,
  38. success: downloadResult => {
  39. if (downloadResult.statusCode === 200) {
  40. // 下载成功,保存图片到系统相册
  41. uni.saveImageToPhotosAlbum({
  42. filePath: downloadResult.tempFilePath,
  43. success: () => {
  44. uni.showToast({
  45. title: '图片保存成功'
  46. });
  47. },
  48. fail: () => {
  49. uni.showToast({
  50. title: '图片保存失败',
  51. icon: 'none'
  52. });
  53. }
  54. });
  55. } else {
  56. uni.showToast({
  57. title: '图片下载失败',
  58. icon: 'none'
  59. });
  60. }
  61. },
  62. fail: () => {
  63. uni.showToast({
  64. title: '图片下载失败',
  65. icon: 'none'
  66. });
  67. }
  68. });
  69. },
  70. },
  71. }
  72. </script>
  73. <style lang="scss" scoped>
  74. .bg {
  75. width: 100%;
  76. height: 100vh;
  77. position: fixed;
  78. left: 0;
  79. top: 0;
  80. }
  81. .but-img {
  82. width: 670rpx;
  83. height: 88rpx;
  84. position: absolute;
  85. bottom: 56rpx;
  86. left: 40rpx;
  87. }
  88. .code-img {
  89. width: 340rpx;
  90. height: 340rpx;
  91. position: absolute;
  92. top: calc(50vh - (340rpx / 2));
  93. left: 204rpx;
  94. border-radius: 20rpx;
  95. }
  96. </style>