Skip to content

C
CFFP-HB
Commit 8480bd31 by sunchao
Options

电子签

parent 3514211c
Showing with 1152 additions and 45 deletions
pages/application-process/basic-info.vue
...@@ -116,30 +116,30 @@ ...@@ -116,30 +116,30 @@
this.applyParam.birthday = e.detail.value; this.applyParam.birthday = e.detail.value;
}, },
saveInfo(){ saveInfo(){
if(!this.applyParam.name){ // if(!this.applyParam.name){
uni.showToast({ // uni.showToast({
title: '请输入姓名', // title: '请输入姓名',
duration: 2000, // duration: 2000,
icon: 'none' // icon: 'none'
}) // })
return; // return;
} // }
if(!this.applyParam.idType){ // if(!this.applyParam.idType){
uni.showToast({ // uni.showToast({
title: '请选择证件类型', // title: '请选择证件类型',
duration: 2000, // duration: 2000,
icon: 'none' // icon: 'none'
}) // })
return; // return;
} // }
if(!this.applyParam.idNo){ // if(!this.applyParam.idNo){
uni.showToast({ // uni.showToast({
title: '请输入证件号', // title: '请输入证件号',
duration: 2000, // duration: 2000,
icon: 'none' // icon: 'none'
}) // })
return; // return;
} // }
uni.setStorageSync('applyParam',JSON.stringify(this.applyParam)) uni.setStorageSync('applyParam',JSON.stringify(this.applyParam))
uni.navigateTo({ uni.navigateTo({
url:'work-experience' url:'work-experience'
......
pages/application-process/contract.vue
...@@ -58,14 +58,14 @@ ...@@ -58,14 +58,14 @@
}, },
saveInfo(){ saveInfo(){
console.log(this.isAllAgree) console.log(this.isAllAgree)
if (!this.isAllAgree) { // if (!this.isAllAgree) {
uni.showToast({ // uni.showToast({
title: '请详细阅读全部条款！', // title: '请详细阅读全部条款！',
duration: 2000, // duration: 2000,
icon: 'none' // icon: 'none'
}); // });
return; // return;
} // }
uni.navigateTo({ uni.navigateTo({
url:'signature' url:'signature'
}) })
......
pages/application-process/signature.vue
...@@ -2,33 +2,80 @@ ...@@ -2,33 +2,80 @@
<view class="container"> <view class="container">
<view class="title"> <view class="title">
<view> <view>
<text class="line"></text>电子签名 <text class="line"></text>电子签名<text style="font-size: 20rpx;font-weight: normal;">（请书写工整，字迹清晰）</text>
</view> </view>
<text class="page_mark">8/8</text> <text class="page_mark"> 8/8</text>
</view> </view>
<navigator class="fixed" url="bank-card"> <view class="signatureContent">
<!-- <signature-pad *ngIf="!isSignatureShow" #signaturePad [options]="signaturePadOptions" (onBeginEvent)="drawStart()" (onEndEvent)="drawComplete()">
</signature-pad> -->
<!-- <img [src]="imgStr" alt="签名" *ngIf="isSignatureShow"> -->
<view style="width: 750rpx ;height: 750rpx;">
<l-signature disableScroll backgroundColor="#ddd" ref="signatureRef" :penColor="penColor" :penSize="penSize" :openSmooth="openSmooth" ></l-signature>
</view>
<!-- <view>
<button @click="onClick('clear')">清空</button>
<button @click="onClick('undo')">撤消</button>
<button @click="onClick('save')">保存</button>
<button @click="onClick('openSmooth')">压感{{openSmooth?'开':'关'}}</button>
</view> -->
</view>
<div class="signature_action">
<image src="../../static/clear.png" alt="清除" @click="onClick('clear')"></image>
<image src="../../static/revoke.png" alt="上一步" @click="onClick('undo')"></image>
</div>
<view class="fixed" url="bank-card">
保存并下一步 保存并下一步
</navigator> </view>
</view> </view>
</template> </template>
<script> <script>
export default{ export default {
data(){ data() {
return { return {
title: 'Hello',
penColor: 'red',
penSize: 5,
url: '',
openSmooth: true
} }
}, },
components:{}, methods: {
onLoad(){ onClick(type) {
if(type == 'openSmooth') {
}, this.openSmooth = !this.openSmooth
methods:{ return
}
if (type == 'save') {
this.$refs.signatureRef.canvasToTempFilePath({
success: (res) => {
// 是否为空画板 无签名
console.log(res.isEmpty)
// 生成图片的临时路径
// app | H5 | 微信小程序 生成的是base64
this.url = res.tempFilePath
}
})
return
}
if (this.$refs.signatureRef)
this.$refs.signatureRef[type]()
}
} }
} }
</script> </script>
<style lang="scss"> <style lang="scss">
@import 'applyCommon.scss'; @import 'applyCommon.scss';
.signatureContent{
margin: 0 13px 20px 13px;
background: #f8f8f8;
}
.signature_action{
display: flex;
justify-content: space-evenly;
margin-top: 20px;
uni-image{max-width: 60px;max-height: 60px;}
}
</style> </style>
\ No newline at end of file
uni_modules/lime-signature/changelog.md 0 → 100644
## 1.0.0（2022-10-27）
- feat: 增加背景色
- feat: 修复 app canvasToTempFilePath 无操作只能执行一次的问题
## 0.8.0（2022-08-22）
- feat: 增加beforeDelay 延时初始化，可用于手写板在弹窗里时
## 0.7.0（2022-08-16）
- fix: 修复缺少 canvasWidth
## 0.6.0（2022-07-16）
- fix: 修复 success is no defined
## 0.5.0（2022-07-09）
- feat: canvasToTempFilePath success 增加返回 isEmpty
- fix: 修复 微信小程序 canvasToTempFilePath 无效问题
## 0.4.0（2022-07-04）
- fix: 生成图片缺少最后一笔
## 0.3.0（2022-05-24）
- chore: 支持多端 H5 小程序 APP APP-NVUE
## 0.2.0（2021-07-09）
- chore: 统一命名规范，无须主动引入组件
- fix: 修复错位问题
## 0.1.0（2021-03-07）
- 首次上传
- 撤消、清空、保存、模拟压感等功能
uni_modules/lime-signature/components/l-signature/context.js 0 → 100644
export const uniContext = (ctx) => {
const ALIAS_ATTRS_MAP = [
'lineCap',
'strokeStyle',
'lineWidth',
'fillStyle',
]
ALIAS_ATTRS_MAP.forEach(style => {
Object.defineProperty(ctx, style, {
set: value => {
if(value)
ctx[`set${style.charAt(0).toUpperCase()}${style.slice(1)}`](value)
}
})
})
ctx.uniDrawImage = ctx.drawImage
ctx.drawImage = (image,...agrs) => {
ctx.uniDrawImage(image.src, ...agrs)
}
return ctx
}
class Image {
constructor() {
this.currentSrc = null
this.naturalHeight = 0
this.naturalWidth = 0
this.width = 0
this.height = 0
this.tagName = 'IMG'
}
set src(src) {
this.currentSrc = src
uni.getImageInfo({
src,
success: (res) => {
this.naturalWidth = this.width = res.width
this.naturalHeight = this.height = res.height
this.onload()
},
fail: () => {
this.onerror()
}
})
}
get src() {
return this.currentSrc
}
}
export const createImage = () => {
return new Image()
}
export const toDataURL = (canvasId, com) => {
return new Promise((resolve, reject) => {
uni.canvasToTempFilePath({
canvasId,
success: (res) => {
resolve(res.tempFilePath)
},
fail: reject
}, com)
})
}
\ No newline at end of file
uni_modules/lime-signature/components/l-signature/l-signature.vue 0 → 100644
<template>
<view class="lime-signature" :style="[canvasStyle, styles]" ref="limeSignature">
<!-- #ifndef APP-VUE || APP-NVUE -->
<canvas
v-if="useCanvas2d"
class="lime-signature__canvas"
:id="canvasId"
type="2d"
:disableScroll="disableScroll"
@touchstart="touchStart"
@touchmove="touchMove"
@touchend="touchEnd"
></canvas>
<canvas
v-else
:disableScroll="disableScroll"
class="lime-signature__canvas"
:canvas-id="canvasId"
:id="canvasId"
@touchstart="touchStart"
@touchmove="touchMove"
@touchend="touchEnd"
@mousedown="touchStart"
@mousemove="touchMove"
@mouseup="touchEnd"
></canvas>
<!-- #endif -->
<!-- #ifdef APP-VUE -->
<view
:id="canvasId"
:disableScroll="disableScroll"
:rparam="param"
:change:rparam="sign.update"
:rclear="rclear"
:change:rclear="sign.clear"
:rundo="rundo"
:change:rundo="sign.undo"
:rsave="rsave"
:change:rsave="sign.save"
:rempty="rempty"
:change:rempty="sign.isEmpty"
></view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<web-view
src="/uni_modules/lime-signature/static/index.html"
class="lime-signature__canvas"
ref="webview"
@pagefinish="onPageFinish"
@error="onError"
@onPostMessage="onMessage"
></web-view>
<!-- #endif -->
</view>
</template>
<!-- #ifdef APP-VUE -->
<script module="sign" lang="renderjs">
// #ifdef APP-VUE
// import { Signature } from '@signature'
import { Signature } from './signature'
// import {base64ToPath} from './utils'
export default {
data() {
return {
canvasid: null,
signature: null,
observer: null,
options: {},
saveCount: 0,
}
},
mounted() {
this.$nextTick(this.init)
},
methods: {
init() {
const el = this.$refs.limeSignature;
console.log(this.$refs)
const canvas = document.createElement('canvas')
canvas.style = 'width:100%; height: 100%;'
alert(el)
console.log(el)
el.appendChild(canvas)
this.signature = new Signature({el: canvas})
this.signature.pen.setOption(this.options)
const width = this.signature.canvas.get('width')
const height = this.signature.canvas.get('height')
this.emit({
changeSize: {width, height}
})
},
undo(v) {
if(v && this.signature) {
this.signature.undo()
}
},
clear(v) {
if(v && this.signature) {
this.signature.clear()
}
},
save(v) {
if(v !== this.saveCount) {
this.saveCount = v;
const image = this.signature.canvas.get('el').toDataURL()
const {backgroundColor } = this.options
if(backgroundColor) {
const canvas = document.createElement('canvas')
const width = this.signature.canvas.get('width')
const height = this.signature.canvas.get('height')
const pixelRatio = this.signature.canvas.get('pixelRatio')
canvas.width = width * pixelRatio
canvas.height = height * pixelRatio
const context = canvas.getContext('2d')
context.scale(pixelRatio, pixelRatio)
context.fillStyle = backgroundColor
context.fillRect(0,0, width, height)
context.drawImage(this.signature.canvas.get('el'), 0, 0, width, height)
this.emit({save: canvas.toDataURL()})
canvas.remove()
} else {
this.emit({save: image})
}
// base64ToPath(image).then((res) => {
// this.emit({save: res})
// })
}
},
isEmpty(v) {
if(v && this.signature) {
const isEmpty = this.signature.isEmpty()
this.emit({isEmpty})
}
},
emit(event) {
this.$ownerInstance.callMethod('onMessage', {
detail: {
data: [
{
event
}
]
}
})
},
update(v) {
if(v) {
if(this.signature) {
this.options = v
this.signature.pen.setOption(v)
} else {
this.options = v
}
}
}
}
}
// #endif
</script>
<!-- #endif -->
<script>
// #ifndef APP-NVUE
import {getCanvas2d, wrapEvent, requestAnimationFrame, sleep} from './utils'
import {Signature} from './signature'
// import {Signature} from '@signature';
import {uniContext, createImage, toDataURL} from './context'
// #endif
import {base64ToPath} from './utils'
export default {
props: {
styles: String,
disableScroll: Boolean,
type: {
type: String,
default: '2d'
},
// 画笔颜色
penColor: {
type: String,
default: 'black'
},
penSize: {
type: Number,
default: 2
},
// 画板背景颜色
backgroundColor: String,
// 笔锋
openSmooth: Boolean,
// 画笔最小值
minLineWidth: {
type: Number,
default: 2
},
// 画笔最大值
maxLineWidth: {
type: Number,
default: 6
},
// 画笔达到最小宽度所需最小速度(px/ms)，取值范围1.0-10.0，值越小，画笔越容易变细，笔锋效果会比较明显，可以自行调整查看效果，选出自己满意的值。
minSpeed: {
type: Number,
default: 1.5
},
// 相邻两线宽度增(减)量最大百分比，取值范围1-100，为了达到笔锋效果，画笔宽度会随画笔速度而改变，如果相邻两线宽度差太大，过渡效果就会很突兀，使用maxWidthDiffRate限制宽度差，让过渡效果更自然。可以自行调整查看效果，选出自己满意的值。
maxWidthDiffRate: {
type: Number,
default: 20
},
// 限制历史记录数，即最大可撤销数，传入0则关闭历史记录功能
maxHistoryLength: {
type: Number,
default: 20
},
beforeDelay: {
type: Number,
default: 0
}
},
data() {
return {
canvasWidth: null,
canvasHeight: null,
useCanvas2d: true,
// #ifdef APP-PLUS
rclear: 0,
rundo: 0,
rsave: 0,
rempty: 0,
risEmpty: true,
toDataURL: null,
tempFilePath: [],
// #endif
}
},
computed: {
canvasId() {
return `lime-signature${this._uid||this._.uid}`
},
canvasStyle() {
const {canvasWidth, canvasHeight, backgroundColor} = this
return {
width: canvasWidth && (canvasWidth + 'px'),
height: canvasHeight && (canvasHeight + 'px'),
background: backgroundColor
}
},
param() {
const {penColor, penSize, backgroundColor, openSmooth, minLineWidth, maxLineWidth, minSpeed, maxWidthDiffRate, maxHistoryLength, disableScroll} = this
return JSON.parse(JSON.stringify({penColor, penSize, backgroundColor, openSmooth, minLineWidth, maxLineWidth, minSpeed, maxWidthDiffRate, maxHistoryLength, disableScroll}))
}
},
// #ifdef APP-NVUE
watch: {
param(v) {
this.$refs.webview.evalJS(`update(${JSON.stringify(v)})`)
}
},
// #endif
// #ifndef APP-PLUS
created() {
this.useCanvas2d = this.type=== '2d' && getCanvas2d()
},
// #endif
// #ifndef APP-PLUS
async mounted() {
if(this.beforeDelay) {
await sleep(this.beforeDelay)
}
const config = await this.getContext()
this.signature = new Signature(config)
this.canvasEl = this.signature.canvas.get('el')
this.canvasWidth = this.signature.canvas.get('width')
this.canvasHeight = this.signature.canvas.get('height')
this.stopWatch = this.$watch('param' , (v) => {
this.signature.pen.setOption(v)
}, {immediate: true})
},
// #endif
// #ifndef APP-PLUS
// #ifdef VUE3
beforeUnmount() {
this.stopWatch()
this.signature.destroy()
},
// #endif
// #ifdef VUE2
beforeDestroy() {
this.stopWatch()
this.signature.destroy()
},
// #endif
// #endif
methods: {
// #ifdef APP-PLUS
onPageFinish() {
this.$refs.webview.evalJS(`update(${JSON.stringify(this.param)})`)
},
onMessage(e = {}) {
const {detail: {data: [res]}} = e
if(res.event?.save) {
this.toDataURL = res.event.save
}
if(res.event?.changeSize) {
const {width, height} = res.event.changeSize
}
if(res.event.hasOwnProperty('isEmpty')) {
this.risEmpty = res.event.isEmpty
}
if (res.event?.file) {
this.tempFilePath.push(res.event.file)
if (this.tempFilePath.length > 7) {
this.tempFilePath.shift()
}
return
}
if (res.event?.success) {
if (res.event.success) {
this.tempFilePath.push(res.event.success)
if (this.tempFilePath.length > 8) {
this.tempFilePath.shift()
}
this.toDataURL = this.tempFilePath.join('')
this.tempFilePath = []
// base64ToPath(this.tempFilePath.join('')).then(res => {
// })
} else {
this.$emit('fail', 'canvas no data')
}
return
}
},
// #endif
undo() {
// #ifdef APP-VUE || APP-NVUE
this.rundo += 1
// #endif
// #ifdef APP-NVUE
this.$refs.webview.evalJS(`undo()`)
// #endif
// #ifndef APP-VUE
if(this.signature)
this.signature.undo()
// #endif
},
clear() {
// #ifdef APP-VUE || APP-NVUE
this.rclear += 1
// #endif
// #ifdef APP-NVUE
this.$refs.webview.evalJS(`clear()`)
// #endif
// #ifndef APP-VUE
if(this.signature)
this.signature.clear()
// #endif
},
isEmpty() {
// #ifdef APP-NVUE
this.$refs.webview.evalJS(`isEmpty()`)
// #endif
// #ifdef APP-VUE || APP-NVUE
this.rempty += 1
// #endif
// #ifndef APP-VUE || APP-NVUE
return this.signature.isEmpty()
// #endif
},
canvasToTempFilePath(param) {
const isEmpty = this.isEmpty()
// #ifdef APP-NVUE
this.$refs.webview.evalJS(`save()`)
// #endif
// #ifdef APP-VUE || APP-NVUE
const stopURLWatch = this.$watch('toDataURL', (v, n) => {
if(v && v !== n) {
if(param.pathType == 'url') {
base64ToPath(v).then(res => {
param.success({tempFilePath: res,isEmpty: this.risEmpty })
})
} else {
param.success({tempFilePath: v,isEmpty: this.risEmpty })
}
this.toDataURL = ''
}
stopURLWatch && stopURLWatch()
})
this.rsave += 1
// #endif
// #ifndef APP-VUE || APP-NVUE
const success = (success) => param.success && param.success(success)
const fail = (fail) => param.fail && param.fail(err)
const {canvas} = this.signature.canvas.get('el')
const context = this.signature.canvas.get('context')
const {backgroundColor} = this
const width = this.signature.canvas.get('width')
const height = this.signature.canvas.get('height')
if(this.useCanvas2d) {
try{
// #ifndef MP-ALIPAY
const tempFilePath = canvas.toDataURL()
if(backgroundColor) {
const image = canvas.createImage()
image.src = tempFilePath
image.onload = () => {
context.fillStyle = backgroundColor
context.fillRect(0, 0, width, height)
context.drawImage(image, 0, 0, width, height);
const tempFilePath = canvas.toDataURL()
success({tempFilePath, isEmpty})
context.clearRect(0,0, width, height)
context.drawImage(image, 0, 0, width, height);
}
} else {
success({tempFilePath, isEmpty})
}
// #endif
// #ifdef MP-ALIPAY
canvas.toTempFilePath({
canvasid: this.canvasid,
success(res){
if(backgroundColor) {
const image = canvas.createImage()
image.src = tempFilePath
image.onload = () => {
canvas.toTempFilePath({
canvasid: this.canvasid,
success(res) {
context.fillStyle = backgroundColor
context.fillRect(0, 0, width, height)
context.drawImage(image, 0, 0, width, height);
success({tempFilePath, isEmpty})
context.clearRect(0,0, width, height)
context.drawImage(image, 0, 0, width, height);
}
})
}
} else {
success({tempFilePath: res, isEmpty})
}
},
fail
})
// #endif
}catch(err){
console.warn(err)
fail(err)
}
} else {
toDataURL(this.canvasId, this).then(res => {
if(backgroundColor) {
const image = createImage()
image.src = res
image.onload = () => {
context.fillStyle = backgroundColor
context.fillRect(0, 0, width, height)
context.drawImage(image, 0, 0, width, height);
context.draw && context.draw(true, () => {
toDataURL(this.canvasId, this).then(res => {
success({tempFilePath: res, isEmpty})
context.clearRect(0,0, width, height)
context.drawImage(image, 0, 0, width, height);
context.draw && context.draw(true)
})
});
}
} else {
success({tempFilePath: res, isEmpty})
}
}).catch(err => {
console.warn(err)
fail(err)
})
}
// #endif
},
// #ifndef APP-PLUS
getContext() {
const {pixelRatio} = uni.getSystemInfoSync()
return new Promise(resolve => {
if(this.useCanvas2d) {
uni.createSelectorQuery().in(this)
.select(`#${this.canvasId}`)
.fields({
node: true,
size: true,
rect: true,
})
.exec(res => {
if(res) {
const {width, height, node, left, top, right} = res[0]
const context = node.getContext('2d')
node.width = width * pixelRatio;
node.height = height * pixelRatio;
resolve({ left, top, right, width, height, context, canvas: node, pixelRatio})
}
})
} else {
uni.createSelectorQuery().in(this)
.select(`#${this.canvasId}`)
.boundingClientRect()
.exec(res => {
if(res) {
const {width, height, left, top, right} = res[0]
const context = uniContext(uni.createCanvasContext(this.canvasId, this))
const canvas = {
createImage,
toDataURL: () => toDataURL(this.canvasId, this),
requestAnimationFrame
}
resolve({ left, top, right, width, height, context, pixelRatio:1, canvas})
}
})
}
})
},
touchStart(e) {
if(!this.canvasEl) return
this.isStart = true
this.canvasEl.dispatchEvent('touchstart', wrapEvent(e))
},
touchMove(e) {
if(!this.canvasEl || !this.isStart && this.canvasEl) return
this.canvasEl.dispatchEvent('touchmove', wrapEvent(e))
},
touchEnd(e) {
if(!this.canvasEl) return
this.isStart = false
this.canvasEl.dispatchEvent('touchend', wrapEvent(e))
},
// #endif
}
}
</script>
<style lang="stylus">
.lime-signature,.lime-signature__canvas
// #ifndef APP-NVUE
width: 100%;
height: 100%
// #endif
// #ifdef APP-NVUE
flex: 1;
// #endif
</style>
\ No newline at end of file
uni_modules/lime-signature/components/l-signature/signature.js 0 → 100644
function t(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,n)}return i}function e(e){for(var i=1;arguments.length>i;i++){var n=null!=arguments[i]?arguments[i]:{};i%2?t(Object(n),!0).forEach((function(t){s(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):t(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function i(t){return i="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},i(t)}function n(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){for(var i=0;e.length>i;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function r(t,e,i){return e&&o(t.prototype,e),i&&o(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t}function s(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&u(t,e)}function c(t){return c=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)},c(t)}function u(t,e){return u=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t},u(t,e)}function h(t,e){if(e&&("object"==typeof e||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}function l(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var i,n=c(t);if(e){var o=c(this).constructor;i=Reflect.construct(n,arguments,o)}else i=n.apply(this,arguments);return h(this,i)}}var v={}.toString,f=function(t,e){return v.call(t)==="[object "+e+"]"},d=function(t){return f(t,"String")},y=function(t){return f(t,"Number")},p=function(){function t(){n(this,t),this.__events=void 0,this.__events={}}return r(t,[{key:"on",value:function(t,e){if(t&&e){var i=this.__events[t]||[];i.push(e),this.__events[t]=i}}},{key:"emit",value:function(t,e){var n=this;if(function(t){var e=i(t);return null!==t&&"object"===e||"function"===e}(t)&&(t=(e=t)&&e.type),t){var o=this.__events[t];o&&o.length&&o.forEach((function(t){t.call(n,e)}))}}},{key:"off",value:function(t,e){var i=this.__events,n=i[t];if(n&&n.length)if(e)for(var o=0,r=n.length;r>o;o++)n[o]===e&&(n.splice(o,1),o--);else delete i[t]}},{key:"getEvents",value:function(){return this.__events}}]),t}(),g=function(t){a(i,p);var e=l(i);function i(t,o){var r;return n(this,i),(r=e.call(this)).context=void 0,r.canvas=void 0,r.attrs=void 0,r.isCanvasElement=void 0,r.context=t,r.canvas=o.canvas||t.canvas||{width:o.width||0,height:o.height||0},r.attrs=o||{},r.isCanvasElement=!0,r}return r(i,[{key:"width",get:function(){return this.canvas.width},set:function(t){this.canvas.width=t}},{key:"height",get:function(){return this.canvas.height},set:function(t){this.canvas.height=t}},{key:"getContext",value:function(){return this.context}},{key:"getBoundingClientRect",value:function(){var t=this.attrs||{},e=t.top,i=t.right,n=t.width,o=t.height,r=t.left,s=t.bottom;return{top:void 0===e?0:e,width:void 0===n?0:n,right:void 0===i?0:i,height:void 0===o?0:o,bottom:void 0===s?0:s,left:void 0===r?0:r}}},{key:"setAttribute",value:function(t,e){this.attrs[t]=e}},{key:"addEventListener",value:function(t,e){this.on(t,e)}},{key:"removeEventListener",value:function(t,e){this.off(t,e)}},{key:"dispatchEvent",value:function(t,e){this.emit(t,e)}}]),i}();var m=function(t,e){return t?function(t){if(!t)return!1;if(1!==t.nodeType||!t.nodeName||"canvas"!==t.nodeName.toLowerCase())return!1;var e=!1;try{t.addEventListener("eventTest",(function(){e=!0})),t.dispatchEvent(new Event("eventTest"))}catch(t){e=!1}return e}(t.canvas)?t.canvas:new g(t,e):null};function x(t,e){try{return t.currentStyle?t.currentStyle[e]:document.defaultView&&document.defaultView.getComputedStyle(t,null).getPropertyValue(e)}catch(t){return{width:300,height:150}[e]}}function w(t,e){var i=e.get("el");if(!i)return t;var n=i.getBoundingClientRect(),o=n.top,r=void 0===o?0:o,s=n.left,a=void 0===s?0:s,c=parseFloat(x(i,"padding-left"))||0,u=parseFloat(x(i,"padding-top"))||0;return{x:t.x-a-c,y:t.y-r-u}}function b(t,e){var i=e.get("landscape");if(!i)return t;if(f(i,"Function"))return i(t,e);var n=e.get("height");return{x:t.y,y:n-t.x}}var k=function(t,e){var i=t.touches;if(!i||!i.length)return[b(w({x:t.clientX,y:t.clientY},e),e)];i.length||(i=t.changedTouches||[]);for(var n=[],o=0,r=i.length;r>o;o++){var s=i[o],a=s.x,c=s.y,u=s.clientX,h=s.clientY,l=void 0;l=y(a)||y(c)?{x:a,y:c}:w({x:u,y:h},e),n.push(b(l,e))}return n},_=function(t,e){var i=e.x-t.x,n=e.y-t.y;return Math.abs(i)>Math.abs(n)?i>0?"right":"left":n>0?"down":"up"},E=function(t,e){var i=Math.abs(e.x-t.x),n=Math.abs(e.y-t.y);return Math.sqrt(i*i+n*n)},L=function(){function t(e){var i=this,o=e.canvas,r=e.el;n(this,t),this.processEvent=void 0,this.canvas=void 0,this.startTime=0,this.endTime=0,this.startPoints=null,this.startDistance=0,this.center=null,this.pressTimeout=void 0,this.eventType=null,this.direction=null,this.lastMoveTime=0,this.prevMovePoints=null,this.prevMoveTime=0,this.lastMovePoints=null,this.pinch=!1,this._click=function(t){var e=k(t,i.canvas);t.points=e,i.emitEvent("click",t)},this._start=function(t){var e,n,o=k(t,i.canvas);o&&(t.points=o,i.emitEvent("touchstart",t),i.reset(),i.startTime=Date.now(),i.startPoints=o,o.length>1?(i.startDistance=E(o[0],o[1]),i.center={x:(e=o[0]).x+((n=o[1]).x-e.x)/2,y:e.y+(n.y-e.y)/2}):i.pressTimeout=setTimeout((function(){var e="press",n="none";t.direction=n,i.emitStart(e,t),i.emitEvent(e,t),i.eventType=e,i.direction=n}),250))},this._move=function(t){var e=k(t,i.canvas);if(e){t.points=e,i.emitEvent("touchmove",t);var n=i.startPoints;if(n)if(e.length>1){var o=i.startDistance,r=E(e[0],e[1]);t.zoom=r/o,t.center=i.center,i.emitStart("pinch",t),i.emitEvent("pinch",t)}else{var s=e[0].x-n[0].x,a=e[0].y-n[0].y,c=i.direction||_(n[0],e[0]);i.direction=c;var u=i.getEventType(e);t.direction=c,t.deltaX=s,t.deltaY=a,i.emitStart(u,t),i.emitEvent(u,t);var h=i.lastMoveTime,l=Date.now();l-h>0&&(i.prevMoveTime=h,i.prevMovePoints=i.lastMovePoints,i.lastMoveTime=l,i.lastMovePoints=e)}}},this._end=function(t){var e=k(t,i.canvas);t.points=e,i.emitEnd(t),i.emitEvent("touchend",t);var n=i.lastMoveTime;if(100>Date.now()-n){var o=n-(i.prevMoveTime||i.startTime);if(o>0){var r=i.prevMovePoints||i.startPoints,s=i.lastMovePoints;if(!r||!s)return;var a=E(r[0],s[0])/o;a>.3&&(t.velocity=a,t.direction=_(r[0],s[0]),i.emitEvent("swipe",t))}}i.reset();var c=t.touches;c&&c.length>0&&i._start(t)},this._cancel=function(t){i.emitEvent("touchcancel",t),i.reset()},this.canvas=o,this.delegateEvent(r),this.processEvent={}}return r(t,[{key:"delegateEvent",value:function(t){t.addEventListener("click",this._click),t.addEventListener("touchstart",this._start),t.addEventListener("touchmove",this._move),t.addEventListener("touchend",this._end),t.addEventListener("touchcancel",this._cancel)}},{key:"emitEvent",value:function(t,e){this.canvas.emit(t,e)}},{key:"getEventType",value:function(t){var e,i=this.eventType,n=this.startTime,o=this.startPoints;if(i)return i;var r=this.canvas.__events.pan;if(r&&r.length){var s=Date.now();if(!o)return;e=s-n>250&&10>E(o[0],t[0])?"press":"pan"}else e="press";return this.eventType=e,e}},{key:"enable",value:function(t){this.processEvent[t]=!0}},{key:"isProcess",value:function(t){return this.processEvent[t]}},{key:"emitStart",value:function(t,e){this.isProcess(t)||(this.enable(t),this.emitEvent("".concat(t,"start"),e))}},{key:"emitEnd",value:function(t){}},{key:"clearPressTimeout",value:function(){this.pressTimeout&&(clearTimeout(this.pressTimeout),this.pressTimeout=null)}},{key:"reset",value:function(){this.clearPressTimeout(),this.startTime=0,this.startPoints=null,this.startDistance=0,this.direction=null,this.eventType=null,this.pinch=!1,this.prevMoveTime=0,this.prevMovePoints=null,this.lastMoveTime=0,this.lastMovePoints=null}}]),t}(),P=function(t){a(o,p);var e=l(o);function o(t){var i;n(this,o),(i=e.call(this))._attrs={},i._isWindow=void 0,i._attrs=Object.assign({},t),i._isWindow="undefined"!=typeof window,i._initPixelRatio(),i._initCanvas();return["createImage","toDataURL","requestAnimationFrame"].forEach((function(e){i._initAttrs(e,t.canvas||i.get("el"))})),i}return r(o,[{key:"get",value:function(t){return this._attrs[t]}},{key:"set",value:function(t,e){this._attrs[t]=e}},{key:"_initAttrs",value:function(t,e){var i=this;if(!this.get(t)){this.set(t,(function(){return e[t]?e[t].apply(e,arguments):i._isWindow?window[t]?(n=window)[t].apply(n,arguments):"createImage"==t?new Image:null:void 0;var n}))}}},{key:"_initCanvas",value:function(){var t,e,i=this.get("el"),n=this.get("context");if(!i&&!n)throw Error("请指定 id、el 或 context!");t=i?d(i)?(e=i)?document.getElementById(e):null:i:m(n,this._attrs),n&&t&&!t.getContext&&(t.getContext=function(){return n});var o=this.get("width")||function(t){var e=x(t,"width");return"auto"===e&&(e=t.offsetWidth),parseFloat(e)}(t)||t.width,r=this.get("height")||function(t){var e=x(t,"height");return"auto"===e&&(e=t.offsetHeight),parseFloat(e)}(t)||t.height;this.set("canvas",this),this.set("el",t),this.set("context",n||t.getContext("2d")),this.changeSize(o,r);var s=new L({canvas:this,el:t,parent:this.get("parent")});this.set("eventController",s)}},{key:"_initPixelRatio",value:function(){this.get("pixelRatio")||this.set("pixelRatio",window&&window.devicePixelRatio||1)}},{key:"changeSize",value:function(t,e){var n,o=this.get("pixelRatio"),r=this.get("el");(r.style&&(r.style.width=t+"px",r.style.height=e+"px"),(n=r)&&"object"===i(n)&&(1===n.nodeType&&n.nodeName||n.isCanvasElement))&&(r.width=t*o,r.height=e*o,1!==o&&this.get("context").scale(o,o));this.set("width",t),this.set("height",e)}},{key:"destroy",value:function(){if(!this.get("destroyed")){var t=this.get("el");t.width=0,t.height=0,this.clear(),this._attrs={},this.set("destroyed",!0)}}},{key:"clear",value:function(){}},{key:"isDestroyed",value:function(){return this.get("destroyed")}}]),o}();var T={penColor:"black",backgroundColor:"",openSmooth:!0,penSize:2,minLineWidth:2,maxLineWidth:6,minSpeed:1.5,maxWidthDiffRate:20,maxHistoryLength:20},M=function(){function t(e){var i=this;n(this,t),this.canAddHistory=!0,this.points=[],this.historyList=[],this.canvas=void 0,this._isEmpty=!0,this.active=!1,this.getLineWidth=function(t){var e=i.get("options"),n=e.minSpeed,o=e.minLineWidth,r=i.getMaxLineWidth();return Math.min(Math.max(r-(r-o)*t/Math.max(Math.min(n,10),1),o),r)},this.drawTrapezoid=function(t,e,n,o){var r=i.get("context");r.beginPath(),r.moveTo(Number(t.x.toFixed(1)),Number(t.y.toFixed(1))),r.lineTo(Number(e.x.toFixed(1)),Number(e.y.toFixed(1))),r.lineTo(Number(n.x.toFixed(1)),Number(n.y.toFixed(1))),r.lineTo(Number(o.x.toFixed(1)),Number(o.y.toFixed(1))),r.fillStyle=i.get("options").penColor,r.fill(),r.draw&&r.draw(!0)},this.drawNoSmoothLine=function(t,e){e.lastX=t.x+.5*(e.x-t.x),e.lastY=t.y+.5*(e.y-t.y),"number"==typeof t.lastX&&i.drawCurveLine(t.lastX,t.lastY,t.x,t.y,e.lastX,e.lastY,i.getMaxLineWidth())},this.drawCurveLine=function(t,e,n,o,r,s,a){a=Number(a.toFixed(1));var c=i.get("context");c.lineWidth=a,c.beginPath(),c.moveTo(Number(t.toFixed(1)),Number(e.toFixed(1))),c.quadraticCurveTo(Number(n.toFixed(1)),Number(o.toFixed(1)),Number(r.toFixed(1)),Number(s.toFixed(1))),c.stroke(),c.draw&&c.draw(!0)},this.getRadianData=function(t,e,i,n){var o=i-t,r=n-e;if(0===o)return{val:0,pos:-1};if(0===r)return{val:0,pos:1};var s=Math.abs(Math.atan(r/o));return i>t&&e>n||t>i&&n>e?{val:s,pos:1}:{val:s,pos:-1}},this.getRadianPoints=function(t,e,i,n){if(0===t.val)return 1===t.pos?[{x:e,y:i+n},{x:e,y:i-n}]:[{y:i,x:e+n},{y:i,x:e-n}];var o=Math.sin(t.val)*n,r=Math.cos(t.val)*n;return 1===t.pos?[{x:e+o,y:i+r},{x:e-o,y:i-r}]:[{x:e+o,y:i-r},{x:e-o,y:i+r}]},this.drawSmoothLine=function(t,e){var n=e.x-t.x,o=e.y-t.y;if(Math.abs(n)+Math.abs(o)>2?(e.lastX1=t.x+.3*n,e.lastY1=t.y+.3*o,e.lastX2=t.x+.7*n,e.lastY2=t.y+.7*o):(e.lastX1=e.lastX2=t.x+.5*n,e.lastY1=e.lastY2=t.y+.5*o),e.perLineWidth=(t.lineWidth+e.lineWidth)/2,"number"==typeof t.lastX1){if(i.drawCurveLine(t.lastX2,t.lastY2,t.x,t.y,e.lastX1,e.lastY1,e.perLineWidth),t.isFirstPoint)return;if(t.lastX1===t.lastX2&&t.lastY1===t.lastY2)return;var r=i.getRadianData(t.lastX1,t.lastY1,t.lastX2,t.lastY2),s=i.getRadianPoints(r,t.lastX1,t.lastY1,t.perLineWidth/2),a=i.getRadianPoints(r,t.lastX2,t.lastY2,e.perLineWidth/2);i.drawTrapezoid(s[0],a[0],a[1],s[1])}else e.isFirstPoint=!0},this.addHistory=function(){var t=i.get("options").maxHistoryLength;if(t&&i.canAddHistory)if(i.canAddHistory=!1,i.get("createImage")){var e=null;e=i.get("createImage")();var n=i.get("toDataURL")&&i.get("toDataURL")();d(n)?e.src=n:n.then((function(t){e.src=t})),e.onload=function(){i.historyList.push(e),i.historyList=i.historyList.slice(-t)}}else i.historyList.length++},this.drawByImage=function(t){var e=i.get("context"),n=i.get("width"),o=i.get("height");e.clearRect(0,0,n,o);try{e.drawImage(t,0,0,n,o),e.draw&&e.draw(!0)}catch(t){i.historyList.length=0}},this.isEmpty=function(){return i.get("options").maxHistoryLength>0?0===i.historyList.length:i._isEmpty},this.clear=function(){var t=i.get("context");t.clearRect(0,0,i.get("width"),i.get("height")),t.draw&&t.draw(),i._isEmpty=!0,i.historyList.length=0},this.undo=function(){if(0===i.get("options").maxHistoryLength&&i.clear(),i.get("createImage")&&i.historyList.length){var t=i.historyList.splice(-1)[0];i.drawByImage(t),0===i.historyList.length&&i.clear()}},this.canvas=e,this.canvas.set("pen",T),this.init()}return r(t,[{key:"getOption",value:function(){}},{key:"setOption",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},i=e({},t),n=i.maxLineWidth;if(n&&t.penSize&&n==T.maxLineWidth){var o=Math.max(n,t.penSize);i.maxLineWidth=o}this.canvas.set("pen",Object.assign({},T,i))}},{key:"get",value:function(t){return this.canvas.get("options"==t?"pen":t)}},{key:"init",value:function(){var t=this;this.get("context").lineCap="round",this.canvas.on("touchstart",(function(e){return t.onDrawStart(e)})),this.canvas.on("touchmove",(function(e){return t.onDrawMove(e)})),this.canvas.on("touchend",(function(e){return t.onDrawEnd(e)}))}},{key:"drawBackground",value:function(){var t=this.get("context"),e=this.get("width"),i=this.get("height"),n=this.get("options"),o=n.backgroundColor,r=n.backgroundImage;o&&(t.fillStyle=o,t.fillRect(0,0,e,i),t.draw&&t.draw(!0)),r&&this.drawByImage(r)}},{key:"remove",value:function(){var t=this;this.canvas.off("touchstart",(function(e){return t.onDrawStart(e)})),this.canvas.off("touchmove",(function(e){return t.onDrawMove(e)})),this.canvas.off("touchend",(function(e){return t.onDrawEnd(e)}))}},{key:"disableScroll",value:function(t){t.preventDefault&&this.get("options").disableScroll&&t.preventDefault()}},{key:"onDrawStart",value:function(t){this.disableScroll(t);var e=t.points;if(this.active){this.canAddHistory=!0,this.get("context").strokeStyle=this.get("options").penColor;var i=e[0];this.initPoint(i.x,i.y)}}},{key:"onDrawMove",value:function(t){if(this.disableScroll(t),this.active){var e=t.points[0];this.initPoint(e.x,e.y),this.onDraw()}}},{key:"onDrawEnd",value:function(t){this.active&&(this.canAddHistory=!0,this.points=[])}},{key:"onDraw",value:function(){var t=this,e=this.get("context");if(this.points.length>=2){this.addHistory(),e.lineWidth=this.get("options").penSize||2;var i=this.points.slice(-1)[0],n=this.points.slice(-2,-1)[0],o=function(){t._isEmpty=!1,t.get("options").openSmooth?t.drawSmoothLine(n,i):t.drawNoSmoothLine(n,i)};"function"==typeof this.get("el").requestAnimationFrame?this.get("el").requestAnimationFrame((function(){return o()})):o()}}},{key:"getMaxLineWidth",value:function(){var t=this.get("options");return Math.min(t.penSize,t.maxLineWidth)}},{key:"initPoint",value:function(t,e){var i={x:t,y:e,t:Date.now()},n=this.points.slice(-1)[0];if(!n||n.t!==i.t&&(n.x!==t||n.y!==e)){if(this.get("options").openSmooth&&n){var o=this.points.slice(-2,-1)[0];if(i.distance=Math.sqrt(Math.pow(i.x-n.x,2)+Math.pow(i.y-n.y,2)),i.speed=i.distance/(i.t-n.t||.1),i.lineWidth=this.getLineWidth(i.speed),o&&o.lineWidth&&n.lineWidth){var r=(i.lineWidth-n.lineWidth)/n.lineWidth,s=this.get("options").maxWidthDiffRate/100;if(s=s>1?1:.01>s?.01:s,Math.abs(r)>s)i.lineWidth=n.lineWidth*(1+(r>0?s:-s))}}this.points.push(i),this.points=this.points.slice(-3)}}}]),t}(),S=function(){function t(e){n(this,t),this.canvas=void 0,this._ee=void 0,this.pen=void 0;var i=new P(e);i.set("parent",this),this.canvas=i,this._ee=new p,this.pen=new M(i),this.init()}return r(t,[{key:"init",value:function(){this.pen.active=!0}},{key:"destroy",value:function(){this.canvas.destroy()}},{key:"clear",value:function(){this.pen.clear()}},{key:"undo",value:function(){this.pen.undo()}},{key:"save",value:function(){}},{key:"isEmpty",value:function(){return this.pen.isEmpty()}},{key:"on",value:function(t,e){this._ee.on(t,e)}},{key:"emit",value:function(t,e){this._ee.emit(t,e)}},{key:"off",value:function(t,e){this._ee.off(t,e)}}]),t}();export default S;export{S as Signature};
uni_modules/lime-signature/components/l-signature/utils.js 0 → 100644
export function compareVersion(v1, v2) {
v1 = v1.split('.')
v2 = v2.split('.')
const len = Math.max(v1.length, v2.length)
while (v1.length < len) {
v1.push('0')
}
while (v2.length < len) {
v2.push('0')
}
for (let i = 0; i < len; i++) {
const num1 = parseInt(v1[i], 10)
const num2 = parseInt(v2[i], 10)
if (num1 > num2) {
return 1
} else if (num1 < num2) {
return -1
}
}
return 0
}
export const getCanvas2d = () => {
let {SDKVersion, uniPlatform} = uni.getSystemInfoSync()
if(!uniPlatform) {
// #ifdef MP-WEIXIN
uniPlatform = 'mp-weixin'
// #endif
// #ifdef MP-MP-ALIPAY
SDKVersion = my.SDKVersion
uniPlatform = 'mp-alipay'
// #endif
// #ifdef MP-MP-ALIPAY
uniPlatform = 'mp-toutiao'
// #endif
}
const MAP = {
'mp-weixin': '2.9.7',
'mp-toutiao': '1.78.0',
'mp-alipay': '2.7.0'
}[uniPlatform]
return MAP && SDKVersion && compareVersion(SDKVersion, MAP) >= 1
}
export const wrapEvent = (e) => {
if (!e) return;
if (!e.preventDefault) {
e.preventDefault = function() {};
}
return e;
}
export const requestAnimationFrame = (cb) => {
setTimeout(cb, 30)
}
/**
* base64转路径
* @param {Object} base64
*/
export function base64ToPath(base64) {
const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64) || [];
return new Promise((resolve, reject) => {
const bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now())
bitmap.loadBase64Data(base64, () => {
if (!format) {
reject(new Error('ERROR_BASE64SRC_PARSE'))
}
const time = new Date().getTime();
const filePath = `_doc/uniapp_temp/${time}.${format}`
bitmap.save(filePath, {},
() => {
bitmap.clear()
resolve(filePath)
},
(error) => {
bitmap.clear()
reject(error)
})
}, (error) => {
bitmap.clear()
reject(error)
})
})
}
export function sleep(delay) {
return new Promise(resolve => setTimeout(resolve, delay))
}
\ No newline at end of file
uni_modules/lime-signature/components/lime-signature/index.vue 0 → 100644
<template>
</template>
<script>
</script>
<style>
</style>
\ No newline at end of file
uni_modules/lime-signature/package.json 0 → 100644
{
"id": "lime-signature",
"displayName": "手写板-签名",
"version": "1.0.0",
"description": "手写板签名组件： 一款能跑在uniapp各端中的签名插件，支持签名颜色笔画大小等功能",
"keywords": [
"canvas",
"写字",
"签名",
"涂鸦"
],
"repository": "",
"engines": {
"HBuilderX": "^3.5.4"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "",
"type": "component-vue"
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "u",
"Edge": "u",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "u",
"百度": "u",
"字节跳动": "u",
"QQ": "u"
},
"快应用": {
"华为": "u",
"联盟": "u"
}
}
}
}
}
\ No newline at end of file
uni_modules/lime-signature/readme.md 0 → 100644
# signature 写字板
> uniapp 写字板，可用业务签名等场景
> [查看更多 站点1](https://limeui.qcoon.cn/#/signature) <br>
> [查看更多 站点2](http://liangei.gitee.io/limeui/#/signature)
> Q群：1169785031
## 平台兼容
| H5 | 微信小程序 | 支付宝小程序 | 百度小程序 | 头条小程序 | QQ 小程序 | App |
| --- | ---------- | ------------ | ---------- | ---------- | --------- | --- |
| √ | √ | 未测 | 未测 | 未测 | 未测 | √ |
## 代码演示
### 基本用法
```html
<view style="width: 750rpx ;height: 750rpx;">
<l-signature disableScroll backgroundColor="#ddd" ref="signatureRef" :penColor="penColor" :penSize="penSize" :openSmooth="openSmooth" ></l-signature>
</view>
<view>
<button @click="onClick('clear')">清空</button>
<button @click="onClick('undo')">撤消</button>
<button @click="onClick('save')">保存</button>
<button @click="onClick('openSmooth')">压感{{openSmooth?'开':'关'}}</button>
</view>
```
```js
export default {
data() {
return {
title: 'Hello',
penColor: 'red',
penSize: 5,
url: '',
openSmooth: true
}
},
methods: {
onClick(type) {
if(type == 'openSmooth') {
this.openSmooth = !this.openSmooth
return
}
if (type == 'save') {
this.$refs.signatureRef.canvasToTempFilePath({
success: (res) => {
// 是否为空画板 无签名
console.log(res.isEmpty)
// 生成图片的临时路径
// app | H5 | 微信小程序 生成的是base64
this.url = res.tempFilePath
}
})
return
}
if (this.$refs.signatureRef)
this.$refs.signatureRef[type]()
}
}
}
```
## API
### Props
| 参数 | 说明 | 类型 | 默认值 |
| -------------- | ------------ | ---------------- | ------------ |
| penSize | 画笔大小 | <em>number</em> | `2` |
| minLineWidth | 线条最小宽 | <em>number</em> | `2` |
| maxLineWidth | 线条最大宽 | <em>number</em> | `6` |
| penColor | 画笔颜色 | <em>string</em> | `black` |
| backgroundColor | 背景颜色 | <em>string</em> | `` |
| type | 指定 canvas 类型 | <em>string</em> | `2d` |
| openSmooth | 是否模拟压感 | <em>boolean</em> | `false` |
| beforeDelay | 延时初始化，在放在弹窗里可以使用 （毫秒） | <em>number</em> | `0` |
| maxHistoryLength | 限制历史记录数，即最大可撤销数，传入0则关闭历史记录功能 | <em>boolean</em> | `20` |
### 事件 Events
| 事件名 | 说明 | 回调 |
| ------- | ------------ | -------------- |
| undo | 撤消，回退到上一步 | |
| clear | 清空，清空画板 | |
| canvasToTempFilePath | 保存，生成图片，与官方保持一致，但不需要传canvasId | |
### 常见问题
- 放在弹窗里时，尺寸不对 可以延时手写板出现时机，给手写板加vif或beforeDelay="300"
### 打赏
如果你觉得本插件，解决了你的问题，赠人玫瑰，手留余香。
![输入图片说明](https://static-6d65bd90-8508-4d6c-abbc-a4ef5c8e49e7.bspapp.com/image/222521_bb543f96_518581.jpeg "微信图片编辑_20201122220352.jpg")
![输入图片说明](https://static-6d65bd90-8508-4d6c-abbc-a4ef5c8e49e7.bspapp.com/image/wxplay.jpg "wxplay.jpg")
\ No newline at end of file
uni_modules/lime-signature/static/index.html 0 → 100644
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title></title>
<style type="text/css">
html,
body,
canvas {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
overflow-y: hidden;
background-color: transparent;
}
</style>
</head>
<body>
<canvas id="lime-signature"></canvas>
<script type="text/javascript" src="./uni.webview.1.5.3.js"></script>
<script type="text/javascript" src="./signature.js"></script>
<script>
var signature = null;
var timer = null;
var isStart = false;
var options = null
console.log = function(...args) {
postMessage(args);
};
// function stringify(key, value) {
// if (typeof value === 'object' && value !== null) {
// if (cache.indexOf(value) !== -1) {
// return;
// }
// cache.push(value);
// }
// return value;
// };
function emit(event, data) {
postMessage({
event,
data: typeof data !== "object" && data !== null ? data : JSON.stringify(data),
});
// cache = [];
}
function postMessage(data) {
uni.postMessage({
data
});
}
function update(v = {}) {
if (signature) {
options = v
signature.pen.setOption(v);
} else {
signature = new Signature.Signature({el: "lime-signature"});
canvasEl = signature.canvas.get("el");
options = v
signature.pen.setOption(v)
const width = signature.canvas.get("width");
const height = signature.canvas.get("height");
emit({changeSize: {width,height}})
}
}
function clear() {
signature.clear()
}
function undo() {
signature.undo()
}
function isEmpty() {
const isEmpty = signature.isEmpty()
emit({isEmpty});
}
function save(args) {
// delete args.success;
// delete args.fail;
clearTimeout(timer);
timer = setTimeout(() => {
let path = canvasEl.toDataURL()
if(options.backgroundColor) {
const canvas = document.createElement('canvas')
const width = signature.canvas.get('width')
const height = signature.canvas.get('height')
const pixelRatio = signature.canvas.get('pixelRatio')
canvas.width = width * pixelRatio
canvas.height = height * pixelRatio
const context = canvas.getContext('2d')
context.scale(pixelRatio, pixelRatio)
context.fillStyle = backgroundColor
context.fillRect(0,0, width, height)
context.drawImage(signature.canvas.get('el'), 0, 0, width, height)
path = canvas.toDataURL()
canvas.remove()
}
if (typeof path == "string") {
const index = Math.ceil(path.length / 8);
for (var i = 0; i < 8; i++) {
if (i == 7) {
emit({"success": path.substr(i * index, index)});
} else {
emit({"file": path.substr(i * index, index)});
}
}
} else {
console.error("canvas no data");
emit({"fail": "canvas no data"});
}
}, 30);
}
</script>
</body>
</html>
uni_modules/lime-signature/static/signature.js 0 → 100644
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Signature={})}(this,(function(t){"use strict";function e(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,n)}return i}function i(t){for(var i=1;arguments.length>i;i++){var n=null!=arguments[i]?arguments[i]:{};i%2?e(Object(n),!0).forEach((function(e){a(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):e(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function n(t){return n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},n(t)}function o(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function r(t,e){for(var i=0;e.length>i;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function s(t,e,i){return e&&r(t.prototype,e),i&&r(t,i),Object.defineProperty(t,"prototype",{writable:!1}),t}function a(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function u(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&h(t,e)}function c(t){return c=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)},c(t)}function h(t,e){return h=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t},h(t,e)}function l(t,e){if(e&&("object"==typeof e||"function"==typeof e))return e;if(void 0!==e)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t)}function v(t){var e=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(t){return!1}}();return function(){var i,n=c(t);if(e){var o=c(this).constructor;i=Reflect.construct(n,arguments,o)}else i=n.apply(this,arguments);return l(this,i)}}var f={}.toString,d=function(t,e){return f.call(t)==="[object "+e+"]"},y=function(t){return d(t,"String")},p=function(t){return d(t,"Number")},g=function(){function t(){o(this,t),this.__events=void 0,this.__events={}}return s(t,[{key:"on",value:function(t,e){if(t&&e){var i=this.__events[t]||[];i.push(e),this.__events[t]=i}}},{key:"emit",value:function(t,e){var i=this;if(function(t){var e=n(t);return null!==t&&"object"===e||"function"===e}(t)&&(t=(e=t)&&e.type),t){var o=this.__events[t];o&&o.length&&o.forEach((function(t){t.call(i,e)}))}}},{key:"off",value:function(t,e){var i=this.__events,n=i[t];if(n&&n.length)if(e)for(var o=0,r=n.length;r>o;o++)n[o]===e&&(n.splice(o,1),o--);else delete i[t]}},{key:"getEvents",value:function(){return this.__events}}]),t}(),m=function(t){u(i,t);var e=v(i);function i(t,n){var r;return o(this,i),(r=e.call(this)).context=void 0,r.canvas=void 0,r.attrs=void 0,r.isCanvasElement=void 0,r.context=t,r.canvas=n.canvas||t.canvas||{width:n.width||0,height:n.height||0},r.attrs=n||{},r.isCanvasElement=!0,r}return s(i,[{key:"width",get:function(){return this.canvas.width},set:function(t){this.canvas.width=t}},{key:"height",get:function(){return this.canvas.height},set:function(t){this.canvas.height=t}},{key:"getContext",value:function(){return this.context}},{key:"getBoundingClientRect",value:function(){var t=this.attrs||{},e=t.top,i=t.right,n=t.width,o=t.height,r=t.left,s=t.bottom;return{top:void 0===e?0:e,width:void 0===n?0:n,right:void 0===i?0:i,height:void 0===o?0:o,bottom:void 0===s?0:s,left:void 0===r?0:r}}},{key:"setAttribute",value:function(t,e){this.attrs[t]=e}},{key:"addEventListener",value:function(t,e){this.on(t,e)}},{key:"removeEventListener",value:function(t,e){this.off(t,e)}},{key:"dispatchEvent",value:function(t,e){this.emit(t,e)}}]),i}(g);var x=function(t,e){return t?function(t){if(!t)return!1;if(1!==t.nodeType||!t.nodeName||"canvas"!==t.nodeName.toLowerCase())return!1;var e=!1;try{t.addEventListener("eventTest",(function(){e=!0})),t.dispatchEvent(new Event("eventTest"))}catch(t){e=!1}return e}(t.canvas)?t.canvas:new m(t,e):null};function w(t,e){try{return t.currentStyle?t.currentStyle[e]:document.defaultView&&document.defaultView.getComputedStyle(t,null).getPropertyValue(e)}catch(t){return{width:300,height:150}[e]}}function b(t,e){var i=e.get("el");if(!i)return t;var n=i.getBoundingClientRect(),o=n.top,r=void 0===o?0:o,s=n.left,a=void 0===s?0:s,u=parseFloat(w(i,"padding-left"))||0,c=parseFloat(w(i,"padding-top"))||0;return{x:t.x-a-u,y:t.y-r-c}}function k(t,e){var i=e.get("landscape");if(!i)return t;if(d(i,"Function"))return i(t,e);var n=e.get("height");return{x:t.y,y:n-t.x}}var _=function(t,e){var i=t.touches;if(!i||!i.length)return[k(b({x:t.clientX,y:t.clientY},e),e)];i.length||(i=t.changedTouches||[]);for(var n=[],o=0,r=i.length;r>o;o++){var s=i[o],a=s.x,u=s.y,c=s.clientX,h=s.clientY,l=void 0;l=p(a)||p(u)?{x:a,y:u}:b({x:c,y:h},e),n.push(k(l,e))}return n},E=function(t,e){var i=e.x-t.x,n=e.y-t.y;return Math.abs(i)>Math.abs(n)?i>0?"right":"left":n>0?"down":"up"},P=function(t,e){var i=Math.abs(e.x-t.x),n=Math.abs(e.y-t.y);return Math.sqrt(i*i+n*n)},L=function(){function t(e){var i=this,n=e.canvas,r=e.el;o(this,t),this.processEvent=void 0,this.canvas=void 0,this.startTime=0,this.endTime=0,this.startPoints=null,this.startDistance=0,this.center=null,this.pressTimeout=void 0,this.eventType=null,this.direction=null,this.lastMoveTime=0,this.prevMovePoints=null,this.prevMoveTime=0,this.lastMovePoints=null,this.pinch=!1,this._click=function(t){var e=_(t,i.canvas);t.points=e,i.emitEvent("click",t)},this._start=function(t){var e,n,o=_(t,i.canvas);o&&(t.points=o,i.emitEvent("touchstart",t),i.reset(),i.startTime=Date.now(),i.startPoints=o,o.length>1?(i.startDistance=P(o[0],o[1]),i.center={x:(e=o[0]).x+((n=o[1]).x-e.x)/2,y:e.y+(n.y-e.y)/2}):i.pressTimeout=setTimeout((function(){var e="press",n="none";t.direction=n,i.emitStart(e,t),i.emitEvent(e,t),i.eventType=e,i.direction=n}),250))},this._move=function(t){var e=_(t,i.canvas);if(e){t.points=e,i.emitEvent("touchmove",t);var n=i.startPoints;if(n)if(e.length>1){var o=i.startDistance,r=P(e[0],e[1]);t.zoom=r/o,t.center=i.center,i.emitStart("pinch",t),i.emitEvent("pinch",t)}else{var s=e[0].x-n[0].x,a=e[0].y-n[0].y,u=i.direction||E(n[0],e[0]);i.direction=u;var c=i.getEventType(e);t.direction=u,t.deltaX=s,t.deltaY=a,i.emitStart(c,t),i.emitEvent(c,t);var h=i.lastMoveTime,l=Date.now();l-h>0&&(i.prevMoveTime=h,i.prevMovePoints=i.lastMovePoints,i.lastMoveTime=l,i.lastMovePoints=e)}}},this._end=function(t){var e=_(t,i.canvas);t.points=e,i.emitEnd(t),i.emitEvent("touchend",t);var n=i.lastMoveTime;if(100>Date.now()-n){var o=n-(i.prevMoveTime||i.startTime);if(o>0){var r=i.prevMovePoints||i.startPoints,s=i.lastMovePoints;if(!r||!s)return;var a=P(r[0],s[0])/o;a>.3&&(t.velocity=a,t.direction=E(r[0],s[0]),i.emitEvent("swipe",t))}}i.reset();var u=t.touches;u&&u.length>0&&i._start(t)},this._cancel=function(t){i.emitEvent("touchcancel",t),i.reset()},this.canvas=n,this.delegateEvent(r),this.processEvent={}}return s(t,[{key:"delegateEvent",value:function(t){t.addEventListener("click",this._click),t.addEventListener("touchstart",this._start),t.addEventListener("touchmove",this._move),t.addEventListener("touchend",this._end),t.addEventListener("touchcancel",this._cancel)}},{key:"emitEvent",value:function(t,e){this.canvas.emit(t,e)}},{key:"getEventType",value:function(t){var e,i=this.eventType,n=this.startTime,o=this.startPoints;if(i)return i;var r=this.canvas.__events.pan;if(r&&r.length){var s=Date.now();if(!o)return;e=s-n>250&&10>P(o[0],t[0])?"press":"pan"}else e="press";return this.eventType=e,e}},{key:"enable",value:function(t){this.processEvent[t]=!0}},{key:"isProcess",value:function(t){return this.processEvent[t]}},{key:"emitStart",value:function(t,e){this.isProcess(t)||(this.enable(t),this.emitEvent("".concat(t,"start"),e))}},{key:"emitEnd",value:function(t){}},{key:"clearPressTimeout",value:function(){this.pressTimeout&&(clearTimeout(this.pressTimeout),this.pressTimeout=null)}},{key:"reset",value:function(){this.clearPressTimeout(),this.startTime=0,this.startPoints=null,this.startDistance=0,this.direction=null,this.eventType=null,this.pinch=!1,this.prevMoveTime=0,this.prevMovePoints=null,this.lastMoveTime=0,this.lastMovePoints=null}}]),t}(),T=function(t){u(i,t);var e=v(i);function i(t){var n;o(this,i),(n=e.call(this))._attrs={},n._isWindow=void 0,n._attrs=Object.assign({},t),n._isWindow="undefined"!=typeof window,n._initPixelRatio(),n._initCanvas();return["createImage","toDataURL","requestAnimationFrame"].forEach((function(e){n._initAttrs(e,t.canvas||n.get("el"))})),n}return s(i,[{key:"get",value:function(t){return this._attrs[t]}},{key:"set",value:function(t,e){this._attrs[t]=e}},{key:"_initAttrs",value:function(t,e){var i=this;if(!this.get(t)){this.set(t,(function(){return e[t]?e[t].apply(e,arguments):i._isWindow?window[t]?(n=window)[t].apply(n,arguments):"createImage"==t?new Image:null:void 0;var n}))}}},{key:"_initCanvas",value:function(){var t,e,i=this.get("el"),n=this.get("context");if(!i&&!n)throw Error("请指定 id、el 或 context!");t=i?y(i)?(e=i)?document.getElementById(e):null:i:x(n,this._attrs),n&&t&&!t.getContext&&(t.getContext=function(){return n});var o=this.get("width")||function(t){var e=w(t,"width");return"auto"===e&&(e=t.offsetWidth),parseFloat(e)}(t)||t.width,r=this.get("height")||function(t){var e=w(t,"height");return"auto"===e&&(e=t.offsetHeight),parseFloat(e)}(t)||t.height;this.set("canvas",this),this.set("el",t),this.set("context",n||t.getContext("2d")),this.changeSize(o,r);var s=new L({canvas:this,el:t,parent:this.get("parent")});this.set("eventController",s)}},{key:"_initPixelRatio",value:function(){this.get("pixelRatio")||this.set("pixelRatio",window&&window.devicePixelRatio||1)}},{key:"changeSize",value:function(t,e){var i,o=this.get("pixelRatio"),r=this.get("el");(r.style&&(r.style.width=t+"px",r.style.height=e+"px"),(i=r)&&"object"===n(i)&&(1===i.nodeType&&i.nodeName||i.isCanvasElement))&&(r.width=t*o,r.height=e*o,1!==o&&this.get("context").scale(o,o));this.set("width",t),this.set("height",e)}},{key:"destroy",value:function(){if(!this.get("destroyed")){var t=this.get("el");t.width=0,t.height=0,this.clear(),this._attrs={},this.set("destroyed",!0)}}},{key:"clear",value:function(){}},{key:"isDestroyed",value:function(){return this.get("destroyed")}}]),i}(g);var M={penColor:"black",backgroundColor:"",openSmooth:!0,penSize:2,minLineWidth:2,maxLineWidth:6,minSpeed:1.5,maxWidthDiffRate:20,maxHistoryLength:20},S=function(){function t(e){var i=this;o(this,t),this.canAddHistory=!0,this.points=[],this.historyList=[],this.canvas=void 0,this._isEmpty=!0,this.active=!1,this.getLineWidth=function(t){var e=i.get("options"),n=e.minSpeed,o=e.minLineWidth,r=i.getMaxLineWidth();return Math.min(Math.max(r-(r-o)*t/Math.max(Math.min(n,10),1),o),r)},this.drawTrapezoid=function(t,e,n,o){var r=i.get("context");r.beginPath(),r.moveTo(Number(t.x.toFixed(1)),Number(t.y.toFixed(1))),r.lineTo(Number(e.x.toFixed(1)),Number(e.y.toFixed(1))),r.lineTo(Number(n.x.toFixed(1)),Number(n.y.toFixed(1))),r.lineTo(Number(o.x.toFixed(1)),Number(o.y.toFixed(1))),r.fillStyle=i.get("options").penColor,r.fill(),r.draw&&r.draw(!0)},this.drawNoSmoothLine=function(t,e){e.lastX=t.x+.5*(e.x-t.x),e.lastY=t.y+.5*(e.y-t.y),"number"==typeof t.lastX&&i.drawCurveLine(t.lastX,t.lastY,t.x,t.y,e.lastX,e.lastY,i.getMaxLineWidth())},this.drawCurveLine=function(t,e,n,o,r,s,a){a=Number(a.toFixed(1));var u=i.get("context");u.lineWidth=a,u.beginPath(),u.moveTo(Number(t.toFixed(1)),Number(e.toFixed(1))),u.quadraticCurveTo(Number(n.toFixed(1)),Number(o.toFixed(1)),Number(r.toFixed(1)),Number(s.toFixed(1))),u.stroke(),u.draw&&u.draw(!0)},this.getRadianData=function(t,e,i,n){var o=i-t,r=n-e;if(0===o)return{val:0,pos:-1};if(0===r)return{val:0,pos:1};var s=Math.abs(Math.atan(r/o));return i>t&&e>n||t>i&&n>e?{val:s,pos:1}:{val:s,pos:-1}},this.getRadianPoints=function(t,e,i,n){if(0===t.val)return 1===t.pos?[{x:e,y:i+n},{x:e,y:i-n}]:[{y:i,x:e+n},{y:i,x:e-n}];var o=Math.sin(t.val)*n,r=Math.cos(t.val)*n;return 1===t.pos?[{x:e+o,y:i+r},{x:e-o,y:i-r}]:[{x:e+o,y:i-r},{x:e-o,y:i+r}]},this.drawSmoothLine=function(t,e){var n=e.x-t.x,o=e.y-t.y;if(Math.abs(n)+Math.abs(o)>2?(e.lastX1=t.x+.3*n,e.lastY1=t.y+.3*o,e.lastX2=t.x+.7*n,e.lastY2=t.y+.7*o):(e.lastX1=e.lastX2=t.x+.5*n,e.lastY1=e.lastY2=t.y+.5*o),e.perLineWidth=(t.lineWidth+e.lineWidth)/2,"number"==typeof t.lastX1){if(i.drawCurveLine(t.lastX2,t.lastY2,t.x,t.y,e.lastX1,e.lastY1,e.perLineWidth),t.isFirstPoint)return;if(t.lastX1===t.lastX2&&t.lastY1===t.lastY2)return;var r=i.getRadianData(t.lastX1,t.lastY1,t.lastX2,t.lastY2),s=i.getRadianPoints(r,t.lastX1,t.lastY1,t.perLineWidth/2),a=i.getRadianPoints(r,t.lastX2,t.lastY2,e.perLineWidth/2);i.drawTrapezoid(s[0],a[0],a[1],s[1])}else e.isFirstPoint=!0},this.addHistory=function(){var t=i.get("options").maxHistoryLength;if(t&&i.canAddHistory)if(i.canAddHistory=!1,i.get("createImage")){var e=null;e=i.get("createImage")();var n=i.get("toDataURL")&&i.get("toDataURL")();y(n)?e.src=n:n.then((function(t){e.src=t})),e.onload=function(){i.historyList.push(e),i.historyList=i.historyList.slice(-t)}}else i.historyList.length++},this.drawByImage=function(t){var e=i.get("context"),n=i.get("width"),o=i.get("height");e.clearRect(0,0,n,o);try{e.drawImage(t,0,0,n,o),e.draw&&e.draw(!0)}catch(t){i.historyList.length=0}},this.isEmpty=function(){return i.get("options").maxHistoryLength>0?0===i.historyList.length:i._isEmpty},this.clear=function(){var t=i.get("context");t.clearRect(0,0,i.get("width"),i.get("height")),t.draw&&t.draw(),i._isEmpty=!0,i.historyList.length=0},this.undo=function(){if(0===i.get("options").maxHistoryLength&&i.clear(),i.get("createImage")&&i.historyList.length){var t=i.historyList.splice(-1)[0];i.drawByImage(t),0===i.historyList.length&&i.clear()}},this.canvas=e,this.canvas.set("pen",M),this.init()}return s(t,[{key:"getOption",value:function(){}},{key:"setOption",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=i({},t),n=e.maxLineWidth;if(n&&t.penSize&&n==M.maxLineWidth){var o=Math.max(n,t.penSize);e.maxLineWidth=o}this.canvas.set("pen",Object.assign({},M,e))}},{key:"get",value:function(t){return this.canvas.get("options"==t?"pen":t)}},{key:"init",value:function(){var t=this;this.get("context").lineCap="round",this.canvas.on("touchstart",(function(e){return t.onDrawStart(e)})),this.canvas.on("touchmove",(function(e){return t.onDrawMove(e)})),this.canvas.on("touchend",(function(e){return t.onDrawEnd(e)}))}},{key:"drawBackground",value:function(){var t=this.get("context"),e=this.get("width"),i=this.get("height"),n=this.get("options"),o=n.backgroundColor,r=n.backgroundImage;o&&(t.fillStyle=o,t.fillRect(0,0,e,i),t.draw&&t.draw(!0)),r&&this.drawByImage(r)}},{key:"remove",value:function(){var t=this;this.canvas.off("touchstart",(function(e){return t.onDrawStart(e)})),this.canvas.off("touchmove",(function(e){return t.onDrawMove(e)})),this.canvas.off("touchend",(function(e){return t.onDrawEnd(e)}))}},{key:"disableScroll",value:function(t){t.preventDefault&&this.get("options").disableScroll&&t.preventDefault()}},{key:"onDrawStart",value:function(t){this.disableScroll(t);var e=t.points;if(this.active){this.canAddHistory=!0,this.get("context").strokeStyle=this.get("options").penColor;var i=e[0];this.initPoint(i.x,i.y)}}},{key:"onDrawMove",value:function(t){if(this.disableScroll(t),this.active){var e=t.points[0];this.initPoint(e.x,e.y),this.onDraw()}}},{key:"onDrawEnd",value:function(t){this.active&&(this.canAddHistory=!0,this.points=[])}},{key:"onDraw",value:function(){var t=this,e=this.get("context");if(this.points.length>=2){this.addHistory(),e.lineWidth=this.get("options").penSize||2;var i=this.points.slice(-1)[0],n=this.points.slice(-2,-1)[0],o=function(){t._isEmpty=!1,t.get("options").openSmooth?t.drawSmoothLine(n,i):t.drawNoSmoothLine(n,i)};"function"==typeof this.get("el").requestAnimationFrame?this.get("el").requestAnimationFrame((function(){return o()})):o()}}},{key:"getMaxLineWidth",value:function(){var t=this.get("options");return Math.min(t.penSize,t.maxLineWidth)}},{key:"initPoint",value:function(t,e){var i={x:t,y:e,t:Date.now()},n=this.points.slice(-1)[0];if(!n||n.t!==i.t&&(n.x!==t||n.y!==e)){if(this.get("options").openSmooth&&n){var o=this.points.slice(-2,-1)[0];if(i.distance=Math.sqrt(Math.pow(i.x-n.x,2)+Math.pow(i.y-n.y,2)),i.speed=i.distance/(i.t-n.t||.1),i.lineWidth=this.getLineWidth(i.speed),o&&o.lineWidth&&n.lineWidth){var r=(i.lineWidth-n.lineWidth)/n.lineWidth,s=this.get("options").maxWidthDiffRate/100;if(s=s>1?1:.01>s?.01:s,Math.abs(r)>s)i.lineWidth=n.lineWidth*(1+(r>0?s:-s))}}this.points.push(i),this.points=this.points.slice(-3)}}}]),t}(),O=function(){function t(e){o(this,t),this.canvas=void 0,this._ee=void 0,this.pen=void 0;var i=new T(e);i.set("parent",this),this.canvas=i,this._ee=new g,this.pen=new S(i),this.init()}return s(t,[{key:"init",value:function(){this.pen.active=!0}},{key:"destroy",value:function(){this.canvas.destroy()}},{key:"clear",value:function(){this.pen.clear()}},{key:"undo",value:function(){this.pen.undo()}},{key:"save",value:function(){}},{key:"isEmpty",value:function(){return this.pen.isEmpty()}},{key:"on",value:function(t,e){this._ee.on(t,e)}},{key:"emit",value:function(t,e){this._ee.emit(t,e)}},{key:"off",value:function(t,e){this._ee.off(t,e)}}]),t}();t.Signature=O,t.default=O,Object.defineProperty(t,"__esModule",{value:!0})}));
uni_modules/lime-signature/static/uni.webview.1.5.3.js 0 → 100644
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):(e=e||self).uni=n()}(this,(function(){"use strict";try{var e={};Object.defineProperty(e,"passive",{get:function(){!0}}),window.addEventListener("test-passive",null,e)}catch(e){}var n=Object.prototype.hasOwnProperty;function i(e,i){return n.call(e,i)}var t=[];function o(){return window.__dcloud_weex_postMessage||window.__dcloud_weex_}var r=function(e,n){var i={options:{timestamp:+new Date},name:e,arg:n};if(o()){if("postMessage"===e){var r={data:[n]};return window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessage(r):window.__dcloud_weex_.postMessage(JSON.stringify(r))}var a={type:"WEB_INVOKE_APPSERVICE",args:{data:i,webviewIds:t}};window.__dcloud_weex_postMessage?window.__dcloud_weex_postMessageToService(a):window.__dcloud_weex_.postMessageToService(JSON.stringify(a))}if(!window.plus)return window.parent.postMessage({type:"WEB_INVOKE_APPSERVICE",data:i,pageId:""},"*");if(0===t.length){var d=plus.webview.currentWebview();if(!d)throw new Error("plus.webview.currentWebview() is undefined");var s=d.parent(),w="";w=s?s.id:d.id,t.push(w)}if(plus.webview.getWebviewById("__uniapp__service"))plus.webview.postMessageToUniNView({type:"WEB_INVOKE_APPSERVICE",args:{data:i,webviewIds:t}},"__uniapp__service");else{var u=JSON.stringify(i);plus.webview.getLaunchWebview().evalJS('UniPlusBridge.subscribeHandler("'.concat("WEB_INVOKE_APPSERVICE",'",').concat(u,",").concat(JSON.stringify(t),");"))}},a={navigateTo:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;r("navigateTo",{url:encodeURI(n)})},navigateBack:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.delta;r("navigateBack",{delta:parseInt(n)||1})},switchTab:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;r("switchTab",{url:encodeURI(n)})},reLaunch:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;r("reLaunch",{url:encodeURI(n)})},redirectTo:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},n=e.url;r("redirectTo",{url:encodeURI(n)})},getEnv:function(e){o()?e({nvue:!0}):window.plus?e({plus:!0}):e({h5:!0})},postMessage:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r("postMessage",e.data||{})}},d=/uni-app/i.test(navigator.userAgent),s=/Html5Plus/i.test(navigator.userAgent),w=/complete|loaded|interactive/;var u=window.my&&navigator.userAgent.indexOf("AlipayClient")>-1;var g=window.swan&&window.swan.webView&&/swan/i.test(navigator.userAgent);var c=window.qq&&window.qq.miniProgram&&/QQ/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);var v=window.tt&&window.tt.miniProgram&&/toutiaomicroapp/i.test(navigator.userAgent);var m=window.wx&&window.wx.miniProgram&&/micromessenger/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);var p=window.qa&&/quickapp/i.test(navigator.userAgent);var f=window.ks&&window.ks.miniProgram&&/micromessenger/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);var l=window.tt&&window.tt.miniProgram&&/Lark|Feishu/i.test(navigator.userAgent);var _=window.jd&&window.jd.miniProgram&&/micromessenger/i.test(navigator.userAgent)&&/miniProgram/i.test(navigator.userAgent);for(var E,b=function(){window.UniAppJSBridge=!0,document.dispatchEvent(new CustomEvent("UniAppJSBridgeReady",{bubbles:!0,cancelable:!0}))},h=[function(e){if(d||s)return window.__dcloud_weex_postMessage||window.__dcloud_weex_?document.addEventListener("DOMContentLoaded",e):window.plus&&w.test(document.readyState)?setTimeout(e,0):document.addEventListener("plusready",e),a},function(e){if(m)return window.WeixinJSBridge&&window.WeixinJSBridge.invoke?setTimeout(e,0):document.addEventListener("WeixinJSBridgeReady",e),window.wx.miniProgram},function(e){if(c)return window.QQJSBridge&&window.QQJSBridge.invoke?setTimeout(e,0):document.addEventListener("QQJSBridgeReady",e),window.qq.miniProgram},function(e){if(u){document.addEventListener("DOMContentLoaded",e);var n=window.my;return{navigateTo:n.navigateTo,navigateBack:n.navigateBack,switchTab:n.switchTab,reLaunch:n.reLaunch,redirectTo:n.redirectTo,postMessage:n.postMessage,getEnv:n.getEnv}}},function(e){if(g)return document.addEventListener("DOMContentLoaded",e),window.swan.webView},function(e){if(v)return document.addEventListener("DOMContentLoaded",e),window.tt.miniProgram},function(e){if(p){window.QaJSBridge&&window.QaJSBridge.invoke?setTimeout(e,0):document.addEventListener("QaJSBridgeReady",e);var n=window.qa;return{navigateTo:n.navigateTo,navigateBack:n.navigateBack,switchTab:n.switchTab,reLaunch:n.reLaunch,redirectTo:n.redirectTo,postMessage:n.postMessage,getEnv:n.getEnv}}},function(e){if(f)return window.WeixinJSBridge&&window.WeixinJSBridge.invoke?setTimeout(e,0):document.addEventListener("WeixinJSBridgeReady",e),window.ks.miniProgram},function(e){if(l)return document.addEventListener("DOMContentLoaded",e),window.tt.miniProgram},function(e){if(_)return window.JDJSBridgeReady&&window.JDJSBridgeReady.invoke?setTimeout(e,0):document.addEventListener("JDJSBridgeReady",e),window.jd.miniProgram},function(e){return document.addEventListener("DOMContentLoaded",e),a}],y=0;y<h.length&&!(E=h[y](b));y++);E||(E={});var B="undefined"!=typeof uni?uni:{};if(!B.navigateTo)for(var S in E)i(E,S)&&(B[S]=E[S]);return B.webView=E,B}));
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment