Tenlion/wg-basic
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加了视频、图片、音频、附件组件功能代码，调整组件

Browse Source
This commit is contained in:
wanggeng 2022-04-13 18:46:23 +08:00
parent 26ce348466
commit d44adf33fc
32 changed files with 840 additions and 1415 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
module-form/src/main/java/ink/wgink/module/form/controller/api/design/FormDesignController.java
View File

@ -17,6 +17,8 @@ import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.io.IOException;
@Api(tags = ISystemConstant.API_TAGS_SYSTEM_PREFIX + "表单设计")
@RestController
@RequestMapping(ISystemConstant.API_PREFIX + "/form-design")
@ -28,7 +30,7 @@ public class FormDesignController extends DefaultBaseController {
@ApiOperation(value = "保存表单", notes = "保存表单接口")
@ApiResponses({@ApiResponse(code = 400, message = "请求失败", response = ErrorResult.class)})
@PostMapping("save")
public SuccessResult save(@RequestBody FormDesignVO formDesignVO) {
public SuccessResult save(@RequestBody FormDesignVO formDesignVO) throws IOException {
formDesignService.save(formDesignVO);
return new SuccessResult();
}

4
module-form/src/main/java/ink/wgink/module/form/controller/staticfile/FormDesignStaticController.java
View File

@ -14,16 +14,16 @@ package ink.wgink.module.form.controller.staticfile;
import ink.wgink.util.ResourceUtil;
import ink.wgink.util.request.StaticResourceRequestUtil;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.InputStream;
@RestController
@Controller
@RequestMapping("static/form-design")
public class FormDesignStaticController {

38
module-form/src/main/java/ink/wgink/module/form/controller/staticfile/FormStaticController.java Normal file
View File

@ -0,0 +1,38 @@
package ink.wgink.module.form.controller.staticfile;
import ink.wgink.util.ResourceUtil;
import ink.wgink.util.request.StaticResourceRequestUtil;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.InputStream;
/**
* @ClassName: FormStaticController
* @Description: 表单静态资源
* @Author: wanggeng
* @Date: 2022/4/13 14:27
* @Version: 1.0
*/
@Controller
@RequestMapping("static/form")
public class FormStaticController {
@GetMapping("css/{fileName}")
public void css(HttpServletResponse httpServletResponse, @PathVariable("fileName") String fileName) throws IOException {
InputStream inputStream = ResourceUtil.getJarResourceInputStream("static/form/css/" + fileName);
StaticResourceRequestUtil.download(httpServletResponse, inputStream, fileName);
}
@GetMapping("js/{fileName}")
public void js(HttpServletResponse httpServletResponse, @PathVariable("fileName") String fileName) throws IOException {
InputStream inputStream = ResourceUtil.getJarResourceInputStream("static/form/js/" + fileName);
StaticResourceRequestUtil.download(httpServletResponse, inputStream, fileName);
}
}

68
module-form/src/main/java/ink/wgink/module/form/pojo/vos/design/FormDesignVO.java
View File

@ -1,6 +1,10 @@
package ink.wgink.module.form.pojo.vos.design;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import java.util.ArrayList;
import java.util.List;
/**
* @Description: 表单设计
@ -15,12 +19,7 @@ public class FormDesignVO {
private String formSummary;
private Integer formVersion;
private JSONArray data;
private String savePageCode;
private String updatePageCode;
private String showPageCode;
private String appSavePageCode;
private String appUpdatePageCode;
private String appShowPageCode;
private List<Field> fields;
public String getFormCode() {
return formCode == null ? "" : formCode.trim();
@ -62,51 +61,32 @@ public class FormDesignVO {
this.data = data;
}
public String getSavePageCode() {
return savePageCode == null ? "" : savePageCode.trim();
public List<Field> getFields() {
return fields == null ? new ArrayList<>() : fields;
}
public void setSavePageCode(String savePageCode) {
this.savePageCode = savePageCode;
public void setFields(List<Field> fields) {
this.fields = fields;
}
public String getUpdatePageCode() {
return updatePageCode == null ? "" : updatePageCode.trim();
}
public static class Field {
private JSONObject data;
private String html;
public void setUpdatePageCode(String updatePageCode) {
this.updatePageCode = updatePageCode;
}
public JSONObject getData() {
return data;
}
public String getShowPageCode() {
return showPageCode == null ? "" : showPageCode.trim();
}
public void setData(JSONObject data) {
this.data = data;
}
public void setShowPageCode(String showPageCode) {
this.showPageCode = showPageCode;
}
public String getHtml() {
return html == null ? "" : html.trim();
}
public String getAppSavePageCode() {
return appSavePageCode == null ? "" : appSavePageCode.trim();
}
public void setAppSavePageCode(String appSavePageCode) {
this.appSavePageCode = appSavePageCode;
}
public String getAppUpdatePageCode() {
return appUpdatePageCode == null ? "" : appUpdatePageCode.trim();
}
public void setAppUpdatePageCode(String appUpdatePageCode) {
this.appUpdatePageCode = appUpdatePageCode;
}
public String getAppShowPageCode() {
return appShowPageCode == null ? "" : appShowPageCode.trim();
}
public void setAppShowPageCode(String appShowPageCode) {
this.appShowPageCode = appShowPageCode;
public void setHtml(String html) {
this.html = html;
}
}
}

4
module-form/src/main/java/ink/wgink/module/form/service/design/IFormDesignService.java
View File

@ -2,6 +2,8 @@ package ink.wgink.module.form.service.design;
import ink.wgink.module.form.pojo.vos.design.FormDesignVO;
import java.io.IOException;
/**
* @Description: 表单设计
* @Author: WenG
@ -15,6 +17,6 @@ public interface IFormDesignService {
*
* @param formDesignVO
*/
void save(FormDesignVO formDesignVO);
void save(FormDesignVO formDesignVO) throws IOException;
}

64
module-form/src/main/java/ink/wgink/module/form/service/design/impl/FormDesignServiceImpl.java
View File

@ -3,9 +3,14 @@ package ink.wgink.module.form.service.design.impl;
import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import freemarker.template.Configuration;
import freemarker.template.Template;
import freemarker.template.TemplateException;
import ink.wgink.common.base.DefaultBaseService;
import ink.wgink.exceptions.ParamsException;
import ink.wgink.exceptions.PropertiesException;
import ink.wgink.exceptions.base.SystemException;
import ink.wgink.interfaces.consts.ISystemConstant;
import ink.wgink.module.form.consts.IFormDesignConst;
import ink.wgink.module.form.enums.design.FormFieldTypeEnum;
import ink.wgink.module.form.enums.design.FormStatusEnum;
@ -17,13 +22,18 @@ import ink.wgink.module.form.service.design.IFormDesignService;
import ink.wgink.module.form.service.design.IFormFieldService;
import ink.wgink.module.form.service.design.IFormService;
import ink.wgink.properties.form.FormProperties;
import ink.wgink.util.HtmlHelper;
import ink.wgink.util.date.DateUtil;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import javax.annotation.PostConstruct;
import java.io.IOException;
import java.io.StringWriter;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;
/**
* @Description: 表单设计
@ -40,9 +50,15 @@ public class FormDesignServiceImpl extends DefaultBaseService implements IFormDe
private IFormService formService;
@Autowired
private IFormFieldService formFieldService;
private Configuration configuration = new Configuration(Configuration.getVersion());
@PostConstruct
private void init() {
configuration.setClassForTemplateLoading(FormDesignServiceImpl.class, "/templates/ftl");
}
@Override
public void save(FormDesignVO formDesignVO) {
public void save(FormDesignVO formDesignVO) throws IOException {
if (StringUtils.isBlank(formProperties.getTemplatePath())) {
throw new PropertiesException("未配置模板路径");
}
@ -75,12 +91,23 @@ public class FormDesignServiceImpl extends DefaultBaseService implements IFormDe
formVO.setFormStatus(FormStatusEnum.ACTIVE.getValue());
formVO.setFormVersion(version);
formVO.setFormSourceData(JSON.toJSONString(formDesignVO.getData()));
formVO.setSavePageCode(formDesignVO.getSavePageCode());
formVO.setUpdatePageCode(formDesignVO.getUpdatePageCode());
formVO.setShowPageCode(formDesignVO.getShowPageCode());
formVO.setAppSavePageCode(formDesignVO.getAppSavePageCode());
formVO.setAppUpdatePageCode(formDesignVO.getAppUpdatePageCode());
formVO.setAppShowPageCode(formDesignVO.getAppShowPageCode());
// 美化代码
for (FormDesignVO.Field field : formDesignVO.getFields()) {
String fieldCode = HtmlHelper.formatHtml(field.getHtml(), "\t", 4);
field.setHtml(fieldCode);
}
Map<String, Object> model = getHashMap(4);
model.put("fields", formDesignVO.getFields());
String savePageCode = getTemplateCode("/page/web/form-save.ftl", model);
formVO.setSavePageCode(savePageCode);
// formVO.setUpdatePageCode(formDesignVO.getUpdatePageCode());
// formVO.setShowPageCode(formDesignVO.getShowPageCode());
// formVO.setAppSavePageCode(formDesignVO.getAppSavePageCode());
// formVO.setAppUpdatePageCode(formDesignVO.getAppUpdatePageCode());
// formVO.setAppShowPageCode(formDesignVO.getAppShowPageCode());
String formId = formService.saveReturnId(formVO);
LOG.debug("保存表单字段");
@ -199,5 +226,28 @@ public class FormDesignServiceImpl extends DefaultBaseService implements IFormDe
return null;
}
/**
* 获取模板code
*
* @param fileName
* @param model
* @return
* @throws IOException
*/
private String getTemplateCode(String fileName, Map<String, Object> model) throws IOException {
Template template = getTemplate(fileName);
StringWriter stringWriter = new StringWriter();
try {
template.process(model, stringWriter);
} catch (TemplateException e) {
LOG.error(e.getMessage(), e);
throw new SystemException("模板错误");
}
return stringWriter.toString();
}
private Template getTemplate(String fileName) throws IOException {
return configuration.getTemplate(fileName, ISystemConstant.CHARSET_UTF8);
}
}

27
module-form/src/main/java/ink/wgink/module/form/service/report/impl/FormReportRouteServiceImpl.java
View File

@ -15,8 +15,8 @@ import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.stereotype.Service;
import org.springframework.web.servlet.view.freemarker.FreeMarkerConfigurer;
import javax.annotation.PostConstruct;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
@ -34,10 +34,16 @@ import java.util.Map;
@Service
public class FormReportRouteServiceImpl extends DefaultBaseService implements IFormReportRouteService {
@Autowired
private FreeMarkerConfigurer freeMarkerConfigurer;
@Autowired
private IFormService formService;
private Configuration configuration = new Configuration(Configuration.getVersion());
@PostConstruct
private void init() {
StringTemplateLoader stringTemplateLoader = new StringTemplateLoader();
configuration.setTemplateLoader(stringTemplateLoader);
configuration.setDefaultEncoding(ISystemConstant.CHARSET_UTF8);
}
@Override
public void save(String formCode, Integer formVersion, HttpSession httpSession, HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) {
@ -224,21 +230,8 @@ public class FormReportRouteServiceImpl extends DefaultBaseService implements IF
return formPO;
}
/**
* 获取配置
*
* @return
*/
private Configuration getConfiguration() {
StringTemplateLoader stringTemplateLoader = new StringTemplateLoader();
Configuration configuration = freeMarkerConfigurer.getConfiguration();
configuration.setTemplateLoader(stringTemplateLoader);
configuration.setDefaultEncoding(ISystemConstant.CHARSET_UTF8);
return configuration;
}
private Template getTemplate(String templateName, String templateCode) throws IOException {
return new Template(templateName, templateCode, getConfiguration());
return new Template(templateName, templateCode, configuration);
}
}

30
module-form/src/main/resources/static/form-design/modules/components/checkbox.js
View File

@ -5,7 +5,7 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label {0}" style="width: {3}px"><span style="color:red;">{2}</span>{1}:</label>',
' <div class="layui-input-block" style="width:calc({0} - {1}px);margin-left: {1}px;">',
' <input type="checkbox" name="{0}[{1}]" title="{2}" checked {3} {4}>',
@ -43,8 +43,8 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
update: function (json) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _required = json.required ? 'lay-verify="otherReq"' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
var _html = '';
@ -85,30 +85,6 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
}
}
$('#columnProperty').append(_html);
},
genScript: function(item) {
return {
func: {
save: '',
update: ''
},
init: {
save: '',
update: [
' var ' + item.id + ' = data.' + item.id + '.split(\',\');',
' var '+ item.id +'Obj = {};',
' for(var i = 0, item = ' + item.id + '[i]; item = ' + item.id + '[i++];) {',
' '+ item.id +'Obj[\'' + item.id + '[\'+ item +\']\'] = true;',
' }',
' form.val(\'dataForm\', '+ item.id +'Obj);',
].join('\n')
},
commit: [
' var ' + item.id + ' = top.restAjax.checkBoxToString(formData.field, \'' + item.id + '\');',
' formData.field.' + item.id + ' = ' + item.id + ';'
].join('\n'),
}
}
}

6
module-form/src/main/resources/static/form-design/modules/components/date.js
View File

@ -5,7 +5,7 @@ layui.define(['jquery', 'laydate', 'formUtils'], function(exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label {0}" style="width: {3}px;"><span style="color:red;">{2}</span>{1}:</label>',
' <div class="layui-input-block" style="width:calc({0} - {1}px);margin-left: {1}px;">',
' <input id="{1}{0}" name="{0}" lay-verify="{4}" class="layui-input icon-date widget-date {2}" style="line-height: 40px;{2}"></input>',
@ -38,8 +38,8 @@ layui.define(['jquery', 'laydate', 'formUtils'], function(exports) {
var _disabledClass = json.disabled ? ' layui-disabled' : '';
var _disabledStyle = json.disabled ? ' pointer-events: none;' : '';
var _required = json.required ? 'required' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
$block.css("margin-left", json.labelWidth);

2
module-form/src/main/resources/static/form-design/modules/components/grid.js
View File

@ -13,7 +13,7 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
if (selected === undefined) {
selected = false;
}
var _html = '<div id="{0}" class="layui-form-item layui-row grid {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var _html = '<div id="{0}Box" class="layui-form-item layui-row grid {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var colClass = 'layui-col-md6 layui-col-xs6';
if (json.columns.length == 3) {

6
module-form/src/main/resources/static/form-design/modules/components/input.js
View File

@ -4,7 +4,7 @@ layui.define(['jquery', 'formField', 'formUtils'], function(exports) {
var utils = layui.formUtils;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label {0}" style="width: {3}px;"><span style="color:red;">{2}</span>{1}:</label>',
' <div class="layui-input-block" style="margin-left: {0}px">',
' <input name="{0}" value="{1}" placeholder="{3}" class="layui-input{7}" lay-vertype="tips" lay-verify="{6}" {4} {5} style="width:{2}">',
@ -49,8 +49,8 @@ layui.define(['jquery', 'formField', 'formUtils'], function(exports) {
_required = 'required' + '|' + json.expression;
}
}
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
$block.css("margin-left", json.labelWidth);

2
module-form/src/main/resources/static/form-design/modules/components/layCarousel.js
View File

@ -14,7 +14,7 @@ layui.define(['jquery', 'carousel', 'formUtils'], function(exports) {
if (selected === undefined) {
selected = false;
}
var _html = '<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var _html = '<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
// _html +='<label class="layui-form-label {0}">{1}:</label>'.format(json.required?'layui-form-required':'',json.label);
// _html +='<div class="layui-input-block">';
_html += '<div class="layui-carousel" id="{0}">'.format(json.tag + json.id);

6
module-form/src/main/resources/static/form-design/modules/components/layRate.js
View File

@ -16,7 +16,7 @@ layui.define(['jquery', 'rate', 'formUtils'], function(exports) {
}
var _readonly = json.readonly ? 'readonly=""' : '';
var _required = json.required ? 'required=""' : '';
var _html = '<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var _html = '<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
_html += '<label class="layui-form-label {0}" style="width:{2}px;">{1}:</label>'.format(json.required ? 'layui-form-required' : '', json.label, json.labelWidth);
_html += '<div class="layui-input-block" style="margin-left: {0}px">'.format(json.labelWidth);
_html += '<div id="{0}" class="widget-rate"></div>'.format(json.tag + json.id);
@ -26,8 +26,8 @@ layui.define(['jquery', 'rate', 'formUtils'], function(exports) {
return _html;
},
update: function (json) {
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$label.empty();
$block.css("margin-left", json.labelWidth);
$label.css("width", json.labelWidth);

6
module-form/src/main/resources/static/form-design/modules/components/laySign.js
View File

@ -14,7 +14,7 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
if (selected === undefined) {
selected = false;
}
var _html = '<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var _html = '<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
_html += '<label class="layui-form-label" style="width: {1}px">{0}:</label>'.format(json.label, json.labelWidth);
_html += '<div class="layui-input-block" style="margin-left: {0}px;">'.format(json.labelWidth);
if (json.disabled) {
@ -30,8 +30,8 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
return _html;
},
update: function (json) {
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
$block.css("margin-left", json.labelWidth);

6
module-form/src/main/resources/static/form-design/modules/components/laySlider.js
View File

@ -15,7 +15,7 @@ layui.define(['jquery', 'slider', 'formUtils'], function(exports) {
selected = false;
}
var _disabled = json.disabled ? 'disabled=""' : '';
var _html = '<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var _html = '<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
_html += '<label class="layui-form-label" style="width: {1}px;">{0}:</label>'.format(json.label, json.labelWidth);
_html += '<div class="layui-input-block layui-form" style="width:calc({0} - {1}px);margin-left: {1}px">'.format(json.width, json.labelWidth);
_html += '<div id="{0}" class="widget-slider"></div>'.format(json.tag + json.id);
@ -25,8 +25,8 @@ layui.define(['jquery', 'slider', 'formUtils'], function(exports) {
return _html;
},
update: function (json) {
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$label.empty();
$block.css("margin-left", json.labelWidth);
$label.css("width", json.labelWidth);

6
module-form/src/main/resources/static/form-design/modules/components/laySwitch.js
View File

@ -16,7 +16,7 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
}
var _disabled = json.disabled ? 'disabled=""' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
var _html = '<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
var _html = '<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">'.format(json.id, json.tag, selected ? 'active' : '', json.index);
_html += '<label class="layui-form-label" style="width: {1}px;">{0}:</label>'.format(json.label, json.labelWidth);
_html += '<div class="layui-input-block" style="width:calc({0} - {1}px);border: 1px solid #d2d2d2;border-left: 0px;margin-left: {1}px">'.format(json.width, json.labelWidth);
_html += '<input type="checkbox" name="{0}" lay-skin="switch" lay-text="ON|OFF" {1} class="{2}" {3}>'.format(json.id, _disabled, _disabledClass, json.switchValue ? 'checked' : '');
@ -27,8 +27,8 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
update: function (json) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
var _html = '';

10
module-form/src/main/resources/static/form-design/modules/components/numberInput.js
View File

@ -4,7 +4,7 @@ layui.define(['jquery', 'formUtils', 'formField'], function(exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label" style="width: {1};">{0}:</label>',
' <div class="layui-input-block" style="width:calc({0} - {1}px);margin-left: {1}px;">',
' <input name="{0}" id="{9}" value="{1}" type="number" placeholder="{3}" class="layui-input{5}" lay-vertype="tips" min="{6}" max="{7}" step="{8}" {4} style="width:{2}">',
@ -36,8 +36,8 @@ layui.define(['jquery', 'formUtils', 'formField'], function(exports) {
update: function (json) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
$block.css("margin-left", json.labelWidth);
@ -54,9 +54,9 @@ layui.define(['jquery', 'formUtils', 'formField'], function(exports) {
if ('' != _width) {
_width = 100 - parseInt(_width);
}
$('#' + json.id + ' .layui-input-block .layui-number-input-btn').css("right", _width + "%");
$('#' + json.id + 'Box .layui-input-block .layui-number-input-btn').css("right", _width + "%");
if (json.disabled) {
$('#' + json.id + ' .layui-input-block .layui-number-input-btn').css("z-index", "-1");
$('#' + json.id + 'Box .layui-input-block .layui-number-input-btn').css("z-index", "-1");
}
},
/* 获取对象 */

6
module-form/src/main/resources/static/form-design/modules/components/password.js
View File

@ -4,7 +4,7 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label {0}" style="width: {3}px"><span style="color:red;">{2}</span>{1}:</label>',
' <div class="layui-input-block" style="margin-left: {0}px">',
' <input type="password" name="{0}" placeholder="{3}" value="{1}" autocomplete="off" style="width:{2}" {4} {5} {6} class="layui-input{7}">',
@ -39,8 +39,8 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
var _readonly = json.readonly ? 'readonly=""' : '';
var _required = json.required ? 'lay-verify="required"' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
$block.css("margin-left", json.labelWidth);

6
module-form/src/main/resources/static/form-design/modules/components/radio.js
View File

@ -5,7 +5,7 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label" style="width: {1}px;">{0}:</label>',
' <div class="layui-input-block" style="margin-left: {0}px">',
' <input type="radio" name="{0}" value="{1}" title="{2}" checked="" {3}>',
@ -41,8 +41,8 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
},
update: function (json) {
var _disabled = json.disabled ? 'disabled=""' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
$block.css("margin-left", json.labelWidth);

10
module-form/src/main/resources/static/form-design/modules/components/select.js
View File

@ -5,7 +5,7 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label {0}" style="width: {3}px;"><span style="color:red;">{2}</span>{1}:</label>',
' <div class="layui-input-block layui-form" lay-filter="{0}" style="margin-left: {1}px">',
' <select name="{0}" lay-verify="{2}" {1} >',
@ -47,8 +47,8 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
update: function (json) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _required = json.required ? 'required' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
var _html = '';
@ -61,7 +61,7 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
}
}
_html += '</select>'
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
$block.css("margin-left", json.labelWidth);
$label.css("width", json.labelWidth);
if (json.required) {
@ -69,7 +69,7 @@ layui.define(['jquery', 'form', 'formUtils'], function(exports) {
}
$label.append(json.label + ":");
form.render('select', json.id);
$('#' + json.id + ' .layui-input-block div.layui-unselect.layui-form-select').css({
$('#' + json.id + 'Box .layui-input-block div.layui-unselect.layui-form-select').css({
width: '{0}'.format(json.width)
});
$block.css({

8
module-form/src/main/resources/static/form-design/modules/components/textarea.js
View File

@ -4,7 +4,7 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
var formField = layui.formField;
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item layui-form-text {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item layui-form-text {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label {0}" style="width: {3};"><span style="color:red;">{2}</span>{1}:</label>',
' <div class="layui-input-block" style="width: {0}">',
' <textarea name="{0}" placeholder="{3}" width="{2}" class="layui-textarea{6}" {4} {5} {7}>{1}</textarea>',
@ -39,13 +39,13 @@ layui.define(['jquery', 'formUtils', 'formField'], function (exports) {
var _required = json.required ? 'lay-verify="required"' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
var _readonly = json.readonly ? 'readonly=""' : '';
var $block = $('#' + json.id + ' .layui-input-block');
var $label = $('#' + json.id + ' .layui-form-label');
var $block = $('#' + json.id + 'Box .layui-input-block');
var $label = $('#' + json.id + 'Box .layui-form-label');
$block.empty();
$label.empty();
var _html = '';
_html += HTML_ARRAY[3].format(json.id, json.defaultValue ? json.defaultValue : '', json.width, json.placeholder, _disabled, _required, _disabledClass, _readonly);
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
$label.css({
width: '{0}'.format(json.width)
});

4
module-form/src/main/resources/static/form-design/modules/components/uploadImage.js
View File

@ -9,7 +9,7 @@ layui.define(['jquery', 'upload', 'dialog', 'restajax', 'formUtils'], function(e
var viewerObj = {};
var HTML_ARRAY = [
'<div id="{0}" class="layui-form-item layui-form-text {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
'<div id="{0}Box" class="layui-form-item layui-form-text {2}" data-id="{0}" data-tag="{1}" data-index="{3}">',
' <label class="layui-form-label">{0}:</label>',
' <div class="layui-input-block">',
' <input type="hidden" id="{0}File" name="{0}">',
@ -58,7 +58,7 @@ layui.define(['jquery', 'upload', 'dialog', 'restajax', 'formUtils'], function(e
return _html;
},
update: function (json) {
$('#'+ json.id +' .layui-form-label').text(json.label);
$('#'+ json.id +'Box .layui-form-label').text(json.label);
},
/* 获取对象 */
jsonData: function (id, index, columncount) {

1257
module-form/src/main/resources/static/form-design/modules/formDesigner.js
View File

File diff suppressed because it is too large Load Diff

22
module-form/src/main/resources/static/form-design/modules/formPreview.js
View File

@ -350,11 +350,11 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
return _html;
},
update: function (json, value) {
$('#' + json.id + ' .layui-input-block').empty();
$('#' + json.id + 'Box .layui-input-block').empty();
var _html = '';
//重绘设计区改id下的所有元素
_html += '<div id="{0}"></div>'.format(json.tag + json.id);
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
var labelGenerationObject = labelGeneration.render({
elem: '#' + json.tag + json.id,
data: value,
@ -400,12 +400,12 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
}, update: function (json, value) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
$('#' + json.id + ' .layui-input-block').empty();
$('#' + json.id + 'Box .layui-input-block').empty();
var _html = '';
//重绘设计区改id下的所有元素
_html += '<input name="{0}" value="{1}" id="{6}" placeholder="{3}" class="layui-input{5}" lay-filter="{6}" lay-vertype="tips" {4} style="width:{2}">'
.format(json.id, value ? value : '', json.width, json.placeholder, _disabled, _disabledClass, json.tag + json.id);
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
iconPicker.render({
// 选择器，推荐使用input
elem: '#' + json.tag + json.id,
@ -476,7 +476,7 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
update: function (json, value) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _disabledClass = json.disabled ? ' layui-disabled' : '';
$('#' + json.id + ' .layui-input-block').empty();
$('#' + json.id + 'Box .layui-input-block').empty();
var _html = '';
//重绘设计区改id下的所有元素
_html += '<input name="{0}" value="{1}" id="{6}" placeholder="{3}" class="layui-input{5}" lay-filter="iconPicker" lay-vertype="tips" {4} style="width:{2}">'
@ -487,7 +487,7 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
_width = 100 - parseInt(_width);
}
_html += '<button id="{0}-button" style="position: absolute;top: 0;right: {1}%;cursor: pointer;" type="button" class="layui-btn">生成</button>'.format(json.tag + json.id, _width);
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
cron.render({
elem: "#" + json.tag + json.id + "-button", // 绑定元素
url: json.cronUrl, // 获取最近运行时间的接口
@ -497,7 +497,7 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
},
});
} else {
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
}
},
/* 获取对象 */
@ -646,13 +646,13 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
update: function (json) {
var _disabled = json.disabled ? 'disabled=""' : '';
var _required = json.required ? 'lay-verify="otherReq"' : '';
$('#' + json.id + ' .layui-input-block').empty();
$('#' + json.id + 'Box .layui-input-block').empty();
var _html = '';
//重绘设计区改id下的所有元素
for (var i = 0; i < json.options.length; i++) {
_html += '<input type="checkbox" name="{0}[{1}]" title="{2}" {3} {4}>'.format(json.id, json.options[i].value, json.options[i].text, _disabled, _required);
}
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
form.render('checkbox');
},
/* 获取对象 */
@ -840,7 +840,7 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
return _html;
},
update: function (json, value) {
$('#' + json.id + ' .layui-input-block').empty();
$('#' + json.id + 'Box .layui-input-block').empty();
var _html = '';
//重绘设计区改id下的所有元素
if (json.disabled) {
@ -852,7 +852,7 @@ layui.config({base: './form-design/modules/'}).define(['layer', 'laytpl', 'eleme
_html += '<div class="signImg"><img src="{0}"></div>'.format(value);
signObjects[json.id] = value;
}
$('#' + json.id + ' .layui-input-block').append(_html);
$('#' + json.id + 'Box .layui-input-block').append(_html);
},
/* 获取对象 */
jsonData: function (id, index, columncount) {

70
module-form/src/main/resources/static/form/css/form.css Normal file
View File

@ -0,0 +1,70 @@
/* 上传图片 */
.form-upload-image {
position: relative;
display: inline-block;
margin: 10px 10px 0 0;
}
.form-upload-image:last-child {
margin-right: 0;
}
.form-upload-image img {
height: 100px;
}
.form-upload-image .delete-btn {
position: absolute;
top: 0;
right: 0;
margin: 0;
}
/* 上传附件 */
.form-upload-file {
}
.form-upload-file .operation {
text-align: center;
}
.form-upload-file .delete-btn {
margin: 0;
}
/* 上传视频 */
.form-upload-video {
position: relative;
display: inline-block;
margin: 10px 10px 0 0;
}
.form-upload-video:last-child {
margin-right: 0;
}
.form-upload-video .delete-btn {
position: absolute;
top: 0;
right: 0;
margin: 0;
}
/* 上传音频 */
.form-upload-audio {
position: relative;
display: inline-block;
margin: 10px 10px 0 0;
}
.form-upload-audio:last-child {
margin-right: 0;
}
.form-upload-audio .delete-btn {
position: absolute;
top: 0;
right: 0;
margin: 0;
}

478
module-form/src/main/resources/static/form/js/form-util.js Normal file
View File

@ -0,0 +1,478 @@
function FormUtil(layui, viewer) {
var $ = layui.$;
var layer = layui.layer;
var upload = layui.upload;
var Viewer = viewer;
var restAjax = layui.restajax;
var viewerObj = {};
/**
* 初始化图片上传
* @param fieldName
* @param maxCount
*/
this.initUploadImage = function (fieldName, maxCount) {
maxCount = maxCount ? parseInt(maxCount) : 9
maxCount = maxCount < 0 ? 9 : maxCount;
var id = '#' + fieldName;
var fileBoxId = id + 'FileBox';
var uploadBtnId = id + 'UploadBtn';
var deleteBtnClass = '.delete-' + fieldName + '-btn';
function init(callback) {
var fileIds = $(id).val();
var fileIdArray = fileIds ? fileIds.split(',') : [];
var html = '';
for (var i = 0, fileId; fileId = fileIdArray[i++];) {
html += [
'<div class="form-upload-image">',
' <img src="route/file/download/true/' + fileId + '" align="加载失败">',
' <a class="layui-btn layui-btn-xs layui-btn-danger delete-btn delete-' + fieldName + '-btn" href="javascript:void(0);" data-id="' + fileId + '" data-name="' + fieldName + '">',
' <i class="fa fa-trash-o"></i>',
' </a>',
'</div>',
].join('');
}
$(fileBoxId).empty();
$(fileBoxId).append(html);
if (fileIdArray.length < maxCount) {
$(uploadBtnId).removeClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', false);
} else {
$(uploadBtnId).addClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', true);
}
callback ? callback() : '';
}
function addClick() {
upload.render({
elem: uploadBtnId,
url: 'api/file/v2/upload-image',
accept: 'images',
acceptMime: 'image/*',
field: 'image',
exts: 'jpg|png|gif|bmp|jpeg',
name: fieldName,
done: function (res, index, upload) {
var name = this.name;
var files = $('#' + this.name).val();
if (files.length > 0) {
files += ',';
}
files += res.data.fileId;
$('#' + name).val(files);
init(function () {
viewerObj[name].update();
});
},
error: function (index, upload) {
layer.msg('文件上传失败');
},
progress: function (n, elem, res, index) {
var percent = n + '%'
console.log(percent);
console.log(elem);
console.log(res);
console.log(index);
element.progress('demo-' + index, n + '%');
}
});
$(document).on('click', deleteBtnClass, function () {
var name = this.dataset.name;
var id = this.dataset.id;
var files = $('#' + name).val().replace(id, '');
files = files.replace(/\,+/g, ',');
if (files.charAt(0) == ',') {
files = files.substring(1);
}
if (files.charAt(files.length - 1) == ',') {
files = files.substring(0, files.length - 1);
}
$('#' + name).val(files);
init(function () {
viewerObj[name].update();
});
});
}
init(function () {
viewerObj[fieldName] = new Viewer(document.getElementById(fieldName + 'FileBox'), {navbar: false});
});
addClick();
}
/**
* 初始化文件上传
* @param fieldName
* @param maxCount
*/
this.initUploadFile = function (fieldName, maxCount) {
maxCount = maxCount ? parseInt(maxCount) : 3
maxCount = maxCount < 0 ? 3 : maxCount;
var id = '#' + fieldName;
var fileBoxId = id + 'FileBox';
var uploadBtnId = id + 'UploadBtn';
var deleteBtnClass = '.delete-' + fieldName + '-btn';
function init() {
var files = $(id).val();
var fileArray = files ? files.split(',') : [];
var html = '';
if (fileArray.length > 0) {
html += [
'<div class="form-upload-file">',
' <table class="layui-table" lay-size="sm">',
' <colgroup>',
' <col>',
' <col width="60">',
' </colgroup>',
' <thead>',
' <tr>',
' <th>文件名</th>',
' <th class="operation">操作</th>',
' </tr>',
' </thead>',
' <tbody>',
].join('');
for (var i = 0, file; file = fileArray[i++];) {
var idNameArray = file.split(':');
var fileId = idNameArray[0];
var fileName = idNameArray[1];
html += [
'<tr>',
' <td>' + fileName + '</td>',
' <td class="operation">',
' <button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete-btn delete-' + fieldName + '-btn" data-id="' + fileId + '" data-name="' + fileName + '" data-field-name="' + fieldName + '">删除</button>',
' </td>',
'</tr>',
].join('');
}
html += [
' </tbody>',
' </table>',
'</div>'
].join('');
}
$(fileBoxId).empty();
$(fileBoxId).append(html);
if (fileArray.length < maxCount) {
$(uploadBtnId).removeClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', false);
} else {
$(uploadBtnId).addClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', true);
}
}
function addClick() {
upload.render({
elem: uploadBtnId,
url: 'api/file/v2/upload-file',
accept: 'file',
acceptMime: [
'application/pdf',
'application/msword',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'application/vnd.ms-excel',
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
'application/vnd.ms-powerpoint',
'application/vnd.openxmlformats-officedocument.presentationml.presentation',
'application/vnd.ms-works',
'text/plain',
'application/x-rar',
'application/x-zip-compressed'
].join(''),
field: 'file',
exts: 'pdf|doc|docx|xls|xlsx|ppt|pptx|wps|txt|rar|zip',
name: fieldName,
done: function (res, index, upload) {
var name = this.name;
var files = $('#' + this.name).val();
if (files.length > 0) {
files += ',';
}
files += res.data.fileId + ':' + res.data.fileName;
$('#' + name).val(files);
init();
},
error: function (index, upload) {
layer.msg('文件上传失败');
},
progress: function (n, elem, res, index) {
var percent = n + '%'
console.log(percent);
console.log(elem);
console.log(res);
console.log(index);
element.progress('demo-' + index, n + '%');
}
});
$(document).on('click', deleteBtnClass, function () {
var id = this.dataset.id;
var name = this.dataset.name;
var fieldName = this.dataset.fieldName;
var files = $('#' + fieldName).val().replace(id + ':' + name, '');
files = files.replace(/\,+/g, ',');
if (files.charAt(0) == ',') {
files = files.substring(1);
}
if (files.charAt(files.length - 1) == ',') {
files = files.substring(0, files.length - 1);
}
$('#' + fieldName).val(files);
init();
});
}
init();
addClick();
}
/**
* 初始化视频上传
* @param fileName
* @param maxCount
*/
this.initUploadVideo = function (fileName, maxCount) {
maxCount = maxCount ? parseInt(maxCount) : 1
maxCount = maxCount < 0 ? 1 : maxCount;
var id = '#' + fileName;
var fileBoxId = id + 'FileBox';
var uploadBtnId = id + 'UploadBtn';
var deleteBtnClass = '.delete-' + fileName + '-btn';
function init() {
var fileIds = $(id).val();
var fileIdArray = fileIds ? fileIds.split(',') : [];
var html = '';
for (var i = 0, fileId; fileId = fileIdArray[i++];) {
html += [
'<div class="form-upload-video">',
' <video width="320" height="240" controls>',
' <source src="route/file/download/true/' + fileId + '" type="video/mp4">',
' 您的浏览器不支持 video 标签',
' </video>',
' <a class="layui-btn layui-btn-xs layui-btn-danger delete-btn delete-' + fileName + '-btn" href="javascript:void(0);" data-id="' + fileId + '" data-name="' + fileName + '">',
' <i class="fa fa-trash-o"></i>',
' </a>',
'</div>',
].join('');
}
$(fileBoxId).empty();
$(fileBoxId).append(html);
if (fileIdArray.length < maxCount) {
$(uploadBtnId).removeClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', false);
} else {
$(uploadBtnId).addClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', true);
}
}
function addClick() {
upload.render({
elem: uploadBtnId,
url: 'api/file/v2/upload-video',
accept: 'video',
acceptMime: 'video/mp4',
exts: 'mp4',
field: 'video',
name: fileName,
done: function (res, index, upload) {
var name = this.name;
var files = $('#' + this.name).val();
if (files.length > 0) {
files += ',';
}
files += res.data.fileId;
$('#' + name).val(files);
init();
},
error: function (index, upload) {
layer.msg('文件上传失败');
},
progress: function (n, elem, res, index) {
var percent = n + '%'
console.log(percent);
console.log(elem);
console.log(res);
console.log(index);
element.progress('demo-' + index, n + '%');
}
});
$(document).on('click', deleteBtnClass, function () {
var name = this.dataset.name;
var id = this.dataset.id;
var files = $('#' + name).val().replace(id, '');
files = files.replace(/\,+/g, ',');
if (files.charAt(0) == ',') {
files = files.substring(1);
}
if (files.charAt(files.length - 1) == ',') {
files = files.substring(0, files.length - 1);
}
$('#' + name).val(files);
init();
});
}
init();
addClick();
}
/**
* 初始化音频上传
* @param fileName
* @param maxCount
*/
this.initUploadAudio = function (fileName, maxCount) {
maxCount = maxCount ? parseInt(maxCount) : 1
maxCount = maxCount < 0 ? 1 : maxCount;
var id = '#' + fileName;
var fileBoxId = id + 'FileBox';
var uploadBtnId = id + 'UploadBtn';
var deleteBtnClass = '.delete-' + fileName + '-btn';
function init() {
var fileIds = $(id).val();
var fileIdArray = fileIds ? fileIds.split(',') : [];
var html = '';
for (var i = 0, fileId; fileId = fileIdArray[i++];) {
html += [
'<div class="form-upload-video">',
' <audio src="route/file/download/true/' + fileId + '" controls>',
' 您的浏览器不支持 audio 标签。',
' </audio>',
' <a class="layui-btn layui-btn-xs layui-btn-danger delete-btn delete-' + fileName + '-btn" href="javascript:void(0);" data-id="' + fileId + '" data-name="' + fileName + '">',
' <i class="fa fa-trash-o"></i>',
' </a>',
'</div>',
].join('');
}
$(fileBoxId).empty();
$(fileBoxId).append(html);
if (fileIdArray.length < maxCount) {
$(uploadBtnId).removeClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', false);
} else {
$(uploadBtnId).addClass('layui-btn-disabled');
$(uploadBtnId).attr('disabled', true);
}
}
function addClick() {
upload.render({
elem: uploadBtnId,
url: 'api/file/v2/upload-audio',
accept: 'audio',
acceptMime: [
'audio/wav',
'audio/mp3'
],
exts: 'wav|mp3',
field: 'audio',
name: fileName,
done: function (res, index, upload) {
var name = this.name;
var files = $('#' + this.name).val();
if (files.length > 0) {
files += ',';
}
files += res.data.fileId;
$('#' + name).val(files);
init();
},
error: function (index, upload) {
layer.msg('文件上传失败');
},
progress: function (n, elem, res, index) {
var percent = n + '%'
console.log(percent);
console.log(elem);
console.log(res);
console.log(index);
element.progress('demo-' + index, n + '%');
}
});
$(document).on('click', deleteBtnClass, function () {
var name = this.dataset.name;
var id = this.dataset.id;
var files = $('#' + name).val().replace(id, '');
files = files.replace(/\,+/g, ',');
if (files.charAt(0) == ',') {
files = files.substring(1);
}
if (files.charAt(files.length - 1) == ',') {
files = files.substring(0, files.length - 1);
}
$('#' + name).val(files);
init();
});
}
init();
addClick();
}
/**
* 初始化日期
* @param opt
*/
this.initDate = function (laydate, opt) {
laydate.render({
elem: '#' + opt.id,
type: opt.datetype,
format: opt.dateformat,
value: opt.dateDefaultValue,
min: opt.dataMinValue,
max: opt.dataMaxValue,
trigger: 'click'
});
}
/**
* 初始化checkbox数据
* @param form
* @param checkedData
* @param id
*/
this.initCheckboxData = function (form, formName, checkedData, id) {
var dataArray = checkedData.split(',');
var obj = {};
for (var i = 0, data; data = dataArray[i++];) {
obj[id + '[' + data + ']'] = true;
}
form.val(formName, obj);
}
/**
* 设置复选框值
* @param formData
* @param id
*/
this.setCheckboxValue = function (formData, id) {
formData.field[id] = restAjax.checkBoxToString(formData.field, id);
}
/**
* 设置开关值
* @param formData
* @param id
*/
this.setSwitchValue = function (formData, id) {
formData.field[id] = formData.field[id] ? 1 : 0;
}
}

4
module-form/src/main/resources/templates/form/get-save-page-code.html
View File

@ -15,7 +15,7 @@
<body>
<div class="layui-anim layui-anim-fadein">
<div class="layui-card">
<div class="layui-card-body" style="padding: 15px;">
<div class="layui-card-body" style="padding: 0px;">
<form class="layui-form layui-form-pane" lay-filter="dataForm">
<div class="layui-row">
<div class="layui-col-md12 layui-col-xs12">
@ -78,7 +78,7 @@
function initFormHtml(value) {
var editor = CodeMirror.fromTextArea(document.getElementById('savePageCode'), codeMirrorConfig);
editor.setValue(value);
editor.setSize('100%', win.height() - 90);
editor.setSize('100%', win.height() - 65);
editor.on('change', function(self, changeValue) {
$('#savePageCode').val(self.getValue());
})

25
module-form/src/main/resources/templates/form/list.html
View File

@ -141,7 +141,7 @@
{field:'opition', width:120, title: '操作', fixed:'right', align:'center',
templet: function(item) {
return '<div class="layui-btn-group">' +
'<button type="button" class="layui-btn layui-btn-xs" lay-event="showFormEvent">预览(PC新增)</button>'+
'<button type="button" class="layui-btn layui-btn-xs" lay-event="showFormEvent">上报列表</button>'+
'</div>';
}
}
@ -256,7 +256,7 @@
title: '新增页面模板',
url: top.restAjax.path('route/form/get-save-page-code?formId={formId}&formCode={formCode}&formVersion={formVersion}', [data.formId, data.formCode, data.formVersion]),
width: '80%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -265,7 +265,7 @@
title: '修改页面模板',
url: top.restAjax.path('route/form/get-update-page-code?formId={formId}&formCode={formCode}&formVersion={formVersion}', [data.formId, data.formCode, data.formVersion]),
width: '80%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -274,7 +274,7 @@
title: '详情页面模板',
url: top.restAjax.path('route/form/get-show-page-code?formId={formId}&formCode={formCode}&formVersion={formVersion}', [data.formId, data.formCode, data.formVersion]),
width: '80%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -283,7 +283,7 @@
title: 'APP新增页面模板',
url: top.restAjax.path('route/form/get-app-save-page-code?formId={formId}&formCode={formCode}&formVersion={formVersion}', [data.formId, data.formCode, data.formVersion]),
width: '80%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -292,7 +292,7 @@
title: 'APP修改页面模板',
url: top.restAjax.path('route/form/get-app-update-page-code?formId={formId}&formCode={formCode}&formVersion={formVersion}', [data.formId, data.formCode, data.formVersion]),
width: '80%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -301,7 +301,7 @@
title: 'APP详情页面模板',
url: top.restAjax.path('route/form/get-app-show-page-code?formId={formId}&formCode={formCode}&formVersion={formVersion}', [data.formId, data.formCode, data.formVersion]),
width: '80%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -310,7 +310,7 @@
title: '表单设计器',
url: top.restAjax.path('route/form/get-form-source-data?formId={formId}', [data.formId]),
width: '50%',
height: '80%',
height: '90%',
onClose: function () {
}
})
@ -323,6 +323,15 @@
onClose: function () {
}
})
} else if(event === 'reportListEvent') {
top.dialog.open({
title: '预览',
url: top.restAjax.path('route/form-report/save/code/{formCode}/version/{formVersion}', [data.formCode, data.formVersion]),
width: '50%',
height: '80%',
onClose: function () {
}
})
}
})

0
module-form/src/main/java/ink/wgink/module/form/template/page/app/app-form-save.ftl → module-form/src/main/resources/templates/ftl/page/app/app-form-save.ftl
View File

0
module-form/src/main/java/ink/wgink/module/form/template/page/app/app-form-update.ftl → module-form/src/main/resources/templates/ftl/page/app/app-form-update.ftl
View File

76
module-form/src/main/java/ink/wgink/module/form/template/page/web/form-save.ftl → module-form/src/main/resources/templates/ftl/page/web/form-save.ftl
View File

@ -1,28 +1,31 @@
<!DOCTYPE html>
<html>
<head>',
<base href="${contextPath}"/>
<head>
<base href="${r'${contextPath}'}"/>
<meta charset="utf-8">
<title>${formName}</title>
<title>${r'${formName}'}</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
<link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
<link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
<link rel="stylesheet" type="text/css" href="assets/js/vendor/viewer/viewer.min.css">
<link rel="stylesheet" type="text/css" href="static/form/css/form.css">
</head>
<body>
<div class="layui-anim layui-anim-fadein">
<div class="layui-card">
<div class="layui-card-body" style="padding: 15px;">',
<div class="layui-card-body" style="padding: 15px;">
<form class="layui-form layui-form-pane" lay-filter="dataForm">
${formFieldHtml}
<#list fields as field>
${field.html}
</#list>
<div class="layui-form-item layui-layout-admin">
<div class="layui-input-block">
<div class="layui-footer" style="left: 0;">
<button type="button" id="submitFormBtn" class="layui-btn" lay-submit
lay-filter="submitForm">提交
<button type="button" id="submitFormBtn" class="layui-btn" lay-submit lay-filter="submitForm">提交
</button>
<button type="button" class="layui-btn layui-btn-primary close">返回</button>
</div>
@ -31,9 +34,10 @@
</form>
</div>
</div>
<input type="hidden" id="formCode" value="${formCode}">,
<input type="hidden" id="formVersion" value="${formVersion}">,
<input type="hidden" id="formCode" value="${r'${formCode}'}">
<input type="hidden" id="formVersion" value="${r'${formVersion}'}">
</div>
<script src="static/form/js/form-util.js"></script>
<script src="assets/js/vendor/viewer/viewer.min.js"></script>
<script src="assets/layuiadmin/layui/layui.js"></script>
<script>
@ -41,16 +45,13 @@
base: 'assets/layuiadmin/'
}).extend({
index: 'lib/index'
}).use(['index', 'form', 'laydate', 'laytpl', 'upload', 'restajax', 'datamessage', 'dialog', 'formUtil'], function () {
}).use(['index', 'form', 'layer', 'laydate', 'laytpl', 'upload', 'restajax'], function () {
var $ = layui.$;
var form = layui.form;
var laytpl = layui.laytpl;
var layer = layui.layer;
var laydate = layui.laydate;
var upload = layui.upload;
var dialog = layui.dialog;
var restAjax = layui.restajax;
var dataMessage = layui.datamessage;
var formUtil = layui.formUtil;
var formUtil = new FormUtil(layui, Viewer);
// 初始化文件列表',
function initFileList(fileName, ids, callback) {
@ -76,37 +77,56 @@
});
}
${initSaveFunctions}
// 初始化内容
function initData() {
${initSaveScript}
<#list fields as field>
<#if field.tag == 'uploadImage'>
formUtil.initUploadImage('${field.id}', ${field.count});
<#elseif field.tag == 'date'>
formUtil.initDate(laydate, {
id: '${field.id}',
datetype: '${field.datetype}',
dateformat: '${field.dateformat}',
dateDefaultValue: '${field.dateDefaultValue}',
dataMinValue: '${field.dataMinValue}',
dataMaxValue: '${field.dataMaxValue}',
});
</#if>
</#list>
}
initData();
// 关闭页面',
// 关闭页面
$('.close').on('click', function () {
// 这里写返回按钮的逻辑，默认是关闭',
parent.layer.close(parent.layer.getFrameIndex(window.name));
});
// 提交表单',
// 提交表单
form.on('submit(submitForm)', function (formData) {
dialog.confirm('确定提交吗？', function (index) {
dialog.close(index);
layer.confirm('确定提交吗?', function(confirmLayerIndex) {
layer.close(confirmLayerIndex);
<#list fields as field>
<#if field.tag == 'checkbox'>
formUtil.setCheckboxValue(formData, '${field.id}');
<#elseif field.tag == 'switch'>
formUtil.setSwitchValue(formData, '${field.id}');
</#if>
</#list>
var loadLayerIndex;
${submitSaveScript}
restAjax.post(restAjax.path('api/form-report/save/code/{formCode}/version/{formVersion}', [$('#formCode').val(), $('#formVersion').val()]), formData.field, null, function (code, data) {
// 这里手动添加操作成功后的操作',
}, function (code, data) {
$('#submitFormBtn').show();
dialog.msg(data.msg);
layer.msg(data.msg);
}, function () {
$('#submitFormBtn').hide();
loadLayerIndex = dialog.msg(dataMessage.committing, {icon: 16, time: 0, shade: 0.3});
loadLayerIndex = layer.msg('提交中...', {icon: 16, time: 0, shade: 0.3});
}, function () {
dialog.close(loadLayerIndex);
layer.close(loadLayerIndex);
});
});
return false;

0
module-form/src/main/java/ink/wgink/module/form/template/page/web/form-update.ftl → module-form/src/main/resources/templates/ftl/page/web/form-update.ftl
View File