<link rel="stylesheet" href="<?php echo base_url();?>public/js/date/datedropper.min.css">
<!--<link rel="stylesheet" href="--><?php //echo base_url();?><!--public/js/time/timedropper.css">-->
<script src="<?php echo base_url();?>public/js/date/datedropper.min.js"></script>
<!--<script src="--><?php //echo base_url();?><!--public/js/time/timedropper.js"></script>-->
<style>
    .fixed-table-toolbar {
        display: none;
    }

    .fileinput-button {
        position: relative;
        top: -5px;
    }

    .fileinput-button input{
        position:absolute;
        top: 0px;
        opacity: 0;
        -ms-filter: 'alpha(opacity=0)';
    }
</style>
<div class="content_wrapper">
	<div id="msg-tip"></div>
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-12">
                <aside>
                    <header><i class="fa fa-fw fa-file"></i>分享配置</header>
                    <section>
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-sm-12">
                                    <a style="margin:5px;" class="btn btn-primary " href="#config/sharePointListConfig" role="button">翻译配置</a>
                                    <a style="margin:5px;" class="btn btn-primary " href="#config/sharePointListConfig/img" role="button">配图配置</a>
                                </div>
                            </div>
                        </div>
                    </section>
                </aside>
                <aside>
                    <header><i class="fa fa-fw fa-file"></i>语言键与语言关系</header>
                    <section>
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-sm-12">
                                    <?php foreach ($langList as $lang=>$row){ ?>
                                        <span style="margin:5px;"><?php echo $row;?>(<?php echo $lang;?>)</span>
                                    <?php } ?>
                                </div>
                            </div>
                        </div>
                    </section>
                </aside>
                <aside>
                    <header><i class="fa fa-fw fa-file"></i>分享列表配置</header>
                    <section>
                        <div class="container-fluid">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="btn-group" style="margin-bottom:20px;">
                                        <a type="button" class="btn btn-success" href="/Export/shareTranslate" style="margin-left: 10px;border-radius: 5px;">导出</a>
                                            <input type="button" style="display: none;margin-bottom: 10px;width: 80px;margin-left: 10px;border-radius: 5px;" class="btn btn-info" value="上传" id="btn"/>
                                            <span id="filespan" class="btn btn-info fileinput-button" style="margin-top: 5px;margin-left: 10px;border-radius: 5px;">
                                                <span id="filespan2">上传翻译文件</span>
                                                <input type="file" id="upfile">
                                             </span>

                                    </div>

                                    <div class="table-responsive">
                                        <table id="example" class="table table-striped table-bordered table-hover" cellspacing="0" width="100%">
                                            <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>翻译key</th>
                                                <th>内容</th>
<!--                                                <th>操作</th>-->
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <?php foreach($list as $v) { ?>
                                                <tr>
                                                    <td><?php echo $v['id'];?></td>
                                                    <td><?php echo $v['lang_key']; ?></td>
<!--                                                    <td><img src="--><?php //echo ($_SERVER['HTTPS']?"https://":"http://").$_SERVER['HTTP_HOST']."/img/feed/" . $v['img'].".jpg"; ?><!--" height="100px" ></td>-->
                                                    <td>
                                                        <textarea readonly="readonly" class="form-control show" bid="<?php echo $v['id'];?>" lang_key="<?php echo $v['lang_key']; ?>" img="<?php echo $v['img']; ?>" rows="5"><?php echo json_encode($v['content']);?></textarea>
                                                    </td>
<!--                                                    <td>--><?php //echo $v['url'];?><!--</td>-->
<!--                                                    <td><button type="button" class="btn btn-danger" onclick="deleteTask(<?php //echo $v['id'];?>)">删除</button></td>-->
                                                </tr>
                                            <?php } ?>
                                            </tbody>
                                        </table>
                                    </div>
                                    <nav>
                                        <ul class="pagination">
                                            <li class="disabled"><a href="#">共<span class="pagetotal"><?php echo $total;?></span>条</a></li>
                                            <?php echo $pageurl;?>
                                        </ul>
                                    </nav>
                                </div>
                            </div>
                        </div>
                    </section>
                </aside>
            </div>
        </div>
    </div>

</div>

<div class="modal fade" id="actionCode" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">新建分享</h4>
            </div>
            <form id="goodForm" class="form-horizontal" role="form" method="post" action="config/addSharePointListConfig" data-callBack="message" enctype="multipart/form-data">
                <div class="modal-body">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">翻译key</label>
                        <div class="col-sm-9">
                            <input type="text" name="lang_key" class="form-control" />
                        </div>
                    </div>

<!--                    <div class="form-group">-->
<!--                        <label class="col-sm-3 control-label">分享类型:</label>-->
<!--                        <div class="col-sm-9">-->
<!--                            <label class="radio-inline">-->
<!--                                <input type="radio" name="type" value="1" checked="checked">系统分享-->
<!--                            </label>-->
<!--                            <label class="radio-inline">-->
<!--                                <input type="radio" name="type" value="2"> Facebook-->
<!--                            </label>-->
<!--                            <label class="radio-inline">-->
<!--                                <input type="radio" name="type" value="3"> Message-->
<!--                            </label>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="form-group">-->
<!--                        <label class="col-sm-3 control-label">开关:</label>-->
<!--                        <div class="col-sm-9">-->
<!--                            <label class="radio-inline">-->
<!--                                <input type="radio" name="status" value="1" checked="checked">开启-->
<!--                            </label>-->
<!--                            <label class="radio-inline">-->
<!--                                <input type="radio" name="status" value="0"> 关闭-->
<!--                            </label>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="form-group">-->
<!--                        <label class="col-sm-3 control-label">URL:</label>-->
<!--                        <div class="col-sm-9">-->
<!--                            <input type="text" name="url" class="form-control" />-->
<!--                        </div>-->
<!--                    </div>-->
                    <div class="form-group" style="display: none">
                        <label class="col-sm-3 control-label">图片标识:</label>
                        <div class="col-sm-9">
                            <input type="text" name="img" class="form-control" />
                        </div>
                    </div>
<!--                    <div class="form-group">-->
<!--                        <label class="col-sm-3 control-label">分享间隔:</label>-->
<!--                        <div class="col-sm-9">-->
<!--                            <input type="text" name="interval_time" class="form-control" value="0" />-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="form-group" id="uploadImg" style="text-align: center;">-->
<!--                    	<label class="col-sm-3 control-label">图片:</label>-->
<!--		                <img src="--><?php //echo '/images/default_img.png';?><!--" id="preview" class="upimg default-img" style="width: 45%;"  />-->
<!--		                <input type="file" name="file" id="imgfile" class="imgfile hide"/>-->
<!--		                <span class="lang-name"></span>-->
<!--		            </div>-->

                    <div id="langDiv" >
                        <?php foreach ($langList as $k=>$v) { ?>
                            <div class="form-group">
                                <label class="col-sm-3 control-label"><?php echo $v;?></label>
                                <div class="col-sm-9">
                                    <input type="text" name="content[<?php echo $k;?>][title]" class="form-control" value="" />
                                    <textarea  rows="7" cols="50" class="form-control <?php echo $k.'_content';?>" name="content[<?php echo $k;?>][content]"></textarea>
                                </div>
                            </div>
                        <?php }?>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" id="submit">提交</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="actionShow" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">内容</h4>
            </div>
            <form id="goodForm2" class="form-horizontal" role="form" method="post" action="config/addSharePointListConfig" data-callBack="message">
                <div class="modal-body">
                    <div id="langDivShow" >
                        <input type="hidden" class="id" name="id" value="">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">翻译key</label>
                            <div class="col-sm-9">
                                <input type="text" name="lang_key" class="form-control lang_key" />
                            </div>
                        </div>
                        <div class="form-group" style="display: none">
                            <label class="col-sm-3 control-label">图片标识:</label>
                            <div class="col-sm-9">
                                <input type="text" name="img" class="form-control img" />
                            </div>
                        </div>
                        <?php foreach ($langList as $k=>$v) { ?>
                            <div class="form-group">
                                <label class="col-sm-3 control-label"><?php echo $v;?></label>
                                <div class="col-sm-9">
                                    <input type="text" class="form-control <?php echo $k.'_title';?>" name="content[<?php echo $k;?>][title]" value="" />
                                    <textarea  rows="5" cols="50" class="form-control <?php echo $k.'_data';?>" name="content[<?php echo $k;?>][content]"></textarea>
                                </div>
                            </div>
                        <?php }?>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button type="button" class="btn btn-primary" id="submit2">提交</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script src="<?php echo base_url();?>public/js/common.js"></script>
<script type="text/javascript">
    laydate.render({
        elem: '#test-limit2'
        ,min: 0
        ,max: 999
    });
    //限定可选时间
    laydate.render({
        elem: '#test-limit3'
        ,type: 'time'
        // ,min: '09:30:00'
        // ,max: '17:30:00'
        ,btns: ['clear', 'confirm']
    });
    laydate.render({
        elem: '#test-limit4'
        ,min: 0
        ,max: 999
    });
    //限定可选时间
    laydate.render({
        elem: '#test-limit5'
        ,type: 'time'
        // ,min: '09:30:00'
        // ,max: '17:30:00'
        ,btns: ['clear', 'confirm']
    });
    laydate.render({
        elem: '#exchangeDay'
        ,min: 0
        ,max: 999
    });
    //限定可选时间
    laydate.render({
        elem: '#exchangeTime'
        ,type: 'time'
        // ,min: '09:30:00'
        // ,max: '17:30:00'
        ,btns: ['clear', 'confirm']
    });
    
</script>

<script type="text/javascript">
    $("input[name='usertype']").click(function(){
        var usertype = $(this).val(),
            langType = $(".langtype");
        if( usertype == 1 ){//按全服
            $(".uiddiv").addClass('hide');
            $(".devicetype").removeClass('hide');
            $(".accounttype").removeClass('hide');
            $(".alertmsg").removeClass('hide');
            $(".vip").removeClass('hide');
            langType.addClass('hide');
        }else{//按uid
            $(".uiddiv").removeClass('hide');
            $(".devicetype").addClass('hide');
            $(".accounttype").addClass('hide');
            $(".alertmsg").addClass('hide');
            langType.addClass('hide');
            $(".vip").addClass('hide');
        }
    });
    $(document).ready(function() {
        $("#pickdate").dateDropper({
            animate: true,
            format: 'Y-m-d',
            maxYear: '2025',
            minYear: '2019',
            lang:'zh'
        });
    });

    function message(returnData, $from) {
        if(returnData.state!= 'success'){
            alert(returnData.message);
        }
    }

    function deleteTask(id) {
        if(confirm('确定要删除吗')==true){
            $.post('/config/delSharePointListConfig',{
                id:id
            },function (data) {
            	if(data.ret == 0){
            		window.location.reload();
            	}else{
            		msgTip = $('#msg-tip');
                    msgTip.messager().warn('删除失败');
            	}
            },"json");
        }
    }

    //添加更新内容
    $('#langContentPri').change(function () {
        var langContent, contentMatch;
        langContent = $('#langContentPri').val();

        //英文更新
        contentMatch = langContent.match(/<en-US>([\s\S]*?)<\/en-US>/);
        showContent(contentMatch, $('#langDiv .en_title'), $('#langDiv  .en_content'));

        //德語更新
        contentMatch = langContent.match(/<de-DE>([\s\S]*?)<\/de-DE>/);
        showContent(contentMatch, $('#langDiv .de_title'), $('#langDiv  .de_content'));

        //西班牙更新
        contentMatch = langContent.match(/<es-ES>([\s\S]*?)<\/es-ES>/);
        showContent(contentMatch, $('#langDiv .es_title'), $('#langDiv  .es_content'));

        //法語更新
        contentMatch = langContent.match(/<fr-FR>([\s\S]*?)<\/fr-FR>/);
        showContent(contentMatch, $('#langDiv .fr_title'), $('#langDiv  .fr_content'));

        //法語更新
        contentMatch = langContent.match(/<pt-PT>([\s\S]*?)<\/pt-PT>/);
        showContent(contentMatch, $('#langDiv .pt_title'), $('#langDiv  .pt_content'));

        //泰文更新
        contentMatch = langContent.match(/<th>([\s\S]*?)<\/th>/);
        showContent(contentMatch, $('#langDiv .th_title'), $('#langDiv  .th_content'));

        //中文更新
        contentMatch = langContent.match(/<zh-CN>([\s\S]*?)<\/zh-CN>/);
        showContent(contentMatch, $('#langDiv .zh_title'), $('#langDiv  .zh_content'));

        //台湾更新
        contentMatch = langContent.match(/<zh-TW>([\s\S]*?)<\/zh-TW>/);
        showContent(contentMatch, $('#langDiv .tw_title'), $('#langDiv  .tw_content'));

        //印地语更新
        contentMatch = langContent.match(/<hi>([\s\S]*?)<\/hi>/);
        showContent(contentMatch, $('#langDiv .hi_title'), $('#langDiv  .hi_content'));

        //俄语更新
        contentMatch = langContent.match(/<ru>([\s\S]*?)<\/ru>/);
        showContent(contentMatch, $('#langDiv .ru_title'), $('#langDiv  .ru_content'));

    });


    //添加更新内容
    $('#langContentPriExchange').change(function () {
        var langContent, contentMatch;
        langContent = $('#langContentPriExchange').val();

        //英文更新
        contentMatch = langContent.match(/<en-US>([\s\S]*?)<\/en-US>/);
        showContent(contentMatch, $('#langDivExchang .en_title'), $('#langDivExchang  .en_content'));

        //德語更新
        contentMatch = langContent.match(/<de-DE>([\s\S]*?)<\/de-DE>/);
        showContent(contentMatch, $('#langDivExchang .de_title'), $('#langDivExchang  .de_content'));

        //西班牙更新
        contentMatch = langContent.match(/<es-ES>([\s\S]*?)<\/es-ES>/);
        showContent(contentMatch, $('#langDivExchang .es_title'), $('#langDivExchang  .es_content'));

        //法語更新
        contentMatch = langContent.match(/<fr-FR>([\s\S]*?)<\/fr-FR>/);
        showContent(contentMatch, $('#langDivExchang .fr_title'), $('#langDivExchang  .fr_content'));

        //法語更新
        contentMatch = langContent.match(/<pt-PT>([\s\S]*?)<\/pt-PT>/);
        showContent(contentMatch, $('#langDivExchang .pt_title'), $('#langDivExchang  .pt_content'));

        //泰文更新
        contentMatch = langContent.match(/<th>([\s\S]*?)<\/th>/);
        showContent(contentMatch, $('#langDivExchang .th_title'), $('#langDivExchang  .th_content'));

        //中文更新
        contentMatch = langContent.match(/<zh-CN>([\s\S]*?)<\/zh-CN>/);
        showContent(contentMatch, $('#langDivExchang .zh_title'), $('#langDivExchang  .zh_content'));

        //台湾更新
        contentMatch = langContent.match(/<zh-TW>([\s\S]*?)<\/zh-TW>/);
        showContent(contentMatch, $('#langDivExchang .tw_title'), $('#langDivExchang  .tw_content'));

        //印地语更新
        contentMatch = langContent.match(/<hi>([\s\S]*?)<\/hi>/);
        showContent(contentMatch, $('#langDivExchang .hi_title'), $('#langDivExchang  .hi_content'));

        //俄语更新
        contentMatch = langContent.match(/<ru>([\s\S]*?)<\/ru>/);
        showContent(contentMatch, $('#langDivExchang .ru_title'), $('#langDivExchang  .ru_content'));

    });

    //是否为空
    function isEmpty(param) {
        if(param == '' || param == 0 || param == undefined) {
            return true;
        }else {
            return false;
        }
    }

    /**
     * 更加输入内容截取显示标题和内容
     * @param contentMatch
     * @param titleElement
     * @param contentElement
     */
    function showContent(contentMatch, titleElement, contentElement) {
        var head = '', content = '', contentArr = [];
        if(!isEmpty(contentMatch)) {
            content = contentMatch[1];
            contentArr = content.trim().split(/[\n]/);
            if(contentArr.length > 0) {//如果截取的数组不为空，则取第一个为标题，其他的为内容
                head = contentArr[0];
                contentArr.splice(0, 1);
                content = contentArr.join('\n');
            }
        }
        console.log(head);
        titleElement.val(head);
        contentElement.val(content);
    }

    $('.show').click(function () {
        var data = $(this).val();
        var lang_key = $(this).attr("lang_key");
        var img = $(this).attr("img");
        var bid = $(this).attr("bid");
        data = JSON.parse(data);
        for (key in data){
            if(data[key]!=undefined){
                $("#langDivShow ."+key+"_data").val(data[key].desc);
                $("#langDivShow ."+key+"_title").val(data[key].title);
            }else{
                $("#langDivShow ."+key+"_data").val();
                $("#langDivShow ."+key+"_title").val();
            }
        }
        $("#langDivShow .lang_key").val(lang_key);
        $("#langDivShow .img").val(img);
        $("#langDivShow .id").val(bid);
        $('#actionShow').modal('show')
    })
	
	$('#uploadImg').on('click','.upimg',function () {
        obj = $(this);
        obj.siblings(".imgfile").click();
    });

    //预览图片
    $('#uploadImg').on('change','.imgfile', function () {
        const file = document.getElementById('imgfile');
        const fileObj = file.files[0];
        const windowURL = window.URL || window.webkitURL;
        const img = document.getElementById('preview');
        if(file && fileObj) {
            const dataURl = windowURL.createObjectURL(fileObj);
            img.setAttribute('src',dataURl);
        }
    });
    
    $("#submit").click(function(){
        var formData = new FormData(document.getElementById("goodForm"));
        // var file = document.getElementById("imgfile").files[0];
        // if(file == "" || file == undefined){
        //     $('#actionCode').modal('hide');
        //     msgTip = $('#msg-tip');
        //     msgTip.messager().warn('请选择图片');
        //     return false;
        // }
        // formData.append("file",file);
        $.ajax({
            type: "POST",
            url: "config/addSharePointListConfig",
            data: formData,
            async: true,
            processData: false, //
            contentType: false, //
            success: function(data) {
                data = JSON.parse(data);
                if(data.ret == 0){
                    $('#actionCode').modal('hide');
                    msgTip = $('#msg-tip');
                    msgTip.messager().success('上传成功');
                    setTimeout(function () {
                        window.location.reload();
                    },2000)
                }else {
                    msgTip = $('#msg-tip');
                    msgTip.messager().warn('上传失败');
                }
            }
        });
    });

    $("#submit2").click(function(){
        var formData = new FormData(document.getElementById("goodForm2"));
        $.ajax({
            type: "POST",
            url: "config/addSharePointListConfig",
            data: formData,
            async: true,
            processData: false, //
            contentType: false, //
            success: function(data) {
                data = JSON.parse(data);
                // console.log(data)
                if(data.ret == 0){
                    $('#actionCode').modal('hide');
                    msgTip = $('#msg-tip');
                    msgTip.messager().success('上传成功');
                    setTimeout(function () {
                        window.location.reload();
                    },2000)
                }else {
                    msgTip = $('#msg-tip');
                    msgTip.messager().warn('上传失败');
                }
            }
        });
    });
    $("#btn").click(function(){
        var formData = new FormData();
        formData.append("file",document.getElementById("upfile").files[0]);
        $.ajax({
            type: "POST", // 数据提交类型
            url: "Import/shareTranslate", // 发送地址
            data: formData, //发送数据
            async: true, // 是否异步
            processData: false, //processData 默认为false，当设置为true的时候,jquery ajax 提交的时候不会序列化 data，而是直接使用data
            contentType: false, //
            xhr: function() {        //ajax进度条，直接拿过去就可以用
                var xhr = $.ajaxSettings.xhr();
                if (xhr.upload) {
                    xhr.upload.addEventListener("progress", function (e) {
                        var loaded = e.loaded; //已经上传大小情况
                        var tot = e.total; //附件总大小
                        var per = Math.floor(100 * loaded / tot); //已经上传的百分比
                        console.log(per)
                        $('#progress-bar').css('width',per+'%');
                    }, false);
                    return xhr;
                }
            },
            success: function(data) { // 成功回调
                data = JSON.parse(data);
                if(data.ret == 0){
                    msgTip = $('#msg-tip');
                    msgTip.messager().success('上传成功');
                    setTimeout(function () {
                        window.location.reload();
                    },2000)
                }else {
                    alert(data.msg)
                }
            }
        });
    });

    $("#filespan").on("change", "input[type='file']", function() {
        var filePath = $(this).val();
        if (filePath) {
            $('#filespan2').html(filePath);
            $('#btn').val("导入");
            $('#btn').show();
        } else {
            $('#filespan2').html("上传资源文件");
            $('#btn').hide();
        }
    });

</script>
