# gd-signature-jining 使用文档
- 
<a name="VruZX"></a>
### 一、插件依赖
> 动态加载，如果用户环境有这两个插件，则不加载

- jquey



<a name="gGQ7l"></a>
### 二、使用方法
<a name="dhEiW"></a>
#### 2.1、标签引入
```html
<script src="https://cdn.jsdelivr.net/npm/gd-signature-jining/dist/main.bundle.js"></script> 
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gd-signature-jining/dist/static/css/index.css">
```
<a name="suGW9"></a>
#### 2.2、npm
```shell
# 使用最新版本
npm i gd-signature-jining -S

# 特定版本
npm i gd-signature-jining@x.x.x -S
```
页面引用
```javascript
import GDsignature from 'gd-signature-jining' 
// const GDsignature = require('gd-signature-jining')
import ' gd-signature-jining/dist/static/css/less.css'
```


<a name="Pq3LF"></a>
### 三、功能介绍
<a name="p2qIl"></a>
#### 3.1、更改插件主题色
覆盖less变量即可

- @--color-primary 主题色覆盖
- @--color-primary-border border颜色覆盖

标签方式修改主题色
```html
<script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.5.3/less.min.js"></script>
<script>
  less.modifyVars({
    '@--color-primary': '#DE2921', // 主题修改为红色
    '@--color-primary-border': '#DE2921' // border颜色修改
  })
</script>
```


<a name="IOxXq"></a>
#### 预览签章历史 `new SignLog({})`

- html
```html
<div>
  <label for="用户id">用户id：</label>
  <input id="userId" placeholder="请输入用户id" type="text" />
</div>
<div>
  <label for="合同id">合同id：</label>
  <input id="abc" placeholder="请输入合同id" type="text" />
</div>
<button onclick="handleclick()">签章</button>
```
```javascript
function handleclick() {
  const contract_id = $('#abc').val()
  const userId = $('#userId').val()
  signature.start({
    contract_id: contract_id,//合同id
    user_id: userId,//用户id
  })
}
const businessUrl = 'http://119.163.197.219:9000/paas_app_server'   // 业务系统url
const signature = new SignLog({
  baseUrl: 'http://119.163.197.219:8000/api', // paas地址
  getToken() {
             return new Promise((reslove, reject) => {
                 axios
                     .post(`${businessUrl}/getToken`, {}, {})
                     .then(res => {
                         console.log(res)
                         reslove(res.data.data.access_token)
                     })
                     .catch(err => {
                         reject()
                     })
             })
         },
         getSign(body) {
             return new Promise((reslove, reject) => {
                 axios({
                     method: 'POST',
                     url: `${businessUrl}/getSign`,
                     data: body.data,
                     headers: {
                         token: body.token,
                     }
                 }).then(res => {
                     reslove(res.data.data.sign)
                 })
             })
         }
})
```

### 四、参数说明
#### 4.1、baseUrl
`paas api`接口地址<br />

#### 4.2、businessUrl
`业务系统地址`提供token和sign的校验:sdk参考大众签章：https://github.com/aiosign/sign-sdk-java<br />

#### 4.3、getToken
`业务系统地址`提供token回调方法<br />
#### 4.4、getSign
`业务系统地址`提供sign回调方法<br />