feat(share): add loading
This commit is contained in:
		
							parent
							
								
									53ba3e54e4
								
							
						
					
					
						commit
						ccd5a0ddbc
					
				| 
						 | 
					@ -127,14 +127,6 @@ export default {
 | 
				
			||||||
        this.$emit('background-image-error', e)
 | 
					        this.$emit('background-image-error', e)
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    // 处理分享图片生成完成
 | 
					 | 
				
			||||||
    handleShareGenerated(dataUrl) {
 | 
					 | 
				
			||||||
      uni.showToast({
 | 
					 | 
				
			||||||
        title: '图片生成成功,请长按保存',
 | 
					 | 
				
			||||||
        icon: 'success',
 | 
					 | 
				
			||||||
        duration: 2000,
 | 
					 | 
				
			||||||
      })
 | 
					 | 
				
			||||||
    },
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // 获取特殊场景背景图片
 | 
					    // 获取特殊场景背景图片
 | 
				
			||||||
    async getBackgroundImage() {
 | 
					    async getBackgroundImage() {
 | 
				
			||||||
| 
						 | 
					@ -251,7 +243,7 @@ export default {
 | 
				
			||||||
              .then(canvas => {
 | 
					              .then(canvas => {
 | 
				
			||||||
                const dataUrl = canvas.toDataURL('image/jpeg', 1.0)
 | 
					                const dataUrl = canvas.toDataURL('image/jpeg', 1.0)
 | 
				
			||||||
                uni.hideLoading()
 | 
					                uni.hideLoading()
 | 
				
			||||||
                this.handleShareGenerated(dataUrl)
 | 
					                // this.handleShareGenerated(dataUrl)
 | 
				
			||||||
                this.$emit('share-generated', dataUrl)
 | 
					                this.$emit('share-generated', dataUrl)
 | 
				
			||||||
                resolve()
 | 
					                resolve()
 | 
				
			||||||
              })
 | 
					              })
 | 
				
			||||||
| 
						 | 
					@ -354,7 +346,7 @@ export default {
 | 
				
			||||||
                  const dataUrl = canvas.toDataURL('image/jpeg')
 | 
					                  const dataUrl = canvas.toDataURL('image/jpeg')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
                  uni.hideLoading()
 | 
					                  uni.hideLoading()
 | 
				
			||||||
                  this.handleShareGenerated(dataUrl)
 | 
					                  // this.handleShareGenerated(dataUrl)
 | 
				
			||||||
                  this.$emit('share-generated', dataUrl)
 | 
					                  this.$emit('share-generated', dataUrl)
 | 
				
			||||||
                  resolve()
 | 
					                  resolve()
 | 
				
			||||||
                } catch (err) {
 | 
					                } catch (err) {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -20,7 +20,7 @@ module.exports = vm => {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    //#ifdef DEV_SERVER
 | 
					    //#ifdef DEV_SERVER
 | 
				
			||||||
    console.log('DEV_SERVER')
 | 
					    console.log('DEV_SERVER')
 | 
				
			||||||
    config.baseURL = 'http://192.168.0.86:8080'
 | 
					    config.baseURL = 'http://t-app.beida777.com/prod-api'
 | 
				
			||||||
    //#endif
 | 
					    //#endif
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    //#ifdef QA_SERVER
 | 
					    //#ifdef QA_SERVER
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -31,14 +31,12 @@
 | 
				
			||||||
      <view
 | 
					      <view
 | 
				
			||||||
        class="wechat-fullscreen-overlay"
 | 
					        class="wechat-fullscreen-overlay"
 | 
				
			||||||
        v-show="(isWechat || userInfo.sharePosterImage) && generatedImageUrl"
 | 
					        v-show="(isWechat || userInfo.sharePosterImage) && generatedImageUrl"
 | 
				
			||||||
        @click="closeFullscreenImage"
 | 
					 | 
				
			||||||
      >
 | 
					      >
 | 
				
			||||||
        <img
 | 
					        <img
 | 
				
			||||||
          class="fullscreen-image"
 | 
					          class="fullscreen-image"
 | 
				
			||||||
          :src="generatedImageUrl"
 | 
					          :src="generatedImageUrl"
 | 
				
			||||||
          width="100%"
 | 
					          width="100%"
 | 
				
			||||||
          height="100%"
 | 
					          height="100%"
 | 
				
			||||||
          @load="onGeneratedImageLoad"
 | 
					 | 
				
			||||||
          @click.stop=""
 | 
					          @click.stop=""
 | 
				
			||||||
        />
 | 
					        />
 | 
				
			||||||
      </view>
 | 
					      </view>
 | 
				
			||||||
| 
						 | 
					@ -90,6 +88,9 @@ export default {
 | 
				
			||||||
        this.canvasHeight = res.windowHeight
 | 
					        this.canvasHeight = res.windowHeight
 | 
				
			||||||
      },
 | 
					      },
 | 
				
			||||||
    })
 | 
					    })
 | 
				
			||||||
 | 
					    uni.showLoading({
 | 
				
			||||||
 | 
					      title: '加载中...',
 | 
				
			||||||
 | 
					    })
 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
  onReady() {
 | 
					  onReady() {
 | 
				
			||||||
    // 短暂延迟后启用加载动画
 | 
					    // 短暂延迟后启用加载动画
 | 
				
			||||||
| 
						 | 
					@ -146,6 +147,7 @@ export default {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // 处理分享图片生成完成
 | 
					    // 处理分享图片生成完成
 | 
				
			||||||
    handleShareGenerated(dataUrl) {
 | 
					    handleShareGenerated(dataUrl) {
 | 
				
			||||||
 | 
					      uni.hideLoading()
 | 
				
			||||||
      this.$nextTick(() => {
 | 
					      this.$nextTick(() => {
 | 
				
			||||||
        this.sourceVisible = false
 | 
					        this.sourceVisible = false
 | 
				
			||||||
      })
 | 
					      })
 | 
				
			||||||
| 
						 | 
					@ -172,17 +174,6 @@ export default {
 | 
				
			||||||
      link.click()
 | 
					      link.click()
 | 
				
			||||||
      document.body.removeChild(link)
 | 
					      document.body.removeChild(link)
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
 | 
					 | 
				
			||||||
    // 生成的图片加载成功
 | 
					 | 
				
			||||||
    onGeneratedImageLoad() {
 | 
					 | 
				
			||||||
      console.log('生成的图片加载成功')
 | 
					 | 
				
			||||||
    },
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    // 关闭全屏图片
 | 
					 | 
				
			||||||
    closeFullscreenImage() {
 | 
					 | 
				
			||||||
      this.generatedImageUrl = ''
 | 
					 | 
				
			||||||
      console.log('关闭全屏图片')
 | 
					 | 
				
			||||||
    },
 | 
					 | 
				
			||||||
  },
 | 
					  },
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in New Issue