imgUploadAndDownLoad.js 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. export default {
  2. methods: {
  3. //删除图片
  4. deleteImage(item) {
  5. uni.showModal({
  6. title: '提示',
  7. content: '确定要删除这张图片吗?',
  8. success: async (res) => {
  9. if (res.confirm) {
  10. // 调接口删除
  11. console.log('现在要删除的文件文件是:', item.id)
  12. try {
  13. await uni.$u.api.deleteClueFile([item.id])
  14. uni.showToast({
  15. title: '删除成功',
  16. icon: 'success',
  17. duration: 2000
  18. })
  19. } catch (error) {
  20. uni.showToast({
  21. title: '删除失败',
  22. icon: 'error',
  23. duration: 2000
  24. })
  25. }
  26. // 删除成功后刷新列表
  27. this.getList('2', '1', this.currentReceipt.id, this.orderDetail.itemBrand);
  28. this.getList('2', '2', this.currentReceipt.id, this.orderDetail.itemBrand);
  29. this.getList('2', '3', this.currentReceipt.id, this.orderDetail.itemBrand);
  30. }
  31. }
  32. })
  33. },
  34. //获取文件列表
  35. async getList(type, orderFileType, receiptID, itemBrand) {
  36. console.log('获取文件列表', type, receiptID)
  37. // console.log('当前的订单id', this.orderDetail.id)
  38. // console.log('当前的收单id', this.currentReceipt.id)
  39. try {
  40. const params = {
  41. clueId: this.orderDetail.clueId,
  42. sourceId: this.currentReceipt.id,//默认先用receiptID查,如果没有返回情况下用orderID查
  43. type,
  44. orderFileType,
  45. isDuplicate: '1',//先传1
  46. pageNum: 1,
  47. pageSize: 1000 // 设置一个较大的值以获取所有数据
  48. }
  49. const response = await uni.$u.api.selectClueFileByDto(params)
  50. if (orderFileType == '1') {
  51. //如果itemBrand里面有逗号的话说明是多个品牌
  52. if (itemBrand.indexOf(',') != -1) {
  53. this.trueUploadList = response.rows.filter(item => item.sourceId == receiptID) || []
  54. } else {
  55. this.trueUploadList = response.rows
  56. }
  57. } else if (orderFileType == '2') {
  58. if (itemBrand.indexOf(',') != -1) {
  59. this.chatRecordsUploadList = response.rows.filter(item => item.sourceId == receiptID) || []
  60. } else {
  61. this.chatRecordsUploadList = response.rows
  62. }
  63. } else if (orderFileType == '3') {
  64. if (itemBrand.indexOf(',') != -1) {
  65. this.detailImages = response.rows.filter(item => item.sourceId == receiptID) || []
  66. } else {
  67. this.detailImages = response.rows
  68. }
  69. }
  70. } catch (error) {
  71. uni.$u.toast(`获取列表失败:${error}`)
  72. this.trueUploadList = []
  73. this.chatRecordsUploadList = []
  74. }
  75. },
  76. // 选择图片
  77. uploadImage(type, receiptID) {
  78. console.log('当前上传的receiptID是', receiptID)
  79. uni.chooseImage({
  80. count: 9, // 最多选择9张
  81. sizeType: ['compressed'], // 压缩图片
  82. sourceType: ['album', 'camera'], // 从相册选择或拍照
  83. success: (res) => {
  84. const tempFilePaths = res.tempFilePaths
  85. console.log('上传的图片路径:11', tempFilePaths)
  86. this.uploadToServer(tempFilePaths, type, receiptID)
  87. },
  88. fail: (err) => {
  89. console.error('选择图片失败:', err)
  90. }
  91. })
  92. },
  93. // 上传到服务器
  94. async uploadToServer(filePaths, type, receiptID) {
  95. // 实际的上传逻辑
  96. try {
  97. //实物图的话就是1,聊天记录的话就是2,高清细节图的话就是3
  98. let p = type == 'truePic' ? '1' : type == 'chatRecords' ? '2' : type == 'detailImages' ? '3' : ''
  99. console.log('当前上传的图片类型是', p)
  100. const res = await Promise.all(filePaths.map(filePath => this.uploadFile(filePath, p)));
  101. this.bindOrder(p, receiptID);
  102. this.getList('2', '1', this.currentReceipt.id, this.orderDetail.itemBrand);
  103. this.getList('2', '2', this.currentReceipt.id, this.orderDetail.itemBrand);
  104. this.getList('2', '3', this.currentReceipt.id, this.orderDetail.itemBrand);
  105. } catch (error) {
  106. console.error('上传失败:', error);
  107. uni.$u.toast('上传失败');
  108. }
  109. },
  110. // 上传文件
  111. async uploadFile(fileUrl, orderFileType) {
  112. try {
  113. uni.showLoading({
  114. title: '上传中...',
  115. mask: true
  116. });
  117. // 调用统一的上传接口
  118. const { data } = await uni.$u.api.uploadFile(fileUrl);
  119. const fileObj = {
  120. fileSize: data.fileSize,
  121. fileSuffix: data.fileSuffix,
  122. fileName: data.name,
  123. fileUrl: data.url,
  124. orderFileType: orderFileType
  125. };
  126. this.bindList.push(fileObj);
  127. } catch (error) {
  128. uni.hideLoading();
  129. console.error('文件上传失败:', error);
  130. uni.$u.toast('上传失败,请重试');
  131. }
  132. },
  133. //绑定订单
  134. async bindOrder(orderFileType, receiptID) {
  135. console.log('当前的收单id', receiptID)
  136. const res = await uni.$u.api.saveClueFile({
  137. clueId: this.orderDetail.clueId,//线索id
  138. list: this.bindList,
  139. // sourceId: this.orderId,//订单id,sendformid,之前是绑定在orderId上面,现在要修改绑定到receiptID上面
  140. sourceId: receiptID,//receiptId,绑定的收单id
  141. type: '2',
  142. orderFileType: orderFileType
  143. });
  144. uni.$u.toast("上传成功");
  145. uni.hideLoading();
  146. // 清空待绑定的图片列表
  147. this.bindList = [];
  148. },
  149. //选择图图片》上传》返回路径,适用于page2选项里面的上传图片
  150. getImageUrl() {
  151. uni.chooseImage({
  152. count: 9, // 最多选择1张
  153. sizeType: ['compressed'], // 压缩图片
  154. sourceType: ['album', 'camera'], // 从相册选择或拍照
  155. success: async (res) => {
  156. const tempFilePath = res.tempFilePaths
  157. console.log('上传的图片路径:', tempFilePath)
  158. // 把blob数组上传到服务器,然后返回路径
  159. try {
  160. const res = await Promise.all(tempFilePath.map(filePath => uni.$u.api.uploadFile(filePath)));
  161. console.log('上传的图片路径数组是:', res.map(item => item.data.fileUrl))
  162. // 把数组返回给调用者
  163. return res.map(item => item.data.fileUrl)
  164. } catch (error) {
  165. console.error('上传失败:', error);
  166. uni.$u.toast('上传失败');
  167. }
  168. },
  169. fail: (err) => {
  170. console.error('选择图片失败:', err)
  171. }
  172. })
  173. }
  174. }
  175. }