Skip to content

F
fill-system
Commit af54ee65 authored by 赵啸非's avatar 赵啸非
Browse files
Options

动态表单添加组件

parent 8bb201c2
Pipeline #2881 canceled with stages
      Show whitespace changes
      Inline Side-by-side
      Showing with 209 additions and 9 deletions
      fill-manager/src/main/java/com/mortals/xhx/common/formdesign/ColumnsItem.java
      View file @ af54ee65
      ...@@ -11,6 +11,34 @@ public class ColumnsItem { ...@@ -11,6 +11,34 @@ public class ColumnsItem {
      @JSONField(name = "labelWidth") @JSONField(name = "labelWidth")
      private Integer labelWidth; private Integer labelWidth;
      @JSONField(name="china-area-data")
      private String chinaAreaData;
      @JSONField(name="props")
      private Props props;
      @JSONField(name="name")
      private String name;
      @JSONField(name="show-file-list")
      private Boolean showFileList;
      @JSONField(name="list-type")
      private String listType;
      @JSONField(name="tips")
      private String tips;
      @JSONField(name="buttonText")
      private String buttonText;
      @JSONField(name="showTip")
      private Boolean showTip;
      @JSONField(name="fileSize")
      private Integer fileSize;
      @JSONField(name = "rules") @JSONField(name = "rules")
      private List<RulesItem> rules; private List<RulesItem> rules;
      ...@@ -35,6 +63,10 @@ public class ColumnsItem { ...@@ -35,6 +63,10 @@ public class ColumnsItem {
      @JSONField(name = "action") @JSONField(name = "action")
      private String action; private String action;
      @JSONField(name="accept")
      private String accept;
      @JSONField(name = "disabled") @JSONField(name = "disabled")
      private Boolean disabled; private Boolean disabled;
      ......
      fill-manager/src/main/java/com/mortals/xhx/common/formdesign/TableColItem.java
      View file @ af54ee65
      ...@@ -19,4 +19,6 @@ public class TableColItem { ...@@ -19,4 +19,6 @@ public class TableColItem {
      * 列类型 * 列类型
      */ */
      private String colType; private String colType;
      private String uploadFileUrl;
      } }
      fill-manager/src/main/java/com/mortals/xhx/common/formdesign/component/DesignDynamicTableComponent.java
      View file @ af54ee65
      ...@@ -50,10 +50,10 @@ public class DesignDynamicTableComponent extends DesignComponent { ...@@ -50,10 +50,10 @@ public class DesignDynamicTableComponent extends DesignComponent {
      //动态生成列元素 //动态生成列元素
      List<ColumnsItem> columnsItemList = cons.getColList().stream().map(item -> { List<ColumnsItem> columnsItemList = cons.getColList().stream().map(item -> {
      ColumnsItem columnsItem = new ColumnsItem(); ColumnsItem columnsItem = new ColumnsItem();
      if (item.getColType().equals(ComponentEnum.INPUT.getValue())) {
      //创建输入框出初始值
      columnsItem.setId(item.getVal()); columnsItem.setId(item.getVal());
      columnsItem.set_id(item.getVal()); columnsItem.set_id(item.getVal());
      if (item.getColType().equals(ComponentEnum.INPUT.getValue())) {
      //创建输入框出初始值
      columnsItem.setCompType("input"); columnsItem.setCompType("input");
      columnsItem.setCompName("单行文本"); columnsItem.setCompName("单行文本");
      columnsItem.setCompIcon("input"); columnsItem.setCompIcon("input");
      ...@@ -82,8 +82,6 @@ public class DesignDynamicTableComponent extends DesignComponent { ...@@ -82,8 +82,6 @@ public class DesignDynamicTableComponent extends DesignComponent {
      columnsItem.setPrepend(""); columnsItem.setPrepend("");
      columnsItem.setLayout("colItem"); columnsItem.setLayout("colItem");
      }else if(item.getColType().equals(ComponentEnum.TEXTAREA.getValue())){ }else if(item.getColType().equals(ComponentEnum.TEXTAREA.getValue())){
      columnsItem.setId(item.getVal());
      columnsItem.set_id(item.getVal());
      columnsItem.setCompType("textarea"); columnsItem.setCompType("textarea");
      columnsItem.setEle("el-input"); columnsItem.setEle("el-input");
      columnsItem.setCompName("多行文本"); columnsItem.setCompName("多行文本");
      ...@@ -109,10 +107,181 @@ public class DesignDynamicTableComponent extends DesignComponent { ...@@ -109,10 +107,181 @@ public class DesignDynamicTableComponent extends DesignComponent {
      columnsItem.setRules(Lists.newArrayList()); columnsItem.setRules(Lists.newArrayList());
      columnsItem.setRuleError("该字段不能为空"); columnsItem.setRuleError("该字段不能为空");
      columnsItem.setRulesType("default"); columnsItem.setRulesType("default");
      }else if(item.getColType().equals(ComponentEnum.SELECT.getValue())){
      columnsItem.setCompType("select");
      columnsItem.setCompName(item.getLabel());
      columnsItem.setCompIcon("select");
      columnsItem.setEle("el-select");
      columnsItem.setViewType("component");
      columnsItem.setConfig(true);
      columnsItem.setShowLabel(true);
      columnsItem.setLabel(item.getLabel());
      columnsItem.setLabelWidth(120);
      columnsItem.setPlaceholder("请输入"+item.getLabel());
      columnsItem.setMaxLength(50);
      columnsItem.setRequired(false);
      columnsItem.setMultiple(false);
      columnsItem.setCollapseTags(false);
      columnsItem.setDisabled(false);
      columnsItem.setGutter(15);
      columnsItem.setSpan(12);
      columnsItem.setDataType("static");
      columnsItem.setClearable(false);
      columnsItem.setRules(Lists.newArrayList());
      columnsItem.setLayout("colItem"); columnsItem.setLayout("colItem");
      }else if(item.getColType().equals(ComponentEnum.DATE.getValue())){ columnsItem.setRuleError("该字段不能为空");
      columnsItem.setRulesType("default");
      }else if(item.getColType().equals(ComponentEnum.RADIO.getValue())){
      columnsItem.setCompType("radio");
      columnsItem.setCompName(item.getLabel());
      columnsItem.setCompIcon("radio");
      columnsItem.setEle("el-radio-group");
      columnsItem.setViewType("component");
      columnsItem.setConfig(true);
      columnsItem.setShowLabel(true);
      columnsItem.setLabel(item.getLabel());
      columnsItem.setLabelWidth(120);
      columnsItem.setPlaceholder("请输入"+item.getLabel());
      columnsItem.setMaxLength(50);
      columnsItem.setRequired(false);
      columnsItem.setDisabled(false);
      columnsItem.setBorder(false);
      columnsItem.setSize("medium");
      columnsItem.setGutter(15);
      columnsItem.setSpan(12);
      columnsItem.setOptionType("default");
      columnsItem.setDataType("static");
      columnsItem.setClearable(false);
      columnsItem.setRules(Lists.newArrayList());
      columnsItem.setLayout("colItem");
      columnsItem.setRuleError("该字段不能为空");
      }else if(item.getColType().equals(ComponentEnum.CHECKBOX.getValue())){
      columnsItem.setCompType("checkbox");
      columnsItem.setCompName(item.getLabel());
      columnsItem.setCompIcon("checkbox");
      columnsItem.setEle("el-checkbox-group");
      columnsItem.setViewType("component");
      columnsItem.setConfig(true);
      columnsItem.setShowLabel(true);
      columnsItem.setLabel(item.getLabel());
      columnsItem.setLabelWidth(120);
      columnsItem.setPlaceholder("请输入"+item.getLabel());
      columnsItem.setMaxLength(50);
      columnsItem.setRequired(false);
      columnsItem.setMultiple(false);
      columnsItem.setCollapseTags(false);
      columnsItem.setDisabled(false);
      columnsItem.setBorder(false);
      columnsItem.setSize("medium");
      columnsItem.setGutter(15);
      columnsItem.setSpan(12);
      columnsItem.setOptionType("default");
      columnsItem.setDataType("static");
      columnsItem.setAction("https://www.fastmock.site/mock/51715c0157535b99010bde55f2df33c8/formDesigner/api/options");
      columnsItem.setClearable(false);
      columnsItem.setValue("");
      columnsItem.setRules(Lists.newArrayList());
      columnsItem.setLayout("colItem");
      columnsItem.setRuleError("该字段不能为空");
      columnsItem.setRulesType("default");
      }else if(item.getColType().equals(ComponentEnum.IMAGE.getValue())){
      columnsItem.setCompType("upload");
      columnsItem.setCompName("附件");
      columnsItem.setCompIcon("att");
      columnsItem.setEle("el-upload");
      columnsItem.setViewType("component");
      columnsItem.setConfig(true);
      columnsItem.setShowLabel(true);
      columnsItem.setLabel(item.getLabel());
      columnsItem.setLabelWidth(120);
      columnsItem.setMultiple(false);
      columnsItem.setRequired(false);
      columnsItem.setAction(item.getUploadFileUrl());
      columnsItem.setName("file");
      columnsItem.setShowFileList(true);
      columnsItem.setListType("picture-card");
      columnsItem.setShowTip(false);
      columnsItem.setTips("点击按钮上传附件");
      columnsItem.setAccept("jpg,png,jpeg,bmp");
      columnsItem.setFileSize(10);
      }else if(item.getColType().equals(ComponentEnum.BUTTON.getValue())){
      columnsItem.setCompType("button");
      columnsItem.setCompName(item.getLabel());
      columnsItem.setCompIcon("button");
      columnsItem.setEle("el-button");
      columnsItem.setViewType("component");
      columnsItem.setConfig(true);
      columnsItem.setShowLabel(true);
      columnsItem.setLabel(item.getLabel());
      columnsItem.setLabelWidth(120);
      columnsItem.setType("primary");
      columnsItem.setText("按钮");
      columnsItem.setPlain(true);
      columnsItem.setRound(false);
      columnsItem.setCircle(false);
      columnsItem.setLoading(false);
      columnsItem.setLayout("colItem");
      }else if(item.getColType().equals(ComponentEnum.CASCADE.getValue())){
      columnsItem.setId(item.getVal()); columnsItem.setId(item.getVal());
      columnsItem.set_id(item.getVal()); columnsItem.set_id(item.getVal());
      columnsItem.setCompType("cascader");
      columnsItem.setEle("el-cascader");
      columnsItem.setCompName("级联选择");
      columnsItem.setCompIcon("cascader");
      columnsItem.setViewType("component");
      columnsItem.setConfig(true);
      columnsItem.setShowLabel(true);
      columnsItem.setLabel(item.getLabel());
      columnsItem.setLabelWidth(120);
      columnsItem.setPlaceholder("请选择" + item.getLabel());
      columnsItem.setRequired(false);
      columnsItem.setGutter(15);
      columnsItem.setSpan(24);
      columnsItem.setSize("medium");
      columnsItem.setDisabled(false);
      columnsItem.setDataType("static");
      columnsItem.setChinaAreaData("");
      columnsItem.setAction("");
      //Props 设置
      Props props = new Props();
      props.setClearable(false);
      props.setSeparator("-");
      props.setShowAllLevels(true);
      props.setFilterable(false);
      Props propsChild = new Props();
      propsChild.setExpandTrigger("click");
      propsChild.setMultiple(false);
      propsChild.setCheckStrictly(false);
      propsChild.setLabel("label");
      propsChild.setValue("value");
      propsChild.setChildren("children");
      props.setProps(propsChild);
      columnsItem.setProps(props);
      //设置options
      List<OptionsItem> options = new ArrayList<>();
      OptionsItem optionsItem = new OptionsItem();
      optionsItem.setValue("zhinan");
      optionsItem.setLabel("指南");
      List<ChildrenItem> children = new ArrayList<>();
      ChildrenItem child = new ChildrenItem();
      child.setValue("shejiyuanze");
      child.setLabel("设计原则");
      children.add(child);
      optionsItem.setChildren(children);
      List<ChildrenItem> children1 = new ArrayList<>();
      ChildrenItem child1 = new ChildrenItem();
      child1.setValue("yizhi");
      child1.setLabel("一致");
      children1.add(child1);
      child.setChildren(children1);
      columnsItem.setOptions(options);
      }else if(item.getColType().equals(ComponentEnum.DATE.getValue())){
      columnsItem.setCompType("date"); columnsItem.setCompType("date");
      columnsItem.setEle("el-date-picker"); columnsItem.setEle("el-date-picker");
      columnsItem.setCompName("日期"); columnsItem.setCompName("日期");
      ...@@ -133,16 +302,13 @@ public class DesignDynamicTableComponent extends DesignComponent { ...@@ -133,16 +302,13 @@ public class DesignDynamicTableComponent extends DesignComponent {
      columnsItem.setDisabled(false); columnsItem.setDisabled(false);
      columnsItem.setReadonly(false); columnsItem.setReadonly(false);
      columnsItem.setRules(new ArrayList<>()); columnsItem.setRules(new ArrayList<>());
      // columnsItem.setRangeSeparator("-");
      // columnsItem.setFormat("yyyy-MM-dd");
      // columnsItem.setValueFormat("yyyy-MM-dd");
      columnsItem.setRangeSeparator(" "); columnsItem.setRangeSeparator(" ");
      columnsItem.setFormat("yyyy 年 MM 月 dd 日"); columnsItem.setFormat("yyyy 年 MM 月 dd 日");
      columnsItem.setValueFormat("yyyy 年 MM 月 dd 日"); columnsItem.setValueFormat("yyyy 年 MM 月 dd 日");
      columnsItem.setStartPlaceholder("开始日期"); columnsItem.setStartPlaceholder("开始日期");
      columnsItem.setEndPlaceholder("结束日期"); columnsItem.setEndPlaceholder("结束日期");
      columnsItem.setLayout("colItem");
      } }
      columnsItem.setLayout("colItem");
      return columnsItem; return columnsItem;
      }).collect(Collectors.toList()); }).collect(Collectors.toList());
      listItem.setColumns(columnsItemList); listItem.setColumns(columnsItemList);
      ......
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment