You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

266 lines
7.5 KiB

  1. import WeCropper from '../../Components/we-cropper/we-cropper.js'
  2. const configs = require('../../config/config.js')
  3. const app = getApp()
  4. const config = app.globalData.config
  5. const device = wx.getSystemInfoSync()
  6. const width = device.windowWidth
  7. const height = device.windowHeight - 50
  8. Page({
  9. data: {
  10. cropperOpt: {
  11. id: 'cropper',
  12. targetId: 'targetCropper',
  13. pixelRatio: device.pixelRatio,
  14. width,
  15. height,
  16. scale: 2.5,
  17. zoom: 8,
  18. cut: {
  19. x: (width - 300) / 2,
  20. y: (height - 300) / 2,
  21. width: 300,
  22. height: 170
  23. },
  24. boundStyle: {
  25. color: config.getThemeColor(),
  26. mask: 'rgba(0,0,0,0.8)',
  27. lineWidth: 1
  28. }
  29. }
  30. },
  31. touchStart(e) {
  32. this.cropper.touchStart(e)
  33. },
  34. touchMove(e) {
  35. this.cropper.touchMove(e)
  36. },
  37. touchEnd(e) {
  38. this.cropper.touchEnd(e)
  39. },
  40. getCropperImage() {
  41. this.wecropper.getCropperImage((tempFilePath) => {
  42. // tempFilePath 为裁剪后的图片临时路径
  43. if (tempFilePath) {
  44. console.log(this.data.save, 'this.data.save');
  45. let onlineFilePath = ""
  46. if (this.data.save == 1) {
  47. wx.showLoading({
  48. title: '正在上传,请稍后'
  49. })
  50. var pages = getCurrentPages();
  51. var prevPage = pages[pages.length - 2]; //上一个页面
  52. console.log(tempFilePath, 'tempFilePath');
  53. wx.uploadFile({
  54. url: configs.api.imgUpload,
  55. filePath: tempFilePath,
  56. name: 'file',
  57. header: {
  58. 'token': app.globalData.token
  59. },
  60. success(res) {
  61. wx.hideLoading();
  62. onlineFilePath = JSON.parse(res.data).data
  63. console.log(onlineFilePath.url, 'onlineFilePath');
  64. let tempFilePaths = prevPage.data.tempFilePaths
  65. tempFilePaths.push(onlineFilePath.url)
  66. prevPage.setData({
  67. tempFilePaths
  68. });
  69. wx.navigateBack({
  70. delta: 1
  71. })
  72. },
  73. fail(res) {
  74. wx.hideLoading();
  75. wx.showToast({
  76. title: '网络错误,请稍后再试',
  77. icon: "none",
  78. duration: 2000
  79. })
  80. }
  81. })
  82. } else if (this.data.save == 2) {
  83. var pages = getCurrentPages();
  84. var prevPage = pages[pages.length - 2]; //上一个页面
  85. console.log(tempFilePath, 'tempFilePath');
  86. wx.uploadFile({
  87. url: configs.api.imgUpload,
  88. filePath: tempFilePath,
  89. name: 'file',
  90. header: {
  91. 'token': app.globalData.token
  92. },
  93. success(res) {
  94. wx.hideLoading();
  95. onlineFilePath = JSON.parse(res.data).data
  96. console.log(onlineFilePath.url, 'onlineFilePath');
  97. let BtempFilePaths = prevPage.data.BtempFilePaths
  98. BtempFilePaths.push(onlineFilePath.url)
  99. prevPage.setData({
  100. BtempFilePaths
  101. });
  102. wx.navigateBack({
  103. delta: 1
  104. })
  105. },
  106. fail(res) {
  107. wx.hideLoading();
  108. wx.showToast({
  109. title: '网络错误,请稍后再试',
  110. icon: "none",
  111. duration: 2000
  112. })
  113. }
  114. })
  115. } else {
  116. console.log(tempFilePath, 'tempFilePath');
  117. wx.uploadFile({
  118. url: configs.api.imgUpload,
  119. filePath: tempFilePath,
  120. name: 'file',
  121. header: {
  122. 'token': app.globalData.token
  123. },
  124. success(res) {
  125. wx.hideLoading();
  126. onlineFilePath = JSON.parse(res.data).data
  127. console.log(onlineFilePath.url, 'onlineFilePath');
  128. wx.redirectTo({
  129. url: `/pages/addReel/addReel?res=${onlineFilePath.url}`
  130. })
  131. },
  132. fail(res) {
  133. wx.hideLoading();
  134. wx.showToast({
  135. title: '网络错误,请稍后再试',
  136. icon: "none",
  137. duration: 2000
  138. })
  139. }
  140. })
  141. }
  142. } else {
  143. console.log('获取图片地址失败,请稍后重试')
  144. }
  145. })
  146. },
  147. uploadTap() {
  148. const self = this
  149. wx.chooseImage({
  150. count: 1, // 默认9
  151. sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
  152. sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
  153. success(res) {
  154. const src = res.tempFilePaths[0]
  155. // 获取裁剪图片资源后,给data添加src属性及其值
  156. self.cropper.pushOrign(src)
  157. },
  158. })
  159. },
  160. onLoad(option) {
  161. let _this = this;
  162. // console.log(app.globalData.mouldType,"mouldType")
  163. if (app.globalData.mouldType == 1) {
  164. _this.setData({
  165. cropperOpt: {
  166. id: 'cropper',
  167. targetId: 'targetCropper',
  168. pixelRatio: device.pixelRatio,
  169. width,
  170. height,
  171. scale: 2.5,
  172. zoom: 8,
  173. cut: {
  174. x: (width - 300) / 2,
  175. y: (height - 300) / 2,
  176. width: 300,
  177. height: 300
  178. },
  179. boundStyle: {
  180. color: config.getThemeColor(),
  181. mask: 'rgba(0,0,0,0.8)',
  182. lineWidth: 1
  183. }
  184. }
  185. })
  186. } else {
  187. _this.setData({
  188. cropperOpt: {
  189. id: 'cropper',
  190. targetId: 'targetCropper',
  191. pixelRatio: device.pixelRatio,
  192. width,
  193. height,
  194. scale: 2.5,
  195. zoom: 8,
  196. cut: {
  197. x: (width - 300) / 2,
  198. y: (height - 300) / 2,
  199. width: 300,
  200. height: 170
  201. },
  202. boundStyle: {
  203. color: config.getThemeColor(),
  204. mask: 'rgba(0,0,0,0.8)',
  205. lineWidth: 1
  206. }
  207. }
  208. })
  209. }
  210. if (option.save) {
  211. _this.setData({
  212. save: option.save
  213. })
  214. }
  215. wx.chooseImage({
  216. count: 1,
  217. sizeType: ['original', 'compressed'],
  218. sourceType: ['album', 'camera'],
  219. success(res) {
  220. // tempFilePath可以作为img标签的src属性显示图片
  221. const src = res.tempFilePaths[0]
  222. const { cropperOpt } = _this.data
  223. cropperOpt.boundStyle.color = config.getThemeColor()
  224. _this.setData({ cropperOpt })
  225. if (src) {
  226. cropperOpt.src = src
  227. _this.cropper = new WeCropper(cropperOpt)
  228. .on('ready', (ctx) => {
  229. console.log(`wecropper is ready for work!`)
  230. })
  231. .on('beforeImageLoad', (ctx) => {
  232. console.log(`before picture loaded, i can do something`)
  233. console.log(`current canvas context:`, ctx)
  234. wx.showToast({
  235. title: '上传中',
  236. icon: 'loading',
  237. duration: 20000
  238. })
  239. })
  240. .on('imageLoad', (ctx) => {
  241. console.log(`picture loaded`)
  242. console.log(`current canvas context:`, ctx)
  243. wx.hideToast()
  244. })
  245. .on('beforeDraw', (ctx, instance) => {
  246. console.log(`before canvas draw,i can do something`)
  247. console.log(`current canvas context:`, ctx)
  248. })
  249. }
  250. },
  251. fail(res) {
  252. wx.navigateBack({
  253. delta: 1
  254. })
  255. }
  256. })
  257. }
  258. })