<template>
	<view class="container">
		<view class="title">
		    <view>
		      <text class="line" style="background: #5F83FF;"></text>电子签名<text style="font-size: 20rpx;font-weight: normal;">（请书写工整，字迹清晰）</text>
		    </view>
		    <text class="page_mark">8/8</text>
		</view>
		<view class="signatureContent">
			<VueSignaturePad
					id="signature"
					width="100vw"
					height="100vh"
					ref="signaturePad"
					:options="options"
				  />
		</view>
		<div class="signature_action">
		    <image src="../../static/clear.png" alt="清除"></image>
		    <image src="../../static/revoke.png" alt="上一步"></image>
		</div>
		<view class="fixed" url="bank-card">
		   保存并下一步
		</view>
	</view>
</template>

<script>
	import { VueSignaturePad } from "vue-signature-pad";
	export default {
	    data() {
	        return {
				options: {
				      penColor: "#c0f",
				    },
	        }
	    },
		components:{VueSignaturePad},
		onLoad() {
			
		},
	    methods: {
	        
	    }
	}
</script>

<style lang="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>