qianMing.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. <template>
  2. <!-- 合同模板 -->
  3. <view class="sfht-mt24">
  4. <view class="form-label-select form-radius-box">
  5. <view class="phone-form-label"><text class="form-label-require"></text>签名</view>
  6. <view class="form-radio-select" @click="handleQianming">
  7. <view v-show="!!info">已签名</view>
  8. <icon></icon>
  9. </view>
  10. </view>
  11. </view>
  12. <uni-popup ref="popupRef" type="bottom" background-color="#fff" :is-mask-click="false" :mask-click="false">
  13. <view class="ht-qm-popup">
  14. <view class="icon-title-navBar-box">
  15. <view @click="goback2" class="nav-bar-icon"></view>
  16. <text class="nav-bar-title">签名</text>
  17. </view>
  18. <writeSign @getBase64="getBase64"></writeSign>
  19. </view>
  20. </uni-popup>
  21. </template>
  22. <script setup>
  23. import {
  24. ref,
  25. reactive,
  26. nextTick
  27. } from "vue";
  28. import selectJz from "./selectJz.vue"
  29. import writeSign from "@/components/writeSign/index.vue"
  30. import {
  31. throttleAdvanced
  32. } from "@/utils/common.js"
  33. import {
  34. base64ToPath
  35. } from "image-tools";
  36. import {
  37. useHetong
  38. } from "../useHetong.js"
  39. const {
  40. injectHetong
  41. } = useHetong();
  42. const data = injectHetong()
  43. const popupRef = ref(null)
  44. const handleQM = throttleAdvanced((img) => {
  45. data.hetong.qianming = img.replace(/^data:image\/\w+;base64,/, '')
  46. })
  47. function handleQianming() {
  48. popupRef.value.open()
  49. }
  50. function goback2() {
  51. popupRef.value.close()
  52. }
  53. function getBase64(da) {
  54. if (!img) {
  55. uni.showToast({
  56. title: '签名异常'
  57. })
  58. return;
  59. }
  60. handleQM(img)
  61. }
  62. </script>
  63. <style>
  64. </style>