integrated_traffic_uniapp/components/landscape_sign/index.vue

53 lines
1.3 KiB
Vue

<template>
<view class="cu-dialog">
<view class="cu-bar bg-white justify-end">
<view class="content">签名</view>
<view class="action" @tap="fnClose">
<text class="cuIcon-close text-red"></text>
</view>
</view>
<view class="sign-content">
<sp-sign-board ref="signRef" horizontal bg-color="#fff"/>
</view>
<view class="cu-bar bg-white justify-center">
<view class="action">
<button class="cu-btn line-green text-green" @click="fnReset"></button>
<button class="cu-btn bg-green margin-left" @click="fnGenerate"></button>
<span class="text-red text-lg margin-left">*请横屏签名</span>
</view>
</view>
</view>
</template>
<script>
export default {
mounted() {
uni.$on("getSignImg", ({ base64, path }) => {
this.$emit("confirm", { base64, path });
uni.$off("getSignImg");
this.fnClose();
});
},
methods: {
fnReset() {
this.$refs.signRef.reset && this.$refs.signRef.reset();
},
fnGenerate() {
this.$refs.signRef.confirm();
},
fnClose() {
this.fnReset();
this.$emit("cancel", '');
},
},
}
</script>
<style scoped lang="scss">
.sign-content {
height: 80vh;
border: 4upx dashed #e9e9e9;
overflow: hidden;
box-sizing: border-box;
}
</style>