You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
90 lines
3.9 KiB
JavaScript
90 lines
3.9 KiB
JavaScript
1 year ago
|
/**
|
||
|
定义layui模块 - 模板引擎 - 自定义模板
|
||
|
*/
|
||
|
layui.define(['index', 'laytpl', 'form'], function (exports) {
|
||
|
|
||
|
exports("tpl", {
|
||
|
setPlainTextTpl: function (eleId, data) {
|
||
|
var laytpl = layui.laytpl;
|
||
|
var form = layui.form;
|
||
|
var getTpl = '{{d.title}}';
|
||
|
var view = document.getElementById(eleId);
|
||
|
if (!view) { console.warn("请填写有效的ElementId"); return false; }
|
||
|
laytpl(getTpl).render(data, function (html) {
|
||
|
view.innerHTML = html;
|
||
|
});
|
||
|
form.render("select");
|
||
|
},
|
||
|
setInputTpl: function (eleId, data) {
|
||
|
var laytpl = layui.laytpl;
|
||
|
var form = layui.form;
|
||
|
var getTpl = '';
|
||
|
var display = data.display ? data.display : 'block';
|
||
|
var requiredhtml = data.required ? ' required lay-verify="required" ' : '';
|
||
|
var placeholder = data.placeholder ? data.placeholder : '请输入内容';
|
||
|
if (data.label) {
|
||
|
getTpl += '<label class="layui-form-label">{{d.label}}</label>';
|
||
|
}
|
||
|
getTpl += '<div class="layui-input-' + display + '">';
|
||
|
getTpl += '<input type="text" name="' + data.name + '" placeholder="' + placeholder + '" value="' + value + '" ' + requiredhtml + ' autocomplete="off" class="layui-input">';
|
||
|
getTpl += '</div>';
|
||
|
var view = document.getElementById(eleId);
|
||
|
if (!view) { console.warn("请填写有效的ElementId"); return false; }
|
||
|
laytpl(getTpl).render(data, function (html) {
|
||
|
view.innerHTML = html;
|
||
|
});
|
||
|
form.render();
|
||
|
},
|
||
|
setTextareaTpl: function (eleId, data) {
|
||
|
var laytpl = layui.laytpl;
|
||
|
var form = layui.form;
|
||
|
var idHtml = data.id ? 'id="' + data.id + '"' : '';
|
||
|
var classHtml = ' class="layui-textarea ' + (data.class ? data.class : '') + '" ';
|
||
|
var display = data.display ? data.display : 'block';
|
||
|
var value = data.value ? data.value : '';
|
||
|
var placeholder = data.placeholder ? data.placeholder : '请输入内容';
|
||
|
var requiredhtml = data.required ? ' required lay-verify="required" ' : '';
|
||
|
var getTpl = '';
|
||
|
if (data.label) {
|
||
|
getTpl += '<label class="layui-form-label">{{d.label}}</label>';
|
||
|
}
|
||
|
getTpl += '<div class="layui-input-' + display + '">';
|
||
|
getTpl += ' <textarea name="' + data.name + '" ' + idHtml + classHtml + requiredhtml + ' placeholder="' + placeholder + '" value="' + value + '"></textarea>';
|
||
|
getTpl += '</div>';
|
||
|
var view = document.getElementById(eleId);
|
||
|
if (!view) { console.warn("请填写有效的ElementId"); return false; }
|
||
|
laytpl(getTpl).render(data, function (html) {
|
||
|
view.innerHTML = html;
|
||
|
});
|
||
|
form.render();
|
||
|
},
|
||
|
setSelectTpl: function (eleId, data) {
|
||
|
var laytpl = layui.laytpl;
|
||
|
var form = layui.form;
|
||
|
var display = data.display ? data.display : 'block';
|
||
|
var layFilterHtml = data.layFilter ? ' lay-filter="' + data.layFilter + '" ' : ' ';
|
||
|
var classHtml = data.class ? ' class="' + eleId + '-select" ' : ' ';
|
||
|
var requiredhtml = data.required ? ' required lay-verify="required" ' : '';
|
||
|
var getTpl = "";
|
||
|
if (data.label) {
|
||
|
getTpl += '<label class="layui-form-label">{{d.label}}</label>';
|
||
|
}
|
||
|
getTpl += '<div class="layui-input-' + display + '">';
|
||
|
|
||
|
if (data.list.length > 0) {
|
||
|
getTpl += '<select name="{{d.name}}" ' + layFilterHtml + classHtml + requiredhtml + '>{{# layui.each(d.list, function(index, item){ }}<option value="{{ item.value }}" {{# if(item.selected){ }} selected="selected" {{# } }} >{{ item.name }}</option>{{# }); }}</select></div>';
|
||
|
} else {
|
||
|
getTpl += '<select name="{{d.name}}" ' + layFilterHtml + classHtml + requiredhtml + '><option value="" >请选择</option></select></div>';
|
||
|
|
||
|
}
|
||
|
|
||
|
var view = document.getElementById(eleId);
|
||
|
if (!view) { console.warn("请填写有效的ElementId"); return false; }
|
||
|
laytpl(getTpl).render(data, function (html) {
|
||
|
view.innerHTML = html;
|
||
|
});
|
||
|
form.render('select');
|
||
|
},
|
||
|
});
|
||
|
});
|