You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

67 lines
1.7 KiB

<template>
<view>
<view style="position: absolute;">
<view style="width: 750rpx ;height:100vh;background-color: #FFFFFF;">
<l-signature landscape disableScroll ref="signatureRef" :penColor="penColor" :penSize="penSize" :openSmooth="openSmooth"></l-signature>
</view>
<view class="btn">
<u-button size="small" style="margin-right: 30rpx;" @click="onClick('clear')" type="success" text="清空"></u-button>
<u-button size="small" style="margin-right: 120rpx;" @click="onClick('undo')" type="success" text="上一步"></u-button>
<u-button size="small" @click="onClick('save')" type="primary" text="确认保存"></u-button>
<!-- uvue 不支持 openSmooth -->
<!-- <button @click="onClick('openSmooth')">{{ openSmooth ? '' : '' }}</button> -->
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
penColor: 'black',
penSize: 10,
// 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);
// 生成图片的临时路径
// H5 生成的是base64
// this.url = res.tempFilePath;
uni.$emit('updateData', res.tempFilePath);
uni.navigateBack({
delta: 1
});
}
});
return;
}
if (this.$refs.signatureRef) this.$refs.signatureRef[type]();
}
}
};
</script>
<style scoped>
.btn {
width: 600rpx;
height: 120rpx;
display: flex;
position: relative;
top: -560rpx;
left: -280rpx;
z-index: 11;
transform: rotateZ(90deg);
}
</style>