gdmis_mu.git - Zbooksoft Source Control

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
 
<!DOCTYPE HTML>
<html>
<head>
    <base href="<%=basePath%>">
    <meta name="viewport" charset="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
    <title>选择模板</title>
    <script type="text/javascript" src="static/plugins/ueditor-formdesign/js/ueditor/dialogs/internal.js"></script>
 
    <link rel="stylesheet" href="static/plugins/jquery-steps/css/main.css" type="text/css">
    <link rel="stylesheet" href="static/plugins/jquery-steps/css/jquery.steps.css" type="text/css">
    <link href="static/plugins/font-awesome/css/font-awesome.css" rel="stylesheet" type="text/css">
    <link href="static/plugins/jquery-easyui/themes/bootstrap/easyui.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="static/styles/initialize.css" type="text/css">
    <link rel="stylesheet" href="static/styles/common.css" type="text/css">
    <link rel="stylesheet" href="static/plugins/layer/skin/default/layer.css" type="text/css">
 
    <script type="text/javascript" src="static/plugins/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="static/plugins/jquery-easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="static/plugins/jquery-easyui/locale/easyui-lang-zh_CN.js"></script>
    <script type="text/javascript" src="static/scripts/easyuiExtend.js"></script>
    <script type="text/javascript" src="static/scripts/jquery-extend.js"></script>
    <script type="text/javascript" src="static/plugins/layer/layer.js"></script>
    <script type="text/javascript" src="static/plugins/slimScroll/jquery.slimscroll.min.js"></script>
    <script type="text/javascript" src="static/scripts/ResizeScroll.js"></script>
    <script type="text/javascript" src="static/plugins/jquery-easyui-edatagrid/jquery.edatagrid.js"></script>
    <script type="text/javascript" src="static/plugins/jquery-easyui-datagrid-dnd/datagrid-dnd.js"></script>
    <script src="static/plugins/ace/src-noconflict/ace.js" type="text/javascript"></script>
    <!-- 弹窗加载组件 -->
    <script type="text/javascript" src="static/plugins/layer/layer.js"></script>
    <script type="text/javascript" src="static/plugins/spinjs/spin.js"></script>
    <script type="text/javascript" src="static/plugins/spinjs/jquery.spin.js"></script>
    <script type="text/javascript" src="static/plugins/jquery.blockUI.js"></script>
    <!-- wcp组件 -->
    <script type="text/javascript" src="static/wcp/scripts/wcp.js"></script>
    <script type="text/javascript" src="static/wcp/scripts/libs/wcp.layer.js"></script>
    <script type="text/javascript" src="static/wcp/scripts/libs/wcp.blockUI.js"></script>
    <script type="text/javascript" src="static/wcp/scripts/libs/wcp.spin.js"></script>
    <script type="text/javascript" src="static/wcp/scripts/libs/wcp.jquery.js"></script>
 
    <!--[if lt IE 9]>
    <script type="text/javascript" src="static/plugins/json2.js"></script>
    <![endif]-->
    <script type="text/javascript" src="static/wcp/scripts/libs/wcp.infoPicker.js"></script>
    <style type="text/css">
        .wrap {
            padding: 5px;
            font-size: 14px;
        }
 
        .left {
            width: 425px;
            float: left;
        }
 
        .right {
            width: 160px;
            border: 1px solid #ccc;
            float: right;
            padding: 5px;
            margin-right: 5px;
        }
 
        .right .pre {
            height: 356px;
            overflow-y: auto;
        }
 
        .right .preitem {
            border: #fff 1px solid;
            margin: 5px 0;
            padding: 2px 0;
        }
 
        .right .preitem:hover {
            background-color: lemonChiffon;
            cursor: pointer;
            border: #ccc 1px solid;
        }
 
        .right .preitem img {
            display: block;
            margin: 0 auto;
            width: 100px;
        }
 
        .clear {
            clear: both;
        }
 
        .top {
            height: 26px;
            line-height: 26px;
            padding: 5px;
        }
 
        .bottom {
            height: 320px;
            width: 100%;
            margin: 0 auto;
        }
 
        .transparent {
            background: url("static/plugins/ueditor-formdesign/js/ueditor/formdesign/images/template/bg.gif") repeat;
        }
 
        .bottom table tr td {
            border: 1px solid #ccc;
            padding: 0 2px;
        }
 
        #colorPicker {
            width: 17px;
            height: 17px;
            border: 1px solid #CCC;
            display: inline-block;
            border-radius: 3px;
            box-shadow: 2px 2px 5px #D3D6DA;
        }
 
        .border_style1 {
            padding: 2px;
            border: 1px solid #ccc;
            border-radius: 5px;
            box-shadow: 2px 2px 5px #d3d6da;
        }
 
        p {
            margin: 5px 0
        }
 
        table {
            clear: both;
            margin-bottom: 10px;
            border-collapse: collapse;
            word-break: break-all;
        }
 
        li {
            clear: both
        }
 
        ol {
            padding-left: 40px;
        }
    </style>
</head>
<body>
<div class="wrap">
    <div class="left">
        <div class="top">
            <label><var id="lang_template_clear">保留原有内容</var>：<input id="issave" type="checkbox"></label>
        </div>
        <div class="bottom border_style1" id="preview"></div>
    </div>
    <fieldset class="right border_style1">
        <legend><var id="lang_template_select"></var></legend>
        <div class="pre" id="preitem"></div>
    </fieldset>
    <div class="clear"></div>
</div>
<script type="text/javascript">
    /**
     * Templates.
     * 添加模板，以下面配置即可
     */
    var templates = [
        {
            "pre": "pre0.png",//预览图
            'title': "表单设计模板",//标题
            //预览html
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">表单示例</span></p><hr/><div style="margin:0 20px 0 16px;"><p style="margin-top:20px;"><input name="" leipiplugins="listctrl" type="text" value="{列表控件}" readonly="readonly" title="采购商品列表" orgtitle="商品名称`数量`单价`小计`描述`" orgcoltype="text`int`int`int`text`" orgunit="```元``" orgsum="0`0`0`1`0`" orgcolvalue="`````" orgwidth="100%" style="width: 100%; height:30px; margin-bottom:8px;"/></p><p><textarea title="多行文本" name="" leipiplugins="textarea" value="" orgrich="0" orgfontsize="12" orgwidth="100%" orgheight="120" style="font-size:12px;width:100%;height:120px; margin-bottom:8px;"></textarea></p></div>',
            //确认后到编辑器的html
            "html": '<p style="margin-top:20px;"><input name="" leipiplugins="listctrl" type="text" value="{列表控件}" readonly="readonly" title="采购商品列表" orgtitle="商品名称`数量`单价`小计`描述`" orgcoltype="text`int`int`int`text`" orgunit="```元``" orgsum="0`0`0`1`0`" orgcolvalue="`````" orgwidth="99%" style="width: 99%; height:30px; margin:0 0 8px 4px;"/></p><p><textarea title="多行文本" name="" leipiplugins="textarea" value="" orgrich="0" orgfontsize="12" orgwidth="99%" orgheight="120" style="font-size:12px;width:99%;height:120px; margin:0 0 8px 4px;"></textarea></p>'
        },
        {
            "pre": "pre1.png",//预览图
            'title': "文件设计模板",//标题
            //预览html
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">文件示例</span></p><hr/><p style="text-indent: 2em; min-height:140px;">表单设计器模板，文章内容</p><p style="text-align:right; margin-top:20px;">部门：软件事业部</p><p style="text-align:right;">时间：2019年06月23日</p>',
            //确认后到编辑器的html
            "html": '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">文件示例</span></p><hr/><p style="text-indent: 2em; min-height:260px;">表单设计器模板，文章内容</p><p style="text-align:right; margin-top:20px;">部门：软件事业部</p><p style="text-align:right;">时间：2019年06月23日</p>'
        },
        {
            "pre": "pre4.png",
            'title': "欢迎使用",
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">四列无宽度示例</span></p><table class="table table-bordered" style="width:100%;"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" > <input style="text-align: left; width: 150px;" title="文本框" value="" name="" orgheight="" orgwidth="150" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/> </td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >下拉菜单</td> <td valign="top" style="border-color: rgb(221, 221, 221);"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="150" style="width: 150px;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);"> 单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              {|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}           </td> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              复选           </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);">                {|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}            </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件            </td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="150" style="font-size: 12px; width: 150px;"/> </td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >               二维码</td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <img name="" title="" value="http://www.leipi.org" orgtype="url" leipiplugins="qrcode" src="/Public/js/ueditor/formdesign/images/qrcode.gif" orgwidth="40" orgheight="40" style="width: 40px; height: 40px;"/></td></tr></tbody></table>',
            "html": '<table class="table table-bordered" style="width:100%;font-size:14px;"><tbody><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221); width:15%;">文本框</td><td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221); width:35%;"><input style="text-align: left; width: 150px;" title="文本框" value="" name="" orgheight="" orgwidth="150" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/></td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221); width:15%;">下拉菜单</td><td valign="top" style="border-color: rgb(221, 221, 221);  width:35%;">{|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="150" style="width: 150px;"><option value="下拉">下拉</option><option value="菜单">菜单</option></select>&nbsp;&nbsp;</span>-|}</td></tr><tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                单选</td><td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="41">                {|-<span leipiplugins="radios" title="单选" name=""><input value="单选1" type="radio" checked="checked" name=""/>单选1&nbsp;<input value="单选2" type="radio" name=""/>单选2&nbsp;</span>-|}</td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="85">                复选</td><td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="312">                {|-<span leipiplugins="checkboxs" title="复选"><input name="" value="复选1" type="checkbox" checked="checked"/>复选1&nbsp;<input name="" value="复选2" type="checkbox" checked="checked"/>复选2&nbsp;<input name="" value="复选3" type="checkbox"/>复选3&nbsp;</span>-|}</td></tr><tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件</td><td valign="top" style="border-color: rgb(221, 221, 221);" width="41"><input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="150" style="font-size: 12px; width: 150px;"/></td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="85"> 二维码</td><td valign="top" style="border-color: rgb(221, 221, 221);" width="312"><img name="" title="" value="" orgtype="url" leipiplugins="qrcode" src="/Public/js/ueditor/formdesign/images/qrcode.gif" orgwidth="40" orgheight="40" style="width: 40px; height: 40px;"/></td></tr></tbody></table>'
 
        },
        {
            "pre": "pre4.png",
            'title': "欢迎使用",
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">四列固定宽度示例</span></p><table class="table table-bordered" style="width:100%;"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" > <input style="text-align: left; width: 150px;" title="文本框" value="" name="" orgheight="" orgwidth="150" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/> </td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >下拉菜单</td> <td valign="top" style="border-color: rgb(221, 221, 221);"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="150" style="width: 150px;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);"> 单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              {|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}           </td> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              复选           </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);">                {|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}            </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件            </td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="150" style="font-size: 12px; width: 150px;"/> </td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >               二维码</td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <img name="" title="" value="http://www.leipi.org" orgtype="url" leipiplugins="qrcode" src="/Public/js/ueditor/formdesign/images/qrcode.gif" orgwidth="40" orgheight="40" style="width: 40px; height: 40px;"/></td></tr></tbody></table>',
            "html": '<table class="table table-bordered" style="margin:0 auto;font-size:14px;"><tbody><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221); width:15%;">文本框</td><td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221); width:35%;"><input style="text-align: left; width: 150px;" title="文本框" value="" name="" orgheight="" orgwidth="150" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/></td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221); width:15%;">下拉菜单</td><td valign="top" style="border-color: rgb(221, 221, 221);  width:35%;">{|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="150" style="width: 150px;"><option value="下拉">下拉</option><option value="菜单">菜单</option></select>&nbsp;&nbsp;</span>-|}</td></tr><tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                单选</td><td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="41">                {|-<span leipiplugins="radios" title="单选" name=""><input value="单选1" type="radio" checked="checked" name=""/>单选1&nbsp;<input value="单选2" type="radio" name=""/>单选2&nbsp;</span>-|}</td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="85">                复选</td><td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="312">                {|-<span leipiplugins="checkboxs" title="复选"><input name="" value="复选1" type="checkbox" checked="checked"/>复选1&nbsp;<input name="" value="复选2" type="checkbox" checked="checked"/>复选2&nbsp;<input name="" value="复选3" type="checkbox"/>复选3&nbsp;</span>-|}</td></tr><tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件</td><td valign="top" style="border-color: rgb(221, 221, 221);" width="41"><input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="150" style="font-size: 12px; width: 150px;"/></td><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" width="85"> 二维码</td><td valign="top" style="border-color: rgb(221, 221, 221);" width="312"><img name="" title="" value="" orgtype="url" leipiplugins="qrcode" src="/Public/js/ueditor/formdesign/images/qrcode.gif" orgwidth="40" orgheight="40" style="width: 40px; height: 40px;"/></td></tr></tbody></table>'
 
        },
        {
            "pre": "pre3.png",
            'title': "欢迎使用",
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">两列无宽度示例</span></p><table class="table table-bordered"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >下拉菜单</td> <td valign="top" style="border-color: rgb(221, 221, 221);"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="350" style="width: 350px;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" > <input style="text-align: left; width: 350px;" title="文本框" value="" name="" orgheight="" orgwidth="350" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/> </td></tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);"> 单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              {|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}           </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              复选           </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);">                {|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}            </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件            </td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="350" style="font-size: 12px; width: 350px;"/> </td></tr></tbody></table>',
            "html": '<table class="table table-bordered" style="width:100%;font-size:14px;"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >下拉菜单</td> <td valign="top" style="border-color: rgb(221, 221, 221);"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="500" style="width: 500px;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" > <input style="text-align: left; width: 500px;" title="文本框" value="" name="" orgheight="" orgwidth="500" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/> </td></tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);"> 单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              {|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}           </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              复选           </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);">                {|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}            </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件            </td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="500" style="font-size: 12px; width: 500px;"/> </td></tr></tbody></table>'
 
        },
        {
            "pre": "pre3.png",
            'title': "欢迎使用",
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px;">两列固定宽度示例</span></p><table class="table table-bordered"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >下拉菜单</td> <td valign="top" style="border-color: rgb(221, 221, 221);"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="350" style="width: 350px;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" > <input style="text-align: left; width: 350px;" title="文本框" value="" name="" orgheight="" orgwidth="350" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/> </td></tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);"> 单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              {|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}           </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              复选           </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);">                {|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}            </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件            </td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="350" style="font-size: 12px; width: 350px;"/> </td></tr></tbody></table>',
            "html": '<table class="table table-bordered" style="margin:0 auto;font-size:14px;"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >下拉菜单</td> <td valign="top" style="border-color: rgb(221, 221, 221);"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="500" style="width: 500px;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" > <input style="text-align: left; width: 500px;" title="文本框" value="" name="" orgheight="" orgwidth="500" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/> </td></tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);"> 单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              {|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}           </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);" >              复选           </td> <td valign="top" style="word-break: break-all; border-color: rgb(221, 221, 221);">                {|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}            </td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(221, 221, 221);">                宏控件            </td><td valign="top" style="border-color: rgb(221, 221, 221);" >                <input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="500" style="font-size: 12px; width: 500px;"/> </td></tr></tbody></table>'
 
        },
        {
            "pre": "pre2.png",
            'title': "欢迎使用",
            'preHtml': '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px; color:#f00;">收发文示例表</span></p><table class="table table-bordered" style="margin:0 auto;"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;" >下拉菜单</td> <td valign="top" style="border-color: rgb(255, 0, 0); color:#f00;"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="350" style="width: 350px; color:#f00;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;" ><input style="text-align: left; width: 350px;" title="文本框" name="" orgheight="" orgwidth="350" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/></td></tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">{|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}</td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;" >复选</td> <td valign="top" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">{|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}</td></tr><tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">宏控件</td><td valign="top" style="border-color:rgb(255, 0, 0); color:#f00;" ><input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="350" style="font-size: 12px; width: 350px; color:#f00;"/> </td></tr></tbody></table>',
            "html": '<p style="text-align: center;"><br/></p><p style="text-align: center; margin-bottom:20px;"><span style="font-size: 24px; color:#f00;">收发文示例表</span></p><table class="table table-bordered" style="margin:0 auto;font-size:14px;"> <tbody> <tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;" >下拉菜单</td> <td valign="top" style="border-color: rgb(255, 0, 0); color:#f00;"> {|-<span leipiplugins="select"><select name="" title="下拉菜单" leipiplugins="select" size="1" orgwidth="500" style="width: 500px; color:#f00;"><option value="下拉">下拉</option> <option value="菜单"> 菜单 </option></select>&nbsp;&nbsp;</span>-|}</td> </tr><tr class="firstRow"><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">文本框 </td> <td valign="top" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;" ><input style="text-align: left; width: 500px;" title="文本框" name="" orgheight="" orgwidth="500" orgalign="left" orgfontsize="" orghide="0" leipiplugins="text" orgtype="text"/></td></tr><tr> <td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">单选</td> <td valign="top" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">{|-<span leipiplugins="radios" class="radios" orgtimestamp="1407254440134" title="单选"><input name="" value="单选1" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选1&nbsp;<input name="" value="单选2" title="单选" orgtimestamp="1407254440134" leipiplugins="radio" type="radio"/>单选2&nbsp;</span>-|}</td> </tr> <tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;" >复选</td> <td valign="top" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">{|-<span class="checkboxs" leipiplugins="checkboxs" orgtimestamp="1407254454990" title="复选"><input name="" value="复选1" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选1&nbsp;<input name="" value="复选2" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选2&nbsp;<input name="" value="复选3" title="复选" orgtimestamp="1407254454990" leipiplugins="checkbox" type="checkbox"/>复选3&nbsp;</span>-|}</td></tr><tr><td valign="middle" align="center" style="word-break: break-all; border-color: rgb(255, 0, 0); color:#f00;">宏控件</td><td valign="top" style="border-color:rgb(255, 0, 0); color:#f00;" ><input name="" type="text" value="" title="宏控件" leipiplugins="" orgtype="sys_date_cn" orghide="0" orgfontsize="12" orgwidth="500" style="font-size: 12px; width: 500px; color:#f00;"/> </td></tr></tbody></table>'
 
        }
    ];
 
 
    /**
     *  Templates.
     */
    window.onload = function () {
 
        var me = editor,
            preview = $G("preview"),
            preitem = $G("preitem"),
            tmps = templates,
            currentTmp;
        var initPre = function () {
            var str = "";
            for (var i = 0, tmp; tmp = tmps[i++];) {
                str += '<div class="preitem" onclick="pre(' + i + ')"><img src="static/plugins/ueditor-formdesign/js/ueditor/formdesign/images/template/' + tmp.pre + '" ' + (tmp.title ? "alt=" + tmp.title + " title=" + tmp.title + "" : "") + '></div>';
            }
            preitem.innerHTML = str;
        };
        var pre = function (n) {
            var tmp = tmps[n - 1];
            currentTmp = tmp;
            clearItem();
            domUtils.setStyles(preitem.childNodes[n - 1], {
                "background-color": "lemonChiffon",
                "border": "#ccc 1px solid"
            });
            preview.innerHTML = tmp.preHtml ? tmp.preHtml : "";
        };
        var clearItem = function () {
            var items = preitem.children;
            for (var i = 0, item; item = items[i++];) {
                domUtils.setStyles(item, {
                    "background-color": "",
                    "border": "white 1px solid"
                });
            }
        };
        dialog.onok = function () {
            if (!$G("issave").checked) {
                me.execCommand("cleardoc");
            }
            var obj = {
                html: currentTmp && currentTmp.html
            };
            me.execCommand("template", obj);
        };
        initPre();
        window.pre = pre;
        pre(2)
    }
</script>
</body>
</html>