<template>
<div class="dashboard-container">
<form id="form1">
<table border="1" width="300" id="tb01" bgcolor="#CCFFCC" style="border:solid 1px black;border-collapse:collapse"><tr><td width="133" id="mtb001">
<font face="黑体" color="#FF0000" size="3"><u>&nbsp;《表单一》&nbsp;</u></font></td></tr></table>
<table border="1" width="300" height="106" cellspacing="0" bgcolor="#CCFFFF"style="border-collapse:collapse;table-layout:fixed;border:solid 1px black;"><tr>
<td width="66" height="16" style="border:solid 1px black"><font color="#0000FF">A</font><font color="#0000FF">等</font></td>
<td width="51" height="16" style="border:solid 1px black"><font color="#0000FF">B</font><font color="#0000FF">等</font></td>
<td width="51" height="16" style="border:solid 1px black"><font color="#0000FF">C</font><font color="#0000FF">等</font></td></tr>
<tr>
<td width="66" height="16" style="border:solid 1px black">A<sub>01</sub></td>
<td width="80" height="12" style="border:solid 1px black">中-001</td>
<td width="51" height="12" style="border:solid 1px black">C1<sup>x</sup></td>
</tr>
<tr>
<td width="66" height="16" style="border:solid 1px black">A<sub>02</sub>Φ</td>
<td width="80" height="16" style="border:solid 1px black">日-スの</td>
<td width="51" height="16" style="border:solid 1px black"><font face='Vernada'>7&#13221</font></td>
</tr>
<tr><td width="66" height="16" style="border:solid 1px black;overflow:hidden">A<sub>03</sub><nobr>over隐藏后面的:1234567890</nobr>
</td><td width="80" height="16" style="border:solid 1px black;overflow:hidden">韩-안녕</td><td width="51" height="16">C3<sup>x</sup>
</td></tr> </table>
</form> <hr>
<el-button @click="prn1_preview()">打印预览</el-button>
<el-button @click="design()">打印设计</el-button>
<textarea name="" id="" cols="30" rows="10" v-model="code"></textarea>
<el-button @click="createFun()">生成方法</el-button>
</div> </template> <script>
var LODOP;
export default {
created(){
},
mounted(){
}, data(){
return {
lalala:{name:"哈哈"},
code:localStorage.getItem("code")?localStorage.getItem("code"):"",
}
},
methods:{
prn1_preview(){
this.CreateOneFormPage();
LODOP.PREVIEW();
},
CreateOneFormPage(){
LODOP=getLodop();
LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表单一");
LODOP.SET_PRINT_STYLE("FontSize",18);
LODOP.SET_PRINT_STYLE("Bold",1);
LODOP.ADD_PRINT_TEXT(50,231,260,39,"打印页面部分内容");
LODOP.ADD_PRINT_HTM(88,200,350,600,document.getElementById("form1").innerHTML); },
design(){
LODOP=getLodop();
LODOP.PRINT_DESIGN()
},
createFun(){
LODOP=getLodop();
console.log(this.code)
localStorage.setItem("code",this.code);
var str=this.code.replace("name","冯庆海");
var str2=str.replace("city","北京市");
console.log(str2)
eval(str2);
LODOP.PREVIEW();
},
}
}
</script> <style lang="scss" scoped></style>

整体思路是,点击打印设计,将设计好的代码,粘贴到文本域中,然后点击生成方法,将代码存储,然后替换里面的name,city字符串,然后用eval()执行,然后预览!!!

当然也可以调用直接打印。后续继续更新。

lodop打印设计的更多相关文章

  1. Lodop打印设计(PRINT_DESIGN)介绍

    打印设计(PRINT_DESIGN)界面上方有两栏菜单栏,举例说明(文本框,条码,图形等).(1)第一排最左侧第一个功能,位置移动:控制里面元素微上下左右移动,每次移动一个px.(用于微调,普通调整可 ...

  2. Lodop打印设计里的 打印项对齐

    打印设计界面里,有四个对齐的图标:(1)第一个图标是左右对齐方式,该图标下有四种左右对齐方式.(2)第二个图标是上下对齐方式,该图标下有四种上下对齐方式.(3)第三个图标是等宽对齐,该图标下有三种等宽 ...

  3. Lodop打印设计(PRINT_DESIGN)里的快捷键

    Lodop打印控件,给开发人员提供了可视化编辑工具,编辑后可生成代码,然后复制到自己程序代码中,让开发更简单,打印设计中有一些快捷键也能让开发更便捷. 打印设计快捷键:ctrl 多个选中Shift 左 ...

  4. [简短问答]LODOP如何查看用LODOP打印设计的代码

    该博文为图文简短问答,具体详细介绍可查看本博客的相关博文,生成JS代码相关详细博文:Lodop打印设计(PRINT_DESIGN)介绍.Lodop打印设计.维护.预览.直接打印简单介绍.Lodop打印 ...

  5. Lodop打印设计、维护、预览、直接打印简单介绍

    四者的区别和联系:(其中PRINT_DESIGN打印设计是提供给开发人员的,另外三个可开放给用户)PRINT_DESIGN打印设计:辅助开发人员设计,图形化拖动插入修改等,设计完成后,生成代码拷贝到程 ...

  6. Lodop打印设计矩形重合预览线条变粗

    LODOP中的打印设计是辅助进行开发的,实际打印效果应以预览为准,很多效果都是在设计界面显示不出来,或设计和预览界面有差异.例如add_print_text文本的字间距.行间距,旋转,还有允许标点溢出 ...

  7. Lodop打印设计界面生成代码带”...(省略)”

    Lodop的设计界面中,菜单里的生成代码,如果打印项内容过多,后面会显示”...(省略)”,省略的是打印项的内容值,无论是纯文本还是超文本,都可以用选中打印项-右键-设置属性里找到该打印项的全部值,可 ...

  8. LODOP打印维护适应不同的客户端

    之前的博文:Lodop打印设计.维护.预览.直接打印简单介绍,介绍了打印设计.打印维护.打印预览,直接打印等的区别和使用. 如上面以前博文描述的,打印维护是针对客户端进行调整的,开放打印维护给客户端, ...

  9. LODOP设置打印设计返回JS代码是变量

    前面有一篇博文是介绍JS模版的加载和赋值,赋值有两种,详细可查看本博客的那篇博文:LodopJS代码模版的加载和赋值简单来说,就是打印项的值是变量,在添加打印项前进行赋值:打印项的值是字符串,给打印项 ...

随机推荐

  1. 2017 ACM-ICPC 亚洲区(西安赛区)网络赛 Coin 矩阵快速幂

    Bob has a not even coin, every time he tosses the coin, the probability that the coin's front face u ...

  2. (一)SpringMvc简介以及第一个springmvc工程

    一.SpringMVC是什么? springmvc是Spring的一个模块,提供web层解决方案(就与MVC设计架构) 如上图, DispatcherServlet:前端控制器,由SpringMVC提 ...

  3. 使用隔离级别read committed隐式解决并发冲突

    1.使用rc的弊端:出现不可重复读 Oracle不可重复读 Oracle丢失修改 Oracle幻读 任何数据库的update  insert  delete都加排它锁 sql server的selec ...

  4. Vue绑定的table页面在Chrome浏览器左右抖动

    现象: 今天Chrome浏览器升级到最新版本(75.0.3770.100),突然发现之前vue页面只要绑定了el-table标签的,都在左右抖动,抖动得眼睛都花了,百度上找半天也没有遇到相同问题的人, ...

  5. Swagger 实践 <二>

    1. 新建.netCore WebApi 项目(选择Angular).按照上一篇的加上Swage 文档,使http://localhost:11934/swagger/v1/swagger.json  ...

  6. gin框架初识(先跑一个简单demo) ①

    Gin 是一个 go 写的 web 框架,具有高性能的优点.官方地址:https://github.com/gin-gonic/gin 先跑一个demo(先安装gin框架,具体见官方地址): 1.vs ...

  7. el-table——可编辑拖拽转换csv格式的表格

    <!--可拖拽的表格:表格内容+行参数+按钮名称(对话框标题)--> <template> <div> <el-button size="mini& ...

  8. 【SQL server】SQL server基础(一)

    一.关系型数据库 关系型数据库的基本元素是二维表,这些二维表可以被独立或者通过join语句连接起来使用.主键和外键是用来连接二维表之间的主要工具 1.主键(primary key)和外键(foreig ...

  9. js 执行完setTimeout再接着执行函数

    var counter = 0; function increase(){ var d = jQuery.Deferred(); var doIncrease = function() { if(co ...

  10. MyBaties --day1

    今天就来聊聊这个东西 今天的主角相信大家也看到了 MyBaties  是个什么东东 它有什么作用?怎么用?好不好用今天来说说 .说到MyBaties 就不得不谈到JDBC大家可能都知道 JDBC用来操 ...