yidea-signature

a vue signature for h5

Vue component wrap for mobile signature

Installation

## install dependencies
npm install vue-signature-pad@2.0.4

npm install yidea-signature

Usage

import VueSignaturePad from "vue-signature-pad";
Vue.use(VueSignaturePad);

const messages = {
  en: {},
  zh: {}
};

// Create VueI18n instance with options
const i18n = new VueI18n({
  locale: "zh",
  messages
});

import YideaSignature from "yidea-signature";
import "yidea-signature/dist/yidea-signature.css";
Vue.use(YideaSignature, { lang: i18n.locale, i18n: i18n });

<template>
  <div id="app">
    <yidea-signature
      :fromType="fromType"
      @onConfirm="confirm"
      @onCancel="cancel"
    >
    </yidea-signature>
  </div>
</template>

<script>
export default {
  name: "app",
  components: {},
  data() {
    return {
      fromType: 1 //1 contains confirm button, 2 contains confirm and cancel button, 3 contains confirm and repulse button
    };
  },
  methods: {
    confirm(signData) {
      /*
      signData = { isEmpty, imgData, isSave }
      isEmpty: when signature data is empty, this property is true,
      imgData: the signature data,
      isSave: when check the 'Save signature for next call'
      */
      console.log(signData);
    },
    cancel() {
      console.log("cancel");
    }
  }
};
</script>