imgUploadAndDownLoad.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  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');
  28. this.getList('2', '2');
  29. this.getList('2', '3');
  30. }
  31. }
  32. })
  33. },
  34. //获取文件列表
  35. async getList(type, orderFileType) {
  36. console.log('获取文件列表', type, orderFileType)
  37. try {
  38. const params = {
  39. clueId: this.orderDetail.clueId,
  40. sourceId: this.orderId,
  41. type,
  42. orderFileType,
  43. isDuplicate: '1',//先传1
  44. pageNum: 1,
  45. pageSize: 1000 // 设置一个较大的值以获取所有数据
  46. }
  47. const response = await uni.$u.api.selectClueFileByDto(params)
  48. if (orderFileType == '1') {
  49. this.trueUploadList = response.rows || []
  50. } else if (orderFileType == '2') {
  51. this.chatRecordsUploadList = response.rows || []
  52. } else if (orderFileType == '3') {
  53. this.detailImages = response.rows || []
  54. }
  55. } catch (error) {
  56. uni.$u.toast(`获取列表失败:${error.message}`)
  57. this.trueUploadList = []
  58. this.chatRecordsUploadList = []
  59. }
  60. },
  61. // 选择图片
  62. uploadImage(type) {
  63. uni.chooseImage({
  64. count: 9, // 最多选择9张
  65. sizeType: ['compressed'], // 压缩图片
  66. sourceType: ['album', 'camera'], // 从相册选择或拍照
  67. success: (res) => {
  68. const tempFilePaths = res.tempFilePaths
  69. console.log('上传的图片路径:11', tempFilePaths)
  70. this.uploadToServer(tempFilePaths, type)
  71. },
  72. fail: (err) => {
  73. console.error('选择图片失败:', err)
  74. }
  75. })
  76. },
  77. // 上传到服务器
  78. async uploadToServer(filePaths, type) {
  79. // 实际的上传逻辑
  80. try {
  81. //实物图的话就是1,聊天记录的话就是2,高清细节图的话就是3
  82. let p = type == 'truePic' ? '1' : type == 'chatRecords' ? '2' : type == 'detailImages' ? '3' : ''
  83. console.log('当前上传的图片类型是', p)
  84. const res = await Promise.all(filePaths.map(filePath => this.uploadFile(filePath, p)));
  85. // 绑定
  86. this.bindOrder(p);
  87. this.getList('2', '1');
  88. this.getList('2', '2');
  89. this.getList('2', '3');
  90. } catch (error) {
  91. console.error('上传失败:', error);
  92. uni.$u.toast('上传失败');
  93. }
  94. },
  95. // 上传文件
  96. async uploadFile(fileUrl, orderFileType) {
  97. try {
  98. uni.showLoading({
  99. title: '上传中...',
  100. mask: true
  101. });
  102. // 调用统一的上传接口
  103. const { data } = await uni.$u.api.uploadFile(fileUrl);
  104. const fileObj = {
  105. fileSize: data.fileSize,
  106. fileSuffix: data.fileSuffix,
  107. fileName: data.name,
  108. fileUrl: data.url,
  109. orderFileType: orderFileType
  110. };
  111. this.bindList.push(fileObj);
  112. } catch (error) {
  113. uni.hideLoading();
  114. console.error('文件上传失败:', error);
  115. uni.$u.toast('上传失败,请重试');
  116. }
  117. },
  118. //绑定订单
  119. async bindOrder(orderFileType) {
  120. const res = await uni.$u.api.saveClueFile({
  121. clueId: this.orderDetail.clueId,//线索id
  122. list: this.bindList,
  123. sourceId: this.orderId,//订单id,sendformid
  124. type: '2',
  125. orderFileType: orderFileType
  126. });
  127. uni.$u.toast("上传成功");
  128. uni.hideLoading();
  129. // 清空待绑定的图片列表
  130. this.bindList = [];
  131. },
  132. }
  133. }