root
/
DbSyncer
镜像来自 https://gitee.com/ghi/dbsyncer.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
							<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" lang="zh-CN">

<div class="container-fluid">
    <div class="container">
        <form id="tableGroupModifyForm" class="form-horizontal" role="form" method="post">
            <!-- 标题 -->
            <div class="row text-center">
                <h3>[[${mapping?.name}]]</h3>
                <p>&nbsp;</p>
            </div>

            <!-- 驱动信息面板 -->
            <div class="row">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-4">
                                <div class="row">
                                    <div class="col-md-4 text-right">
                                        <img draggable="false" class="dbsyncer_img" th:src="@{'/img/'+ ${mapping?.sourceConnector?.config?.connectorType} + '.png'}">
                                    </div>
                                    <div class="col-md-8">
                                        <p class="driver_break_word">[[${mapping?.sourceConnector?.name}]]</p>
                                        <p>数据源表：[[${tableGroup?.sourceTable?.name}]]</p>
                                    </div>
                                </div>
                            </div>

                            <div class="col-md-4 text-center">
                                <div class="row-fluid">
                                    <div class="span4"><span class="fa fa-arrow-right fa-3x"></span></div>
                                </div>
                            </div>

                            <div class="col-md-4">
                                <div class="row">
                                    <div class="col-md-4 text-right">
                                        <img draggable="false" class="dbsyncer_img" th:src="@{'/img/'+ ${mapping?.targetConnector?.config?.connectorType} + '.png'}">
                                    </div>
                                    <div class="col-md-8">
                                        <p class="driver_break_word">[[${mapping?.targetConnector?.name}]]</p>
                                        <p>目标源表：[[${tableGroup?.targetTable?.name}]]</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 驱动配置操作 -->
            <div class="form-group">
                <div class="row">
                    <div class="col-sm-10"></div>
                    <div class="col-md-2 text-right">
                        <button id="tableGroupBackBtn" th:mappingId="${mapping?.id}" type="button" class="btn btn-default">
                            <span class="fa fa-reply"></span>返回
                        </button>
                        <button id="tableGroupSubmitBtn" th:mappingId="${mapping?.id}" type="button" class="btn btn-primary">
                            <span class="fa fa-save"></span>保存
                        </button>
                    </div>
                </div>
            </div>

            <!-- 基本配置区域 -->
            <div class="row">
                <div class="panel-group">
                    <div class="panel panel-success">
                        <div class="panel-heading">
                            <h4 class="panel-title">
                                <u data-toggle="collapse" class="dbsyncer_pointer" href="#tableGroupBaseConfig">基本配置</u>
                            </h4>
                        </div>
                        <div id="tableGroupBaseConfig" class="panel-body panel-collapse collapse in">
                            <!-- 表映射映射 -->
                            <p class="text-muted">映射关系</p>

                            <div class="row">
                                <!-- 数据源表字段配置 -->
                                <div class="col-md-5">
                                    <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>
                                </div>
                                <!-- 中间图标 -->
                                <div class="col-md-2 text-center">
                                    <span class="fa fa-angle-double-right fa-2x"></span>
                                </div>
                                <!-- 目标源表字段配置 -->
                                <div class="col-md-5">
                                    <div class="form-group">
                                        <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>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="row">
                                    <div class="col-md-10"></div>
                                    <div class="col-md-2 text-right">
                                        <button id="fieldMappingDelBtn" type="button" class="btn btn-default" disabled="disabled">
                                            <span class="fa fa-remove"></span>删除
                                        </button>
                                        <button id="fieldMappingAddBtn" type="button" class="btn btn-primary">
                                            <span class="fa fa-plus"></span>添加
                                        </button>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <table class="table table-hover">
                                    <thead>
                                    <tr>
                                        <th>数据源表字段</th>
                                        <th>目标源表字段</th>
                                        <th>目标源主键</th>
                                        <th><input type="checkbox" class="fieldMappingDeleteCheckboxAll" /></th>
                                    </tr>
                                    </thead>
                                    <tbody id="fieldMappingList">
                                        <tr title='双击设置/取消主键' th:each="f,s:${tableGroup?.fieldMapping}">
                                            <td>[[${f?.source?.name}]]</td>
                                            <td>[[${f?.target?.name}]]</td>
                                            <td><i th:if="${f?.target?.pk}" title="主键" class="fa fa-key fa-fw fa-rotate-90 text-warning"></i></td>
                                            <td><input th:id="'fieldIndex_'+${s.index + 1}" type="checkbox" class="fieldMappingDeleteCheckbox" /></td>
                                        </tr>
                                    </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>
                </div>
            </div>

            <!-- 高级配置区域 -->
            <div class="row">
                <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="#tableGroupSuperConfig" title="该配置只对当前映射关系生效, 上一级的高级配置将失效">高级配置</u>
                            </h4>
                        </div>
                        <div id="tableGroupSuperConfig" class="panel-body panel-collapse collapse">
                            <!-- 参数配置 -->
                            <div th:replace="mapping/editParameter :: content"></div>

                            <!-- 过滤条件 -->
                            <div th:replace="mapping/editFilter :: content"></div>

                            <!-- 转换配置 -->
                            <div th:replace="mapping/editConvert :: content"></div>

                            <!-- 插件配置 -->
                            <div th:replace="mapping/editPlugin :: content"></div>
                        </div>
                    </div>
                </div>

            </div>
        </form>
    </div>
</div>

<script th:src="@{/js/mapping/editTableGroup.js}"></script>
<script th:src="@{/js/mapping/editParam.js}"></script>
<script th:src="@{/js/mapping/editFilterAndConvert.js}"></script>
</html>