53 lines
1.0 KiB
Vue
53 lines
1.0 KiB
Vue
<template>
|
||
<view class="signature" style="background-color: #F4F5F7;height: 800rpx;">
|
||
<Signature @init="onSignInit" style='background-color: #fff;height: 700rpx;width: 100%;'></Signature>
|
||
<view class="btns">
|
||
<button @click="clear">清空</button>
|
||
<button @click="revoke">撤回</button>
|
||
<button @click="saveTempFilePath">保存</button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import Signature from '@/components/v-sign/v-sign.vue'
|
||
export default {
|
||
components: {
|
||
Signature
|
||
},
|
||
methods: {
|
||
onSignInit(signCtx) {
|
||
this.signCtx = signCtx
|
||
},
|
||
// 清空
|
||
clear() {
|
||
this.signCtx.clear()
|
||
},
|
||
// 撤回
|
||
revoke() {
|
||
this.signCtx.revoke()
|
||
},
|
||
// 保存为临时图片路径，h5返回 base64
|
||
async saveTempFilePath() {
|
||
const res = await this.signCtx.canvasToTempFilePath()
|
||
this.$emit('userSignaturePictureUrl', res)
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang='scss'>
|
||
.signature {
|
||
height: 800rpx;
|
||
position: relative;
|
||
}
|
||
|
||
.btns {
|
||
margin-top: 50rpx;
|
||
display: flex;
|
||
}
|
||
|
||
button {
|
||
width: 30%;
|
||
}
|
||
</style>
|