vue 打印数据库全部内容

1.安装 print-js
npm install print-js --save
2.页面引入
// 在当前vue文件内引用
import printJS from ‘print-js’

<el-button  @click="handlePrint">打印</el-button>

methods:
handlePrint(){  
      getPrintList(this.searchMap).then(response => {
        const res = response.data
        let data = [];
	     for(let i = 0; i<res.length; i++){
	         data.push({
	             field1:i+1,
	             field2:res[i].salaryName,
	             field3:res[i].salaryNumber,
	             field4:res[i].salarySex,
	             field5:res[i].salaryAge,
	             field6:res[i].salaryPay,
	             field7:res[i].salaryStatus,
	             field8:res[i].salaryAddress
           })
           data[i].field4==0?data[i].field4="男":data[i].field4="女"
           data[i].field7==0?data[i].field7="在职":data[i].field7="离职"          
       }      
	     printJS({
	         printable:data,
	         properties:[{
	             field:'field1',
	             displayName:'序号',
	             columnSize:1
	         },{
	             field:'field2',
	             displayName:'姓名',
	             columnSize:1
	         },{
	             field:'field3',
	             displayName:'工号',
	             columnSize:1
	         },{
	             field:'field4',
	             displayName:'性别',
	             columnSize:1
	         },{
	             field:'field5',
	             displayName:'年龄',
	             columnSize:1
	         },{
	             field:'field6',
	             displayName:'工资',
	             columnSize:1
	         },{
	             field:'field7',
	             displayName:'状态',
	             columnSize:1
	         },{
	             field:'field8',
	             displayName:'地址',
	             columnSize:1
	         }],
	         type:'json',
	         header:'[工资管理] '+this.getPrintTime(),
           //样式设置
           headerStyle:'font-size:15px;',
	         gridStyle:'border:1px solid #3971A5;',
	         gridHeaderStyle:'font-weight:bold;font-size:20px; border:1px solid #3971A5;'
	     })	
	 }).catch(function (error) { // 请求失败处理
	     console.log(error);
	 });  
    },
getPrintTime(){
      var date=new Date();
      var year=date.getFullYear();//得到当前年份
      var month=this.editTime(date.getMonth()+1);//得到当前月份
      var day=this.editTime(date.getDate());//得到当前几号
      var hour=this.editTime(date.getHours());//得到当前小时
      var min=this.editTime(date.getMinutes());//得到当前分钟
      var seconds=this.editTime(date.getSeconds());//得到当前秒
      var weeks=date.getDay();
      var week;
      switch(weeks){
        case 0:
          week="星期日";
        break;
        case 1:
          week="星期一";
        break;
        case 2:
          week="星期二";
        break;
        case 3:
          week="星期三";
        break;
        case 4:
          week="星期四";
        break;
        case 5:
          week="星期五";
        break;
        case 6:
          week="星期六";
        break;
      }
      var show = "打印时间:"+year+"-"+month+"-"+day+" "+hour+":"+min+":"+seconds+" "+week;
      return show;
    },
    editTime(i){
      if(i<10){
        i="0"+i;
      }
      return i;
    }
  },

猜你喜欢

转载自blog.csdn.net/monody666/article/details/114114760