README.md

Pena 💚 Vue

Pena plugin for Vue

Compabilities

• Vue 3
• Vue >= 2.7
• Vue <= 2.6 (require @vue/composition-api plugin)

Installation

NPM

npm install --save @privyid/pena-vue @privyid/pena

Yarn

yarn add @privyid/pena-vue @privyid/pena

Nuxt

You need to transpile this package, add this in your nuxt.config.js.

export default {
  // ...
  build: {
    transpile: [
      '@privyid/pena',
      '@privyid/pena-vue',
    ]
  },
  // ...
}

Usage

<template>
  <pena
    url="http://sign.document.com/doc/xxx"
    lang="en"
    layout="fixed"
    :signature="{
      x    : 100,
      y    : 200,
      page : 1,
      fixed: false,
    }"
    @after-action="onAfterAction"
  />
</template>

<script>
import { Pena } from '@privyid/pena-vue'

export default {
  components: { Pena },
  methods: {
    onAfterAction (event) {
      // Do something after action (sign, review, etc) done
      if (event.action === 'sign') {
        window.alert('Signed')
      }
    }
  }
}
</script>

Options

Props

Name	Type	Default	Description
url	string	-	(Required) Document's url
lang	string	en	Set language, valid value is en or id
layout	string	fixed	Set layout mode, valid value is fixed or fit, see the different
visibility	boolean	true	Set signature visibility
privyId	string	-	Set recipient's privyId
signature	object	-	Set signature placement (Deprecated) use API to set placement when upload the document
├ x	number	-	X Coordinate
├ y	number	-	Y Coordinate
├ page	number	-	Target page
└ fixed	boolean	false	Disabled signature for moving
debug	boolean	false	Enable debug mode
ratio	number	210 / 297	Ratio size (Layout fixed only)
needScrollTo	number | string	-	Force user to scroll to target page before doing an action (sign,review,etc). Valid value is a number, or set last to target the last page

Events

Name	Arguments	Description
after-action	Payload	After action hook

License

This project is licensed under the MIT License - see the LICENSE file for details