westdc-zf1/application/admin/views/scripts/data/dataimport-target.phtml

<?php
$this->headTitle($this->config->title->site);
$this->headTitle('后台管理');
$this->headTitle()->setSeparator(' - ');
?>
<div class="row-fluid">
    <div class="span2">
    	<?= $this->partial('data/left.phtml'); ?>
    </div>
    
    <div class="span10">
    	<h3>数据导入<small>选择导入目标</small></h3>
        <hr />

        导入文件：<?= $this->file ?>

        <div class="row-fluid">
            <div class="span3">
                <h5>选择数据库</h5>
                <?php foreach($this->schema as $v){ ?>
                    <label class="radio">
                        <input type="radio" class="ctl-schema-btn" value="<?= $v ?>" name="schema"> <?= $v ?>
                    </label>
                <?php } ?>
            </div>
            <div class="span3" id="table-list">
            </div>
            <div class="span4" id="field-list">
            </div>
        </div>
        <hr class="clear" />

        <h5 class="error-alerts" style="display: none;">消息</h5>
        <ul id="errors" class="error-alerts" style="display: none;">

        </ul>

        <h6 id="error-loading"></h6>

        <form action="/admin/data/dataimport/ac/checktables" id="schema-form">
            <input type="hidden" name="file" value="<?= $this->file ?>">
            <input type="hidden" name="schema" value="">
            <input type="hidden" name="table" value="" id="input-table">
            <button type="button" id="ctl-next" class="btn btn-success disabled" disabled>下一步</button>
            <button type="button" id="ctl-import" class="btn btn-info" disabled="disabled" style="display: none;">导入数据表</button>
        </form>
    </div>
</div>
<script>
    $(document).ready(function(){

        $('#ctl-next').click(function(){
            ctl.checkTable();
        });

        $("#ctl-import").click(function(){
            $.ajax({
                'type':"POST",
                'url':'/admin/data/dataimport/ac/import',
                'data':$('#schema-form').serialize(),
                'success':function(data){

                    if (data!=true)
                    {
                        if(!$.isEmptyObject(data))
                            $(".error-alerts").show();
                        $("#errors").html(data.join("<br />"));
                        return true;
                    }else{
                        $('#ctl-import').remove();
                        $("#errors").html("数据导入成功！页面将自动跳转到数据可视化管理页面");
                        setTimeout("top.location = '/admin/data/visual';",3000);
                    }
                },
                'timeout': 30000,
                'beforeSend' : function(){
                    $('#error-loading').html("正在进行数据导入......");
                    $('#error-loading').show();
                    $('#ctl-import').attr('disabled','disabled');
                },
                'complete' : function(){
                    $('#error-loading').hide();
                },
                'error' : function(){
                    $('#ctl-import').removeAttr('disabled');
                }

            });
        });

        $('.ctl-schema-btn').click(function(){
            $('#schema-form input[name=schema]').val($(this).val());

            $.ajax({
                'type':"POST",
                'url':'/admin/data/dataimport/ac/gettables',
                'data':'schema=' + $(this).val(),
                'success':function(data){
                    if (data!=null)
                    {
                        if($.isEmptyObject(data))
                        {
                            ctl.disableNext();
                            alert("此数据库中尚无数据表");
                            return true;
                        }
                        $('#table-list').html('<h5>选择数据表</h5>');

                        $.each(data,function(index,value){
                            $('#table-list').append('<label class="radio">'
                                + '<input type="radio" value="'+value.tablename+'" name="table" class="ctl-table-name">'
                                + value.tablename
                                +"</label>"
                            );
                        });

                        $('.ctl-table-name').click(function(){
                            $('#schema-form input[name=table]').val($(this).val());
                            if($('#schema-form input[name=schema]').val() != '' &&  $('#schema-form input[name=table]').val() != '')
                            {
                                ctl.enableNext();
                            }
                            ctl.getFields();
                        });

                        $('#clt-next').removeClass('disabled');
                        $('#clt-next').attr('href','/admin/data/dataimport/ac/target?file=<?= $this->file ?>');
                        return true;

                    }else{
                        alert('处理中出现错误');
                    }
                },
                'timeout': 30000,
                'beforeSend' : function(){
                    $('#error-loading').html("正在加载数据表......");
                    $('#error-loading').show();
                    $('#table-list').html('');
                    $('.ctl-table-name').unbind();
                },
                'complete' : function(){
                    $('#error-loading').hide();
                }

            });

        });
    });

    var ctl = {
        enableNext : function(){
            $('#ctl-next').removeClass("disabled");
            $('#ctl-next').removeAttr("disabled");
        },
        disableNext : function(){
            $('#ctl-next').addClass("disabled");
            $('#ctl-next').attr("disabled","disabled");
        },
        checkTable : function(){
            $.ajax({
                'type':"POST",
                'url':'/admin/data/dataimport/ac/checktables',
                'data':$('#schema-form').serialize(),
                'success':function(data){

                    if (data!=true)
                    {
                        if(!$.isEmptyObject(data))
                        $(".error-alerts").show();
                        $("#errors").html(data.join("<br />"));
                        return true;
                    }else{
                        $(".error-alerts").show();
                        $('#errors').html('数据准备完成，可以进行导入操作');

                        $('.ctl-schema-btn').attr("disabled","disabled");
                        $('.ctl-table-name').attr("disabled","disabled");

                        $('#ctl-next').hide();
                        $('#ctl-show-table').hide();
                        $('#ctl-import').show();
                        $('#ctl-import').removeAttr("disabled");
                    }
                },
                'timeout': 30000,
                'beforeSend' : function(){
                    $('#error-loading').html("正在校验数据是否可以导入......");
                    $('#error-loading').show();
                },
                'complete' : function(){
                    $('#error-loading').hide();
                },
                'error' : function(){
                    $(".error-alerts").show();
                    $("#errors").html("数据表字段检测失败，请检查导入得文件是否于数据表中得字段对应");
                }
            });
        },
        getFields : function (){
            $.ajax({
                'type':"POST",
                'url':'/admin/data/dataimport/ac/getfields',
                'data':$('#schema-form').serialize(),
                'success':function(data){

                    if($.isEmptyObject(data))
                    {
                        return true;
                    }

                    $(".error-alerts").show();

                    var html = new Array();

                    html.push('<span>数据表字段信息</span>');
                    html.push('<table class="table table-striped table-bordered" style="width:300px;">');
                    html.push('<thead><th>排序</th><th>列名</th><th>数据类型</th></thead>');

                    $.each(data,function(index,value){
                        html.push("<tr><td>"+value.dtd_identifier+"</td><td>" + value.column_name + "</td><td>" + value.data_type + "</td></tr>");
                    });

                    html.push('</table>');

                    $('#errors').html(html.join(""));

                },
                'timeout': 30000,
                'beforeSend' : function(){
                    $('#error-loading').html("正在获取数据表信息......");
                    $('#error-loading').show();
                },
                'complete' : function(){
                    $('#error-loading').hide();
                }

            });
        }
    }
</script>