|
- import WeCropper from '../../Components/we-cropper/we-cropper.js'
- const configs = require('../../config/config.js')
- const app = getApp()
- const config = app.globalData.config
-
- const device = wx.getSystemInfoSync()
- const width = device.windowWidth
- const height = device.windowHeight - 50
-
- Page({
- data: {
- cropperOpt: {
- id: 'cropper',
- targetId: 'targetCropper',
- pixelRatio: device.pixelRatio,
- width,
- height,
- scale: 2.5,
- zoom: 8,
- cut: {
- x: (width - 300) / 2,
- y: (height - 300) / 2,
- width: 300,
- height: 170
- },
- boundStyle: {
- color: config.getThemeColor(),
- mask: 'rgba(0,0,0,0.8)',
- lineWidth: 1
- }
- }
- },
- touchStart(e) {
- this.cropper.touchStart(e)
- },
- touchMove(e) {
- this.cropper.touchMove(e)
- },
- touchEnd(e) {
- this.cropper.touchEnd(e)
- },
- getCropperImage() {
- this.wecropper.getCropperImage((tempFilePath) => {
- // tempFilePath 为裁剪后的图片临时路径
- if (tempFilePath) {
- console.log(this.data.save, 'this.data.save');
- let onlineFilePath = ""
- if (this.data.save == 1) {
- wx.showLoading({
- title: '正在上传,请稍后'
- })
- var pages = getCurrentPages();
- var prevPage = pages[pages.length - 2]; //上一个页面
- console.log(tempFilePath, 'tempFilePath');
-
- wx.uploadFile({
- url: configs.api.imgUpload,
- filePath: tempFilePath,
- name: 'file',
- header: {
- 'token': app.globalData.token
- },
- success(res) {
- wx.hideLoading();
- onlineFilePath = JSON.parse(res.data).data
- console.log(onlineFilePath.url, 'onlineFilePath');
-
- let tempFilePaths = prevPage.data.tempFilePaths
- tempFilePaths.push(onlineFilePath.url)
-
- prevPage.setData({
- tempFilePaths
- });
- wx.navigateBack({
- delta: 1
- })
- },
- fail(res) {
- wx.hideLoading();
- wx.showToast({
- title: '网络错误,请稍后再试',
- icon: "none",
- duration: 2000
- })
- }
- })
- } else if (this.data.save == 2) {
- var pages = getCurrentPages();
- var prevPage = pages[pages.length - 2]; //上一个页面
- console.log(tempFilePath, 'tempFilePath');
-
- wx.uploadFile({
- url: configs.api.imgUpload,
- filePath: tempFilePath,
- name: 'file',
- header: {
- 'token': app.globalData.token
- },
- success(res) {
- wx.hideLoading();
- onlineFilePath = JSON.parse(res.data).data
- console.log(onlineFilePath.url, 'onlineFilePath');
- let BtempFilePaths = prevPage.data.BtempFilePaths
- BtempFilePaths.push(onlineFilePath.url)
-
- prevPage.setData({
- BtempFilePaths
- });
- wx.navigateBack({
- delta: 1
- })
- },
- fail(res) {
- wx.hideLoading();
- wx.showToast({
- title: '网络错误,请稍后再试',
- icon: "none",
- duration: 2000
- })
- }
- })
- } else {
- console.log(tempFilePath, 'tempFilePath');
- wx.uploadFile({
- url: configs.api.imgUpload,
- filePath: tempFilePath,
- name: 'file',
- header: {
- 'token': app.globalData.token
- },
- success(res) {
- wx.hideLoading();
- onlineFilePath = JSON.parse(res.data).data
- console.log(onlineFilePath.url, 'onlineFilePath');
- wx.redirectTo({
- url: `/pages/addReel/addReel?res=${onlineFilePath.url}`
- })
- },
- fail(res) {
- wx.hideLoading();
- wx.showToast({
- title: '网络错误,请稍后再试',
- icon: "none",
- duration: 2000
- })
- }
- })
- }
- } else {
- console.log('获取图片地址失败,请稍后重试')
- }
- })
- },
- uploadTap() {
- const self = this
- wx.chooseImage({
- count: 1, // 默认9
- sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
- sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
- success(res) {
- const src = res.tempFilePaths[0]
- // 获取裁剪图片资源后,给data添加src属性及其值
-
- self.cropper.pushOrign(src)
- },
- })
- },
- onLoad(option) {
- let _this = this;
- // console.log(app.globalData.mouldType,"mouldType")
- if (app.globalData.mouldType == 1) {
- _this.setData({
- cropperOpt: {
- id: 'cropper',
- targetId: 'targetCropper',
- pixelRatio: device.pixelRatio,
- width,
- height,
- scale: 2.5,
- zoom: 8,
- cut: {
- x: (width - 300) / 2,
- y: (height - 300) / 2,
- width: 300,
- height: 300
- },
- boundStyle: {
- color: config.getThemeColor(),
- mask: 'rgba(0,0,0,0.8)',
- lineWidth: 1
- }
- }
- })
- } else {
- _this.setData({
- cropperOpt: {
- id: 'cropper',
- targetId: 'targetCropper',
- pixelRatio: device.pixelRatio,
- width,
- height,
- scale: 2.5,
- zoom: 8,
- cut: {
- x: (width - 300) / 2,
- y: (height - 300) / 2,
- width: 300,
- height: 170
- },
- boundStyle: {
- color: config.getThemeColor(),
- mask: 'rgba(0,0,0,0.8)',
- lineWidth: 1
- }
- }
- })
- }
- if (option.save) {
- _this.setData({
- save: option.save
- })
- }
- wx.chooseImage({
- count: 1,
- sizeType: ['original', 'compressed'],
- sourceType: ['album', 'camera'],
- success(res) {
- // tempFilePath可以作为img标签的src属性显示图片
- const src = res.tempFilePaths[0]
- const { cropperOpt } = _this.data
- cropperOpt.boundStyle.color = config.getThemeColor()
- _this.setData({ cropperOpt })
- if (src) {
- cropperOpt.src = src
- _this.cropper = new WeCropper(cropperOpt)
- .on('ready', (ctx) => {
- console.log(`wecropper is ready for work!`)
- })
- .on('beforeImageLoad', (ctx) => {
- console.log(`before picture loaded, i can do something`)
- console.log(`current canvas context:`, ctx)
- wx.showToast({
- title: '上传中',
- icon: 'loading',
- duration: 20000
- })
- })
- .on('imageLoad', (ctx) => {
- console.log(`picture loaded`)
- console.log(`current canvas context:`, ctx)
- wx.hideToast()
- })
- .on('beforeDraw', (ctx, instance) => {
- console.log(`before canvas draw,i can do something`)
- console.log(`current canvas context:`, ctx)
- })
- }
- },
- fail(res) {
- wx.navigateBack({
- delta: 1
- })
- }
- })
- }
- })
|