|
|
@@ -124,8 +124,8 @@ export default {
|
|
|
loadRect: function() {
|
|
|
var self = this
|
|
|
try {
|
|
|
- var query = uni.createSelectorQuery()
|
|
|
- if (self.$scope) query = query.in(self.$scope)
|
|
|
+ // 与全站组件一致:用 .in(this) 将选择器限定到本组件作用域(组件内 canvas 必须带组件实例)
|
|
|
+ var query = uni.createSelectorQuery().in(this)
|
|
|
query.select('.signature-canvas').boundingClientRect(function(rect) {
|
|
|
if (rect) {
|
|
|
self.rect = rect
|
|
|
@@ -201,6 +201,8 @@ export default {
|
|
|
var rect = this.rect || {}
|
|
|
var w = rect.width || 300
|
|
|
var h = rect.height || this.height
|
|
|
+ // 注意第二个参数 this:canvas 位于自定义组件内,必须传入组件实例,
|
|
|
+ // 否则微信小程序按页面级 canvas-id 查找不到组件内 canvas,导出必然失败(签名「不好用」的根因之一)。
|
|
|
uni.canvasToTempFilePath({
|
|
|
canvasId: 'hsCanvas',
|
|
|
x: 0,
|
|
|
@@ -212,25 +214,32 @@ export default {
|
|
|
fileType: 'png',
|
|
|
quality: 1,
|
|
|
success: function(res) {
|
|
|
+ var tmp = res && res.tempFilePath ? res.tempFilePath : ''
|
|
|
+ // H5:canvasToTempFilePath 的 tempFilePath 直接就是 base64 data URL
|
|
|
+ if (String(tmp).indexOf('data:image') === 0) {
|
|
|
+ self._emitSignature(tmp)
|
|
|
+ return
|
|
|
+ }
|
|
|
// 小程序:临时文件路径转 base64 data URL 提交后端
|
|
|
- var fs = uni.getFileSystemManager()
|
|
|
+ var fs = (typeof uni.getFileSystemManager === 'function') ? uni.getFileSystemManager() : null
|
|
|
+ if (!fs) {
|
|
|
+ // 环境不支持文件系统(个别平台变体),降级为临时路径
|
|
|
+ self._emitSignature(tmp)
|
|
|
+ return
|
|
|
+ }
|
|
|
fs.readFile({
|
|
|
- filePath: res.tempFilePath,
|
|
|
+ filePath: tmp,
|
|
|
encoding: 'base64',
|
|
|
success: function(fileRes) {
|
|
|
- self.currentDataUrl = 'data:image/png;base64,' + (fileRes.data || '')
|
|
|
- self.hasContent = true
|
|
|
- self.$emit('confirm', self.currentDataUrl)
|
|
|
- self.savingLive = false
|
|
|
+ self._emitSignature('data:image/png;base64,' + (fileRes.data || ''))
|
|
|
},
|
|
|
fail: function() {
|
|
|
- // 降级:直接返回临时路径(H5 环境 tempFilePath 即为 base64 data URL)
|
|
|
- if (String(res.tempFilePath || '').indexOf('data:image') === 0) {
|
|
|
- self.currentDataUrl = res.tempFilePath
|
|
|
- self.hasContent = true
|
|
|
- self.$emit('confirm', self.currentDataUrl)
|
|
|
+ // 降级:H5 的 tempFilePath 本身即为 base64 data URL;其余情况保持静默允许重试
|
|
|
+ if (String(tmp).indexOf('data:image') === 0) {
|
|
|
+ self._emitSignature(tmp)
|
|
|
+ } else {
|
|
|
+ self.savingLive = false
|
|
|
}
|
|
|
- self.savingLive = false
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
@@ -239,7 +248,14 @@ export default {
|
|
|
uni.showToast({ title: '签名导出失败,请重试', icon: 'none' })
|
|
|
self.savingLive = false
|
|
|
}
|
|
|
- })
|
|
|
+ }, this)
|
|
|
+ },
|
|
|
+ // 统一回写签名并通知父组件(小程序已转 base64,H5 直接透传 data URL)
|
|
|
+ _emitSignature: function(dataUrl) {
|
|
|
+ this.currentDataUrl = dataUrl || ''
|
|
|
+ this.hasContent = true
|
|
|
+ this.$emit('confirm', this.currentDataUrl)
|
|
|
+ this.savingLive = false
|
|
|
},
|
|
|
handleClear: function() {
|
|
|
var self = this
|