add json params

dbsyncer-biz/src/main/java/org/dbsyncer/biz/impl/TableGroupServiceImpl.java

@@ -2,11 +2,9 @@ package org.dbsyncer.biz.impl;
 
 import org.dbsyncer.biz.TableGroupService;
 import org.dbsyncer.common.util.JsonUtil;
-import org.dbsyncer.connector.config.Field;
 import org.dbsyncer.connector.config.MetaInfo;
 import org.dbsyncer.connector.config.Table;
 import org.dbsyncer.manager.Manager;
-import org.dbsyncer.parser.model.FieldMapping;
 import org.dbsyncer.parser.model.Mapping;
 import org.dbsyncer.parser.model.TableGroup;
 import org.slf4j.Logger;
@@ -15,7 +13,6 @@ import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 import org.springframework.util.Assert;
 
-import java.util.Arrays;
 import java.util.List;
 import java.util.Map;
 
@@ -67,11 +64,6 @@ public class TableGroupServiceImpl implements TableGroupService {
     public TableGroup getTableGroup(String id) {
         TableGroup tableGroup = manager.getTableGroup(id);
         Assert.notNull(tableGroup, "TableGroup can not be null");
-        // TODO 模拟数据
-        FieldMapping m = new FieldMapping();
-        m.setSource(new Field("ID1", "VARCHAR", 12));
-        m.setTarget(new Field("ID2", "VARCHAR", 12));
-        tableGroup.setFieldMapping(Arrays.asList(m));
         return tableGroup;
     }
 

dbsyncer-web/src/main/resources/static/js/mapping/editMappingFilterAndConvert.js

@@ -1,18 +1,68 @@
 // 绑定表格点击删除事件
-function bindConfigListClick($del){
+function bindConfigListClick($del, $callback){
     $del.unbind("click");
     $del.bind('click', function(){
         // 阻止tr触发click事件
         event.cancelBubble=true;
         $(this).parent().parent().remove();
+        $callback();
     });
+    $callback();
+}
+
+// 初始化过滤条件点击事件
+function initFilter(){
+    bindConfigListClick($(".conditionDelete"), function(){ initFilterParams(); });
+}
+
+// 初始化转换配置点击事件
+function initFieldConvert(){
+    bindConfigListClick($(".convertDelete"), function(){ initFieldConvertParams(); });
+}
+
+// 初始化映射关系参数
+function initFilterParams(){
+    // 生成JSON参数
+    var row = [];
+    var $conditionList = $("#conditionList");
+    $conditionList.find("tr").each(function(k,v){
+        var opr = $(this).find("td:eq(0)").text();
+        var sf = $(this).find("td:eq(1)").text();
+        var filter = $(this).find("td:eq(2)").text();
+        var arg = $(this).find("td:eq(3)").text();
+        row.push({
+           "name": sf,
+           "operator": opr,
+           "filter": filter,
+           "value": arg
+         });
+    });
+    $("#filter").val(JSON.stringify(row));
+}
+
+// 初始化映射关系参数
+function initFieldConvertParams(){
+    // 生成JSON参数
+    var row = [];
+    var $convertList = $("#convertList");
+    $convertList.find("tr").each(function(k,v){
+        var convert = $(this).find("td:eq(0)").attr("value");
+        var tf = $(this).find("td:eq(1)").text();
+        var args = $(this).find("td:eq(2)").text();
+        row.push({
+           "name": tf,
+           "convert": convert,
+           "args": args
+         });
+    });
+    $("#fieldConvert").val(JSON.stringify(row));
 }
 
 // 绑定新增条件点击事件
 function bindConditionAddClick() {
     var $conditionAdd = $("#conditionAdd");
-        $conditionAdd.unbind("click");
-        $conditionAdd.bind('click', function () {
+    $conditionAdd.unbind("click");
+    $conditionAdd.bind('click', function () {
         var conditionOperation = $("#conditionOperation").select2("val");
         var conditionSourceField = $("#conditionSourceField").select2("val");
         var conditionFilter = $("#conditionFilter").select2("val");
@@ -49,15 +99,15 @@ function bindConditionAddClick() {
         $conditionList.append(trHtml);
         // 清空参数
         $("#conditionArg").val("");
-        bindConditionListClick($(".conditionDelete"));
+        initFilter();
     });
 }
 
 // 绑定新增转换点击事件
 function bindConvertAddClick() {
     var $convertAdd = $("#convertAdd");
-        $convertAdd.unbind("click");
-        $convertAdd.bind('click', function () {
+    $convertAdd.unbind("click");
+    $convertAdd.bind('click', function () {
         var $convertOperator = $("#convertOperator");
         var convertOperatorVal = $convertOperator.select2("val");
         var convertOperatorText = $convertOperator.select2("data")[0].text;
@@ -96,16 +146,15 @@ function bindConvertAddClick() {
         $convertList.append(trHtml);
         // 清空参数
         $(".convertArg").val("");
-        bindConfigListClick($(".convertDelete"));
+        initFieldConvert();
     });
 }
 
 $(function() {
     // 过滤条件
-    bindConfigListClick($(".conditionDelete"));
+    initFilter();
     bindConditionAddClick();
-
     // 转换配置
-    bindConfigListClick($(".convertDelete"));
+    initFieldConvert();
     bindConvertAddClick();
 });

dbsyncer-web/src/main/resources/static/js/mapping/editMappingTableGroup.js

@@ -1,3 +1,15 @@
+function submit(data) {
+    //保存驱动配置
+    doPoster("/tableGroup/edit", data, function (data) {
+        if (data.success == true) {
+            bootGrowl("保存驱动成功!", "success");
+            backIndexPage();
+        } else {
+            bootGrowl(data.resultValue, "danger");
+        }
+    });
+}
+
 // 初始化select2插件
 function bindSelectEvent($selector){
     $selector.find(".select-control").select2({
@@ -6,6 +18,19 @@ function bindSelectEvent($selector){
     });
 }
 
+// 初始化映射关系参数
+function initFieldMappingParams(){
+    // 生成JSON参数
+    var row = [];
+    var $fieldMappingList = $("#fieldMappingList");
+    $fieldMappingList.find("tr").each(function(k,v){
+        row.push({
+            "source":$(this).find("td:eq(0)").text(),
+            "target":$(this).find("td:eq(1)").text()
+        });
+    });
+    $("#fieldMapping").val(JSON.stringify(row));
+}
 // 绑定字段映射表格点击事件
 function bindFieldMappingListClick(){
     var $del = $(".fieldMappingDelete");
@@ -14,6 +39,7 @@ function bindFieldMappingListClick(){
         // 阻止tr触发click事件
         event.cancelBubble=true;
         $(this).parent().parent().remove();
+        initFieldMappingParams();
     });
 }
 // 绑定添加字段映射点击事件
@@ -22,6 +48,12 @@ function bindFieldMappingAddClick(){
     $btn.bind('click', function(){
         var sField = $("#sourceFieldMapping").select2("val");
         var tField = $("#targetFieldMapping").select2("val");
+        // 非空检查
+        if(sField == "" && tField == ""){
+            bootGrowl("至少有一个表字段.", "danger");
+            return;
+        }
+
         // 检查重复字段
         var repeated = false;
         var $fieldMappingList = $("#fieldMappingList");
@@ -36,22 +68,34 @@ function bindFieldMappingAddClick(){
         if(repeated){ return; }
         var trHtml = "<tr title='双击设为主键'><td>" + sField + "</td><td>" + tField + "</td><td><a class='fa fa-remove fa-2x fieldMappingDelete dbsyncer_pointer' title='删除' ></a></td></tr>";
         $fieldMappingList.append(trHtml);
+
+        initFieldMappingParams();
         bindFieldMappingListClick();
     });
 }
 
 $(function() {
-
     // 绑定表字段关系点击事件
+    initFieldMappingParams();
     bindFieldMappingListClick();
     bindFieldMappingAddClick();
 
     // 初始化select2插件
-    bindSelectEvent($("#mappingBaseConfig"));
-    bindSelectEvent($("#mappingSuperConfig"));
+    bindSelectEvent($("#tableGroupBaseConfig"));
+    bindSelectEvent($("#tableGroupSuperConfig"));
+
+    //保存
+    $("#tableGroupSubmitBtn").click(function () {
+        var $form = $("#tableGroupModifyForm");
+        if ($form.formValidate() == true) {
+            var data = $form.serializeJson();
+            console.log(data);
+//            submit(data);
+        }
+    });
 
     // 返回按钮，跳转至上个页面
-    $("#mappingTableGroupBackBtn").bind('click', function(){
+    $("#tableGroupBackBtn").bind('click', function(){
         var $mappingId = $(this).attr("mappingId");
         $initContainer.load('/mapping/page/editMapping?id=' + $mappingId);
     });

dbsyncer-web/src/main/resources/templates/mapping/editMapping.html

@@ -90,7 +90,7 @@
 
             <!-- 高级配置区域 -->
             <div class="row">
-                <div class="panel-group mappingConfigPanel">
+                <div class="panel-group">
                     <div class="panel panel-default">
                         <div class="panel-heading">
                             <h4 class="panel-title">

dbsyncer-web/src/main/resources/templates/mapping/editMappingConvert.html

@@ -26,10 +26,10 @@
             <div class="col-md-4">
                 <label class="col-sm-2 control-label text-right">参数</label>
                 <div class="col-sm-5">
-                    <input class="form-control convertArg" type="text" maxlength="50" dbsyncer-valid="require" placeholder="参数" />
+                    <input class="form-control convertArg" type="text" maxlength="50" placeholder="参数" />
                 </div>
                 <div class="col-sm-5">
-                    <input class="form-control convertArg" type="text" maxlength="50" dbsyncer-valid="require" placeholder="参数" />
+                    <input class="form-control convertArg" type="text" maxlength="50" placeholder="参数" />
                 </div>
             </div>
         </div>
@@ -72,5 +72,10 @@
         </div>
     </div>
 
+    <!-- 隐藏表单值 -->
+    <div class="form-group hidden">
+        <input id="fieldConvert" name="fieldConvert" class="form-control" type="text"/>
+    </div>
+
 </div>
 </html>

dbsyncer-web/src/main/resources/templates/mapping/editMappingFilter.html

@@ -66,18 +66,23 @@
                     </tr>
                     </thead>
                     <tbody id="conditionList">
-                    <tr>
-                        <td>and</td>
-                        <td>NAME</td>
-                        <td>=</td>
-                        <td>张三</td>
-                        <td><a class='fa fa-remove fa-2x conditionDelete dbsyncer_pointer' title='删除' ></a></td>
-                    </tr>
+                        <tr th:each="f,s:${tableGroup?.filter}">
+                            <td>[[${f?.operator}]]</td>
+                            <td>[[${f?.name}]]</td>
+                            <td>[[${f?.filter}]]</td>
+                            <td>[[${f?.value}]]</td>
+                            <td><a class='fa fa-remove fa-2x conditionDelete dbsyncer_pointer' title='删除' ></a></td>
+                        </tr>
                     </tbody>
                 </table>
             </div>
         </div>
     </div>
 
+    <!-- 隐藏表单值 -->
+    <div class="form-group hidden">
+        <input id="filter" name="filter" class="form-control" type="text"/>
+    </div>
+
 </div>
 </html>

dbsyncer-web/src/main/resources/templates/mapping/editMappingPlugin.html

@@ -10,7 +10,7 @@
             <div class="col-md-4">
                 <label class="col-sm-3 control-label text-right">名称</label>
                 <div class="col-sm-9">
-                    <select id="sourceStrategyConvertRule" class="form-control select-control">
+                    <select id="sourceStrategyConvertRule" name="plugin" class="form-control select-control">
                         <option value="">无</option>
                         <option th:value="${p?.className}" th:text="${p?.name}" th:each="p,state : ${plugin}">
                     </select>

dbsyncer-web/src/main/resources/templates/mapping/editMappingTableGroup.html

@@ -4,7 +4,7 @@
 
 <div class="container-fluid">
     <div class="container">
-        <form class="form-horizontal" role="form" method="post">
+        <form id="tableGroupModifyForm" class="form-horizontal" role="form" method="post">
             <!-- 标题 -->
             <div class="row text-center">
                 <h3>[[${mapping?.name}]]</h3>
@@ -55,10 +55,10 @@
                 <div class="row">
                     <div class="col-sm-10"></div>
                     <div class="col-md-2 text-right">
-                        <button id="mappingSubmitBtn" type="button" class="btn btn-primary">
+                        <button id="tableGroupSubmitBtn" type="button" class="btn btn-primary">
                             <span class="fa fa-save"></span>保存
                         </button>
-                        <button id="mappingTableGroupBackBtn" th:mappingId="${mapping?.id}" type="button" class="btn btn-default">
+                        <button id="tableGroupBackBtn" th:mappingId="${mapping?.id}" type="button" class="btn btn-default">
                             <span class="fa fa-reply"></span>返回
                         </button>
                     </div>
@@ -71,10 +71,10 @@
                     <div class="panel panel-success">
                         <div class="panel-heading">
                             <h4 class="panel-title">
-                                <u data-toggle="collapse" class="dbsyncer_pointer" href="#mappingBaseConfig">基本配置</u>
+                                <u data-toggle="collapse" class="dbsyncer_pointer" href="#tableGroupBaseConfig">基本配置</u>
                             </h4>
                         </div>
-                        <div id="mappingBaseConfig" class="panel-body panel-collapse collapse in">
+                        <div id="tableGroupBaseConfig" class="panel-body panel-collapse collapse in">
                             <!-- 表映射映射 -->
                             <p class="text-muted">映射关系</p>
 
@@ -84,6 +84,7 @@
                                     <label class="col-sm-3 control-label text-right">数据源表字段</label>
                                     <div class="col-sm-9">
                                         <select id="sourceFieldMapping" class="form-control select-control">
+                                            <option value="">无</option>
                                             <option th:each="c,s:${tableGroup?.sourceTable?.column}" th:value="${c?.name}" th:text="${c?.name} +' (' + ${c?.typeName} +')'" />
                                         </select>
                                     </div>
@@ -98,6 +99,7 @@
                                         <label class="col-sm-3 control-label text-right">目标源表字段</label>
                                         <div class="col-sm-9">
                                             <select id="targetFieldMapping" class="form-control select-control">
+                                                <option value="">无</option>
                                                 <option th:each="c,s:${tableGroup?.targetTable?.column}" th:value="${c?.name}" th:text="${c?.name} +' (' + ${c?.typeName} +')'" />
                                             </select>
                                         </div>
@@ -134,6 +136,12 @@
                                     </tbody>
                                 </table>
                             </div>
+
+                            <!-- 隐藏表单值 -->
+                            <div class="form-group hidden">
+                                <input name="id" class="form-control" type="text" th:value="${tableGroup?.id}"/>
+                                <input id="fieldMapping" name="fieldMapping" class="form-control" type="text"/>
+                            </div>
                         </div>
 
                     </div>
@@ -142,24 +150,14 @@
 
             <!-- 高级配置区域 -->
             <div class="row">
-                <div class="panel-group mappingConfigPanel">
+                <div class="panel-group">
                     <div class="panel panel-default">
                         <div class="panel-heading">
                             <h4 class="panel-title">
-                                <u data-toggle="collapse" class="dbsyncer_pointer" href="#mappingSuperConfig" title="该配置只对当前映射关系生效, 上一级的高级配置将失效">高级配置</u>
+                                <u data-toggle="collapse" class="dbsyncer_pointer" href="#tableGroupSuperConfig" title="该配置只对当前映射关系生效, 上一级的高级配置将失效">高级配置</u>
                             </h4>
                         </div>
-                        <div id="mappingSuperConfig" class="panel-body panel-collapse collapse">
-                            <!-- 全量配置 -->
-                            <div th:id="mappingFullConfig" class="hidden">
-                                <div th:replace="mapping/editMappingFull :: content"></div>
-                            </div>
-
-                            <!-- 增量配置 -->
-                            <div th:id="mappingIncrementConfig" class="hidden">
-                                <div th:replace="mapping/editMappingIncrement :: content"></div>
-                            </div>
-
+                        <div id="tableGroupSuperConfig" class="panel-body panel-collapse collapse">
                             <!-- 过滤条件 -->
                             <div th:replace="mapping/editMappingFilter :: content"></div>