vue-watermask v1.2.1

vue-watermask

指令指令，指定区域添加水印

示例

特色

• 添加到指定区域
• 阻止通过浏览器控制台去掉水印
• 自适应指定区域大小

注意

指定区域的position必须是非static的值

用法：

//入口文件 index.js
import watermask from 'vue-watermask';
import Vue from 'vue';
Vue.use(watermask);

//vue组件中
<template>
    <div v-watermask="options">
         ............
         ...........
    </div>
</template>

<script>
  let options={
        text:{
              userName:"于某某",
              logo:"作业帮",
              userNumber:"Z666666"
          },
        opacity:0.1
     };

  export default{
    data(){
     return {
        options
      }
    }
  }
<script>

参数说明

• text 参数属性的内容，是根据要求固定的，userName必填
• style参数的属性需要驼峰的方式，无特殊情况，不建议配置 style 属性 -opacity 水印图的透明度

{
  text:{
      userName:"于某某",         //string  姓名，必填
      userNumber:"Z666666"      //string  工号，默认空，必填
      currentDate:"20190212"     //string   日期,默认为当前日期，选填
   }
 opacity:0.15                //水印的透明度 默认0.15,选填
}

后端接入

2.1 系统已接入通用的权限

前端调用通用的权限系统接口 /misauth/api/getuserinfo ，返回值中已增加水印需要的数据。@张兵 会在/misauth/api/getuserinfo 现有的接口中增加以下字段

{
      'userNumber':'Z005759'// 员工编号
      'currentDate':"20180225"  //当前系统时间
}

2.2 系统独立的权限公职系统

调用 ehr 提供的接口获取水印需要的数据返回给前端，业务系统独立维护账号系统的情况下比较少，后端详细方案可以咨询 @唐盼

发布

  npm run build
  npm version patch
  npm publish