<template>
	<!-- 合同模板 -->
	<view class="sfht-mt24">
		<view class="form-label-select form-radius-box">
			<view class="phone-form-label"><text class="form-label-require"></text>签名</view>
			<view class="form-radio-select" @click="handleQianming">
				<view v-show="!!data.qianming">已签名</view>
				<icon></icon>
			</view>
		</view>
	</view>
	<uni-popup ref="popupRef" type="bottom" background-color="#fff" :is-mask-click="false" :mask-click="false">
		<view class="ht-qm-popup">
			<view class="icon-title-navBar-box">
				<view @click="goback2" class="nav-bar-icon"></view>
				<text class="nav-bar-title">签名</text>
			</view>
			<writeSign @getBase64="getBase64"></writeSign>
		</view>
	</uni-popup>

</template>

<script setup>
	import {
		ref,
		reactive,
		nextTick
	} from "vue";
	import selectJz from "./selectJz.vue"
	import writeSign from "@/components/writeSign/index.vue"
	import {
		throttleAdvanced
	} from "@/utils/common.js"
	import {
		base64ToPath
	} from "image-tools";
	import {
		useHetong
	} from "../useHetong.js"
	
	const {
		injectHetong
	} = useHetong();
	const data = injectHetong()



	const popupRef = ref(null)

	const handleQM = throttleAdvanced((img) => {
		data.hetong.qianming = img.replace(/^data:image\/\w+;base64,/, '')
	})

	function handleQianming() {
		popupRef.value.open()
	}

	function goback2() {
		popupRef.value.close()
	}

	function getBase64(da) {
		if (!img) {
			uni.showToast({
				title: '签名异常'
			})
			return;
		}
		handleQM(img)
	}
</script>

<style>
</style>