diff --git a/pages/application/driving-inspections/driving-item-check-list.vue b/pages/application/driving-inspections/driving-item-check-list.vue index 886cf15..d08a078 100644 --- a/pages/application/driving-inspections/driving-item-check-list.vue +++ b/pages/application/driving-inspections/driving-item-check-list.vue @@ -33,25 +33,46 @@ - - - 检查照片 + + + + + + + + + + + + + + + + + + + + + + + + 实时照片 - - {{ checkimgList.length }}/4 - - - - - - - - + + + + + + + + + + + + - - - @@ -77,6 +98,7 @@ + @@ -104,6 +126,7 @@ checkimgList:[], modalName:null, imgList:[], + liveImgs: [], } }, onLoad(e){ @@ -123,74 +146,174 @@ } }, methods: { - delImg(e) { + ChooseImage() { + var _this = this; + uni.chooseImage({ + count: 1, + sizeType: ['original', 'compressed'], + sourceType: ['camera'], + success: (res) => { + const tempFilePath = res.tempFilePaths[0]; + uni.getLocation({ + type: 'gcj02', + geocode: true, + success: function (locationRes) { + const locationAddress = `${locationRes.address.province}${locationRes.address.city}${locationRes.address.district}${locationRes.address.street}${locationRes.address.streetNum}${locationRes.address.poiName}`; + // 创建画布 + const ctx = uni.createCanvasContext('watermarkCanvas', _this); + ctx.drawImage(tempFilePath, 0, 0, 300, 150); // 图片大小 + ctx.setFontSize(20); // 水印字体大小 + ctx.setFillStyle('red'); // 水印字体颜色 + ctx.setFontSize(10); // 调整字体大小,适应位置信息 + // 绘制水印 + ctx.fillText(`当前时间: ${_this.todayDate}`, 10, 120); // 根据实际情况调整位置 + ctx.fillText(`当前位置: ${locationAddress}`, 10, 130); // 根据实际情况调整位置 + ctx.draw(false, () => { + // 将画布内容保存为图片 + uni.canvasToTempFilePath({ + canvasId: 'watermarkCanvas', + success: function(res) { + let img = { + IMGFILES_ID: '', + FILEPATH: res.tempFilePath // 使用带有水印的图片路径 + }; + _this.uploadFilePromise(img.FILEPATH, 'file') + // _this.liveImgs.push(img) + + console.log(_this.liveImgs) + // .then(() => { + // uni.showToast({ + // title: '实时照片上传成功', + // icon: 'success' + // }); + // }).catch(error => { + // uni.showToast({ + // title: '实时照片上传失败: ' + error, + // icon: 'none' + // }); + // }); + } + }, _this); + }); + }, + fail: function () { + uni.showToast({ + title: '获取位置信息失败', + icon: 'none' + }); + } + }); + } + }); + }, + + DelImg(index) { var _this = this; uni.showModal({ - title: '秦安双控', content: '确定要删除这张图片吗?', cancelColor: "#000000", cancelText: '取消', confirmText: '确定', success: res => { if (res.confirm) { - uni.request({ - url: basePath+'/app/eightwork/deleteFile', - method: 'POST', - dataType: 'json', - header: { - 'Content-type':'application/x-www-form-urlencoded' - }, - data: { - FILE_PATH:_this.checkimgList[e.currentTarget.dataset.index].filePath - }, - success: (res) => { - uni.showToast({ - icon: 'none', - title: '删除成功', - duration: 1500 - }); - this.checkimgList.splice(e.currentTarget.dataset.index, 1) - }, - fail: (err) => { - uni.showModal({ - content: "删除失败", - showCancel: false - }); - } - }) + _this.liveImgs.splice(index,1) } } }) }, - chooseImage() { - uni.chooseImage({ - count: 1, //默认9 - sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有 - sourceType: ['camera', 'album'], //从相册选择 - success: (res) => { - uni.uploadFile({ - url: basePath+'/app/eightwork/saveFile', - filePath: res.tempFilePaths[0], - name: 'file', - formData: { - CORPINFO_ID:loginUser.CORPINFO_ID, - }, - success: ({data}) => { - let img = {}; - img.filePath = JSON.parse(data).FILE_PATH; - this.checkimgList.push(img) - console.log(this.checkimgList) - }, - fail: (err) => { - uni.showModal({ - content: "图片上传失败", - showCancel: false - }); - } - }) - } + + uploadFilePromise(filePath, name) { + return new Promise((resolve, reject) => { + uni.uploadFile({ + url: basePath + '/app/drivingtype/saveFile', + filePath: filePath, + name: name, + formData: { + CORPINFO_ID:loginUser.CORPINFO_ID, + }, + success: ({data}) => { + let img = {}; + img.filePath = JSON.parse(data).FILE_PATH; + this.liveImgs.push(img) + console.log(this.liveImgs) + }, + fail: (err) => { + uni.showModal({ + content: "图片上传失败", + showCancel: false + }); + } + }); }); }, + // delImg(e) { + // var _this = this; + // uni.showModal({ + // title: '秦安双控', + // content: '确定要删除这张图片吗?', + // cancelColor: "#000000", + // cancelText: '取消', + // confirmText: '确定', + // success: res => { + // if (res.confirm) { + // uni.request({ + // url: basePath+'/app/eightwork/deleteFile', + // method: 'POST', + // dataType: 'json', + // header: { + // 'Content-type':'application/x-www-form-urlencoded' + // }, + // data: { + // FILE_PATH:_this.checkimgList[e.currentTarget.dataset.index].filePath + // }, + // success: (res) => { + // uni.showToast({ + // icon: 'none', + // title: '删除成功', + // duration: 1500 + // }); + // this.checkimgList.splice(e.currentTarget.dataset.index, 1) + // }, + // fail: (err) => { + // uni.showModal({ + // content: "删除失败", + // showCancel: false + // }); + // } + // }) + // } + // } + // }) + // }, + // chooseImage() { + // uni.chooseImage({ + // count: 1, //默认9 + // sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有 + // sourceType: ['camera', 'album'], //从相册选择 + // success: (res) => { + // uni.uploadFile({ + // url: basePath+'/app/eightwork/saveFile', + // filePath: res.tempFilePaths[0], + // name: 'file', + // formData: { + // CORPINFO_ID:loginUser.CORPINFO_ID, + // }, + // success: ({data}) => { + // let img = {}; + // img.filePath = JSON.parse(data).FILE_PATH; + // this.checkimgList.push(img) + // console.log(this.checkimgList) + // }, + // fail: (err) => { + // uni.showModal({ + // content: "图片上传失败", + // showCancel: false + // }); + // } + // }) + // } + // }); + // }, /* *手写板 */ @@ -385,7 +508,7 @@ title: '请稍候' }) - if (_this.checkimgList.length <= 0) { + if (_this.liveImgs.length <= 0) { uni.showToast({ icon: 'none', title: '请上传车辆检查照片', @@ -411,7 +534,7 @@ formData.USER_ID = loginUser.USER_ID formData.USER_NAME = loginUser.USERNAME formData.CHECKTYPE_ID = this.CHECKTYPE_ID - formData.IMG_PATH = this.checkimgList.map(item => { + formData.IMG_PATH = this.liveImgs.map(item => { return item.filePath }).join(",") formData.checklist = JSON.stringify(this.list)